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

/**
 * Multi-slide hero carousel for the homepage.
 * Slide 1 reuses the premium hero (search + trust). Slides 2-3 are promos.
 * The drag-&-drop teaser that used to sit here now opens /order-builder itself
 * (partials/sections/hero-order-builder.php), where the real builder follows it.
 *
 * @var array $stats   platform stats (rating, restaurants) - optional
 */
$stats = $stats ?? [];
$ratingVal = (float) ($stats['rating'] ?? 0);
$rating = number_format($ratingVal, 1);
$restCount = (int) ($stats['restaurants'] ?? 0);

// Optional paid hero-slide ad. When present it becomes an extra slide inserted
// just before the final "become a partner" promo, growing the deck 3 -> 4.
$heroAd = active_ad('hero_slide');
// Each curated slide is switched on its own in Admin -> Pages, so a deck can lose one slide rather
// than only all three. The count, the numbering and which slide starts active all follow what is
// left: a hidden slide must not leave a dot that scrolls to nothing.
$slideOn = [];
foreach (\App\Services\HomeSection::slidesOf('hero-slider') as $sid) {
    $slideOn[$sid] = \App\Services\HomeSection::slideOn('hero-slider', $sid);
}
$slideCount = count(array_filter($slideOn)) + ($heroAd ? 1 : 0);
if ($slideCount === 0) { return; }
$sN = 0; // running position of the slide being drawn
$adLabel = e(setting('ad_disclosure_label', t_raw('common.sponsored_label')));
if ($heroAd) {
    // Campaign upload -> the sponsored dish's photo -> the restaurant cover; the same chain the ad
    // card and the video band use, so one placement never shows a different subject from another.
    $adImg = media(\App\Models\AdCampaign::subjectImage($heroAd), 'assets/admin/fallback/general-fallback.png');
    // A hero placement may point at a video instead of a still; render it as a muted,
    // looping, controls-free background clip so it autoplays inline everywhere.
    $adMediaTag = preg_match('/\.(mp4|webm|ogv)(\?|$)/i', $adImg)
        // Held back until this slide is the active one (app.js / home.js attach it). An
        // autoplaying <video> ignores preload, so an inactive slide fetched its whole clip on
        // load — for a slide nobody was looking at, and which renders at 0x0 until its turn.
        ? '<video data-qm-video="' . e($adImg) . '" muted loop playsinline preload="none" aria-hidden="true"></video>'
        : '<img src="' . e($adImg) . '" alt="" loading="lazy">';
    // Counted redirect, so this placement's clicks reach the campaign's reporting.
    $adHref = ad_href($heroAd);
    $adRest = (string) ($heroAd['restaurant_name'] ?? '');
    // A dash or pipe in the headline splits it into a plain lead-in and a primary-colour
    // highlight on its own line, matching the two-tone headlines on the curated slides.
    $adHeadlineHtml = preg_match('/^(.*?)\s*[—–|]\s*(.+)$/u', trim((string) ($heroAd['headline'] ?? '')), $adHlm)
        ? e($adHlm[1]) . '<br><span class="qm-hl">' . e($adHlm[2]) . '</span>'
        : e(trim((string) ($heroAd['headline'] ?? '')));
}
@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.hero.highlights_aria') }}">
            <div class="qm-heroslider-track" data-heroslider-track>

                <!-- Slide 1 - premium hero -->
                @if ($slideOn['slide1'])
@php $sN++; @endphp
                <div class="qm-heroslide{{ $sN === 1 ? ' is-active' : '' }}" role="group" aria-roledescription="slide" aria-label="{{ t_raw('common.slide_of_n_aria', [':i' => $sN, ':n' => $slideCount]) }}"{!! $sN === 1 ? '' : ' aria-hidden="true"' !!}>
                    <div class="qm-hero">
                        <div class="qm-hero-inner">
                            <div class="qm-hero-copy">
                                <span class="qm-eyebrow">{{ t_raw('home.hero.eyebrow') }}</span>
                                <h1>{{ t_raw('home.hero.title_pre') }} <span class="qm-hl">{{ t_raw('home.hero.title_hl') }}</span></h1>
                                <p>{{ t_raw('home.hero.sub') }}</p>
                                <form class="qm-hero-search" action="{{ route('restaurants') }}" method="get" role="search">
                                    <label class="visually-hidden" for="hero-search-q">{{ t_raw('header.search_placeholder') }}</label>
                                    <input type="text" id="hero-search-q" name="q" placeholder="{{ t_raw('header.search_placeholder') }}" aria-label="{{ t_raw('header.search_placeholder') }}">
                                    <button class="qm-btn qm-hero-search-btn" type="submit" aria-label="{{ t_raw('common.search') }}"><i class="fas fa-search" aria-hidden="true"></i> <span>{{ t_raw('common.search') }}</span></button>
                                </form>
                                <div class="qm-hero-trust">
                                    <span>@php
$g = trim(t_raw('home.hero.trust_delivery_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.trust_delivery') }}</span>
                                    @if ($ratingVal > 0)<span>@php
$g = trim(t_raw('home.hero.trust_rating_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.trust_rating', [':rating' => $rating]) }}</span>@endif
                                    <span>@php
$g = trim(t_raw('home.hero.trust_payment_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.trust_payment') }}</span>
                                </div>
                            </div>
                            <div class="qm-hero-art">
                                <img src="{{ media(t_raw('home.hero.image'), 'assets/client/covers/shop-1.png') }}" alt="" loading="eager">
                                <span class="qm-hero-chip one">@php
$g = trim(t_raw('home.hero.chip_delivery_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.chip_delivery') }}</span>
                                <span class="qm-hero-chip two">@php
$g = trim(t_raw('home.hero.chip_restaurants_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.chip_restaurants', [':count' => (string) $restCount]) }}</span>
                            </div>
                        </div>
                    </div>
                </div>

                @endif

                <!-- Slide 2 - free delivery promo -->
                @if ($slideOn['slide2'])
@php $sN++; @endphp
                <div class="qm-heroslide{{ $sN === 1 ? ' is-active' : '' }}" role="group" aria-roledescription="slide" aria-label="{{ t_raw('common.slide_of_n_aria', [':i' => $sN, ':n' => $slideCount]) }}"{!! $sN === 1 ? '' : ' aria-hidden="true"' !!}>
                    <div class="qm-hero qm-hero-promo qm-hero-promo-a">
                        <div class="qm-hero-inner">
                            <div class="qm-hero-copy">
                                <span class="qm-eyebrow">@php
$g = trim(t_raw('home.hero.s3_eyebrow_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s3_eyebrow') }}</span>
                                <h2 class="qm-hero-headline">{{ t_raw('home.hero.s3_title_pre') }} <span class="qm-hl">{{ t_raw('home.hero.s3_title_hl') }}</span></h2>
                                <p>{{ t_raw('home.hero.s3_sub') }}</p>
                                @php /* Both buttons are the operator's — a glyph and a label each — and a blank
                                         label takes the button off the slide rather than leaving an empty pill.
                                         The first used to borrow home.order_now and a hardcoded glyph. */
@endphp
                                @php $s3o = trim(t_raw('home.hero.s3_cta_order')); $s3oI = trim(t_raw('home.hero.s3_cta_order_icon'));
@endphp
                                @php $s3d = trim(t_raw('home.hero.s3_cta_deals')); $s3dI = trim(t_raw('home.hero.s3_cta_deals_icon'));
@endphp
                                @if ($s3o !== '' || $s3d !== '')
                                <div class="qm-hero-cta">
                                    @if ($s3o !== '')<a href="{{ pc_link('home.hero.s3_cta_order_url') }}" class="qm-btn qm-btn-lg">@if ($s3oI !== ''){!! icon_html($s3oI, '') !!} @endif{{ $s3o }}</a>@endif
                                    @if ($s3d !== '')<a href="{{ pc_link('home.hero.s3_cta_deals_url') }}" class="qm-btn qm-btn-light qm-btn-lg">@if ($s3dI !== ''){!! icon_html($s3dI, '') !!} @endif{{ $s3d }}</a>@endif
                                </div>
                                @endif
                                <div class="qm-hero-trust">
                                    <span>@php
$g = trim(t_raw('home.hero.s3_trust_free_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s3_trust_free') }}</span>
                                    <span>@php
$g = trim(t_raw('home.hero.s3_trust_limited_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s3_trust_limited') }}</span>
                                    <span>@php
$g = trim(t_raw('home.hero.s3_trust_nomin_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s3_trust_nomin') }}</span>
                                </div>
                            </div>
                            <div class="qm-hero-art">
                                <img src="{{ media(t_raw('home.hero.s3_image'), 'assets/client/covers/shop-3.png') }}" alt="" loading="lazy">
                                <span class="qm-hero-chip one">@php
$g = trim(t_raw('home.hero.s3_chip_free_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s3_chip_free') }}</span>
                                <span class="qm-hero-chip two">@php
$g = trim(t_raw('home.hero.s3_chip_fresh_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s3_chip_fresh') }}</span>
                            </div>
                        </div>
                    </div>
                </div>

                @endif

                @php // The paid slide has no switch of its own: it is here only while a hero
                      // campaign is running, and the campaign is what starts and stops it.
@endphp
                @if ($heroAd)
@php $sN++; @endphp
                <!-- Sponsored hero slide (paid placement) -->
                <div class="qm-heroslide{{ $sN === 1 ? ' is-active' : '' }}" role="group" aria-roledescription="slide" aria-label="{{ t_raw('common.slide_of_n_aria', [':i' => $sN, ':n' => $slideCount]) }}"{!! $sN === 1 ? '' : ' aria-hidden="true"' !!}>
                    <div class="qm-hero qm-hero-promo qm-hero-promo-a">
                        <div class="qm-hero-inner">
                            <div class="qm-hero-copy">
                                <span class="qm-eyebrow"><i class="fas fa-bullhorn" aria-hidden="true"></i> {!! $adRest !== '' ? e($adRest) : t('home.hero.ad_featured') !!}</span>
                                <h2 class="qm-hero-headline">{!! $adHeadlineHtml !!}</h2>
                                @if (trim((string) ($heroAd['body'] ?? '')) !== '')
                                <p>{{ (string) $heroAd['body'] }}</p>
                                @endif
                                <div class="qm-hero-cta">
                                    <a href="{{ $adHref }}" class="qm-btn qm-btn-lg"><i class="fas fa-utensils" aria-hidden="true"></i> {!! $adRest !== '' ? t('home.order_from', [':name' => $adRest]) : t('home.order_now') !!}</a>
                                </div>
                                <div class="qm-hero-trust">
                                    <span><i class="fas fa-bolt" aria-hidden="true"></i> {{ t_raw('home.hero.ad_fast') }}</span>
                                    <span><i class="fas fa-star" aria-hidden="true"></i> {{ t_raw('home.hero.ad_rated') }}</span>
                                </div>
                            </div>
                            @php // Only the creative itself is the click-through, so the copy
                                  // column keeps its normal pointer and its own CTA button.
@endphp
                            <div class="qm-hero-art" data-ad-cursor>
                                {!! $adMediaTag !!}
                                <span class="qm-ad-label">{!! $adLabel !!}</span>
                                <a class="qm-ad-cta" data-ad-cta href="{{ $adHref }}"
                                   aria-label="{!! $adRest !== '' ? t('home.order_from', [':name' => $adRest]) : t('home.order_now') !!}"></a>
                                <span class="qm-ad-cursor" data-ad-cursor-dot aria-hidden="true"><span class="qm-ad-cursor-in">{{ t_raw('home.order_now') }}</span></span>
                            </div>
                        </div>
                    </div>
                </div>
                @endif

                <!-- Final slide - become a partner promo -->
                @if ($slideOn['slide3'])
@php $sN++; @endphp
                <div class="qm-heroslide{{ $sN === 1 ? ' is-active' : '' }}" role="group" aria-roledescription="slide" aria-label="{{ t_raw('common.slide_of_n_aria', [':i' => $sN, ':n' => $slideCount]) }}"{!! $sN === 1 ? '' : ' aria-hidden="true"' !!}>
                    <div class="qm-hero qm-hero-promo qm-hero-promo-b">
                        <div class="qm-hero-inner">
                            <div class="qm-hero-copy">
                                <span class="qm-eyebrow">@php
$g = trim(t_raw('home.hero.s4_eyebrow_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s4_eyebrow') }}</span>
                                <h2 class="qm-hero-headline">{{ t_raw('home.hero.s4_title_pre') }} <span class="qm-hl">{{ t_raw('home.hero.s4_title_hl') }}</span></h2>
                                <p>{{ t_raw('home.hero.s4_sub') }}</p>
                                @php $s4p = trim(t_raw('home.hero.s4_cta_partner')); $s4pI = trim(t_raw('home.hero.s4_cta_partner_icon'));
@endphp
                                @php $s4l = trim(t_raw('home.hero.s4_cta_learn')); $s4lI = trim(t_raw('home.hero.s4_cta_learn_icon'));
@endphp
                                @php $s4pOn = $s4p !== '' && vendor_signup_open();
@endphp
                                @if ($s4pOn || $s4l !== '')
                                <div class="qm-hero-cta">
                                    @if ($s4pOn)<a href="{{ pc_link('home.hero.s4_cta_partner_url') }}" class="qm-btn qm-btn-lg">@if ($s4pI !== ''){!! icon_html($s4pI, '') !!} @endif{{ $s4p }}</a>@endif
                                    @if ($s4l !== '')<a href="{{ pc_link('home.hero.s4_cta_learn_url') }}" class="qm-btn qm-btn-light qm-btn-lg">@if ($s4lI !== ''){!! icon_html($s4lI, '') !!} @endif{{ $s4l }}</a>@endif
                                </div>
                                @endif
                                <div class="qm-hero-trust">
                                    <span>@php
$g = trim(t_raw('home.hero.s4_trust_orders_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s4_trust_orders') }}</span>
                                    <span>@php
$g = trim(t_raw('home.hero.s4_trust_dashboard_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s4_trust_dashboard') }}</span>
                                    <span>@php
$g = trim(t_raw('home.hero.s4_trust_fees_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s4_trust_fees') }}</span>
                                </div>
                            </div>
                            <div class="qm-hero-art">
                                <img src="{{ media(t_raw('home.hero.s4_image'), 'assets/client/covers/shop-2.png') }}" alt="" loading="lazy">
                                <span class="qm-hero-chip one">@php
$g = trim(t_raw('home.hero.s4_chip_customers_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s4_chip_customers') }}</span>
                                <span class="qm-hero-chip two">@php
$g = trim(t_raw('home.hero.s4_chip_setup_icon'));
@endphp
@if ($g !== ''){!! icon_html($g, '') !!} @endif{{ t_raw('home.hero.s4_chip_setup') }}</span>
                            </div>
                        </div>
                    </div>
                </div>
                @endif

            </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 < $slideCount; $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>