"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Sparkles, Leaf, Beaker, Heart, Star, Zap, Package, Crown, Gift, HelpCircle, Phone } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="slide-background"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="mediumLarge"
      sizing="largeSmall"
      background="floatingGradient"
      cardStyle="gradient-bordered"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="Luxé Botanicals"
          navItems={[
            { name: "About", id: "about" },
            { name: "Products", id: "products" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Pricing", id: "pricing" },
            { name: "Contact", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplit
          title="Luxurious Skincare, Naturally Beautiful"
          description="Experience the transformation of premium botanical skincare. Crafted with the finest natural ingredients, our formulations deliver visible results while honoring your skin's delicate balance."
          tag="Pure Beauty"
          tagIcon={Sparkles}
          background={{ variant: "glowing-orb" }}
          imageSrc="https://img.b2bpic.net/free-photo/high-angle-plant-selfcare-products_23-2149249586.jpg"
          imageAlt="Premium skincare products collection"
          imagePosition="right"
          buttons={[
            { text: "Explore Collection", href: "products" },
            { text: "Learn More", href: "about" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <SplitAbout
          title="Our Story of Excellence"
          description="Founded on a commitment to purity and efficacy, Luxé Botanicals brings together centuries of botanical wisdom with modern skincare science. Every product is meticulously formulated to deliver transformative results."
          tag="About Us"
          tagIcon={Leaf}
          imageSrc="https://img.b2bpic.net/free-photo/gua-sha-face-roller-red-flower-high-angle_23-2149357114.jpg"
          imageAlt="Our skincare laboratory and formulation process"
          imagePosition="right"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          bulletPoints={[
            {
              title: "Natural Ingredients",              description: "Sourced from pristine botanical regions worldwide, each ingredient is selected for its proven efficacy and purity standards.",              icon: Leaf
            },
            {
              title: "Scientific Innovation",              description: "Our research-backed formulations combine traditional botanicals with cutting-edge skincare technology for optimal results.",              icon: Beaker
            },
            {
              title: "Cruelty-Free Commitment",              description: "We never test on animals and use only ethical, sustainable sourcing practices across our entire product line.",              icon: Heart
            },
            {
              title: "Visible Transformation",              description: "Customers report noticeable improvements in skin texture, radiance, and overall complexion within weeks of use.",              icon: Star
            }
          ]}
          buttons={[
            { text: "Discover Our Philosophy", href: "#" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardSeven
          title="The Power of Our Signature Lines"
          description="Each product category targets specific skincare concerns with precision-formulated, luxury botanical blends."
          tag="Key Benefits"
          tagIcon={Zap}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="blur-reveal"
          features={[
            {
              id: 1,
              title: "Hydra Luxe Collection",              description: "Deep moisture restoration infused with hyaluronic acid and rose quartz extract. Plumps skin and restores elasticity for a dewy, youthful glow.",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-fair-skinned-young-women-s-hands-holding-jars-organic-body-creams-care-moisturizing-concept_197531-31493.jpg",              imageAlt: "Hydra Luxe hydrating skincare line"
            },
            {
              id: 2,
              title: "Timeless Renewal Serum",              description: "Advanced anti-aging formula with peptides and botanical retinol alternatives. Reduces fine lines and boosts collagen production naturally.",              imageSrc: "https://img.b2bpic.net/free-photo/top-view-tropical-leaves-vibrant-background-summer-flat-lay-composition_1182-2695.jpg",              imageAlt: "Timeless Renewal anti-aging serum"
            },
            {
              id: 3,
              title: "Radiance Boost Essence",              description: "Illuminating essence with vitamin C and golden iris extract. Transforms dull complexions into luminous, radiant skin.",              imageSrc: "https://img.b2bpic.net/free-photo/selfcare-products-arrangement_23-2149249587.jpg",              imageAlt: "Radiance Boost brightening essence"
            }
          ]}
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardTwo
          title="Our Signature Products"
          description="Carefully curated skincare solutions designed to address every skin concern with luxury and efficacy."
          tag="Featured Products"
          tagIcon={Package}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="slide-up"
          gridVariant="three-columns-all-equal-width"
          products={[
            {
              id: "1",              brand: "Luxé Botanicals",              name: "Rose Petal Hydration Serum",              price: "$85.00",              rating: 5,
              reviewCount: "1.2k",              imageSrc: "https://img.b2bpic.net/free-photo/selfcare-product-bottle-with-flower_23-2149249545.jpg",              imageAlt: "Rose Petal Hydration Serum"
            },
            {
              id: "2",              brand: "Luxé Botanicals",              name: "Silk Renewal Night Cream",              price: "$120.00",              rating: 5,
              reviewCount: "980",              imageSrc: "https://img.b2bpic.net/free-photo/make-up-concept-with-serum-bottles_23-2149030375.jpg",              imageAlt: "Silk Renewal Night Cream"
            },
            {
              id: "3",              brand: "Luxé Botanicals",              name: "Gentle Botanical Cleanser",              price: "$45.00",              rating: 5,
              reviewCount: "1.5k",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-skin-regeneration-products_23-2151242151.jpg",              imageAlt: "Gentle Botanical Cleanser"
            },
            {
              id: "4",              brand: "Luxé Botanicals",              name: "Crystal Infusion Face Mask",              price: "$65.00",              rating: 5,
              reviewCount: "870",              imageSrc: "https://img.b2bpic.net/free-photo/arrangement-with-plant-serum_23-2148899423.jpg",              imageAlt: "Crystal Infusion Face Mask"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive
          title="Loved by Beauty Enthusiasts"
          description="Real transformations from customers who've experienced the power of our premium botanical skincare."
          tag="Customer Stories"
          tagIcon={Heart}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          testimonials={[
            {
              id: "1",              name: "Emma Richardson, Beauty Influencer",              date: "Date: 15 November 2024",              title: "A Game-Changer for My Sensitive Skin",              quote: "I've tried countless luxury skincare brands, but Luxé Botanicals is the only one that respects my sensitive skin while delivering visible results. My complexion has never looked better.",              tag: "Premium Member",              avatarSrc: "https://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67039.jpg",              avatarAlt: "Emma Richardson",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67039.jpg"
            },
            {
              id: "2",              name: "Sophie Chen, Dermatologist",              date: "Date: 8 November 2024",              title: "Science Meets Nature Beautifully",              quote: "As a dermatologist, I'm impressed by the clinical backing behind these formulations. They're not just luxurious—they're genuinely effective and safe for all skin types.",              tag: "Professional",              avatarSrc: "https://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67053.jpg",              avatarAlt: "Sophie Chen",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67053.jpg"
            },
            {
              id: "3",              name: "Victoria Moreau, Wellness Coach",              date: "Date: 1 November 2024",              title: "Pure Luxury, Pure Results",              quote: "The sensory experience of using these products is absolutely divine. But what truly impresses me is how quickly I saw improvements in my skin texture and radiance.",              tag: "Wellness Expert",              avatarSrc: "https://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67131.jpg",              avatarAlt: "Victoria Moreau",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67131.jpg"
            },
            {
              id: "4",              name: "Isabella Torres, CEO",              date: "Date: 25 October 2024",              title: "Confidence in Every Application",              quote: "This skincare line has become my secret weapon for looking polished and radiant. The quality is evident in every aspect, from packaging to results.",              tag: "Executive",              avatarSrc: "https://img.b2bpic.net/free-photo/closeup-relaxed-serious-woman-leaning-wall_1262-1750.jpg",              avatarAlt: "Isabella Torres",              imageSrc: "https://img.b2bpic.net/free-photo/closeup-relaxed-serious-woman-leaning-wall_1262-1750.jpg"
            },
            {
              id: "5",              name: "Natasha Petrova, Yoga Instructor",              date: "Date: 18 October 2024",              title: "Holistic Beauty at Its Finest",              quote: "I love that these products align with my wellness philosophy. They're natural, ethical, and the results speak for themselves. My skin has never felt more balanced.",              tag: "Wellness Advocate",              avatarSrc: "https://img.b2bpic.net/free-photo/relaxed-content-middle-aged-woman-leaning-wall_1262-1881.jpg",              avatarAlt: "Natasha Petrova",              imageSrc: "https://img.b2bpic.net/free-photo/relaxed-content-middle-aged-woman-leaning-wall_1262-1881.jpg"
            },
            {
              id: "6",              name: "Jade Mitchell, Makeup Artist",              date: "Date: 12 October 2024",              title: "The Perfect Skincare Foundation",              quote: "My clients consistently comment on how flawless their skin looks with Luxé Botanicals. It's become the foundation of my professional skincare recommendations.",              tag: "Professional Artist",              avatarSrc: "https://img.b2bpic.net/free-photo/closeup-smiling-adult-woman-leaning-wall_1262-1759.jpg",              avatarAlt: "Jade Mitchell",              imageSrc: "https://img.b2bpic.net/free-photo/closeup-smiling-adult-woman-leaning-wall_1262-1759.jpg"
            }
          ]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardThree
          title="Simple, Transparent Pricing"
          description="Choose the plan that best fits your skincare journey. All plans include free shipping and access to our beauty consultants."
          tag="Flexible Plans"
          tagIcon={Gift}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="slide-up"
          plans={[
            {
              id: "starter",              price: "$45",              name: "Starter Essentials",              buttons: [
                { text: "Get Started", href: "#" },
                { text: "Learn More", href: "#" }
              ],
              features: [
                "Gentle Botanical Cleanser",                "Rose Petal Hydration Serum",                "Free shipping",                "Email support",                "Beauty guides"
              ]
            },
            {
              id: "premium",              badge: "Most Popular",              badgeIcon: Crown,
              price: "$145",              name: "Complete Skincare Ritual",              buttons: [
                { text: "Get Started", href: "#" },
                { text: "Learn More", href: "#" }
              ],
              features: [
                "All Starter products",                "Silk Renewal Night Cream",                "Crystal Infusion Face Mask",                "Priority support",                "Monthly skincare tips",                "15% discount on future orders"
              ]
            },
            {
              id: "luxury",              price: "$245",              name: "Luxury Transformation",              buttons: [
                { text: "Get Started", href: "#" },
                { text: "Learn More", href: "#" }
              ],
              features: [
                "All Premium products",                "Timeless Renewal Serum",                "Radiance Boost Essence",                "Exclusive VIP support",                "Quarterly consultation calls",                "Early access to new launches",                "25% discount on all products"
              ]
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Find answers to common questions about our products, ingredients, and skincare practices."
          tag="Help & Support"
          tagIcon={HelpCircle}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "What makes your skincare products premium?",              content: "Our products are formulated with carefully selected botanical ingredients sourced from pristine regions worldwide. We combine traditional skincare wisdom with modern scientific research, ensuring every product delivers visible, measurable results while respecting your skin's natural balance."
            },
            {
              id: "2",              title: "Are your products suitable for sensitive skin?",              content: "Yes! All our products are hypoallergenic and dermatologist-tested. We avoid harsh chemicals, sulfates, and synthetic fragrances. However, we recommend patch testing first, especially if you have extremely reactive skin. Our beauty consultants can recommend the best products for your specific skin type."
            },
            {
              id: "3",              title: "How long before I see results?",              content: "Most customers notice improvements within 2-4 weeks of consistent use. However, skin transformation is gradual. For optimal results, use products as directed and allow 8-12 weeks to see significant changes in texture, radiance, and overall complexion quality."
            },
            {
              id: "4",              title: "Can I use multiple products together?",              content: "Absolutely! Our products are designed to work synergistically. For best results, follow this order: cleanser, serum, essence, moisturizer. Start with one new product at a time to allow your skin to adjust, then gradually introduce others into your routine."
            },
            {
              id: "5",              title: "Do you offer returns or guarantees?",              content: "We offer a 60-day satisfaction guarantee on all products. If you're not completely happy with your purchase, we'll provide a full refund or exchange. We stand behind the quality and efficacy of every product in our collection."
            },
            {
              id: "6",              title: "Are your products cruelty-free and sustainable?",              content: "Yes, 100%! We never test on animals and all our ingredients are ethically sourced. Our packaging is recyclable and made from sustainable materials. We're committed to environmental responsibility at every step of our production process."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="Beauty Consultation"
          ctaDescription="Get personalized skincare advice from our beauty experts. Book a free consultation call to find your perfect skincare routine."
          ctaIcon={Phone}
          ctaButton={{ text: "Book Your Consultation", href: "#" }}
          useInvertedBackground="invertDefault"
          animationType="slide-up"
          accordionAnimationType="smooth"
          faqs={[
            {
              id: "1",              title: "How do I choose the right products for my skin type?",              content: "Our beauty consultants can assess your skin during a personalized consultation. They consider your skin type, concerns, and lifestyle to recommend the perfect combination of products tailored specifically to your needs."
            },
            {
              id: "2",              title: "What if I have a reaction to a product?",              content: "Safety is our priority. If you experience any adverse reaction, stop using the product immediately and contact our customer support team. We'll help identify the cause and provide suitable alternatives or a full refund."
            },
            {
              id: "3",              title: "Can I purchase products without a subscription?",              content: "Yes! All our pricing plans include the option to purchase products one-time without any commitment to recurring subscriptions. You can choose what works best for your budget and lifestyle."
            }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="Luxé Botanicals"
          copyrightText="© 2025 Luxé Botanicals. All rights reserved. Crafted with care."
          columns={[
            {
              title: "Products",              items: [
                { label: "Hydra Luxe Collection", href: "products" },
                { label: "Timeless Renewal", href: "products" },
                { label: "Radiance Boost", href: "products" },
                { label: "All Products", href: "products" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "about" },
                { label: "Our Story", href: "about" },
                { label: "Sustainability", href: "#" },
                { label: "Careers", href: "#" }
              ]
            },
            {
              title: "Support",              items: [
                { label: "Contact Us", href: "contact" },
                { label: "FAQ", href: "#" },
                { label: "Shipping & Returns", href: "#" },
                { label: "Beauty Tips", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}