"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroEmailSignup from '@/components/sections/hero/HeroEmailSignup';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import MetricCardFive from '@/components/sections/metrics/MetricCardFive';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import SocialProofTwo from '@/components/sections/socialProof/SocialProofTwo';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactParallax from '@/components/sections/contact/ContactParallax';
import FooterSocial from '@/components/sections/footer/FooterSocial';
import { Sparkles, Award, Star, HelpCircle, Facebook, Instagram, Twitter, Linkedin } from "lucide-react";

export default function AutoHubPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="expand-hover"
      defaultTextAnimation="reveal-blur"
      borderRadius="sharp"
      contentWidth="large"
      sizing="largeSizeExtraLargeSpacing"
      background="circleGradient"
      cardStyle="elevated-accent"
      primaryButtonStyle="flat"
      secondaryButtonStyle="layered"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="AutoHub"
          logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531570662-qo74r1fm.jpg"
          logoAlt="AutoHub Logo"
          navItems={[
            { name: "Browse Cars", id: "products" },
            { name: "Categories", id: "categories" },
            { name: "About Us", id: "about" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Browse Inventory",
            href: "#products"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroEmailSignup
          title="Find Your Car"
          description="Discover premium vehicles handpicked from trusted dealers. Browse our exclusive inventory and find the car of your dreams."
          tag="New Inventory"
          tagIcon={Sparkles}
          inputPlaceholder="Enter your email for alerts"
          buttonText="Browse Cars"
          ariaLabel="Hero section - find your perfect car"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardThree
          title="Featured Vehicles"
          description="Hand-selected premium cars available for immediate purchase"
          tag="Premium Selection"
          tagIcon={Award}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          containerStyle="default"
          gridVariant="three-columns-all-equal-width"
          products={[
            {
              id: "1",
              name: "2024 Tesla Model 3",
              price: "$45,999",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531574540-nff5f2eo.jpg",
              imageAlt: "2024 Tesla Model 3 - premium electric sedan"
            },
            {
              id: "2",
              name: "2023 BMW X5",
              price: "$62,500",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531575924-79zp14gk.jpg",
              imageAlt: "2023 BMW X5 - luxury SUV vehicle"
            },
            {
              id: "3",
              name: "2024 Mercedes-Benz C-Class",
              price: "$55,800",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531579304-qhz533oy.jpg",
              imageAlt: "2024 Mercedes-Benz C-Class - luxury sedan"
            },
            {
              id: "4",
              name: "2023 Honda Civic",
              price: "$28,400",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531580721-dheowb8b.jpg",
              imageAlt: "2023 Honda Civic - reliable compact car"
            },
            {
              id: "5",
              name: "2024 Toyota Camry",
              price: "$32,200",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531582465-t15acuaq.jpg",
              imageAlt: "2024 Toyota Camry - family sedan"
            },
            {
              id: "6",
              name: "2023 Ford Focus",
              price: "$24,900",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531584404-9hkugkwv.jpg",
              imageAlt: "2023 Ford Focus - economical hatchback"
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardFive
          title="Why Choose AutoHub"
          description="Industry-leading metrics that prove our commitment to excellence"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          variant="border"
          metrics={[
            {
              id: "1",
              value: "15,000+",
              description: "Satisfied customers who found their perfect vehicle through our platform"
            },
            {
              id: "2",
              value: "500+",
              description: "Quality vehicles in stock, all thoroughly inspected and certified"
            },
            {
              id: "3",
              value: "98%",
              description: "Customer satisfaction rating based on verified buyer reviews"
            },
            {
              id: "4",
              value: "24/7",
              description: "Expert support available around the clock for all your questions"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardThirteen
          title="What Our Customers Say"
          description="Real experiences from happy car buyers who found their perfect match"
          tag="Reviews"
          tagIcon={Star}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          containerStyle="default"
          testimonials={[
            {
              id: "1",
              name: "Sarah Johnson",
              handle: "@sarahjohnson",
              testimonial: "Found my dream car in just one day! The team was incredibly helpful and professional. Highly recommend AutoHub.",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531585677-u6jsb8f3.jpg"
            },
            {
              id: "2",
              name: "Michael Chen",
              handle: "@mchen_cars",
              testimonial: "Best car buying experience ever. They answered all my questions and made the process smooth from start to finish.",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531587189-4lc10jux.jpg"
            },
            {
              id: "3",
              name: "Emily Rodriguez",
              handle: "@emily_drives",
              testimonial: "Amazing selection and competitive prices. The staff really knows their vehicles and cares about customer satisfaction.",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531588696-iis4jmh9.jpg"
            },
            {
              id: "4",
              name: "David Kim",
              handle: "@david_kmotors",
              testimonial: "Transparent pricing, no hidden fees, and excellent customer service. This is how car dealerships should operate.",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531589816-ohhiaxpj.jpg"
            },
            {
              id: "5",
              name: "Jessica Martinez",
              handle: "@jess_wheels",
              testimonial: "Love my new car! The entire team was courteous and professional. Will definitely come back for my next purchase.",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531591014-eicpzw49.jpg"
            },
            {
              id: "6",
              name: "Robert Thompson",
              handle: "@robert_drives",
              testimonial: "Outstanding service from inspection to delivery. Every detail was handled with care. Five stars all the way!",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531592472-9ta23wu4.jpg"
            }
          ]}
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofTwo
          title="Trusted by Leading Brands"
          description="We partner with the world's most respected automotive manufacturers and dealers"
          tag="Partners"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          logos={[
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531594613-v875vd2a.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531596075-dri3op4v.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531599302-jyixj1cv.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531601014-mh9j7rrk.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531602648-afngrpjx.jpg"
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="Frequently Asked Questions"
          description="Get answers to common questions about buying cars at AutoHub"
          tag="Help"
          tagIcon={HelpCircle}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="smooth"
          showCard={true}
          faqs={[
            {
              id: "1",
              title: "How do I know if a car is certified pre-owned?",
              content: "All our certified pre-owned vehicles undergo a comprehensive 150-point inspection by our expert technicians. Each vehicle comes with our quality assurance guarantee and detailed inspection reports available upon request."
            },
            {
              id: "2",
              title: "What financing options are available?",
              content: "We offer flexible financing solutions with competitive rates through our network of trusted lenders. Our team can help you explore options including traditional bank loans, leasing, and our in-house financing programs."
            },
            {
              id: "3",
              title: "What is your return or exchange policy?",
              content: "We offer a 7-day money-back guarantee on all vehicles. If you're not completely satisfied, you can return the car for a full refund or exchange it for another vehicle of equal or lesser value."
            },
            {
              id: "4",
              title: "Do you offer warranty coverage?",
              content: "Yes! All our vehicles come with at least a 30-day powertrain warranty. Extended warranty options are available for additional peace of mind. Details vary by vehicle age and mileage."
            },
            {
              id: "5",
              title: "How can I schedule a test drive?",
              content: "Simply browse our inventory, select your vehicle, and click 'Schedule Test Drive'. You can choose your preferred date and time. Our team will confirm your appointment within 2 hours during business hours."
            },
            {
              id: "6",
              title: "What payment methods do you accept?",
              content: "We accept all major credit cards, bank transfers, cashier's checks, and personal checks. For large transactions, we recommend financing or bank transfers for security purposes."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactParallax
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531573179-t85u85yr.jpg"
          imageAlt="AutoHub dealership contact showroom"
          buttons={[
            {
              text: "Get in Touch",
              href: "mailto:info@autohub.com"
            },
            {
              text: "Schedule Test Drive",
              href: "#products"
            }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSocial
          logoText="AutoHub"
          logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_30ordogEOn7VO6LZdIWb5atLXky/uploaded-1765531570662-qo74r1fm.jpg"
          logoWidth={120}
          logoHeight={40}
          copyrightText="© AutoHub, Inc. 2025. All rights reserved."
          columns={[
            {
              title: "Company",
              items: [
                { label: "About Us", href: "#about" },
                { label: "Our Team", href: "#team" },
                { label: "Careers", href: "/careers" },
                { label: "Press", href: "/press" }
              ]
            },
            {
              title: "Products",
              items: [
                { label: "Browse Inventory", href: "#products" },
                { label: "New Arrivals", href: "#products" },
                { label: "Special Offers", href: "/offers" },
                { label: "Trade-In Value", href: "/trade-in" }
              ]
            },
            {
              title: "Support",
              items: [
                { label: "Help Center", href: "#faq" },
                { label: "Contact Us", href: "#contact" },
                { label: "Financing", href: "/financing" },
                { label: "Service Center", href: "/service" }
              ]
            },
            {
              title: "Resources",
              items: [
                { label: "Blog", href: "/blog" },
                { label: "Car Reviews", href: "/reviews" },
                { label: "Buying Guide", href: "/guide" },
                { label: "Maintenance Tips", href: "/maintenance" }
              ]
            },
            {
              title: "Legal",
              items: [
                { label: "Privacy Policy", href: "/privacy" },
                { label: "Terms of Service", href: "/terms" },
                { label: "Cookie Policy", href: "/cookies" }
              ]
            }
          ]}
          socialLinks={[
            {
              icon: Facebook,
              href: "https://facebook.com",
              ariaLabel: "Follow us on Facebook"
            },
            {
              icon: Instagram,
              href: "https://instagram.com",
              ariaLabel: "Follow us on Instagram"
            },
            {
              icon: Twitter,
              href: "https://twitter.com",
              ariaLabel: "Follow us on Twitter"
            },
            {
              icon: Linkedin,
              href: "https://linkedin.com",
              ariaLabel: "Connect with us on LinkedIn"
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}