"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import { Award, Heart, Smile } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="icon-arrow"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="smallMedium"
        sizing="largeSmallSizeMediumTitles"
        background="grid"
        cardStyle="layered-gradient"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="glass"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "About",          id: "#about"},
        {
          name: "Services",          id: "#services"},
        {
          name: "Testimonials",          id: "#testimonials"},
        {
          name: "Contact",          id: "#contact"},
      ]}
      brandName="The Smile House"
      button={{
        text: "Book Consultation",        href: "#contact"}}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitDualMedia
      background={{
        variant: "sparkles-gradient"}}
      title="Dentistry, Reimagined Around You"
      description="Comfort-first dental care in Matunga designed to feel calm, transparent, and genuinely personal. Because exceptional dentistry should never feel intimidating."
      tag="Luxury Wellness Dentistry"
      buttons={[
        {
          text: "Book Your Calm Consultation",          href: "#contact"},
      ]}
      mediaItems={[
        {
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=azfi95",          imageAlt: "luxury dental clinic interior minimal"},
        {
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8lt8ws",          imageAlt: "patient smiling in dental chair"},
      ]}
      mediaAnimation="slide-up"
      rating={5}
      ratingText="Top-rated comfort in Matunga"
    />
  </div>

  <div id="about" data-section="about">
      <TextSplitAbout
      useInvertedBackground={false}
      title="Welcome to The Smile House"
      description={[
        "At The Smile House, we believe your dental experience should be as rejuvenating as a spa session. Dr. Nidhi and our team focus on transparency and empathy, ensuring every step of your care is explained and managed with patience.",        "Located in the heart of Matunga, we have created a sanctuary where clinical excellence meets genuine hospitality. We prioritize your emotional comfort, turning what used to be a source of stress into a moment of mindful care."]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardOne
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={true}
      features={[
        {
          title: "Transparent Communication",          description: "We demystify your care plan with clear, jargon-free explanations, ensuring you always feel informed.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qbapk6",          imageAlt: "modern dental care service icon"},
        {
          title: "Comfort-First Design",          description: "From ambient lighting to aromatherapy, every detail is engineered to soothe and comfort you.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wopbjg",          imageAlt: "transparent dental pricing concept"},
        {
          title: "Personalized Approach",          description: "No cookie-cutter dentistry. We tailor every treatment to your specific aesthetic goals and comfort level.",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wlxrxt",          imageAlt: "gentle dentistry for anxious patients"},
      ]}
      title="Why Patients Choose Us"
      description="We blend premium technology with an unwavering focus on patient-centered wellbeing."
    />
  </div>

  <div id="services" data-section="services">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="one-large-left-three-stacked-right"
      useInvertedBackground={false}
      products={[
        {
          id: "1",          name: "Teeth Whitening",          price: "From ₹15,000",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=urjjuw"},
        {
          id: "2",          name: "Porcelain Veneers",          price: "From ₹45,000",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=j6r1n3"},
        {
          id: "3",          name: "Professional Cleaning",          price: "From ₹5,000",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=limxwq"},
        {
          id: "4",          name: "Invisalign",          price: "From ₹1,20,000",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=al6itn"},
        {
          id: "5",          name: "Dental Restorations",          price: "From ₹25,000",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=h9bpp4"},
        {
          id: "6",          name: "Emergency Relief",          price: "From ₹3,500",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=hb5cpw"},
      ]}
      title="Our Signature Services"
      description="Premium cosmetic and restorative solutions delivered with artistry."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardThree
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={true}
      metrics={[
        {
          id: "m1",          icon: Smile,
          title: "Happy Smiles",          value: "1,500+"},
        {
          id: "m2",          icon: Award,
          title: "Clinic Experience",          value: "12 Years"},
        {
          id: "m3",          icon: Heart,
          title: "Patient Trust",          value: "99%"},
      ]}
      title="By The Numbers"
      description="Our commitment to excellence speaks for itself through our community results."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardThirteen
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",          name: "Priya Sharma",          handle: "@priya_sharma",          testimonial: "I've always feared the dentist, but Dr. Nidhi made me feel so understood. The ambiance is like a spa!",          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=slsvww"},
        {
          id: "t2",          name: "Vikram Seth",          handle: "@vikram_s",          testimonial: "The most professional and calm experience I've had in years. Highly recommended for busy professionals.",          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=1fb3gx"},
        {
          id: "t3",          name: "Ananya Rao",          handle: "@ananyarao",          testimonial: "The transparency about the procedure made all the difference. My smile transformation was seamless.",          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qt56fj"},
        {
          id: "t4",          name: "Rohit Verma",          handle: "@rv_verma",          testimonial: "Truly a boutique experience. They really care about the details here.",          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=lp9gx7"},
        {
          id: "t5",          name: "Meera Iyer",          handle: "@meera_iyer",          testimonial: "I didn't think a dental visit could be relaxing. The Smile House changed my mind completely.",          rating: 5,
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=73pc1x"},
      ]}
      showRating={true}
      title="Patient Voices"
      description="Hear how our patients transformed their perspectives on dentistry."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="split"
      useInvertedBackground={true}
      faqs={[
        {
          id: "f1",          title: "Do you offer anxiety-free dentistry?",          content: "Absolutely. We specialize in techniques and environmental factors that reduce anxiety significantly."},
        {
          id: "f2",          title: "How can I book an appointment?",          content: "You can book directly via our WhatsApp integration or the booking form below for a calm consultation."},
        {
          id: "f3",          title: "Is the clinic suitable for cosmetic procedures?",          content: "Yes, we offer premium whitening, veneers, and Invisalign designed for aesthetic transformations."},
      ]}
      title="Common Questions"
      description="Find answers to help you feel more comfortable about your upcoming visit."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCTA
      useInvertedBackground={false}
      background={{
        variant: "sparkles-gradient"}}
      tag="Ready to begin?"
      title="Start Your Smile Journey"
      description="Let's discuss how we can bring calm and luxury to your dental care journey in Matunga."
      buttons={[
        {
          text: "Book Your Calm Consultation",          href: "#"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterSimple
      columns={[
        {
          title: "Quick Links",          items: [
            {
              label: "Services",              href: "#services"},
            {
              label: "Testimonials",              href: "#testimonials"},
            {
              label: "About Us",              href: "#about"},
          ],
        },
        {
          title: "Legal",          items: [
            {
              label: "Privacy Policy",              href: "#"},
            {
              label: "Terms of Service",              href: "#"},
          ],
        },
      ]}
      bottomLeftText="© 2024 The Smile House, Matunga"
      bottomRightText="Designed with care"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
