@php
  use Illuminate\Support\Str;
  $accent = $attivita->colore ?: '#f58220';
  $logoUrl = $attivita->logoDisplayUrl();
  $hasCustomCover = $attivita->hasCustomCover();
  $coverUrl = $hasCustomCover ? $attivita->coverUrl() : null;
  $festLogoFallback = \App\Models\Attivita::defaultLogoUrl();
  $saltacodaAttivo = (bool) ($attivita->saltacoda?->is_attivo);
  $schedaUrl = route('cliente.attivita.show', ['attivita_id' => $attivita->id]);
  $searchText = Str::lower(
    ($orgSearch ?? '') . ' ' . $attivita->nome . ' ' . ($attivita->descrizione ?? '')
  );
@endphp

<article
  class="welcome-bacheca__card"
  role="listitem"
  data-search="{{ $searchText }}"
>
  <div class="welcome-bacheca__card-shell" style="--card-accent: {{ $accent }}">
    <a href="{{ $schedaUrl }}" class="welcome-bacheca__card-poster-link" aria-label="Apri scheda: {{ $attivita->nome }}">
      <div class="welcome-bacheca__card-poster {{ $hasCustomCover ? '' : 'welcome-bacheca__card-poster--placeholder' }}">
        @if($hasCustomCover)
          <img src="{{ $coverUrl }}" alt="" class="welcome-bacheca__card-poster-img" loading="lazy">
        @else
          <span class="welcome-bacheca__card-poster-placeholder" aria-hidden="true">
            <img
              src="{{ $festLogoFallback }}"
              alt=""
              class="welcome-bacheca__card-poster-placeholder-logo"
              loading="lazy"
            >
          </span>
        @endif
        @if($saltacodaAttivo)
          <span class="welcome-bacheca__card-chip welcome-bacheca__card-chip--saltacoda welcome-bacheca__card-chip--poster">
            <i class="bx bx-food-menu" aria-hidden="true"></i>
            Ordina online
          </span>
        @endif
      </div>
    </a>

    <button
      type="button"
      class="welcome-bacheca__card-menu"
      aria-label="Azioni per {{ $attivita->nome }}"
      data-attivita-id="{{ $attivita->id }}"
      data-attivita-nome="{{ $attivita->nome }}"
      data-attivita-descrizione="{{ $attivita->descrizione ?? '' }}"
      data-attivita-logo="{{ $logoUrl }}"
      data-attivita-cover="{{ $hasCustomCover ? $coverUrl : $festLogoFallback }}"
      data-attivita-has-cover="{{ $hasCustomCover ? '1' : '0' }}"
      data-attivita-iniziali="{{ $attivita->iniziali() }}"
      data-attivita-accent="{{ $accent }}"
      data-saltacoda-attivo="{{ $saltacodaAttivo ? '1' : '0' }}"
      data-saltacoda-url="{{ route('cliente.saltacoda.show', ['attivita_id' => $attivita->id]) }}"
      data-scheda-url="{{ $schedaUrl }}"
    >
      <i class="bx bx-dots-vertical-rounded" aria-hidden="true"></i>
    </button>

    <a href="{{ $schedaUrl }}" class="welcome-bacheca__card-content welcome-bacheca__card-footer">
      <div class="welcome-bacheca__card-head">
        <span class="welcome-bacheca__card-logo" aria-hidden="true">
          <img
            src="{{ $logoUrl }}"
            alt=""
            loading="lazy"
            data-fest-logo-fallback="{{ $festLogoFallback }}"
            onerror="if (this.dataset.festLogoFallback && this.src !== this.dataset.festLogoFallback) { this.src = this.dataset.festLogoFallback; }"
          >
        </span>
        <h3 class="welcome-bacheca__card-title">{{ $attivita->nome }}</h3>
      </div>
      <p class="welcome-bacheca__card-desc">
        @if(filled($attivita->descrizione))
          {{ Str::limit($attivita->descrizione, 80) }}
        @endif
      </p>
    </a>
  </div>
</article>
