"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactText from '@/components/sections/contact/ContactText';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { Sparkles, Car, Shield, Clock, CheckCircle, Users, Award, Zap, TrendingUp, Star } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="background-highlight"
      borderRadius="sharp"
      contentWidth="medium"
      sizing="mediumLargeSizeMediumTitles"
      background="aurora"
      cardStyle="glass-depth"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={[
            { name: "Home", id: "home" },
            { name: "Services", id: "services" },
            { name: "About", id: "about" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          brandName="DetailPro Mobile"
          bottomLeftText="Available 24/7"
          bottomRightText="hello@detailpro.com"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardDashboard
          background={{ variant: "radial-gradient" }}
          tag="Professional Mobile Detailing"
          tagIcon={Sparkles}
          title="Your Car Deserves Premium Care"
          description="Professional mobile car detailing service that comes to you. We bring the showroom shine to your driveway with eco-friendly products and meticulous attention to detail."
          buttons={[
            { text: "Book Now", href: "contact" },
            { text: "Learn More", href: "services" }
          ]}
          dashboard={{
            title: "Service Overview",            logoIcon: Car,
            imageSrc: "https://img.b2bpic.net/free-photo/man-car-clean-vacuuming-car-inside_1303-30580.jpg",            buttons: [
              { text: "Book Service", href: "contact" },
              { text: "View Pricing", href: "#" }
            ],
            sidebarItems: [
              { icon: Sparkles },
              { icon: Shield },
              { icon: Clock }
            ],
            stats: [
              {
                title: "Customers Satisfied",                values: [500, 750, 1200],
                description: "Happy clients served"
              },
              {
                title: "Service Quality",                values: [98, 99, 100],
                valueSuffix: "%",                description: "Satisfaction rate"
              },
              {
                title: "Years Experience",                values: [5, 8, 12],
                description: "Industry expertise"
              }
            ],
            chartTitle: "Monthly Bookings",            chartData: [
              { value: 60 },
              { value: 75 },
              { value: 85 },
              { value: 70 },
              { value: 90 }
            ],
            listTitle: "Recent Services",            listItems: [
              { icon: CheckCircle, title: "Full Detail Package", status: "Completed" },
              { icon: Sparkles, title: "Ceramic Coating", status: "Scheduled" },
              { icon: Shield, title: "Paint Protection", status: "Completed" }
            ],
            searchPlaceholder: "Search services..."
          }}
        />
      </div>

      <div id="services" data-section="services">
        <ProductCardTwo
          title="Our Premium Services"
          description="Comprehensive detailing packages tailored to keep your vehicle looking pristine. From exterior shine to interior freshness, we handle every detail."
          tag="Professional Services"
          tagIcon={Shield}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          gridVariant="three-columns-all-equal-width"
          products={[
            {
              id: "1",              brand: "DetailPro",              name: "Exterior Polish & Shine",              price: "$79.99",              rating: 5,
              reviewCount: "180",              imageSrc: "https://img.b2bpic.net/free-photo/man-car-clean-using-brush-clean-up-all-details-inside-vehicle_1303-30586.jpg",              imageAlt: "Professional exterior detailing and polish"
            },
            {
              id: "2",              brand: "DetailPro",              name: "Interior Deep Clean",              price: "$89.99",              rating: 5,
              reviewCount: "165",              imageSrc: "https://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2004.jpg",              imageAlt: "Professional interior detailing service"
            },
            {
              id: "3",              brand: "DetailPro",              name: "Ceramic Coating",              price: "$249.99",              rating: 5,
              reviewCount: "142",              imageSrc: "https://img.b2bpic.net/free-photo/man-polish-salon-car-garage_1157-36592.jpg",              imageAlt: "Professional ceramic coating application"
            },
            {
              id: "4",              brand: "DetailPro",              name: "Wheel & Tire Care",              price: "$49.99",              rating: 5,
              reviewCount: "158",              imageSrc: "https://img.b2bpic.net/free-photo/mid-adult-mechanic-examining-vehicle-hood-while-working-auto-repair-shop_637285-7664.jpg",              imageAlt: "Professional wheel and tire detailing"
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric
          title="DetailPro Mobile: Excellence in Every Detail Since 2012"
          useInvertedBackground={false}
          metrics={[
            { icon: Users, label: "Satisfied Customers", value: "1,200+" },
            { icon: Award, label: "Award-Winning Service", value: "15+" },
            { icon: Zap, label: "Response Time", value: "2 Hours" },
            { icon: TrendingUp, label: "Growth Rate", value: "45% YoY" }
          ]}
        />
      </div>

      <div id="benefits" data-section="benefits">
        <FeatureCardSixteen
          title="Why Choose DetailPro Mobile"
          description="Experience the difference between standard car wash and professional detailing."
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          negativeCard={{
            items: [
              "Time-consuming trips to detailers",              "Expensive facility overhead costs",              "Limited service hours and availability",              "Harsh chemical exposure",              "One-size-fits-all approach"
            ]
          }}
          positiveCard={{
            items: [
              "We come to your home or office",              "Competitive pricing, direct savings",              "Available 24/7 for your convenience",              "Eco-friendly, safe products",              "Customized packages for your needs"
            ]
          }}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="What Our Clients Say"
          description="Real feedback from satisfied customers who trust DetailPro Mobile with their vehicles."
          tag="Client Reviews"
          tagIcon={Star}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          gridVariant="uniform-all-items-equal"
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              role: "Business Owner",              company: "Executive Motors",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg",              imageAlt: "Sarah Johnson testimonial"
            },
            {
              id: "2",              name: "Michael Chen",              role: "CEO",              company: "TechCorp Solutions",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1633.jpg",              imageAlt: "Michael Chen testimonial"
            },
            {
              id: "3",              name: "Emily Rodriguez",              role: "Marketing Director",              company: "Creative Agency",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/happy-mature-businessman-showing-thumb-up_1262-3024.jpg",              imageAlt: "Emily Rodriguez testimonial"
            },
            {
              id: "4",              name: "David Kim",              role: "Product Manager",              company: "StartupXYZ",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/smiling-millennial-man-looking-camera-cafe-headshot-portrait_1163-5163.jpg",              imageAlt: "David Kim testimonial"
            },
            {
              id: "5",              name: "Jessica White",              role: "Finance Manager",              company: "Global Investments",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/cheerful-asian-business-lady-recommending-product_1262-16877.jpg",              imageAlt: "Jessica White testimonial"
            },
            {
              id: "6",              name: "Robert Martinez",              role: "Operations Lead",              company: "Fleet Management",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/smiling-redhead-man-with-laptop-looking-camera-cafe_1163-5162.jpg",              imageAlt: "Robert Martinez testimonial"
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitMedia
          title="Frequently Asked Questions"
          description="Get answers to common questions about our mobile detailing services and how we can help maintain your vehicle."
          textboxLayout="default"
          useInvertedBackground={false}
          mediaPosition="left"
          imageSrc="https://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2002.jpg"
          imageAlt="Car detailing process"
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "How long does a typical detailing session take?",              content: "Most full detail packages take 2-4 hours depending on your vehicle's size and condition. Interior deep cleans typically take 2-3 hours, while exterior polishing takes 1-2 hours. We'll provide an exact timeframe when you book."
            },
            {
              id: "2",              title: "Are your products eco-friendly?",              content: "Yes! We exclusively use biodegradable, water-based detailing products that are safe for your car, your family, and the environment. All our cleaning solutions meet EPA environmental standards."
            },
            {
              id: "3",              title: "Do you offer ceramic coating protection?",              content: "Absolutely! Our premium ceramic coating provides long-lasting protection against UV damage, water spots, and contaminants. The coating lasts 1-3 years depending on maintenance and can be reapplied as needed."
            },
            {
              id: "4",              title: "Can you service commercial fleets?",              content: "Yes, we offer fleet detailing services with flexible scheduling and volume discounts. Contact our business team to discuss a customized maintenance plan for your vehicles."
            },
            {
              id: "5",              title: "What areas do you service?",              content: "We provide mobile detailing throughout the metropolitan area and surrounding suburbs within a 30-mile radius. Check our service map or call for availability in your specific location."
            },
            {
              id: "6",              title: "How often should I have my car detailed?",              content: "We recommend professional detailing every 3-6 months for regular maintenance, or more frequently if you drive in harsh conditions. Regular detailing extends your car's paint life and maintains resale value."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to transform your vehicle? Schedule your detailing appointment today and experience the DetailPro Mobile difference."
          animationType="entrance-slide"
          buttons={[
            { text: "Book Appointment", href: "#" },
            { text: "Call Us: (555) 123-4567", href: "#" }
          ]}
          background={{ variant: "plain" }}
          useInvertedBackground={false}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={[
            {
              title: "Services",              items: [
                { label: "Exterior Detailing", href: "services" },
                { label: "Interior Cleaning", href: "services" },
                { label: "Ceramic Coating", href: "services" },
                { label: "Fleet Services", href: "#" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "about" },
                { label: "Contact", href: "contact" },
                { label: "FAQ", href: "faq" },
                { label: "Blog", href: "#" }
              ]
            },
            {
              title: "Contact",              items: [
                { label: "hello@detailpro.com", href: "#" },
                { label: "(555) 123-4567", href: "#" },
                { label: "Available 24/7", href: "#" },
                { label: "Service Area Map", href: "#" }
              ]
            }
          ]}
          copyrightText="© 2025 DetailPro Mobile | Professional Car Detailing"
        />
      </div>
    </ThemeProvider>
  );
}