"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import SplitAbout from '@/components/sections/about/SplitAbout';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Award, Code, Briefcase, Clock, Lightbulb, Users, Target } from 'lucide-react';

export default function AboutPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="mediumSmall"
      sizing="medium"
      background="aurora"
      cardStyle="gradient-bordered"
      primaryButtonStyle="flat"
      secondaryButtonStyle="solid"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="TechAcademy"
          navItems={[
            { name: "Courses", id: "/courses" },
            { name: "About", id: "/about" },
            { name: "Pricing", id: "/pricing" },
            { name: "Contact", id: "/contact" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <SplitAbout
          title="Our Mission: Transforming Lives Through Technology Education"
          description="TechAcademy was founded with the vision of democratizing technology education and making high-quality IT training accessible to everyone. We believe that with the right guidance and resources, anyone can build a successful career in technology."
          tag="Our Story"
          tagIcon={Lightbulb}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          bulletPoints={[
            {
              title: "Industry-Experienced Instructors",
              description: "Our team consists of professionals currently working in top tech companies",
              icon: Award
            },
            {
              title: "Real-World Projects",
              description: "Every course includes hands-on projects based on actual industry challenges",
              icon: Code
            },
            {
              title: "Career-First Approach",
              description: "Our curriculum is designed with input from hiring managers at leading tech firms",
              icon: Briefcase
            },
            {
              title: "Lifetime Learning Community",
              description: "Access to our alumni network and continuous learning resources for life",
              icon: Clock
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/close-up-binary-script-running-pc-monitors_482257-123753.jpg"
          imageAlt="Technology education environment"
          imagePosition="right"
        />
      </div>

      <div id="values" data-section="values">
        <SplitAbout
          title="Our Core Values"
          description="These principles guide everything we do at TechAcademy, from curriculum design to student support."
          tag="What Drives Us"
          tagIcon={Target}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          bulletPoints={[
            {
              title: "Accessibility",
              description: "Technology education should be available to everyone, regardless of background",
              icon: Users
            },
            {
              title: "Excellence",
              description: "We maintain the highest standards in curriculum quality and instruction",
              icon: Award
            },
            {
              title: "Innovation",
              description: "We constantly evolve our teaching methods to stay ahead of industry trends",
              icon: Lightbulb
            },
            {
              title: "Community",
              description: "Learning is better together - we foster a supportive, collaborative environment",
              icon: Users
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/colleagues-working-together-medium-shot_52683-99761.jpg"
          imageAlt="Collaborative learning environment"
          imagePosition="left"
        />
      </div>

      <div id="team-testimonials" data-section="team-testimonials">
        <TestimonialCardOne
          title="Meet Our Expert Instructors"
          description="Learn from industry professionals who bring real-world experience to the classroom"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          tag="Our Team"
          testimonials={[
            {
              id: "1",
              name: "Dr. Maria Santos",
              role: "Lead Instructor",
              company: "Data Science Track",
              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-men-discussing-work_52683-101636.jpg",
              imageAlt: "Dr. Maria Santos"
            },
            {
              id: "2",
              name: "James Wilson",
              role: "Senior Developer",
              company: "Full Stack Bootcamp",
              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/close-up-people-learning-together_23-2149204794.jpg",
              imageAlt: "James Wilson"
            },
            {
              id: "3",
              name: "Sarah Chen",
              role: "UX Design Lead",
              company: "Design Track",
              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/side-view-people-studying-classroom_23-2150312824.jpg",
              imageAlt: "Sarah Chen"
            },
            {
              id: "4",
              name: "Alex Rodriguez",
              role: "Mobile Development Expert",
              company: "iOS/Android Track",
              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/people-looking-picture-albums_23-2149444423.jpg",
              imageAlt: "Alex Rodriguez"
            }
          ]}
        />
      </div>

      <FooterMedia
        imageSrc="https://img.b2bpic.net/free-photo/programming-background-with-person-working-with-codes-computer_23-2150010118.jpg"
        imageAlt="Technology and digital transformation"
        logoText="TechAcademy"
        copyrightText="© 2025 TechAcademy. All rights reserved."
        columns={[
          {
            title: "Courses",
            items: [
              { label: "All Courses", href: "/courses" },
              { label: "Web Development", href: "/courses" },
              { label: "Data Science", href: "/courses" },
              { label: "Mobile Apps", href: "/courses" }
            ]
          },
          {
            title: "Company",
            items: [
              { label: "About Us", href: "/about" },
              { label: "Careers", href: "#" },
              { label: "Blog", href: "#" },
              { label: "Contact", href: "/contact" }
            ]
          },
          {
            title: "Support",
            items: [
              { label: "Help Center", href: "#" },
              { label: "Community", href: "#" },
              { label: "Terms of Service", href: "#" },
              { label: "Privacy Policy", href: "#" }
            ]
          }
        ]}
      />
    </ThemeProvider>
  );
}