"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 FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="bounce-effect"
        defaultTextAnimation="entrance-slide"
        borderRadius="soft"
        contentWidth="smallMedium"
        sizing="mediumLarge"
        background="noise"
        cardStyle="inset"
        primaryButtonStyle="primary-glow"
        secondaryButtonStyle="solid"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        {
          name: "Colecciones",
          id: "#collections",
        },
        {
          name: "Productos",
          id: "#products",
        },
        {
          name: "Nosotros",
          id: "#story",
        },
        {
          name: "Reseñas",
          id: "#reviews",
        },
      ]}
      brandName="KAYSENCLUB"
      button={{
        text: "Comprar Ahora",
        href: "#products",
      }}
      animateOnLoad={true}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboard
      background={{
        variant: "animated-grid",
      }}
      title="EVOLVED STREETWEAR KAYSENCLUB"
      description="Ropa que no sigue tendencias. Las crea. Corte oversize unisex, tela french terry premium, con detalles reflectantes que brillan en la oscuridad."
      tag="Colección 2025 · French Terry Oversize"
      tagAnimation="slide-up"
      buttons={[
        {
          text: "Ver Colecciones ↓",
          href: "#collections",
        },
        {
          text: "Nuestra Historia",
          href: "#story",
        },
      ]}
      buttonAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/front-view-man-with-afro-dreadlocks_23-2149462068.jpg"
      imageAlt="Model wearing dark techwear style hoodie"
      mediaAnimation="slide-up"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/young-teenage-boy-wearing-denim-outfit_23-2150151055.jpg",
          alt: "Young teenage boy wearing a denim outfit",
        },
        {
          src: "http://img.b2bpic.net/free-photo/front-view-man-working-as-nurse_23-2151061621.jpg",
          alt: "Front view man working as a nurse",
        },
        {
          src: "http://img.b2bpic.net/free-photo/young-man-wearing-chain-necklace_23-2149490503.jpg",
          alt: "Young man wearing chain necklace",
        },
        {
          src: "http://img.b2bpic.net/free-photo/close-up-smiling-boy-with-sportswear-dawn_23-2147562116.jpg",
          alt: "Close-up of smiling boy with sportswear at dawn",
        },
        {
          src: "http://img.b2bpic.net/free-photo/sleepy-mixed-race-man-portrait-deep-blue-background_633478-2106.jpg",
          alt: "Sleepy mixed race man portrait on a deep blue background",
        },
      ]}
      avatarText="+10K Miembros en KAYSENCLUB"
      marqueeItems={[
        {
          type: "text",
          text: "EDICIONES LIMITADAS ·",
        },
        {
          type: "image",
          src: "http://img.b2bpic.net/free-photo/close-up-beautiful-optical-fiber-details_23-2149212620.jpg",
          alt: "Close up on beautiful optical fiber details",
        },
        {
          type: "text",
          text: "DISEÑO INNOVADOR ·",
        },
        {
          type: "image",
          src: "http://img.b2bpic.net/free-photo/red-light-with-bokeh-effect_1208-206.jpg",
          alt: "Red light with bokeh effect",
        },
        {
          type: "text",
          text: "CALIDAD PREMIUM ·",
        },
        {
          type: "image",
          src: "http://img.b2bpic.net/free-photo/3d-data-science-background-with-flowing-particles_1048-18539.jpg",
          alt: "3D data science background with flowing particles",
        },
        {
          type: "text",
          text: "STREETWEAR EVOLUCIONADO ·",
        },
        {
          type: "image",
          src: "http://img.b2bpic.net/free-photo/3d-render-abstract-network-communications-background-design_1048-14877.jpg",
          alt: "3D render of an abstract network communications background design",
        },
        {
          type: "text",
          text: "ACTITUD ORIGINAL ·",
        },
      ]}
      marqueeSpeed={30}
      showMarqueeCard={true}
    />
  </div>

  <div id="collections" data-section="collections">
      <FeatureCardTwentyNine
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="bento-grid"
      useInvertedBackground={true}
      features={[
        {
          title: "EVOLVED",
          description: "Criatura del abismo · Diseño dark techwear · Kanji 深海の恐怖",
          imageSrc: "/mnt/user-data/uploads/ChatGPT_Image_10_jun_2026__05_05_13_p_m_.png",
          imageAlt: "Evolved Collection t-shirt",
          titleImageSrc: "/mnt/user-data/uploads/ChatGPT_Image_10_jun_2026__05_05_13_p_m_.png",
          buttonText: "Explorar",
          buttonHref: "#products",
        },
        {
          title: "DRIVE",
          description: "Audi R8 · アウディ R8 · WINNER · Racing Techwear",
          imageSrc: "/mnt/user-data/uploads/ChatGPT_Image_10_jun_2026__05_08_03_p_m_.png",
          imageAlt: "Drive Collection t-shirt",
          titleImageSrc: "/mnt/user-data/uploads/ChatGPT_Image_10_jun_2026__05_08_03_p_m_.png",
          buttonText: "Explorar",
          buttonHref: "#products",
        },
        {
          title: "ANIME COLLECTION",
          description: "La próxima frontera. Se revelan pronto.",
          imageSrc: "http://img.b2bpic.net/free-photo/anime-character-using-virtual-reality-glasses-metaverse_23-2151568833.jpg",
          imageAlt: "Coming Soon Anime Collection artwork",
          titleImageSrc: "http://img.b2bpic.net/free-photo/halloween-scene-illustration-anime-style_23-2151794291.jpg",
          buttonText: "Próximamente",
          buttonHref: "#",
        },
      ]}
      title="Las Colecciones"
      description="Dos universos distintos. Un solo código de identidad."
    />
  </div>

  <div id="material" data-section="material">
      <FeatureCardTwentyNine
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="two-columns-alternating-heights"
      useInvertedBackground={false}
      features={[
        {
          title: "French Terry 100% Algodón",
          description: "Tela pesada de alta calidad. Suave por dentro, resistente por fuera. Hecha para durar.",
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-beautiful-optical-fiber-details_23-2149212633.jpg",
          imageAlt: "Fabric icon",
          titleImageSrc: "http://img.b2bpic.net/free-vector/futuristic-hud-background_23-2147942152.jpg",
          buttonText: "",
        },
        {
          title: "Corte Oversize Unisex",
          description: "Silueta amplia y estructurada. Diseñada para todos los cuerpos sin comprometer la estética.",
          imageSrc: "http://img.b2bpic.net/free-photo/abstract-background-from-brilliant-mosaic-pattern-generative-ai_169016-30230.jpg",
          imageAlt: "Lightning icon",
          titleImageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139314.jpg",
          buttonText: "",
        },
        {
          title: "Detalles Reflectantes",
          description: "Elementos de serigrafía reflectante que cobran vida bajo la luz artificial. Diseñado para la noche.",
          imageSrc: "http://img.b2bpic.net/free-photo/3d-render-modern-techno-with-flowing-particles-design_1048-13727.jpg",
          imageAlt: "Lightbulb icon",
          titleImageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139370.jpg",
          buttonText: "",
        },
        {
          title: "Impresión de Alta Definición",
          description: "Gráficos complejos con detalle milimétrico. Tintas que no se cuartean ni se decoloran.",
          imageSrc: "http://img.b2bpic.net/free-vector/big-data-grayscale-visualization-visual-data-complexity-complex-data-threads-graphic-social-network-representation-abstract-data-graph_1217-1938.jpg",
          imageAlt: "Paint palette icon",
          titleImageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-99209.jpg",
          buttonText: "",
        },
      ]}
      title="Hecho para Destacar"
      description="Cada pieza de KAYSENCLUB es una declaración. Materiales premium, cortes calculados y detalles que solo tú sabes que existen — hasta que la luz los delata."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={true}
      products={[
        {
          id: "p1",
          name: "Deep Creature Oversized Tee",
          price: "$699",
          imageSrc: "/mnt/user-data/uploads/ChatGPT_Image_10_jun_2026__05_05_13_p_m_.png",
          imageAlt: "Evolved Collection T-shirt",
        },
        {
          id: "p2",
          name: "R8 Racing Oversized Tee",
          price: "$699",
          imageSrc: "/mnt/user-data/uploads/ChatGPT_Image_10_jun_2026__05_08_03_p_m_.png",
          imageAlt: "Drive Collection T-shirt",
        },
        {
          id: "p3",
          name: "Black Series Hoodie",
          price: "$999",
          imageSrc: "http://img.b2bpic.net/free-photo/front-view-brothers-with-basketball_23-2150156947.jpg",
          imageAlt: "Black Oversized Hoodie",
        },
        {
          id: "p4",
          name: "White Vision Tee",
          price: "$599",
          imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-looking-camera_197531-33408.jpg",
          imageAlt: "White Vision T-shirt",
        },
        {
          id: "p5",
          name: "Crimson Flux Graphic Tee",
          price: "$649",
          imageSrc: "http://img.b2bpic.net/free-photo/woman-sending-air-kiss_23-2147957790.jpg",
          imageAlt: "Red Graphic T-shirt",
        },
        {
          id: "p6",
          name: "Urban Cargo Pants",
          price: "$1299",
          imageSrc: "http://img.b2bpic.net/free-photo/stylish-hipster-arab-man-guy-sunglasses-posed-outdoor-street-sunset-against-gray-wall_627829-2738.jpg",
          imageAlt: "Black Urban Cargo Pants",
        },
      ]}
      title="Todos los Drops"
      description="Explora nuestras últimas colecciones y encuentra tu próxima pieza favorita."
    />
  </div>

  <div id="story" data-section="story">
      <TextSplitAbout
      useInvertedBackground={false}
      title="No somos seguidores. Somos la señal."
      description={[
        "KAYSENCLUB nació de una pregunta simple: ¿por qué conformarse con ropa que no dice nada? Diseñamos para quienes viven en el límite entre la calle y el futuro.",
        "French terry oversize en negro profundo. Gráficos que cuentan historias — desde criaturas del abismo hasta máquinas de velocidad. Y siempre, ese detalle reflectante que solo se revela en la oscuridad.",
      ]}
    />
  </div>

  <div id="reviews" data-section="reviews">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={true}
      testimonials={[
        {
          id: "t1",
          name: "Miguel R.",
          date: "Junio 2025",
          title: "Calidad Brutal y Detalles Que Sorprenden",
          quote: "La calidad del french terry es brutal. La tela pesa bien, no se deforma después de lavarla. Y el detalle reflectante de los laterales... cuando le pegó la luz del flash literalmente brilló. Todo mundo me preguntó dónde la conseguí.",
          tag: "Verificado",
          avatarSrc: "http://img.b2bpic.net/free-photo/happy-cheerful-student-guy-standing-pale-outdoor-wall_74855-4289.jpg",
          avatarAlt: "Miguel R. Avatar",
          imageSrc: "/mnt/user-data/uploads/ChatGPT_Image_10_jun_2026__05_05_13_p_m_.png",
          imageAlt: "young man avatar profile picture",
        },
        {
          id: "t2",
          name: "Diego V.",
          date: "Julio 2025",
          title: "Diseño Increíble y Ajuste Perfecto",
          quote: "Compré la de la DRIVE collection — la del Audi R8. El diseño del volante y el carro están increíbles, muy detallado. El oversize queda perfecto, ni muy suelto ni muy pegado. La calidad supera lo que cuesta.",
          tag: "Verificado",
          avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-african-man-looking-camera_171337-12860.jpg",
          avatarAlt: "Diego V. Avatar",
          imageSrc: "/mnt/user-data/uploads/ChatGPT_Image_10_jun_2026__05_08_03_p_m_.png",
          imageAlt: "young man avatar profile picture",
        },
        {
          id: "t3",
          name: "Sofía K.",
          date: "Agosto 2025",
          title: "Superó mis Expectativas",
          quote: "Yo pensé que era solo otra marca más de streetwear, pero cuando la vi en persona me sorprendió mucho. La tela es súper premium, el corte es unisex y me queda increíble. Los kanji en la espalda le dan un toque muy único.",
          tag: "Verificado",
          avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-woman_23-2148827181.jpg",
          avatarAlt: "Sofía K. Avatar",
          imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-with-afro-dreadlocks_23-2149462068.jpg",
          imageAlt: "young man avatar profile picture",
        },
        {
          id: "t4",
          name: "Alejandro L.",
          date: "Septiembre 2025",
          title: "Diseños Exclusivos, Atención de 10",
          quote: "Desde que descubrí Kaysenclub, no puedo parar. Cada drop es una pieza de arte. La atención al cliente es excelente, siempre me han ayudado con mis dudas. ¡Recomendado!",
          tag: "Verificado",
          avatarSrc: "http://img.b2bpic.net/free-photo/happy-african-man-looking_171337-9799.jpg",
          avatarAlt: "Alejandro L. Avatar",
          imageSrc: "http://img.b2bpic.net/free-photo/anime-character-using-virtual-reality-glasses-metaverse_23-2151568833.jpg",
          imageAlt: "young man avatar profile picture",
        },
        {
          id: "t5",
          name: "Carla M.",
          date: "Octubre 2025",
          title: "Mi Marca Favorita de Streetwear",
          quote: "Me encanta cómo combinan lo urbano con toques futuristas y asiáticos. La ropa es súper cómoda y siempre recibo cumplidos. Mis hoodies de Kaysenclub son mis favoritas.",
          tag: "Verificado",
          avatarSrc: "http://img.b2bpic.net/free-vector/flat-design-profile-icon-set_23-2149499295.jpg",
          avatarAlt: "Carla M. Avatar",
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-beautiful-optical-fiber-details_23-2149212633.jpg",
          imageAlt: "young man avatar profile picture",
        },
      ]}
      title="Lo que Dicen"
      description="Cada prenda que sale de KAYSENCLUB lleva con ella una historia real."
    />
  </div>

  <div id="newsletter" data-section="newsletter">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Sé el primero. Siempre."
      description="Nuevos drops, preventa de colecciones y acceso anticipado. Solo para quienes están en la lista."
      inputs={[
        {
          name: "email",
          type: "email",
          placeholder: "tu@email.com",
          required: true,
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/abstract-blue-background_698452-1185.jpg"
      imageAlt="Abstract tech background"
      mediaPosition="right"
      buttonText="Entrar"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseCard
      logoText="KAYSENCLUB"
      columns={[
        {
          title: "Colecciones",
          items: [
            {
              label: "Evolved — Original",
              href: "#products",
            },
            {
              label: "Drive — Racing",
              href: "#products",
            },
            {
              label: "Anime — Próxima",
              href: "#products",
            },
            {
              label: "Ver Todo",
              href: "#collections",
            },
          ],
        },
        {
          title: "Info",
          items: [
            {
              label: "Nuestra Historia",
              href: "#story",
            },
            {
              label: "Reseñas",
              href: "#reviews",
            },
            {
              label: "Guía de Tallas",
              href: "#",
            },
            {
              label: "Cuidado de la Prenda",
              href: "#",
            },
          ],
        },
        {
          title: "Ayuda",
          items: [
            {
              label: "Envíos y Devoluciones",
              href: "#",
            },
            {
              label: "Preguntas Frecuentes",
              href: "#",
            },
            {
              label: "Contacto",
              href: "#",
            },
            {
              label: "Mayoreo",
              href: "#",
            },
          ],
        },
      ]}
      copyrightText="© 2025 KAYSENCLUB · Todos los derechos reservados"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
