"use client"

import { Download, Flame, Sparkles, Trophy, Zap } from "lucide-react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
import FeatureProcessSteps from '@/components/sections/feature/FeatureProcessSteps';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';

export default function FitFlowPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="slide-background"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="smallMedium"
      sizing="large"
      background="none"
      cardStyle="soft-shadow"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="solid"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="FitFlow"
          navItems={[
            { name: "Features", id: "features" },
            { name: "Plans", id: "plans" },
            { name: "Testimonials", id: "testimonials" },
            { name: "FAQ", id: "faq" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Download Now",            href: "contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitKpi
          title="Transform Your Body, Transform Your Life"
          description="Join thousands of users achieving their fitness goals with FitFlow. Personalized workouts, nutrition tracking, and real-time progress monitoring—all in one app."
          background={{ variant: "glowing-orb" }}
          kpis={[
            { value: "500K+", label: "Active Users" },
            { value: "10M+", label: "Workouts Completed" },
            { value: "4.8/5", label: "App Rating" }
          ]}
          enableKpiAnimation={true}
          tag="The #1 Fitness App"
          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 showing workout tracking"
          buttons={[
            { text: "Download on iOS", href: "contact" },
            { text: "Download on Android", href: "contact" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <MediaSplitTabsAbout
          title="Why Choose FitFlow?"
          description="We combine cutting-edge technology with expert fitness knowledge to deliver results."
          tabs={[
            {
              id: "personalized",              label: "Personalized Plans",              description: "AI-powered workout plans that adapt to your fitness level, goals, and preferences. Get a program designed specifically for you, not generic routines."
            },
            {
              id: "tracking",              label: "Advanced Tracking",              description: "Monitor every aspect of your fitness journey with detailed analytics, progress photos, and performance metrics that keep you motivated."
            },
            {
              id: "community",              label: "Supportive Community",              description: "Connect with thousands of fitness enthusiasts, share achievements, and get encouragement from people on the same journey as you."
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/sports-group-standing-gum_1157-32139.jpg"
          imageAlt="FitFlow team of fitness professionals and trainers"
          imagePosition="right"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureProcessSteps
          title="Your Personalized Workout Journey"
          description="From assessment to transformation, we guide you through every step with intelligent tracking and expert support."
          tag="How It Works"
          tagIcon={Sparkles}
          steps={[
            {
              number: "01",              title: "Complete Your Assessment",              tag: "Day 1",              description: "Answer a few quick questions about your fitness level, goals, and preferences. Our AI analyzes your profile to build your baseline."
            },
            {
              number: "02",              title: "Receive Your Custom Plan",              tag: "Days 2-3",              description: "Get a personalized workout schedule with video tutorials, form guides, and nutrition recommendations tailored to your goals."
            },
            {
              number: "03",              title: "Start Your Transformation",              tag: "Week 1+",              description: "Begin your workouts, track your progress, and watch real results. Our AI adjusts your plan based on your performance and feedback."
            }
          ]}
          useInvertedBackground="invertDefault"
          buttons={[{ text: "Get Started", href: "contact" }]}
        />
      </div>

      <div id="plans" data-section="plans">
        <ProductCardOne
          title="Workout Plans for Every Goal"
          description="Choose from our diverse library of expertly-designed programs for any fitness level and objective."
          tag="Fitness Programs"
          tagIcon={Flame}
          products={[
            {
              id: "1",              name: "Strength Builder",              price: "Perfect for gaining muscle",              imageSrc: "https://img.b2bpic.net/free-photo/low-angle-view-muscular-build-man-doing-deadlift-while-exercising-with-barbell-gym_637285-2489.jpg",              imageAlt: "Strength training workout program"
            },
            {
              id: "2",              name: "Yoga & Flexibility",              price: "Balance and mindfulness",              imageSrc: "https://img.b2bpic.net/free-photo/young-woman-gym-dumbbells-gym-workout-gym_169016-63307.jpg",              imageAlt: "Yoga and flexibility training"
            },
            {
              id: "3",              name: "Cardio Blast",              price: "Build endurance and stamina",              imageSrc: "https://img.b2bpic.net/free-photo/young-woman-gym-dumbbells-gym-workout-gym_169016-63678.jpg",              imageAlt: "Cardio and aerobic training"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardEleven
          title="Real Results From Real Users"
          description="See the incredible transformations and achievements our community has accomplished."
          tag="Success Stories"
          tagIcon={Trophy}
          metrics={[
            {
              id: "1",              value: "92%",              title: "Goal Achievement",              description: "Users who reach their fitness targets within 3 months",              imageSrc: "https://img.b2bpic.net/free-photo/strong-man-training-gym_1303-23831.jpg",              imageAlt: "User achievement and progress"
            },
            {
              id: "2",              value: "8.5K",              title: "Avg Calories Burned",              description: "Per week by active users following personalized plans",              imageSrc: "https://img.b2bpic.net/free-photo/strong-man-training-gym_1303-23831.jpg",              imageAlt: "Calorie tracking and fitness metrics"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive
          title="What Our Users Say"
          description="Thousands of people have transformed their lives with FitFlow. Here are their stories."
          tag="Testimonials"
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson, Fitness Enthusiast",              date: "Date: 15 November 2024",              title: "Lost 25 lbs and feeling amazing!",              quote: "FitFlow's personalized approach changed everything for me. The workouts adapt to my level, and seeing my progress tracked visually keeps me motivated every single day.",              tag: "Premium Member",              avatarSrc: "https://img.b2bpic.net/free-photo/close-up-good-looking-smiling-friendly-female-trainee-ready-tackle-assignments-smiling-broadly-feeling-lucky-day-work-self-assured-encouraged-achieve-success-goal-white-wall_176420-35567.jpg",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-good-looking-smiling-friendly-female-trainee-ready-tackle-assignments-smiling-broadly-feeling-lucky-day-work-self-assured-encouraged-achieve-success-goal-white-wall_176420-35567.jpg",              imageAlt: "Sarah's fitness transformation journey"
            },
            {
              id: "2",              name: "Michael Chen, Marathon Runner",              date: "Date: 10 October 2024",              title: "Improved my race time by 8 minutes",              quote: "The endurance training plans on FitFlow are incredibly effective. The form guides and real-time feedback helped me optimize my training and crush my personal record.",              tag: "Premium Member",              avatarSrc: "https://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg",              imageSrc: "https://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg",              imageAlt: "Michael's athletic performance improvement"
            },
            {
              id: "3",              name: "Emma Williams, Busy Professional",              date: "Date: 5 September 2024",              title: "Finally consistent with my workouts",              quote: "As a busy mom, I love that FitFlow fits into my schedule. The 15-30 minute workouts are perfect, and I don't need a gym membership. Life-changing app!",              tag: "Basic Member",              avatarSrc: "https://img.b2bpic.net/free-photo/portrait-smiley-business-woman_23-2148603029.jpg",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiley-business-woman_23-2148603029.jpg",              imageAlt: "Emma's fitness consistency achievement"
            },
            {
              id: "4",              name: "David Rodriguez, Strength Coach",              date: "Date: 28 August 2024",              title: "Built muscle faster than ever before",              quote: "The strength training program is scientifically designed. I've gained more muscle mass in 3 months than I did in a year before. Highly recommend!",              tag: "Premium Member",              avatarSrc: "https://img.b2bpic.net/free-photo/blond-business-woman-blue-shirt_23-2148095792.jpg",              imageSrc: "https://img.b2bpic.net/free-photo/blond-business-woman-blue-shirt_23-2148095792.jpg",              imageAlt: "David's muscle gain results"
            },
            {
              id: "5",              name: "Jessica Park, Yoga Instructor",              date: "Date: 15 August 2024",              title: "The community support is incredible",              quote: "What makes FitFlow special is the community. The challenges and group features keep me accountable, and seeing others' progress inspires me daily.",              tag: "Premium Member",              avatarSrc: "https://img.b2bpic.net/free-photo/close-up-positive-businesswoman_1098-3531.jpg",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-positive-businesswoman_1098-3531.jpg",              imageAlt: "Jessica's community wellness journey"
            },
            {
              id: "6",              name: "Alex Thompson, Beginner",              date: "Date: 1 August 2024",              title: "No experience? FitFlow helps you start strong",              quote: "I was intimidated to start working out, but FitFlow made it easy. The beginner programs are encouraging, and I'm seeing real improvements. Love it!",              tag: "Basic Member",              avatarSrc: "https://img.b2bpic.net/free-photo/portrait-happy-woman-black-jacket-happy-short-haired-girl-dark-suit-widely-sincerely-smiles-isolated-background_197531-18508.jpg",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-happy-woman-black-jacket-happy-short-haired-girl-dark-suit-widely-sincerely-smiles-isolated-background_197531-18508.jpg",              imageAlt: "Alex's beginner fitness success"
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitText
          sideTitle="Frequently Asked Questions"
          sideDescription="Got questions? We've got answers about how FitFlow can help you achieve your fitness goals."
          faqs={[
            {
              id: "1",              title: "Do I need gym equipment to use FitFlow?",              content: "No! FitFlow includes workouts for all scenarios: bodyweight exercises at home, gym-based routines, and mixed options. You can start with zero equipment and progress as you wish."
            },
            {
              id: "2",              title: "How often should I work out?",              content: "Our AI recommends a frequency based on your goals and recovery capacity, typically 3-5 days per week. Plans are flexible and adjust to your lifestyle and preferences."
            },
            {
              id: "3",              title: "Can I change my fitness goal?",              content: "Absolutely! You can update your goals anytime in the app. FitFlow will immediately regenerate your personalized plan to match your new objectives."
            },
            {
              id: "4",              title: "Is nutrition tracking included?",              content: "Yes! Premium members get access to nutrition tracking, meal planning suggestions, and integration with popular health apps to monitor calories and macros."
            },
            {
              id: "5",              title: "Do you offer a free trial?",              content: "Yes, we offer a 7-day free trial with full access to all premium features. No credit card required to start—just download and experience FitFlow risk-free."
            }
          ]}
          textPosition="left"
          useInvertedBackground="invertDefault"
          animationType="smooth"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Ready to Transform?"
          title="Download FitFlow Today"
          description="Join 500,000+ users achieving their fitness goals. Get started with your personalized plan in under 2 minutes."
          tagIcon={Download}
          background={{ variant: "rotated-rays-animated-grid" }}
          useInvertedBackground="noInvert"
          inputPlaceholder="Enter your email"
          buttonText="Get Started"
          termsText="By signing up, you agree to our Terms of Service. We'll send you app download links and fitness tips. Unsubscribe anytime."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="FitFlow"
          copyrightText="© 2025 FitFlow. All rights reserved."
          columns={[
            {
              title: "Product",              items: [
                { label: "Features", href: "#features" },
                { label: "Workout Plans", href: "#plans" },
                { label: "Pricing", href: "#" },
                { label: "Download", href: "#contact" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              title: "Support",              items: [
                { label: "Help Center", href: "#" },
                { label: "FAQ", href: "#faq" },
                { label: "Community", href: "#" },
                { label: "Status", href: "#" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Cookie Policy", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}