"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import { Shield, Smile, Award } from "lucide-react";

export default function LandingPage() {
  const navLinks = [
    { name: "الرئيسية", id: "hero" },
    { name: "من نحن", id: "about" },
    { name: "خدماتنا", id: "features" },
    { name: "تواصل معنا", id: "contact" },
  ];

  return (
    <ThemeProvider
        defaultButtonVariant="hover-magnetic"
        defaultTextAnimation="entrance-slide"
        borderRadius="soft"
        contentWidth="medium"
        sizing="largeSizeMediumTitles"
        background="noiseDiagonalGradient"
        cardStyle="glass-elevated"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="glass"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={navLinks}
      brandName="Aljoman Dental"
      button={{ text: "احجز موعداً", href: "#contact" }}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroOverlayTestimonial
      title="أبتسامة ثقة تليق بك في عيادات الجومان"
      description="نقدم خدمات طب الأسنان التجميلي والعلاجي بأعلى معايير الجودة العالمية، بلمسة من العناية الفائقة."
      testimonials={[
        { name: "أحمد العتيبي", handle: "@ahmed", testimonial: "تجربة استثنائية وعناية احترافية في الجومان، شكراً لكم على الابتسامة الجديدة.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/empty-stomatology-orthodontic-hospital-cabinet-with-nobody-it-equipped-with-modern-furniture-teet_482257-2882.jpg?_wi=1", imageAlt: "dental clinic interior" },
        { name: "سارة خالد", handle: "@sara", testimonial: "أفضل عيادة تعاملت معها، الأجهزة متطورة جداً والتعامل راقي.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/dentist-s-office-interior-with-modern-chair-special-dentisd-equipment-interior-stomatology-clinic_482257-11998.jpg?_wi=1", imageAlt: "dental clinic interior" }
      ]}
      buttons={[{ text: "احجز موعداً", href: "#contact" }]}
      showBlur={true}
    />
  </div>

  <div id="about" data-section="about">
      <TestimonialAboutCard
      tag="لماذا نحن؟"
      title="التميز في طب الأسنان منذ عقود"
      description="عيادات الجومان ليست مجرد مركز طبي، بل تجربة متكاملة للعناية بصحة وجمال أسنانك."
      subdescription="نستخدم أحدث التقنيات الرقمية لضمان أدق النتائج وأكثرها راحة للمريض."
      icon={Shield}
      imageSrc="http://img.b2bpic.net/free-photo/dentist-s-office-interior-with-modern-chair-special-dentisd-equipment-interior-stomatology-clinic_482257-11998.jpg?_wi=2"
      mediaAnimation="blur-reveal"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardSix
      textboxLayout="split"
      features={[
        { title: "طب الأسنان التجميلي", description: "ابتسامة هوليود، تبييض الأسنان، وعدسات اللومينير.", imageSrc: "http://img.b2bpic.net/free-photo/patient-pov-listening-explication-teeth-treatment-dentist-coverall-showing-x-ray-tablet-stomatology-specialist-wearing-protective-suit-against-infection-with-covid19-pointing-radiograph_482257-13149.jpg?_wi=2" },
        { title: "العلاج التحفظي", description: "علاج العصب، الحشوات التجميلية، وعلاج اللثة.", imageSrc: "http://img.b2bpic.net/free-photo/man-dentist-s-appointment_1321-4592.jpg?_wi=2" }
      ]}
      title="خدماتنا المتميزة"
      description="نقدم حلولاً طبية متكاملة لابتسامة ساحرة."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardOne
      animationType="blur-reveal"
      textboxLayout="split"
      gridVariant="uniform-all-items-equal"
      products={[
        { id: "p1", name: "باقة التبييض الاحترافية", price: "٩٩٩ ر.س", imageSrc: "http://img.b2bpic.net/free-photo/equipment-dental-instruments-dentist-s-office-tools-close-up_8353-1677.jpg" }
      ]}
      title="عروضنا الحصرية"
      description="استكشف أحدث عروض الباقات التجميلية والعلاجية."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardOne
      animationType="blur-reveal"
      textboxLayout="split"
      gridVariant="bento-grid"
      metrics={[
        { id: "m1", value: "١٥,٠٠٠+", title: "مريض سعيد", description: "ثقتكم هي سر نجاحنا الدائم.", icon: Smile },
        { id: "m2", value: "٢٠+", title: "سنة خبرة", description: "نقدم خبرة عقود لابتسامتك.", icon: Award }
      ]}
      title="أرقام تدل على تميزنا"
      description="نحن نفخر بما حققناه لآلاف المرضى."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplit
      tag="تواصل معنا"
      title="ابدأ رحلة ابتسامتك اليوم"
      description="احجز استشارتك المجانية. العنوان: طريق المدينة المنورة، حي الفيصلية، جدة 23442، المملكة العربية السعودية."
      background={{ variant: "sparkles-gradient" }}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      columns={[
        { items: [{ label: "من نحن", href: "#about" }, { label: "خدماتنا", href: "#features" }] },
        { items: [{ label: "احجز موعداً", href: "#contact" }, { label: "جدة - الفيصلية", href: "#" }] }
      ]}
      logoText="عيادات الجومان"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}