"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import TextAbout from '@/components/sections/about/TextAbout';
import TeamCardFive from '@/components/sections/team/TeamCardFive';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import Link from "next/link";

export default function RootCanalsPage() {

  const navItems = [
    { name: "Home", id: "/" },
    { name: "General Dentistry", id: "/general-dentistry" },
    { name: "Implants", id: "/implants" },
    { name: "Root Canals", id: "/root-canals" },
    { name: "Cosmetic", id: "/cosmetic-treatments" },
    { name: "Family Care", id: "/family-care" }
  ];

  const footerNavItemsColumn1 = [
    { label: "General Dentistry", href: "/general-dentistry" },
    { label: "Dental Implants", href: "/implants" },
    { label: "Root Canals", href: "/root-canals" }
  ];

  const footerNavItemsColumn2 = [
    { label: "Cosmetic Treatments", href: "/cosmetic-treatments" },
    { label: "Family Care", href: "/family-care" },
    { label: "About Us", href: "/#about" }
  ];

  const footerNavItemsColumn3 = [
    { label: "Contact Us", href: "/contact" },
    { label: "Book Appointment", href: "/contact" },
    { label: "Privacy Policy", href: "#" }
  ];

  return (
    <ThemeProvider
      defaultButtonVariant={"shift-hover"}
      defaultTextAnimation={"reveal-blur"}
      borderRadius={"pill"}
      contentWidth={"smallMedium"}
      sizing={"largeSmallSizeLargeTitles"}
      background={"fluid"}
      cardStyle={"layered-gradient"}
      primaryButtonStyle={"diagonal-gradient"}
      secondaryButtonStyle={"layered"}
      headingFontWeight={"medium"}
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple brandName="Family Dental Center" navItems={navItems.map(item => ({...item, href: item.id}))} />
      </div>

      <div id="about-root-canals" data-section="about-root-canals">
        <TextAbout
          title="Gentle & Effective Root Canal Treatment"
          description="Root canal treatment can save a tooth that is badly infected or decayed, relieving pain and preventing further complications. Our experienced endodontists ensure a comfortable and effective procedure using advanced techniques to preserve your natural tooth."
          useInvertedBackground={false}
        />
      </div>

      <div id="team-root-canals" data-section="team-root-canals">
        <TeamCardFive
          title="Meet Our Endodontic Specialists"
          description="Our highly skilled endodontists are dedicated to providing precise and gentle root canal treatments, ensuring your comfort and optimal outcomes."
          team={[
            { id: "d1", name: "Dr. Amir Hassan", role: "Lead Endodontist", imageSrc: "http://img.b2bpic.net/free-photo/female-doctor-holding-her-chin-looking-camera-high-quality-photo_114579-60424.jpg", imageAlt: "Dr. Amir Hassan" },
            { id: "d2", name: "Dr. Sana Khan", role: "Associate Endodontist", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-young-woman-sitting-dental-chair-while-visiting-female-dentist-routine-checkup-teeth-cleaning-whitening_343059-390.jpg", imageAlt: "Dr. Sana Khan" },
            { id: "d3", name: "Dr. Tariq Obaid", role: "Consulting Endodontist", imageSrc: "http://img.b2bpic.net/free-photo/female-dentist-holding-dental-model-hands-concept-dentistry-dental-treatment_169016-67449.jpg", imageAlt: "Dr. Tariq Obaid" }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="faq-root-canals" data-section="faq-root-canals">
        <FaqDouble
          title="Root Canal FAQs"
          description="Get answers to common questions about root canal procedures, recovery, and preventing future issues."
          faqs={[
            { id: "rcfaq1", title: "Is a root canal painful?", content: "With modern anesthetics and techniques, root canal treatment is often no more uncomfortable than a routine filling. Our team prioritizes your comfort." },
            { id: "rcfaq2", title: "How long does a root canal procedure take?", content: "A root canal can typically be completed in one or two appointments, depending on the complexity of the case." },
            { id: "rcfaq3", title: "What should I expect after a root canal?", content: "It's normal to experience some sensitivity or mild discomfort for a few days. We will provide detailed aftercare instructions and pain management recommendations." }
          ]}
          faqsAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Family Dental Center"
          columns={[
            { items: footerNavItemsColumn1.map(item => ({...item, Component: Link})) },
            { items: footerNavItemsColumn2.map(item => ({...item, Component: Link})) },
            { items: footerNavItemsColumn3.map(item => ({...item, Component: Link})) }
          ]}
          useInvertedBackground={true}
        />
      </div>
    </ThemeProvider>
  );
}