@php
  $asporti = $asporti ?? collect();
  $asportiTimeline = $asportiTimeline ?? $asporti;
@endphp

<div class="asporto-call-layout" id="asportoBoard" data-asporto-station="chiamata">
  @include('asporto._partials.h_timeline', [
    'asportiTimeline' => $asportiTimeline,
    'timelineTitle' => 'Timeline chiamata',
    'timelineEmpty' => 'Nessun ordine da chiamare',
    'timelineAccent' => 'call',
  ])

  <div class="asporto-prep-station asporto-call-station">
    <aside class="asporto-prep-queue">
      <div class="asporto-prep-queue__head">
        <div class="asporto-lane-brand">
          <i class="bx bx-phone-call" aria-hidden="true"></i>
          <span class="asporto-prep-queue__title">Da chiamare</span>
        </div>
        <span class="asporto-lane-count asporto-lane-count--call" id="badge-call">{{ $asporti->count() }}</span>
      </div>

      <div class="asporto-prep-queue__body" id="lane-call">
        @forelse($asporti as $asporto)
          @include('asporto._partials.card_chiamata', ['asporto' => $asporto])
        @empty
          <div class="text-muted text-center py-5" data-call-empty>
            Nessun ordine da chiamare
          </div>
        @endforelse
      </div>
    </aside>

    <section class="asporto-prep-detail">
      <div class="asporto-prep-detail__head">
        <div class="asporto-lane-brand">
          <i class="bx bx-user-voice" aria-hidden="true"></i>
          <span class="asporto-prep-detail__title">Cliente</span>
        </div>
      </div>

      <div class="asporto-prep-placeholder" data-call-placeholder @if($asporti->isNotEmpty()) hidden @endif>
        Seleziona un ordine dalla coda
      </div>

      @foreach($asporti as $asporto)
        @include('asporto._partials.modal.chiamata_ordine', ['asporto' => $asporto])
      @endforeach
    </section>
  </div>
</div>
