"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import MediaAbout from "@/components/sections/about/MediaAbout";
import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
import ContactCenter from "@/components/sections/contact/ContactCenter";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import Link from "next/link";
import { Shield, Calendar } from "lucide-react";

export default function DoctorsPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="bounce-effect"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="compact"
      sizing="largeSmallSizeMediumTitles"
      background="noise"
      cardStyle="glass-depth"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="solid"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="City Hospital"
          navItems={[
            { name: "Home", id: "/" },
            { name: "About", id: "/about" },
            { name: "Services", id: "/services" },
            { name: "Doctors", id: "/doctors" },
            { name: "Contact", id: "/contact" },
          ]}
          button={{ text: "Book Appointment", href: "/contact" }}
        />
      </div>

      <div id="doctors-intro" data-section="doctors-intro">
        <MediaAbout
          title="Our Expert Team of Gynecologists & Medical Professionals"
          description="At City Hospital Maternity Home, we are proud to have assembled a team of highly qualified, compassionate healthcare professionals dedicated to delivering exceptional maternal care. Each member of our team brings years of specialized experience and a deep commitment to the wellbeing of mothers and newborns."
          tag="Meet Our Team"
          tagIcon={Shield}
          tagAnimation="entrance-slide"
          imageSrc="http://img.b2bpic.net/free-photo/team-doctors-standing-together-hospital-premises_107420-84769.jpg"
          imageAlt="City Hospital Medical Team"
          buttons={[{ text: "Book a Consultation", href: "/contact" }]}
          buttonAnimation="entrance-slide"
          useInvertedBackground={false}
        />
      </div>

      <div id="team-expertise" data-section="team-expertise">
        <MetricCardSeven
          metrics={[
            {
              id: "1",
              value: "15+",
              title: "Senior Gynecologists",
              items: [
                "Specialists in obstetrics and gynecology",
                "Advanced training in high-risk pregnancies",
                "Certified in maternal fetal medicine",
              ],
            },
            {
              id: "2",
              value: "30+",
              title: "Nursing & Midwifery Staff",
              items: [
                "Trained midwives with delivery experience",
                "Lactation consultants and coaches",
                "Postpartum care specialists",
              ],
            },
            {
              id: "3",
              value: "5+",
              title: "Specialist Support Team",
              items: [
                "Pediatricians for newborn care",
                "Anesthesiologists for surgical delivery",
                "Mental health counselors",
              ],
            },
          ]}
          title="Professional Excellence & Continuous Learning"
          description="Our medical staff undergoes regular training and stays updated with the latest maternal healthcare practices, ensuring you receive evidence-based care meeting international standards."
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="entrance-slide"
        />
      </div>

      <div id="contact-doctors" data-section="contact-doctors">
        <ContactCenter
          tag="Connect With Our Team"
          title="Schedule Your Doctor's Consultation"
          description="Meet with our experienced gynecologists to discuss your pregnancy, address your concerns, and develop a personalized care plan tailored to your specific needs and preferences."
          tagIcon={Calendar}
          tagAnimation="entrance-slide"
          background={{ variant: "rotated-rays-animated" }}
          useInvertedBackground={false}
          inputPlaceholder="Enter your email"
          buttonText="Book Consultation"
          termsText="We respect your privacy. Our team will contact you to schedule your preferred appointment time with one of our specialists."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="City Hospital"
          leftLink={{ text: "Privacy Policy", href: "#" }}
          rightLink={{ text: "Terms of Service", href: "#" }}
        />
      </div>
    </ThemeProvider>
  );
}