@extends('admin.layout')

@section('title', 'RGPD / Légal')
@section('header', 'RGPD / Légal')

@section('content')
<nav class="mb-6">
    <a href="{{ route('admin.dashboard') }}" class="text-slate-500 hover:text-slate-900 text-sm">← Tableau de bord</a>
</nav>

<div class="mb-6 p-4 rounded-2xl border bg-slate-50 border-slate-200">
    <p class="font-medium text-slate-800">Deux systèmes indépendants</p>
    <p class="text-sm text-slate-600 mt-1">
        <strong>Bannière cookies (RGPD)</strong> : bandeau en bas de page pour accepter ou refuser les cookies. <strong>Vérification d'âge</strong> : popup bloquante (âge légal alcool, etc.) avec accès ou quitter le site.
    </p>
</div>

<form method="POST" action="{{ route('admin.settings.legal-popup.store') }}" class="max-w-2xl space-y-8">
    @csrf

    {{-- Bannière cookies RGPD --}}
    <div class="bg-white rounded-2xl border border-slate-200 overflow-hidden">
        <div class="px-6 py-4 border-b border-slate-100 bg-slate-50/50">
            <div class="flex items-center gap-3">
                <div class="w-10 h-10 rounded-xl bg-white border border-slate-200 flex items-center justify-center text-slate-600">
                    <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
                </div>
                <div>
                    <h3 class="font-semibold text-slate-800">Bannière cookies (RGPD)</h3>
                    <p class="text-sm text-slate-500">Bandeau en bas de page – Accepter / Refuser</p>
                </div>
            </div>
        </div>
        <div class="p-6 space-y-6">
            <label class="flex items-center gap-3 cursor-pointer">
                <input type="checkbox" name="cookie_banner_enabled" value="1" {{ ($cookieBanner['cookie_banner_enabled'] ?? '0') === '1' ? 'checked' : '' }} class="rounded border-slate-300 text-primary-500 focus:ring-primary-500">
                <span class="font-medium text-slate-700">Activer la bannière cookies</span>
            </label>

            <div>
                <label class="block text-sm font-medium text-slate-700 mb-1">Titre</label>
                <input type="text" name="cookie_banner_title" value="{{ old('cookie_banner_title', $cookieBanner['cookie_banner_title'] ?? '') }}" placeholder="Utilisation des cookies" class="w-full px-4 py-2.5 border border-slate-200 rounded-xl focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
            </div>

            <div>
                <label class="block text-sm font-medium text-slate-700 mb-1">Contenu</label>
                <textarea name="cookie_banner_content" rows="4" placeholder="Explication sur l'utilisation des cookies..." class="w-full px-4 py-2.5 border border-slate-200 rounded-xl focus:ring-2 focus:ring-primary-500 focus:border-primary-500">{{ old('cookie_banner_content', $cookieBanner['cookie_banner_content'] ?? '') }}</textarea>
            </div>

            <div class="flex gap-6">
                <div class="flex-1">
                    <label class="block text-sm font-medium text-slate-700 mb-1">Bouton Accepter</label>
                    <input type="text" name="cookie_banner_accept" value="{{ old('cookie_banner_accept', $cookieBanner['cookie_banner_accept'] ?? 'Accepter') }}" placeholder="Accepter" class="w-full px-4 py-2.5 border border-slate-200 rounded-xl focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
                </div>
                <div class="flex-1">
                    <label class="block text-sm font-medium text-slate-700 mb-1">Bouton Refuser</label>
                    <input type="text" name="cookie_banner_reject" value="{{ old('cookie_banner_reject', $cookieBanner['cookie_banner_reject'] ?? 'Refuser') }}" placeholder="Refuser" class="w-full px-4 py-2.5 border border-slate-200 rounded-xl focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
                </div>
            </div>
        </div>
    </div>

    {{-- Popup vérification d'âge --}}
    <div class="bg-white rounded-2xl border border-slate-200 overflow-hidden">
        <div class="px-6 py-4 border-b border-slate-100 bg-slate-50/50">
            <div class="flex items-center gap-3">
                <div class="w-10 h-10 rounded-xl bg-white border border-slate-200 flex items-center justify-center text-slate-600">
                    <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/></svg>
                </div>
                <div>
                    <h3 class="font-semibold text-slate-800">Vérification d'âge</h3>
                    <p class="text-sm text-slate-500">Popup bloquante – « J'ai plus de 18 ans » ou « Retour » (quitte le site)</p>
                </div>
            </div>
        </div>
        <div class="p-6 space-y-6">
            <label class="flex items-center gap-3 cursor-pointer">
                <input type="checkbox" name="age_verification_enabled" value="1" {{ ($ageVerification['age_verification_enabled'] ?? '0') === '1' ? 'checked' : '' }} class="rounded border-slate-300 text-primary-500 focus:ring-primary-500">
                <span class="font-medium text-slate-700">Activer la vérification d'âge</span>
            </label>

            <div>
                <label class="block text-sm font-medium text-slate-700 mb-1">Titre</label>
                <input type="text" name="age_verification_title" value="{{ old('age_verification_title', $ageVerification['age_verification_title'] ?? '') }}" placeholder="Accès réservé aux majeurs" class="w-full px-4 py-2.5 border border-slate-200 rounded-xl focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
            </div>

            <div>
                <label class="block text-sm font-medium text-slate-700 mb-1">Contenu</label>
                <textarea name="age_verification_content" rows="4" placeholder="Ex: Ce site contient des références à l'alcool. Vous devez avoir au moins 18 ans pour y accéder." class="w-full px-4 py-2.5 border border-slate-200 rounded-xl focus:ring-2 focus:ring-primary-500 focus:border-primary-500">{{ old('age_verification_content', $ageVerification['age_verification_content'] ?? '') }}</textarea>
            </div>

            <div class="flex gap-6">
                <div class="flex-1">
                    <label class="block text-sm font-medium text-slate-700 mb-1">Bouton confirmer</label>
                    <input type="text" name="age_verification_confirm" value="{{ old('age_verification_confirm', $ageVerification['age_verification_confirm'] ?? "J'ai plus de 18 ans") }}" placeholder="J'ai plus de 18 ans" class="w-full px-4 py-2.5 border border-slate-200 rounded-xl focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
                </div>
                <div class="flex-1">
                    <label class="block text-sm font-medium text-slate-700 mb-1">Bouton retour</label>
                    <input type="text" name="age_verification_back" value="{{ old('age_verification_back', $ageVerification['age_verification_back'] ?? 'Retour') }}" placeholder="Retour" class="w-full px-4 py-2.5 border border-slate-200 rounded-xl focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
                </div>
            </div>

            <div>
                <label class="block text-sm font-medium text-slate-700 mb-1">URL de redirection (bouton Retour)</label>
                <input type="url" name="age_verification_back_url" value="{{ old('age_verification_back_url', $ageVerification['age_verification_back_url'] ?? 'https://www.google.com') }}" placeholder="https://www.google.com" class="w-full px-4 py-2.5 border border-slate-200 rounded-xl focus:ring-2 focus:ring-primary-500 focus:border-primary-500">
                <p class="text-xs text-slate-500 mt-1">Où le visiteur est redirigé s'il clique sur « Retour » (quitter le site).</p>
            </div>
        </div>
    </div>

    <button type="submit" class="px-6 py-2.5 bg-primary-500 text-white rounded-xl font-medium hover:bg-primary-600 transition">Enregistrer</button>
</form>
@endsection
