"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Zap, Flame, Award, Star, Download, Heart, Target, Shield, TrendingUp, Wind, Circle, Sparkles, Dumbbell } from "lucide-react";

export default function FitnessLandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="small"
      sizing="largeSmallSizeLargeTitles"
      background="circleGradient"
      cardStyle="subtle-shadow"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="FitFlow"
          navItems={[
            { name: "Features", id: "features" },
            { name: "Workouts", id: "workouts" },
            { name: "Reviews", id: "testimonials" },
            { name: "Download", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Transform Your Body, Transform Your Life"
          description="Join thousands of users achieving their fitness goals with FitFlow. Personalized workout plans, expert guidance, and a supportive community—all in your pocket."
          background={{ variant: "sparkles-gradient" }}
          tag="Fitness Revolution"
          tagIcon={Zap}
          imageSrc="https://img.b2bpic.net/free-photo/closeup-female-athlete-using-mobile-phone-while-checking-heart-rate-wristwatch_637285-3472.jpg"
          imageAlt="FitFlow Fitness App Interface"
          buttons={[
            { text: "Download Now", href: "contact" },
            { text: "Learn More", href: "features" }
          ]}
          avatars={[
            { src: "https://img.b2bpic.net/free-photo/beautiful-sportive-girl-posing-with-crossed-arms-dark-wall_176420-622.jpg", alt: "User 1" },
            { src: "https://img.b2bpic.net/free-photo/beautiful-sportive-girl-posing-with-crossed-arms-dark-wall_176420-625.jpg", alt: "User 2" },
            { src: "https://img.b2bpic.net/free-photo/beautiful-sportive-girl-posing-with-crossed-arms-dark-wall_176420-620.jpg", alt: "User 3" }
          ]}
          avatarText="Trusted by 50,000+ fitness enthusiasts"
        />
      </div>

      <div id="features" data-section="features">
        <InlineImageSplitTextAbout
          heading={[
            { type: "text", content: "Everything You Need to" },
            { type: "text", content: "Achieve Your Fitness Goals" }
          ]}
          buttons={[
            { text: "Start Your Journey", href: "contact" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="workouts" data-section="workouts">
        <FeatureCardTen
          title="Workout Plans Built For You"
          description="Choose from expertly designed workout programs tailored to your fitness level, goals, and available time. From beginner-friendly routines to advanced training protocols."
          tag="Personalized Training"
          tagIcon={Flame}
          features={[
            {
              id: "1",              title: "Cardio Blast",              description: "High-intensity interval training designed to maximize calorie burn and improve cardiovascular endurance. Perfect for building stamina and achieving rapid results.",              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/woman-gym-with-smartphone-template_23-2148111618.jpg",                imageAlt: "Cardio Workout Training"
              },
              items: [
                { icon: Zap, text: "30-45 minute sessions" },
                { icon: Heart, text: "Boost metabolism" },
                { icon: Target, text: "Track progress" }
              ],
              reverse: false
            },
            {
              id: "2",              title: "Strength Builder",              description: "Progressive resistance training to build lean muscle and increase overall strength. Each workout focuses on compound movements with proper form guidance.",              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/closeup-female-athlete-text-messaging-mobile-phone_637285-6214.jpg",                imageAlt: "Strength Training Workout"
              },
              items: [
                { icon: Dumbbell, text: "Muscle growth focus" },
                { icon: Shield, text: "Injury prevention tips" },
                { icon: TrendingUp, text: "Progressive overload" }
              ],
              reverse: true
            },
            {
              id: "3",              title: "Flexibility & Balance",              description: "Improve mobility, reduce tension, and enhance overall wellness with yoga and flexibility routines. Essential for recovery and preventing injuries.",              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/view-athlete-using-cell-phone-health-club_637285-8290.jpg",                imageAlt: "Yoga Flexibility Training"
              },
              items: [
                { icon: Wind, text: "Stress relief" },
                { icon: Circle, text: "Mind-body connection" },
                { icon: Sparkles, text: "Recovery focused" }
              ],
              reverse: false
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardSeven
          title="The Results Speak For Themselves"
          description="Join our community of fitness enthusiasts who have transformed their lives with FitFlow."
          tag="Community Impact"
          tagIcon={Award}
          metrics={[
            {
              id: "1",              value: "50K+",              title: "Active Users Worldwide",              items: ["Growing daily community", "24/7 support network", "Global challenges"]
            },
            {
              id: "2",              value: "500+",              title: "Expert-Designed Workouts",              items: ["Updated regularly", "All fitness levels", "Multiple specialties"]
            },
            {
              id: "3",              value: "95%",              title: "User Satisfaction Rate",              items: ["Highly rated app", "Positive reviews", "Trusted by millions"]
            },
            {
              id: "4",              value: "3.2M",              title: "Total Workouts Completed",              items: ["Real user success", "Proven results", "Transformations daily"]
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="What Our Users Say"
          description="Real stories from people who've transformed their fitness journey with FitFlow."
          tag="User Reviews"
          tagIcon={Star}
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              handle: "@sarah.fit",              testimonial: "FitFlow completely changed my fitness routine. The personalized workouts kept me motivated, and I've never felt stronger!",              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-sportive-girl-posing-with-crossed-arms-dark-wall_176420-622.jpg",              imageAlt: "Sarah Johnson"
            },
            {
              id: "2",              name: "Marcus Chen",              handle: "@fit.marcus",              testimonial: "As a busy professional, FitFlow fits perfectly into my schedule. Amazing app with incredible results in just 8 weeks.",              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-sportive-girl-posing-with-crossed-arms-dark-wall_176420-625.jpg",              imageAlt: "Marcus Chen"
            },
            {
              id: "3",              name: "Emma Rodriguez",              handle: "@emma.transforms",              testimonial: "The community support is incredible. Knowing I'm working out alongside thousands of others keeps me accountable and motivated daily.",              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-sportive-girl-posing-with-crossed-arms-dark-wall_176420-620.jpg",              imageAlt: "Emma Rodriguez"
            },
            {
              id: "4",              name: "David Kim",              handle: "@kim.strength",              testimonial: "Best fitness investment I've made. The form guides and progress tracking features are next level. Highly recommend FitFlow to anyone serious about fitness.",              imageSrc: "https://img.b2bpic.net/free-photo/adorable-lovely-smiling-girl-with-long-wavy-hairstyle-black-sport-top-is-holding-arms-chest-looking-window-isolated-background_291650-2273.jpg",              imageAlt: "David Kim"
            },
            {
              id: "5",              name: "Lisa Thompson",              handle: "@lisa.wellness",              testimonial: "I've tried many fitness apps, but FitFlow stands out. The variety of workouts keeps things fresh, and the results speak for themselves.",              imageSrc: "https://img.b2bpic.net/free-photo/physically-fit-woman-with-long-hair-is-standing-crossed-her-hands-dark-background_613910-13266.jpg",              imageAlt: "Lisa Thompson"
            },
            {
              id: "6",              name: "James Wilson",              handle: "@james.gains",              testimonial: "From zero fitness to running marathons. FitFlow's progressive training approach made it all possible. This app saved my life.",              imageSrc: "https://img.b2bpic.net/free-photo/brunette-woman-wearing-sport-clothes_329181-13199.jpg",              imageAlt: "James Wilson"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCTA
          tag="Ready to Start?"
          tagIcon={Download}
          title="Download FitFlow Today"
          description="Get access to unlimited workouts, personalized plans, and join a community of 50,000+ fitness enthusiasts. Start your transformation now—completely free to download."
          buttons={[
            { text: "Download on App Store", href: "https://www.apple.com/app-store/" },
            { text: "Get it on Google Play", href: "https://play.google.com/store" }
          ]}
          background={{ variant: "radial-gradient" }}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://img.b2bpic.net/free-photo/closeup-female-athlete-using-mobile-phone-while-checking-heart-rate-wristwatch_637285-3472.jpg"
          imageAlt="FitFlow Community"
          columns={[
            {
              title: "Product",              items: [
                { label: "Workout Plans", href: "workouts" },
                { label: "Features", href: "features" },
                { label: "Pricing", href: "#" }
              ]
            },
            {
              title: "Community",              items: [
                { label: "Reviews", href: "testimonials" },
                { label: "Success Stories", href: "#" },
                { label: "Blog", href: "#" }
              ]
            },
            {
              title: "Support",              items: [
                { label: "Contact Us", href: "contact" },
                { label: "FAQ", href: "#" },
                { label: "Help Center", href: "#" }
              ]
            }
          ]}
          logoText="FitFlow"
          copyrightText="© 2025 FitFlow. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}