"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Sparkles, CheckCircle, Award, Star, Facebook, Instagram, Phone } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="medium"
      sizing="medium"
      background="none"
      cardStyle="solid"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="solid"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Mobile One"
          navItems={[
            { name: "Services", id: "services" },
            { name: "About", id: "about" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Get Quote",            href: "contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCarouselLogo
          logoText="MOBILE ONE"
          description="Professional car detailing comes to your driveway. Premium hand wash, polish, and protection services on your schedule."
          buttons={[
            { text: "Book Service", href: "contact" },
            { text: "Learn More", href: "about" }
          ]}
          slides={[
            {
              imageSrc: "https://img.b2bpic.net/free-photo/mid-adult-mechanic-examining-vehicle-hood-while-working-auto-repair-shop_637285-7664.jpg",              imageAlt: "Professional car detailing service"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/car-wash-detailing-station_1303-22299.jpg",              imageAlt: "Expert car polishing and shine"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/man-car-clean-using-brush-clean-up-all-details-inside-vehicle_1303-30586.jpg",              imageAlt: "Mobile detailing at your location"
            }
          ]}
          autoplayDelay={5000}
          showDimOverlay={true}
        />
      </div>

      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            { type: "text", content: "Expert detailing with" },
            {
              type: "image",              src: "https://img.b2bpic.net/free-photo/young-black-car-mechanic-using-computer-with-his-manager-auto-repair-shop_637285-4243.jpg",              alt: "Mobile One detailing team"
            },
            { type: "text", content: "professional results" }
          ]}
          useInvertedBackground={false}
          buttons={[
            { text: "View Services", href: "services" }
          ]}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardOne
          title="Our Services"
          description="Complete detailing solutions tailored to your vehicle's needs"
          tag="What We Offer"
          tagIcon={Sparkles}
          textboxLayout="default"
          animationType="slide-up"
          features={[
            {
              title: "Exterior Detailing",              description: "Professional wash, clay bar treatment, and premium wax application to protect your paint and enhance shine.",              imageSrc: "https://img.b2bpic.net/free-photo/man-car-clean-vacuuming-car-inside_1303-30580.jpg",              imageAlt: "Exterior detailing service"
            },
            {
              title: "Interior Detailing",              description: "Deep clean of upholstery, carpets, and trim. Vacuum, shampoo, and conditioning for a fresh interior.",              imageSrc: "https://img.b2bpic.net/free-photo/man-polishing-car-with-orbital-applicator_1303-30576.jpg",              imageAlt: "Interior detailing service"
            },
            {
              title: "Paint Protection",              description: "Ceramic coating and paint sealant application for long-lasting protection against elements and UV damage.",              imageSrc: "https://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2002.jpg",              imageAlt: "Paint protection and ceramic coating"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          useInvertedBackground={false}
        />
      </div>

      <div id="process" data-section="process">
        <FeatureCardNine
          title="Our Process"
          description="Simple, convenient, and professional service delivery"
          tag="How It Works"
          tagIcon={CheckCircle}
          textboxLayout="default"
          animationType="slide-up"
          showStepNumbers={true}
          features={[
            {
              id: 1,
              title: "Easy Scheduling",              description: "Contact us or book online. We come to your location at your preferred time.",              phoneOne: {
                imageSrc: "https://img.b2bpic.net/free-photo/top-view-hand-holding-phone-with-menu_23-2149357871.jpg"
              },
              phoneTwo: {
                imageSrc: "https://img.b2bpic.net/free-photo/man-car-clean-using-brush-clean-up-all-details-inside-vehicle_1303-30584.jpg"
              }
            },
            {
              id: 2,
              title: "Professional Service",              description: "Our experienced team delivers premium detailing with attention to every detail of your vehicle.",              phoneOne: {
                imageSrc: "https://img.b2bpic.net/free-photo/man-car-clean-vacuuming-car-inside_1303-30580.jpg"
              },
              phoneTwo: {
                imageSrc: "https://img.b2bpic.net/free-photo/man-polishing-car-with-orbital-applicator_1303-30576.jpg"
              }
            }
          ]}
          useInvertedBackground={false}
        />
      </div>

      <div id="benefits" data-section="benefits">
        <FeatureCardMedia
          title="Why Choose Mobile One"
          description="Convenience, quality, and professionalism in every service"
          tag="Benefits"
          tagIcon={Award}
          textboxLayout="default"
          animationType="blur-reveal"
          features={[
            {
              id: "1",              title: "Time Saving",              description: "We come to you. No need to drive to a facility. Schedule at your convenience.",              tag: "Convenience",              imageSrc: "https://img.b2bpic.net/free-photo/plumber-holding-clock_1368-6309.jpg",              imageAlt: "Time saving service"
            },
            {
              id: "2",              title: "Premium Quality",              description: "Hand-applied techniques with professional-grade products for showroom-quality results.",              tag: "Excellence",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193171.jpg",              imageAlt: "Premium quality detailing"
            },
            {
              id: "3",              title: "Eco-Friendly",              description: "Water-efficient processes and biodegradable products that are gentle on your vehicle and the environment.",              tag: "Sustainable",              imageSrc: "https://img.b2bpic.net/free-photo/man-collecting-plastic-garbage-polluted-park_1268-20261.jpg",              imageAlt: "Eco-friendly detailing practices"
            }
          ]}
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive
          title="What Our Customers Say"
          description="Real feedback from satisfied clients in our community"
          tag="Testimonials"
          tagIcon={Star}
          textboxLayout="default"
          testimonials={[
            {
              id: "1",              name: "Marcus Johnson, Local Business Owner",              date: "Date: November 2024",              title: "Best detail service in town",              quote: "Mobile One came to my driveway and transformed my car. The attention to detail is incredible. They used premium products and my paint looks better than when I bought it. Highly recommend!",              tag: "Executive Package",              avatarSrc: "https://img.b2bpic.net/free-photo/smiling-businessman-face-portrait-wearing-suit_53876-148135.jpg",              avatarAlt: "Marcus Johnson",              imageSrc: "https://img.b2bpic.net/free-photo/man-working-car-detailing-coating-car_1303-30596.jpg",              imageAlt: "Marcus's detailed vehicle"
            },
            {
              id: "2",              name: "Sarah Mitchell, Real Estate Agent",              date: "Date: October 2024",              title: "Professional and punctual",              quote: "I have them detail my cars before client showings. They always arrive on time, do exceptional work, and my vehicles shine. Their professionalism is matched only by their quality.",              tag: "Premium Package",              avatarSrc: "https://img.b2bpic.net/free-photo/confident-european-businessman-smiling-closeup-portrait-jobs-career-campaign_53876-128975.jpg",              avatarAlt: "Sarah Mitchell",              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-car-interior-clean-up-service_23-2149212253.jpg",              imageAlt: "Sarah's pristine vehicle"
            },
            {
              id: "3",              name: "David Chen, Luxury Car Collector",              date: "Date: October 2024",              title: "They understand fine finishes",              quote: "For my collection, I need detailers who understand paint care at the highest level. Mobile One delivered exactly that. Ceramic coating application was flawless.",              tag: "Ceramic Coating",              avatarSrc: "https://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5367.jpg",              avatarAlt: "David Chen",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-person-cleaning-car-exterior_23-2148194141.jpg",              imageAlt: "David's luxury vehicle finish"
            },
            {
              id: "4",              name: "Jennifer Rodriguez, Marketing Manager",              date: "Date: September 2024",              title: "Convenience and quality combined",              quote: "They came to my office parking lot and detailed my car during lunch. By afternoon pickup, it looked brand new inside and out. This is professional service done right.",              tag: "Full Detail Package",              avatarSrc: "https://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg",              avatarAlt: "Jennifer Rodriguez",              imageSrc: "https://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2004.jpg",              imageAlt: "Jennifer's freshly detailed interior"
            }
          ]}
          useInvertedBackground={false}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Schedule Your Detail Service"
          description="Get in touch with Mobile One Detailing. Fill out the form below and we'll contact you within 24 hours to confirm your appointment."
          inputs={[
            { name: "name", type: "text", placeholder: "Your Name", required: true },
            { name: "email", type: "email", placeholder: "Email Address", required: true },
            { name: "phone", type: "tel", placeholder: "Phone Number", required: true },
            { name: "vehicle", type: "text", placeholder: "Vehicle Make & Model", required: true }
          ]}
          textarea={{
            name: "message",            placeholder: "Tell us about your vehicle and service needs...",            rows: 5,
            required: true
          }}
          useInvertedBackground={false}
          imageSrc="https://img.b2bpic.net/free-photo/man-car-clean-vacuuming-car-inside_1303-30580.jpg"
          imageAlt="Professional car detailing"
          mediaPosition="right"
          mediaAnimation="fade-in"
          buttonText="Request Quote"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="Mobile One Detailing"
          copyrightText="© 2025 Mobile One Detailing | Professional Auto Care"
          socialLinks={[
            { icon: Facebook, href: "https://facebook.com/mobileonedetailing", ariaLabel: "Facebook" },
            { icon: Instagram, href: "https://instagram.com/mobileonedetailing", ariaLabel: "Instagram" },
            { icon: Phone, href: "tel:+1-555-0123", ariaLabel: "Call us" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}