"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import HeroBillboard from "@/components/sections/hero/HeroBillboard";
import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
import FeatureCardSixteen from "@/components/sections/feature/FeatureCardSixteen";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
import { Star, Award, Sparkles, HelpCircle, CheckCircle } from "lucide-react";

export default function HomePage() {
  const navItems = [
    { name: "Home", id: "home" },
    { name: "Services", id: "services" },
    { name: "About", id: "about" },
    { name: "Reviews", id: "reviews" },
    { name: "Contact", id: "contact" },
  ];

  const footerColumns = [
    {
      title: "Quick Links",
      items: [
        { label: "Home", href: "/" },
        { label: "About Dr. Sakina", href: "/about" },
        { label: "Contact Us", href: "/" },
      ],
    },
    {
      title: "Contact Info",
      items: [
        { label: "Phone: +92 312 5458615", href: "tel:+923125458615" },
        { label: "WhatsApp", href: "https://wa.me/923125458615" },
        { label: "Email: info@drsakinaclinics.com", href: "mailto:info@drsakinaclinics.com" },
        { label: "Google Maps", href: "https://maps.google.com/?q=Dr+Sakina+Clinics+Wah+Cantt" },
      ],
    },
    {
      title: "Hours & Location",
      items: [
        { label: "Opens 10:00 AM - 7:00 PM", href: "#" },
        { label: "Closed Sundays", href: "#" },
        { label: "Mall Road, Wah Cantt", href: "#" },
        { label: "Near Barrier 3", href: "#" },
      ],
    },
    {
      title: "Legal",
      items: [
        { label: "Privacy Policy", href: "#" },
        { label: "Terms of Service", href: "#" },
        { label: "Disclaimer", href: "#" },
        { label: "Accessibility", href: "#" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="compact"
      sizing="largeSmallSizeMediumTitles"
      background="noiseDiagonalGradient"
      cardStyle="layered-gradient"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Dr. Sakina Clinics"
          navItems={navItems}
          button={{
            text: "Call Now: +92 312 5458615",
            href: "tel:+923125458615",
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Trusted Dermatology Care in Wah Cantt"
          description="Expert skin and hair treatments from Dr. Sakina. Rated 4.6★ by 137 patients. Call now to book your appointment."
          background={{ variant: "radial-gradient" }}
          tag="4.6★ 137 Reviews • Women-Owned"
          tagIcon={Star}
          tagAnimation="slide-up"
          buttons={[
            {
              text: "Call Now: +92 312 5458615",
              href: "tel:+923125458615",
            },
            {
              text: "Request Appointment",
              href: "/",
            },
          ]}
          buttonAnimation="slide-up"
          imageSrc="http://img.b2bpic.net/free-vector/hospital-template-design_23-2150363212.jpg"
          imageAlt="Dr. Sakina Clinics entrance and reception"
          mediaAnimation="slide-up"
          avatars={[
            {
              src: "http://img.b2bpic.net/free-photo/smiling-young-doctor-wearing-stethoscope-medical-gown-showing-okey-gesture-both-hands-red-backgroung_141793-27138.jpg",
              alt: "Patient 1",
            },
            {
              src: "http://img.b2bpic.net/free-photo/portrait-cheerful-teenage-girl-sitting-cafe_1262-3048.jpg",
              alt: "Patient 2",
            },
            {
              src: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg",
              alt: "Patient 3",
            },
            {
              src: "http://img.b2bpic.net/free-photo/close-up-professional-female-entrepreneur-smiling-front-looking-confident-determined-standing-white-wall_176420-42649.jpg",
              alt: "Patient 4",
            },
            {
              src: "http://img.b2bpic.net/free-photo/portrait-cheerful-teenage-girl-sitting-cafe_1262-3048.jpg",
              alt: "Patient 5",
            },
          ]}
          avatarText="Join 500+ Happy Patients"
          ariaLabel="Hero section with clinic introduction and call-to-action"
        />
      </div>

      <div id="about" data-section="about">
        <MetricSplitMediaAbout
          title="Meet Dr. Sakina"
          description="With over 12 years of experience in dermatology, Dr. Sakina is committed to providing compassionate, evidence-based skincare solutions. Located at the heart of Wah Cantt near Barrier 3, our clinic combines professional expertise with a welcoming environment."
          tag="Credentials & Experience"
          tagIcon={Award}
          tagAnimation="slide-up"
          imageSrc="http://img.b2bpic.net/free-photo/portrait-young-beautiful-female-doctor-happily-looking-camera-smiling-white-background_574295-2641.jpg"
          imageAlt="Dr. Sakina professional portrait"
          mediaAnimation="slide-up"
          metrics={[
            {
              value: "12+",
              title: "Years Experience",
            },
            {
              value: "5000+",
              title: "Patients Treated",
            },
            {
              value: "4.6★",
              title: "Average Rating",
            },
            {
              value: "24/7",
              title: "Support Available",
            },
          ]}
          metricsAnimation="slide-up"
          useInvertedBackground={false}
          ariaLabel="About Dr. Sakina section with credentials and metrics"
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardSixteen
          title="Comprehensive Dermatology Services"
          description="From acne treatment to hair restoration, we offer a full range of dermatological services tailored to your unique needs."
          tag="Our Treatments"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          negativeCard={{
            items: [
              "Acne & breakouts",
              "Scarring & pitting",
              "Pigmentation issues",
              "Slow hair growth",
            ],
          }}
          positiveCard={{
            items: [
              "Clear, glowing skin",
              "Smooth, even complexion",
              "Even skin tone",
              "Thick, healthy hair",
            ],
          }}
          buttons={[
            {
              text: "Book Your Consultation",
              href: "/",
            },
          ]}
          buttonAnimation="slide-up"
          ariaLabel="Services comparison section"
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Trusted by Local Community"
          description="Featured and recommended by leading health platforms and local directories."
          tag="As Seen On"
          tagIcon={CheckCircle}
          tagAnimation="slide-up"
          names={[
            "Google Maps",
            "Health Directory",
            "Local Business Registry",
            "Patient Reviews Hub",
            "Medical Excellence Awards",
            "Community Health Partners",
            "Women-Owned Business Network",
            "Digital Healthcare",
          ]}
          textboxLayout="default"
          useInvertedBackground={false}
          showCard={true}
          ariaLabel="Social proof and featured logos section"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="Dr. Sakina is absolutely wonderful! My acne cleared up in just 3 months with her personalized treatment plan. Highly professional and caring."
          rating={5}
          author="Fatima Khan"
          avatars={[
            {
              src: "http://img.b2bpic.net/free-photo/portrait-young-female-doctor-with-intern_329181-9234.jpg",
              alt: "Fatima Khan",
            },
            {
              src: "http://img.b2bpic.net/free-photo/portrait-professional-confident-young-woman-working-retail-business-industry-promote-company-advertise-join-her-team-smiling-self-assured-pleased-camera-stand-hall_197531-22167.jpg",
              alt: "Aisha Ahmed",
            },
            {
              src: "http://img.b2bpic.net/free-photo/young-blonde-woman-standing-with-relaxed-expression-coffee-shop-terrace_839833-33402.jpg",
              alt: "Sara Hassan",
            },
            {
              src: "http://img.b2bpic.net/free-photo/woman-wearing-pajamas-while-sitting-bed_273609-13215.jpg",
              alt: "Zainab Ali",
            },
          ]}
          ratingAnimation="slide-up"
          avatarsAnimation="slide-up"
          useInvertedBackground={false}
          ariaLabel="Testimonials section with patient reviews"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitMedia
          title="Frequently Asked Questions"
          description="Get answers to common questions about our treatments and appointment process."
          tag="Quick Answers"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          faqs={[
            {
              id: "1",
              title: "How do I book an appointment?",
              content: "You can call us directly at +92 312 5458615, use our online contact form, or send a WhatsApp message. We typically schedule appointments within 24-48 hours.",
            },
            {
              id: "2",
              title: "What should I expect on my first visit?",
              content: "Your first visit includes a thorough skin assessment, discussion of your concerns, and a customized treatment plan. This consultation typically takes 30-45 minutes.",
            },
            {
              id: "3",
              title: "Are treatments suitable for all skin types?",
              content: "Yes! Dr. Sakina specializes in treating all skin types and tones with tailored protocols to ensure safety and optimal results for each individual.",
            },
            {
              id: "4",
              title: "What are your operating hours?",
              content: "We are open Monday to Saturday, 10:00 AM to 7:00 PM. Sunday appointments available by special request. Call for holiday hours.",
            },
            {
              id: "5",
              title: "Do you accept insurance?",
              content: "We accept major insurance providers and health cards. Please bring your insurance documentation to your first appointment.",
            },
            {
              id: "6",
              title: "Are results guaranteed?",
              content: "While results vary by individual, Dr. Sakina provides realistic expectations and evidence-based treatments with proven efficacy rates over 85% for most conditions.",
            },
          ]}
          faqsAnimation="slide-up"
          mediaAnimation="slide-up"
          mediaPosition="right"
          imageSrc="http://img.b2bpic.net/free-photo/stylish-beautiful-spacious-dental-clinic_8353-9586.jpg?_wi=1"
          imageAlt="Modern clinic treatment room"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="smooth"
          showCard={true}
          ariaLabel="FAQ section with common questions answered"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Request Your Appointment"
          description="Fill out the form below and we'll contact you within 24 hours to confirm your appointment. You can also call us directly at +92 312 5458615."
          inputs={[
            {
              name: "fullName",
              type: "text",
              placeholder: "Your Full Name",
              required: true,
            },
            {
              name: "phone",
              type: "tel",
              placeholder: "+92 3XX XXXXXXX",
              required: true,
            },
            {
              name: "email",
              type: "email",
              placeholder: "Your Email Address",
              required: true,
            },
          ]}
          textarea={{
            name: "message",
            placeholder: "Describe your skin concern or question",
            rows: 5,
            required: true,
          }}
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-vector/minimalist-location-app-template_23-2148690536.jpg?_wi=1"
          imageAlt="Dr. Sakina Clinics location map - Wah Cantt"
          mediaAnimation="slide-up"
          mediaPosition="right"
          buttonText="Send Appointment Request"
          ariaLabel="Contact form for appointment requests"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={footerColumns}
          copyrightText="© 2024 Dr. Sakina Clinics. All rights reserved. Women-Owned. Licensed & Insured."
          ariaLabel="Footer with contact info and links"
        />
      </div>
    </ThemeProvider>
  );
}