"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TeamCardTwo from '@/components/sections/team/TeamCardTwo';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import TextAbout from '@/components/sections/about/TextAbout';
import { Award, CalendarCheck, Facebook, FileText, Heart, Instagram, Linkedin, Search, ShieldCheck, Smile, Sparkles, Twitter } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="background-highlight"
        borderRadius="rounded"
        contentWidth="smallMedium"
        sizing="mediumLargeSizeMediumTitles"
        background="noiseDiagonalGradient"
        cardStyle="glass-depth"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",          id: "#hero"},
        {
          name: "About",          id: "#about"},
        {
          name: "Services",          id: "#services"},
        {
          name: "Specialists",          id: "#specialists"},
        {
          name: "Gallery",          id: "#gallery"},
        {
          name: "Testimonials",          id: "#testimonials"},
        {
          name: "FAQ",          id: "#faq"},
        {
          name: "Contact",          id: "#contact"},
      ]}
      brandName="Molar Dental Clinics"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardTestimonial
      useInvertedBackground={false}
      background={{
        variant: "radial-gradient"}}
      title="Transforming Smiles With World-Class Dental Care"
      description="Trusted by hundreds of patients in Riyadh with a 4.7-star rating and a reputation for excellence."
      testimonials={[
        {
          name: "Abdullah S.",          handle: "@abdullahsmi",          testimonial: "Molar Dental Clinics provided an unparalleled experience. The results of my smile transformation are simply breathtaking. Highly recommend!",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-shopping-clothes_1301-6672.jpg",          imageAlt: "Abdullah S."},
        {
          name: "Fatima A.",          handle: "@fatima_smiles",          testimonial: "The most professional and caring dental team in Riyadh. They truly prioritize patient comfort and deliver exceptional results. Five stars!",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/smiley-doctor-posing-patient_23-2148757390.jpg",          imageAlt: "Fatima A."},
        {
          name: "Khalid H.",          handle: "@khalidhmed",          testimonial: "From booking to aftercare, every step was seamless. Advanced technology and expert specialists make Molar Dental the best choice for premium dental care.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/friendly-doctor-looks-x-ray_1398-679.jpg",          imageAlt: "Khalid H."},
        {
          name: "Noura Z.",          handle: "@nouraz",          testimonial: "I was hesitant, but the team at Molar Dental made me feel completely at ease. My new smile has boosted my confidence beyond measure!",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/closeup-handsome-middleaged-man-takingoff-medical-mask-looking-happy-smiling-pleased-standing_1258-148759.jpg",          imageAlt: "Noura Z."},
        {
          name: "Yousef M.",          handle: "@yousef_md",          testimonial: "Exceptional service and outstanding results. Molar Dental Clinics sets the standard for luxury dental care in Saudi Arabia.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/female-patient-receiving-ultrasound-scan-stomach_107420-74199.jpg",          imageAlt: "Yousef M."},
      ]}
      buttons={[
        {
          text: "Book Appointment",          href: "#contact"},
        {
          text: "Call Now",          href: "tel:+966570707029"},
      ]}
      videoSrc="http://img.b2bpic.net/free-photo/beautiful-girl-sitting-dentist-s-office_1157-23503.jpg"
      videoAriaLabel="Modern dental clinic video showcasing advanced technology and smiling patients."
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/young-woman-shopping-clothes_1301-6672.jpg",          alt: "Happy Patient 1"},
        {
          src: "http://img.b2bpic.net/free-photo/smiley-doctor-posing-patient_23-2148757390.jpg",          alt: "Happy Patient 2"},
        {
          src: "http://img.b2bpic.net/free-photo/friendly-doctor-looks-x-ray_1398-679.jpg",          alt: "Happy Patient 3"},
        {
          src: "http://img.b2bpic.net/free-photo/closeup-handsome-middle-aged-man-takingoff-medical-mask-looking-happy-smiling-pleased-standing_1258-148759.jpg",          alt: "Happy Patient 4"},
        {
          src: "http://img.b2bpic.net/free-photo/female-patient-receiving-ultrasound-scan-stomach_107420-74199.jpg",          alt: "Happy Patient 5"},
      ]}
      avatarText="Join our 15,000+ happy patients!"
      marqueeItems={[
        {
          type: "text-icon",          text: "Advanced Technology",          icon: Search,
        },
        {
          type: "text-icon",          text: "Expert Specialists",          icon: Award,
        },
        {
          type: "text-icon",          text: "Luxurious Environment",          icon: Sparkles,
        },
        {
          type: "text-icon",          text: "Pain-Free Procedures",          icon: ShieldCheck,
        },
        {
          type: "text-icon",          text: "Personalized Care",          icon: Heart,
        },
        {
          type: "text-icon",          text: "Stunning Transformations",          icon: Smile,
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/young-woman-shopping-clothes_1301-6672.jpg"
      imageAlt="satisfied female patient smiling portrait"
    />
  </div>

  <div id="about" data-section="about">
      <TextAbout
      useInvertedBackground={false}
      tag="Our Legacy"
      title="About Molar Dental Clinics: Redefining Luxury Dental Care in Riyadh"
      buttons={[
        {
          text: "Learn More About Us",          href: "#services"},
      ]}
    />
  </div>

  <div id="why-choose-us" data-section="why-choose-us">
      <FeatureCardSixteen
      animationType="depth-3d"
      textboxLayout="default"
      useInvertedBackground={false}
      negativeCard={{
        items: [
          "Outdated Equipment",          "Impersonal Service",          "Uncomfortable Visits",          "Limited Expertise",          "Hygiene Concerns"],
      }}
      positiveCard={{
        items: [
          "Gentle Patient Care",          "Modern Equipment",          "Highly Skilled Dentists",          "Exceptional Hygiene Standards",          "Comfortable Environment"],
      }}
      title="Why Choose Molar Dental Clinics?"
      description="Experience the difference of an elite dental practice, where every detail is curated for your comfort and exceptional results."
      tag="Our Commitment"
      tagIcon={Sparkles}
    />
  </div>

  <div id="services" data-section="services">
      <ProductCardThree
      animationType="scale-rotate"
      textboxLayout="default"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      products={[
        {
          id: "general-dentistry",          name: "General Dentistry",          price: "Starting from $300",          imageSrc: "http://img.b2bpic.net/free-photo/doctor-showing-her-patient-something-tablet_23-2148396131.jpg",          imageAlt: "General Dentistry"},
        {
          id: "cosmetic-dentistry",          name: "Cosmetic Dentistry",          price: "Custom Quote",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-brunette-woman-posing-smiling_23-2149021868.jpg",          imageAlt: "Cosmetic Dentistry"},
        {
          id: "teeth-whitening",          name: "Teeth Whitening",          price: "Starting from $600",          imageSrc: "http://img.b2bpic.net/free-photo/female-patient-receiving-dental-treatment_107420-65506.jpg",          imageAlt: "Teeth Whitening"},
        {
          id: "dental-implants",          name: "Dental Implants",          price: "Custom Quote",          imageSrc: "http://img.b2bpic.net/free-photo/dentist-examining-female-patient-with-teeth-shades_107420-74151.jpg",          imageAlt: "Dental Implants"},
        {
          id: "orthodontics",          name: "Orthodontics",          price: "Custom Quote",          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-caucasian-woman-biting-temple-glasses-looking-aside-promotional-text-thinking-staring-interesting-logo-banner-standing-white-wall_176420-39454.jpg",          imageAlt: "Orthodontics"},
        {
          id: "veneers",          name: "Veneers",          price: "Starting from $1200",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-stylish-young-woman_158538-3962.jpg",          imageAlt: "Veneers"},
        {
          id: "root-canal",          name: "Root Canal Treatment",          price: "Starting from $900",          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-scared-patient-dentist_23-2148380315.jpg",          imageAlt: "Root Canal Treatment"},
        {
          id: "pediatric-dentistry",          name: "Pediatric Dentistry",          price: "Starting from $250",          imageSrc: "http://img.b2bpic.net/free-photo/pediatric-dentist-little-girl-reception-dentist_1321-3222.jpg",          imageAlt: "Pediatric Dentistry"},
      ]}
      title="Our World-Class Dental Services"
      description="At Molar Dental Clinics, we offer a comprehensive suite of advanced dental treatments, meticulously delivered by our expert specialists to ensure your optimal oral health and aesthetic desires are met."
      tag="Our Expertise"
    />
  </div>

  <div id="specialists" data-section="specialists">
      <TeamCardTwo
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      members={[
        {
          id: "dr-ahmed",          name: "Dr. Ahmed Al-Fahad",          role: "Chief Dentist & Implantologist",          description: "With over 20 years of experience, Dr. Al-Fahad is renowned for his precision in dental implantology and restorative dentistry. He leads our team with a vision for clinical excellence and patient-centered care.",          imageSrc: "http://img.b2bpic.net/free-photo/dentist-posing-dental-clinic_107420-65580.jpg",          imageAlt: "Dr. Ahmed Al-Fahad"},
        {
          id: "dr-sara",          name: "Dr. Sara Al-Mansour",          role: "Lead Orthodontist",          description: "Dr. Al-Mansour specializes in advanced orthodontics, including Invisalign and traditional braces. Her passion lies in crafting perfect smiles for patients of all ages, combining aesthetic appeal with functional harmony.",          imageSrc: "http://img.b2bpic.net/free-photo/female-dentist-holding-dental-model-hands-concept-dentistry-dental-treatment_169016-67457.jpg",          imageAlt: "Dr. Sara Al-Mansour"},
        {
          id: "dr-fares",          name: "Dr. Fares Al-Qahtani",          role: "Cosmetic Dentist",          description: "An artist in cosmetic dentistry, Dr. Al-Qahtani is celebrated for his expertise in veneers, teeth whitening, and smile makeovers. He is committed to helping patients achieve their dream smiles with natural-looking results.",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiling-young-woman-wearing-life-jacket_23-2147562086.jpg",          imageAlt: "Dr. Fares Al-Qahtani"},
        {
          id: "dr-maha",          name: "Dr. Maha Al-Rashid",          role: "Pediatric Dentist",          description: "Dr. Al-Rashid creates a welcoming and fun environment for our youngest patients. Her gentle approach ensures a positive dental experience, fostering a lifetime of healthy smiles for children.",          imageSrc: "http://img.b2bpic.net/free-photo/cute-little-girl-studying-female-reproductive-system-with-doctor_651396-1876.jpg",          imageAlt: "Dr. Maha Al-Rashid"},
        {
          id: "dr-nasser",          name: "Dr. Nasser Al-Otaibi",          role: "Periodontist & Oral Surgeon",          description: "Specializing in gum health and complex oral surgeries, Dr. Al-Otaibi provides advanced treatments for periodontal disease and performs precise surgical procedures with utmost care.",          imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-doctor-checking-patient_23-2149726926.jpg",          imageAlt: "Dr. Nasser Al-Otaibi"},
      ]}
      title="Meet Our Award-Winning Specialists"
      description="Our team of highly skilled and compassionate dental professionals is dedicated to providing personalized care, utilizing their extensive expertise and the latest techniques to achieve exceptional results."
      tag="Our Team"
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardSeven
      textboxLayout="default"
      useInvertedBackground={false}
      animationType="slide-up"
      metrics={[
        {
          id: "reviews",          value: "970+",          title: "Patient Reviews",          items: [
            "Consistently rated 4.7 stars",            "Trusted by the community",            "Real feedback, real satisfaction"],
        },
        {
          id: "patients",          value: "15,000+",          title: "Happy Patients",          items: [
            "Transforming smiles daily",            "Building lasting relationships",            "A growing family of happy clients"],
        },
        {
          id: "experience",          value: "25+",          title: "Years of Experience",          items: [
            "Decades of clinical expertise",            "Proven track record of success",            "Leading the dental industry"],
        },
        {
          id: "procedures",          value: "5000+",          title: "Advanced Procedures",          items: [
            "Cutting-edge treatments",            "Minimally invasive techniques",            "Customized care plans"],
        },
      ]}
      title="Molar Clinic in Numbers: Innovation & Excellence"
      description="Our commitment to quality, patient satisfaction, and continuous innovation is reflected in every aspect of Molar Dental Clinics."
      tag="Our Impact"
      tagIcon={FileText}
    />
  </div>

  <div id="gallery" data-section="gallery">
      <BlogCardTwo
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      carouselMode="auto"
      title="Our Visual Journey: Smile Transformations & Clinic Spaces"
      description="Explore inspiring before & after results and step inside our luxurious, state-of-the-art clinic. Witness the artistry and advanced technology that defines Molar Dental Clinics."
      tag="Visual Showcase"
      blogs={[
        {
          id: "blog-1",          category: "Transformation",          title: "Dazzling Veneers: A Complete Smile Makeover",          excerpt: "See how porcelain veneers transformed this patient's smile into a work of art, boosting confidence and radiance.",          imageSrc: "http://img.b2bpic.net/free-photo/patient-dentist_624325-1625.jpg",          imageAlt: "Before and After Smile Transformation",          authorName: "Molar Dental Team",          authorAvatar: "http://img.b2bpic.net/free-photo/smiley-doctor-wearing-white-coat-front-view_23-2149844581.jpg",          date: "July 20, 2024"
        },
        {
          id: "blog-2",          category: "Clinic Interior",          title: "Inside Our Modern Treatment Rooms",          excerpt: "A glimpse into our advanced treatment rooms, designed for ultimate comfort and equipped with the latest dental technology.",          imageSrc: "http://img.b2bpic.net/free-photo/x-ray-with-neon-colors_23-2151521334.jpg",          imageAlt: "Modern Dental Clinic Interior",          authorName: "Molar Dental Team",          authorAvatar: "http://img.b2bpic.net/free-photo/smiley-doctor-wearing-white-coat-front-view_23-2149844581.jpg",          date: "July 18, 2024"
        },
        {
          id: "blog-3",          category: "Transformation",          title: "Radiant White: Professional Teeth Whitening Results",          excerpt: "Witness the dramatic brightening achieved through our professional teeth whitening services, revealing a stunning, vibrant smile.",          imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-using-digital-tablet-home_329181-225.jpg",          imageAlt: "Before and After Teeth Whitening",          authorName: "Molar Dental Team",          authorAvatar: "http://img.b2bpic.net/free-photo/smiley-doctor-wearing-white-coat-front-view_23-2149844581.jpg",          date: "July 15, 2024"
        },
        {
          id: "blog-4",          category: "Technology",          title: "Precision & Innovation: Our Digital Dentistry Lab",          excerpt: "Discover the cutting-edge digital dentistry technologies and in-house lab facilities that ensure precision and efficiency in every procedure.",          imageSrc: "http://img.b2bpic.net/free-photo/equipment-dental-instruments-dentist-s-office-tools-close-up_8353-1670.jpg",          imageAlt: "Digital Dentistry Lab",          authorName: "Molar Dental Team",          authorAvatar: "http://img.b2bpic.net/free-photo/smiley-doctor-wearing-white-coat-front-view_23-2149844581.jpg",          date: "July 10, 2024"
        },
        {
          id: "blog-5",          category: "Transformation",          title: "Restoring Confidence: Dental Implant Success Story",          excerpt: "Learn about a patient's journey to restoring their smile and confidence with advanced dental implants, providing a natural and lasting solution.",          imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-happy-middle-aged-business-man_1262-4810.jpg",          imageAlt: "Before and After Dental Implant",          authorName: "Molar Dental Team",          authorAvatar: "http://img.b2bpic.net/free-photo/smiley-doctor-wearing-white-coat-front-view_23-2149844581.jpg",          date: "July 05, 2024"
        },
        {
          id: "blog-6",          category: "Clinic Interior",          title: "Our Luxurious Patient Lounge & Reception",          excerpt: "Experience the tranquil and elegant ambiance of our patient lounge and reception area, crafted for your ultimate relaxation and comfort.",          imageSrc: "http://img.b2bpic.net/free-photo/no-people-empty-hospital-reception-waiting-room-medical-facility-with-healthcare-service-cure-patients-with-disease-nobody-clinic-lobby-waiting-area-covid-19-pandemic_482257-46054.jpg",          imageAlt: "Luxurious Dental Clinic Reception",          authorName: "Molar Dental Team",          authorAvatar: "http://img.b2bpic.net/free-photo/smiley-doctor-wearing-white-coat-front-view_23-2149844581.jpg",          date: "July 01, 2024"
        },
      ]}
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFifteen
      useInvertedBackground={false}
      testimonial="“Choosing Molar Dental Clinics was the best decision for my dental health. The team’s dedication to perfection and patient comfort is truly outstanding. My smile has never looked better, and I feel more confident than ever. This is truly an award-winning experience!”"
      rating={5}
      author="Aisha Al-Ghamdi, Valued Patient"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/beautiful-girl-sitting-dentist-s-office_1157-23501.jpg",          alt: "Aisha Al-Ghamdi"},
        {
          src: "http://img.b2bpic.net/free-photo/positive-confident-entrepreneur-posing-with-arms-folded_74855-3027.jpg",          alt: "Ahmed M."},
        {
          src: "http://img.b2bpic.net/free-photo/front-view-female-doctors-helping-patient_23-2149844605.jpg",          alt: "Nadia S."},
        {
          src: "http://img.b2bpic.net/free-photo/old-man-sitting-dentist-s-office_1157-19457.jpg",          alt: "Fahad K."},
        {
          src: "http://img.b2bpic.net/free-photo/portrait-optimistic-businessman-formalwear_1262-3600.jpg",          alt: "Laila B."},
        {
          src: "http://img.b2bpic.net/free-photo/playful-asian-woman_1098-22085.jpg",          alt: "Omar Z."},
      ]}
      ratingAnimation="blur-reveal"
      avatarsAnimation="slide-up"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "faq-1",          title: "What payment options do you accept?",          content: "We accept major credit cards (Visa, MasterCard, American Express), debit cards, bank transfers, and offer flexible payment plans. Please contact our reception for more details on insurance and financing."},
        {
          id: "faq-2",          title: "How do I book an appointment?",          content: "You can book an appointment by filling out the contact form on our website, calling us directly at +966570707029, or visiting our clinic during business hours. Our reception team will assist you."},
      ]}
      title="Frequently Asked Questions"
      description="Find quick answers to common questions about our services, appointments, and patient care policies at Molar Dental Clinics."
      tag="Your Questions Answered"
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplit
      useInvertedBackground={false}
      background={{
        variant: "plain"}}
      tag="Book Your Visit"
      title="Schedule Your Exclusive Appointment"
      description="Embark on your journey to a perfect smile at Molar Dental Clinics. Our team is ready to provide you with world-class dental care in a luxurious setting. Fill out the form below or contact us directly."
      tagIcon={CalendarCheck}
      imageSrc="http://img.b2bpic.net/free-photo/top-view-mobile-phone-poland-map_23-2148232472.jpg"
      imageAlt="Map showing Molar Dental Clinics location in Riyadh"
      mediaAnimation="slide-up"
      mediaPosition="right"
      inputPlaceholder="Your Name"
      buttonText="Submit Appointment Request"
      termsText="By submitting, you agree to our privacy policy and consent to Molar Dental Clinics contacting you."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterCard
      logoText="Molar Dental Clinics"
      copyrightText="© 2024 Molar Dental Clinics. All rights reserved."
      socialLinks={[
        {
          icon: Facebook,
          href: "#",          ariaLabel: "Facebook page"},
        {
          icon: Instagram,
          href: "#",          ariaLabel: "Instagram profile"},
        {
          icon: Twitter,
          href: "#",          ariaLabel: "Twitter profile"},
        {
          icon: Linkedin,
          href: "#",          ariaLabel: "LinkedIn profile"},
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
