"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="icon-arrow"
        defaultTextAnimation="reveal-blur"
        borderRadius="soft"
        contentWidth="mediumSmall"
        sizing="mediumLarge"
        background="noise"
        cardStyle="glass-depth"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="glass"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
          <NavbarLayoutFloatingInline
            navItems={[
              { name: "Accueil", id: "hero" },
              { name: "À Propos", id: "about" },
              { name: "Services", id: "features" },
              { name: "Contact", id: "contact" },
            ]}
            brandName="Garage CLESS"
            button={{ text: "Prendre RDV", href: "#contact" }}
          />
        </div>

        <div id="hero" data-section="hero">
          <HeroSplitDualMedia
            background={{ variant: "gradient-bars" }}
            title="Garage CLESS : L'excellence mécanique à votre service"
            description="Des experts passionnés pour l'entretien et la réparation de votre véhicule. Qualité, transparence et fiabilité au cœur de notre atelier."
            tag="Service Automobile"
            mediaItems={[
              { imageSrc: "http://img.b2bpic.net/free-photo/car-being-taking-care-workshop_23-2149580532.jpg?_wi=1", imageAlt: "garage car repair interior" },
              { imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-engine_1170-1510.jpg?_wi=1", imageAlt: "automotive repair shop tools" }
            ]}
            mediaAnimation="slide-up"
            rating={5}
            ratingText="Noté 5/5 par nos clients"
          />
        </div>

        <div id="about" data-section="about">
          <TextSplitAbout
            useInvertedBackground={true}
            title="Pourquoi nous choisir ?"
            description={[
              "Chez Garage CLESS, nous combinons savoir-faire traditionnel et technologies de pointe pour garantir la longévité de votre véhicule.",              "Notre équipe certifiée met tout en œuvre pour vous offrir une expérience transparente, rapide et sans surprise."
            ]}
          />
        </div>

        <div id="features" data-section="features">
          <FeatureCardSeven
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
            features={[
              {
                title: "Diagnostic Électronique",                description: "Identification précise de toutes les pannes grâce à nos outils de diagnostic de dernière génération.",                imageSrc: "http://img.b2bpic.net/free-photo/portrait-male-car-mechanic-car-repair-shop_23-2150367579.jpg",                imageAlt: "team of mechanics smiling"
              },
              {
                title: "Révision Complète",                description: "Entretien régulier selon les recommandations constructeurs pour préserver votre garantie.",                imageSrc: "http://img.b2bpic.net/free-photo/car-being-taking-care-workshop_23-2149580532.jpg?_wi=2",                imageAlt: "team of mechanics smiling"
              },
              {
                title: "Freinage & Pneumatiques",                description: "Contrôle, remplacement et équilibrage pour une tenue de route optimale.",                imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-engine_1170-1510.jpg?_wi=2",                imageAlt: "team of mechanics smiling"
              }
            ]}
            title="Nos Services Experts"
            description="Des prestations complètes pour assurer votre sécurité sur la route."
          />
        </div>

        <div id="testimonials" data-section="testimonials">
          <TestimonialCardTen
            textboxLayout="split"
            useInvertedBackground={true}
            testimonials={[
              { id: "1", title: "Service Rapide", quote: "Garage très pro et à l'écoute. La réparation a été faite en un temps record !", name: "Marc L.", role: "Client Fidèle", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-bearded-man-sitting-waiting-room-car-service-center-talking-smartphone-looking-camera_496169-1036.jpg" },
              { id: "2", title: "Excellente qualité", quote: "Je recommande vivement. Travail minutieux et tarifs très honnêtes.", name: "Sophie P.", role: "Cliente", imageSrc: "http://img.b2bpic.net/free-photo/crazy-dealer-angry-expression_1194-2480.jpg" },
              { id: "3", title: "Service client top", quote: "Accueil impeccable et explications très claires sur les réparations effectuées.", name: "Julien D.", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/happy-mechanic-greeting-with-his-african-american-coworker-auto-repair-shop_637285-11601.jpg" },
              { id: "4", title: "Très satisfaite", quote: "Vraiment efficace, mon véhicule a retrouvé une nouvelle jeunesse.", name: "Claire M.", role: "Cliente", imageSrc: "http://img.b2bpic.net/free-photo/happy-woman-talking-her-car-mechanic-repair-shop_637285-8670.jpg" },
              { id: "5", title: "Professionnels", quote: "Du sérieux et du bon matériel. Vous pouvez y aller les yeux fermés.", name: "Thomas V.", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/client-vehicle-distributor-checkup_482257-115279.jpg" }
            ]}
            title="Ils nous font confiance"
            description="La satisfaction de nos clients est notre meilleure publicité."
          />
        </div>

        <div id="metrics" data-section="metrics">
          <MetricCardTwo
            animationType="slide-up"
            textboxLayout="default"
            gridVariant="bento-grid"
            useInvertedBackground={false}
            metrics={[
              { id: "1", value: "15+", description: "Années d'expérience" },
              { id: "2", value: "5000+", description: "Véhicules réparés" },
              { id: "3", value: "100%", description: "Clients satisfaits" }
            ]}
            title="Chiffres Clés"
            description="Notre engagement en quelques chiffres."
          />
        </div>

        <div id="faq" data-section="faq">
          <FaqSplitMedia
            textboxLayout="split"
            useInvertedBackground={true}
            faqs={[
              { id: "1", title: "Proposez-vous un véhicule de prêt ?", content: "Oui, nous mettons à votre disposition un véhicule de prêt sous réserve de disponibilité." },
              { id: "2", title: "Quelles marques réparez-vous ?", content: "Nous intervenons sur toutes les marques et modèles de véhicules légers." },
              { id: "3", title: "Comment prendre rendez-vous ?", content: "Vous pouvez nous appeler directement ou utiliser notre formulaire de contact ci-dessous." }
            ]}
            imageSrc="http://img.b2bpic.net/free-photo/medium-shot-people-looking-car_23-2150171223.jpg"
            title="Questions Fréquentes"
            description="Besoin d'informations sur nos services ?"
            faqsAnimation="slide-up"
          />
        </div>

        <div id="contact" data-section="contact">
          <ContactSplitForm
            useInvertedBackground={false}
            title="Prenez rendez-vous"
            description="Contactez-nous dès aujourd'hui pour toute demande de devis ou de diagnostic."
            inputs={[
              { name: "name", type: "text", placeholder: "Votre nom", required: true },
              { name: "email", type: "email", placeholder: "Votre email", required: true },
              { name: "phone", type: "tel", placeholder: "Votre téléphone", required: true }
            ]}
            textarea={{ name: "message", placeholder: "Dites-nous en plus sur votre besoin...", rows: 4, required: true }}
            imageSrc="http://img.b2bpic.net/free-photo/saleswoman-using-tablet-show-car-selection-man-offering-deal_482257-118256.jpg"
          />
        </div>

        <div id="footer" data-section="footer">
          <FooterCard
            logoText="Garage CLESS"
            copyrightText="© 2025 Garage CLESS | Tous droits réservés."
          />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}