"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
import FaqBase from "@/components/sections/faq/FaqBase";
import FooterBase from "@/components/sections/footer/FooterBase";
import Link from "next/link";
import { Award, HelpCircle } from "lucide-react";

export default function ServicesPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="medium"
      sizing="largeSmall"
      background="none"
      cardStyle="glass-elevated"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="solid"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="BRPRO"
          navItems={[
            { name: "Accueil", id: "/" },
            { name: "Services", id: "/services" },
            { name: "À propos", id: "/about" },
            { name: "Testimoniaux", id: "#testimonials" },
            { name: "Contact", id: "#contact" },
          ]}
          button={{
            text: "05 61 75 20 84",
            href: "tel:+33561752084",
          }}
          className="bg-white shadow-lg"
          buttonClassName="bg-primary-cta text-primary-cta-text font-semibold"
        />
      </div>

      <div id="services" data-section="services">
        <ProductCardFour
          title="Nos Services Complets"
          description="BRPRO propose une gamme complète de services de maintenance et de dépannage pour les professionnels et les particuliers à Labège et sa région. Chaque service est réalisé par des techniciens qualifiés et expérimentés."
          tag="Services disponibles"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          gridVariant="uniform-all-items-equal"
          products={[
            {
              id: "plumbing",
              name: "Plomberie & Dépannage",
              price: "Devis gratuit",
              variant: "Interventions d'urgence 24/7",
              imageSrc:
                "http://img.b2bpic.net/free-photo/male-hands-with-wrench-turning-off-valves_169016-53780.jpg",
              imageAlt: "Service plomberie",
            },
            {
              id: "electrical",
              name: "Électricité & Installation",
              price: "Devis gratuit",
              variant: "Installations et mises aux normes",
              imageSrc:
                "http://img.b2bpic.net/free-photo/man-electrical-technician-working-switchboard-with-fuses_169016-24230.jpg",
              imageAlt: "Service électricité",
            },
            {
              id: "hvac",
              name: "Chauffage & Climatisation",
              price: "Devis gratuit",
              variant: "Maintenance et interventions",
              imageSrc:
                "http://img.b2bpic.net/free-photo/meticulous-wiremen-expertly-refilling-freon-external-air-conditioner-while-using-manifold-measurement-device-closely-measure-pressure-hvac-system-ensuring-perfect-cooling-performance_482257-68069.jpg",
              imageAlt: "Service climatisation",
            },
            {
              id: "general",
              name: "Maintenance Générale",
              price: "Devis gratuit",
              variant: "Entretien et inspections",
              imageSrc:
                "http://img.b2bpic.net/free-photo/person-working-building-construction_23-2149184907.jpg",
              imageAlt: "Service maintenance générale",
            },
          ]}
        />
      </div>

      <div id="service-benefits" data-section="service-benefits">
        <MetricSplitMediaAbout
          tag="Avantages BRPRO"
          tagIcon={Award}
          tagAnimation="slide-up"
          title="Pourquoi nos services ?"
          description="Choisir BRPRO, c'est bénéficier d'une expertise reconnue, d'une disponibilité maximale et d'une transparence tarifaire. Nos techniciens sont formés aux dernières normes et utilisant l'équipement professionnel de pointe pour garantir des résultats durables et de qualité."
          metrics={[
            { value: "+15", title: "Années d'expérience" },
            { value: "100%", title: "Satisfaction client" },
          ]}
          useInvertedBackground={true}
          imageSrc="http://img.b2bpic.net/free-photo/businessman-walking-with-colleague-outside-office-building_107420-74360.jpg"
          imageAlt="Équipe BRPRO"
          mediaAnimation="slide-up"
        />
      </div>

      <div id="services-faq" data-section="services-faq">
        <FaqBase
          title="Questions sur nos Services"
          description="Trouvez les réponses aux questions spécifiques sur nos différents services et leurs conditions d'intervention."
          tag="Services FAQ"
          tagIcon={HelpCircle}
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
          animationType="smooth"
          showCard={true}
          faqs={[
            {
              id: "1",
              title: "Quelle est la différence entre maintenance préventive et réparation d'urgence ?",
              content:
                "La maintenance préventive consiste en inspections régulières et interventions planifiées pour éviter les pannes. La réparation d'urgence intervient lors d'une défaillance soudaine. BRPRO propose les deux services pour couvrir tous vos besoins.",
            },
            {
              id: "2",
              title: "Vos services de plomberie incluent-ils les tuyauteries enterrées ?",
              content:
                "Oui, BRPRO intervient sur tous types de tuyauteries incluant les réseaux enterrés. Nous disposons d'équipement de diagnostic avancé pour localiser les fuites sans excavation inutile.",
            },
            {
              id: "3",
              title: "Êtes-vous agréé pour les mises aux normes électriques ?",
              content:
                "Oui, nos électriciens sont certifiés et agréés pour réaliser les mises aux normes selon les standards en vigueur (NFC 15-100). Nous fournissons des certificats de conformité pour chaque intervention.",
            },
            {
              id: "4",
              title: "Pouvez-vous gérer le chauffage et la climatisation ensemble ?",
              content:
                "Absolument. BRPRO propose une solution HVAC complète avec maintenance régulière de vos systèmes de chauffage et climatisation, optimisant ainsi votre confort toute l'année.",
            },
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="BRPRO Labège"
          copyrightText="© 2025 BRPRO | Maintenance & Dépannage | Labège, Toulouse"
          columns={[
            {
              title: "Services",
              items: [
                { label: "Plomberie", href: "/services/plomberie" },
                { label: "Électricité", href: "/services/electricite" },
                { label: "Climatisation", href: "/services/climatisation" },
                { label: "Maintenance", href: "/services" },
              ],
            },
            {
              title: "Entreprise",
              items: [
                { label: "À propos", href: "/about" },
                { label: "Contact", href: "/contact" },
                { label: "Devis", href: "#contact" },
              ],
            },
            {
              title: "Légal",
              items: [
                { label: "Mentions légales", href: "/legal" },
                { label: "Politique de confidentialité", href: "/legal" },
                {
                  label: "Appeler: 05 61 75 20 84",
                  href: "tel:+33561752084",
                },
              ],
            },
          ]}
        />
      </div>
    </ThemeProvider>
  );
}