"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import HeroLogoBillboardSplit from "@/components/sections/hero/HeroLogoBillboardSplit";
import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
import FeatureBento from "@/components/sections/feature/FeatureBento";
import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import ContactCTA from "@/components/sections/contact/ContactCTA";
import FaqBase from "@/components/sections/faq/FaqBase";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import {
  Shield,
  Sparkles,
  Heart,
  Award,
  Phone,
  HelpCircle,
  Axe,
  Zap,
  CheckCircle,
  Leaf,
  Eye,
  AlertTriangle,
  Hammer,
  Square,
} from "lucide-react";

export default function HomePage() {
  const navItems = [
    { name: "Home", id: "home" },
    { name: "Services", id: "services" },
    { name: "About", id: "about" },
    { name: "Reviews", id: "reviews" },
    { name: "Contact", id: "contact" },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="mediumLarge"
      sizing="largeSizeMediumTitles"
      background="noiseDiagonalGradient"
      cardStyle="soft-shadow"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          navItems={navItems}
          brandName="A-1 Discount Tree & Lawn"
          button={{
            text: "Call Now",
            href: "tel:+1-800-TREE-911",
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboardSplit
          logoText="A-1 Discount Tree & Lawn Service"
          description="Fast, professional tree removal and lawn care you can trust — 24/7 emergency service available now. Same-day estimates and fully cleaned job sites guaranteed."
          background={{ variant: "plain" }}
          buttons={[
            {
              text: "Call Now (24/7)",
              href: "tel:+1-800-TREE-911",
            },
            {
              text: "Request Free Estimate",
              href: "#contact",
            },
          ]}
          buttonAnimation="slide-up"
          layoutOrder="default"
          imageSrc="http://img.b2bpic.net/free-photo/crop-woman-adjusting-waist-bag_23-2147714892.jpg?_wi=1"
          imageAlt="professional tree removal crew working safely"
          mediaAnimation="slide-up"
          frameStyle="card"
          ariaLabel="Hero section with call to action"
        />
      </div>

      <div id="trust" data-section="trust">
        <MetricCardSeven
          title="Trusted by Thousands of Homeowners"
          description="Our proven track record speaks for itself. Join thousands of satisfied customers who trust A-1 for their tree and lawn needs."
          metrics={[
            {
              id: "rating",
              value: "4.8★",
              title: "Average Rating",
              items: [
                "150+ verified reviews",
                "Emergency response praised",
                "Cleanup quality rated 5-stars",
              ],
            },
            {
              id: "years",
              value: "25+",
              title: "Years of Experience",
              items: [
                "Family-owned local business",
                "Fully licensed & insured",
                "Insurance-recommended vendor",
              ],
            },
            {
              id: "response",
              value: "30 min",
              title: "Average Response Time",
              items: [
                "24/7 emergency dispatch",
                "Same-day service available",
                "Storm damage specialists",
              ],
            },
            {
              id: "cleanup",
              value: "100%",
              title: "Cleanup Guarantee",
              items: [
                "Complete debris removal",
                "Yard restored to original state",
                "No hidden fees or surprises",
              ],
            },
          ]}
          tag="Trust Signals"
          tagIcon={Shield}
          tagAnimation="slide-up"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="services" data-section="services">
        <FeatureBento
          title="Complete Tree & Lawn Services"
          description="Professional solutions for every tree and lawn challenge — from routine maintenance to emergency storm response."
          tag="Our Services"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          features={[
            {
              title: "Tree Removal",
              description:
                "Safe, efficient removal of dead, diseased, or unwanted trees of any size. Complete stump grinding available.",
              bentoComponent: "icon-info-cards",
              items: [
                {
                  icon: Axe,
                  label: "Large Trees",
                  value: "Up to 100ft",
                },
                {
                  icon: Zap,
                  label: "Fast Service",
                  value: "Same-day available",
                },
                {
                  icon: CheckCircle,
                  label: "Fully Cleaned",
                  value: "Zero debris left",
                },
              ],
              button: {
                text: "Learn More",
                href: "/services#removal",
              },
            },
            {
              title: "Tree Trimming & Pruning",
              description:
                "Expert pruning to improve health, appearance, and safety. Disease prevention and shape maintenance.",
              bentoComponent: "icon-info-cards",
              items: [
                {
                  icon: Leaf,
                  label: "Health Focus",
                  value: "Disease prevention",
                },
                {
                  icon: Eye,
                  label: "Aesthetic",
                  value: "Perfect shape",
                },
                {
                  icon: Shield,
                  label: "Safety",
                  value: "Remove hazards",
                },
              ],
              button: {
                text: "Learn More",
                href: "/services#trimming",
              },
            },
            {
              title: "Stump Grinding",
              description:
                "Complete stump removal below ground level. Allows replanting or repurposing your yard space.",
              bentoComponent: "icon-info-cards",
              items: [
                {
                  icon: Hammer,
                  label: "Deep Removal",
                  value: "Below grade",
                },
                {
                  icon: Square,
                  label: "Space Recovery",
                  value: "Reuse your yard",
                },
                {
                  icon: Zap,
                  label: "Quick Work",
                  value: "1-2 hours typical",
                },
              ],
              button: {
                text: "Learn More",
                href: "/services#stump",
              },
            },
            {
              title: "Storm Damage Response",
              description:
                "Emergency response to fallen trees, branch damage, and storm cleanup. Available 24/7 for urgent situations.",
              bentoComponent: "icon-info-cards",
              items: [
                {
                  icon: AlertTriangle,
                  label: "24/7 Available",
                  value: "Emergency dispatch",
                },
                {
                  icon: Zap,
                  label: "Fast Response",
                  value: "30-min average",
                },
                {
                  icon: Shield,
                  label: "Insurance Ready",
                  value: "Claim support",
                },
              ],
              button: {
                text: "Emergency Call",
                href: "tel:+1-800-TREE-911",
              },
            },
          ]}
        />
      </div>

      <div id="why-choose" data-section="why-choose">
        <MetricSplitMediaAbout
          title="Why Choose A-1 Discount Tree & Lawn?"
          description="We're not just another tree service. We're your trusted local partner committed to safety, quality, and fair pricing. Every job is treated like we're working on our own home."
          tag="Our Commitment"
          tagIcon={Heart}
          tagAnimation="slide-up"
          metrics={[
            {
              value: "Licensed",
              title: "& Fully Insured",
            },
            {
              value: "Fair",
              title: "Pricing Always",
            },
            {
              value: "24/7",
              title: "Available",
            },
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/men-posing-garden-botanical-greenhouse-photoshoot_53876-133528.jpg?_wi=1"
          imageAlt="professional tree service team group photo"
          mediaAnimation="slide-up"
          metricsAnimation="slide-up"
          useInvertedBackground={true}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="When our 80-foot oak fell across our house during the storm, A-1 was here within 30 minutes. They removed the tree, cleared all debris, and were so professional and respectful of our home. We couldn't believe they finished the same day. Incredible service!"
          rating={5}
          author="Sarah Mitchell & Family"
          avatars={[
            {
              src: "http://img.b2bpic.net/free-photo/portrait-smiling-redhead-female-resting-outdoor_613910-10360.jpg",
              alt: "Sarah Mitchell",
            },
            {
              src: "http://img.b2bpic.net/free-photo/portrait-businessman-conference-room-thinking-about-future_482257-25787.jpg",
              alt: "John Mitchell",
            },
            {
              src: "http://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg",
              alt: "Emily Customer",
            },
            {
              src: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg",
              alt: "David Johnson",
            },
          ]}
          ratingAnimation="slide-up"
          avatarsAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Insurance & Industry Partners"
          description="Trusted by major insurance companies and recommended by property professionals across the region."
          tag="Recommended By"
          tagIcon={Award}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          names={[
            "State Farm Insurance",
            "Allstate Recommended",
            "USAA Approved",
            "Local Realty Association",
            "City Property Mgmt Council",
            "Chamber of Commerce",
            "Home Contractors Board",
          ]}
          logos={[
            "http://img.b2bpic.net/free-vector/green-orange-st-patrick-s-day-badges_23-2147597957.jpg",
            "http://img.b2bpic.net/free-vector/shield-protect-defense-logo-linear-style-security-guardian-modern-heraldic-logo_126523-2747.jpg",
            "http://img.b2bpic.net/free-vector/flat-veterans-day-logo-template_23-2149689176.jpg",
            "http://img.b2bpic.net/free-vector/real-estate-golden-logos-set_1195-26.jpg",
            "http://img.b2bpic.net/free-vector/colorful-geometric-background_1034-407.jpg",
            "http://img.b2bpic.net/free-vector/abstract-hifive-logo-with-tagline_1043-87.jpg",
            "http://img.b2bpic.net/free-vector/open-house-label_23-2148497703.jpg",
          ]}
          speed={40}
          showCard={true}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="contact-cta" data-section="contact-cta">
        <ContactCTA
          tag="Get Started"
          tagIcon={Phone}
          tagAnimation="slide-up"
          title="Free Estimate or Emergency Service?"
          description="Call us now for immediate assistance or to schedule your free tree service estimate. Available 24 hours a day, 7 days a week."
          buttons={[
            {
              text: "Call Now (24/7)",
              href: "tel:+1-800-TREE-911",
            },
            {
              text: "Request Estimate",
              href: "#contact-form",
            },
          ]}
          buttonAnimation="slide-up"
          background={{ variant: "radial-gradient" }}
          useInvertedBackground={true}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="Frequently Asked Questions"
          description="Get answers to common questions about our tree removal, trimming, and lawn services."
          tag="Help & Support"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
          animationType="smooth"
          showCard={true}
          faqs={[
            {
              id: "1",
              title: "How fast can you respond to emergency tree damage?",
              content:
                "We dispatch crews within 30 minutes of your call, 24/7. Our average response time is typically 20-30 minutes for emergency storm damage. Call us immediately at 1-800-TREE-911.",
            },
            {
              id: "2",
              title: "What is included in your cleanup?",
              content:
                "Complete cleanup is always included. We remove all branches, logs, and debris from your property. Your yard is swept clean and restored to its original condition. No surprises.",
            },
            {
              id: "3",
              title: "Do you work with insurance companies?",
              content:
                "Yes, we're an approved vendor with all major insurance carriers. We can work directly with your insurance company and provide all documentation needed for your claim. We handle the paperwork hassle.",
            },
            {
              id: "4",
              title: "How do I get a free estimate?",
              content:
                "Simply call us at 1-800-TREE-911 or fill out our online form. We'll schedule a convenient time to inspect your property and provide a detailed, no-obligation quote.",
            },
            {
              id: "5",
              title: "Are you licensed and insured?",
              content:
                "Absolutely. We're fully licensed, bonded, and insured. You can request proof of insurance anytime. Your property and our crew are fully protected on every job.",
            },
            {
              id: "6",
              title: "What payment methods do you accept?",
              content:
                "We accept all major credit cards, checks, and bank transfers. We offer flexible payment plans for larger projects. Ask about financing options when you call for your free estimate.",
            },
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="A-1 Discount Tree & Lawn"
          leftLink={{
            text: "Privacy Policy",
            href: "#privacy",
          }}
          rightLink={{
            text: "Terms of Service",
            href: "#terms",
          }}
        />
      </div>
    </ThemeProvider>
  );
}