"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import { Award, CheckCircle, Heart, Star } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="smallMedium"
      sizing="mediumSizeLargeTitles"
      background="none"
      cardStyle="glass-depth"
      primaryButtonStyle="flat"
      secondaryButtonStyle="layered"
      headingFontWeight="medium"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
          <NavbarStyleApple
            navItems={[
              { name: "About", id: "about" },
              { name: "Expertise", id: "features" },
              { name: "Patient Stories", id: "testimonials" },
              { name: "Contact", id: "contact" },
            ]}
            brandName="HeartCare Surgical"
          />
        </div>

        <div id="hero" data-section="hero">
          <HeroOverlay
            title="Excellence in Cardiovascular Care"
            description="Dr. Miller provides world-class surgical expertise and compassionate care for complex heart conditions."
            buttons={[
              { text: "Book Consultation", href: "#contact" },
              { text: "Learn About Procedures", href: "#features" },
            ]}
            imageSrc="http://img.b2bpic.net/free-photo/portrait-confident-male-surgeon_171337-1518.jpg?_wi=1"
            imageAlt="Leading Heart Surgeon"
            avatars={[
              { src: "http://img.b2bpic.net/free-photo/female-doctor-holding-red-heart-blue-uniform-looking-serious_176474-12754.jpg", alt: "Female doctor holding red heart" },
              { src: "http://img.b2bpic.net/free-photo/smiling-young-male-doctor-wearing-doctor-uniform-with-stethoscope-showing-heart-gesture-isolated-orange-wall_141793-83263.jpg", alt: "Smiling male doctor" },
              { src: "http://img.b2bpic.net/free-photo/surgeon-work_23-2147642789.jpg", alt: "Surgeon at work" },
              { src: "http://img.b2bpic.net/free-photo/smiling-young-bald-male-doctor-wearing-medical-robe-stethoscope_141793-73785.jpg", alt: "Smiling young doctor" },
              { src: "http://img.b2bpic.net/free-photo/portrait-confident-male-surgeon_171337-1518.jpg", alt: "Leading Heart Surgeon" },
            ]}
            avatarText="Trusted by thousands of patients"
          />
        </div>

        <div id="about" data-section="about">
          <MetricSplitMediaAbout
            useInvertedBackground={false}
            title="Dedicated to Your Heart Health"
            description="With over 20 years of experience in minimally invasive cardiac surgery, Dr. Miller combines cutting-edge clinical technology with a patient-centered approach to ensure the best possible outcomes."
            metrics={[
              { value: "20+", title: "Years Experience" },
              { value: "2,500+", title: "Successful Surgeries" },
              { value: "99%", title: "Patient Satisfaction" },
            ]}
            imageSrc="http://img.b2bpic.net/free-photo/interior-empty-science-laboratory-with-modern-equipment-prepared-pharmaceutical-innovation-using-high-tech-microbiology-tools-scientific-research-vaccine-development-against-covid19-virus_482257-12800.jpg?_wi=1"
            imageAlt="Advanced Cardiac Equipment"
            mediaAnimation="slide-up"
          />
        </div>

        <div id="features" data-section="features">
          <FeatureCardTen
            animationType="slide-up"
            textboxLayout="split"
            useInvertedBackground={false}
            features={[
              {
                title: "Coronary Bypass",                description: "Restoring healthy blood flow to your heart with precision techniques.",                media: { imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-male-surgeon_171337-1518.jpg?_wi=2", imageAlt: "Surgical Procedure" },
                items: [
                  { icon: CheckCircle, text: "Minimally invasive approach" },
                  { icon: CheckCircle, text: "Rapid recovery protocols" },
                ],
                reverse: false,
              },
              {
                title: "Valve Repair",                description: "Advanced repair and replacement options for optimal valve function.",                media: { imageSrc: "http://img.b2bpic.net/free-photo/interior-empty-science-laboratory-with-modern-equipment-prepared-pharmaceutical-innovation-using-high-tech-microbiology-tools-scientific-research-vaccine-development-against-covid19-virus_482257-12800.jpg?_wi=2", imageAlt: "Surgical Procedure" },
                items: [
                  { icon: CheckCircle, text: "State-of-the-art repair techniques" },
                  { icon: CheckCircle, text: "Dedicated monitoring" },
                ],
                reverse: true,
              },
              {
                title: "Aortic Surgery",                description: "Expert intervention for complex aortic conditions.",                media: { imageSrc: "http://img.b2bpic.net/free-photo/happy-older-woman-wearing-glasses_23-2149082498.jpg?_wi=1", imageAlt: "Surgical Procedure" },
                items: [
                  { icon: CheckCircle, text: "High-precision instrumentation" },
                  { icon: CheckCircle, text: "Tailored surgical plans" },
                ],
                reverse: false,
              },
            ]}
            title="Our Specialized Surgical Services"
            description="Comprehensive cardiac surgical solutions tailored to your unique condition."
          />
        </div>

        <div id="metrics" data-section="metrics">
          <MetricCardThree
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
            metrics={[
              { id: "m1", icon: Award, title: "Complication Rate", value: "<1%" },
              { id: "m2", icon: Star, title: "Avg Recovery Time", value: "4 Days" },
              { id: "m3", icon: Heart, title: "Patient Success", value: "98%" },
            ]}
            title="Clinical Performance Indicators"
            description="Data-driven results ensuring exceptional standards in patient care."
          />
        </div>

        <div id="testimonials" data-section="testimonials">
          <TestimonialCardThirteen
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
            testimonials={[
              { id: "1", name: "John Smith", handle: "@jsmith", testimonial: "Dr. Miller saved my life. The procedure was handled with absolute professionalism and the recovery was faster than I ever expected.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-older-woman-wearing-glasses_23-2149082498.jpg?_wi=2" },
              { id: "2", name: "Mary Johnson", handle: "@mjohnson", testimonial: "I was very nervous about my valve surgery, but the team's care and clarity made all the difference in my recovery.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/patient-hospital_23-2152005935.jpg" },
              { id: "3", name: "Robert Williams", handle: "@rwilliams", testimonial: "Excellent surgeon and dedicated staff. Could not ask for better care throughout the entire surgical process.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/confident-young-woman-fighting-cancer_23-2148992266.jpg" },
              { id: "4", name: "Susan Davis", handle: "@sdavis", testimonial: "My quality of life has improved drastically after my bypass procedure. Thank you for your incredible work.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/cheerful-female-doctor-celebrating-good-news-while-working-hospital_637285-5105.jpg" },
              { id: "5", name: "Michael Brown", handle: "@mbrown", testimonial: "Highly recommended surgeon. Extremely knowledgeable and empathetic. My heart health is better than ever.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/senior-man-with-grey-hair-standing-bricks-wall-celebrating-surprised-amazed-success-with-arms-raised-eyes-closed-winner-concept_839833-18748.jpg" },
            ]}
            showRating={true}
            title="Patient Success Stories"
            description="Real life stories from patients who restored their vitality under Dr. Miller's care."
          />
        </div>

        <div id="contact" data-section="contact">
          <ContactCenter
            useInvertedBackground={false}
            background={{ variant: "radial-gradient" }}
            tag="Contact Us"
            title="Schedule a Consultation"
            description="Take the first step toward better heart health. Reach out to discuss your options with our office."
            inputPlaceholder="Enter your email for appointment requests"
            buttonText="Inquire"
          />
        </div>

        <div id="footer" data-section="footer">
          <FooterBaseCard
            logoText="HeartCare Surgical"
            columns={[
              {
                title: "Clinical Services",                items: [
                  { label: "Bypass Surgery", href: "#" },
                  { label: "Valve Repair", href: "#" },
                  { label: "Heart Screening", href: "#" },
                ],
              },
              {
                title: "About",                items: [
                  { label: "Meet the Team", href: "#" },
                  { label: "Our Hospital", href: "#" },
                  { label: "Careers", href: "#" },
                ],
              },
              {
                title: "Legal",                items: [
                  { label: "Privacy Policy", href: "#" },
                  { label: "Terms of Use", href: "#" },
                ],
              },
            ]}
          />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
