@extends('layouts.admin')
@section('title', 'Landing Editor')
@section('page-title', 'Landing Page Editor')

@section('content')
<div class="grid gap-6 lg:grid-cols-2">
    {{-- Banner/Slider --}}
    <div class="card p-5">
        <h2 class="mb-4 font-bold">Banner / Slider Utama</h2>
        <div class="space-y-3">
            @forelse($banners as $b)
            <div class="flex items-center justify-between rounded-lg bg-qr-surface2 p-3">
                <div><p class="text-sm font-semibold">{{ $b->title }}</p><p class="text-xs text-qr-muted">{{ $b->subtitle }}</p></div>
                <form method="POST" action="{{ route('admin.landing.banner.destroy', $b) }}" onsubmit="return confirm('Hapus banner?')">@csrf @method('DELETE')<button class="text-red-400 text-sm">Hapus</button></form>
            </div>
            @empty<p class="text-sm text-qr-muted">Belum ada banner.</p>@endforelse
        </div>
        <form method="POST" enctype="multipart/form-data" action="{{ route('admin.landing.banner.store') }}" class="mt-4 space-y-3 border-t border-qr-border pt-4">
            @csrf
            <input name="title" placeholder="Judul banner" required class="field">
            <input name="subtitle" placeholder="Subjudul" class="field">
            <x-admin.media-field name="image" label="Gambar banner (opsional)" />
            <div class="grid grid-cols-2 gap-2">
                <input name="cta_text" placeholder="Teks tombol" class="field">
                <input name="link" placeholder="Link tujuan" class="field">
            </div>
            <button class="btn-accent w-full">+ Tambah Banner</button>
        </form>
    </div>

    {{-- Section homepage --}}
    <div class="card p-5">
        <h2 class="mb-4 font-bold">Section Homepage</h2>
        <form method="POST" action="{{ route('admin.landing.sections.update') }}" class="space-y-3">
            @csrf
            @foreach($sections as $s)
            <div class="flex items-center gap-3 rounded-lg bg-qr-surface2 p-3">
                <input type="checkbox" name="sections[{{ $s->id }}][is_enabled]" value="1" @checked($s->is_enabled) class="rounded bg-qr-surface border-qr-border text-qr-accent">
                <input name="sections[{{ $s->id }}][title]" value="{{ $s->title }}" class="field !py-1.5 flex-1">
                <input type="number" name="sections[{{ $s->id }}][sort_order]" value="{{ $s->sort_order }}" class="field !py-1.5 w-16" title="Urutan">
            </div>
            @endforeach
            <button class="btn-accent w-full">Simpan Section</button>
        </form>
    </div>
</div>
@endsection