"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
import ContactFaq from "@/components/sections/contact/ContactFaq";
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
import Link from "next/link";
import {
  CheckCircle,
  FileCheck,
  Shield,
  Zap,
  Leaf,
  Clipboard,
  AlertCircle,
  Users,
  Award,
  Clock,
  Phone,
} from "lucide-react";

export default function ServicesPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="mediumSmall"
      sizing="medium"
      background="circleGradient"
      cardStyle="inset"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="layered"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={[
            { name: "Home", id: "/" },
            { name: "Services", id: "/services" },
            { name: "About", id: "/about" },
            { name: "Contact", id: "/contact" },
          ]}
          brandName="D-SOL RTO"
          bottomLeftText="Karawal Nagar, Delhi"
          bottomRightText="+91-XXXXXXX"
        />
      </div>

      <div id="services-detail" data-section="services-detail">
        <FeatureCardTwentyFive
          title="Complete RTO & Insurance Solutions"
          description="Explore all our specialized services designed to simplify your vehicle documentation and registration needs."
          tag="Comprehensive Services"
          tagIcon={CheckCircle}
          features={[
            {
              title: "Driving License Renewal",              description:
                "Quick DL renewal with all documentation handled by our experts. Valid for 10 years. No hassle, no extra visits to RTO office.",              icon: FileCheck,
              mediaItems: [
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/car-instructor-explaining-city-traffic-rules-before-driving-car_342744-678.jpg",                  imageAlt: "Driving License Renewal Service"},
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/colleagues-meeting-room-posing-camera_114579-2809.jpg",                  imageAlt: "Our Professional Team"},
              ],
            },
            {
              title: "Insurance Renewal",              description:
                "Hassle-free motor insurance renewal - Comprehensive & Third Party coverage. All insurance companies available. Best premiums guaranteed.",              icon: Shield,
              mediaItems: [
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/happy-customer-buying-brand-new-car-local-car-dealership_342744-748.jpg",                  imageAlt: "Insurance Renewal Process"},
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/business-people-walking-outside-office-building_107420-74359.jpg",                  imageAlt: "Our Office"},
              ],
            },
            {
              title: "Vehicle Fitness Certificate",              description:
                "Professional fitness certificate inspection for new & old vehicles. Quick, approved inspection center. Valid for commercial & private vehicles.",              icon: Zap,
              mediaItems: [
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/mid-section-mechanic-preparing-check-list_1170-1309.jpg",                  imageAlt: "Vehicle Fitness Check"},
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/colleagues-meeting-room-posing-camera_114579-2809.jpg",                  imageAlt: "Expert Mechanics"},
              ],
            },
            {
              title: "Pollution Certificate",              description:
                "Certified emission test & pollution certificate for all vehicle types. Approved testing center. Fast & reliable service with instant reports.",              icon: Leaf,
              mediaItems: [
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/auto-mechanic-using-laptop-while-talking-customer-repair-shop_637285-8614.jpg",                  imageAlt: "Pollution Test Center"},
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/business-people-walking-outside-office-building_107420-74359.jpg",                  imageAlt: "Our Facility"},
              ],
            },
            {
              title: "RC Transfer & Ownership Change",              description:
                "Vehicle ownership transfer made simple with complete paperwork handling. Fast & completely transparent process with expert guidance.",              icon: Clipboard,
              mediaItems: [
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/businesswoman-has-meeting-journey_329181-13739.jpg",                  imageAlt: "RC Transfer Service"},
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/colleagues-meeting-room-posing-camera_114579-2809.jpg",                  imageAlt: "Expert Consultants"},
              ],
            },
            {
              title: "Traffic Challan Settlement",              description:
                "Expert traffic challan resolution & payment guidance. Complete support through entire e-challan settlement process via traffic police portal.",              icon: AlertCircle,
              mediaItems: [
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/colleagues-meeting-room-posing-camera_114579-2809.jpg",                  imageAlt: "Challan Settlement Experts"},
                {
                  imageSrc:
                    "http://img.b2bpic.net/free-photo/business-people-walking-outside-office-building_107420-74359.jpg",                  imageAlt: "Consultation Room"},
              ],
            },
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="service-metrics" data-section="service-metrics">
        <MetricCardThree
          title="Service Excellence"
          description="Our commitment to quality and customer satisfaction is reflected in every metric"
          metrics={[
            {
              id: "1",              icon: Users,
              title: "Satisfied Clients",              value: "2000+"},
            {
              id: "2",              icon: CheckCircle,
              title: "Tasks Completed",              value: "5000+"},
            {
              id: "3",              icon: Award,
              title: "Customer Rating",              value: "5.0 ⭐"},
            {
              id: "4",              icon: Clock,
              title: "Avg Completion",              value: "2 Days"},
          ]}
          animationType="scale-rotate"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="service-contact" data-section="service-contact">
        <ContactFaq
          faqs={[
            {
              id: "1",              title: "Which service should I choose for new vehicle?",              content:
                "For a new vehicle, you'll need RC registration, insurance, pollution certificate, and fitness certificate. Contact us for a complete package quote."},
            {
              id: "2",              title: "Can you handle vehicle ownership transfer?",              content:
                "Yes! We handle complete RC transfer for both buyer and seller. Requires documents from both parties. Process takes 7-10 days."},
            {
              id: "3",              title: "How often should I renew fitness certificate?",              content:
                "Two-wheelers: Every 2 years after 4 years of registration. Four-wheelers: Every 5 years after 8 years. Commercial vehicles: Every year after 1 year."},
          ]}
          ctaTitle="Book Your Service Today"
          ctaDescription="Choose any service from our comprehensive list and book your appointment now. We'll handle everything for you."
          ctaButton={{ text: "Schedule Service", href: "tel:+919876543210" }}
          ctaIcon={Phone}
          useInvertedBackground={true}
          animationType="slide-up"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="D-SOL RTO"
          columns={[
            {
              items: [
                { label: "Home", href: "/" },
                { label: "Services", href: "/services" },
                { label: "About Us", href: "/about" },
                { label: "Contact", href: "/contact" },
              ],
            },
            {
              items: [
                { label: "DL Renewal", href: "/services" },
                { label: "Insurance Renewal", href: "/services" },
                { label: "RC Transfer", href: "/services" },
                { label: "Fitness Certificate", href: "/services" },
              ],
            },
            {
              items: [
                { label: "📞 Call: +91-XXXXXXX", href: "tel:+919876543210" },
                {
                  label: "💬 WhatsApp: +91-XXXXXXX",                  href: "https://wa.me/919876543210"},
                { label: "📍 Karawal Nagar, Delhi", href: "#" },
                { label: "⏰ Mon-Sat: 9AM-6PM", href: "#" },
              ],
            },
            {
              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms & Conditions", href: "#" },
                { label: "Disclaimer", href: "#" },
                { label: "GST Registration", href: "#" },
              ],
            },
            {
              items: [
                { label: "Facebook", href: "https://facebook.com" },
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Google Reviews", href: "https://google.com" },
                { label: "LinkedIn", href: "https://linkedin.com" },
              ],
            },
          ]}
        />
      </div>
    </ThemeProvider>
  );
}