"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-bubble"
        defaultTextAnimation="entrance-slide"
        borderRadius="soft"
        contentWidth="medium"
        sizing="largeSmallSizeMediumTitles"
        background="fluid"
        cardStyle="subtle-shadow"
        primaryButtonStyle="flat"
        secondaryButtonStyle="layered"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "Home",          id: "/"},
        {
          name: "Services",          id: "/services"},
        {
          name: "About Us",          id: "/about"},
        {
          name: "Reviews",          id: "/reviews"},
        {
          name: "Areas",          id: "/service-areas"},
        {
          name: "Contact",          id: "/contact"},
      ]}
      logoSrc="http://img.b2bpic.net/free-vector/eagle-logo-icon-heraldic-style_126523-770.jpg"
      logoAlt="Eagle Towing Company Logo"
      brandName="Eagle Towing"
      button={{
        text: "Call Now: (314) 123-4567",        href: "tel:+13141234567"}}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardRotatedCarousel
      background={{
        variant: "rotated-rays-animated-grid"}}
      title="24/7 Emergency Towing in St. Louis"
      description="Fast, reliable, and professional roadside assistance across St. Louis & surrounding areas. Your trusted partner for breakdowns, accidents, and more. Call now for immediate help!"
      buttons={[
        {
          text: "Call Now (314) 123-4567",          href: "tel:+13141234567"},
        {
          text: "Get an Instant Quote",          href: "/contact#quote"},
      ]}
      carouselItems={[
        {
          id: "carousel-item-1",          imageSrc: "http://img.b2bpic.net/free-photo/man-sitting-car-night_23-2149001284.jpg?_wi=1",          imageAlt: "Heavy-duty tow truck with flashing lights at night"},
        {
          id: "carousel-item-2",          imageSrc: "http://img.b2bpic.net/free-photo/road-closed-sign-city_23-2149338565.jpg",          imageAlt: "Tow truck recovering a broken down car on a highway"},
        {
          id: "carousel-item-3",          imageSrc: "http://img.b2bpic.net/free-photo/just-married-couple-with-their-car_23-2149479889.jpg",          imageAlt: "Tow truck in front of the St. Louis Arch"},
        {
          id: "carousel-item-4",          imageSrc: "http://img.b2bpic.net/free-photo/young-black-car-mechanic-using-computer-with-his-manager-auto-repair-shop_637285-4243.jpg",          imageAlt: "Tow truck driver jump-starting a car"},
        {
          id: "carousel-item-5",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-changing-tire_23-2148258062.jpg",          imageAlt: "Flatbed tow truck hauling a luxury car"},
        {
          id: "carousel-item-6",          imageSrc: "http://img.b2bpic.net/free-photo/sad-young-woman-sitting-near-broken-down-car-road_23-2147855644.jpg",          imageAlt: "Roadside assistance changing a flat tire"},
      ]}
      autoPlay={true}
      autoPlayInterval={5000}
    />
  </div>

  <div id="trust-badges" data-section="trust-badges">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={true}
      names={[
        "Google 5-Star Rated",        "BBB Accredited",        "24/7 Service",        "Local Favorite",        "Licensed & Insured",        "Fast Response",        "Honest Pricing"]}
      title="Trusted Across St. Louis"
      description="Our commitment to excellence and customer satisfaction has earned us the trust of thousands."
      showCard={false}
    />
  </div>

  <div id="why-choose-us" data-section="why-choose-us">
      <FeatureCardTwelve
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          id: "f-speed",          label: "Speed & Efficiency",          title: "Rapid Response Times",          items: [
            "Average 15-30 minute arrival in St. Louis",            "Advanced dispatch system for quickest routes",            "Minimize your wait, maximize your safety"],
        },
        {
          id: "f-reliability",          label: "Unmatched Reliability",          title: "Service You Can Depend On",          items: [
            "Modern, well-maintained fleet of tow trucks",            "Experienced and certified towing professionals",            "Damage-free towing is our guarantee"],
        },
        {
          id: "f-professionalism",          label: "True Professionalism",          title: "Courteous & Capable Team",          items: [
            "Uniformed, respectful drivers ready to help",            "Comprehensive training for all emergency situations",            "Handle your vehicle with utmost care and precision"],
        },
        {
          id: "f-24-7",          label: "Always Available",          title: "24/7 Emergency Service",          items: [
            "We operate around the clock, 365 days a year",            "Day or night, rain or shine, we're here for you",            "Immediate assistance for any roadside emergency"],
        },
        {
          id: "f-local",          label: "Locally Owned & Operated",          title: "Proudly Serving St. Louis",          items: [
            "Deep roots in the St. Louis community",            "Knowledge of local roads and traffic patterns",            "Committed to supporting our neighbors"],
        },
        {
          id: "f-pricing",          label: "Transparent Pricing",          title: "No Hidden Fees, Honest Quotes",          items: [
            "Upfront, competitive rates with no surprises",            "Clear explanations of all service charges",            "Value-driven solutions for every budget"],
        },
      ]}
      title="Why Choose Eagle Towing?"
      description="We are St. Louis's premier towing company, dedicated to providing unparalleled service when you need it most. Experience the difference of true professionalism."
    />
  </div>

  <div id="customer-reviews" data-section="customer-reviews">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={true}
      testimonials={[
        {
          id: "t1",          name: "Sarah J.",          date: "2 days ago",          title: "Lifesavers!",          quote: "My car broke down on I-64 late at night, and Eagle Towing was there in less than 20 minutes. The driver was so professional and kind. Highly recommend their emergency towing service!",          tag: "Emergency Tow",          avatarSrc: "http://img.b2bpic.net/free-photo/authentic-small-youthful-marketing-agency_23-2150167349.jpg",          avatarAlt: "Sarah J. customer review",          imageSrc: "http://img.b2bpic.net/free-photo/man-woman-enjoying-takeaway-food-street_23-2149025841.jpg",          imageAlt: "Car being towed at night"},
        {
          id: "t2",          name: "Mark D.",          date: "1 week ago",          title: "Fast Jump Start",          quote: "Had a dead battery in my driveway. Called Eagle Towing, and they sent someone out right away for a jump start. Very quick, very efficient, and got me back on the road.",          tag: "Battery Service",          avatarSrc: "http://img.b2bpic.net/free-photo/close-up-successful-woman-with-blue-shirt_1098-3627.jpg",          avatarAlt: "Mark D. customer review",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-with-hot-beverage_23-2149270168.jpg",          imageAlt: "Jump start service"},
        {
          id: "t3",          name: "Emily R.",          date: "3 weeks ago",          title: "Professional Accident Recovery",          quote: "Unfortunately, I was in an accident. Eagle Towing handled the recovery with such care and professionalism. They made a stressful situation much easier to manage. Thank you!",          tag: "Accident Recovery",          avatarSrc: "http://img.b2bpic.net/free-photo/businessman-wearing-coat_1098-3778.jpg",          avatarAlt: "Emily R. customer review",          imageSrc: "http://img.b2bpic.net/free-photo/mechanics-repairing-car-workshop_329181-11786.jpg",          imageAlt: "Accident recovery scene"},
        {
          id: "t4",          name: "David K.",          date: "1 month ago",          title: "Excellent Motorcycle Tow",          quote: "Needed my motorcycle towed after a mechanical issue. Eagle Towing arrived with a flatbed and secured it perfectly. Great service, truly specialized care.",          tag: "Motorcycle Tow",          avatarSrc: "http://img.b2bpic.net/free-photo/close-up-woman-wearing-glasses_23-2148815602.jpg",          avatarAlt: "David K. customer review",          imageSrc: "http://img.b2bpic.net/free-photo/emergency-auto-mechanic-changing-flat-tire-road_651396-3559.jpg",          imageAlt: "Motorcycle being towed"},
        {
          id: "t5",          name: "Lisa M.",          date: "2 months ago",          title: "Timely Fuel Delivery",          quote: "Ran out of gas on my way to work! Eagle Towing brought me fuel very quickly. They saved my day! Fantastic roadside assistance.",          tag: "Fuel Delivery",          avatarSrc: "http://img.b2bpic.net/free-photo/portrait-older-man-outdoors-city-with-earbuds_23-2149007057.jpg",          avatarAlt: "Lisa M. customer review",          imageSrc: "http://img.b2bpic.net/free-photo/man-watching-out-car-window-how-woman-filling-up-car_23-2148150080.jpg",          imageAlt: "Fuel delivery service"},
      ]}
      title="Our Customers Say It Best"
      description="Read what St. Louis drivers have to say about Eagle Towing's fast, professional, and reliable service."
    />
  </div>

  <div id="our-services-overview" data-section="our-services-overview">
      <ProductCardFour
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="two-columns-alternating-heights"
      useInvertedBackground={false}
      products={[
        {
          id: "p-local-tow",          name: "Local Towing",          price: "Starting at $75",          variant: "Quick & Efficient",          imageSrc: "http://img.b2bpic.net/free-photo/person-preparing-get-driver-license_23-2150167600.jpg",          imageAlt: "Tow truck in St. Louis city"},
        {
          id: "p-long-distance-tow",          name: "Long Distance Towing",          price: "Custom Quote",          variant: "Reliable & Secure",          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-cars-road-blue-sky_181624-27314.jpg",          imageAlt: "Flatbed tow truck on open highway"},
        {
          id: "p-roadside",          name: "Roadside Assistance",          price: "From $65",          variant: "24/7 Support",          imageSrc: "http://img.b2bpic.net/free-photo/man-unscrews-bolts-wheel_1153-4391.jpg",          imageAlt: "Technician helping stranded motorist"},
        {
          id: "p-battery",          name: "Battery Service",          price: "From $55",          variant: "Jump Starts & Replacements",          imageSrc: "http://img.b2bpic.net/free-photo/blue-cell-phone-connected-usb-cable-type-c-charging_58702-4541.jpg",          imageAlt: "Car battery with jump cables"},
        {
          id: "p-lockouts",          name: "Vehicle Lockouts",          price: "Flat Rate $80",          variant: "Fast Entry",          imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-working-as-valet_23-2150320985.jpg",          imageAlt: "Car with keys locked inside"},
        {
          id: "p-accident",          name: "Accident Recovery",          price: "Call for Quote",          variant: "Safe & Professional",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-plus-size-woman-working-construction_23-2150772866.jpg",          imageAlt: "Accident scene with tow truck"},
      ]}
      title="Comprehensive Towing & Roadside Services"
      description="From emergency breakdowns to planned vehicle transport, Eagle Towing offers a full spectrum of services designed to get you back on track safely and efficiently."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitText
      useInvertedBackground={true}
      faqs={[
        {
          id: "faq1",          title: "How quickly can you arrive?",          content: "Our average response time in St. Louis and surrounding areas is 15-30 minutes, depending on your location and current traffic conditions. We prioritize emergency calls."},
        {
          id: "faq2",          title: "Do you offer 24/7 service?",          content: "Yes, Eagle Towing operates 24 hours a day, 7 days a week, 365 days a year. We are always available for emergency towing and roadside assistance."},
        {
          id: "faq3",          title: "What payment methods do you accept?",          content: "We accept all major credit cards (Visa, Mastercard, Amex, Discover) and cash. Payment is due upon service completion. We also work with many insurance providers."},
        {
          id: "faq4",          title: "Can you tow my car if it's in an accident?",          content: "Absolutely. We specialize in accident recovery and safely towing vehicles from accident scenes. Our team is trained to handle these sensitive situations with care."},
        {
          id: "faq5",          title: "Do you offer flatbed towing?",          content: "Yes, we provide flatbed towing for all types of vehicles, including luxury cars, classic cars, motorcycles, and vehicles that cannot be safely towed with a wheel-lift system."},
      ]}
      sideTitle="Frequently Asked Questions"
      sideDescription="Find quick answers to common questions about our towing and roadside assistance services in St. Louis."
      buttons={[
        {
          text: "Call for Emergency Help",          href: "tel:+13141234567"},
      ]}
      faqsAnimation="slide-up"
      textPosition="left"
      className="py-16 md:py-24 lg:py-32"
      contentClassName="flex flex-col md:flex-row gap-8 md:gap-12 lg:gap-16"
      textContainerClassName="md:w-1/2 lg:w-2/5"
      faqsContainerClassName="md:w-1/2 lg:w-3/5"
      accordionClassName="border border-border-color rounded-lg p-4 mb-4"
    />
  </div>

  <div id="contact-cta" data-section="contact-cta">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Need Immediate Towing? Get an Instant Quote!"
      description="Don't wait! Our team is ready 24/7 to provide fast, professional towing and roadside assistance. Fill out the form or call us directly for rapid service."
      inputs={[
        {
          name: "name",          type: "text",          placeholder: "Your Full Name",          required: true,
        },
        {
          name: "phone",          type: "tel",          placeholder: "Phone Number",          required: true,
        },
        {
          name: "location",          type: "text",          placeholder: "Current Location (Address or Landmark)",          required: true,
        },
        {
          name: "vehicleType",          type: "text",          placeholder: "Vehicle Make & Model (e.g., Ford F-150)",          required: false,
        },
      ]}
      textarea={{
        name: "issueDescription",        placeholder: "Briefly describe your situation (e.g., flat tire, accident, dead battery)",        rows: 3,
        required: true,
      }}
      imageSrc="http://img.b2bpic.net/free-photo/emergency-ambulance-vehicle-healthcare-icon-word_53876-120173.jpg"
      imageAlt="Emergency contact person making a phone call"
      mediaAnimation="opacity"
      mediaPosition="right"
      buttonText="Request Immediate Tow"
      className="py-16 md:py-24 lg:py-32"
      containerClassName="px-4 md:px-6 lg:px-8"
      contentClassName="gap-8 md:gap-12 lg:gap-16 items-center"
      formCardClassName="p-6 md:p-8 lg:p-10 rounded-lg shadow-lg"
      titleClassName="text-center md:text-left"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      logoSrc="http://img.b2bpic.net/free-vector/eagle-logo-icon-heraldic-style_126523-770.jpg"
      logoAlt="Eagle Towing Logo"
      columns={[
        {
          items: [
            {
              label: "Home",              href: "/"},
            {
              label: "Services",              href: "/services"},
            {
              label: "About Us",              href: "/about"},
            {
              label: "Reviews",              href: "/reviews"},
          ],
        },
        {
          items: [
            {
              label: "Service Areas",              href: "/service-areas"},
            {
              label: "Contact Us",              href: "/contact"},
            {
              label: "Get a Quote",              href: "/contact#quote"},
            {
              label: "Privacy Policy",              href: "#"},
          ],
        },
        {
          items: [
            {
              label: "Call 24/7",              href: "tel:+13141234567"},
            {
              label: "Email: info@eagletowingstl.com",              href: "mailto:info@eagletowingstl.com"},
            {
              label: "St. Louis, MO",              href: "/service-areas#st-louis"},
            {
              label: "Facebook",              href: "https://facebook.com/eagletowing"},
          ],
        },
      ]}
      logoText="Eagle Towing - St. Louis's most trusted 24/7 roadside partner."
      className="py-16 md:py-20 lg:py-24 border-t border-border-color bg-background-accent"
      containerClassName="gap-8 md:gap-12 lg:gap-16"
      logoClassName="pb-8 md:pb-0"
      columnsClassName="grid grid-cols-1 md:grid-cols-3 gap-8 md:gap-12"
      columnClassName="flex flex-col gap-3"
      itemClassName="text-foreground/80 hover:text-primary-cta transition-colors duration-200"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
