"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import TextAbout from '@/components/sections/about/TextAbout';
import { Leaf, Sparkles, Star } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="mediumSmall"
        sizing="largeSmallSizeLargeTitles"
        background="noiseDiagonalGradient"
        cardStyle="outline"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="layered"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        {
          name: "Services",
          id: "services",
        },
        {
          name: "Experience",
          id: "experience",
        },
        {
          name: "Testimonials",
          id: "testimonials",
        },
        {
          name: "Contact",
          id: "contact",
        },
      ]}
      brandName="Woodhouse Spa"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboard
      background={{
        variant: "gradient-bars",
      }}
      title="Escape Into Pure Relaxation"
      description="Woodhouse Spa delivers deeply restorative treatments in a calming, luxurious environment designed for your complete well-being."
      tag="Luxury Spa & Wellness"
      buttons={[
        {
          text: "Book Now",
          href: "#contact",
        },
        {
          text: "View Services",
          href: "#services",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/natural-elements-spa-with-candles_23-2148199493.jpg"
      imageAlt="Luxury spa environment"
      mediaAnimation="blur-reveal"
      tagIcon={Sparkles}
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/studio-portrait-blond-female-dressed-white-shirt-red-eyeglasses_613910-14657.jpg",
          alt: "Studio portrait of blond female",
        },
        {
          src: "http://img.b2bpic.net/free-photo/smiling-business-woman-looking-up-copy-space_1262-3088.jpg",
          alt: "Smiling Business Woman",
        },
        {
          src: "http://img.b2bpic.net/free-photo/close-up-portrait-professional-business-woman-smiling-outdoor_1391-4.jpg",
          alt: "Professional business woman",
        },
        {
          src: "http://img.b2bpic.net/free-photo/man-smiling-with-crossed-arms_1149-1138.jpg",
          alt: "Man smiling with crossed arms",
        },
        {
          src: "http://img.b2bpic.net/free-photo/middle-aged-man-with-beard-wearing-casual-white-shirt-looking-confident-with-smile-face-pointing-oneself-with-fingers-proud-happy_839833-12902.jpg",
          alt: "Confident middle aged man",
        },
      ]}
      avatarText="Join 5,000+ relaxed guests"
      marqueeItems={[
        {
          type: "text",
          text: "Holistic Healing",
        },
        {
          type: "text",
          text: "Signature Facials",
        },
        {
          type: "text",
          text: "Deep Tissue Therapy",
        },
        {
          type: "text",
          text: "Personalized Care",
        },
        {
          type: "text",
          text: "Pure Tranquility",
        },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <TextAbout
      useInvertedBackground={true}
      title="A Sanctuary Designed For You"
      tag="Our Philosophy"
      tagIcon={Leaf}
    />
  </div>

  <div id="services" data-section="services">
      <FeatureCardTwentyEight
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          id: "s1",
          title: "Massage Therapy",
          subtitle: "Deep Tissue & Relaxation",
          category: "Recovery",
          value: "From $90",
        },
        {
          id: "s2",
          title: "Luxury Pedicures",
          subtitle: "Meticulous & Refined",
          category: "Beauty",
          value: "From $65",
        },
        {
          id: "s3",
          title: "Facial Care",
          subtitle: "Personalized Results",
          category: "Skincare",
          value: "From $85",
        },
      ]}
      title="Signature Services"
      description="Expertly tailored treatments focused on tension relief, beauty, and complete rejuvenation."
      tag="Wellness Menu"
      tagIcon={Star}
    />
  </div>

  <div id="experience" data-section="experience">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={true}
      products={[
        {
          id: "p1",
          name: "The Wellness Escape",
          price: "$199",
          imageSrc: "http://img.b2bpic.net/free-photo/male-patient-performing-physiotherapy-exercises-with-female-medic_23-2149143805.jpg",
        },
        {
          id: "p2",
          name: "Signature Glow Package",
          price: "$175",
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-people-laying-bed_23-2149246761.jpg",
        },
        {
          id: "p3",
          name: "Total Recovery",
          price: "$220",
          imageSrc: "http://img.b2bpic.net/free-photo/client-lies-salon-cosmetology-table-with-white-mask-her-face_343596-4297.jpg",
        },
        {
          id: "p4",
          name: "Luxury Afternoon",
          price: "$150",
          imageSrc: "http://img.b2bpic.net/free-photo/man-enjoying-back-massage_1098-2214.jpg",
        },
        {
          id: "p5",
          name: "Deep Tissue Full Day",
          price: "$280",
          imageSrc: "http://img.b2bpic.net/free-photo/professional-esthetician-using-electric-nail-file-drill-remove-acrylic-gel-from-nails_181624-58253.jpg",
        },
        {
          id: "p6",
          name: "Rejuvenation Ritual",
          price: "$185",
          imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-lies-beautician-s-table-receives-procedures-light-facial-massage-using-oil_343596-4189.jpg",
        },
      ]}
      title="Explore Our Spa Packages"
      description="Curated experiences that combine multiple treatments for a full day of indulgence."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTen
      textboxLayout="split"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",
          title: "Excellent Service",
          quote: "Every part of the experience felt luxurious and thoughtfully done.",
          name: "Sarah Johnson",
          role: "Executive",
          imageSrc: "http://img.b2bpic.net/free-photo/joyful-business-woman-with-coffee-cup_23-2148095746.jpg",
        },
        {
          id: "t2",
          title: "So Relaxing",
          quote: "The atmosphere immediately makes you feel calm. Highly recommended.",
          name: "Michael Chen",
          role: "Architect",
          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-beach_23-2149293687.jpg",
        },
        {
          id: "t3",
          title: "Great Quality",
          quote: "The attention to detail was incredible. Definitely worth it.",
          name: "Emily Rodriguez",
          role: "Designer",
          imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-charming-smiling-tanned-brunette-woman-white-t-shirt-sitting-rattand-armchair_197531-22786.jpg",
        },
        {
          id: "t4",
          title: "Perfect Day",
          quote: "Such a peaceful environment. I will be returning soon.",
          name: "David Kim",
          role: "Product Manager",
          imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-enjoying-coffee_23-2148597001.jpg",
        },
        {
          id: "t5",
          title: "Truly Blissful",
          quote: "Best facial I've ever had. Truly exceptional staff.",
          name: "Jessica Lee",
          role: "Marketing",
          imageSrc: "http://img.b2bpic.net/free-photo/positive-young-businesswoman-pointing-camera_1262-5406.jpg",
        },
      ]}
      title="Loved By Our Guests"
      description="See why Woodhouse Spa is the premier destination for self-care."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="split"
      useInvertedBackground={true}
      faqs={[
        {
          id: "f1",
          title: "What should I wear?",
          content: "We provide robes and slippers for your comfort.",
        },
        {
          id: "f2",
          title: "How early should I arrive?",
          content: "Please arrive 15 minutes before your treatment begins.",
        },
        {
          id: "f3",
          title: "Can I request a therapist?",
          content: "Yes, please mention your preference when booking.",
        },
      ]}
      title="Spa Questions"
      description="Common inquiries to prepare for your wellness experience."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Reserve Your Experience"
      description="Contact us to secure your appointment or for any inquiries."
      inputs={[
        {
          name: "fullName",
          type: "text",
          placeholder: "Full Name",
          required: true,
        },
        {
          name: "email",
          type: "email",
          placeholder: "Email Address",
          required: true,
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/close-up-japanese-bamboo-fountain_1137-39.jpg"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseReveal
      logoText="Woodhouse Spa"
      columns={[
        {
          title: "Services",
          items: [
            {
              label: "Massage Therapy",
              href: "#services",
            },
            {
              label: "Pedicures",
              href: "#services",
            },
            {
              label: "Facials",
              href: "#services",
            },
          ],
        },
        {
          title: "Contact",
          items: [
            {
              label: "(555) 123-4567",
              href: "tel:5551234567",
            },
            {
              label: "hello@woodhousespa.com",
              href: "mailto:hello@woodhousespa.com",
            },
          ],
        },
      ]}
      copyrightText="© 2026 Woodhouse Spa. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}