"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Award, Handshake, HelpCircle, MessageSquare, ShoppingCart, Star, TrendingUp, Users, Zap } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="small"
      sizing="mediumLarge"
      background="blurBottom"
      cardStyle="gradient-mesh"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="glass"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="FitGear"
          navItems={[
            { name: "Products", id: "products" },
            { name: "Categories", id: "features" },
            { name: "Why Us", id: "metrics" },
            { name: "Reviews", id: "testimonial" },
            { name: "FAQ", id: "faq" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboardSplit
          logoText="FITGEAR"
          description="Premium gym wears and equipment designed for champions. Elevate your fitness journey with quality gear that performs as hard as you do."
          background={{ variant: "blurBottom" }}
          buttons={[
            { text: "Shop Now", href: "#products" },
            { text: "Explore Categories", href: "#features" }
          ]}
          buttonAnimation="slide-up"
          layoutOrder="default"
          imageSrc="http://img.b2bpic.net/free-photo/girl-playing-fitness-gym_1150-7320.jpg"
          imageAlt="Athletes in premium FitGear workout clothing"
          frameStyle="browser"
          mediaAnimation="blur-reveal"
          ariaLabel="Hero section showcasing FitGear premium fitness gear"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardOne
          title="Featured Collection"
          description="Handpicked essentials to power your workouts. From footwear to apparel, discover gear trusted by fitness enthusiasts worldwide."
          tag="Best Sellers"
          tagIcon={Zap}
          tagAnimation="slide-up"
          products={[
            {
              id: "1",              name: "Pro Training Shoes",              price: "$129.99",              imageSrc: "http://img.b2bpic.net/free-photo/sneakers-dumbbells-gym_23-2147778533.jpg",              imageAlt: "Pro Training Shoes with advanced cushioning technology"
            },
            {
              id: "2",              name: "Moisture-Wicking Tank",              price: "$49.99",              imageSrc: "http://img.b2bpic.net/free-photo/pensive-curly-haired-woman-carried-rolled-kareamt-bottle-watter-dressed-beige-tracksuit-concentrated-away-stands-near-building_273609-55516.jpg",              imageAlt: "Performance Tank Top in multiple colors"
            },
            {
              id: "3",              name: "Premium Dumbbell Set",              price: "$249.99",              imageSrc: "http://img.b2bpic.net/free-photo/sports-equipment-dumbbells-gym_169016-59099.jpg",              imageAlt: "Adjustable Dumbbell Set with storage stand"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="blur-reveal"
          buttons={[
            { text: "View All Products", href: "#" }
          ]}
          buttonAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardSeven
          title="Why Choose FitGear"
          description="Discover what sets our products apart. From innovation to durability, we deliver performance you can trust."
          tag="Our Advantage"
          tagIcon={Award}
          tagAnimation="slide-up"
          features={[
            {
              id: 1,
              title: "Advanced Technology",              description: "Engineered with cutting-edge materials and smart design for maximum performance and comfort during intense workouts.",              imageSrc: "http://img.b2bpic.net/free-photo/closeup-athletic-woman-using-fitness-tracker-sunset_637285-9272.jpg",              imageAlt: "Advanced fitness wearable technology"
            },
            {
              id: 2,
              title: "Premium Materials",              description: "Crafted with high-quality fabrics and components that ensure durability, breathability, and confidence in every session.",              imageSrc: "http://img.b2bpic.net/free-photo/outdoor-portrait-attractive-athletic-male-dressed-black-sportswear-modern-building-background_613910-9047.jpg",              imageAlt: "Premium compression apparel"
            },
            {
              id: 3,
              title: "Complete Range",              description: "From apparel to equipment, we offer everything you need to build the ultimate home or gym setup.",              imageSrc: "http://img.b2bpic.net/free-photo/woman-dumbbells-workout-adult-sneakers-slim_1428-696.jpg",              imageAlt: "Complete fitness equipment collection"
            }
          ]}
          animationType="blur-reveal"
          buttons={[
            { text: "Learn More", href: "#" }
          ]}
          buttonAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardThree
          title="FitGear by Numbers"
          description="Trusted by fitness enthusiasts globally. Here's what our community has achieved."
          tag="Impact"
          tagIcon={TrendingUp}
          tagAnimation="slide-up"
          metrics={[
            {
              id: "1",              icon: Users,
              title: "Active Users",              value: "250K+"
            },
            {
              id: "2",              icon: ShoppingCart,
              title: "Products Sold",              value: "1.2M+"
            },
            {
              id: "3",              icon: Star,
              title: "Average Rating",              value: "4.8★"
            },
            {
              id: "4",              icon: Zap,
              title: "Daily Active",              value: "15K+"
            }
          ]}
          animationType="scale-rotate"
          buttons={[
            { text: "Join Our Community", href: "#" }
          ]}
          buttonAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonial" data-section="testimonial">
        <TestimonialCardTen
          title="Customer Stories"
          description="Hear from fitness enthusiasts who transformed their workouts with FitGear."
          tag="Reviews"
          tagIcon={MessageSquare}
          tagAnimation="slide-up"
          testimonials={[
            {
              id: "1",              title: "Game-Changing Quality",              quote: "The comfort and durability of FitGear products are unmatched. I've tried many brands, but these are the first I recommend to everyone at my gym.",              name: "Alex Johnson",              role: "Fitness Coach",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-athletic-man-black-background_613910-9870.jpg?_wi=1",              imageAlt: "Alex Johnson, Fitness Coach"
            },
            {
              id: "2",              title: "Perfect for Intense Training",              quote: "From running shoes to compression wear, FitGear delivers on its promise. My performance has noticeably improved since switching.",              name: "Maria Rodriguez",              role: "Marathon Runner",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-athletic-man-black-background_613910-9870.jpg?_wi=2",              imageAlt: "Maria Rodriguez, Marathon Runner"
            },
            {
              id: "3",              title: "Exceptional Value",              quote: "Premium quality without breaking the bank. FitGear offers the best value for serious athletes. Highly recommend!",              name: "James Chen",              role: "Crossfit Athlete",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-athletic-man-black-background_613910-9870.jpg?_wi=3",              imageAlt: "James Chen, Crossfit Athlete"
            },
            {
              id: "4",              title: "Transforms Your Workout",              quote: "The equipment and apparel work together seamlessly. I feel more confident and motivated during every session with FitGear.",              name: "Sarah Williams",              role: "Personal Trainer",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-athletic-man-black-background_613910-9870.jpg?_wi=4",              imageAlt: "Sarah Williams, Personal Trainer"
            },
            {
              id: "5",              title: "Durable and Reliable",              quote: "Six months in, everything still looks and feels brand new. This is the quality that keeps me coming back.",              name: "Michael Thompson",              role: "Gym Enthusiast",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-athletic-man-black-background_613910-9870.jpg?_wi=5",              imageAlt: "Michael Thompson, Gym Enthusiast"
            },
            {
              id: "6",              title: "Best Investment Yet",              quote: "Investing in FitGear was the best decision for my fitness journey. Worth every penny!",              name: "Emily Davis",              role: "Professional Athlete",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-athletic-man-black-background_613910-9870.jpg?_wi=6",              imageAlt: "Emily Davis, Professional Athlete"
            }
          ]}
          buttons={[
            { text: "Shop with Confidence", href: "#products" }
          ]}
          buttonAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitMedia
          title="Common Questions"
          description="Find answers to questions about our products, shipping, returns, and more."
          tag="Support"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          faqs={[
            {
              id: "1",              title: "What are your shipping times?",              content: "We offer standard shipping (5-7 business days) and express shipping (2-3 business days) to most locations. Orders are processed within 24 hours."
            },
            {
              id: "2",              title: "Do you offer returns and exchanges?",              content: "Yes! We offer a 30-day money-back guarantee on all purchases. If you're not completely satisfied, return the item in original condition for a full refund or exchange."
            },
            {
              id: "3",              title: "Are your products true to size?",              content: "Yes, our sizing is consistent with industry standards. We provide detailed size charts on each product page to help you find the perfect fit."
            },
            {
              id: "4",              title: "What's your warranty coverage?",              content: "Most of our equipment comes with a 1-year manufacturer warranty covering defects. Apparel is covered for 60 days against material defects."
            },
            {
              id: "5",              title: "How do I care for my FitGear products?",              content: "Care instructions vary by product. Check the label or product page for specific guidance. Most apparel should be machine washed in cold water and air dried."
            }
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/young-sports-people-training-morning-gym_1157-32133.jpg"
          imageAlt="Customer support team helping with fitness questions"
          mediaAnimation="blur-reveal"
          mediaPosition="left"
          faqsAnimation="blur-reveal"
          buttons={[
            { text: "Contact Support", href: "#" }
          ]}
          buttonAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Trusted by Top Brands"
          description="FitGear partners with industry leaders and athletes worldwide."
          tag="Partners"
          tagIcon={Handshake}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          logos={[
            "http://img.b2bpic.net/free-vector/abstract-silhouette-sport-logo-flat-design_23-2148220451.jpg",            "http://img.b2bpic.net/free-vector/abstract-silhouette-sport-logo-flat-design_23-2148220451.jpg",            "http://img.b2bpic.net/free-vector/gradient-colored-panther-logo-template_23-2149177344.jpg",            "http://img.b2bpic.net/free-vector/typography-logo-template_23-2150529526.jpg",            "http://img.b2bpic.net/free-vector/abstract-silhouette-sport-logo-flat-design_23-2148220451.jpg",            "http://img.b2bpic.net/free-vector/abstract-silhouette-sport-logo-flat-design_23-2148220451.jpg",            "http://img.b2bpic.net/free-vector/abstract-silhouette-sport-logo-flat-design_23-2148220451.jpg",            "http://img.b2bpic.net/free-vector/urban-shoes-logo_1051-1632.jpg"
          ]}
          names={[
            "Nike",            "Adidas",            "Puma",            "Under Armour",            "Reebok",            "Asics",            "New Balance",            "Saucony"
          ]}
          speed={40}
          showCard={true}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="FitGear"
          copyrightText="© 2025 FitGear | Premium Gym Wears & Equipment"
          columns={[
            {
              title: "Products",              items: [
                { label: "Apparel", href: "#products" },
                { label: "Footwear", href: "#products" },
                { label: "Equipment", href: "#products" },
                { label: "Accessories", href: "#products" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#" },
                { label: "Our Mission", href: "#" },
                { label: "Careers", href: "#" },
                { label: "Blog", href: "#" }
              ]
            },
            {
              title: "Support",              items: [
                { label: "Contact Us", href: "#" },
                { label: "Shipping Info", href: "#" },
                { label: "Returns", href: "#" },
                { label: "FAQ", href: "#faq" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Cookie Policy", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}
