@extends('layouts.admin', [
    'title' => ($adPlacement->exists ? 'Edit Ad Placement' : 'Create Ad Placement') . ' | Admin | LottoData',
    'heading' => $adPlacement->exists ? 'Edit Ad Placement' : 'Create Ad Placement',
])

@section('content')
    <section class="max-w-4xl rounded-[2rem] border border-white/10 bg-white/[0.04] p-6 lg:p-8">
        <form method="POST" action="{{ $formAction }}" class="space-y-6">
            @csrf
            @if ($formMethod !== 'POST')
                @method($formMethod)
            @endif

            <div class="grid gap-6 md:grid-cols-2">
                <div>
                    <label for="name" class="block text-sm font-medium text-slate-200">Name</label>
                    <input id="name" name="name" type="text" value="{{ old('name', $adPlacement->name) }}" required class="mt-2 w-full rounded-2xl border border-white/10 bg-slate-950/70 px-4 py-3 text-white focus:border-cyan-300 focus:outline-none">
                    @error('name')<p class="mt-2 text-sm text-rose-300">{{ $message }}</p>@enderror
                </div>

                <div>
                    <label for="placement_key" class="block text-sm font-medium text-slate-200">Placement Key</label>
                    <select id="placement_key" name="placement_key" class="mt-2 w-full rounded-2xl border border-white/10 bg-slate-950/70 px-4 py-3 text-white focus:border-cyan-300 focus:outline-none">
                        @foreach ($placementKeys as $placementKey)
                            <option value="{{ $placementKey }}" @selected(old('placement_key', $adPlacement->placement_key) === $placementKey)>{{ $placementKey }}</option>
                        @endforeach
                    </select>
                    @error('placement_key')<p class="mt-2 text-sm text-rose-300">{{ $message }}</p>@enderror
                </div>

                <div>
                    <label for="type" class="block text-sm font-medium text-slate-200">Type</label>
                    <select id="type" name="type" class="mt-2 w-full rounded-2xl border border-white/10 bg-slate-950/70 px-4 py-3 text-white focus:border-cyan-300 focus:outline-none">
                        @foreach ($types as $type)
                            <option value="{{ $type }}" @selected(old('type', $adPlacement->type) === $type)>{{ $type }}</option>
                        @endforeach
                    </select>
                    @error('type')<p class="mt-2 text-sm text-rose-300">{{ $message }}</p>@enderror
                </div>

                <div>
                    <label for="sort_order" class="block text-sm font-medium text-slate-200">Sort Order</label>
                    <input id="sort_order" name="sort_order" type="number" min="0" value="{{ old('sort_order', $adPlacement->sort_order) }}" required class="mt-2 w-full rounded-2xl border border-white/10 bg-slate-950/70 px-4 py-3 text-white focus:border-cyan-300 focus:outline-none">
                    @error('sort_order')<p class="mt-2 text-sm text-rose-300">{{ $message }}</p>@enderror
                </div>
            </div>

            <div>
                <label for="content" class="block text-sm font-medium text-slate-200">Content</label>
                <textarea id="content" name="content" rows="5" required class="mt-2 w-full rounded-2xl border border-white/10 bg-slate-950/70 px-4 py-3 text-white focus:border-cyan-300 focus:outline-none">{{ old('content', $adPlacement->content) }}</textarea>
                @error('content')<p class="mt-2 text-sm text-rose-300">{{ $message }}</p>@enderror
            </div>

            <div class="grid gap-6 md:grid-cols-2">
                <div>
                    <label for="image_url" class="block text-sm font-medium text-slate-200">Image URL</label>
                    <input id="image_url" name="image_url" type="url" value="{{ old('image_url', $adPlacement->image_url) }}" class="mt-2 w-full rounded-2xl border border-white/10 bg-slate-950/70 px-4 py-3 text-white focus:border-cyan-300 focus:outline-none">
                    @error('image_url')<p class="mt-2 text-sm text-rose-300">{{ $message }}</p>@enderror
                </div>

                <div>
                    <label for="link_url" class="block text-sm font-medium text-slate-200">Link URL</label>
                    <input id="link_url" name="link_url" type="url" value="{{ old('link_url', $adPlacement->link_url) }}" class="mt-2 w-full rounded-2xl border border-white/10 bg-slate-950/70 px-4 py-3 text-white focus:border-cyan-300 focus:outline-none">
                    @error('link_url')<p class="mt-2 text-sm text-rose-300">{{ $message }}</p>@enderror
                </div>
            </div>

            <label class="flex items-center gap-3 text-sm text-slate-300">
                <input type="checkbox" name="is_active" value="1" @checked(old('is_active', $adPlacement->is_active)) class="h-4 w-4 rounded border-white/15 bg-slate-950 text-cyan-300 focus:ring-cyan-300">
                Active placement
            </label>

            <div class="flex flex-wrap gap-3">
                <button type="submit" class="rounded-full bg-cyan-300 px-5 py-3 text-sm font-semibold text-slate-950 transition hover:bg-cyan-200">
                    {{ $adPlacement->exists ? 'Update placement' : 'Create placement' }}
                </button>
                <a href="{{ route('admin.ads') }}" class="rounded-full border border-white/10 px-5 py-3 text-sm font-semibold text-slate-200 transition hover:border-white/20 hover:text-white">
                    Cancel
                </a>
            </div>
        </form>
    </section>
@endsection