"use client";

import { useEffect, useState } from "react";
import ReactLenis from "lenis/react";
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import FooterCard from '@/components/sections/footer/FooterCard';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import { Instagram, Twitter, Linkedin, Mail, Dumbbell } from 'lucide-react';

export default function ServicesPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="medium"
      sizing="mediumLarge"
      background="aurora"
      cardStyle="gradient-bordered"
      primaryButtonStyle="inset-glow"
      secondaryButtonStyle="layered"
      headingFontWeight="semibold"
    >
      <ReactLenis root>
        <div className="min-h-screen bg-background">
          <NavbarStyleFullscreen
            navItems={[
              { name: "Home", id: "/" },
              { name: "About", id: "about" },
              { name: "Certifications", id: "achievements" },
              { name: "Services", id: "services" },
              { name: "Approach", id: "philosophy" },
              { name: "Contact", id: "contact" }
            ]}
            brandName="Personal Trainer"
            bottomLeftText="Certified Professional"
            bottomRightText="contact@trainer.com"
          />

          <div id="services" data-section="services" className="py-20">
            <FeatureCardSeven
              title="Personalized Training Programs"
              description="Customized fitness solutions tailored to your unique goals and lifestyle"
              tag="Service Offerings"
              tagIcon={Dumbbell}
              features={[
                {
                  "id": 1,
                  "title": "One-on-One Personal Training",                  "description": "Individual coaching sessions focused entirely on your goals, form, and progression. Each workout is designed based on your fitness level, preferences, and objectives with real-time feedback and adjustments.",                  "imageSrc": "https://img.b2bpic.net/free-photo/group-people-working-out-together-outdoors_23-2149891467.jpg?id=34137118",                  "imageAlt": "One-on-one personal training session"
                },
                {
                  "id": 2,
                  "title": "Small Group Training Classes",                  "description": "Build community while reaching your fitness goals in small, focused groups. Receive personalized attention in a motivating environment with other like-minded individuals committed to transformation.",                  "imageSrc": "https://img.b2bpic.net/premium-photo/coach-reviewing-playbook-with-team_1314467-168780.jpg?id=324598511",                  "imageAlt": "Small group fitness class"
                },
                {
                  "id": 3,
                  "title": "Online Coaching Programs",                  "description": "Train from anywhere with customized workout plans, nutrition guidance, and video form checks. Stay connected with regular progress assessments and program adjustments based on your results and feedback.",                  "imageSrc": "https://img.b2bpic.net/free-photo/people-training-athletics_23-2151077709.jpg?id=150856792",                  "imageAlt": "Online fitness coaching platform"
                },
                {
                  "id": 4,
                  "title": "Nutrition & Wellness Coaching",                  "description": "Comprehensive nutrition guidance and lifestyle coaching to complement your training. Develop sustainable eating habits, meal planning strategies, and wellness practices that support your fitness goals.",                  "imageSrc": "https://img.b2bpic.net/free-photo/group-fitness-training_1098-1321.jpg",                  "imageAlt": "Nutrition and wellness guidance"
                },
                {
                  "id": 5,
                  "title": "Mobility & Injury Prevention",                  "description": "Specialized training focused on improving range of motion, flexibility, and injury prevention. Ideal for athletes, active individuals, and those recovering from injuries.",                  "imageSrc": "https://img.b2bpic.net/free-photo/speaker-addressing-audience_1098-1322.jpg",                  "imageAlt": "Mobility and flexibility training"
                },
                {
                  "id": 6,
                  "title": "Custom Training Packages",                  "description": "Tailored programs designed specifically for your unique situation—whether you're training for a specific event, recovering from injury, or pursuing performance goals. We combine training, nutrition, and recovery strategies.",                  "imageSrc": "https://img.b2bpic.net/free-photo/training-customization_1098-1323.jpg",                  "imageAlt": "Custom fitness program design"
                }
              ]}
              textboxLayout="default"
              animationType="slide-up"
              useInvertedBackground="noInvert"
              buttons={[
                {"text": "Book Consultation", "href": "/#contact"}
              ]}
            />
          </div>

          <FooterCard
            logoText="Personal Trainer"
            copyrightText="© 2025 Professional Personal Training. All rights reserved."
            socialLinks={[
              { icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
              { icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
              { icon: Linkedin, href: "https://linkedin.com", ariaLabel: "LinkedIn" },
              { icon: Mail, href: "mailto:contact@trainer.com", ariaLabel: "Email" }
            ]}
          />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}