@php
    $live = $attraction->liveStatus;
    $coaster = $attraction->coaster;
    $attractionTranslation = $attraction->translations->firstWhere('locale', app()->getLocale())
        ?? $attraction->translations->firstWhere('locale', 'en');
    $attractionName = $attractionTranslation?->name ?: $attraction->official_name;
    $liveInsight = $attraction->live_wait_insight ?? [];
    $liveFresh = (bool) ($liveInsight['is_fresh'] ?? false);
    $rawLiveStatus = $liveInsight['status'] ?? 'unknown';
    $liveStatus = $liveFresh ? $rawLiveStatus : 'unknown';
    $liveOpen = in_array($liveStatus, ['open', 'operating'], true);
    $liveClosed = in_array($liveStatus, ['down', 'closed', 'refurbishment'], true);
    $displayWait = $liveInsight['display_wait_minutes'] ?? null;
    $waitKind = $liveInsight['wait_kind'] ?? 'unavailable';
    $singleRiderWait = $liveInsight['single_rider_wait_minutes'] ?? null;
    $catalogueImageUrl = $attraction->catalogue_image_url ?? null;
    $liveState = $liveOpen ? 'open' : ($liveClosed ? 'closed' : 'unknown');
    $liveStatusLabel = match ($liveStatus) {
        'open', 'operating' => __('ui.live_status_open'),
        'down' => __('ui.live_status_down'),
        'closed' => __('ui.live_status_closed'),
        'refurbishment' => __('ui.live_status_refurbishment'),
        default => __('ui.live_status_unknown'),
    };
    $detailUrl = $coaster ? route('coasters.show', $coaster) : route('attractions.show', $attraction);
    $hasQueueBadges = (bool) $attraction->single_rider_available || filled($attraction->priority_access_name) || $singleRiderWait !== null;
@endphp

<article class="park-experience-card has-media {{ $catalogueImageUrl ? 'has-photo' : 'has-placeholder' }} {{ $hasQueueBadges ? 'has-queue-badges' : '' }}"
    data-kind="{{ $coaster ? 'coaster' : 'attraction' }}"
    data-live-state="{{ $liveState }}"
    data-has-wait="{{ $displayWait !== null ? '1' : '0' }}"
    data-live-attraction="{{ $attraction->id }}"
    data-cw-live-attraction="{{ $attraction->id }}"
    data-live-fresh="{{ $liveFresh ? '1' : '0' }}"
    id="attraction-{{ $attraction->id }}">
    <a href="{{ $detailUrl }}" class="park-experience-card-clickable" aria-label="{{ $attractionName }} — {{ $coaster ? __('ui.coaster_view') : __('ui.attraction_view') }}">
        <span class="park-experience-media {{ $catalogueImageUrl ? '' : 'is-placeholder '.($coaster ? 'is-coaster' : 'is-attraction') }}" aria-hidden="true">
            @if($catalogueImageUrl)
                <img src="{{ $catalogueImageUrl }}" alt="" loading="lazy" decoding="async">
            @else
                <span class="park-experience-placeholder-art">
                    @if($coaster)
                        <svg class="park-experience-placeholder-svg" viewBox="0 0 160 72" focusable="false" aria-hidden="true">
                            <path class="placeholder-track" d="M8 56 L105 15 L152 49" />
                            <path class="placeholder-track is-lower" d="M9 63 L105 22 L151 56" />
                            <path class="placeholder-support" d="M30 53 V64 M67 37 V64 M104 21 V64 M132 36 V64" />
                            <g class="placeholder-train" transform="translate(68 25) rotate(-23)">
                                <rect x="0" y="0" width="38" height="13" rx="3" />
                                <path d="M8 1 V-5 M18 1 V-5 M28 1 V-5" />
                                <circle cx="9" cy="15" r="2.8" />
                                <circle cx="29" cy="15" r="2.8" />
                            </g>
                        </svg>
                    @else
                        <svg class="park-experience-placeholder-svg" viewBox="0 0 160 72" focusable="false" aria-hidden="true">
                            <path class="placeholder-attraction-frame" d="M80 10 V60 M48 25 H112 M58 25 L48 48 M102 25 L112 48" />
                            <rect class="placeholder-attraction-seat" x="38" y="47" width="20" height="9" rx="3" />
                            <rect class="placeholder-attraction-seat" x="102" y="47" width="20" height="9" rx="3" />
                            <path class="placeholder-attraction-spark" d="M80 2 L83 8 L89 11 L83 14 L80 20 L77 14 L71 11 L77 8 Z" />
                        </svg>
                    @endif
                </span>
            @endif
        </span>

        <span class="park-experience-body">
            <span class="park-experience-topline">
                <span class="park-experience-type">{{ $coaster ? __('ui.type_coaster') : __('ui.type_attraction') }}</span>
                <span class="park-experience-status {{ $liveOpen ? 'is-open' : ($liveClosed ? 'is-closed' : 'is-unknown') }}" data-live-status data-cw-live-status>
                    {{ $liveStatusLabel }}
                </span>
            </span>

            <span class="park-experience-title-row">
                <span class="park-experience-title-copy">
                    @if($attraction->zone?->official_name)
                        <small>{{ $attraction->zone->official_name }}</small>
                    @endif
                    <span class="park-experience-title">{{ $attractionName }}</span>
                </span>
                <strong class="park-experience-wait" data-live-wait data-cw-live-wait @if($displayWait === null) hidden @endif>
                    <span data-live-wait-value data-cw-live-wait-value>{{ $waitKind === 'walk_on' ? __('ui.live_walk_on_short') : ($displayWait ?? '—') }}</span>
                    <small data-live-wait-unit data-cw-live-wait-unit @if($waitKind === 'walk_on') hidden @endif>min</small>
                </strong>
            </span>

            <span class="park-experience-livecopy">
                <span data-live-no-wait data-cw-live-empty @if($displayWait !== null) hidden @endif>
                    {{ $liveFresh ? __('ui.live_no_wait') : __('ui.park_live_unavailable_short') }}
                </span>
                <span data-live-stale-note @if($liveFresh || $displayWait === null) hidden @endif>
                    {{ __('ui.live_data_stale_short') }}
                </span>
                <span data-live-single-rider @if($singleRiderWait === null) hidden @endif>
                    {{ __('ui.live_single_rider') }} <strong data-live-single-value>{{ $singleRiderWait ?? '—' }} min</strong>
                </span>
            </span>

            <x-ride-queue-badges :attraction="$attraction" :single-rider-wait="$singleRiderWait" size="compact" class="park-experience-queues" />

            <span class="park-experience-link">
                {{ $coaster ? __('ui.coaster_view') : __('ui.attraction_view') }} <span aria-hidden="true">→</span>
            </span>
        </span>
    </a>
</article>