"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroLogoBillboard from "@/components/sections/hero/HeroLogoBillboard";
import AboutMetric from "@/components/sections/about/AboutMetric";
import FeatureCardTen from "@/components/sections/feature/FeatureCardTen";
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
import ContactFaq from "@/components/sections/contact/ContactFaq";
import FooterSimple from "@/components/sections/footer/FooterSimple";
import { Award, BookOpen, CheckCircle, Globe, GraduationCap, QrCode, Star, Target, Trophy, Users } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="mediumLarge"
      sizing="largeSmall"
      background="noise"
      cardStyle="gradient-radial"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Scholar"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Programs", id: "features" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Download App",            href: "#"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboard
          logoText="Scholar Academy"
          description="Empowering the next generation of learners with innovative education, world-class facilities, and dedicated mentorship for academic excellence and personal growth."
          buttons={[
            { text: "Explore Programs", href: "#features" },
            { text: "Admission Info", href: "#contact" }
          ]}
          background={{ variant: "sparkles-gradient" }}
          imageSrc="http://img.b2bpic.net/free-photo/multiethnic-group-students-library-participate-lesson-with-doctor_482257-118528.jpg"
          imageAlt="Scholar Academy Campus"
          frameStyle="card"
          mediaAnimation="slide-up"
          buttonAnimation="slide-up"
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric
          title="Scholar Academy serves over 2,500 students with world-class education and holistic development programs designed to foster critical thinking, creativity, and character."
          useInvertedBackground={false}
          metrics={[
            { icon: Users, label: "Total Students", value: "2,500+" },
            { icon: Award, label: "Academic Excellence", value: "95%" },
            { icon: BookOpen, label: "Years of Service", value: "25+" },
            { icon: Target, label: "University Admissions", value: "98%" }
          ]}
          metricsAnimation="slide-up"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTen
          title="Core Programs"
          description="Comprehensive educational offerings designed to develop well-rounded students with strong academic foundations and practical life skills."
          tag="What We Offer"
          features={[
            {
              id: "1",              title: "Academic Excellence",              description: "Rigorous curriculum aligned with international standards, experienced faculty, and personalized learning paths to maximize student potential.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/happy-black-teacher-talking-her-students-while-giving-math-lesson-classroom_637285-9444.jpg" },
              items: [
                { icon: CheckCircle, text: "Expert faculty with advanced degrees" },
                { icon: CheckCircle, text: "Small class sizes for personalized attention" },
                { icon: CheckCircle, text: "Advanced lab facilities" }
              ],
              reverse: false
            },
            {
              id: "2",              title: "Sports & Activities",              description: "Diverse athletic programs and extracurricular activities fostering teamwork, leadership, and physical wellness in a supportive environment.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/young-women-playing-football_23-2149044700.jpg" },
              items: [
                { icon: CheckCircle, text: "Multiple sports teams and clubs" },
                { icon: CheckCircle, text: "Professional coaching staff" },
                { icon: CheckCircle, text: "State-of-the-art facilities" }
              ],
              reverse: true
            },
            {
              id: "3",              title: "Digital Innovation",              description: "Modern technology integration across all programs with computer labs, coding education, and digital literacy training for 21st-century readiness.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/adult-male-student-with-vr-simulator-library_74855-1078.jpg" },
              items: [
                { icon: CheckCircle, text: "Latest technology and devices" },
                { icon: CheckCircle, text: "Computer science programs" },
                { icon: CheckCircle, text: "Digital literacy training" }
              ],
              reverse: false
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardThree
          title="Our Impact"
          description="Measurable achievements in student success, academic performance, and community engagement demonstrate our commitment to excellence."
          metrics={[
            { id: "1", icon: Trophy, title: "Awards Won", value: "47" },
            { id: "2", icon: GraduationCap, title: "Graduates", value: "5,000+" },
            { id: "3", icon: Globe, title: "Countries", value: "35" },
            { id: "4", icon: Star, title: "Rating", value: "4.9/5" }
          ]}
          animationType="slide-up"
          useInvertedBackground={false}
          textboxLayout="default"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          faqs={[
            {
              id: "1",              title: "How do I apply for admission?",              content: "Visit our admissions portal or scan the QR code on campus. Complete the online application form with your academic records and personal information. Our admissions team will review your application and schedule an entrance assessment."
            },
            {
              id: "2",              title: "What are the school hours?",              content: "Classes run from 8:00 AM to 3:30 PM Monday through Friday. Extended care programs are available until 5:00 PM. Special schedules apply during exam periods and holidays."
            },
            {
              id: "3",              title: "Does the school offer transportation?",              content: "Yes, we provide comprehensive transportation services covering major areas of the city. Transportation fees are calculated based on distance and are included in the fee structure."
            },
            {
              id: "4",              title: "What extracurricular activities are available?",              content: "We offer 30+ clubs and activities including sports, music, arts, robotics, debate, and community service. Students can join multiple activities based on their interests and schedule."
            },
            {
              id: "5",              title: "How can I stay updated with school news?",              content: "Download our mobile app using the QR code, subscribe to our newsletter, or follow our social media channels. Important updates are also sent via SMS and email to registered parents."
            },
            {
              id: "6",              title: "What technology is used in classrooms?",              content: "All classrooms are equipped with interactive smartboards, projectors, and audio systems. Teachers use learning management systems for online assignments and communication with students and parents."
            }
          ]}
          ctaTitle="Scan to Connect"
          ctaDescription="Use our QR code to quickly access admission forms, event schedules, and student resources directly from your mobile device."
          ctaButton={{ text: "View QR Code", href: "#" }}
          ctaIcon={QrCode}
          useInvertedBackground={false}
          animationType="slide-up"
          accordionAnimationType="smooth"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={[
            {
              title: "Navigate",              items: [
                { label: "Home", href: "#hero" },
                { label: "About", href: "#about" },
                { label: "Programs", href: "#features" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Student Portal", href: "#" },
                { label: "Parent Portal", href: "#" },
                { label: "Library", href: "#" },
                { label: "Events", href: "#" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Facebook", href: "https://facebook.com" },
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Twitter", href: "https://twitter.com" },
                { label: "YouTube", href: "https://youtube.com" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Cookies", href: "#" },
                { label: "Accessibility", href: "#" }
              ]
            }
          ]}
          bottomLeftText="© 2025 Scholar Academy. All rights reserved."
          bottomRightText="Empowering learners for tomorrow"
        />
      </div>
    </ThemeProvider>
  );
}
