"use client"

import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Trophy, Clock, Target, Award, Zap, Star, Mail } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="medium"
      sizing="largeSizeMediumTitles"
      background="aurora"
      cardStyle="outline"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="Josiah Hestad"
          navItems={[
            { name: "About", id: "about" },
            { name: "Achievements", id: "achievements" },
            { name: "Goals", id: "goals" },
            { name: "Contact", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroOverlay
          title="Josiah Hestad"
          description="2x Ironman. Future ParaRescue. Kinesiology Student. Pushing limits through discipline, resilience, and relentless training."
          tag="Elite Athlete"
          tagIcon={Zap}
          imageSrc="https://img.b2bpic.net/free-photo/man-running-water_23-2151909679.jpg"
          imageAlt="Josiah Hestad training with intensity and focus"
          textPosition="bottom-left"
          showBlur={true}
          showDimOverlay={false}
          buttons={[
            { text: "Explore My Journey", href: "about" },
            { text: "Get in Touch", href: "contact" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <MediaAbout
          title="Who I Am"
          description="I'm Josiah Hestad, an athlete and professional dedicated to excellence in every pursuit. With two Ironman finishes, I've proven my capacity for endurance, discipline, and mental toughness. Currently training for ParaRescue with the U.S. Air Force, I'm pursuing the highest standards of physical and mental resilience. As a Kinesiology student at San Diego State University, I'm combining practical athletic experience with scientific understanding of human movement and performance. My journey exemplifies the power of setting audacious goals and maintaining unwavering commitment to achieving them."
          tag="About"
          imageSrc="https://img.b2bpic.net/free-photo/smiling-athletic-man-black-background_613910-9870.jpg"
          imageAlt="Josiah Hestad professional portrait"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Learn More", href: "achievements" }
          ]}
        />
      </div>

      <div id="achievements" data-section="achievements">
        <MetricCardThree
          title="Athletic Achievements"
          description="Quantifiable proof of dedication and excellence across multiple disciplines."
          tag="Track Record"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
          metrics={[
            { id: "1", icon: Trophy, title: "Ironman Finishes", value: "2x" },
            { id: "2", icon: Clock, title: "Hours of Training", value: "2000+" },
            { id: "3", icon: Target, title: "ParaRescue Candidate", value: "Elite Track" },
            { id: "4", icon: Award, title: "Peak Performance", value: "365 Days/Year" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentyFour
          title="My Excellence Across Disciplines"
          description="Mastering multiple domains through focused intensity and scientific approach."
          tag="Core Competencies"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          features={[
            {
              id: "1",              title: "Ironman Endurance",              author: "2x Finisher",              description: "Completed two full Ironman distance triathlons, mastering 2.4-mile swim, 112-mile bike, and marathon run. Demonstrated exceptional aerobic capacity, mental fortitude, and race strategy execution under extreme physical stress.",              tags: ["Triathlon", "Endurance", "Fitness"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_32SzEkxKoNyIbQ4hnQYui6BHsfB/uploaded-1770401657138-a0ezohzj.png",              imageAlt: "Ironman triathlon competition"
            },
            {
              id: "2",              title: "ParaRescue Training",              author: "Active Candidate",              description: "Currently training for U.S. Air Force ParaRescue qualification. Maintaining elite physical standards including advanced swimming, mountain operations, medical training, and tactical operations. Pursuing one of the military's most challenging career fields.",              tags: ["Military", "Rescue", "Leadership"],
              imageSrc: "https://img.b2bpic.net/free-photo/off-duty-military-man-enjoying-family-moments_342744-378.jpg",              imageAlt: "Military pararescue training operations"
            },
            {
              id: "3",              title: "Kinesiology Studies",              author: "San Diego State University",              description: "Pursuing degree in Kinesiology while applying practical athletic knowledge. Studying human movement science, biomechanics, exercise physiology, and sports medicine. Combining academic excellence with real-world athletic experience to deepen understanding of performance optimization.",              tags: ["Science", "Education", "Performance"],
              imageSrc: "https://img.b2bpic.net/free-photo/patient-doing-physical-rehabilitation-helped-by-therapists_23-2149227880.jpg",              imageAlt: "Sports science and kinesiology studies"
            }
          ]}
        />
      </div>

      <div id="training" data-section="training">
        <ProductCardThree
          title="Training Excellence"
          description="My commitment to peak physical and mental performance through specialized training protocols."
          tag="Discipline"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
          gridVariant="three-columns-all-equal-width"
          products={[
            {
              id: "1",              name: "Aerobic Conditioning",              price: "Elite Level",              imageSrc: "https://img.b2bpic.net/free-photo/cool-man-with-tattoos-ultra-trail-runner_346278-119.jpg",              imageAlt: "Mountain training and endurance conditioning",              initialQuantity: 1
            },
            {
              id: "2",              name: "Strength Development",              price: "Advanced",              imageSrc: "https://img.b2bpic.net/free-photo/off-duty-military-man-enjoying-family-moments_342744-378.jpg",              imageAlt: "Strength training and functional fitness",              initialQuantity: 1
            },
            {
              id: "3",              name: "Mental Resilience",              price: "Mastered",              imageSrc: "https://img.b2bpic.net/free-photo/man-running-water_23-2151909679.jpg",              imageAlt: "Mental toughness and performance psychology",              initialQuantity: 1
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwelve
          cardTitle="Trusted by peers, coaches, and mentors who recognize unwavering commitment to excellence"
          cardTag="Recognition"
          cardTagIcon={Star}
          useInvertedBackground="noInvert"
          testimonials={[
            { id: "1", name: "Coach Davis", imageSrc: "https://img.b2bpic.net/free-vector/spartan-helmet-logo-design_23-2150367201.jpg" },
            { id: "2", name: "Team Ironman", imageSrc: "https://img.b2bpic.net/free-vector/athletes-logo-design_742173-19764.jpg" },
            { id: "3", name: "SDSU Faculty", imageSrc: "https://img.b2bpic.net/free-vector/spartan-helmet-logo-design_23-2150367204.jpg" },
            { id: "4", name: "Military Mentors", imageSrc: "https://img.b2bpic.net/free-vector/detailed-bike-logo-cycling-concept_23-2148830901.jpg" },
            { id: "5", name: "Performance Team", imageSrc: "https://img.b2bpic.net/free-vector/athletic-logo-template-design_742173-19853.jpg" },
            { id: "6", name: "Training Partners", imageSrc: "https://img.b2bpic.net/free-vector/hand-drawn-viking-logo-template_23-2150824823.jpg" }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCTA
          tag="Connect"
          tagIcon={Mail}
          title="Ready to Connect?"
          description="Whether you're interested in training collaboration, sponsorship opportunities, or simply want to learn more about my journey, I'd love to hear from you. Let's discuss how we can work together."
          background={{ variant: "plain" }}
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Send Message", href: "mailto:josiah@example.com" },
            { text: "Follow My Journey", href: "https://instagram.com" }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="Josiah Hestad"
          leftLink={{ text: "Privacy", href: "#" }}
          rightLink={{ text: "Connect", href: "#contact" }}
        />
      </div>
    </ThemeProvider>
  );
}