"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import AboutPhoneTimeline from '@/components/sections/about/AboutPhoneTimeline';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Sparkles, Heart, Phone } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="sharp"
      contentWidth="smallMedium"
      sizing="largeSmallSizeMediumTitles"
      background="noiseGradient"
      cardStyle="solid"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple 
          brandName="Lumineux Jewelry"
          navItems={[
            { name: "Collections", id: "products" },
            { name: "About", id: "about" },
            { name: "Features", id: "features" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboard 
          logoText="lumineux"
          description="Handcrafted jewelry that celebrates your most precious moments. Discover timeless elegance and exceptional quality."
          imageSrc="https://img.b2bpic.net/free-photo/queen-crown-still-life_23-2150409281.jpg"
          imageAlt="Luxury jewelry showcase with diamonds and precious stones"
          frameStyle="card"
          logoLineHeight={1.1}
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardFour 
          title="Collections"
          description="Explore our curated selection of handcrafted jewelry pieces designed to make every moment special"
          tag="Featured"
          tagIcon={Sparkles}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="slide-up"
          gridVariant="uniform-all-items-equal"
          products={[
            {
              id: "rings-1",              name: "Celestial Diamond Ring",              price: "$2,450",              variant: "18k Gold · 1.5 Carat",              imageSrc: "https://img.b2bpic.net/free-photo/abstract-gold-chain-jewellery-presentation_23-2149599083.jpg",              imageAlt: "Elegant engagement ring with diamond",              isFavorited: false
            },
            {
              id: "necklaces-1",              name: "Pearl Elegance Necklace",              price: "$1,850",              variant: "White Gold · South Sea Pearl",              imageSrc: "https://img.b2bpic.net/free-photo/queen-crown-still-life_23-2150409243.jpg",              imageAlt: "Luxury pearl necklace",              isFavorited: false
            },
            {
              id: "bracelets-1",              name: "Sapphire Bangle Bracelet",              price: "$3,200",              variant: "Platinum · Blue Sapphire",              imageSrc: "https://img.b2bpic.net/free-photo/queen-crown-still-life_23-2150409249.jpg",              imageAlt: "Premium sapphire bracelet",              isFavorited: false
            },
            {
              id: "rings-2",              name: "Vintage Rose Gold Ring",              price: "$1,950",              variant: "Rose Gold · Diamond & Ruby",              imageSrc: "https://img.b2bpic.net/free-photo/abstract-gold-chain-jewellery-presentation_23-2149599083.jpg",              imageAlt: "Vintage-inspired rose gold ring",              isFavorited: false
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <AboutPhoneTimeline 
          tag="About Us"
          tagIcon={Heart}
          title="Crafted with Passion, Worn with Pride"
          description="Since 1995, Lumineux Jewelry has been creating exceptional pieces that tell your story. Each item is meticulously crafted by master artisans who combine traditional techniques with contemporary design."
          phoneOne={{
            imageSrc: "https://img.b2bpic.net/free-photo/abstract-gold-chain-jewellery-presentation_23-2149599084.jpg",            imageAlt: "Jewelry design showcase on mobile"
          }}
          phoneTwo={{
            imageSrc: "https://img.b2bpic.net/free-photo/queen-crown-still-life_23-2150409263.jpg",            imageAlt: "Custom jewelry ordering experience"
          }}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "View Our Story", href: "#contact" },
            { text: "Explore Collections", href: "#products" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwelve 
          title="Why Choose Lumineux"
          description="Experience the difference that exceptional craftsmanship and attention to detail make"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="slide-up"
          features={[
            {
              id: "craftsmanship",              label: "Premium",              title: "Master Craftsmanship",              items: [
                "Handcrafted by expert artisans",                "30+ years of experience",                "Ethically sourced materials",                "Quality guaranteed for life"
              ]
            },
            {
              id: "design",              label: "Exclusive",              title: "Timeless Design",              items: [
                "Custom design services available",                "Limited edition collections",                "Personal styling consultations",                "Bespoke jewelry creation"
              ]
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive 
          title="What Our Clients Say"
          description="Hear from those who have chosen Lumineux for their most cherished moments"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          testimonials={[
            {
              id: "1",              name: "Sarah Mitchell, Bride",              date: "Date: November 2024",              title: "Absolutely Perfect Engagement Ring",              quote: "The moment I saw my custom engagement ring, I knew it was made with love. Every detail is exquisite and it means so much to know it was crafted by true artisans.",              tag: "Engagement",              avatarSrc: "https://img.b2bpic.net/free-photo/smiling-young-professional-businesswoman-looking-upper-left-corner-with-hopeful-face-expression-standing-white_176420-41313.jpg",              avatarAlt: "Sarah Mitchell",              imageSrc: "https://img.b2bpic.net/free-photo/abstract-gold-chain-jewellery-presentation_23-2149599083.jpg",              imageAlt: "Engagement ring showcase"
            },
            {
              id: "2",              name: "James Chen, Groom",              date: "Date: October 2024",              title: "Exceptional Quality and Service",              quote: "I've never experienced such attention to detail. From the initial consultation to the final fitting, every step was perfect. My wife adores her necklace and recommends Lumineux to everyone.",              tag: "Customer",              avatarSrc: "https://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg",              avatarAlt: "James Chen",              imageSrc: "https://img.b2bpic.net/free-photo/queen-crown-still-life_23-2150409243.jpg",              imageAlt: "Pearl necklace collection"
            },
            {
              id: "3",              name: "Emma Rodriguez, Collector",              date: "Date: September 2024",              title: "Investment Pieces I Actually Wear",              quote: "I've been collecting Lumineux jewelry for five years. Each piece is wearable art that combines beauty with durability. The lifetime guarantee gives me complete peace of mind.",              tag: "Jewelry Collector",              avatarSrc: "https://img.b2bpic.net/free-photo/hopeful-young-manager-businesswoman-cross-arms-chest-smiling-looking-confident-like-real-professional-white-background_176420-47052.jpg",              avatarAlt: "Emma Rodriguez",              imageSrc: "https://img.b2bpic.net/free-photo/queen-crown-still-life_23-2150409249.jpg",              imageAlt: "Luxury bracelet collection"
            },
            {
              id: "4",              name: "Michael Thompson, Groom",              date: "Date: August 2024",              title: "Beyond Expectations",              quote: "I proposed with the Celestial Diamond Ring and it was the perfect choice. The quality is outstanding and the packaging made the moment even more special. Lumineux is worth every penny.",              tag: "Wedding",              avatarSrc: "https://img.b2bpic.net/free-photo/studio-portrait-successful-young-businesswoman_1262-5844.jpg",              avatarAlt: "Michael Thompson",              imageSrc: "https://img.b2bpic.net/free-photo/abstract-gold-chain-jewellery-presentation_23-2149599083.jpg",              imageAlt: "Diamond ring showcase"
            },
            {
              id: "5",              name: "Lisa Anderson, Mother",              date: "Date: July 2024",              title: "Perfect Heirloom Piece",              quote: "I purchased a bracelet as a gift for my daughter's graduation. The craftsmanship is incredible and it's something she'll treasure forever. Lumineux creates true heirlooms.",              tag: "Gift",              avatarSrc: "https://img.b2bpic.net/free-photo/smiley-business-woman-posing-outdoors-suit_23-2148603024.jpg",              avatarAlt: "Lisa Anderson",              imageSrc: "https://img.b2bpic.net/free-photo/queen-crown-still-life_23-2150409249.jpg",              imageAlt: "Bracelet gift package"
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq 
          ctaTitle="Get in Touch"
          ctaDescription="Have questions about our collections or want to schedule a consultation? Let's create something beautiful together."
          ctaButton={{ text: "Schedule Consultation", href: "#contact" }}
          ctaIcon={Phone}
          useInvertedBackground="invertDefault"
          animationType="slide-up"
          accordionAnimationType="smooth"
          showCard={true}
          faqs={[
            {
              id: "1",              title: "Can you create custom jewelry?",              content: "Absolutely! We specialize in custom designs. Our master artisans work with you to bring your vision to life. Contact us to schedule a free consultation."
            },
            {
              id: "2",              title: "What metals do you use?",              content: "We work with 18k gold, platinum, white gold, rose gold, and silver. All materials are ethically sourced and hallmarked for authenticity."
            },
            {
              id: "3",              title: "Do you offer lifetime warranty?",              content: "Yes! Every piece comes with our lifetime quality guarantee. We cover repairs, cleaning, and maintenance at no additional cost."
            },
            {
              id: "4",              title: "How long does a custom order take?",              content: "Custom pieces typically take 6-12 weeks depending on complexity. We'll provide a detailed timeline during your consultation."
            }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal 
          logoText="lumineux"
          logoLineHeight={1.1}
        />
      </div>
    </ThemeProvider>
  );
}