"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";

export default function AboutPage() {
  const navItems = [
    { name: "Home", id: "home" },
    { name: "About", id: "about" },
    { name: "Services", id: "services" },
    { name: "Gallery", id: "gallery" },
    { name: "Reviews", id: "reviews" },
    { name: "FAQ", id: "faq" },
  ];

  const footerColumns = [
    {
      title: "Company",
      items: [
        { label: "Home", href: "/" },
        { label: "About", href: "/about" },
        { label: "Services", href: "/services" },
        { label: "Gallery", href: "/gallery" },
      ],
    },
    {
      title: "Customer",
      items: [
        { label: "Reviews", href: "/reviews" },
        { label: "FAQ", href: "/faq" },
        { label: "Get a Quote", href: "/contact" },
        { label: "Contact", href: "/contact" },
      ],
    },
    {
      title: "Legal",
      items: [
        { label: "Privacy Policy", href: "#" },
        { label: "Terms of Service", href: "#" },
        { label: "Disclaimer", href: "#" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="mediumSmall"
      sizing="mediumLargeSizeLargeTitles"
      background="aurora"
      cardStyle="outline"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="normal"
    >
      {/* Navbar */}
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="TD's Lawn-Care"
          navItems={navItems}
          button={{
            text: "Get a Quote",
            href: "/contact",
          }}
        />
      </div>

      {/* About Story Section */}
      <div id="about-story" data-section="about-story">
        <FeatureCardNineteen
          title="About TD's Lawn-Care"
          description="A lawn service built on respect, reliability, and hard work. TD's Lawn-Care started with a simple goal: treat every yard like it's our own and every customer like family. From day one, Troy and his team have focused on being on time, communicating clearly, and delivering work that makes customers proud to pull into their driveway."
          textboxLayout="default"
          useInvertedBackground={false}
          features={[
            {
              id: 1,
              tag: "Our Mission",
              title: "Built on Trust",
              subtitle: "Excellence in every detail",
              description: "We believe that a well-maintained lawn is more than just aesthetics—it's a reflection of pride in your home. Our mission is to provide professional lawn care that exceeds expectations every single time.",
              imageSrc: "http://img.b2bpic.net/free-photo/man-cutting-grass-with-lawn-mover-back-yard-male-black-apron-guy-repairs_1157-41434.jpg?_wi=2",
              imageAlt: "Perfectly manicured lawn by professional",
            },
            {
              id: 2,
              tag: "Our Values",
              title: "Reliability First",
              subtitle: "You can count on us",
              description: "Being on time isn't just a promise—it's a commitment. We respect your schedule, communicate openly, and deliver consistent results. When you trust TD's Lawn-Care, you get a partner who shows up when promised.",
              imageSrc: "http://img.b2bpic.net/free-photo/fork-harrows-grass_1339-7742.jpg?_wi=2",
              imageAlt: "Professional lawn maintenance equipment",
            },
            {
              id: 3,
              tag: "Family First",
              title: "Treating You Like Family",
              subtitle: "Genuine relationships built to last",
              description: "Every customer is important to us. We take pride in building lasting relationships with the families and businesses we serve, treating their properties with the same care we'd give our own.",
              imageSrc: "http://img.b2bpic.net/free-photo/person-doing-diy-activity-online-content-creation_23-2151515938.jpg?_wi=2",
              imageAlt: "Professional landscaping service",
            },
          ]}
        />
      </div>

      {/* Why Choose Us Section */}
      <div id="why-choose" data-section="why-choose">
        <SocialProofOne
          names={[
            "Professional Excellence",
            "Always Punctual",
            "Honest Communication",
            "Fair Transparent Pricing",
            "Quality Guaranteed",
            "Local & Community Focused",
          ]}
          title="Why Choose TD's Lawn-Care?"
          description="We stand out because we care. Our commitment to professionalism, reliability, and customer satisfaction has made us the trusted choice for homeowners and businesses across the community."
          textboxLayout="default"
          useInvertedBackground={false}
          showCard={true}
        />
      </div>

      {/* Footer */}
      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="TD's Lawn-Care"
          copyrightText="© 2025 TD's Lawn-Care. Professional, Reliable, Always On Schedule."
          columns={footerColumns}
        />
      </div>
    </ThemeProvider>
  );
}