"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactText from '@/components/sections/contact/ContactText';
import FooterCard from '@/components/sections/footer/FooterCard';
import { CheckCircle, Instagram, Leaf, Mail, Sparkles, Twitter } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="smallMedium"
      sizing="largeSmall"
      background="fluid"
      cardStyle="layered-gradient"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="The Soap Shop"
          navItems={[
            { name: "Shop", id: "products" },
            { name: "About", id: "about" },
            { name: "Reviews", id: "testimonials" },
            { name: "FAQ", id: "faq" }
          ]}
          button={{
            text: "Contact",            href: "#contact"
          }}
          className="bg-background/80 backdrop-blur-md border border-accent/10"
          navItemClassName="text-foreground hover:text-accent transition-colors"
          buttonClassName="bg-primary-cta hover:bg-primary-cta/90"
          buttonTextClassName="text-primary-cta-text font-medium"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroOverlay
          title="Organic soap bars, made simple."
          description="Small-batch, plant-based bars with transparent ingredients and real results—without harsh detergents."
          tag="Free shipping over $35"
          tagAnimation="slide-up"
          imageSrc="http://img.b2bpic.net/free-photo/composition-bathroom-spa-objects_23-2147999934.jpg"
          imageAlt="Organic soap bars on bathroom counter"
          textPosition="bottom-left"
          showBlur={true}
          showDimOverlay={false}
          buttons={[
            { text: "Shop Best Sellers", href: "#products" },
            { text: "Learn About Ingredients", href: "#about" }
          ]}
          buttonAnimation="opacity"
          className="w-full"
          containerClassName="min-h-screen"
          titleClassName="text-5xl md:text-6xl font-bold text-white"
          descriptionClassName="text-lg md:text-xl text-white/90"
          tagClassName="text-sm font-medium text-white/80"
        />
      </div>

      <div id="trust" data-section="trust">
        <MetricCardSeven
          title="Why Choose The Soap Shop"
          description="Small-batch excellence backed by ingredient transparency and customer trust"
          metrics={[
            {
              id: "1",              value: "100%",              title: "Plant-Based Ingredients",              items: [
                "No parabens or phthalates",                "Botanically sourced oils",                "Essential oil scents"
              ]
            },
            {
              id: "2",              value: "30",              title: "Day Satisfaction Guarantee",              items: [
                "Love your bar or full refund",                "No questions asked",                "Fast processing"
              ]
            },
            {
              id: "3",              value: "1-2",              title: "Business Days to Ship",              items: [
                "Fast tracked orders",                "Tracked shipping included",                "Sustainable packaging"
              ]
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          uniformGridCustomHeightClasses="min-h-80"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardThree
          title="Best Sellers"
          description="Handpicked favorites loved by our community"
          tag="Best Sellers"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          products={[
            {
              id: "1",              name: "Oat + Honey (Gentle)",              price: "$8.00",              imageSrc: "http://img.b2bpic.net/free-photo/natural-beautiful-spa-cosmetics-body-care_169016-5048.jpg",              imageAlt: "Oat and Honey soap bar",              initialQuantity: 1,
              isFavorited: false
            },
            {
              id: "2",              name: "Charcoal + Tea Tree (Clarifying)",              price: "$9.00",              imageSrc: "http://img.b2bpic.net/free-photo/dish-cleaning-tools-desk_23-2148116105.jpg",              imageAlt: "Charcoal and Tea Tree soap bar",              initialQuantity: 1,
              isFavorited: false
            },
            {
              id: "3",              name: "Lavender + Shea (Calming)",              price: "$9.00",              imageSrc: "http://img.b2bpic.net/free-photo/colorful-soaps-bouquet-lavender_23-2148317682.jpg",              imageAlt: "Lavender and Shea soap bar",              initialQuantity: 1,
              isFavorited: false
            },
            {
              id: "4",              name: "Citrus + Calendula (Brightening)",              price: "$9.00",              imageSrc: "http://img.b2bpic.net/free-photo/orange-soap-with-fresh-orange-dark-background_1150-45538.jpg",              imageAlt: "Citrus and Calendula soap bar",              initialQuantity: 1,
              isFavorited: false
            }
          ]}
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          uniformGridCustomHeightClasses="min-h-96"
        />
      </div>

      <div id="about" data-section="about">
        <TestimonialAboutCard
          tag="Our Philosophy"
          tagIcon={Leaf}
          tagAnimation="slide-up"
          title="Ingredient transparency. Skin-friendly formulas. Small-batch quality."
          description="The Soap Shop"
          subdescription="Where wellness meets honesty"
          icon={CheckCircle}
          imageSrc="http://img.b2bpic.net/free-photo/composition-bathroom-spa-objects_23-2147999934.jpg"
          imageAlt="Soap shop ingredients and products"
          mediaAnimation="blur-reveal"
          useInvertedBackground={false}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentyThree
          title="What Makes Us Different"
          description="Three core commitments that set The Soap Shop apart from mass-produced alternatives"
          tag="Quality Standards"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          features={[
            {
              id: "1",              title: "No Mystery Blends",              tags: ["Transparency", "INCI Listed"],
              imageSrc: "http://img.b2bpic.net/free-photo/natural-beautiful-spa-cosmetics-body-care_169016-5048.jpg",              imageAlt: "Ingredient list transparency"
            },
            {
              id: "2",              title: "Gentle Cleansing",              tags: ["Skin-Friendly", "No Harsh Detergents"],
              imageSrc: "http://img.b2bpic.net/free-photo/colorful-soaps-bouquet-lavender_23-2148317682.jpg",              imageAlt: "Gentle soap lather"
            },
            {
              id: "3",              title: "Small-Batch Made",              tags: ["Quality Control", "Consistency"],
              imageSrc: "http://img.b2bpic.net/free-photo/orange-soap-with-fresh-orange-dark-background_1150-45538.jpg",              imageAlt: "Small batch production"
            }
          ]}
          animationType="slide-up"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive
          title="What Our Customers Say"
          description="Real feedback from people who've switched to The Soap Shop"
          tag="Reviews"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          testimonials={[
            {
              id: "1",              name: "Sarah Chen, Sensitive Skin",              date: "Date: 15 January 2025",              title: "Finally, a soap that doesn't irritate my skin!",              quote: "I've tried so many brands and nothing worked until I discovered The Soap Shop. After switching to their Oat + Honey bar, my skin feels hydrated and calm. No more red patches. I'm a customer for life.",              tag: "Verified Buyer",              avatarSrc: "http://img.b2bpic.net/free-photo/real-professional-smiling-businesswoman-looking-confident-determined-face-expression-standing-suit-white-background_1258-123234.jpg",              avatarAlt: "Sarah Chen",              imageSrc: "http://img.b2bpic.net/free-photo/real-professional-smiling-businesswoman-looking-confident-determined-face-expression-standing-suit-white-background_1258-123234.jpg",              imageAlt: "Sarah Chen testimonial"
            },
            {
              id: "2",              name: "Michael Rodriguez, Daily Use",              date: "Date: 22 January 2025",              title: "Transparent ingredients I can actually trust.",              quote: "The ingredient list is refreshingly honest. I can pronounce everything. The Charcoal + Tea Tree bar has become my daily go-to, and knowing exactly what I'm putting on my body makes all the difference.",              tag: "Verified Buyer",              avatarSrc: "http://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg",              avatarAlt: "Michael Rodriguez",              imageSrc: "http://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg",              imageAlt: "Michael Rodriguez testimonial"
            },
            {
              id: "3",              name: "Emma Wilson, Eco-Conscious",              date: "Date: 28 January 2025",              title: "Small-batch quality you can feel.",              quote: "The difference between mass-produced soap and The Soap Shop is night and day. The bars last longer, lather better, and I love supporting a company that actually cares about quality over profit.",              tag: "Verified Buyer",              avatarSrc: "http://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg",              avatarAlt: "Emma Wilson",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg",              imageAlt: "Emma Wilson testimonial"
            },
            {
              id: "4",              name: "James Patterson, Minimalist",              date: "Date: 5 February 2025",              title: "Beautiful packaging, even better product.",              quote: "The Lavender + Shea bar is my favorite. Simple, elegant, effective. The 30-day guarantee showed me they stand behind their work. Why would I go anywhere else?",              tag: "Verified Buyer",              avatarSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1674.jpg",              avatarAlt: "James Patterson",              imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1674.jpg",              imageAlt: "James Patterson testimonial"
            },
            {
              id: "5",              name: "Priya Kapoor, Wellness",              date: "Date: 10 February 2025",              title: "Premium feel at an honest price.",              quote: "For the quality and care that goes into each bar, the pricing is surprisingly fair. No hidden markup, no false claims. The Citrus + Calendula has become a staple in my routine.",              tag: "Verified Buyer",              avatarSrc: "http://img.b2bpic.net/free-photo/happy-ethnic-executive-woman-looking-camera_1098-20037.jpg",              avatarAlt: "Priya Kapoor",              imageSrc: "http://img.b2bpic.net/free-photo/happy-ethnic-executive-woman-looking-camera_1098-20037.jpg",              imageAlt: "Priya Kapoor testimonial"
            },
            {
              id: "6",              name: "David Thompson, Skeptic",              date: "Date: 14 February 2025",              title: "Converts skeptics into loyal customers.",              quote: "I was genuinely skeptical about organic soap. Then I tried it. The Unscented Shea bar proved that simple, honest products really do work better. Impressed.",              tag: "Verified Buyer",              avatarSrc: "http://img.b2bpic.net/free-photo/smiling-african-businessman-wearing-suit-headshot-vertical-portrait-with-team_1163-3924.jpg",              avatarAlt: "David Thompson",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-african-businessman-wearing-suit-headshot-vertical-portrait-with-team_1163-3924.jpg",              imageAlt: "David Thompson testimonial"
            }
          ]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardThree
          title="Build a Bundle & Save"
          description="Mix and match your favorite bars and enjoy instant savings"
          tag="Smart Savings"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          animationType="slide-up"
          plans={[
            {
              id: "single",              price: "$8-9",              name: "Single Bar",              buttons: [
                { text: "Shop Single", href: "#products" }
              ],
              features: [
                "One premium soap bar",                "Free shipping on $35+ orders",                "30-day satisfaction guarantee"
              ]
            },
            {
              id: "bundle-3",              badge: "Best Value",              badgeIcon: Sparkles,
              price: "Save 10%",              name: "3-Bar Bundle",              buttons: [
                { text: "Create Bundle", href: "#products" }
              ],
              features: [
                "Pick any 3 bars",                "10% instant discount",                "Always includes free shipping"
              ]
            },
            {
              id: "bundle-5",              price: "Save 15%",              name: "5-Bar Bundle",              buttons: [
                { text: "Create Bundle", href: "#products" }
              ],
              features: [
                "Pick any 5 bars",                "15% instant discount",                "Perfect for gifting"
              ]
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Everything you need to know about The Soap Shop and our products"
          tag="Help Center"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "What makes your soap organic?",              content: "All of our soaps are crafted from 100% plant-based oils, botanical extracts, and essential oils. We never use synthetic fragrances, parabens, phthalates, or harsh detergents. Every ingredient is listed on our website using proper INCI nomenclature so you know exactly what's on your skin."
            },
            {
              id: "2",              title: "How long does a bar typically last?",              content: "Our small-batch bars are dense and long-lasting. A single bar typically lasts 4-6 weeks with daily use when stored properly (keep it dry between uses). This longevity makes them excellent value compared to mass-produced alternatives that dissolve quickly."
            },
            {
              id: "3",              title: "Do you ship internationally?",              content: "Currently, we ship within the United States with fast, tracked shipping. Orders ship within 1-2 business days. For international inquiries, please contact us directly and we'll see what we can arrange."
            },
            {
              id: "4",              title: "What's your return policy?",              content: "We offer a 30-day satisfaction guarantee. If you don't love your bar, contact us within 30 days for a full refund. No questions asked. We stand behind our product quality and want you to be completely happy."
            },
            {
              id: "5",              title: "Are your soaps suitable for sensitive skin?",              content: "Many customers with sensitive skin love our bars, especially the Oat + Honey and Unscented Shea varieties. However, we recommend checking the ingredient list for any personal allergens. Our transparent ingredient lists make this easy. When in doubt, start with our gentlest option or test a small area first."
            },
            {
              id: "6",              title: "How should I store my soap bar?",              content: "Keep your bar dry between uses. We recommend using a well-draining soap dish or keeping it on a washcloth. Proper drainage extends the life of your bar significantly. Store in a cool, dry place away from direct heat or humidity."
            },
            {
              id: "7",              title: "Do you offer gift wrapping or bundles?",              content: "Absolutely! Our 3-bar and 5-bar bundles are perfect for gifting. You can mix and match any scents. We package everything beautifully and can include a personalized note if you'd like. Perfect for eco-conscious gift-giving."
            },
            {
              id: "8",              title: "What's the shelf life of a soap bar?",              content: "Our soaps maintain their quality for 2-3 years when stored properly in a cool, dry place. Since they don't contain water-based preservatives, they're naturally stable. Use within the date on the package for optimal freshness."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Join our community and get 10% off your first order. Plus, restock alerts for limited batch drops."
          animationType="entrance-slide"
          buttons={[
            { text: "Get 10% Off", href: "mailto:hello@thesoapshop.com" },
            { text: "Contact Us", href: "mailto:hello@thesoapshop.com" }
          ]}
          background={{ variant: "plain" }}
          useInvertedBackground={true}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="The Soap Shop"
          copyrightText="© 2025 The Soap Shop. Small-batch organic soap bars."
          socialLinks={[
            { icon: Instagram, href: "https://instagram.com/thesoapshop", ariaLabel: "Instagram" },
            { icon: Twitter, href: "https://twitter.com/thesoapshop", ariaLabel: "Twitter" },
            { icon: Mail, href: "mailto:hello@thesoapshop.com", ariaLabel: "Email" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}