@extends('admin.layouts.app')

@section('title', 'Réglages de la galerie')

@section('content')
    <div class="btn-row" style="justify-content: space-between; align-items: flex-start;">
        <div>
            <h1 class="page-title">Réglages de la galerie</h1>
            <p class="lead">Ces réglages s'appliquent à <strong>toutes</strong> les réalisations.</p>
        </div>
        <a class="btn" href="{{ route('admin.projects.index') }}">← Retour aux réalisations</a>
    </div>

    <style>
        .gs-options { display: flex; flex-direction: column; gap: 10px; }
        .gs-radio { display: flex; align-items: flex-start; gap: 11px; padding: 14px 16px; border: 1px solid var(--ff-line); border-radius: 10px; cursor: pointer; transition: border-color .15s, background .15s; }
        .gs-radio:hover { border-color: var(--ff-gold); background: rgba(176,141,87,.05); }
        .gs-radio input { margin-top: 3px; flex-shrink: 0; }
        .gs-radio .gs-label { font-size: .94rem; color: var(--ff-ink); }
        .gs-radio .gs-sub { display: block; font-size: .8rem; color: var(--ff-muted); margin-top: 2px; }
    </style>

    <form method="POST" action="{{ route('admin.projects.settings.update') }}">
        @csrf
        @method('PUT')

        <div class="card">
            <h2>Organisation des photos</h2>
            <p class="hint">Comment les photos sont rangées dans chaque réalisation — à la fois dans l'éditeur et sur le site.</p>

            <div class="gs-options">
                <label class="gs-radio">
                    <input type="radio" name="photo_order" value="recent_first" @checked($photoOrder === 'recent_first')>
                    <span class="gs-label">Automatique — du plus récent au plus ancien
                        <span class="gs-sub">Les dernières photos ajoutées s'affichent toujours en premier.</span>
                    </span>
                </label>
                <label class="gs-radio">
                    <input type="radio" name="photo_order" value="oldest_first" @checked($photoOrder === 'oldest_first')>
                    <span class="gs-label">Automatique — du plus ancien au plus récent
                        <span class="gs-sub">Les premières photos ajoutées s'affichent en premier.</span>
                    </span>
                </label>
                <label class="gs-radio" title="L'utilisateur peut organiser les photos dans l'ordre qu'il souhaite manuellement.">
                    <input type="radio" name="photo_order" value="manual" @checked($photoOrder === 'manual')>
                    <span class="gs-label">Manuelle
                        <span class="gs-sub">Vous organisez les photos dans l'ordre que vous souhaitez (flèches ▲▼ dans chaque réalisation).</span>
                    </span>
                </label>
            </div>
            @error('photo_order')<p class="field-error">{{ $message }}</p>@enderror
        </div>

        <div class="card">
            <h2>Page d'accueil — « Selected works »</h2>
            <p class="hint">La section « Selected works » de la page d'accueil affiche automatiquement les couvertures de vos premières réalisations (dans l'ordre de la galerie). Choisissez combien en montrer.</p>

            <div class="field {{ $errors->has('home_selected_count') ? 'has-error' : '' }}" style="max-width: 260px;">
                <label for="home_count">Nombre de réalisations affichées</label>
                <input type="number" id="home_count" name="home_selected_count"
                       value="{{ old('home_selected_count', $homeSelectedCount) }}"
                       min="{{ \App\Support\GallerySettings::HOME_COUNT_MIN }}"
                       max="{{ \App\Support\GallerySettings::HOME_COUNT_MAX }}" step="1" inputmode="numeric" required>
                @error('home_selected_count')<p class="field-error">{{ $message }}</p>@enderror
                <p class="help">Chiffres uniquement, entre {{ \App\Support\GallerySettings::HOME_COUNT_MIN }} et {{ \App\Support\GallerySettings::HOME_COUNT_MAX }} (par défaut {{ \App\Support\GallerySettings::HOME_COUNT_DEFAULT }}).</p>
            </div>
        </div>

        {{-- Pour ajouter un réglage plus tard : copiez un <div class="card"> ci-dessus,
             ajoutez la clé + valeur par défaut + accesseur dans App\Support\GallerySettings,
             et lisez/validez le champ dans ProjectController::updateSettings(). --}}

        <div class="form-actions">
            <button class="btn btn-gold" type="submit">Enregistrer</button>
            <a class="btn" href="{{ route('admin.projects.index') }}">Annuler</a>
        </div>
    </form>
@endsection