"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TeamCardSix from '@/components/sections/team/TeamCardSix';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import { Heart, Sparkles } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="small"
        sizing="largeSmallSizeLargeTitles"
        background="grid"
        cardStyle="outline"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        {
          name: "Inicio",
          id: "#inicio",
        },
        {
          name: "Sobre Nosotros",
          id: "#sobre-nosotros",
        },
        {
          name: "Servicios",
          id: "#servicios",
        },
        {
          name: "Productos",
          id: "#productos",
        },
        {
          name: "Precios",
          id: "#precios",
        },
        {
          name: "Equipo",
          id: "#equipo",
        },
        {
          name: "Testimonios",
          id: "#testimonios",
        },
        {
          name: "FAQ",
          id: "#faq",
        },
        {
          name: "Contacto",
          id: "#contacto",
        },
      ]}
      brandName="Serenity Salon"
      button={{
        text: "Reservar Ahora",
        href: "#contacto",
      }}
    />
  </div>

  <div id="inicio" data-section="inicio">
      <HeroCarouselLogo
      logoText="Serenity Salon"
      description="Descubre un oasis de belleza y bienestar. En Serenity Salon, cada visita es una experiencia diseñada para tu completa relajación y renovación. Te invitamos a vivir la belleza en 3D."
      buttons={[
        {
          text: "Reservar Cita",
          href: "#contacto",
        },
        {
          text: "Explorar Servicios",
          href: "#servicios",
        },
      ]}
      slides={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-loft-luxury-living-room-with-design-chandelier_105762-2226.jpg",
          imageAlt: "Lujoso interior 3D de un salón de belleza con tonos suaves",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/woman-bathrobe-looking-cosmetics-near-mirror_171337-12774.jpg",
          imageAlt: "Peluquería moderna con estaciones de estilismo y espejos",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/3d-woman-lifestyle_23-2151925874.jpg",
          imageAlt: "Tranquila sala de tratamientos faciales en un spa",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/still-life-beauty-products-spreading-out_23-2151345078.jpg",
          imageAlt: "Mesa de manicura limpia y elegante con productos",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/small-table-chairs_1339-3303.jpg",
          imageAlt: "Lujosa zona de espera con sofá y decoración minimalista",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/anime-style-beauty-salon-with-cosmetology-equipment_23-2151500984.jpg",
          imageAlt: "Estantería organizada con productos de belleza de alta gama",
        },
      ]}
      autoplayDelay={4000}
    />
  </div>

  <div id="sobre-nosotros" data-section="sobre-nosotros">
      <TestimonialAboutCard
      useInvertedBackground={false}
      tag="Nuestra Filosofía"
      title="Donde la Belleza se Encuentra con la Tranquilidad"
      description="En Serenity Salon, creemos que la belleza es más que un simple servicio; es un ritual de autocuidado que nutre el cuerpo y el alma. Nuestro equipo de expertos está dedicado a proporcionarte tratamientos personalizados en un ambiente de lujo y serenidad."
      subdescription="Utilizamos solo productos de la más alta calidad y técnicas innovadoras para garantizar resultados excepcionales que te harán sentir radiante y rejuvenecida. Ven y experimenta la diferencia Serenity."
      icon={Heart}
      imageSrc="http://img.b2bpic.net/free-photo/high-angle-smiley-woman-stretching_23-2148285898.jpg"
      imageAlt="Mujer recibiendo un masaje facial relajante en un salón de belleza"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="servicios" data-section="servicios">
      <FeatureCardTwentyOne
      useInvertedBackground={true}
      title="Nuestros Servicios de Excelencia"
      description="Explora nuestra amplia gama de tratamientos diseñados para realzar tu belleza natural y proporcionarte una relajación profunda."
      tag="Experiencia Completa"
      accordionItems={[
        {
          id: "hair-care",
          title: "Cuidado Capilar Premium",
          content: "Ofrecemos cortes de vanguardia, coloraciones vibrantes, tratamientos de hidratación profunda y estilismos para cualquier ocasión. Nuestro equipo de estilistas expertos te asesorará para encontrar el look perfecto.",
        },
        {
          id: "skin-care",
          title: "Tratamientos Faciales y Corporales",
          content: "Desde limpiezas faciales revitalizantes hasta masajes relajantes y tratamientos corporales personalizados, cuidamos tu piel con los mejores productos y técnicas avanzadas para un resplandor duradero.",
        },
        {
          id: "nail-care",
          title: "Manicura y Pedicura de Lujo",
          content: "Transforma tus manos y pies con nuestros servicios de manicura y pedicura. Disfruta de esmaltes de larga duración, nail art creativo y tratamientos para la salud y belleza de tus uñas.",
        },
        {
          id: "waxing",
          title: "Depilación Profesional",
          content: "Servicios de depilación suaves y efectivos para una piel impecable. Utilizamos ceras de alta calidad y técnicas expertas para minimizar las molestias y dejar tu piel suave y sedosa.",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/portrait-beautiful-young-woman-with-red-lips-unusual-hair-style-gray_158538-2314.jpg"
      imageAlt="Mujer con cabello largo y brillante después de un tratamiento de peluquería"
      mediaAnimation="slide-up"
      mediaPosition="right"
    />
  </div>

  <div id="productos" data-section="productos">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="four-items-2x2-equal-grid"
      useInvertedBackground={false}
      products={[
        {
          id: "p-1",
          name: "Kit de Cuidado Capilar Rejuvenecedor",
          price: "€59.99",
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-skin-regeneration-products_23-2151242148.jpg",
          imageAlt: "Kit de champú y acondicionador para rejuvenecimiento capilar",
        },
        {
          id: "p-2",
          name: "Set Esencial de Skincare Antiedad",
          price: "€89.99",
          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-senior-woman-with-skin-care-treatment_23-2148278009.jpg",
          imageAlt: "Set de cremas y sueros faciales antiedad",
        },
        {
          id: "p-3",
          name: "Colección de Maquillaje Glow Up",
          price: "€75.00",
          imageSrc: "http://img.b2bpic.net/free-photo/view-different-lipstick-shades-texture_23-2149518367.jpg",
          imageAlt: "Paleta de maquillaje con tonos luminosos",
        },
        {
          id: "p-4",
          name: "Esmaltes de Uñas de Larga Duración (Set)",
          price: "€29.99",
          imageSrc: "http://img.b2bpic.net/free-photo/still-life-tools-nail-art_23-2150321317.jpg",
          imageAlt: "Set de esmaltes de uñas de colores vibrantes",
        },
        {
          id: "p-5",
          name: "Perfume Floral Serenity (50ml)",
          price: "€65.00",
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-hand-with-hair-product_23-2149173129.jpg",
          imageAlt: "Botella de perfume floral exclusiva",
        },
        {
          id: "p-6",
          name: "Herramientas de Estilismo Profesional",
          price: "€120.00",
          imageSrc: "http://img.b2bpic.net/free-photo/female-blogger-streaming-make-up-products-online-with-laptop_23-2148771568.jpg",
          imageAlt: "Secador de pelo y plancha profesionales",
        },
      ]}
      title="Productos de Belleza Exclusivos"
      description="Descubre nuestra selección de productos de alta gama, elegidos cuidadosamente para complementar tus tratamientos y mantener tu belleza en casa."
      tag="Calidad Premium"
    />
  </div>

  <div id="precios" data-section="precios">
      <PricingCardEight
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      plans={[
        {
          id: "basic",
          badge: "Esencial",
          price: "€79",
          subtitle: "Para un retoque rápido y efectivo",
          buttons: [
            {
              text: "Seleccionar Plan",
              href: "#contacto",
            },
          ],
          features: [
            "Corte y Peinado Básico",
            "Manicura Exprés",
            "Diseño de Cejas",
          ],
        },
        {
          id: "premium",
          badge: "Serenity Deluxe",
          badgeIcon: Sparkles,
          price: "€149",
          subtitle: "La experiencia completa de relajación y belleza",
          buttons: [
            {
              text: "Seleccionar Plan",
              href: "#contacto",
            },
          ],
          features: [
            "Tratamiento Capilar Profundo",
            "Facial Hidratante",
            "Manicura y Pedicura Spa",
            "Masaje Relajante (30 min)",
          ],
        },
        {
          id: "vip",
          badge: "Glamour VIP",
          price: "€249",
          subtitle: "Para los que buscan el máximo esplendor y cuidado",
          buttons: [
            {
              text: "Seleccionar Plan",
              href: "#contacto",
            },
          ],
          features: [
            "Coloración Personalizada",
            "Facial Anti-edad Avanzado",
            "Manicura y Pedicura Premium con Gel",
            "Masaje Corporal Completo (60 min)",
            "Asesoría de Imagen",
          ],
        },
      ]}
      title="Nuestros Paquetes de Belleza"
      description="Elige el plan perfecto para ti y déjate consentir con nuestros servicios premium a precios excepcionales."
      tag="Valor & Lujo"
    />
  </div>

  <div id="equipo" data-section="equipo">
      <TeamCardSix
      animationType="depth-3d"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      members={[
        {
          id: "t-1",
          name: "Sofía Rivera",
          role: "Directora y Estilista Senior",
          imageSrc: "http://img.b2bpic.net/free-photo/handsome-stylish-bearded-male-with-tattoo-arm-dressed-flannel-shirt-holding-juice-while-getting-haircut_613910-14751.jpg",
          imageAlt: "Retrato de Sofía Rivera",
        },
        {
          id: "t-2",
          name: "Elena Vargas",
          role: "Esteticista y Terapeuta Facial",
          imageSrc: "http://img.b2bpic.net/free-photo/dermatologist-standing-with-arms-crossed-clinic_107420-65530.jpg",
          imageAlt: "Retrato de Elena Vargas",
        },
        {
          id: "t-3",
          name: "Marco Antonio",
          role: "Especialista en Uñas y Nail Art",
          imageSrc: "http://img.b2bpic.net/free-photo/side-view-client-worker-wearing-masks-nail-salon_23-2148694577.jpg",
          imageAlt: "Retrato de Marco Antonio",
        },
        {
          id: "t-4",
          name: "Isabel García",
          role: "Masajista Terapéutica",
          imageSrc: "http://img.b2bpic.net/free-photo/female-therapist-rehabilitation-center-giving-back-massage_23-2150356747.jpg",
          imageAlt: "Retrato de Isabel García",
        },
      ]}
      title="Conoce a Nuestro Apasionado Equipo"
      description="Nuestros profesionales están altamente capacitados y comparten una pasión común por la belleza y el bienestar. Déjate guiar por sus expertas manos."
      tag="Artistas de la Belleza"
    />
  </div>

  <div id="testimonios" data-section="testimonios">
      <TestimonialCardThirteen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      testimonials={[
        {
          id: "t-test-1",
          name: "Ana G.",
          handle: "@AnaG_Beauty",
          testimonial: "¡Serenity Salon es mi lugar favorito para desconectar y lucir espectacular! Siempre salgo feliz con mi cabello y la atención es de primera.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/model-is-sitting-high-chair-professional-make-up-procedure_231208-3562.jpg",
          imageAlt: "Retrato de Ana G.",
        },
        {
          id: "t-test-2",
          name: "Carlos M.",
          handle: "@CarlosM_Estilo",
          testimonial: "Nunca pensé que un salón de belleza pudiera ser tan relajante. La pedicura fue sublime y mis uñas quedaron impecables. ¡Volveré pronto!",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-hands-water_23-2148766605.jpg",
          imageAlt: "Retrato de Carlos M.",
        },
        {
          id: "t-test-3",
          name: "Laura P.",
          handle: "@LauraP_Zen",
          testimonial: "El facial que me hizo Elena fue una maravilla. Mi piel nunca se había sentido tan suave y luminosa. ¡Gracias, Serenity Salon!",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-adult-woman-lingerie_23-2149179697.jpg",
          imageAlt: "Retrato de Laura P.",
        },
        {
          id: "t-test-4",
          name: "Diego F.",
          handle: "@DiegoF_Look",
          testimonial: "Buscaba un corte moderno y Sofía superó mis expectativas. Es un salón con mucho estilo y un equipo muy profesional. Totalmente recomendado.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/man-getting-his-beard-shaved-with-razor_107420-94801.jpg",
          imageAlt: "Retrato de Diego F.",
        },
        {
          id: "t-test-5",
          name: "Marta R.",
          handle: "@MartaR_Makeup",
          testimonial: "Me hice el maquillaje para una boda aquí y me encantó el resultado. Duradero y natural, justo lo que quería. El ambiente es muy agradable.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/professional-model-with-bright-evening-makeup-striped-jacket_132075-11915.jpg",
          imageAlt: "Retrato de Marta R.",
        },
        {
          id: "t-test-6",
          name: "Patricia S.",
          handle: "@PatriciaS_Relax",
          testimonial: "La depilación fue muy eficiente y el trato, excepcional. Me siento cómoda y segura cada vez que vengo. ¡Gracias al equipo!",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-therapist-massaging-foot_23-2148882178.jpg",
          imageAlt: "Retrato de Patricia S.",
        },
      ]}
      showRating={true}
      title="Lo que Dicen Nuestros Clientes"
      description="La satisfacción de nuestros clientes es nuestra mayor recompensa. Lee sus experiencias y descubre por qué Serenity Salon es su elección preferida."
      tag="Experiencias Reales"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "q1",
          title: "¿Cómo puedo reservar una cita?",
          content: "Puedes reservar una cita directamente desde nuestra página web, llamándonos por teléfono o visitando nuestro salón durante el horario de atención.",
        },
        {
          id: "q2",
          title: "¿Cuáles son sus horarios de atención?",
          content: "Abrimos de martes a sábado, de 10:00 a 19:00. Los domingos y lunes estamos cerrados para recargar energías.",
        },
        {
          id: "q3",
          title: "¿Qué métodos de pago aceptan?",
          content: "Aceptamos efectivo, tarjetas de crédito/débito (Visa, Mastercard, American Express) y pagos móviles.",
        },
        {
          id: "q4",
          title: "¿Ofrecen tarjetas de regalo?",
          content: "Sí, tenemos tarjetas de regalo disponibles para que sorprendas a tus seres queridos con una experiencia de belleza y bienestar en Serenity Salon.",
        },
        {
          id: "q5",
          title: "¿Tienen algún programa de fidelidad?",
          content: "¡Claro! Pregunta en recepción sobre nuestro programa de fidelidad para acumular puntos y disfrutar de descuentos exclusivos en tus próximas visitas.",
        },
        {
          id: "q6",
          title: "¿Qué debo hacer si necesito cancelar o cambiar mi cita?",
          content: "Por favor, avísanos con al menos 24 horas de antelación si necesitas cancelar o modificar tu cita. Puedes hacerlo por teléfono o correo electrónico.",
        },
      ]}
      title="Preguntas Frecuentes"
      description="Encuentra respuestas a las dudas más comunes sobre nuestros servicios, reservas y políticas."
      tag="Información Útil"
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contacto" data-section="contacto">
      <ContactSplit
      useInvertedBackground={true}
      background={{
        variant: "plain",
      }}
      tag="Contáctanos"
      title="Visítanos o Envíanos un Mensaje"
      description="Estamos aquí para responder a todas tus preguntas y ayudarte a reservar tu próxima experiencia de belleza. Completa el formulario o encuentra nuestra ubicación."
      imageSrc="http://img.b2bpic.net/free-photo/winter-sports-equipment-complex_482257-76748.jpg"
      imageAlt="Interior moderno de salón de belleza"
      mediaAnimation="slide-up"
      mediaPosition="right"
      inputPlaceholder="Introduce tu correo electrónico"
      buttonText="Enviar Mensaje"
      termsText="Al hacer clic en Enviar, confirmas que aceptas nuestros Términos y Condiciones y Política de Privacidad."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseCard
      logoText="Serenity Salon"
      columns={[
        {
          title: "Servicios",
          items: [
            {
              label: "Cuidado Capilar",
              href: "#servicios",
            },
            {
              label: "Tratamientos Faciales",
              href: "#servicios",
            },
            {
              label: "Manicura y Pedicura",
              href: "#servicios",
            },
            {
              label: "Depilación",
              href: "#servicios",
            },
          ],
        },
        {
          title: "Salón",
          items: [
            {
              label: "Sobre Nosotros",
              href: "#sobre-nosotros",
            },
            {
              label: "Nuestro Equipo",
              href: "#equipo",
            },
            {
              label: "Testimonios",
              href: "#testimonios",
            },
            {
              label: "FAQ",
              href: "#faq",
            },
          ],
        },
        {
          title: "Legal",
          items: [
            {
              label: "Política de Privacidad",
              href: "#",
            },
            {
              label: "Términos de Servicio",
              href: "#",
            },
            {
              label: "Política de Cookies",
              href: "#",
            },
          ],
        },
      ]}
      copyrightText="© 2024 Serenity Salon. Todos los derechos reservados."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
