@extends('setup.layout')
@php $currentStep = 3; @endphp
@section('title', "Paramètres de l'application")

@section('content')
<div class="p-8">
    <h2 class="text-xl font-semibold text-slate-800 mb-1">Paramètres de l'application</h2>
    <p class="text-slate-500 text-sm mb-6">Configurez le nom du site et l'URL d'accès.</p>

    @if($errors->any())
        <div class="mb-5 p-4 bg-red-50 border border-red-200 rounded-lg text-sm text-red-700 space-y-1">
            @foreach($errors->all() as $e)<p>{{ $e }}</p>@endforeach
        </div>
    @endif

    <form method="POST" action="{{ route('setup.application.save') }}">
        @csrf

        <div class="mb-5">
            <label for="app_name" class="block text-sm font-medium text-slate-700 mb-1">
                Nom du site <span class="text-red-500">*</span>
            </label>
            <input type="text" id="app_name" name="app_name" required
                value="{{ old('app_name', $saved['app_name'] ?? 'MesRelevés') }}"
                class="w-full px-3 py-2 border border-slate-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500">
            <p class="mt-1 text-xs text-slate-400">Affiché dans la navigation, les e-mails et les exports GEDCOM.</p>
        </div>

        <div class="mb-6">
            <label for="app_url" class="block text-sm font-medium text-slate-700 mb-1">
                URL de base <span class="text-red-500">*</span>
            </label>
            <input type="url" id="app_url" name="app_url" required
                value="{{ old('app_url', $saved['app_url'] ?? url('/')) }}"
                placeholder="https://genealogie.exemple.fr"
                class="w-full px-3 py-2 border border-slate-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500">
            <p class="mt-1 text-xs text-slate-400">Sans barre oblique finale. Utilisée pour les liens dans les e-mails.</p>
        </div>

        {{-- Toggle inscription --}}
        <div class="mb-8 flex items-center justify-between p-4 bg-slate-50 rounded-xl border border-slate-200">
            <div class="pr-4">
                <div class="text-sm font-medium text-slate-700">Enregistrement public des comptes</div>
                <div class="text-xs text-slate-400 mt-0.5">
                    Autoriser les visiteurs à créer eux-mêmes un compte.<br>
                    Peut être modifié plus tard dans les paramètres.
                </div>
            </div>
            <label class="relative inline-flex items-center cursor-pointer shrink-0">
                <input type="checkbox" name="registration_enabled" value="1"
                    {{ old('registration_enabled', $saved['registration_enabled'] ?? false) ? 'checked' : '' }}
                    class="sr-only peer">
                <div class="w-11 h-6 bg-slate-200 rounded-full peer
                    peer-focus:ring-2 peer-focus:ring-blue-300
                    peer-checked:bg-blue-600
                    after:content-[''] after:absolute after:top-[2px] after:left-[2px]
                    after:bg-white after:border after:border-slate-300 after:rounded-full
                    after:h-5 after:w-5 after:transition-all
                    peer-checked:after:translate-x-full peer-checked:after:border-white"></div>
            </label>
        </div>

        <div class="flex items-center justify-between">
            <a href="{{ route('setup.database') }}" class="text-sm text-slate-500 hover:text-slate-700">← Retour</a>
            <button type="submit"
                class="px-6 py-2.5 rounded-lg bg-blue-600 text-white font-medium text-sm hover:bg-blue-700 transition">
                Suivant →
            </button>
        </div>
    </form>
</div>
@endsection