"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import MediaAbout from "@/components/sections/about/MediaAbout";
import FeatureCardTwentySix from "@/components/sections/feature/FeatureCardTwentySix";
import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FaqBase from "@/components/sections/faq/FaqBase";
import FooterSimple from "@/components/sections/footer/FooterSimple";
import { CheckCircle, Hammer, Leaf, Users } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="compact"
      sizing="largeSmall"
      background="circleGradient"
      cardStyle="inset"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={[
            { name: "Shop", id: "products" },
            { name: "About", id: "about" },
            { name: "Features", id: "features" },
            { name: "Reviews", id: "testimonials" },
            { name: "FAQ", id: "faq" },
          ]}
          button={{ text: "Shop Now", href: "#products" }}
          brandName="StyleCo"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitKpi
          title="Premium Fashion for Every Occasion"
          description="Discover our curated collection of high-quality clothing that combines style, comfort, and sustainability. Shop timeless pieces designed for modern living."
          background={{ variant: "plain" }}
          kpis={[
            { value: "10,000+", label: "Happy Customers" },
            { value: "99.2%", label: "Quality Rating" },
            { value: "2-4 Days", label: "Fast Delivery" },
          ]}
          enableKpiAnimation={true}
          tag="New Collection"
          imageSrc="http://img.b2bpic.net/free-photo/medium-shot-man-sitting-outdoors_23-2149409728.jpg"
          imageAlt="Fashion collection showcase"
          mediaAnimation="slide-up"
          buttons={[
            { text: "Shop Collection", href: "#products" },
            { text: "Learn More", href: "#about" },
          ]}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardFour
          products={[
            {
              id: "1",              name: "Premium Cotton T-Shirt",              price: "$49.99",              variant: "White, Black, Navy · 5 Colors",              imageSrc: "http://img.b2bpic.net/free-photo/top-view-vintage-suitcase-with-casual-clothes_23-2148610424.jpg?_wi=1",              imageAlt: "Premium cotton t-shirt",              isFavorited: false,
            },
            {
              id: "2",              name: "Classic Denim Jeans",              price: "$89.99",              variant: "Deep Blue · Multiple Sizes",              imageSrc: "http://img.b2bpic.net/free-photo/view-beige-tone-colored-pants_23-2150773390.jpg?_wi=1",              imageAlt: "Classic denim jeans",              isFavorited: false,
            },
            {
              id: "3",              name: "Elegant Evening Dress",              price: "$149.99",              variant: "Black, Burgundy · Premium Fabric",              imageSrc: "http://img.b2bpic.net/free-photo/woman-with-bronze-make-up-black-golden-dress-stone-wall_343596-375.jpg?_wi=1",              imageAlt: "Elegant evening dress",              isFavorited: false,
            },
          ]}
          title="Featured Collections"
          description="Hand-picked selections of our most loved pieces this season"
          tag="Best Sellers"
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          buttons={[{ text: "View All Products", href: "#products" }]}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="about" data-section="about">
        <MediaAbout
          title="Crafted with Purpose"
          description="We believe fashion should be sustainable, accessible, and empowering. Since 2015, we've been dedicated to creating high-quality clothing that makes you feel confident in every moment. Our commitment to ethical production and innovative design sets us apart."
          tag="About StyleCo"
          imageSrc="http://img.b2bpic.net/free-photo/brown-gray-hallway-with-glass-windows_250224-246.jpg?_wi=1"
          imageAlt="StyleCo team and workspace"
          useInvertedBackground={false}
          buttons={[{ text: "Our Story", href: "#about" }]}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentySix
          title="Why Choose Us"
          description="Experience the difference quality and care make"
          features={[
            {
              title: "Sustainable Materials",              description: "100% ethically sourced fabrics and eco-friendly production methods",              imageSrc: "http://img.b2bpic.net/free-photo/top-view-vintage-suitcase-with-casual-clothes_23-2148610424.jpg?_wi=2",              imageAlt: "Sustainable fashion materials",              buttonIcon: Leaf,
            },
            {
              title: "Expert Craftsmanship",              description: "Each piece is carefully designed and manufactured to perfection",              imageSrc: "http://img.b2bpic.net/free-photo/view-beige-tone-colored-pants_23-2150773390.jpg?_wi=2",              imageAlt: "Expert clothing craftsmanship",              buttonIcon: Hammer,
            },
            {
              title: "Perfect Fit Guarantee",              description: "Free returns within 30 days if you're not completely satisfied",              imageSrc: "http://img.b2bpic.net/free-photo/woman-with-bronze-make-up-black-golden-dress-stone-wall_343596-375.jpg?_wi=2",              imageAlt: "Perfect fit clothing",              buttonIcon: CheckCircle,
            },
            {
              title: "Style Consultation",              description: "Personal styling advice from our fashion experts available 24/7",              imageSrc: "http://img.b2bpic.net/free-photo/brown-gray-hallway-with-glass-windows_250224-246.jpg?_wi=2",              imageAlt: "Fashion style consultation",              buttonIcon: Users,
            },
          ]}
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="Loved by Customers"
          description="Real feedback from people who trust our fashion"
          tag="Customer Reviews"
          testimonials={[
            {
              id: "1",              name: "Sarah Mitchell",              role: "Fashion Enthusiast",              company: "New York",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/beauty-style-fashion-age-concept-close-up-portrait-positive-elegant-60-year-old-female-with-gray-hair-wrinkled-face-posing-against-white-brick-wall_344912-1854.jpg",              imageAlt: "Sarah Mitchell"},
            {
              id: "2",              name: "James Chen",              role: "Business Professional",              company: "San Francisco",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-working-from-his-office-concept-focus-concentration_181624-26347.jpg",              imageAlt: "James Chen"},
            {
              id: "3",              name: "Emma Rodriguez",              role: "Creative Director",              company: "Los Angeles",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/business-woman-sitting-table_23-2148095754.jpg",              imageAlt: "Emma Rodriguez"},
            {
              id: "4",              name: "Michael Thompson",              role: "Entrepreneur",              company: "Austin",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/successful-senior-businessman-standing-window_1262-3120.jpg",              imageAlt: "Michael Thompson"},
            {
              id: "5",              name: "Lisa Anderson",              role: "Marketing Manager",              company: "Chicago",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-business-woman-with-sunglasses_23-2148603032.jpg",              imageAlt: "Lisa Anderson"},
            {
              id: "6",              name: "David Park",              role: "Tech Executive",              company: "Seattle",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiling-handsome-man_23-2148398270.jpg",              imageAlt: "David Park"},
          ]}
          gridVariant="uniform-all-items-equal"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
        />
      </div>

      <div id="socialproof" data-section="socialproof">
        <SocialProofOne
          title="Trusted by Fashion Communities"
          description="Featured in leading fashion publications and recommended by style influencers worldwide"
          textboxLayout="default"
          useInvertedBackground={false}
          names={[
            "Fashion Hub",            "Trend Co",            "Premium Wear",            "Style Vault",            "Outfit Lab",            "Wardrobe Pro",            "Chic Threads",            "Denim Collective"]}
          speed={40}
          showCard={true}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          faqs={[
            {
              id: "1",              title: "What is your return policy?",              content: "We offer a 30-day money-back guarantee on all items. If you're not completely satisfied, simply return your purchase for a full refund. We also cover return shipping costs for defective items."},
            {
              id: "2",              title: "How long does shipping take?",              content: "Standard shipping typically takes 3-5 business days. We also offer expedited 1-2 day shipping for an additional fee. All orders include free delivery on orders over $100."},
            {
              id: "3",              title: "Do you offer size exchanges?",              content: "Yes! If your item doesn't fit perfectly, we offer free size exchanges within 30 days of purchase. Contact our customer service team and we'll arrange everything for you."},
            {
              id: "4",              title: "Are your materials sustainable?",              content: "We're committed to sustainability. All our products are made from ethically sourced materials including organic cotton, recycled polyester, and eco-friendly dyes. We work with certified suppliers who meet strict environmental standards."},
            {
              id: "5",              title: "Can I get style advice?",              content: "Absolutely! Our fashion experts are available 24/7 via chat, email, or phone. We offer personalized styling consultations to help you find pieces that work best for your body type and lifestyle."},
          ]}
          title="Frequently Asked Questions"
          description="Find answers to common questions about our products and services"
          tag="Help & Support"
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={[
            {
              title: "Shop",              items: [
                { label: "New Arrivals", href: "#products" },
                { label: "Best Sellers", href: "#products" },
                { label: "Collections", href: "#products" },
                { label: "Sale", href: "#products" },
              ],
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Our Story", href: "#about" },
                { label: "Careers", href: "#" },
                { label: "Press", href: "#" },
              ],
            },
            {
              title: "Support",              items: [
                { label: "Contact Us", href: "#" },
                { label: "FAQ", href: "#faq" },
                { label: "Shipping Info", href: "#" },
                { label: "Size Guide", href: "#" },
              ],
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Return Policy", href: "#" },
                { label: "Accessibility", href: "#" },
              ],
            },
          ]}
          bottomLeftText="© 2025 StyleCo. All rights reserved."
          bottomRightText="Crafted with care for fashion lovers"
        />
      </div>
    </ThemeProvider>
  );
}