"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Sparkles, TrendingUp, Instagram, Linkedin, Twitter } from 'lucide-react';
import Link from "next/link";

export default function AboutPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="compact"
      sizing="large"
      background="circleGradient"
      cardStyle="glass-elevated"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Alesha"
          navItems={[
            { name: "Home", id: "/" },
            { name: "About", id: "/about" },
            { name: "Portfolio", id: "/portfolio" },
            { name: "Services", id: "/services" },
            { name: "Contact", id: "/contact" }
          ]}
          button={{
            text: "Get in Touch",            href: "/contact"
          }}
        />
      </div>

      <div id="about-detailed" data-section="about-detailed">
        <MetricSplitMediaAbout
          tag="Our Story"
          tagIcon={Sparkles}
          title="Two Decades of Excellence in Talent Representation"
          description="Founded in 2005, Alesha has established itself as a premier modeling agency with an unwavering commitment to excellence. Our comprehensive approach combines strategic career development with personalized representation, ensuring every model in our roster achieves sustainable success. We've cultivated enduring relationships with leading fashion houses, luxury brands, and prestigious publications worldwide."
          metrics={[
            { value: "150+", title: "Elite Models Represented" },
            { value: "500+", title: "Global Brand Partnerships" }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/medium-shot-women-testing-colours_23-2150538663.jpg"
          imageAlt="Alesha agency creative workspace"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="agency-impact" data-section="agency-impact">
        <MetricCardEleven
          title="Our Global Impact"
          description="Measurable success through talent achievement and industry leadership"
          tag="Impact"
          tagIcon={TrendingUp}
          metrics={[
            {
              id: "1",              value: "2K+",              title: "Fashion Week Appearances",              description: "Elite runway shows across Paris, Milan, New York, and London",              imageSrc: "https://img.b2bpic.net/free-photo/seductive-close-up-photo-beautiful-blonde-girl-cocktail-silk-dress-seduces-someone-touching-her-lips-by-her-finger_639032-835.jpg",              imageAlt: "Fashion runway show photography"
            },
            {
              id: "2",              value: "5K+",              title: "Campaign Bookings",              description: "Successful placements with luxury brands and editorial publications",              imageSrc: "https://img.b2bpic.net/free-photo/happy-attractive-woman-standing-gray-looking-camera_231208-9141.jpg",              imageAlt: "Professional editorial photography session"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="values-commitment" data-section="values-commitment">
        <MetricSplitMediaAbout
          tag="Our Values"
          tagIcon={Sparkles}
          title="Commitment to Excellence and Integrity"
          description="At Alesha, we believe in fostering long-term careers built on professionalism, authenticity, and strategic growth. Our personalized approach ensures each model receives the attention and guidance necessary to thrive in an increasingly competitive industry. We prioritize diversity, inclusion, and ethical practices in everything we do."
          metrics={[
            { value: "98%", title: "Client Satisfaction Rate" },
            { value: "85%", title: "Model Retention Over 3 Years" }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/medium-shot-women-testing-colours_23-2150538663.jpg"
          imageAlt="Team collaboration and strategic planning"
          useInvertedBackground="noInvert"
        />
      </div>

      <FooterCard
        logoText="Alesha"
        copyrightText="© 2025 Alesha Model Agency. All rights reserved."
        socialLinks={[
          { icon: Instagram, href: "https://instagram.com/alesha-models", ariaLabel: "Instagram" },
          { icon: Linkedin, href: "https://linkedin.com/company/alesha-models", ariaLabel: "LinkedIn" },
          { icon: Twitter, href: "https://twitter.com/alesha-models", ariaLabel: "Twitter" }
        ]}
      />
    </ThemeProvider>
  );
}