@extends('index')
@section('title', 'Not Found')
@section('code', '404')
@section('content')
    <div class="container mt-5 py-5">
        <div class="row justify-content-center">
            <div class="col-lg-8 text-center">
                <div data-aos="fade-down">
                    <i class="bi bi-exclamation-triangle display-1 mb-4"></i>
                </div>

                <h1 class="display-1" data-aos="zoom-in" data-aos-delay="100">404</h1>

                <h2 class="display-6 fw-bold mb-3" data-aos="fade-up" data-aos-delay="200">
                    Page Non Trouvee
                </h2>

                <p class="lead text-body-secondary mb-5" data-aos="fade-up" data-aos-delay="300">
                    Oups ! La page que vous recherchez semble avoir ete demontee ou n'existe plus.
                    Peut-etre qu'elle a ete deplacee vers une nouvelle structure ?
                </p>

                <!-- Search Box -->
                {{-- <div class="search-box mb-5" data-aos="fade-up" data-aos-delay="400">
                    <div class="input-group input-group-lg">
                        <input type="text" class="form-control" placeholder="Rechercher sur le site...">
                        <button class="btn btn-accent" type="button">
                            <i class="bi bi-search"></i>
                        </button>
                    </div>
                </div> --}}

                <!-- Action Buttons -->
                <div class="d-flex flex-wrap justify-content-center gap-3 mb-5" data-aos="fade-up" data-aos-delay="500">
                    <a href="{{ route('main') }}" class="btn btn-dark btn-lg">
                        <i class="bi bi-house me-2"></i>Retour a l'Accueil
                    </a>
                    <a href="{{ route('contact') }}" class="btn btn-outline-dark btn-lg">
                        <i class="bi bi-envelope me-2"></i>Contactez-nous
                    </a>
                </div>

                <!-- Quick Links -->
                {{-- <div class="quick-links" data-aos="fade-up" data-aos-delay="600">
                    <p class="text-body-secondary mb-3">Pages populaires :</p>
                    <div class="d-flex flex-wrap justify-content-center gap-4">
                        <a href="services.html" class="text-body-secondary text-decoration-none d-flex align-items-center">
                            <i class="bi bi-gear me-2"></i>Services
                        </a>
                        <a href="projects.html" class="text-body-secondary text-decoration-none d-flex align-items-center">
                            <i class="bi bi-building me-2"></i>Projets
                        </a>
                        <a href="quote.html" class="text-body-secondary text-decoration-none d-flex align-items-center">
                            <i class="bi bi-file-text me-2"></i>Devis
                        </a>
                        <a href="about.html" class="text-body-secondary text-decoration-none d-flex align-items-center">
                            <i class="bi bi-info-circle me-2"></i>A Propos
                        </a>
                    </div>
                </div> --}}
            </div>
        </div>
    </div>
@endsection