"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import FooterCard from '@/components/sections/footer/FooterCard';
import Link from 'next/link';

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

  return (
    <ThemeProvider
      defaultButtonVariant="bounce-effect"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="smallMedium"
      sizing="mediumLargeSizeLargeTitles"
      background="none"
      cardStyle="gradient-radial"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Nick and Sons Plumbing"
          navItems={navItems}
          button={{ text: "Call Now", href: "tel:123-456-7890" }}
          className="py-4 lg:py-6"
        />
      </div>

      <div id="about-story" data-section="about-story">
        <TextSplitAbout
          title="Our Story: A Family Standard of Work"
          description={[
            "Nick and Sons Plumbing is built on a simple promise: show up, do it right, and treat people well. Founded by Nick, a master plumber with over two decades of experience, we bring a family standard of quality and integrity to every home we service.",            "Homeowners consistently mention our thoroughness, courtesy, and trustworthiness—because that’s how we work, every time. We believe in building long-term relationships based on reliable work and clear communication."
          ]}
          useInvertedBackground={false}
          className="py-20 lg:py-28"
          titleClassName="text-4xl md:text-5xl lg:text-6xl font-extrabold"
          descriptionClassName="text-lg md:text-xl text-foreground/80 max-w-xl"
        />
      </div>

      <div id="about-values" data-section="about-values">
        <FeatureCardOne
          title="Our Core Values"
          description="These principles guide every job we do, ensuring you receive the highest quality service."
          features={[
            { title: "Pro-Level Skill", description: "We solve problems other plumbers miss—and we do it efficiently.", imageSrc: "https://img.b2bpic.net/free-vector/plumber-services-logo-design-template_742173-26552.jpg", imageAlt: "Icon representing skill" },
            { title: "Integrity You Can Feel", description: "Customers call out our honesty, professionalism, and respect in the home.", imageSrc: "https://img.b2bpic.net/free-vector/handshake-circles-set_78370-9465.jpg", imageAlt: "Icon representing integrity" },
            { title: "Above-and-Beyond Service", description: "If we see a second issue while fixing the first, we handle it the right way—no shortcuts.", imageSrc: "https://img.b2bpic.net/free-vector/check-mark-stars_78370-4435.jpg", imageAlt: "Icon representing above and beyond service" }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          cardClassName="p-6 md:p-8 flex flex-col items-center text-center"
          cardTitleClassName="text-xl font-bold mt-4 mb-2"
          cardDescriptionClassName="text-base"
          mediaClassName="h-24 w-24 object-contain"
        />
      </div>

      <div id="about-team" data-section="about-team">
        <FeatureCardOne
          title="Meet the Team"
          description="Led by Nick, our team is comprised of certified professionals dedicated to quality."
          features={[
            { title: "Nick - Founder & Master Plumber", description: "With over 20 years of experience, Nick leads the team with a commitment to quality and customer satisfaction.", imageSrc: "https://img.b2bpic.net/free-photo/portrait-happy-auto-repairman-looking-camera-while-his-customers-are-standing-background_637285-7790.jpg", imageAlt: "Nick, founder of Nick and Sons Plumbing" },
            { title: "The Sons - Certified Technicians", description: "Trained by the best, our next generation of plumbers brings modern techniques and the same family values to every job.", imageSrc: "https://img.b2bpic.net/free-photo/portrait-happy-auto-repairman-looking-camera-while-his-customers-are-standing-background_637285-7790.jpg", imageAlt: "The professional team of plumbers" }
          ]}
          gridVariant="two-items-per-row"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          cardClassName="p-6 md:p-8"
          cardTitleClassName="text-xl font-bold mt-4 mb-2"
          cardDescriptionClassName="text-base text-foreground/80"
          mediaClassName="w-full h-64 object-cover rounded-lg"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="Nick and Sons Plumbing"
          copyrightText="© 2024 | Nick and Sons Plumbing. All rights reserved."
          className="py-16"
          cardClassName="max-w-7xl mx-auto px-6 lg:px-8 bg-card rounded-xl shadow-lg"
          logoClassName="text-3xl font-bold text-foreground"
          copyrightTextClassName="text-sm text-foreground/70"
        />
      </div>
    </ThemeProvider>
  );
}