{{-- _partials/moment.blade.php --}}
@php
  [$start,$end,$name] = $label;
@endphp
<div class="row g-4 mb-3">
  <div class="col-12 d-flex">
    <div class="text-center me-3" style="width:60px">
      <div class="fw-semibold">{{ $start }}</div>
      <div class="timeline-marker my-2">
        <i class="bi bi-play-fill text-gradient"></i>
      </div>
      <div class="timeline-line"></div>
      <div class="fw-semibold">{{ $end }}</div>
    </div>
    <div class="flex-grow-1">
      <div class="card programme-card">
        <div class="card-body d-flex justify-content-between">
          <div>
            <h5 class="mb-1">{{ $name }}</h5>
            <small>{{ count($events) }} {{ count($events)>1?'programmes':'programme' }}</small>
          </div>
        </div>
        <div class="bg-linear-gradient text-white fw-bold px-3 py-3 toggle-programmes" style="cursor: pointer;"
             data-target="#prog-{{ $key }}">
          <i class="bi bi-chevron-down"></i> Afficher les programmes
        </div>
        <div class="programmes" id="prog-{{ $key }}" style="display:none;">
          <div class="row p-3">
            @forelse($events as $event)
              <div class="col-12 col-md-6 col-lg-4 mb-3">
                <div class="border rounded p-3 bg-white h-100">
                  <div class="d-flex">
                    @if($event->category->image)
                      <div class="me-2">
                        <img src="{{ asset($event->category->image) }}"
                             width="80" class="rounded" alt="">
                      </div>
                    @endif
                    <div>
                      <strong>Heures :</strong>
                      {{ formattedTime($event->start) }}–{{ formattedTime($event->end) }}<br>
                      <strong>Titre :</strong>
                      <span data-bs-toggle="tooltip" title="{{ $event->title }}">
                      {{ \Illuminate\Support\Str::limit($event->title, 15) }}
                      </span><br>
                      <strong>Genre :</strong> {{ $event->category->name }}
                    </div>
                  </div>
                </div>
              </div>
            @empty
              <div class="col-12">
                <div class="border rounded p-3 bg-light">Aucun programme</div>
              </div>
            @endforelse
          </div>
        </div>
      </div>
    </div>
  </div>
</div>