"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import { Sparkles } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="bounce-effect"
        defaultTextAnimation="reveal-blur"
        borderRadius="rounded"
        contentWidth="mediumLarge"
        sizing="large"
        background="noiseDiagonalGradient"
        cardStyle="solid"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="layered"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Home",          id: "#home"},
        {
          name: "About",          id: "#about"},
        {
          name: "Services",          id: "#services"},
        {
          name: "Portfolio",          id: "#portfolio"},
        {
          name: "Testimonials",          id: "#testimonials"},
        {
          name: "FAQ",          id: "#faq"},
        {
          name: "Contact",          id: "#contact"},
      ]}
      brandName="Seera's Makeover"
    />
  </div>

  <div id="home" data-section="home">
      <HeroBillboardRotatedCarousel
      background={{
        variant: "rotated-rays-animated-grid"}}
      title="Radiant Transformations Await"
      description="Experience bespoke beauty services tailored to illuminate your unique elegance. At Seera's Makeover, we craft perfection."
      tag="Luxury Beauty"
      tagIcon={Sparkles}
      tagAnimation="slide-up"
      buttons={[
        {
          text: "Book an Appointment",          href: "#contact"},
        {
          text: "Explore Services",          href: "#services"},
      ]}
      buttonAnimation="slide-up"
      carouselItems={[
        {
          id: "1",          imageSrc: "https://images.unsplash.com/photo-1627889397984-d621b4f4f3c7?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHwxfHx8fHwxfHw%3D&_wi=1",          imageAlt: "Woman in traditional attire with intricate jewelry"},
        {
          id: "2",          imageSrc: "https://images.unsplash.com/photo-1600181580170-07e5c6e8e8e7?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw0fHx8fHwxfHw%3D&_wi=1",          imageAlt: "Elegant model with bold, high-fashion makeup"},
        {
          id: "3",          imageSrc: "https://images.unsplash.com/photo-1600181593922-832815715888?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw1fHx8fHwxfHw%3D&_wi=1",          imageAlt: "Regal woman with ornate headpiece"},
        {
          id: "4",          imageSrc: "https://images.unsplash.com/photo-1620601550991-82b5e2a2c10d?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw4fHx8fHwxfHw%3D&_wi=1",          imageAlt: "Close-up of a woman with captivating eye makeup"},
        {
          id: "5",          imageSrc: "https://images.unsplash.com/photo-1594951478794-68f7d9d0c6a5?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw2fHx8fHwxfHw%3D&_wi=1",          imageAlt: "Serene woman with delicate floral accents"},
        {
          id: "6",          imageSrc: "https://images.unsplash.com/photo-1627889397984-d621b4f4f3c7?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHwxfHx8fHwxfHw%3D&_wi=2",          imageAlt: "Striking portrait of a woman with bold lips"}
      ]}
      autoPlay={true}
    />
  </div>

  <div id="about" data-section="about">
      <MetricSplitMediaAbout
      useInvertedBackground={true}
      title="The Art of Elegance"
      description="Seera's Makeover is dedicated to enhancing natural beauty with a touch of luxury. Our expert artists use only the finest products and techniques to ensure every client leaves feeling confident and beautiful. Discover our commitment to excellence."
      metrics={[
        {
          value: "15+",          title: "Years of Expertise"},
        {
          value: "1000+",          title: "Happy Clients"},
        {
          value: "5-Star",          title: "Avg. Rating"},
      ]}
      imageSrc="https://images.unsplash.com/photo-1594951478794-68f7d9d0c6a5?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw2fHx8fHwxfHw%3D&_wi=2"
      imageAlt="Elegant woman in a high-end beauty setting"
      mediaAnimation="slide-up"
      metricsAnimation="slide-up"
    />
  </div>

  <div id="services" data-section="services">
      <FeatureCardTwentySeven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          id: "bridal",          title: "Bridal Makeover",          descriptions: [
            "Flawless bridal makeup and elegant hairstyling for your special day. Tailored to perfection to create your dream wedding look."],
          imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-beautiful-girl-sitting-table-with-makeup-tools-holding-out-mascara-camera-isolated-olive-green-wall_141793-106249.jpg",          imageAlt: "Makeup artist working on a bride"},
        {
          id: "glam",          title: "Event Glam",          descriptions: [
            "Stunning makeup and sophisticated hair for parties, galas, and special events. Shine bright with a look designed to captivate."],
          imageSrc: "http://img.b2bpic.net/free-photo/woman-setting-hair-client-styling_23-2147769849.jpg",          imageAlt: "Hair stylist working on event hairstyle"},
        {
          id: "styling",          title: "Personal Styling",          descriptions: [
            "Elevate your wardrobe and define your personal style with expert guidance. Discover outfits that truly reflect you."],
          imageSrc: "http://img.b2bpic.net/free-photo/shop-seller-adjusting-new-dress-female-customer-woman-trying-clothes-fashion-store-buying-clothes-boutique-concept_74855-12004.jpg",          imageAlt: "Personal stylist advising a client"},
      ]}
      title="Our Signature Services"
      description="From stunning bridal makeovers to personalized styling sessions, we offer a comprehensive range of services designed to pamper and perfect."
    />
  </div>

  <div id="portfolio" data-section="portfolio">
      <ProductCardFour
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="two-columns-alternating-heights"
      useInvertedBackground={true}
      carouselMode="buttons"
      products={[
        {
          id: "1",          name: "Bridal Elegance",          price: "Starting at $500",          variant: "Soft & Romantic",          imageSrc: "https://images.unsplash.com/photo-1594951478794-68f7d9d0c6a5?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw2fHx8fHwxfHw%3D&_wi=3",          imageAlt: "Nepali-inspired bridal makeup"},
        {
          id: "2",          name: "Glam Evening",          price: "Starting at $350",          variant: "Bold & Sophisticated",          imageSrc: "https://images.unsplash.com/photo-1627889397984-d621b4f4f3c7?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHwxfHx8fHwxfHw%3D&_wi=3",          imageAlt: "High-end event glam with intricate details"},
        {
          id: "3",          name: "Natural Radiance",          price: "Starting at $250",          variant: "Fresh & Luminous",          imageSrc: "https://images.unsplash.com/photo-1600181580170-07e5c6e8e8e7?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw0fHx8fHwxfHw%3D&_wi=2",          imageAlt: "Natural radiant beauty portrait"},
        {
          id: "4",          name: "Artistic Vision",          price: "Custom Quote",          variant: "Unique & Expressive",          imageSrc: "https://images.unsplash.com/photo-1620601550991-82b5e2a2c10d?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw4fHx8fHwxfHw%3D&_wi=2",          imageAlt: "Artistic character makeup"},
        {
          id: "5",          name: "Editorial Chic",          price: "Custom Quote",          variant: "Minimalist & High Fashion",          imageSrc: "https://images.unsplash.com/photo-1627889397984-d621b4f4f3c7?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHwxfHx8fHwxfHw%3D&_wi=4",          imageAlt: "Editorial high-fashion look"},
        {
          id: "6",          name: "Prom Perfection",          price: "Starting at $200",          variant: "Youthful & Dazzling",          imageSrc: "https://images.unsplash.com/photo-1600181593922-832815715888?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw1fHx8fHwxfHw%3D&_wi=2",          imageAlt: "Youthful dazzling makeover"}
      ]}
      title="Gallery of Transformations"
      description="A showcase of our artistry, highlighting diverse styles and unforgettable makeovers. Find inspiration for your next look."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",          name: "Sophia L.",          date: "May 2024",          title: "Unforgettable Bridal Experience",          quote: "Seera and her team made my wedding day truly magical. The makeup was flawless, and my hair was perfect. I felt like a queen!",          tag: "Bridal",          avatarSrc: "https://images.unsplash.com/photo-1594951478794-68f7d9d0c6a5?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=128&h=128&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw2fHx8fHwxfHw%3D",          avatarAlt: "Sophia L. avatar",          imageSrc: "https://images.unsplash.com/photo-1627889397984-d621b4f4f3c7?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHwxfHx8fHwxfHw%3D&_wi=5",          imageAlt: "Happy bride with radiant makeup"},
        {
          id: "2",          name: "Isabella R.",          date: "April 2024",          title: "My Go-To for Glam Events",          quote: "I always trust Seera's Makeover for special occasions. They truly understand my vision and deliver stunning results every time. Highly recommend!",          tag: "Event Glam",          avatarSrc: "https://images.unsplash.com/photo-1600181580170-07e5c6e8e8e7?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=128&h=128&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw0fHx8fHwxfHw%3D",          avatarAlt: "Isabella R. avatar",          imageSrc: "https://images.unsplash.com/photo-1600181593922-832815715888?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw1fHx8fHwxfHw%3D&_wi=3",          imageAlt: "Woman in evening gown with luxurious makeup"},
        {
          id: "3",          name: "Olivia M.",          date: "March 2024",          title: "Boosted My Confidence",          quote: "The personal styling session was a game-changer. Seera helped me refine my wardrobe and I feel so much more confident and chic. Thank you!",          tag: "Personal Styling",          avatarSrc: "https://images.unsplash.com/photo-1620601550991-82b5e2a2c10d?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=128&h=128&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw4fHx8fHwxfHw%3D",          avatarAlt: "Olivia M. avatar",          imageSrc: "https://images.unsplash.com/photo-1594951478794-68f7d9d0c6a5?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw2fHx8fHwxfHw%3D&_wi=4",          imageAlt: "Woman confidently posing after styling"},
        {
          id: "4",          name: "Emma K.",          date: "February 2024",          title: "Exceptional Artistry",          quote: "The team at Seera's Makeover are true artists. My natural makeover was absolutely beautiful, subtle yet so impactful. I felt refreshed.",          tag: "Natural Look",          avatarSrc: "https://images.unsplash.com/photo-1594951478794-68f7d9d0c6a5?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=128&h=128&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw2fHx8fHwxfHw%3D",          avatarAlt: "Emma K. avatar",          imageSrc: "https://images.unsplash.com/photo-1627889397984-d621b4f4f3c7?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHwxfHx8fHwxfHw%3D&_wi=6",          imageAlt: "Woman with a naturally elegant glow"},
        {
          id: "5",          name: "Ava J.",          date: "January 2024",          title: "A Luxurious Pampering Experience",          quote: "Every visit feels like a luxury retreat. The attention to detail and personalized service are unparalleled. I always leave feeling pampered and gorgeous.",          tag: "Luxury Service",          avatarSrc: "https://images.unsplash.com/photo-1600181593922-832815715888?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=128&h=128&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw1fHx8fHwxfHw%3D",          avatarAlt: "Ava J. avatar",          imageSrc: "https://images.unsplash.com/photo-1600181580170-07e5c6e8e8e7?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=800&h=600&fit=crop&ixid=MnwzODU4NTN8MHwxfGFsbHw0fHx8fHwxfHw%3D&_wi=3",          imageAlt: "Pampered woman in a luxury setting"}
      ]}
      title="Hear From Our Happy Clients"
      description="Our clients' glowing reviews speak volumes about the quality and care we put into every makeover. Your satisfaction is our masterpiece."
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={true}
      names={[
        "Vogue Beauty",        "Bridal Trends Magazine",        "Fashion Weekly",        "Cosmo Beauty",        "Hair & Style Daily",        "Elegant Living",        "A-List Events"]}
      title="As Seen In"
      description="Recognized by leading beauty publications and trusted by industry professionals for our exceptional artistry and luxury services."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "q1",          title: "How do I book an appointment?",          content: "You can book an appointment directly through our website's 'Contact' section, or by calling our studio during business hours. We recommend booking in advance to secure your preferred date and time."},
        {
          id: "q2",          title: "What products do you use?",          content: "We exclusively use high-end, professional-grade makeup and hair products from renowned luxury brands to ensure superior quality and lasting results for all our clients."},
        {
          id: "q3",          title: "Do you offer consultations?",          content: "Yes, we offer personalized consultations for all our services. This allows us to understand your vision, discuss your preferences, and tailor the perfect makeover plan for you."},
        {
          id: "q4",          title: "What is your cancellation policy?",          content: "Cancellations or rescheduling requests must be made at least 24 hours in advance. Late cancellations may incur a fee. Please refer to our booking terms for full details."},
        {
          id: "q5",          title: "Do you offer services on-location?",          content: "Yes, we provide on-location services for bridal parties and special events. Additional travel fees may apply depending on the distance. Please inquire for a custom quote."},
      ]}
      title="Frequently Asked Questions"
      description="Find answers to common questions about our services, booking process, and what to expect during your makeover experience."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={true}
      background={{
        variant: "rotated-rays-animated-grid"}}
      text="Ready for Your Transformation? Get in Touch."
      buttons={[
        {
          text: "Book Now",          href: "#"},
        {
          text: "Call Us",          href: "tel:+1234567890"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterSimple
      columns={[
        {
          title: "Services",          items: [
            {
              label: "Bridal Makeover",              href: "#services"},
            {
              label: "Event Glam",              href: "#services"},
            {
              label: "Personal Styling",              href: "#services"},
          ],
        },
        {
          title: "Company",          items: [
            {
              label: "About Us",              href: "#about"},
            {
              label: "Portfolio",              href: "#portfolio"},
            {
              label: "Testimonials",              href: "#testimonials"},
          ],
        },
        {
          title: "Support",          items: [
            {
              label: "FAQ",              href: "#faq"},
            {
              label: "Contact Us",              href: "#contact"},
            {
              label: "Privacy Policy",              href: "#"},
          ],
        },
      ]}
      bottomLeftText="© 2024 Seera's Makeover. All rights reserved."
      bottomRightText="Designed with Elegance"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
