{{-- One booking as a card (Figma "reservations"): doctor, status, date, time, place, details link. --}}
@php
    /** @var \App\Models\Clinic\Booking $booking */
    $cardDoctor = $booking->doctor;
    $cardPlace = $booking->type === 'online'
        ? trans('clinic.bookings.online')
        : ($booking->clinicProfile?->name ?: $booking->clinicProfile?->branch?->name);
@endphp
<article class="booking-card">
    <div class="booking-card__top">
        <img src="{{ $cardDoctor?->photo_path ? asset($cardDoctor->photo_path) : asset('assets_web/img/team/img1.webp') }}"
             alt="{{ $cardDoctor?->name }}" class="booking-card__photo" loading="lazy">
        <div class="booking-card__who">
            <h3>{{ $cardDoctor?->name }}</h3>
            <span>{{ $cardDoctor?->specialty?->name }}</span>
        </div>
        <span class="status-badge status-badge--{{ $booking->status }}">{{ trans('clinic.bookings.statuses.'.$booking->status) }}</span>
    </div>
    <ul class="booking-card__meta">
        <li><i class="far fa-calendar-alt"></i>{{ $booking->scheduled_at->translatedFormat('l j F Y') }}</li>
        <li><i class="far fa-clock"></i>{{ $booking->scheduled_at->translatedFormat('h:i A') }}</li>
        <li><i class="far {{ $booking->type === 'online' ? 'fa-video' : 'fa-hospital' }}"></i>{{ $cardPlace }}</li>
    </ul>
    <a href="{{ route('clinic.my-bookings.show', $booking) }}" class="booking-card__link">{{ trans('site.dashboard.details') }}</a>
</article>