"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import { BarChart, Users, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-magnetic"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="smallMedium"
        sizing="large"
        background="grid"
        cardStyle="outline"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="glass"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",          id: "hero"},
        {
          name: "Curriculum",          id: "features"},
        {
          name: "Pricing",          id: "pricing"},
        {
          name: "Support",          id: "faq"},
      ]}
      brandName="LearnAI"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboard
      background={{
        variant: "plain"}}
      title="Master the Future of AI Learning"
      description="Accelerate your career with industry-leading AI curriculum, expert-led workshops, and hands-on projects designed for the next generation of engineers."
      buttons={[
        {
          text: "Start Learning",          href: "#features"},
        {
          text: "Contact Us",          href: "#contact"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/3d-render-network-communications-with-flowing-connecting-lines-dots_1048-13580.jpg"
      imageAlt="AI technology learning background"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/waist-up-shot-thoughtful-young-woman-with-curly-hair-wears-spectacles-casual-clothes-carries-tablet-strolls-outside-urban-setting-clever-female-student-holds-modern-gadget-poses-street_273609-56927.jpg",          alt: "Student portrait 1"},
        {
          src: "http://img.b2bpic.net/free-photo/young-female-student-stands-with-digital-tablet-her-hands-outside_169016-25043.jpg",          alt: "Student portrait 2"},
        {
          src: "http://img.b2bpic.net/free-photo/person-indian-origin-having-fun_23-2150285308.jpg",          alt: "Student portrait 3"},
        {
          src: "http://img.b2bpic.net/free-photo/positive-guy-glasses-holding-tablet-looking_74855-3039.jpg",          alt: "Student portrait 4"},
        {
          src: "http://img.b2bpic.net/free-photo/tired-man-computer_23-2147717292.jpg",          alt: "Student portrait 5"},
      ]}
      avatarText="Join 10,000+ active learners"
      marqueeItems={[
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/3d-render-modern-background-with-flowing-particle-design_1048-13547.jpg",          alt: "Particle tech design"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/3d-render-abstract-cyber-particles-background-with-shallow-depth-field_1048-13249.jpg",          alt: "Cyber particles"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/3d-render-abstract-background-flowing-particles_1048-14872.jpg",          alt: "Flowing particles"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/3d-abstract-digital-particle-waves-design-background_1048-12573.jpg",          alt: "Digital wave design"},
        {
          type: "text",          text: "AI-Powered Excellence"},
      ]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyFive
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          title: "Foundation Pathways",          description: "Master core concepts through interactive sessions.",          icon: Zap,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-vector/artificial-intelligence-elements-collection-flat-style_23-2147868685.jpg",              imageAlt: "Foundations"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/network-concept-with-squares_23-2148999176.jpg",              imageAlt: "Foundations Details"},
          ],
        },
        {
          title: "Analytics Dashboard",          description: "Track your progress with real-time performance tracking.",          icon: BarChart,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/public-examination-preparation-concept_23-2149369872.jpg",              imageAlt: "Analytics"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/person-using-tablet_53876-41005.jpg",              imageAlt: "Analytics Details"},
          ],
        },
        {
          title: "Collaborative Mentorship",          description: "Learn side-by-side with industry experts.",          icon: Users,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/young-man-using-portable-notebook-cafe-sitting-table-by-window-typing-something-frowning_343059-118.jpg",              imageAlt: "Mentorship"},
            {
              imageSrc: "http://img.b2bpic.net/free-photo/successful-female-entrepreneur-collaborates-with-her-experts-team_482257-122594.jpg",              imageAlt: "Mentorship Details"},
          ],
        },
      ]}
      title="Curriculum Built for Success"
      description="Comprehensive pathways from foundational ML to advanced neural architectures."
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardEight
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      plans={[
        {
          id: "basic",          badge: "Essential",          price: "$199",          subtitle: "For beginners",          buttons: [
            {
              text: "Enroll Now"},
          ],
          features: [
            "Core ML concepts",            "Access to community",            "Monthly workshops"],
        },
        {
          id: "pro",          badge: "Pro",          price: "$499",          subtitle: "For professionals",          buttons: [
            {
              text: "Enroll Now"},
          ],
          features: [
            "Everything in Basic",            "Advanced project modules",            "Mentorship access",            "Industry certification"],
        },
      ]}
      title="Flexible Learning Plans"
      description="Choose the learning path that matches your current expertise."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSixteen
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",          name: "Alice M.",          role: "Engineer",          company: "Tech",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/young-man-using-portable-notebook-cafe-sitting-table-by-window-typing-something-frowning_343059-118.jpg"},
        {
          id: "2",          name: "Bob D.",          role: "Developer",          company: "Lab",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-man-sunglasses-sitting-along-with-laptop-white-space_140725-11140.jpg"},
        {
          id: "3",          name: "Charlie S.",          role: "Analyst",          company: "Growth",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/paralysed-disabled-invalid-handicapped-work-colleague-looking-front-tired-upset-caused-his-disabilities-working-economic-business-office_482257-2084.jpg"},
        {
          id: "4",          name: "Diana K.",          role: "Manager",          company: "Product",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/cheerful-young-queer-girl-glasses-denim-jacket-standing-near-rainbow-wall-cross-hands-chest-smiling-camera-happy-lifestyle-urban-life-generation-concept_197531-30548.jpg"},
        {
          id: "5",          name: "Ethan R.",          role: "Researcher",          company: "Science",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/authentic-small-youthful-marketing-agency_23-2150167349.jpg"},
      ]}
      kpiItems={[
        {
          value: "10k+",          label: "Learners"},
        {
          value: "500+",          label: "Expert Tutors"},
        {
          value: "95%",          label: "Placement Rate"},
      ]}
      title="Voices of the Community"
      description="Hear how LearnAI has transformed professional journeys."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitMedia
      textboxLayout="split"
      useInvertedBackground={true}
      faqs={[
        {
          id: "q1",          title: "Do I need coding experience?",          content: "Our beginner courses start from the fundamentals."},
        {
          id: "q2",          title: "Can I get a certificate?",          content: "All advanced programs include official industry certifications."},
        {
          id: "q3",          title: "How long are the courses?",          content: "Programs typically last 8-12 weeks based on intensity."},
      ]}
      mediaAnimation="slide-up"
      title="Common Inquiries"
      description="Everything you need to know about starting your AI journey."
      faqsAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/digital-tablet-online-learning_53876-97299.jpg"
      imageAlt="Digital tablet for online learning"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplit
      useInvertedBackground={false}
      background={{
        variant: "plain"}}
      tag="Get in touch"
      title="Start Your AI Journey"
      description="Sign up for our newsletter to get industry news, tips, and course early access."
      imageSrc="http://img.b2bpic.net/free-photo/arrow-symbol-illustrated_23-2151909716.jpg"
      mediaAnimation="slide-up"
      imageAlt="Abstract tech background blue"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseCard
      logoText="LearnAI"
      columns={[
        {
          title: "Explore",          items: [
            {
              label: "Pathways",              href: "#features"},
            {
              label: "Pricing",              href: "#pricing"},
          ],
        },
        {
          title: "Company",          items: [
            {
              label: "About",              href: "#"},
            {
              label: "Careers",              href: "#"},
          ],
        },
        {
          title: "Legal",          items: [
            {
              label: "Privacy",              href: "#"},
            {
              label: "Terms",              href: "#"},
          ],
        },
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}