"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
import FeatureCardTwentyFour from "@/components/sections/feature/FeatureCardTwentyFour";
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import { Target, Award, Star } from "lucide-react";

export default function AboutPage() {
  const navItems = [
    { name: "Home", id: "home" },
    { name: "Trainers", id: "trainers" },
    { name: "Events", id: "events" },
    { name: "Communities", id: "communities" },
    { name: "About", id: "about" },
  ];

  const footerColumns = [
    {
      title: "Platform",
      items: [
        { label: "Find Trainers", href: "/trainers" },
        { label: "Discover Events", href: "/events" },
        { label: "Join Communities", href: "/communities" },
        { label: "Dashboard", href: "/dashboard" },
      ],
    },
    {
      title: "Company",
      items: [
        { label: "About Us", href: "/about" },
        { label: "Careers", href: "#" },
        { label: "Blog", href: "#" },
        { label: "Press", href: "#" },
      ],
    },
    {
      title: "Support",
      items: [
        { label: "Help Center", href: "#" },
        { label: "Contact Us", href: "#" },
        { label: "Safety Guidelines", href: "#" },
        { label: "Community Standards", href: "#" },
      ],
    },
    {
      title: "Legal",
      items: [
        { label: "Privacy Policy", href: "#" },
        { label: "Terms of Service", href: "#" },
        { label: "Cookie Policy", href: "#" },
        { label: "Accessibility", href: "#" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="medium"
      sizing="medium"
      background="noise"
      cardStyle="glass-depth"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="layered"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="FitnessaCollective"
          navItems={navItems}
        />
      </div>

      <div id="about-mission" data-section="about-mission">
        <TestimonialAboutCard
          tag="Our Mission"
          tagIcon={Target}
          tagAnimation="blur-reveal"
          title="Transforming Mumbai's Fitness Culture"
          description="FitnessaCollective reimagines how Mumbai engages with fitness by creating a seamless, unified platform connecting elite trainers, exciting events, and thriving communities."
          subdescription="We believe fitness thrives in community. Our ecosystem empowers individuals to find the perfect trainer, discover meaningful events, and build lasting connections with like-minded fitness enthusiasts across Mumbai."
          icon={Target}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8SAGkNg6dDslfeJ9cLBIp5dqh/a-large-group-of-diverse-fitness-communi-1773869258894-94aadcab.png?_wi=3"
          imageAlt="FitnessaCollective community gathering"
          mediaAnimation="opacity"
          useInvertedBackground={true}
        />
      </div>

      <div id="about-values" data-section="about-values">
        <FeatureCardTwentyFour
          title="Our Core Values"
          description="At FitnessaCollective, we are driven by core values that define how we serve Mumbai's fitness community. We prioritize excellence, inclusivity, and genuine connection through every interaction."
          tag="What We Stand For"
          tagIcon={Award}
          tagAnimation="blur-reveal"
          features={[
            {
              id: "value-1",
              title: "Elite Excellence",
              author: "Premium Standards",
              description: "We maintain the highest standards in trainer verification, event quality, and user experience. Every professional on our platform is thoroughly vetted and holds relevant certifications.",
              tags: ["Verified", "Certified", "Premium"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8SAGkNg6dDslfeJ9cLBIp5dqh/a-professional-headshot-composition-of-m-1773869258401-06329eac.png?_wi=3",
              imageAlt: "Elite fitness professionals",
            },
            {
              id: "value-2",
              title: "Community First",
              author: "Connection & Belonging",
              description: "Fitness thrives in community. We foster genuine connections between trainers, event organizers, and fitness enthusiasts, creating spaces where people support and inspire each other.",
              tags: ["Community", "Connection", "Inclusive"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8SAGkNg6dDslfeJ9cLBIp5dqh/an-active-diverse-fitness-community-gath-1773869258456-f9a868c5.png?_wi=3",
              imageAlt: "Thriving fitness community",
            },
            {
              id: "value-3",
              title: "Seamless Innovation",
              author: "Technology & Design",
              description: "We blend cutting-edge technology with elegant design to create an intuitive platform. Our seamless experience lets users focus on their fitness journey, not navigating complexity.",
              tags: ["Innovation", "Design", "User-Centric"],
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8SAGkNg6dDslfeJ9cLBIp5dqh/a-vibrant-well-organized-fitness-event-w-1773869259820-f66f4ec5.png?_wi=2",
              imageAlt: "Modern fitness innovation",
            },
          ]}
          animationType="slide-up"
          textboxLayout="split"
          useInvertedBackground={false}
        />
      </div>

      <div id="about-testimonials" data-section="about-testimonials">
        <TestimonialCardSixteen
          title="Trusted by Mumbai's Best"
          description="Thousands of fitness professionals and enthusiasts trust FitnessaCollective to elevate their fitness journey and build meaningful connections."
          tag="Community Trust"
          tagIcon={Star}
          tagAnimation="blur-reveal"
          testimonials={[
            {
              id: "testimonial-1",
              name: "Priya Sharma",
              role: "Marathon Runner",
              company: "Mumbai Running Collective",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8SAGkNg6dDslfeJ9cLBIp5dqh/a-professional-portrait-photograph-of-a--1773869256854-6079cfda.png?_wi=2",
            },
            {
              id: "testimonial-2",
              name: "Arjun Kapoor",
              role: "Strength Coach",
              company: "Elite Fitness Mumbai",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8SAGkNg6dDslfeJ9cLBIp5dqh/a-professional-portrait-of-a-male-fitnes-1773869257396-b7dd9b87.png?_wi=2",
            },
            {
              id: "testimonial-3",
              name: "Anaya Patel",
              role: "Yoga Instructor",
              company: "Wellness Haven",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8SAGkNg6dDslfeJ9cLBIp5dqh/a-serene-professional-portrait-of-a-fema-1773869256866-3f2f98d8.png?_wi=2",
            },
            {
              id: "testimonial-4",
              name: "Rohan Singh",
              role: "Fitness Enthusiast",
              company: "CrossFit Mumbai",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8SAGkNg6dDslfeJ9cLBIp5dqh/a-dynamic-professional-portrait-of-a-mal-1773869257881-21df2f61.png?_wi=2",
            },
          ]}
          kpiItems={[
            { value: "10K+", label: "Active Members" },
            { value: "500+", label: "Verified Trainers" },
            { value: "200+", label: "Monthly Events" },
          ]}
          animationType="depth-3d"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="FitnessaCollective"
          columns={footerColumns}
          copyrightText="© 2025 FitnessaCollective. All rights reserved. Transforming Mumbai's fitness culture."
        />
      </div>
    </ThemeProvider>
  );
}