@extends('layouts.public')

@section('title', 'Plainte enregistrée - UAC-eServices')

@section('content')
    <div class="bg-white py-8 px-6 shadow-lg rounded-lg sm:px-10">
        <div class="text-center mb-8">
            <div class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100">
                <svg class="h-6 w-6 text-green-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
                </svg>
            </div>
            <h2 class="mt-6 text-center text-3xl font-bold text-gray-900">
                Plainte enregistrée avec succès
            </h2>
            <p class="mt-2 text-center text-sm text-gray-600">
                Votre plainte a été enregistrée et sera traitée dans les plus brefs délais.
            </p>
        </div>

        <div class="bg-yellow-50 border border-yellow-200 rounded-md p-6 mb-6">
            <div class="flex">
                <div class="flex-shrink-0">
                    <svg class="h-5 w-5 text-yellow-400" fill="currentColor" viewBox="0 0 20 20">
                        <path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd" />
                    </svg>
                </div>
                <div class="ml-3">
                    <h3 class="text-sm font-medium text-yellow-800">
                        Code de suivi de votre plainte
                    </h3>
                    <div class="mt-2 text-sm text-yellow-700">
                        <p class="font-mono text-lg font-bold text-yellow-900 bg-yellow-100 px-3 py-2 rounded inline-block">
                            {{ $plainte->code_suivi }}
                        </p>
                        <p class="mt-2">
                            Conservez précieusement ce code. Il vous permettra de suivre l'évolution de votre plainte.
                        </p>
                    </div>
                </div>
            </div>
        </div>

        <div class="bg-blue-50 border border-blue-200 rounded-md p-6 mb-6">
            <div class="flex">
                <div class="flex-shrink-0">
                    <svg class="h-5 w-5 text-blue-400" fill="currentColor" viewBox="0 0 20 20">
                        <path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd" />
                    </svg>
                </div>
                <div class="ml-3">
                    <h3 class="text-sm font-medium text-blue-800">
                        Que se passe-t-il maintenant ?
                    </h3>
                    <div class="mt-2 text-sm text-blue-700">
                        <ul class="list-disc list-inside space-y-1">
                            <li>Votre plainte sera examinée par nos équipes compétentes</li>
                            <li>Vous pouvez suivre l'évolution en utilisant votre code de suivi</li>
                            <li>Nous nous engageons à traiter votre plainte dans les meilleurs délais</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>

        <div class="flex flex-col sm:flex-row gap-4 justify-center">
            <a href="{{ route('plaintes.suivre') }}"
                class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
                <svg class="mr-2 -ml-1 w-4 h-4" fill="currentColor" viewBox="0 0 20 20">
                    <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-8.293l-3-3a1 1 0 00-1.414 0l-3 3a1 1 0 001.414 1.414L9 9.414V13a1 1 0 102 0V9.414l1.293 1.293a1 1 0 001.414-1.414z" clip-rule="evenodd" />
                </svg>
                Suivre ma plainte
            </a>

            <a href="{{ url('/') }}"
                class="inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
                Retour à l'accueil
            </a>
        </div>

        {{-- <div class="mt-8 text-center">
            <p class="text-sm text-gray-500">
                Pour toute question, contactez-nous à l'adresse :
                <a href="mailto:plaintes@UAC eservices.com" class="text-indigo-600 hover:text-indigo-500">
                    plaintes@UAC eservices.com
                </a>
            </p>
        </div> --}}
    </div>
@endsection