"use client";

import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroSplitLarge from '@/components/sections/hero/HeroSplitLarge';
import ProductCardSix from '@/components/sections/product/ProductCardSix';
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Sparkles, Award, Zap, Heart, HelpCircle, Mail } from "lucide-react";

export default function FidgetLanding() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="medium"
      sizing="largeSmallSizeMediumTitles"
      background="fluid"
      cardStyle="spotlight"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="minimal"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="FidgetHub"
          navItems={[
            { name: "Products", id: "products" },
            { name: "Benefits", id: "benefits" },
            { name: "Reviews", id: "reviews" },
            { name: "FAQ", id: "faq" }
          ]}
          button={{
            text: "Shop Now",
            href: "#products"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitLarge
          title="Find Your Perfect Fidget Toy"
          description="Explore our premium collection of fidget toys designed to help you focus, reduce stress, and keep your hands engaged. From spinners to poppers, discover your new favorite stress-relief companion."
          tag="Stress Relief"
          tagIcon={Sparkles}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_35a7P1i3U8nbKvxlC9pMeozlemI/uploaded-1767572242568-cyecnnva.jpg"
          imageAlt="Colorful fidget toys collection"
          buttons={[
            {
              text: "Shop Fidgets",
              href: "#products"
            },
            {
              text: "Learn More",
              href: "#benefits"
            }
          ]}
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardSix
          title="Featured Fidgets"
          description="Handpicked fidget toys that deliver the perfect amount of sensory stimulation and stress relief"
          tag="Best Sellers"
          tagIcon={Award}
          products={[
            {
              id: "1",
              name: "Classic Spinner",
              price: "$12.99",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767571550631-kd1tq4d7.jpg",
              imageAlt: "Spinning fidget toy in rainbow colors"
            },
            {
              id: "2",
              name: "Pop It Bubble",
              price: "$14.99",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767571551259-slm104u2.jpg",
              imageAlt: "Colorful pop it fidget toy"
            },
            {
              id: "3",
              name: "Infinity Cube",
              price: "$16.99",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767571551644-do0zlpxs.jpg",
              imageAlt: "Geometric infinity cube fidget toy"
            },
            {
              id: "4",
              name: "Tangle Fidget",
              price: "$13.99",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767571551975-hr3887wz.jpg",
              imageAlt: "Twisted string fidget toy"
            }
          ]}
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          buttons={[
            {
              text: "View All Products",
              href: "https://example.com/shop"
            }
          ]}
        />
      </div>

      <div id="benefits" data-section="benefits">
        <FeatureCardTwentyOne
          title="Why Fidget Toys Work"
          description="Discover the science and benefits behind our fidget toy collection"
          tag="Science-Backed"
          tagIcon={Zap}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767571550212-2vi50p5w.jpg"
          imageAlt="Fidget toys demonstrating sensory engagement"
          accordionItems={[
            {
              id: "1",
              title: "Boosts Focus & Concentration",
              content: "Fidget toys provide subtle sensory input that helps redirect nervous energy, allowing your brain to focus better on tasks. Perfect for students, professionals, and anyone needing mental clarity."
            },
            {
              id: "2",
              title: "Reduces Stress & Anxiety",
              content: "The repetitive motion and tactile feedback from fidgeting activates your parasympathetic nervous system, promoting relaxation and calming your mind during stressful moments."
            },
            {
              id: "3",
              title: "Improves Sensory Awareness",
              content: "Different fidget toys offer unique textures and sensations that enhance sensory processing and provide therapeutic benefits for people with ADHD, autism, or sensory needs."
            },
            {
              id: "4",
              title: "Portable & Always Available",
              content: "Keep your favorite fidget toy in your pocket, backpack, or desk. Our collection is compact and convenient, perfect for on-the-go stress relief anytime, anywhere."
            }
          ]}
          useInvertedBackground="noInvert"
          mediaPosition="left"
          buttons={[
            {
              text: "Explore Collection",
              href: "#products"
            }
          ]}
        />
      </div>

      <div id="reviews" data-section="reviews">
        <TestimonialCardThirteen
          title="What Our Customers Say"
          description="Join thousands of satisfied fidget enthusiasts who've found their perfect stress relief companion"
          tag="Customer Reviews"
          tagIcon={Heart}
          testimonials={[
            {
              id: "1",
              name: "Sarah Mitchell",
              handle: "@sarahmitchell",
              testimonial: "These fidget toys have completely transformed my work productivity. I can focus so much better now!",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767571552727-fc6rxffy.jpg",
              imageAlt: "Sarah Mitchell portrait"
            },
            {
              id: "2",
              name: "James Chen",
              handle: "@jameschen",
              testimonial: "The quality is amazing and they arrive super fast. Best stress relief investment I've made.",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767571552955-rehtta2h.jpg",
              imageAlt: "James Chen portrait"
            },
            {
              id: "3",
              name: "Emma Rodriguez",
              handle: "@emmarod",
              testimonial: "My anxiety levels have noticeably decreased since I started using these fidgets. Highly recommend!",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767571553395-u5g7j0xj.jpg",
              imageAlt: "Emma Rodriguez portrait"
            },
            {
              id: "4",
              name: "Michael Park",
              handle: "@mikepark",
              testimonial: "Perfect for ADHD management. The variety of textures keeps things interesting and engaging.",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767571553876-i3tgkgjn.jpg",
              imageAlt: "Michael Park portrait"
            },
            {
              id: "5",
              name: "Lisa Thompson",
              handle: "@lisathompson",
              testimonial: "I bought one for my daughter and she won't put it down. Great quality at reasonable prices!",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767571554219-tmqqo7ai.jpg",
              imageAlt: "Lisa Thompson portrait"
            },
            {
              id: "6",
              name: "David Kumar",
              handle: "@davidkumar",
              testimonial: "Customer service is exceptional and products are exactly as described. Will definitely order again.",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767571554524-d46mqc7j.jpg",
              imageAlt: "David Kumar portrait"
            }
          ]}
          showRating={true}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Everything you need to know about our fidget toys and services"
          tag="Help Center"
          tagIcon={HelpCircle}
          faqs={[
            {
              id: "1",
              title: "Are fidget toys suitable for all ages?",
              content: "Yes! Our fidget toys are designed for ages 6 and up. We have collections specifically curated for children, teens, and adults. Always check individual product age recommendations."
            },
            {
              id: "2",
              title: "Do fidget toys really help with ADHD?",
              content: "Many users with ADHD report improved focus and reduced anxiety when using fidget toys. While they're not a medical treatment, they can be a helpful complementary tool for managing symptoms."
            },
            {
              id: "3",
              title: "How durable are your fidget toys?",
              content: "Our products are made with premium materials built to last. Most customers report their fidgets lasting 1-2+ years with normal use. We offer a 30-day satisfaction guarantee."
            },
            {
              id: "4",
              title: "What's your return policy?",
              content: "We offer a 30-day money-back guarantee on all products. If you're not satisfied for any reason, simply return your fidget toy for a full refund or exchange."
            },
            {
              id: "5",
              title: "Are these toys safe for children?",
              content: "All our fidget toys meet safety standards and are tested for harmful materials. Small parts products are labeled appropriately. Always supervise young children during use."
            },
            {
              id: "6",
              title: "Do you offer bulk orders?",
              content: "Yes! We offer special pricing for bulk orders, perfect for classrooms, offices, or therapists. Contact our sales team for custom quotes and wholesale pricing options."
            },
            {
              id: "7",
              title: "How quickly will my order arrive?",
              content: "Most orders ship within 1-2 business days. Standard shipping takes 5-7 business days. We also offer expedited shipping options for faster delivery."
            },
            {
              id: "8",
              title: "Do you have any subscription options?",
              content: "Yes! Subscribe to our monthly fidget box and receive curated new toys delivered to your door. Subscribers get 20% off and free shipping on all orders."
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="smooth"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Stay Updated"
          title="Get Exclusive Fidget Deals"
          description="Subscribe to our newsletter and receive 15% off your first order plus early access to new products and special promotions."
          tagIcon={Mail}
          useInvertedBackground="noInvert"
          inputPlaceholder="Enter your email address"
          buttonText="Subscribe"
          termsText="We respect your privacy. Unsubscribe anytime. By subscribing, you agree to our Terms and Privacy Policy."
        />
      </div>

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