"use client"

import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import SplitAbout from '@/components/sections/about/SplitAbout';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactText from '@/components/sections/contact/ContactText';
import FooterCard from '@/components/sections/footer/FooterCard';
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
import { Sparkles, Gem, Hammer, Clock, Star, Heart, HelpCircle, Instagram, Facebook, Globe } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="mediumLarge"
      sizing="medium"
      background="animatedGrid"
      cardStyle="elevated"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="minimal"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Visione"
          navItems={[
            { name: "Home", id: "home" },
            { name: "About", id: "about" },
            { name: "Products", id: "products" },
            { name: "FAQ", id: "faq" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Shop Now",
            href: "products"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardCarousel
          title="Discover Your Perfect Look"
          description="Premium Italian eyewear crafted for style, comfort, and vision"
          tag="New Collection"
          tagIcon={Sparkles}
          mediaItems={[
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767007334743-cddr3jqf.jpg",
              imageAlt: "Premium sunglasses collection"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767007335699-e2fsuy5j.jpg",
              imageAlt: "Designer eyewear frames"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767007336542-6aay084d.jpg",
              imageAlt: "Fashion eyeglasses"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767007337413-vr62t2km.jpg",
              imageAlt: "Luxury sunglasses selection"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767007338199-7go9o9w5.jpg",
              imageAlt: "Stylish eyewear options"
            }
          ]}
          buttons={[
            { text: "Explore Collection", href: "products" },
            { text: "Get Consultation", href: "contact" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <SplitAbout
          title="Crafted in Italy, Worn Worldwide"
          description="Since 1985, we have been creating exceptional eyewear that combines Italian artistry with modern design"
          tag="Our Story"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          bulletPoints={[
            {
              title: "Premium Materials",
              description: "We select only the finest materials from trusted suppliers across Europe",
              icon: Gem
            },
            {
              title: "Expert Craftsmanship",
              description: "Each frame is meticulously handcrafted by our skilled artisans",
              icon: Hammer
            },
            {
              title: "Timeless Design",
              description: "Our collections blend classic aesthetics with contemporary trends",
              icon: Clock
            }
          ]}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766341393387-ujx4ytct.jpg"
          imageAlt="Our eyewear store in Italy"
          imagePosition="right"
          buttons={[
            { text: "Learn More", href: "#" }
          ]}
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardFour
          title="Featured Eyewear"
          description="Hand-selected pieces from our latest Italian collections"
          tag="Best Sellers"
          tagIcon={Star}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          products={[
            {
              id: "1",
              name: "Milano Classic",
              price: "€189",
              variant: "Brown · 5 Colors",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767007338984-dp2z75v3.jpg",
              imageAlt: "Milano Classic sunglasses",
              isFavorited: false
            },
            {
              id: "2",
              name: "Moderno Optical",
              price: "€159",
              variant: "Black · 3 Colors",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767007339998-orryizyb.jpg",
              imageAlt: "Moderno Optical frames",
              isFavorited: false
            },
            {
              id: "3",
              name: "Eleganza Reader",
              price: "€129",
              variant: "Tortoise · 4 Colors",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767007340849-lyiefwza.jpg",
              imageAlt: "Eleganza Reader glasses",
              isFavorited: false
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          carouselMode="buttons"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwelve
          cardTitle="Trusted by thousands of satisfied customers across Italy and Europe"
          cardTag="See what they say"
          cardTagIcon={Heart}
          useInvertedBackground="noInvert"
          testimonials={[
            {
              id: "1",
              name: "Giulia Rossi",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766163678723-295psgl3.jpg",
              imageAlt: "Giulia Rossi"
            },
            {
              id: "2",
              name: "Marco Bianchi",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184724760-wxlm9bjg.jpg",
              imageAlt: "Marco Bianchi"
            },
            {
              id: "3",
              name: "Sofia Marino",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185880597-ieb2jad3.jpg",
              imageAlt: "Sofia Marino"
            },
            {
              id: "4",
              name: "Andrea Conti",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185881440-0jwi2e86.jpg",
              imageAlt: "Andrea Conti"
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Find answers to common questions about our products and services"
          tag="Help & Support"
          tagIcon={HelpCircle}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="smooth"
          faqs={[
            {
              id: "1",
              title: "How do I find my correct frame size?",
              content: "We recommend visiting our store for a professional fitting. You can also reference the size printed inside the frame: width-bridge-temple length. Our customer service team is happy to help you find the perfect fit."
            },
            {
              id: "2",
              title: "Do you offer prescription lenses?",
              content: "Yes! We can add your prescription to any frame. Simply bring your prescription from your eye doctor, and our experts will help you choose the best lenses for your needs."
            },
            {
              id: "3",
              title: "What is your return policy?",
              content: "We offer a 30-day satisfaction guarantee on all eyewear. If you're not completely satisfied, you can return your purchase for a full refund or exchange."
            },
            {
              id: "4",
              title: "How long does shipping take?",
              content: "Orders within Italy typically ship within 2-3 business days. European deliveries take 5-7 business days. We offer express shipping options for faster delivery."
            },
            {
              id: "5",
              title: "Are your frames made in Italy?",
              content: "Yes, all our frames are designed and manufactured in Italy using traditional craftsmanship combined with modern techniques. We take pride in our Italian heritage."
            },
            {
              id: "6",
              title: "Do you offer warranty on frames?",
              content: "All our frames come with a 2-year manufacturing warranty against defects. This covers frame damage due to manufacturing issues, not accidental damage."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to find your perfect pair? Contact us today for a personal consultation or visit our store in Italy"
          animationType="reveal-blur"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Get in Touch", href: "#" },
            { text: "Visit Our Store", href: "#" }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="Visione"
          copyrightText="© 2025 Visione Eyewear. Handcrafted in Italy with passion."
          socialLinks={[
            {
              icon: Instagram,
              href: "https://instagram.com",
              ariaLabel: "Instagram"
            },
            {
              icon: Facebook,
              href: "https://facebook.com",
              ariaLabel: "Facebook"
            },
            {
              icon: Globe,
              href: "https://example.com",
              ariaLabel: "Website"
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}