"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
import AboutMetric from "@/components/sections/about/AboutMetric";
import ProductCardThree from "@/components/sections/product/ProductCardThree";
import PricingCardFive from "@/components/sections/pricing/PricingCardFive";
import TestimonialCardTen from "@/components/sections/testimonial/TestimonialCardTen";
import FaqDouble from "@/components/sections/faq/FaqDouble";
import ContactCenter from "@/components/sections/contact/ContactCenter";
import FooterSimple from "@/components/sections/footer/FooterSimple";
import {
  Sparkles,
  CheckCircle,
  Shield,
  Calendar,
  MapPin,
  TrendingUp,
  Award,
  Users,
  Star,
  Zap,
  Heart,
  Activity,
  Flame,
  HelpCircle,
  Rocket,
  Crown,
} from "lucide-react";

const navItems = [
  { name: "Home", id: "home" },
  { name: "Trainers", id: "trainers" },
  { name: "Events", id: "events" },
  { name: "Communities", id: "communities" },
  { name: "Pricing", id: "pricing" },
  { name: "Dashboard", id: "dashboard" },
];

const footerColumns = [
  {
    title: "Platform",
    items: [
      { label: "Find Trainers", href: "/trainers" },
      { label: "Discover Events", href: "/events" },
      { label: "Join Communities", href: "/communities" },
      { label: "Pricing", href: "/" },
    ],
  },
  {
    title: "Community",
    items: [
      { label: "Success Stories", href: "/" },
      { label: "Trainer Directory", href: "/trainers" },
      { label: "Events Calendar", href: "/events" },
      { label: "Member Forum", href: "/" },
    ],
  },
  {
    title: "Company",
    items: [
      { label: "About FitMumbai", href: "/" },
      { label: "Our Mission", href: "/" },
      { label: "Careers", href: "/" },
      { label: "Press", href: "/" },
    ],
  },
  {
    title: "Support",
    items: [
      { label: "Help Center", href: "/" },
      { label: "Contact Us", href: "/" },
      { label: "Privacy Policy", href: "/" },
      { label: "Terms of Service", href: "/" },
    ],
  },
];

export default function HomePage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="small"
      sizing="mediumSizeLargeTitles"
      background="circleGradient"
      cardStyle="gradient-radial"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="solid"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={navItems}
          brandName="FitMumbai"
          bottomLeftText="Mumbai's Fitness Hub"
          bottomRightText="hello@fitmumbai.com"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitKpi
          title="Mumbai's Unified Fitness Ecosystem"
          description="Book verified trainers, discover curated fitness events, and join your local running community — all seamlessly connected in one premium platform."
          background={{ variant: "radial-gradient" }}
          kpis={[
            { value: "500+", label: "Verified Trainers" },
            { value: "150+", label: "Monthly Events" },
            { value: "12K+", label: "Active Community" },
          ]}
          enableKpiAnimation={true}
          tag="PREMIUM FITNESS PLATFORM"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          buttons={[
            { text: "Find a Trainer", href: "/trainers" },
            { text: "Explore Events", href: "/events" },
          ]}
          buttonAnimation="slide-up"
          imageSrc="http://img.b2bpic.net/free-vector/hand-drawn-geometric-gym-training-landing-page_23-2149610146.jpg"
          imageAlt="3D Fitness Elements"
          mediaAnimation="blur-reveal"
          imagePosition="right"
          marqueeItems={[
            { type: "text-icon", text: "Strength Training", icon: Zap },
            { type: "text-icon", text: "Yoga & Wellness", icon: Heart },
            { type: "text-icon", text: "Running Clubs", icon: Activity },
            { type: "text-icon", text: "CrossFit & HIIT", icon: Flame },
            { type: "text-icon", text: "Community Events", icon: Users },
          ]}
          marqueeSpeed={35}
          showMarqueeCard={true}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureHoverPattern
          title="Why Choose FitMumbai"
          description="A premium platform purpose-built for Mumbai's fitness community, combining accessibility with luxury."
          tag="OUR CORE FEATURES"
          tagIcon={CheckCircle}
          tagAnimation="slide-up"
          features={[
            {
              icon: Shield,
              title: "Verified Trainers",
              description: "Every trainer is certified, background-checked, and rated by our community. Book with complete confidence.",
            },
            {
              icon: Calendar,
              title: "Curated Events",
              description: "Discover marathons, yoga retreats, workshops, and competitions carefully selected for quality and community fit.",
            },
            {
              icon: MapPin,
              title: "Local Communities",
              description: "Connect with runners and fitness enthusiasts in your neighborhood. Find your tribe and stay motivated together.",
            },
          ]}
          animationType="scale-rotate"
          textboxLayout="default"
          useInvertedBackground={false}
          buttons={[{ text: "Explore All Features", href: "#" }]}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <AboutMetric
          title="The FitMumbai Impact"
          metrics={[
            { icon: TrendingUp, label: "Users Transformed", value: "25K+" },
            { icon: Award, label: "Training Sessions", value: "50K+" },
            { icon: Users, label: "Community Members", value: "12K+" },
          ]}
          metricsAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="trainers" data-section="trainers">
        <ProductCardThree
          title="Featured Trainers"
          description="Meet our most-booked certified fitness professionals. Browse profiles, specializations, and real community reviews."
          tag="TOP RATED PROFESSIONALS"
          tagIcon={Star}
          tagAnimation="slide-up"
          products={[
            {
              id: "trainer-arjun",
              name: "Arjun Sharma",
              price: "₹1,200/session",
              imageSrc: "http://img.b2bpic.net/free-photo/young-adult-doing-indoor-sport-gym_23-2149205574.jpg?_wi=1",
              imageAlt: "Arjun Sharma - Strength Training Specialist",
              priceButtonProps: { text: "Book Now" },
            },
            {
              id: "trainer-priya",
              name: "Priya Desai",
              price: "₹1,000/session",
              imageSrc: "http://img.b2bpic.net/free-photo/man-goes-sport-takes-break-listens-motivation-music-wireless-headphones-refreshes-with-water-wears-casual-t-shirt-poses-blurred-exercises-outdoors_273609-56014.jpg?_wi=1",
              imageAlt: "Priya Desai - Yoga & Wellness Expert",
              priceButtonProps: { text: "Book Now" },
            },
            {
              id: "trainer-vikram",
              name: "Vikram Singh",
              price: "₹1,500/session",
              imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-training-gym-bodybuilding_23-2149552356.jpg?_wi=1",
              imageAlt: "Vikram Singh - CrossFit Coach",
              priceButtonProps: { text: "Book Now" },
            },
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          carouselMode="buttons"
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardFive
          title="Membership Plans"
          description="Choose the perfect plan to unlock full access to trainers, events, and community features."
          tag="FLEXIBLE PRICING"
          tagIcon={Zap}
          tagAnimation="slide-up"
          plans={[
            {
              id: "starter",
              tag: "For Beginners",
              tagIcon: Rocket,
              price: "₹499",
              period: "/month",
              description: "Perfect for exploring your fitness journey",
              button: { text: "Get Started", href: "#" },
              featuresTitle: "What's Included",
              features: [
                "Browse 500+ verified trainers",
                "Access to 50+ monthly events",
                "Limited booking (2 per month)",
                "Community chat access",
              ],
            },
            {
              id: "pro",
              tag: "Most Popular",
              tagIcon: Sparkles,
              price: "₹1,299",
              period: "/month",
              description: "For serious fitness enthusiasts",
              button: { text: "Upgrade Now", href: "#" },
              featuresTitle: "Everything in Starter, Plus",
              features: [
                "Unlimited trainer bookings",
                "Priority event registration",
                "10% discount on all services",
                "Monthly wellness consultation",
                "Dedicated community moderator",
              ],
            },
            {
              id: "elite",
              tag: "Premium Experience",
              tagIcon: Crown,
              price: "₹2,499",
              period: "/month",
              description: "The ultimate fitness companion",
              button: { text: "Become Elite", href: "#" },
              featuresTitle: "Complete Access + Exclusives",
              features: [
                "All Pro features included",
                "Personal fitness coordinator",
                "Exclusive VIP events & retreats",
                "Nutrition planning sessions",
                "24/7 priority support",
                "Annual fitness assessment",
              ],
            },
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTen
          title="Success Stories from Our Community"
          description="Real transformations from real members who discovered their fitness journey through FitMumbai."
          testimonials={[
            {
              id: "testimonial-rajesh",
              title: "Life-Changing Experience",
              quote: "FitMumbai connected me with the perfect trainer for my goals. In 6 months, I lost 15kg and built incredible strength. The community support keeps me motivated!",
              name: "Rajesh Kumar",
              role: "Software Engineer",
              imageSrc: "http://img.b2bpic.net/free-photo/pretty-smiling-business-woman-standing-window_1262-1069.jpg?_wi=1",
            },
            {
              id: "testimonial-sneha",
              title: "Found My Fitness Family",
              quote: "The running club community is amazing. I've made lifelong friends and discovered parts of Mumbai I never knew existed while training with incredible people.",
              name: "Sneha Patel",
              role: "Fitness Enthusiast",
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-businesswoman-extend-hand-handshake-greeting-business-partner-saleswoman-wel_1258-119227.jpg?_wi=1",
            },
            {
              id: "testimonial-arjun-testimonial",
              title: "Professional Results",
              quote: "As someone training for competitions, FitMumbai's verified coaches gave me the edge I needed. The platform's quality standards are unmatched.",
              name: "Arjun Verma",
              role: "Athlete",
              imageSrc: "http://img.b2bpic.net/free-photo/front-view-fit-man-gym_23-2149517268.jpg",
            },
            {
              id: "testimonial-divya",
              title: "Wellness Transformation",
              quote: "From complete beginner to confident gym-goer in 3 months. The personalized guidance and supportive community made all the difference in my journey.",
              name: "Divya Nair",
              role: "Marketing Executive",
              imageSrc: "http://img.b2bpic.net/free-photo/group-active-people-zumba-class_23-2149074929.jpg?_wi=1",
            },
          ]}
          textboxLayout="default"
          useInvertedBackground={false}
          tag="COMMUNITY VOICES"
          tagIcon={Heart}
          tagAnimation="slide-up"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Everything you need to know about booking trainers, attending events, and joining communities."
          tag="COMMON QUERIES"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          faqs={[
            {
              id: "faq-1",
              title: "How do I book a trainer?",
              content: "Browse our verified trainer profiles, check their specializations and ratings, select available time slots, and confirm your booking. You'll receive confirmation and trainer contact details immediately.",
            },
            {
              id: "faq-2",
              title: "Are all trainers certified?",
              content: "Yes, every trainer on FitMumbai is certified by recognized fitness organizations, background-checked, and thoroughly vetted by our team. Your safety and quality are our top priorities.",
            },
            {
              id: "faq-3",
              title: "Can I join multiple running clubs?",
              content: "Absolutely! Join as many communities as you like. Each club has its own schedule, pace levels, and routes across Mumbai. Find the ones that match your fitness level and interests.",
            },
            {
              id: "faq-4",
              title: "What if I need to cancel a booking?",
              content: "Cancel free of charge up to 24 hours before your session. Cancellations within 24 hours are charged at 50%. Trainers also honor rescheduling requests based on availability.",
            },
            {
              id: "faq-5",
              title: "How are events selected?",
              content: "Our curation team carefully selects marathons, workshops, and competitions based on community feedback, organizer credibility, and alignment with FitMumbai values.",
            },
            {
              id: "faq-6",
              title: "Do you offer group training discounts?",
              content: "Yes! Groups of 4 or more get 15% discount on trainer bookings. Corporate wellness programs receive custom packages. Contact our team for details.",
            },
          ]}
          faqsAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="smooth"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="STAY CONNECTED"
          title="Join Mumbai's Fitness Revolution"
          description="Subscribe to our newsletter for exclusive trainer tips, event previews, and community highlights delivered weekly."
          background={{ variant: "radial-gradient" }}
          useInvertedBackground={false}
          inputPlaceholder="Enter your email address"
          buttonText="Subscribe Now"
          termsText="By subscribing, you agree to receive updates about FitMumbai trainers, events, and community initiatives. You can unsubscribe anytime."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={footerColumns}
          bottomLeftText="© 2024 FitMumbai. All rights reserved."
          bottomRightText="hello@fitmumbai.com | +91 98765 43210"
        />
      </div>
    </ThemeProvider>
  );
}