{{--
    Blade-шаблон блока «Главный баннер».
    $data:
      eyebrow   — надпись мелким шрифтом над заголовком
      line1/2/3 — три строки заголовка (line3 выделяется красным)
      subtext   — подзаголовок
      btn1_text, btn1_url — основная кнопка
      btn2_text, btn2_url — вторичная кнопка
      image     — путь к фоновому изображению (в storage)
      stats[]   — массив {value, label} для блока статистики внизу
      show_quick_search — показывать карточку быстрого подбора (правая колонка grid)
--}}
@php
    $toUrl  = fn (?string $p): string => $p ? (str_starts_with($p, 'http') ? $p : asset('storage/' . $p)) : '';
    $imgUrl = $toUrl($data['image'] ?? '');
    $stats  = $data['stats'] ?? [];
    $showSearch = (bool) ($data['show_quick_search'] ?? false);

    // Данные для карточки быстрого подбора — марки из справочника и типы кузова
    $qsMakesSection = \App\Models\DictSection::where('code', 'makes')->first();
    $qsMakes = $qsMakesSection
        ? \App\Models\DictValue::where('section_id', $qsMakesSection->id)
              ->whereNull('parent_id')->orderBy('sort_order')->pluck('value')
        : collect();

    $qsBodyTypesSection = \App\Models\DictSection::where('code', 'body_types')->first();
    $qsBodyTypes = $qsBodyTypesSection
        ? \App\Models\DictValue::where('section_id', $qsBodyTypesSection->id)
              ->orderBy('sort_order')->pluck('value')
        : \App\Models\Car::where('status', 'active')
              ->whereNotNull('body_type')->where('body_type', '!=', '')
              ->select('body_type')->distinct()->orderBy('body_type')->pluck('body_type');
@endphp

<section class="hero">

    {{-- Фоновое изображение + оверлей --}}
    @if ($imgUrl)
        <div class="hero-media">
            <img src="{{ $imgUrl }}" alt="Баннер" loading="eager" fetchpriority="high">
        </div>
        <div class="hero-overlay"></div>
    @else
        <div style="position:absolute;inset:0;background:linear-gradient(100deg,rgba(20,20,20,.95) 0%,rgba(20,20,20,.7) 100%)"></div>
    @endif

    <div class="container">

        {{-- Grid: левая колонка — контент, правая — карточка подбора (скрывается <1024px) --}}
        <div class="hero-layout">

            {{-- Левая колонка: текст + кнопки + статистика (без класса — строго как в дизайне) --}}
            <div>

                @if ($data['eyebrow'] ?? '')
                    <div class="hero-eyebrow">{{ $data['eyebrow'] }}</div>
                @endif

                <h1 class="hero-title">
                    @if ($data['line1'] ?? '')
                        <span class="ln"><span>{{ $data['line1'] }}</span></span>
                    @endif
                    @if ($data['line2'] ?? '')
                        <span class="ln"><span><em>{{ $data['line2'] }}</em></span></span>
                    @endif
                    @if ($data['line3'] ?? '')
                        <span class="ln"><span>{{ $data['line3'] }}</span></span>
                    @endif
                </h1>

                @if ($data['subtext'] ?? '')
                    <p class="hero-sub">{{ $data['subtext'] }}</p>
                @endif

                @if (($data['btn1_text'] ?? '') || ($data['btn2_text'] ?? ''))
                    <div class="hero-btns">
                        @if (($data['btn1_text'] ?? '') && ($data['btn1_url'] ?? ''))
                            <a href="{{ $data['btn1_url'] }}" class="btn btn-primary btn-lg">{{ $data['btn1_text'] }}</a>
                        @endif
                        @if (($data['btn2_text'] ?? '') && ($data['btn2_url'] ?? ''))
                            <a href="{{ $data['btn2_url'] }}" class="btn btn-outline-w btn-lg">{{ $data['btn2_text'] }}</a>
                        @endif
                    </div>
                @endif

                {{-- Статистика под кнопками (левая колонка) --}}
                @if (!empty($stats))
                    <div class="hero-stats">
                        @foreach ($stats as $stat)
                            <div class="hstat">
                                <div class="hstat-n">{{ $stat['value'] ?? '' }}@if(!empty($stat['suffix']))<em>{{ $stat['suffix'] }}</em>@endif</div>
                                <div class="hstat-l">{{ $stat['label'] ?? '' }}</div>
                            </div>
                        @endforeach
                    </div>
                @endif

            </div>

            {{-- Правая колонка: вертикальная карточка быстрого подбора --}}
            @if ($showSearch)
                <form action="{{ route('catalog') }}" method="GET" class="hero-search reveal">
                    <div class="hs-title">Быстрый подбор</div>

                    <div class="hs-field">
                        <label>Марка</label>
                        <select name="make">
                            <option value="">Любая</option>
                            @foreach ($qsMakes as $m)
                                <option value="{{ $m }}">{{ $m }}</option>
                            @endforeach
                        </select>
                    </div>

                    <div class="hs-field">
                        <label>Тип кузова</label>
                        <select name="body_type">
                            <option value="">Любой</option>
                            @foreach ($qsBodyTypes as $bt)
                                <option value="{{ $bt }}">{{ $bt }}</option>
                            @endforeach
                        </select>
                    </div>

                    <div class="hs-field">
                        <label>Бюджет</label>
                        <select name="price_range">
                            <option value="">Любой</option>
                            <option value="1500000">До 1 500 000 ₽</option>
                            <option value="1500000-3000000">1.5 — 3 млн ₽</option>
                            <option value="3000000-5000000">3 — 5 млн ₽</option>
                            <option value="5000000-">Свыше 5 млн ₽</option>
                        </select>
                    </div>

                    <div class="hs-field">
                        <label>Состояние</label>
                        <select name="condition">
                            <option value="">Любое</option>
                            <option value="new">Новый</option>
                            <option value="used">С пробегом</option>
                        </select>
                    </div>

                    <button type="submit" class="btn btn-red hs-btn-full">
                        Найти автомобиль &rarr;
                    </button>
                </form>
            @endif

        </div>{{-- /hero-layout --}}

    </div>
</section>