"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import TextAbout from '@/components/sections/about/TextAbout';
import { BookOpen, Users, CheckCircle, GraduationCap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="smallMedium"
        sizing="medium"
        background="noiseDiagonalGradient"
        cardStyle="glass-elevated"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="glass"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
            <NavbarStyleFullscreen
              navItems={[
                { name: "Home", id: "hero" },
                { name: "About", id: "about" },
                { name: "Academics", id: "features" },
                { name: "Contact", id: "contact" },
              ]}
              brandName="Kiran School"
            />
        </div>

        <div id="hero" data-section="hero">
            <HeroOverlay
              title="Inspiring Futures at Kiran School"
              description="A nurturing educational environment dedicated to empowering the leaders of tomorrow through academic excellence and values-driven learning."
              imageSrc="http://img.b2bpic.net/free-photo/diverse-group-students-sitting-classroom_23-2148560127.jpg"
              showBlur={true}
              avatarText="Empowering 500+ students"
            />
        </div>

        <div id="about" data-section="about">
            <TextAbout
              useInvertedBackground={false}
              title="Building Foundations for Life"
              tag="Our Mission"
              tagIcon={GraduationCap}
              className="pb-12"
            />
        </div>

        <div id="features" data-section="features">
            <FeatureCardTwentySix
              textboxLayout="default"
              useInvertedBackground={false}
              features={[
                {
                  title: "Holistic Curriculum",                  description: "Balanced approach to core academics, arts, and character development.",                  buttonIcon: BookOpen,
                },
                {
                  title: "Expert Faculty",                  description: "Passionate educators committed to individualized student growth.",                  buttonIcon: Users,
                },
                {
                  title: "Modern Facilities",                  description: "Safe, innovative spaces designed to spark curiosity and creativity.",                  buttonIcon: CheckCircle,
                },
                {
                  title: "Community Spirit",                  description: "Building lifelong friendships in a supportive, inclusive environment.",                  buttonIcon: GraduationCap,
                },
              ]}
              title="What Makes Kiran School Unique?"
              description="We combine traditional values with modern teaching techniques to prepare students for a rapidly changing world."
            />
        </div>

        <div id="contact" data-section="contact">
            <ContactCTA
              useInvertedBackground={false}
              background={{ variant: "plain" }}
              tag="Admissions"
              title="Join Our Family"
              description="Begin your journey with Kiran School. We are accepting applications for the upcoming academic year."
              buttons={[
                { text: "Schedule a Visit", href: "#" },
                { text: "Apply Now", href: "#" }
              ]}
            />
        </div>

        <div id="footer" data-section="footer">
            <FooterLogoEmphasis
              columns={[
                { items: [{ label: "Home", href: "#hero" }, { label: "About", href: "#about" }] },
                { items: [{ label: "Academics", href: "#features" }, { label: "Admissions", href: "#contact" }] },
              ]}
              logoText="Kiran School"
            />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}