{{-- Promotions page content. Included by resources/views/promotions/index.blade.php
     and by App\Support\PageSnapshot for the visual designer. --}}
@php
    $waNumber = $settings['whatsapp_number'] ?? '60123456789';
    $snapshotMode = $snapshotMode ?? false;
@endphp
<section class="bg-white py-16">
    <div class="max-w-7xl mx-auto px-6 lg:px-10">
        <p class="text-red-700 text-xs font-semibold uppercase tracking-widest mb-2">Current Offers</p>
        <h1 class="text-[#0a0a0b] text-3xl sm:text-4xl font-bold tracking-tight">This Month's Promotions</h1>
        <p class="text-neutral-500 mt-2 text-[15px] mb-10">Limited-time offers at Oscar World Klang. WhatsApp us to confirm availability.</p>

        @if ($snapshotMode)
            @include('partials.dynamic-placeholder', ['key' => 'car-models', 'label' => '🚗 Car Models (live)'])
        @else
            <div class="grid sm:grid-cols-2 lg:grid-cols-3 gap-6">
                @foreach ($models as $model)
                    <div class="bg-neutral-50 border border-black/[0.06] rounded-2xl overflow-hidden flex flex-col">
                        <div class="aspect-[16/10] w-full overflow-hidden">
                            <img src="{{ $model->image_url }}" alt="Jetour {{ $model->name }}" class="w-full h-full object-cover">
                        </div>
                        <div class="p-5 flex flex-col flex-1">
                            <p class="text-neutral-400 text-xs font-medium uppercase tracking-wide">Jetour</p>
                            <h3 class="text-[#0a0a0b] text-lg font-bold">{{ $model->name }}</h3>
                            @if ($model->badge)<span class="text-[11px] font-semibold text-red-700 mt-1">{{ $model->badge }}</span>@endif
                            <div class="mt-3 flex items-baseline gap-2">
                                <span class="text-[#0a0a0b] font-bold text-lg">{{ $model->price }}</span>
                                @if ($model->original_price)<span class="text-neutral-400 text-sm line-through">{{ $model->original_price }}</span>@endif
                            </div>
                            <p class="text-neutral-400 text-xs mt-1">OTR Peninsular Malaysia • While stocks last</p>
                            <div class="mt-4 flex gap-2">
                                <a href="{{ route('models.show', $model->slug) }}" class="flex-1 text-center bg-[#0a0a0b] text-white text-xs font-semibold py-2.5 rounded-full hover:bg-[#222] transition-colors duration-200">View Promotion</a>
                                <a href="{{ route('contact', ['model' => $model->name]) }}" class="flex-1 text-center border border-neutral-300 text-neutral-700 text-xs font-semibold py-2.5 rounded-full hover:bg-white transition-colors duration-200">Test Drive</a>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        @endif

        <p class="text-neutral-400 text-xs text-center mt-10">
            Promotions are subject to change. <a href="https://wa.me/{{ $waNumber }}?text={{ urlencode('Hi! Please share the latest promotions available.') }}" target="_blank" rel="noreferrer" class="underline text-neutral-600">WhatsApp us</a> for the latest deals.
        </p>
    </div>
</section>