"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroCentered from '@/components/sections/hero/HeroCentered';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Heart, Users, Award, Globe, Phone, Sparkles } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="mediumSmall"
      sizing="mediumLarge"
      background="none"
      cardStyle="gradient-bordered"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="layered"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="Zephyr Egyptian"
          navItems={[
            { name: "Collections", id: "products" },
            { name: "About", id: "about" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Support", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCentered
          title="Timeless Egyptian Elegance Meets Modern Style"
          description="Discover our curated collection of authentic Egyptian-inspired clothing that celebrates heritage and contemporary fashion. Handcrafted pieces that tell stories of tradition."
          background={{ variant: "sparkles-gradient" }}
          avatars={[
            { src: "http://img.b2bpic.net/free-photo/casual-smile-street-style-background-spring_1139-777.jpg", alt: "Fashion enthusiast 1" },
            { src: "http://img.b2bpic.net/free-photo/close-up-successful-entrepreneur_1098-3855.jpg", alt: "Fashion enthusiast 2" },
            { src: "http://img.b2bpic.net/free-photo/young-attractive-emotional-girl-business-style-clothes-plain-white-background-office-audience_78826-2259.jpg", alt: "Fashion enthusiast 3" }
          ]}
          avatarText="Trusted by 500+ fashion lovers"
          buttons={[
            { text: "Explore Collections", href: "#products" },
            { text: "Learn Our Story", href: "#about" }
          ]}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardThree
          title="Featured Collections"
          description="Handpicked Egyptian garments celebrating tradition and contemporary design"
          tag="New Arrivals"
          tagIcon={Sparkles}
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
          gridVariant="three-columns-all-equal-width"
          products={[
            {
              id: "1",              name: "Embroidered Galabiya Dress",              price: "$185.00",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-medieval-queen-with-chalice-poison_23-2150306057.jpg",              imageAlt: "Embroidered Egyptian galabiya",              initialQuantity: 1
            },
            {
              id: "2",              name: "Luxe Linen Galabiya",              price: "$225.00",              imageSrc: "http://img.b2bpic.net/free-photo/woman-religious-pilgrimage-church_23-2150582322.jpg",              imageAlt: "Premium linen Egyptian dress",              initialQuantity: 1
            },
            {
              id: "3",              name: "Silk Modern Galabiya",              price: "$275.00",              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-holding-hanger_23-2149318808.jpg",              imageAlt: "Silk blend modern Egyptian garment",              initialQuantity: 1
            }
          ]}
          buttons={[{ text: "View All Products", href: "#" }]}
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric
          title="Zephyr Egyptian: Preserving Heritage Through Fashion Since 2015"
          useInvertedBackground={false}
          metricsAnimation="slide-up"
          metrics={[
            { icon: Heart, label: "Years of Craftsmanship", value: "9+" },
            { icon: Users, label: "Satisfied Customers", value: "500+" },
            { icon: Award, label: "Handmade Pieces", value: "1000+" },
            { icon: Globe, label: "Countries Served", value: "25" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardMedia
          title="Why Choose Our Collections"
          description="Each piece is crafted with authentic Egyptian techniques and modern sensibilities"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
          features={[
            {
              id: "1",              title: "Authentic Craftsmanship",              description: "Traditional Egyptian techniques passed down through generations, ensuring quality and authenticity",              tag: "Heritage",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-medieval-queen-with-chalice-poison_23-2150306057.jpg",              imageAlt: "Authentic craftsmanship"
            },
            {
              id: "2",              title: "Premium Materials",              description: "We source the finest Egyptian linens, silks, and cotton to create comfortable, luxurious garments",              tag: "Quality",              imageSrc: "http://img.b2bpic.net/free-photo/woman-religious-pilgrimage-church_23-2150582322.jpg",              imageAlt: "Premium materials"
            },
            {
              id: "3",              title: "Modern Design",              description: "Contemporary cuts and styles that honor tradition while meeting modern fashion sensibilities",              tag: "Innovation",              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-holding-hanger_23-2149318808.jpg",              imageAlt: "Modern design"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="The quality and attention to detail in every piece is remarkable. I feel connected to Egyptian culture while wearing something that's beautifully modern. This has become my go-to brand for special occasions."
          rating={5}
          author="Sarah Mitchell, Fashion Blogger"
          avatars={[
            { src: "http://img.b2bpic.net/free-photo/casual-smile-street-style-background-spring_1139-777.jpg", alt: "Sarah Mitchell" },
            { src: "http://img.b2bpic.net/free-photo/close-up-successful-entrepreneur_1098-3855.jpg", alt: "Customer 2" },
            { src: "http://img.b2bpic.net/free-photo/young-attractive-emotional-girl-business-style-clothes-plain-white-background-office-audience_78826-2259.jpg", alt: "Customer 3" },
            { src: "http://img.b2bpic.net/free-photo/young-beautiful-business-woman-wearing-id-card-smiling-confident-with-crossed-arms_839833-18875.jpg", alt: "Customer 4" }
          ]}
          useInvertedBackground={false}
          ratingAnimation="slide-up"
          avatarsAnimation="slide-up"
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Featured In & Trusted By"
          description="Our collections have been recognized by leading fashion publications and style influencers worldwide"
          textboxLayout="default"
          useInvertedBackground={false}
          tag="Recognition"
          names={["Vogue Middle East", "Elle Fashion", "Harper's Bazaar Arabia", "Luxury Style Weekly", "Fashion Forward Magazine", "Cairo Style Guide", "Arab Fashion Network", "Desert Elegance Journal"]}
          speed={40}
          showCard={true}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Everything you need to know about our Egyptian clothing collections"
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
          faqs={[
            {
              id: "1",              title: "Are your products authentic Egyptian garments?",              content: "Yes, all our pieces are designed and crafted in Egypt by artisans who specialize in traditional techniques. We work directly with local craftspeople to ensure authenticity and quality in every garment."
            },
            {
              id: "2",              title: "What is your return policy?",              content: "We offer a 30-day money-back guarantee on all purchases. If you're not completely satisfied with your garment, simply contact us for a full refund or exchange."
            },
            {
              id: "3",              title: "How long does shipping take?",              content: "Standard international shipping takes 10-15 business days. We also offer expedited shipping options at checkout for faster delivery to most countries."
            },
            {
              id: "4",              title: "Do you offer custom sizing?",              content: "Absolutely! We provide detailed size guides for all our garments. If you need custom sizing, please reach out to our customer service team and we'll work with you to create the perfect fit."
            },
            {
              id: "5",              title: "Are your products sustainably made?",              content: "We're committed to sustainable fashion. Our garments are made from natural, eco-friendly materials like organic cotton and linen, and we work with ethical suppliers and fair-trade artisans."
            },
            {
              id: "6",              title: "How do I care for my Egyptian garment?",              content: "Each piece comes with detailed care instructions. Generally, we recommend hand-washing in cool water and air-drying to preserve the quality and embroidery of your garment."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="Get in Touch"
          ctaDescription="Have questions about our collections? Our style specialists are here to help you find the perfect piece."
          ctaIcon={Phone}
          ctaButton={{ text: "Contact Us Now", href: "mailto:hello@zephyregyptian.com" }}
          useInvertedBackground={false}
          animationType="slide-up"
          faqs={[
            {
              id: "1",              title: "What payment methods do you accept?",              content: "We accept all major credit cards, PayPal, and international bank transfers. All transactions are secured with SSL encryption for your protection."
            },
            {
              id: "2",              title: "Can I track my order?",              content: "Yes! Once your order ships, you'll receive a tracking number via email. You can use this to monitor your package's journey from Egypt to your doorstep."
            },
            {
              id: "3",              title: "Do you ship to my country?",              content: "We ship to over 100 countries worldwide. Check our shipping page to see if we deliver to your location, or contact our team for special shipping arrangements."
            }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="http://img.b2bpic.net/free-photo/front-view-rich-woman-posing_23-2149684324.jpg"
          imageAlt="Egyptian fashion heritage"
          logoText="Zephyr Egyptian"
          copyrightText="© 2025 Zephyr Egyptian. All rights reserved."
          columns={[
            {
              title: "Shop",              items: [
                { label: "Collections", href: "#products" },
                { label: "New Arrivals", href: "#products" },
                { label: "Best Sellers", href: "#" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Our Story", href: "#about" },
                { label: "Careers", href: "#" }
              ]
            },
            {
              title: "Support",              items: [
                { label: "Contact", href: "#contact" },
                { label: "FAQ", href: "#faq" },
                { label: "Shipping Info", href: "#" },
                { label: "Privacy Policy", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}
