"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
// import NavbarLayoutFloatitlengOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import TeamCardOne from '@/components/sections/team/TeamCardOne';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactText from '@/components/sections/contact/ContactText';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Award, BookOpen, HelpCircle, Star, Users, Zap } from 'lucide-react';
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";

export default function ITAcademyPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="small"
      sizing="mediumLargeSizeLargeTitles"
      background="floatingGradient"
      cardStyle="inset"
      primaryButtonStyle="inset-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="IT Academy"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Courses", id: "courses" },
            { name: "Team", id: "team" },
            { name: "Testimonials", id: "testimonials" }
          ]}
          button={{
            text: "Enroll Now",            href: "contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplit
          title="123"
          description="Measurable Results That Speak for Themselves"
          tag="Start Your Journey"
          tagIcon={Zap}
          background={{ variant: "glowing-orb" }}
          imageSrc="https://img.b2bpic.net/free-photo/man-working-energy-innovations-his-laptop_23-2148820170.jpg"
          imageAlt="Students learning coding and IT skills"
          imagePosition="right"
          buttons={[
            { text: "Browse Courses", href: "courses" },
            { text: "Free Demo", href: "contact" }
          ]}
          containerClassName="mt-8"
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardOne
          title="Meet Our Expert Instructors"
          description="Experienced professionals with proven track records in the tech industry"
          tag="Instructors"
          tagIcon={Users}
          textboxLayout="default"
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          useInvertedBackground="true"
          members={[
            {
              id: "1",              name: "Rajesh Kumar",              role: "Full-Stack Developer",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-young-man-scientist_23-2148820194.jpg",              imageAlt: "Rajesh Kumar"
            },
            {
              id: "2",              name: "Priya Sharma",              role: "Data Scientist",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-young-business-person-doing-internship_23-2149305396.jpg",              imageAlt: "Priya Sharma"
            },
            {
              id: "3",              name: "Amit Verma",              role: "Security Expert",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-colleagues-learning-work_23-2149300706.jpg",              imageAlt: "Amit Verma"
            },
            {
              id: "4",              name: "Deepa Singh",              role: "UI/UX Designer",              imageSrc: "https://img.b2bpic.net/free-photo/closeup-senior-lecturer-with-arms-crossed_1262-1753.jpg",              imageAlt: "Deepa Singh"
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <MetricSplitMediaAbout
          tag="About Us"
          tagIcon={Award}
          title="Test Title"
          description="Founded in 2015, IT Academy has trained over 5,000 students in cutting-edge technology. Our mission is to provide accessible, high-quality IT education that bridges the gap between academic learning and industry demands."
          metrics={[
            { value: "5000+", title: "Students Trained Successfully" },
            { value: "35%", title: "Job Placement Rate" }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/row-serious-focused-coworkers-sitting-table-typing-laptops_74855-10363.jpg"
          imageAlt="IT Academy classroom"
          useInvertedBackground="invertDefault"
          className="hover:shadow-xl transition-shadow duration-300"
          className="animate-zoom-in"
        />
      </div>

      <div id="courses" data-section="courses">
        <FeatureCardThree
          title="Our Signature Courses"
          description="Comprehensive curriculum designed by industry professionals"
          tag="Featured Programs"
          tagIcon={BookOpen}
          textboxLayout="default"
          gridVariant="three-columns-all-equal-width"
          gridVariant="three-columns-all-equal-width"
          gridVariant="three-columns-all-equal-width"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          features={[
            {
              id: "01",              title: "Full-Stack Web Development",              description: "Master HTML, CSS, JavaScript, React, Node.js, and databases. Build complete web applications from frontend to backend.",              imageSrc: "https://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104516.jpg",              imageAlt: "Web development course"
            },
            {
              id: "02",              title: "Python & Data Science",              description: "Learn Python programming, data analysis, machine learning, and AI. Prepare for data science and analytics careers.",              imageSrc: "https://img.b2bpic.net/free-photo/person-computing-software-code-laptop_482257-85707.jpg",              imageAlt: "Python and data science course"
            },
            {
              id: "03",              title: "Cybersecurity Essentials",              description: "Understand security principles, ethical hacking, and network protection. Earn industry-recognized certifications.",              imageSrc: "https://img.b2bpic.net/free-photo/man-working-energy-innovations-his-laptop_23-2148820170.jpg",              imageAlt: "Cybersecurity course"
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardFourteen
          title="Measurable Results That Speak for Themselves"
          tag="Success Stats"
          metrics={[
            {
              id: "1",              value: "12 weeks",              description: "Average time to complete a comprehensive course while maintaining flexible schedules"
            },
            {
              id: "2",              value: "₹3-8 LPA",              description: "Average salary increase for graduates within 6 months of completing our programs"
            }
          ]}
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="What Our Students Say"
          description="Real success stories from graduates who transformed their careers"
          tag="Testimonials"
          tagIcon={Star}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
          speed={40}
          topMarqueeDirection="left"
          testimonials={[
            {
              id: "1",              name: "Arjun Patel",              handle: "@arjunpatel",              testimonial: "IT Academy transformed my career. Within 3 months of the course, I landed my dream job as a full-stack developer. Highly recommended!",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-young-business-person-doing-internship_23-2149305397.jpg",              imageAlt: "Arjun Patel"
            },
            {
              id: "2",              name: "Neha Gupta",              handle: "@nehagupta",              testimonial: "The instructors were incredibly knowledgeable and the curriculum was industry-relevant. Best investment in my future!",              imageSrc: "https://img.b2bpic.net/free-photo/mid-shot-counselor-cabinet_23-2148759108.jpg",              imageAlt: "Neha Gupta"
            },
            {
              id: "3",              name: "Vikram Singh",              handle: "@vikramsingh",              testimonial: "From zero coding experience to building production-ready applications. The hands-on approach here is unmatched.",              imageSrc: "https://img.b2bpic.net/free-photo/teacher-holding-english-class_23-2149402693.jpg",              imageAlt: "Vikram Singh"
            },
            {
              id: "4",              name: "Anjali Reddy",              handle: "@anjalitech",              testimonial: "The mentorship and career guidance I received were invaluable. I got 3 job offers after completing the course!",              imageSrc: "https://img.b2bpic.net/free-photo/mature-business-manager-office_1098-21368.jpg",              imageAlt: "Anjali Reddy"
            },
            {
              id: "5",              name: "Rohan Kapoor",              handle: "@rohankapoor",              testimonial: "Excellent curriculum with real-world projects. The community support and peer learning made it even better.",              imageSrc: "https://img.b2bpic.net/free-photo/smiley-teacher-holding-tablet_23-2148668619.jpg",              imageAlt: "Rohan Kapoor"
            },
            {
              id: "6",              name: "Sneha Nair",              handle: "@snehanair",              testimonial: "Not just a course, but a complete career transformation program. I transitioned into tech successfully!",              imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-smiley-woman-library_23-2149204753.jpg",              imageAlt: "Sneha Nair"
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitMedia
          title="Frequently Asked Questions"
          description="Everything you need to know about our programs and enrollment"
          tag="FAQ"
          tagIcon={HelpCircle}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          mediaPosition="left"
          imageSrc="https://img.b2bpic.net/free-photo/young-distraught-call-center-agent-communicating-with-client-while-using-desktop-pc-office_637285-6461.jpg"
          imageAlt="Customer support illustration"
          faqs={[
            {
              id: "1",              title: "What are the prerequisites for enrolling?",              content: "Most of our courses are beginner-friendly and don't require prior programming experience. Basic computer literacy is helpful. We offer starter modules for absolute beginners."
            },
            {
              id: "2",              title: "What is the course duration?",              content: "Our courses typically range from 8-16 weeks depending on the program. You can learn at your own pace with flexible schedules, and lifetime access to course materials."
            },
            {
              id: "3",              title: "Do you provide job placement assistance?",              content: "Yes! We provide career coaching, resume building, interview preparation, and direct job placement assistance. Our 95% job placement rate speaks for itself."
            },
            {
              id: "4",              title: "What certifications will I receive?",              content: "You'll receive an IT Academy completion certificate recognized by industry partners. We also offer prep for industry certifications like AWS, CompTIA, and others."
            },
            {
              id: "5",              title: "Is there a money-back guarantee?",              content: "Yes, we offer a 30-day money-back guarantee if you're not satisfied with the course. No questions asked."
            },
            {
              id: "6",              title: "Can I access the course materials after completion?",              content: "Absolutely! You get lifetime access to all course materials, including updated content and new modules added in the future."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to launch your IT career? Join hundreds of successful graduates who transformed their futures at IT Academy."
          animationType="background-highlight"
          buttons={[
            { text: "Start Your Journey", href: "https://example.com/enroll" },
            { text: "Schedule a Consultation", href: "contact" }
          ]}
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={[
            {
              title: "Navigate",              items: [
                { label: "Home", href: "#hero" },
                { label: "Courses", href: "#courses" },
                { label: "About Us", href: "#about" },
                { label: "Team", href: "#team" }
              ]
            },
            {
              title: "Programs",              items: [
                { label: "Web Development", href: "https://example.com/web-dev" },
                { label: "Data Science", href: "https://example.com/data-science" },
                { label: "Cybersecurity", href: "https://example.com/cybersecurity" },
                { label: "Cloud Computing", href: "https://example.com/cloud" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Blog", href: "https://example.com/blog" },
                { label: "FAQ", href: "#faq" },
                { label: "Testimonials", href: "#testimonials" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "https://example.com/privacy" },
                { label: "Terms of Service", href: "https://example.com/terms" },
                { label: "Refund Policy", href: "https://example.com/refund" }
              ]
            }
          ]}
          bottomLeftText="© 2025 IT Academy. All rights reserved."
          bottomRightText="Empowering Tech Careers Since 2015"
          className="mt-10"
        />
      </div>
    </ThemeProvider>
  );
}