"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import HeroLogoBillboardSplit from "@/components/sections/hero/HeroLogoBillboardSplit";
import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
import FeatureBorderGlow from "@/components/sections/feature/featureBorderGlow/FeatureBorderGlow";
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
import FaqBase from "@/components/sections/faq/FaqBase";
import ContactCenter from "@/components/sections/contact/ContactCenter";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import { Award, Calendar, CheckCircle, Clock, Heart, HelpCircle, Home, Leaf, Mail, Shield, Smartphone, Star, Target, TrendingUp, Zap } from "lucide-react";

export default function Page() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="smallMedium"
      sizing="mediumLargeSizeLargeTitles"
      background="noiseDiagonalGradient"
      cardStyle="outline"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="45 Lawn Care"
          navItems={[
            { name: "Features", id: "features" },
            { name: "About", id: "about" },
            { name: "Testimonials", id: "testimonials" },
            { name: "FAQ", id: "faq" }
          ]}
          button={{
            text: "Get Started",            href: "#contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboardSplit
          logoText="45 Lawn Care"
          description="Intelligent robotic mowers for flawless lawns. From residential yards to expansive commercial properties, our cutting-edge autonomous technology delivers precision, efficiency, and reliability every time."
          background={{ variant: "noiseDiagonalGradient" }}
          buttons={[
            { text: "Schedule Service", href: "#contact" },
            { text: "Learn More", href: "#features" }
          ]}
          buttonAnimation="slide-up"
          layoutOrder="default"
          imageSrc="http://img.b2bpic.net/free-photo/woman-pruning-bushes-smiling-camera_651396-3821.jpg"
          imageAlt="45 Lawn Care robotic mower in action"
          mediaAnimation="opacity"
          frameStyle="card"
        />
      </div>

      <div id="about" data-section="about">
        <MetricSplitMediaAbout
          title="Precision Lawn Care Technology"
          description="45 Lawn Care pioneers autonomous lawn maintenance for homeowners and businesses. Our robotic mowers combine advanced sensors, AI-driven precision, and eco-friendly performance to transform how properties are maintained. Whether it's your backyard oasis or a sprawling commercial campus, our fleet works tirelessly to deliver immaculate results."
          tag="Innovation Driven"
          tagIcon={Zap}
          tagAnimation="slide-up"
          metrics={[
            { value: "99%", title: "Accuracy" },
            { value: "24/7", title: "Operation" },
            { value: "50%", title: "Labor Savings" }
          ]}
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-photo/rural-lifestyle-concept-with-lawn-mower_23-2149382223.jpg"
          imageAlt="Advanced robotic mower technology"
          mediaAnimation="blur-reveal"
          metricsAnimation="slide-up"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureBorderGlow
          title="Why Choose 45 Lawn Care"
          description="Our robotic mowers deliver unmatched benefits for any property size."
          tag="Advanced Features"
          tagIcon={CheckCircle}
          tagAnimation="fade"
          features={[
            {
              icon: Zap,
              title: "Autonomous Operation",              description: "Set it and forget it. Our robotic mowers operate independently, mowing on your schedule, rain or shine."
            },
            {
              icon: Target,
              title: "Precision Cutting",              description: "Millimeter-accurate blade positioning ensures perfectly manicured lawns without scalping or uneven patches."
            },
            {
              icon: Leaf,
              title: "Eco-Friendly",              description: "Zero emissions, whisper-quiet operation, and mulching capabilities create healthier, greener lawns."
            },
            {
              icon: Shield,
              title: "Smart Safety",              description: "Advanced sensors detect obstacles, pets, and people, automatically pausing for complete peace of mind."
            },
            {
              icon: Smartphone,
              title: "App Control",              description: "Monitor and manage your mower remotely via our intuitive mobile app with real-time status updates."
            },
            {
              icon: TrendingUp,
              title: "Scalable Solutions",              description: "From 1/4 acre residential lots to multi-acre commercial grounds, we scale our service to fit your needs."
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          buttons={[
            { text: "Schedule Demo", href: "#contact" }
          ]}
          buttonAnimation="opacity"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardOne
          title="Results That Speak for Themselves"
          description="45 Lawn Care has transformed lawn maintenance for hundreds of satisfied customers across residential and commercial sectors."
          tag="Proven Results"
          tagIcon={Award}
          tagAnimation="slide-up"
          metrics={[
            {
              id: "1",              value: "500+",              title: "Properties Served",              description: "From small residential yards to large commercial complexes",              icon: Home
            },
            {
              id: "2",              value: "15,000+",              title: "Hours Saved",              description: "Annual labor hours eliminated through automation",              icon: Clock
            },
            {
              id: "3",              value: "98%",              title: "Customer Satisfaction",              description: "Consistent 5-star ratings from our client base",              icon: Star
            },
            {
              id: "4",              value: "365",              title: "Days of Service",              description: "Year-round maintenance schedules available",              icon: Calendar
            }
          ]}
          animationType="slide-up"
          gridVariant="uniform-all-items-equal"
          uniformGridCustomHeightClasses="min-h-75 2xl:min-h-85"
          textboxLayout="default"
          useInvertedBackground={false}
          buttons={[
            { text: "View Case Studies", href: "#testimonials" }
          ]}
          buttonAnimation="opacity"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwelve
          testimonials={[
            {
              id: "1",              name: "Sarah Mitchell",              imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-caucasian-happy-teacher-glasses_74855-9736.jpg",              imageAlt: "Sarah Mitchell, Homeowner"
            },
            {
              id: "2",              name: "James Rodriguez",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-businesswoman-her-employees-background_1262-20305.jpg",              imageAlt: "James Rodriguez, Property Manager"
            },
            {
              id: "3",              name: "Emily Chen",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-bald-senior-dressed-stylish-suit-posing-against-dark-background_613910-17578.jpg",              imageAlt: "Emily Chen, Landscape Director"
            },
            {
              id: "4",              name: "Michael Thompson",              imageSrc: "http://img.b2bpic.net/free-photo/blond-businessman-happy-expression_1194-3666.jpg",              imageAlt: "Michael Thompson, Commercial Client"
            }
          ]}
          cardTitle="Our lawn has never looked better. The 45 robotic mowers work flawlessly, and the savings are incredible."
          cardTag="Trusted by hundreds of satisfied clients"
          cardTagIcon={Heart}
          cardAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="Frequently Asked Questions"
          description="Find answers to common questions about our robotic mower service and how it works."
          tag="Support"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          faqs={[
            {
              id: "1",              title: "How do robotic mowers handle different lawn sizes?",              content: "Our fleet scales from compact models perfect for residential properties (up to 1 acre) to heavy-duty units designed for commercial grounds exceeding 10 acres. We assess your property and deploy the optimal solution for your space and maintenance schedule."
            },
            {
              id: "2",              title: "What happens in bad weather or rain?",              content: "45 Lawn Care mowers are equipped with weather sensors that automatically detect rain and return to their charging dock. They resume mowing once conditions improve, ensuring consistent maintenance without damage to wet grass."
            },
            {
              id: "3",              title: "Is the robotic mower safe for pets and children?",              content: "Yes. Our mowers feature advanced obstacle detection and automatic emergency stops. They use soft bumpers and have a 65dB noise level—quieter than traditional mowers—making them safe and family-friendly."
            },
            {
              id: "4",              title: "How is the mower controlled and monitored?",              content: "Every 45 Lawn Care mower is managed through our mobile app, giving you real-time status, scheduling control, and service notifications. You can also reach our support team 24/7 for any questions or adjustments."
            },
            {
              id: "5",              title: "What's included in your maintenance service?",              content: "Our service includes regular blade sharpening, sensor calibration, battery health checks, and seasonal tune-ups. We handle all upkeep so your mower runs optimally year-round with zero hassle."
            },
            {
              id: "6",              title: "Can I cancel or pause my service?",              content: "Absolutely. We offer flexible month-to-month contracts with no long-term commitment. You can pause service seasonally or cancel anytime with 30 days notice."
            }
          ]}
          faqsAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="smooth"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Ready to Transform Your Lawn?"
          title="Schedule Your Free Consultation"
          description="Let's discuss how 45 Lawn Care's robotic mowing solutions can save you time, money, and effort while delivering a pristine lawn year-round."
          tagIcon={Mail}
          tagAnimation="slide-up"
          background={{ variant: "radial-gradient" }}
          useInvertedBackground={false}
          inputPlaceholder="Enter your email address"
          buttonText="Get Started"
          termsText="By signing up, you agree to our Terms of Service and Privacy Policy."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="45 Lawn Care"
          leftLink={{
            text: "Privacy Policy",            href: "#"
          }}
          rightLink={{
            text: "Contact Us",            href: "#contact"
          }}
        />
      </div>
    </ThemeProvider>
  );
}
