"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
import FooterBase from '@/components/sections/footer/FooterBase';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="mediumLarge"
        sizing="mediumLargeSizeMediumTitles"
        background="aurora"
        cardStyle="gradient-radial"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="glass"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "Inicio",          id: "hero"},
        {
          name: "Propósito",          id: "about"},
        {
          name: "Funciones",          id: "features"},
        {
          name: "Flashcards",          id: "pricing"},
        {
          name: "Contacto",          id: "contact"},
      ]}
      brandName="SVP Connect"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardCarousel
      background={{
        variant: "sparkles-gradient"}}
      title="Tu camino al éxito en SVP"
      description="Una plataforma integral diseñada por estudiantes, para estudiantes. Organiza, estudia y supera tus retos académicos con inteligencia y orden."
      buttons={[
        {
          text: "Empezar Ahora",          href: "#about"},
      ]}
      mediaItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/topview-notebook-mobile-phone-email-table-concept_53876-30091.jpg?_wi=1",          imageAlt: "Dashboard de estudio SVP"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/topview-notebook-mobile-phone-email-table-concept_53876-30091.jpg?_wi=2",          imageAlt: "Dashboard de estudio SVP"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/topview-notebook-mobile-phone-email-table-concept_53876-30091.jpg?_wi=3",          imageAlt: "Dashboard de estudio SVP"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/topview-notebook-mobile-phone-email-table-concept_53876-30091.jpg?_wi=4",          imageAlt: "Dashboard de estudio SVP"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/topview-notebook-mobile-phone-email-table-concept_53876-30091.jpg?_wi=5",          imageAlt: "Dashboard de estudio SVP"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/topview-notebook-mobile-phone-email-table-concept_53876-30091.jpg?_wi=6",          imageAlt: "Dashboard de estudio SVP"},
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <InlineImageSplitTextAbout
      useInvertedBackground={false}
      heading={[
        {
          type: "text",          content: "Creada "},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/serious-focused-young-african-college-student-yellow-t-shirt-busy-doing-home-assignment-writing-down-exercise-book-sitting-empty-coworking-space-early-morning-using-laptop-computer_273609-7492.jpg",          alt: "Sobre nosotros"},
        {
          type: "text",          content: " para transformar tu vida escolar"},
      ]}
      buttons={[
        {
          text: "Conoce más",          href: "#features"},
      ]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyNine
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      features={[
        {
          title: "Flashcards Inteligentes",          description: "Domina cualquier tema repasando con nuestro sistema de repetición espaciada.",          imageSrc: "http://img.b2bpic.net/free-photo/notebook-notepad-paper-reminder-with-text-good-day-flat-lay_169016-36823.jpg",          titleIconSrc: "Star",          buttonText: "Probar"},
        {
          title: "Asistente IA 24/7",          description: "Pregunta tus dudas y obtén explicaciones claras sin salir de tu centro de mando.",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-abstract-overstimulated-feelings_23-2151245470.jpg",          titleIconSrc: "Zap",          buttonText: "Preguntar"},
        {
          title: "Colaboración Estudiantil",          description: "Espacio interactivo para que nuestro comité comparta materiales y guías valiosas.",          imageSrc: "http://img.b2bpic.net/free-photo/teamwork-cooperation-creative-people-working-together-business-project_273609-5533.jpg",          titleIconSrc: "Users",          buttonText: "Unirse"},
      ]}
      title="Herramientas que marcan la diferencia"
      description="Todo lo que necesitas para ser el mejor estudiante de tu institución."
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardTwo
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      plans={[
        {
          id: "1",          badge: "Secundaria",          price: "1ro-2do",          subtitle: "Fundamentos",          features: [
            "Horario básico",            "Flashcards iniciales",            "IA GPT"],
          buttons: [
            {
              text: "Acceder"},
          ],
        },
        {
          id: "2",          badge: "Secundaria",          price: "3ro-4to",          subtitle: "Avance",          features: [
            "Planificación anual",            "Flashcards avanzadas",            "IA Pro"],
          buttons: [
            {
              text: "Acceder"},
          ],
        },
        {
          id: "3",          badge: "Secundaria",          price: "5to",          subtitle: "Excelencia",          features: [
            "Simulacros examen",            "Flashcards maestras",            "Comité IA"],
          buttons: [
            {
              text: "Acceder"},
          ],
        },
      ]}
      title="Tu Biblioteca de Estudio"
      description="Organízate por niveles y accede al conocimiento que necesitas."
    />
  </div>

  <div id="testimonial" data-section="testimonial">
      <TestimonialCardTen
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",          title: "Increíble cambio",          quote: "Esta app cambió mi forma de estudiar.",          name: "Sofia G.",          role: "1ro Secundaria",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-asian-girl-relaxing-park-watching-videos-reading-digital-tablet-sitting-benc_1258-151504.jpg"},
        {
          id: "2",          title: "Muy organizada",          quote: "Mis notas subieron demasiado.",          name: "Mateo R.",          role: "3ro Secundaria",          imageSrc: "http://img.b2bpic.net/free-photo/cheerful-asian-guy-resting-floor-books_1262-862.jpg"},
        {
          id: "3",          title: "La IA ayuda mucho",          quote: "Ya no me estreso tanto.",          name: "Valeria S.",          role: "2do Secundaria",          imageSrc: "http://img.b2bpic.net/free-photo/young-man-using-portable-notebook-cafe-sitting-table-by-window-typing-something-frowning_343059-118.jpg"},
        {
          id: "4",          title: "Súper intuitiva",          quote: "Es lo mejor del colegio.",          name: "Diego L.",          role: "4to Secundaria",          imageSrc: "http://img.b2bpic.net/free-photo/happy-girl-gesturing-class_23-2147663398.jpg"},
        {
          id: "5",          title: "Apoyo total",          quote: "Gracias al comité estudiantil.",          name: "Teniente A.",          role: "Comité",          imageSrc: "http://img.b2bpic.net/free-photo/student-posing-group-study-session-with-colleagues_23-2149211075.jpg"},
      ]}
      title="Voces de los Estudiantes"
      description="Testimonios reales de la comunidad SVP."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Únete a nuestro partido"
      description="Envíanos tus ideas para mejorar nuestro colegio juntos."
      inputs={[
        {
          name: "name",          type: "text",          placeholder: "Nombre completo"},
        {
          name: "email",          type: "email",          placeholder: "Correo institucional"},
      ]}
      textarea={{
        name: "message",        placeholder: "Tu sugerencia para la app"}}
      imageSrc="http://img.b2bpic.net/free-photo/laser-measuring-level-construction-work-shallow-depth-field-construction-laser-level-work-construction-finishing-works_166373-1897.jpg"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBase
      columns={[
        {
          title: "Plataforma",          items: [
            {
              label: "Inicio",              href: "#hero"},
            {
              label: "Nosotros",              href: "#about"},
          ],
        },
        {
          title: "Soporte",          items: [
            {
              label: "Contacto",              href: "#contact"},
            {
              label: "Privacidad",              href: "#"},
          ],
        },
      ]}
      logoText="SVP Connect"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}