"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
import SplitAbout from '@/components/sections/about/SplitAbout';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { CheckCircle, Star, Wrench, Award, Shield, Zap, DollarSign, Calendar, Heart, Lightbulb, Users, MapPin, ListChecks } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="mediumLarge"
      sizing="largeSmallSizeLargeTitles"
      background="circleGradient"
      cardStyle="gradient-bordered"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="solid"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="ProServe"
          navItems={[
            { name: "Services", id: "services" },
            { name: "Why Us", id: "benefits" },
            { name: "About", id: "about" },
            { name: "Reviews", id: "social-proof" },
            { name: "Contact", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardCarousel
          title="Reliable Local Service Professionals Ready to Help"
          description="Licensed, insured, and 5-star rated. Fast response times. Transparent pricing. Same-day quotes available."
          tag="Local Service Experts"
          tagIcon={CheckCircle}
          tagAnimation="slide-up"
          background={{ variant: "sparkles-gradient" }}
          buttons={[
            { text: "Get Free Quote", href: "contact" },
            { text: "Call Now: (555) 123-4567", href: "contact" }
          ]}
          buttonAnimation="slide-up"
          mediaItems={[
            {
              imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-people-learning-make-sushi_23-2149865317.jpg",              imageAlt: "Professional service team at work"
            },
            {
              imageSrc: "http://img.b2bpic.net/free-photo/plumber-repair-experienced-attentive-middleaged-man-examining-bottom-kitchen-sink_259150-58266.jpg",              imageAlt: "Professional plumbing service"
            },
            {
              imageSrc: "http://img.b2bpic.net/free-photo/electrician-working-near-board-with-wires-installation-connection-electrics_169016-5876.jpg",              imageAlt: "Professional electrical service"
            },
            {
              imageSrc: "http://img.b2bpic.net/free-photo/coworkers-refill-air-conditioner-freon_482257-90737.jpg",              imageAlt: "Professional HVAC service"
            },
            {
              imageSrc: "http://img.b2bpic.net/free-photo/full-shot-roommates-together-home_23-2149358498.jpg",              imageAlt: "Professional cleaning service"
            }
          ]}
          ariaLabel="Hero section for professional local services"
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <TestimonialCardOne
          title="Trusted by Hundreds of Local Families & Businesses"
          description="Real reviews from satisfied customers who depend on our professional service"
          tag="Social Proof"
          tagIcon={Star}
          tagAnimation="slide-up"
          testimonials={[
            {
              id: "1",              name: "Sarah Martinez",              role: "Homeowner",              company: "Verified Buyer",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg",              imageAlt: "Sarah Martinez"
            },
            {
              id: "2",              name: "James Chen",              role: "Business Owner",              company: "Verified Buyer",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5367.jpg",              imageAlt: "James Chen"
            },
            {
              id: "3",              name: "Jennifer Davis",              role: "Property Manager",              company: "Verified Buyer",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-attractive-woman-showing-thumb-up-outdoors_1262-12526.jpg",              imageAlt: "Jennifer Davis"
            },
            {
              id: "4",              name: "Michael Rodriguez",              role: "Homeowner",              company: "Verified Buyer",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              imageAlt: "Michael Rodriguez"
            },
            {
              id: "5",              name: "Patricia Johnson",              role: "Business Manager",              company: "Verified Buyer",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg",              imageAlt: "Patricia Johnson"
            },
            {
              id: "6",              name: "David Thompson",              role: "Homeowner",              company: "Verified Buyer",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/happy-businesswoman-smiling-looking-camera-successful-confident-grey-haired-manager-sitting-office-room-workplace-business-management-concept_74855-7343.jpg",              imageAlt: "David Thompson"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="Customer testimonials section"
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardTwentySeven
          features={[
            {
              id: "1",              title: "Plumbing",              description: "Emergency repairs, installations, and maintenance. Water heater service, leak detection, and pipe replacement with 24/7 availability.",              imageSrc: "http://img.b2bpic.net/free-photo/plumber-repair-experienced-attentive-middleaged-man-examining-bottom-kitchen-sink_259150-58266.jpg",              imageAlt: "Professional plumbing service"
            },
            {
              id: "2",              title: "Electrical",              description: "Licensed electrician services including wiring, circuit repairs, panel upgrades, and lighting installations. Code-compliant work guaranteed.",              imageSrc: "http://img.b2bpic.net/free-photo/electrician-working-near-board-with-wires-installation-connection-electrics_169016-5876.jpg",              imageAlt: "Professional electrical service"
            },
            {
              id: "3",              title: "HVAC",              description: "Heating, cooling, and air quality solutions. System maintenance, repairs, and new installations with seasonal maintenance plans.",              imageSrc: "http://img.b2bpic.net/free-photo/coworkers-refill-air-conditioner-freon_482257-90737.jpg",              imageAlt: "Professional HVAC service"
            },
            {
              id: "4",              title: "Cleaning & Maintenance",              description: "Professional cleaning services for homes and businesses. Regular maintenance schedules available with eco-friendly products.",              imageSrc: "http://img.b2bpic.net/free-photo/full-shot-roommates-together-home_23-2149358498.jpg",              imageAlt: "Professional cleaning service"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          title="Our Core Services"
          description="Comprehensive solutions for all your home and business needs"
          tag="Services"
          tagIcon={Wrench}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          ariaLabel="Services section"
        />
      </div>

      <div id="benefits" data-section="benefits">
        <SplitAbout
          title="Why Choose ProServe?"
          description="Over 15 years of trusted service in your community"
          tag="Our Commitment"
          tagIcon={Award}
          tagAnimation="slide-up"
          bulletPoints={[
            {
              title: "Licensed & Insured",              description: "All team members are fully licensed, bonded, and insured for your protection",              icon: Shield
            },
            {
              title: "Same-Day Service",              description: "Emergency calls handled promptly. Most routine service same-day or next-day available",              icon: Zap
            },
            {
              title: "Transparent Pricing",              description: "No hidden fees. Free quotes provided upfront. Competitive rates guaranteed",              icon: DollarSign
            },
            {
              title: "5-Star Rated",              description: "Trusted by 500+ local families. Average rating 4.9/5 across all platforms",              icon: Star
            },
            {
              title: "Warranty Guarantee",              description: "All work backed by our satisfaction guarantee. 12-month warranty on parts and labor",              icon: CheckCircle
            }
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/business-woman-with-two-businessmen-sides_1262-824.jpg"
          imageAlt="Professional service team"
          mediaAnimation="slide-up"
          imagePosition="right"
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="Why choose us section"
        />
      </div>

      <div id="process" data-section="process">
        <MetricCardSeven
          metrics={[
            {
              id: "1",              value: "01",              title: "Request Quote",              items: ["Fill out contact form or call", "Describe your service needs", "Free, no-obligation quote"]
            },
            {
              id: "2",              value: "02",              title: "Consultation",              items: ["Expert assessment scheduled", "On-site or phone consultation", "Discuss timeline and options"]
            },
            {
              id: "3",              value: "03",              title: "Service Delivery",              items: ["Professional work performed", "Quality guaranteed throughout", "Regular progress updates"]
            },
            {
              id: "4",              value: "04",              title: "Follow-Up Support",              items: ["100% satisfaction check-in", "Warranty information provided", "Support available anytime"]
            }
          ]}
          animationType="slide-up"
          title="Our Simple Service Process"
          description="From your first contact to complete satisfaction in 4 easy steps"
          tag="How It Works"
          tagIcon={ListChecks}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="Service process section"
        />
      </div>

      <div id="contact-form" data-section="contact-form">
        <ContactSplitForm
          title="Get Your Free Quote Today"
          description="Fill out the form below and we'll respond within 24 hours with a detailed, transparent quote. No hidden fees. No obligations."
          inputs={[
            { name: "fullName", type: "text", placeholder: "Your Full 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 (e.g., Plumbing, Electrical)", required: true }
          ]}
          textarea={{
            name: "message",            placeholder: "Describe your service needs in detail...",            rows: 5,
            required: true
          }}
          useInvertedBackground={true}
          imageSrc="http://img.b2bpic.net/free-photo/serious-grey-haired-business-professional-suit-talking-cell-phone-while-using-computer-workplace-office-medium-shot-digital-communication-multitasking-concept_74855-11986.jpg"
          imageAlt="Customer service team"
          mediaAnimation="slide-up"
          mediaPosition="right"
          buttonText="Request Quote"
          ariaLabel="Contact form section"
        />
      </div>

      <div id="about" data-section="about">
        <SplitAbout
          title="About ProServe"
          description="Locally owned and operated since 2010, serving the community with pride and professionalism"
          tag="Local Experts"
          tagIcon={MapPin}
          tagAnimation="slide-up"
          bulletPoints={[
            {
              title: "15+ Years Experience",              description: "Founded by local tradesmen committed to quality workmanship and customer satisfaction",              icon: Calendar
            },
            {
              title: "Community Focused",              description: "Active in local community initiatives and charity organizations. Supporting our neighbors since day one",              icon: Heart
            },
            {
              title: "Continuously Trained",              description: "Team members undergo regular training on latest techniques, safety standards, and industry best practices",              icon: Lightbulb
            },
            {
              title: "Family Owned",              description: "Built on family values of integrity, hard work, and standing behind our service with pride",              icon: Users
            }
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/business-woman-with-two-businessmen-sides_1262-824.jpg"
          imageAlt="ProServe team members"
          mediaAnimation="slide-up"
          imagePosition="left"
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="About us section"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Contact ProServe Direct"
          description="Questions? Reach out via phone, email, or contact form. We're here to help and respond quickly to all inquiries."
          inputs={[
            { name: "contactName", type: "text", placeholder: "Your Name", required: true },
            { name: "contactEmail", type: "email", placeholder: "Email Address", required: true }
          ]}
          textarea={{
            name: "question",            placeholder: "Your message or question...",            rows: 4,
            required: true
          }}
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-photo/serious-grey-haired-business-professional-suit-talking-cell-phone-while-using-computer-workplace-office-medium-shot-digital-communication-multitasking-concept_74855-11986.jpg"
          imageAlt="Contact us"
          mediaAnimation="slide-up"
          mediaPosition="left"
          buttonText="Send Message"
          ariaLabel="Direct contact section"
        />
      </div>

      <FooterBaseReveal
        columns={[
          {
            title: "Services",            items: [
              { label: "Plumbing", href: "#services" },
              { label: "Electrical", href: "#services" },
              { label: "HVAC", href: "#services" },
              { label: "Cleaning", href: "#services" }
            ]
          },
          {
            title: "Company",            items: [
              { label: "About Us", href: "#about" },
              { label: "Why Choose Us", href: "#benefits" },
              { label: "Reviews", href: "#social-proof" },
              { label: "Contact", href: "#contact" }
            ]
          },
          {
            title: "Support",            items: [
              { label: "Get a Quote", href: "#contact-form" },
              { label: "FAQ", href: "#" },
              { label: "Warranty Info", href: "#" },
              { label: "Privacy Policy", href: "#" }
            ]
          }
        ]}
        copyrightText="© 2025 ProServe Local Services | Licensed & Insured | Available 24/7"
        ariaLabel="Footer section"
      />
    </ThemeProvider>
  );
}