"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 FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import TextAbout from '@/components/sections/about/TextAbout';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-bubble"
        defaultTextAnimation="entrance-slide"
        borderRadius="soft"
        contentWidth="mediumLarge"
        sizing="largeSmall"
        background="circleGradient"
        cardStyle="inset"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="glass"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        {
          name: "Home",          id: "hero"},
        {
          name: "Servizi",          id: "servizi"},
        {
          name: "Recensioni",          id: "recensioni"},
        {
          name: "Contatti",          id: "contatti"},
      ]}
      brandName="Bella Nail"
      button={{
        text: "Prenota",        href: "#contatti"}}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardGallery
      background={{
        variant: "sparkles-gradient"}}
      title="Your Nails, But Better ✨"
      description="Manicure perfetta in un ambiente pulito, moderno e rilassante."
      buttons={[
        {
          text: "💅 Prenota Ora",          href: "#contatti"},
        {
          text: "📍 Dove Siamo",          href: "#contatti"},
      ]}
      mediaItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/eyeshadow-finger-close-up-swatch_127675-2603.jpg",          imageAlt: "nude nails aesthetic"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/healthy-beautiful-manicure-person-using-pads_23-2148766538.jpg",          imageAlt: "baby pink nails aesthetic"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/woman-testing-lipstick-product_23-2148398614.jpg",          imageAlt: "glossy nail studio close up"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/nail-care-concept-with-nail-polish_23-2149046488.jpg",          imageAlt: "minimal luxury salon interior"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-woman-black-sweater-standing-posing_114579-81860.jpg",          imageAlt: "soft focus manicured hands"},
      ]}
      mediaAnimation="blur-reveal"
    />
  </div>

  <div id="about" data-section="about">
      <TextAbout
      useInvertedBackground={true}
      title="Un'esperienza beauty premium"
      buttons={[
        {
          text: "Scopri di più",          href: "#servizi"},
      ]}
    />
  </div>

  <div id="servizi" data-section="servizi">
      <PricingCardThree
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      plans={[
        {
          id: "s1",          name: "Manicure Semipermanente",          price: "da €30",          features: [
            "Unghie brillanti",            "Lunga durata",            "Ampia scelta colori"],
          buttons: [
            {
              text: "Prenota",              href: "#contatti"},
          ],
        },
        {
          id: "s2",          name: "Ricostruzione Unghie",          price: "da €50",          features: [
            "Forma elegante",            "Resistenza",            "Design personalizzato"],
          buttons: [
            {
              text: "Prenota",              href: "#contatti"},
          ],
        },
        {
          id: "s3",          name: "Nail Art Design",          price: "da €10",          features: [
            "Design creativi",            "Femminilità",            "Personalizzazione"],
          buttons: [
            {
              text: "Prenota",              href: "#contatti"},
          ],
        },
      ]}
      title="I nostri servizi"
      description="Servizi di alta qualità per la tua bellezza quotidiana."
    />
  </div>

  <div id="perche" data-section="perche">
      <FeatureCardSixteen
      animationType="depth-3d"
      textboxLayout="default"
      useInvertedBackground={true}
      negativeCard={{
        items: [
          "Nessuna attesa inutile",          "Nessuna fretta",          "Nessuna imperfezione",          "Nessun prodotto tossico",          "Nessuna distrazione"],
      }}
      positiveCard={{
        items: [
          "Ambiente super pulito",          "Servizio veloce e preciso",          "Staff gentile e professionale",          "Prodotti ipoallergenici",          "Igiene totale"],
      }}
      title="Perché Bella Nail?"
      description="Ogni appuntamento è un momento di puro self-care."
    />
  </div>

  <div id="recensioni" data-section="recensioni">
      <TestimonialCardSixteen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",          name: "Giulia R.",          role: "Cliente",          company: "Bella Nail",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-woman-showing-ok-sign_1262-17571.jpg"},
        {
          id: "2",          name: "Sara M.",          role: "Cliente",          company: "Bella Nail",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-brunette-woman-wearing-casual-sweater-standing-red-background-pointing-fingers-camera-with-happy-funny-face-good-energy-vibes_839833-6469.jpg"},
        {
          id: "3",          name: "Elena V.",          role: "Cliente",          company: "Bella Nail",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/indoor-studio-winter-portrait-brunette-woman-wearing-joggers-sweater-using-her-smartphone-exited-emotions_291049-2742.jpg"},
        {
          id: "4",          name: "Chiara B.",          role: "Cliente",          company: "Bella Nail",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/successful-young-man-stylish-hat-relaxing-alone-cozy-cafeteria-lunch-break-looking-with-happy-expression_273609-1935.jpg"},
        {
          id: "5",          name: "Martina D.",          role: "Cliente",          company: "Bella Nail",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/happiness-concept-sincere-european-woman-keeps-hands-together-laughs-loudly-with-closed-eyes-has-upbeat-mood-wears-white-panama-jumper-with-collar-recalls-funny-story-happened-with-her_273609-62022.jpg"},
      ]}
      kpiItems={[
        {
          value: "100%",          label: "Clienti felici"},
        {
          value: "500+",          label: "Manicure fatte"},
        {
          value: "4.9/5",          label: "Media recensioni"},
      ]}
      title="Amato dalle nostre clienti 💖"
      description="Scopri cosa dicono di noi le nostre clienti soddisfatte."
    />
  </div>

  <div id="gallery" data-section="gallery">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={true}
      names={[
        "Glossy Nude",        "French Chic",        "Baby Pink",        "Modern Art",        "Natural Care",        "Elegant Shine",        "Bella Style"]}
      title="I nostri lavori"
      description="Lasciati ispirare dalle nostre creazioni."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "f1",          title: "Quanto dura il semipermanente?",          content: "Il semipermanente dura solitamente 2-3 settimane in base alla crescita dell'unghia."},
        {
          id: "f2",          title: "È necessario l'appuntamento?",          content: "Sì, consigliamo sempre di prenotare per garantirvi il posto."},
        {
          id: "f3",          title: "Dove vi trovate?",          content: "Siamo in Piazza Giusti 26R, nel cuore di Genova."},
        {
          id: "f4",          title: "Quali metodi di pagamento accettate?",          content: "Accettiamo contanti, carte di credito e bancomat."},
        {
          id: "f5",          title: "Posso cancellare la prenotazione?",          content: "Sì, ti preghiamo di avvisarci almeno 24 ore prima dell'appuntamento."},
      ]}
      title="Domande Frequenti"
      description="Tutto quello che devi sapere."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contatti" data-section="contatti">
      <ContactSplit
      tag="Contatti"
      useInvertedBackground={true}
      background={{
        variant: "plain"}}
      title="Prenota il tuo momento beauty 💅"
      description="📍 Piazza Giusti 26R | 📞 351 292 3656\nOrari: Lun-Sab 09:00-20:00. Posti limitati ogni giorno!"
      imageSrc="http://img.b2bpic.net/free-photo/defocused-waiting-zone_1203-371.jpg"
      buttonText="Prenota su WhatsApp"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterSimple
      columns={[
        {
          title: "Bella Nail",          items: [
            {
              label: "Piazza Giusti 26R",              href: "#"},
            {
              label: "351 292 3656",              href: "tel:3512923656"},
          ],
        },
        {
          title: "Link",          items: [
            {
              label: "Prenota",              href: "#contatti"},
            {
              label: "Servizi",              href: "#servizi"},
          ],
        },
      ]}
      bottomLeftText="© 2024 Bella Nail"
      bottomRightText="Luxury Nail Studio"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
