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

<aside class="asporto-time-lane">
  <div class="asporto-time-lane__head">
    <div>
      <p class="asporto-time-lane__title mb-0">Timeline</p>
      <div class="small text-muted">Orari ritiro</div>
    </div>
    <button type="button" class="btn btn-sm btn-label-secondary" id="btn-timeline-now" title="Vai al prossimo da consegnare">
      Ora
    </button>
  </div>
  <div class="asporto-time-lane__body" id="lane-timeline-scroll">
    <div class="asporto-timeline asporto-timeline--compact" id="lane-timeline">
      @forelse($asportiTimeline as $asporto)
        @php
          $ordine = $asporto->ordine;
          $info = is_array($ordine?->info) ? $ordine->info : [];
          $cliente = $info['cliente'] ?? ($ordine->nome ?? '—');
          $codice = $ordine->codice ?? ('A-'.$asporto->ordine_id);
          $orario = $asporto->ora_ritiro
            ? \Illuminate\Support\Carbon::parse($asporto->ora_ritiro)->format('H:i')
            : ($info['ora_ritiro'] ?? '');
          $statoLabel = str_replace('_', ' ', (string) $asporto->stato);
        @endphp
        <div
          class="asporto-timeline__item"
          data-stato="{{ $asporto->stato }}"
          data-timeline-id="{{ $asporto->id }}"
          data-ora-ritiro="{{ $orario }}"
          data-timing-target
        >
          <span class="asporto-timeline__dot"></span>
          <div class="d-flex justify-content-between gap-1 align-items-center">
            <strong>{{ $orario !== '' ? $orario : '—' }}</strong>
            <span class="asporto-timing-badge asporto-timing-badge--sm" data-timing-badge></span>
          </div>
          <div class="d-flex justify-content-between gap-1">
            <span class="asporto-timeline__cliente">{{ $cliente }}</span>
            <span class="small text-muted">{{ $codice }}</span>
          </div>
          <div class="small text-muted text-capitalize">{{ $statoLabel }}</div>
        </div>
      @empty
        <div class="text-muted small text-center py-3">Nessun orario</div>
      @endforelse
    </div>
  </div>
</aside>
