"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import TeamCardSix from '@/components/sections/team/TeamCardSix';
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Zap, Users, Mail } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="medium"
      sizing="mediumLargeSizeMediumTitles"
      background="floatingGradient"
      cardStyle="soft-shadow"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          brandName="FitZone"
          navItems={[
            { name: "About", id: "about" },
            { name: "Classes", id: "features" },
            { name: "Trainers", id: "team" },
            { name: "Pricing", id: "pricing" },
            { name: "Contact", id: "contact" }
          ]}
          bottomLeftText="San Francisco, CA"
          bottomRightText="hello@fitzone.com"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboard
          logoText="FitZone Gym"
          description="Transform your body and mind at California's premier fitness destination. Expert trainers, state-of-the-art equipment, and a community dedicated to your success."
          imageSrc="https://img.b2bpic.net/free-photo/gym-interior-with-equipment_93675-129239.jpg"
          imageAlt="Modern gym with weights and fitness equipment"
          frameStyle="card"
          logoLineHeight={1.2}
        />
      </div>

      <div id="about" data-section="about">
        <MediaSplitTabsAbout
          title="Why Choose FitZone"
          description="We're committed to delivering the best fitness experience in the Bay Area."
          tabs={[
            {
              id: "facilities",              label: "Premium Facilities",              description: "Our state-of-the-art facility spans 15,000 sq ft with the latest cardio equipment, free weights, strength training machines, and specialized studios for yoga, spin, and CrossFit."
            },
            {
              id: "trainers",              label: "Expert Trainers",              description: "Our team of certified personal trainers has 15+ years of combined experience. We tailor every program to your specific goals and fitness level."
            },
            {
              id: "community",              label: "Supportive Community",              description: "Join a thriving community of fitness enthusiasts. Group classes, challenges, and events keep you motivated and accountable every single day."
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/gym-interior-with-equipment_93675-128388.jpg"
          imageAlt="FitZone gym facility with modern equipment"
          imagePosition="right"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardThree
          title="Our Classes & Services"
          description="Everything you need to achieve your fitness goals under one roof."
          tag="Offerings"
          tagIcon={Zap}
          textboxLayout="default"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          features={[
            {
              id: "01",              title: "Strength Training",              description: "Build muscle and power with our comprehensive free weight and machine training programs designed by certified strength coaches.",              imageSrc: "https://img.b2bpic.net/free-photo/woman-working-out-with-equipment_23-2147688154.jpg",              imageAlt: "Strength training with weights and gym equipment"
            },
            {
              id: "02",              title: "Cardio & Conditioning",              description: "Improve your cardiovascular health with state-of-the-art treadmills, bikes, ellipticals, and rowing machines for every fitness level.",              imageSrc: "https://img.b2bpic.net/free-photo/sport-fitness-health-exercise-bikes-fitness-center_613910-20283.jpg",              imageAlt: "Cardio equipment and fitness machines"
            },
            {
              id: "03",              title: "Group Fitness Classes",              description: "Join energizing group classes including yoga, spin, HIIT, Zumba, and CrossFit. New classes start every week.",              imageSrc: "https://img.b2bpic.net/free-photo/woman-lifting-legs-exercise-machine_23-2147688157.jpg",              imageAlt: "Group fitness class and workout sessions"
            },
            {
              id: "04",              title: "Personal Training",              description: "One-on-one coaching from certified trainers who create customized workout plans and provide ongoing support.",              imageSrc: "https://img.b2bpic.net/free-photo/strong-legs-exercising-couple_329181-14159.jpg",              imageAlt: "Personal trainer providing one-on-one coaching"
            }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardSix
          title="Meet Our Expert Trainers"
          description="Certified professionals dedicated to your fitness journey."
          tag="Team"
          tagIcon={Users}
          textboxLayout="default"
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          members={[
            {
              id: "1",              name: "Marcus Johnson",              role: "Head Strength Coach",              imageSrc: "https://img.b2bpic.net/free-photo/side-view-smiley-man-gym_23-2150007196.jpg",              imageAlt: "Marcus Johnson - Head Strength Coach"
            },
            {
              id: "2",              name: "Sarah Chen",              role: "Yoga & Wellness Specialist",              imageSrc: "https://img.b2bpic.net/free-photo/male-boxer-posing-t-shirt-with-arms-crossed_23-2148426241.jpg",              imageAlt: "Sarah Chen - Yoga & Wellness Specialist"
            },
            {
              id: "3",              name: "David Rodriguez",              role: "HIIT & Cardio Specialist",              imageSrc: "https://img.b2bpic.net/free-photo/confident-sportsman-with-headphones-jumping-rope_1098-21632.jpg",              imageAlt: "David Rodriguez - HIIT & Cardio Specialist"
            },
            {
              id: "4",              name: "Emma Williams",              role: "Nutrition & Fitness Coach",              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-sportive-girl-posing-with-crossed-arms-dark-wall_176420-620.jpg",              imageAlt: "Emma Williams - Nutrition & Fitness Coach"
            }
          ]}
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardFive
          title="Simple, Transparent Pricing"
          description="Choose the membership that fits your fitness journey."
          tag="Membership"
          tagIcon={Zap}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          plans={[
            {
              id: "basic",              tag: "Starter Plan",              tagIcon: Zap,
              price: "$29",              period: "/month",              description: "Perfect for beginners looking to start their fitness journey.",              button: { text: "Get Started", href: "#contact" },
              featuresTitle: "What's Included:",              features: [
                "24/7 gym access",                "All cardio equipment",                "Free weights area",                "1 personal training session/month",                "Mobile app access"
              ]
            },
            {
              id: "premium",              tag: "Premium Plan",              tagIcon: Zap,
              price: "$59",              period: "/month",              description: "Our most popular choice for serious fitness enthusiasts.",              button: { text: "Choose Plan", href: "#contact" },
              featuresTitle: "What's Included:",              features: [
                "24/7 gym access",                "All equipment & facilities",                "Unlimited group classes",                "4 personal training sessions/month",                "Nutrition consultation",                "Mobile app + wearable sync",                "Member-only events"
              ]
            },
            {
              id: "elite",              tag: "Elite Plan",              tagIcon: Zap,
              price: "$99",              period: "/month",              description: "Ultimate membership with premium services and coaching.",              button: { text: "Join Elite", href: "#contact" },
              featuresTitle: "What's Included:",              features: [
                "24/7 priority access",                "Unlimited everything",                "8 personal training sessions/month",                "Unlimited nutrition coaching",                "Recovery services (massage, sauna)",                "VIP member lounge access",                "Priority class registration",                "Custom meal & workout plans"
              ]
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="FitZone completely transformed my fitness journey. The trainers are incredibly knowledgeable, the facilities are top-notch, and the community support keeps me motivated every single day. I've lost 30 pounds and gained so much confidence!"
          rating={5}
          author="Michael Torres, Fitness Enthusiast"
          avatars={[
            { src: "https://img.b2bpic.net/free-photo/portrait-smiling-afro-american-sports-man-with-arms-folded-looking-camera_171337-8263.jpg", alt: "Member 1" },
            { src: "https://img.b2bpic.net/free-photo/sportive-man-black-shirt-closing-his-arm-muscles_114579-14242.jpg", alt: "Member 2" },
            { src: "https://img.b2bpic.net/free-photo/smiling-afro-american-sports-man-with-arms-folded-looking-camera_171337-8257.jpg", alt: "Member 3" },
            { src: "https://img.b2bpic.net/free-photo/serious-afro-american-sports-man-looking-camera_171337-8256.jpg", alt: "Member 4" },
            { src: "https://img.b2bpic.net/free-photo/side-view-fit-man-posing-while-wearing-tank-top-with-crossed-arms_23-2148700611.jpg", alt: "Member 5" },
            { src: "https://img.b2bpic.net/free-photo/medium-shot-smiley-man-gym_23-2149178038.jpg", alt: "Member 6" }
          ]}
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Newsletter"
          tagIcon={Mail}
          title="Join Our Fitness Community"
          description="Get exclusive workout tips, class schedules, member discounts, and fitness inspiration delivered to your inbox every week."
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-photo/modern-equipment-gym-indoors-interior-fitness-hall-with-fitness-bicycles_613910-6644.jpg"
          imageAlt="FitZone gym community"
          mediaPosition="right"
          inputPlaceholder="Enter your email"
          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">
        <FooterMedia
          imageSrc="https://img.b2bpic.net/free-photo/side-view-male-exercise-bicycle_23-2148353067.jpg"
          imageAlt="FitZone gym background"
          logoText="FitZone"
          copyrightText="© 2025 FitZone Gym. All rights reserved."
          columns={[
            {
              title: "Gym",              items: [
                { label: "Classes", href: "#features" },
                { label: "Trainers", href: "#team" },
                { label: "Pricing", href: "#pricing" },
                { label: "About Us", href: "#about" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Fitness Blog", href: "#" },
                { label: "Workout Plans", href: "#" },
                { label: "Nutrition Tips", href: "#" },
                { label: "Member Portal", href: "#" }
              ]
            },
            {
              title: "Contact",              items: [
                { label: "hello@fitzone.com", href: "#" },
                { label: "(415) 555-0123", href: "#" },
                { label: "123 Fitness Ave, San Francisco, CA 94105", href: "#" },
                { label: "Hours: 5am - 10pm Daily", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}