"use client";

import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import FeatureBento from '@/components/sections/feature/FeatureBento';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBase from '@/components/sections/footer/FooterBase';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { AlertTriangle, Award, CheckCircle, Clock, Flame, Lightbulb, Phone, Quote, Shield, Star, Thermometer, Users, Wrench, Zap } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="expand-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="mediumLarge"
      sizing="medium"
      background="aurora"
      cardStyle="glass-depth"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="layered"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={[
            { name: "Home", id: "home" },
            { name: "Services", id: "services" },
            { name: "About", id: "about" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{ text: "Emergency Call", href: "contact" }}
          brandName="MK Technical"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardTestimonial
          title="24/7 Emergency Technical Services"
          description="Expert electrical repair, boiler maintenance, and emergency repairs. Available round-the-clock for urgent situations in your area."
          tag="Available 24/7"
          tagIcon={Zap}
          tagAnimation="slide-up"
          imageSrc="http://img.b2bpic.net/free-photo/distraught-car-mechanic-going-through-problematic-paperwork-with-his-manager-auto-repair-shop_637285-7584.jpg"
          imageAlt="Emergency technician responding to urgent repair call"
          mediaAnimation="slide-up"
          testimonials={[
            {
              name: "Sarah Mitchell",              handle: "Homeowner",              testimonial: "Fantastic service and response. Kamran arrived at midnight when my boiler burst and resolved everything within a few hours. Very grateful!",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=1",              imageAlt: "professional portrait customer satisfied happy"
            },
            {
              name: "David Chen",              handle: "Property Manager",              testimonial: "Professional and reliable. Handled our electrical emergency with expertise and efficiency. Highly recommended!",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=2",              imageAlt: "professional portrait customer satisfied happy"
            },
            {
              name: "Jennifer Walsh",              handle: "Business Owner",              testimonial: "Excellent technical knowledge and customer service. Responsive to urgent calls and fair pricing.",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=3",              imageAlt: "professional portrait customer satisfied happy"
            }
          ]}
          testimonialRotationInterval={5000}
          buttons={[
            { text: "Call Now", href: "contact" },
            { text: "Book Service", href: "services" }
          ]}
          buttonAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="about" data-section="about">
        <MetricSplitMediaAbout
          tag="Who We Are"
          tagIcon={Shield}
          tagAnimation="slide-up"
          title="Trusted Emergency Technical Services"
          description="Muhammad Kamran Technical Services provides rapid-response repair and maintenance solutions for electrical systems, boilers, and emergency maintenance. With years of experience handling urgent situations, we're committed to getting your systems back online quickly and safely."
          metrics={[
            { value: "24/7", title: "Round-the-Clock Availability" },
            { value: "100%", title: "Customer Satisfaction Focus" }
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/happy-manual-worker-presenting-results-business-development-while-giving-presentation-company-leaders-his-team-factory_637285-4144.jpg"
          imageAlt="Professional technical services team"
          mediaAnimation="slide-up"
          metricsAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureBento
          title="Our Expert Services"
          description="Comprehensive technical solutions for residential and commercial emergencies"
          tag="Services"
          tagIcon={Wrench}
          tagAnimation="slide-up"
          features={[
            {
              title: "Electrical Repair",              description: "Emergency electrical diagnostics, wiring repairs, circuit breaker issues, and safety inspections for your peace of mind.",              bentoComponent: "icon-info-cards",              items: [
                { icon: Zap, label: "Circuit Repair", value: "Rapid" },
                { icon: AlertTriangle, label: "Safety Check", value: "Complete" },
                { icon: Lightbulb, label: "Installation", value: "Expert" }
              ]
            },
            {
              title: "Boiler Maintenance",              description: "Emergency boiler repairs, heating system diagnostics, maintenance services, and annual safety checks.",              bentoComponent: "icon-info-cards",              items: [
                { icon: Flame, label: "Repair", value: "24/7" },
                { icon: Thermometer, label: "Diagnostics", value: "Advanced" },
                { icon: Wrench, label: "Maintenance", value: "Preventive" }
              ]
            },
            {
              title: "Emergency Maintenance",              description: "Rapid-response emergency services for unexpected breakdowns, urgent repairs, and critical system failures.",              bentoComponent: "icon-info-cards",              items: [
                { icon: Phone, label: "Quick Response", value: "Minutes" },
                { icon: Clock, label: "Availability", value: "Around Clock" },
                { icon: CheckCircle, label: "Resolution", value: "Fast" }
              ]
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardThree
          title="Why Choose Us"
          description="Proven expertise and commitment to customer satisfaction"
          tag="Our Strengths"
          tagIcon={Award}
          tagAnimation="slide-up"
          metrics={[
            { id: "1", icon: Zap, title: "Emergency Response", value: "Minutes" },
            { id: "2", icon: Clock, title: "Availability", value: "24/7" },
            { id: "3", icon: Users, title: "Satisfied Customers", value: "100+" },
            { id: "4", icon: Shield, title: "Expertise", value: "Certified" }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="What Our Customers Say"
          description="Real feedback from clients who trusted us with their emergency repairs and maintenance"
          tag="Testimonials"
          tagIcon={Star}
          tagAnimation="slide-up"
          testimonials={[
            {
              id: "1",              name: "Sarah Mitchell",              handle: "Homeowner",              testimonial: "Fantastic service and response. Kamran arrived at midnight when my boiler burst and resolved everything within a few hours. Very grateful for his service.",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=4",              imageAlt: "professional portrait customer satisfied happy"
            },
            {
              id: "2",              name: "David Chen",              handle: "@dchen",              testimonial: "Professional and reliable. Handled our electrical emergency with expertise and efficiency. Highly recommended for urgent situations.",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=5",              imageAlt: "professional portrait customer satisfied happy"
            },
            {
              id: "3",              name: "Jennifer Walsh",              handle: "@jwalsh",              testimonial: "Excellent technical knowledge and customer service. Responsive to urgent calls and fair pricing. Will definitely use again.",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=6",              imageAlt: "professional portrait customer satisfied happy"
            },
            {
              id: "4",              name: "Michael Roberts",              handle: "@mroberts",              testimonial: "Good and professional company. They know their craft and treat customers with respect. Very satisfied with the outcome.",              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=7",              imageAlt: "professional portrait customer satisfied happy"
            },
            {
              id: "5",              name: "Emma Thompson",              handle: "@ethompson",              testimonial: "Quick response time and professional approach. Solved our heating issue on the same day. Highly trustworthy service provider.",              icon: Quote
            },
            {
              id: "6",              name: "James Patterson",              handle: "@jpatterson",              testimonial: "Responsive service and transparent pricing. They arrive on time and complete the job professionally. A+ experience.",              icon: Quote
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          speed={40}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Get Emergency Help Now"
          description="Available 24/7 for urgent repairs and maintenance. Reach out immediately and let us know what you need."
          inputs={[
            { name: "name", type: "text", placeholder: "Your Name", required: true },
            { name: "phone", type: "tel", placeholder: "Phone Number", required: true },
            { name: "email", type: "email", placeholder: "Email Address", required: true },
            { name: "service", type: "text", placeholder: "Service Needed (Electrical, Boiler, Emergency, etc.)", required: true }
          ]}
          textarea={{
            name: "message",            placeholder: "Describe your emergency or repair need...",            rows: 5,
            required: true
          }}
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-photo/happy-cheerful-business-lady-speaking-cellphone_1262-20200.jpg"
          imageAlt="Contact us for emergency technical services"
          mediaAnimation="slide-up"
          mediaPosition="right"
          buttonText="Request Service"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="MK Technical"
          copyrightText="© 2025 Muhammad Kamran Technical Services. All rights reserved."
          columns={[
            {
              title: "Services",              items: [
                { label: "Electrical Repair", href: "services" },
                { label: "Boiler Maintenance", href: "services" },
                { label: "Emergency Services", href: "services" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "about" },
                { label: "Our Team", href: "about" },
                { label: "Testimonials", href: "testimonials" }
              ]
            },
            {
              title: "Contact",              items: [
                { label: "Get Help", href: "contact" },
                { label: "Emergency Call", href: "#" },
                { label: "Book Service", href: "contact" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}
