@extends('admin.layout')

@section('title', 'Réservation')
@section('header', 'Réservation')

@section('content')
@if(session('success'))
<p class="mb-6 p-4 rounded-xl bg-emerald-50 border border-emerald-100 text-emerald-900 text-sm">{{ session('success') }}</p>
@endif

<div class="bg-white rounded-2xl border border-slate-200 p-6 mb-8">
    <h3 class="text-sm font-semibold text-slate-800 mb-1">URL sur le site</h3>
    <p class="text-sm text-slate-500 mb-4">Choisissez l’adresse principale du module. L’autre chemin (<code class="text-xs bg-slate-100 px-1 rounded">/{{ $reservationPublicPrefix === 'reservation' ? 'events' : 'reservation' }}</code>) redirige en 301 vers celle-ci, pour garder d’anciens liens ou favoris.</p>
    <form method="POST" action="{{ route('admin.reservation.public-url') }}" class="flex flex-wrap items-end gap-4">
        @csrf
        <div>
            <label class="block text-xs font-medium text-slate-600 mb-1">Chemin public</label>
            <select name="public_prefix" class="border border-slate-200 rounded-xl px-4 py-2.5 text-sm min-w-[200px]">
                <option value="reservation" {{ $reservationPublicPrefix === 'reservation' ? 'selected' : '' }}>/reservation (par défaut)</option>
                <option value="events" {{ $reservationPublicPrefix === 'events' ? 'selected' : '' }}>/events</option>
            </select>
        </div>
        <button type="submit" class="px-5 py-2.5 bg-primary-500 text-white rounded-xl text-sm font-medium hover:bg-primary-600 transition">Enregistrer</button>
    </form>
    <p class="mt-3 text-xs text-slate-400">Les liens générés (e-mails, boutons) utilisent automatiquement <strong>/{{ $reservationPublicPrefix }}</strong>. Dans le menu (Apparence), pointez vers cette URL.</p>
</div>

<div class="grid md:grid-cols-3 gap-6 mb-8">
    <a href="{{ route('admin.reservation.services') }}" class="bg-white rounded-2xl border border-slate-200 p-6 hover:border-primary-300 hover:shadow-md transition block">
        <h3 class="text-sm font-medium text-slate-500">Services</h3>
        <p class="text-3xl font-bold text-slate-900 mt-1">{{ $servicesCount }}</p>
        <p class="text-sm text-slate-500 mt-2">Gérer les prestations proposées</p>
    </a>
    <a href="{{ route('admin.reservation.slots') }}" class="bg-white rounded-2xl border border-slate-200 p-6 hover:border-primary-300 hover:shadow-md transition block">
        <h3 class="text-sm font-medium text-slate-500">Créneaux</h3>
        <p class="text-3xl font-bold text-slate-900 mt-1">—</p>
        <p class="text-sm text-slate-500 mt-2">Planifier les disponibilités</p>
    </a>
    <a href="{{ route('admin.reservation.reservations') }}" class="bg-white rounded-2xl border border-slate-200 p-6 hover:border-primary-300 hover:shadow-md transition block">
        <h3 class="text-sm font-medium text-slate-500">Réservations</h3>
        <p class="text-3xl font-bold text-slate-900 mt-1">{{ $reservationsCount }}</p>
        <p class="text-sm text-slate-500 mt-2">Voir les réservations clients</p>
    </a>
</div>

<div class="flex gap-3 flex-wrap mb-8">
    <a href="{{ route('admin.reservation.services') }}" class="px-6 py-2.5 bg-primary-500 text-white rounded-xl font-medium hover:bg-primary-600 transition">Services</a>
    <a href="{{ route('admin.reservation.slots') }}" class="px-6 py-2.5 border border-slate-200 rounded-xl font-medium hover:bg-slate-50 transition text-slate-700">Créneaux</a>
    <a href="{{ route('admin.reservation.reservations') }}" class="px-6 py-2.5 border border-slate-200 rounded-xl font-medium hover:bg-slate-50 transition text-slate-700">Réservations</a>
    <a href="{{ route('reservation.index') }}" target="_blank" class="px-6 py-2.5 border border-slate-200 rounded-xl font-medium hover:bg-slate-50 transition text-slate-700">Voir la page →</a>
</div>

@if($upcomingReservations->isNotEmpty())
<div class="bg-white rounded-2xl border border-slate-200 overflow-hidden">
    <h3 class="px-6 py-4 border-b border-slate-100 font-semibold text-slate-800">Prochaines réservations</h3>
    <div class="overflow-x-auto">
        <table class="w-full">
            <thead class="bg-slate-50 text-left text-sm text-slate-500">
                <tr>
                    <th class="px-6 py-3 font-medium">Client</th>
                    <th class="px-6 py-3 font-medium">Service</th>
                    <th class="px-6 py-3 font-medium">Date</th>
                    <th class="px-6 py-3 font-medium">Créneau</th>
                    <th class="px-6 py-3 font-medium"></th>
                </tr>
            </thead>
            <tbody class="divide-y divide-slate-100">
                @foreach($upcomingReservations as $r)
                <tr class="hover:bg-slate-50/50">
                    <td class="px-6 py-4">{{ $r->customer_name }}</td>
                    <td class="px-6 py-4">{{ $r->slot->service->name ?? '—' }}</td>
                    <td class="px-6 py-4">{{ $r->slot->date->format('d/m/Y') }}</td>
                    <td class="px-6 py-4">{{ \Carbon\Carbon::parse($r->slot->start_time)->format('H:i') }} - {{ \Carbon\Carbon::parse($r->slot->end_time)->format('H:i') }}</td>
                    <td class="px-6 py-4"><a href="{{ route('admin.reservation.reservations.show', $r) }}" class="text-primary-500 hover:underline text-sm">Voir</a></td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endif

<p class="mt-6 text-sm text-slate-500">Ajoutez <strong>/{{ $reservationPublicPrefix }}</strong> dans Apparence &gt; Menu pour afficher le lien sur votre site.</p>
@endsection
