"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import ProductCardFive from '@/components/sections/product/ProductCardFive';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import TestimonialCardEleven from '@/components/sections/testimonial/TestimonialCardEleven';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import ContactText from '@/components/sections/contact/ContactText';
import FooterBaseSocial from '@/components/sections/footer/FooterBaseSocial';
import { Instagram, Facebook, Twitter, YouTube } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="sharp"
      contentWidth="small"
      sizing="mediumLargeSizeMediumTitles"
      background="noiseGradient"
      cardStyle="elevated-accent-light"
      primaryButtonStyle="flat"
      secondaryButtonStyle="layered"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple 
          brandName="ShoeHub"
          navItems={[
            { name: "Shop", id: "products" },
            { name: "About", id: "about" },
            { name: "Contact", id: "contact" },
            { name: "FAQ", id: "faq" }
          ]}
        />
      </div>
      
      <div id="hero" data-section="hero">
        <HeroOverlay 
          title="Premium Footwear for Every Step"
          description="Discover our curated collection of high-quality shoes for every lifestyle. From athletic performance to everyday comfort."
          tag="New Arrivals"
          buttons={[
            { text: "Shop Now", href: "products" },
            { text: "View Collection", href: "#products" }
          ]}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767005922183-ibjptozn.jpg"
          imageAlt="Premium shoe collection display"
          textPosition="bottom-left"
          showBlur={true}
          showDimOverlay={true}
        />
      </div>
      
      <div id="products" data-section="products">
        <ProductCardFive 
          title="Featured Products"
          description="Browse our best-selling shoes handpicked for quality and style"
          tag="Best Sellers"
          products={[
            {
              id: "1",
              button: { text: "Add to Cart", href: "#" },
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767005923400-akej1aw5.jpg",
              imageAlt: "White athletic sneakers"
            },
            {
              id: "2",
              button: { text: "Add to Cart", href: "#" },
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767005924277-arxkhwwp.jpg",
              imageAlt: "Brown leather casual shoes"
            },
            {
              id: "3",
              button: { text: "Add to Cart", href: "#" },
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767005922183-ibjptozn.jpg",
              imageAlt: "Black formal boots"
            },
            {
              id: "4",
              button: { text: "Add to Cart", href: "#" },
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767005925099-r82hmmyp.jpg",
              imageAlt: "Pink womens sneakers"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="comparison" data-section="comparison">
        <FeatureCardSixteen 
          title="Why Choose Our Store"
          description="See what sets us apart from the rest"
          negativeCard={{
            title: "Traditional Shoe Shopping",
            items: [
              "Limited selection in stores",
              "Inconsistent sizing across brands",
              "Long return processes",
              "Higher retail prices"
            ]
          }}
          positiveCard={{
            title: "ShoeHub Advantage",
            items: [
              "Curated collection of premium brands",
              "Detailed sizing guides and reviews",
              "Fast returns and exchanges",
              "Competitive pricing and sales"
            ]
          }}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardEleven 
          title="What Customers Say"
          description="Real feedback from our satisfied shoe shoppers"
          testimonials={[
            {
              id: "1",
              nameTitle: "Sarah Martinez, Daily Commuter",
              quote: "Found the perfect running shoes here. The quality is incredible and they arrived faster than expected. Highly recommend!",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766154635301-vse33sxl.jpg",
              imageAlt: "Sarah Martinez"
            },
            {
              id: "2",
              nameTitle: "James Chen, Athletic Enthusiast",
              quote: "Best selection of athletic shoes I have seen online. The detailed reviews helped me pick exactly what I needed.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767005926489-cwzvwzwx.jpg",
              imageAlt: "James Chen"
            },
            {
              id: "3",
              nameTitle: "Emma Wilson, Style Conscious",
              quote: "Amazing customer service and great prices. I found shoes I love and the return policy gave me peace of mind.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183842429-uezzjpov.jpg",
              imageAlt: "Emma Wilson"
            },
            {
              id: "4",
              nameTitle: "Michael Roberts, Professional",
              quote: "Finally found dress shoes that are both comfortable and stylish. Will definitely be ordering again soon.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766152149165-8nddns07.jpg",
              imageAlt: "Michael Roberts"
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="faq" data-section="faq">
        <FaqSplitText 
          sideTitle="Frequently Asked Questions"
          sideDescription="Find answers to common questions about shipping, returns, and shoe care."
          faqs={[
            {
              id: "1",
              title: "What is your return policy?",
              content: "We offer free returns within 30 days of purchase. Simply contact us with your order number and we'll provide a prepaid shipping label."
            },
            {
              id: "2",
              title: "How long does shipping take?",
              content: "Standard shipping takes 5-7 business days. We also offer express 2-3 day shipping at checkout for an additional fee."
            },
            {
              id: "3",
              title: "How do I know my shoe size?",
              content: "Use our detailed sizing guide available on each product page. We include measurements in both US and European sizes for all shoes."
            },
            {
              id: "4",
              title: "Do you offer international shipping?",
              content: "Yes, we ship to most countries worldwide. Shipping costs and times vary by location. International orders may be subject to customs fees."
            },
            {
              id: "5",
              title: "Are your shoes authentic?",
              content: "All shoes are 100% authentic and purchased directly from authorized distributors. We guarantee authenticity or offer full refunds."
            }
          ]}
          textPosition="left"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="contact" data-section="contact">
        <ContactText 
          text="Ready to find your perfect pair? Get in touch with our team for personalized shoe recommendations and exclusive offers."
          animationType="entrance-slide"
          buttons={[
            { text: "Email Us", href: "#" },
            { text: "Start Shopping", href: "products" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="footer" data-section="footer">
        <FooterBaseSocial 
          description="Your destination for premium footwear. Discover quality shoes for every occasion and lifestyle."
          logoText="ShoeHub"
          copyrightText="© 2024 ShoeHub | All rights reserved"
          columns={[
            {
              title: "Shop",
              items: [
                { label: "New Arrivals", href: "products" },
                { label: "Best Sellers", href: "products" },
                { label: "All Shoes", href: "products" }
              ]
            },
            {
              title: "Support",
              items: [
                { label: "Contact Us", href: "contact" },
                { label: "FAQ", href: "faq" },
                { label: "Shipping Info", href: "#" }
              ]
            },
            {
              title: "Legal",
              items: [
                { label: "Terms of Service", href: "#" },
                { label: "Privacy Policy", href: "#" },
                { label: "Return Policy", href: "#" }
              ]
            }
          ]}
          socialLinks={[
            { icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
            { icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" },
            { icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
            { icon: YouTube, href: "https://youtube.com", ariaLabel: "YouTube" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}