@php

// Switched off in Admin -> Pages: the hero does not draw.
if (!section_on('hero-cuisine')) { return; }

/**
 * Cuisine-page hero — a slider that spotlights the top cuisines (one slide each): a flag-forward
 * copy panel beside a big food image. Reuses the .qm-heroslider shell so home.js drives the
 * fade/dots/arrows with no JS change; the slide internals are this page's own design.
 * @var array $cuisineBlocks  [ ['cuisine'=>..,'dishes'=>..,'shops'=>..], ... ]
 */
$blocks = array_slice($cuisineBlocks ?? [], 0, 4);
if (!$blocks) { return; }
$n = count($blocks);
// Polished 3D icons (one webp per dish slug). The dish row is decoration, so a dish
// without an icon omits its tile rather than requesting a file that is not there.
$has3d = [];
foreach (glob(public_path() . '/assets/client/icons3d/*.png') ?: [] as $p) { $has3d[basename($p, '.png')] = true; }
@endphp
<section class="qm-section pt-0 pb-0 mt-4">
    <div class="container-fluid">
        <div class="qm-heroslider" data-heroslider role="region" aria-roledescription="carousel" aria-label="{{ t_raw('home.cuisine.hero_aria') }}">
            <div class="qm-heroslider-track" data-heroslider-track>
                @foreach ($blocks as $i => $b)
@php $cz = $b['cuisine'];
                    $img = media($b['shops'][0]['cover_image'] ?? null, 'assets/client/covers/shop-1.png');
                    $flag = cuisine_flag((string) ($cz['slug'] ?? ''));
                    $cnt = (int) ($cz['restaurant_count'] ?? 0);
                    $dishes = array_slice($b['dishes'] ?? [], 0, 4); @endphp
                <div class="qm-heroslide{{ $i === 0 ? ' is-active' : '' }}" role="group" aria-roledescription="slide" aria-label="{{ t_raw('common.slide_of_n_aria', [':i' => $i + 1, ':n' => $n]) }}"{!! $i === 0 ? '' : ' aria-hidden="true"' !!}>
                    <div class="qm-herocz">
                        <div class="qm-herocz-copy">
                            <span class="qm-herocz-eyebrow">@if ($flag)<img src="{{ $flag }}" alt="" class="qm-herocz-flag">@endif {{ t_raw('home.cuisine.spotlight_eyebrow') }}</span>
                            @php $czTag = $i === 0 ? 'h1' : 'h2'; $czName = e($cz['name'] ?? '');
@endphp
                            <{!! $czTag !!} class="qm-herocz-title">{!! t_raw('home.cuisine.craving_title', [':name' => '<span class="qm-hl">' . $czName . '</span>']) !!}</{!! $czTag !!}>
                            <p class="qm-herocz-sub">@if ($cnt > 0){{ t_raw('home.cuisine.' . ($cnt === 1 ? 'sub_one' : 'sub_many'), [':count' => $cnt, ':cuisine' => $cz['name'] ?? '']) }}@else{{ t_raw('home.cuisine.sub_zero', [':cuisine' => $cz['name'] ?? '']) }}@endif</p>
                            @if ($dishes)
                            <div class="qm-herocz-dishes" aria-hidden="true">
                                @foreach ($dishes as $d)
@php if (empty($has3d[$d['slug']])) { continue; }; @endphp<img src="{!! asset('assets/client/icons3d/' . e($d['slug']) . '.png') !!}" alt="" width="38" height="38" title="{{ $d['name'] }}" loading="{{ $i === 0 ? 'eager' : 'lazy' }}">@endforeach
                            </div>
                            @endif
                            <div class="qm-herocz-cta">
                                <a href="{!! url('/restaurants?cuisine=' . e((string) ($cz['slug'] ?? ''))) !!}" class="qm-btn qm-btn-lg"><i class="fas fa-utensils" aria-hidden="true"></i> {{ t_raw('home.cuisine.explore_cta', [':name' => $cz['name'] ?? '']) }}</a>
                                <a href="{{ route('cuisines') }}" class="qm-btn qm-btn-light qm-btn-lg">{{ t_raw('common.all_cuisines') }}</a>
                            </div>
                        </div>
                        <div class="qm-herocz-art qm-bgimg" style="--qm-bg: url('{{ $img }}')">
                            @if ($cnt > 0)<span class="qm-herocz-badge"><i class="fas fa-fire" aria-hidden="true"></i> {{ t_raw($cnt === 1 ? 'common.places_one' : 'common.places_many', [':n' => $cnt]) }}</span>@endif
                        </div>
                    </div>
                </div>
                @endforeach
            </div>
            <button type="button" class="qm-heroslider-btn prev" data-heroslider-prev aria-label="{{ t_raw('common.prev_slide_aria') }}"><i class="fas fa-chevron-left" aria-hidden="true"></i></button>
            <button type="button" class="qm-heroslider-btn next" data-heroslider-next aria-label="{{ t_raw('common.next_slide_aria') }}"><i class="fas fa-chevron-right" aria-hidden="true"></i></button>
            <div class="qm-heroslider-dots" role="group" aria-label="{{ t_raw('common.choose_slide_aria') }}" data-heroslider-dots>
                @for ($d = 0; $d < $n; $d++)
                <button type="button" class="qm-heroslider-dot{{ $d === 0 ? ' is-active' : '' }}" data-heroslider-dot="{{ $d }}" aria-current="{{ $d === 0 ? 'true' : 'false' }}" aria-label="{{ t_raw('common.slide_n_aria', [':n' => $d + 1]) }}"></button>
                @endfor
            </div>
        </div>
    </div>
</section>