"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="soft"
        contentWidth="medium"
        sizing="mediumLargeSizeLargeTitles"
        background="grid"
        cardStyle="gradient-radial"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="solid"
        headingFontWeight="medium"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        {
          name: "Home",          id: "hero"},
        {
          name: "About",          id: "about"},
        {
          name: "Services",          id: "services"},
        {
          name: "Testimonials",          id: "testimonials"},
        {
          name: "Contact",          id: "contact"},
      ]}
      button={{
        text: "Book Appointment",        href: "#booking"}}
      brandName="Eminent Dental"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitDualMedia
      background={{
        variant: "glowing-orb"}}
      title="Your Smile, Our Priority"
      description="Experience world-class dental care at Eminent Dental Clinic. With Dr. Kumar Prashant, we provide advanced, personalized treatments. 24/7 Emergency Dental Care Available."
      tag="24/7 Emergency Dental Support Available"
      mediaItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/dental-chair-with-medical-tools_140725-7681.jpg",          imageAlt: "modern dental clinic interior"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/dental-cabinet-with-various-medical-equipment_140725-7678.jpg",          imageAlt: "modern dental clinic interior"}
      ]}
      mediaAnimation="slide-up"
      rating={5}
      ratingText="Rated 5 stars by over 1,000 happy patients"
    />
  </div>

  <div id="about" data-section="about">
      <MediaAbout
      useInvertedBackground={true}
      title="Welcome to Eminent Dental Clinic"
      description="Led by the esteemed Dr. Kumar Prashant, our clinic combines advanced medical technology with a deeply human-centric approach. We prioritize hygiene, patient comfort, and precise clinical excellence. From routine cleaning to complex implants, your oral health is managed by the safest and most skilled hands in the field."
      imageSrc="http://img.b2bpic.net/free-photo/portrait-positive-young-male-dentist-uniform-with-crossed-hands-dental-office_158595-7651.jpg"
      imageAlt="dentist doctor in clinic"
    />
  </div>

  <div id="services" data-section="services">
      <FeatureCardTwentyNine
      animationType="slide-up"
      textboxLayout="split-description"
      gridVariant="four-items-2x2-equal-grid"
      useInvertedBackground={false}
      features={[
        {
          title: "Teeth Cleaning",          description: "Preventive care for a brighter, healthier smile.",          imageSrc: "http://img.b2bpic.net/free-photo/full-equiped-medical-cabinet_1303-23917.jpg",          titleImageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-female-male-dentist-clinic_23-2147879205.jpg",          buttonText: "Learn More"},
        {
          title: "Root Canal",          description: "Pain-free endodontic therapy for tooth preservation.",          imageSrc: "http://img.b2bpic.net/free-photo/female-dentist-showing-teeth-model-smiling-patient-clinic_23-2147879172.jpg",          titleImageSrc: "http://img.b2bpic.net/free-photo/full-equiped-medical-cabinet_1303-23918.jpg",          buttonText: "Learn More"},
        {
          title: "Dental Implants",          description: "Restore your bite with our precision-engineered implants.",          imageSrc: "http://img.b2bpic.net/free-photo/dentist-takes-instruments-doctor-protective-gloves-medic-uses-device_1157-40917.jpg",          titleImageSrc: "http://img.b2bpic.net/free-photo/attractive-patient-redviolet-dress-laying-dental-chair-while-female-dentist-treating-her-teeth-with-special-instruments_627829-9769.jpg",          buttonText: "Learn More"},
        {
          title: "24/7 Emergency Care",          description: "We are available anytime you need immediate relief.",          imageSrc: "http://img.b2bpic.net/free-photo/empty-stomatology-orthodontist-hospital-cabinet-with-nobody-it_482257-10435.jpg",          titleImageSrc: "http://img.b2bpic.net/free-photo/close-up-dentist-instruments_23-2151053264.jpg",          buttonText: "Call Now"},
      ]}
      title="Advanced Dental Services"
      description="Comprehensive dental solutions designed for your comfort and long-term health."
    />
  </div>

  <div id="why-choose-us" data-section="why-choose-us">
      <MetricCardEleven
      animationType="slide-up"
      textboxLayout="split-description"
      useInvertedBackground={true}
      metrics={[
        {
          id: "m1",          value: "24/7",          title: "Availability",          description: "Always here for your emergencies.",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-medical-dentistry-tooth-instruments-modern-stomatolog-orthodontic-bright-office-with-nobody-it_482257-2311.jpg"},
        {
          id: "m2",          value: "Expert",          title: "Dental Care",          description: "Led by Dr. Kumar Prashant.",          imageSrc: "http://img.b2bpic.net/free-photo/male-dentist-explaining-teeth-x-ray-screen-female-patient-lying-dentist-chair_23-2147879120.jpg"},
        {
          id: "m3",          value: "Advanced",          title: "Technology",          description: "Latest state-of-the-art equipment.",          imageSrc: "http://img.b2bpic.net/free-photo/health-dentist-dental-patient-medical_1303-993.jpg"},
      ]}
      title="Why Choose Eminent Dental"
      description="Our commitment to excellence makes us a leader in dental healthcare."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFifteen
      useInvertedBackground={false}
      testimonial="Eminent Dental Clinic transformed my smile! Dr. Kumar Prashant was incredibly professional and the staff made me feel comfortable throughout the entire procedure. Highly recommended."
      rating={5}
      author="Sarah Johnson"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/portrait-smiling-senior-woman-looking-camera-while-standing-corridor-hospital-team-doctors-is-background_637285-729.jpg",          alt: "happy patient portrait"},
        {
          src: "http://img.b2bpic.net/free-photo/care-adult-beauty-chair-background_1303-1846.jpg",          alt: "woman smiling happy patient"},
        {
          src: "http://img.b2bpic.net/free-photo/doctor-talking-female-patient_107420-73976.jpg",          alt: "man smiling healthy teeth"},
        {
          src: "http://img.b2bpic.net/free-photo/experienced-businessman_1098-14941.jpg",          alt: "happy senior patient"},
        {
          src: "http://img.b2bpic.net/free-photo/joyful-beautiful-blonde-woman-wearing-white-shirt-standing-co-working-space-leaning-desk_74855-15168.jpg",          alt: "woman portrait dental clinic"},
      ]}
      ratingAnimation="slide-up"
      avatarsAnimation="slide-up"
    />
  </div>

  <div id="booking" data-section="booking">
      <ContactCenter
      useInvertedBackground={true}
      background={{
        variant: "plain"}}
      tag="Schedule Now"
      title="Book Your Appointment"
      description="Fill out the form below and we will contact you shortly to confirm your visit."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCenter
      useInvertedBackground={false}
      background={{
        variant: "plain"}}
      tag="Visit Us"
      title="Contact Eminent Dental"
      description="Located in the heart of the city, open 24/7 for all your dental needs. Call us at +1 234 567 890."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterSimple
      columns={[
        {
          title: "Services",          items: [
            {
              label: "Teeth Cleaning",              href: "#services"},
            {
              label: "Implants",              href: "#services"},
            {
              label: "Emergency Care",              href: "#services"},
          ],
        },
        {
          title: "Company",          items: [
            {
              label: "About Us",              href: "#about"},
            {
              label: "Book Appointment",              href: "#booking"},
          ],
        },
      ]}
      bottomLeftText="© 2024 Eminent Dental Clinic"
      bottomRightText="All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
