"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import Link from "next/link";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";
import FooterCard from "@/components/sections/footer/FooterCard";

const navItems = [
  { name: "Home", id: "/" },
  { name: "Services", id: "/services" },
  { name: "About", id: "/about" },
  { name: "Reviews", id: "/reviews" },
];

export default function ServicesPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="mediumSmall"
      sizing="mediumLargeSizeMediumTitles"
      background="none"
      cardStyle="layered-gradient"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="solid"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Peter Tavener"
          navItems={navItems}
          button={{
            text: "Call Now",            href: "tel:0733944918"}}
          animateOnLoad={true}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardSeven
          title="Our Plumbing Services"
          description="Comprehensive solutions for all your plumbing needs, tailored to keep your home running smoothly"
          tag="Professional Services"
          textboxLayout="default"
          useInvertedBackground={true}
          animationType="blur-reveal"
          features={[
            {
              id: 1,
              title: "Emergency Plumbing",              description: "24/7 emergency response for burst pipes, flooding, and urgent repairs. We're always ready to help when you need us most. Our team arrives quickly with fully stocked vehicles.",              imageSrc: "http://img.b2bpic.net/free-photo/man-fixing-kitchen-sink_53876-13430.jpg?_wi=2",              imageAlt: "Emergency plumbing service"},
            {
              id: 2,
              title: "Hot Water Systems",              description: "Professional installation, repair, and maintenance of hot water systems. Fast diagnostics and reliable solutions for electric, gas, and solar systems.",              imageSrc: "http://img.b2bpic.net/free-photo/view-plumber-working-fix-problems_23-2150990693.jpg?_wi=2",              imageAlt: "Hot water system installation"},
            {
              id: 3,
              title: "Leak Detection",              description: "Advanced leak detection technology to identify hidden leaks quickly and accurately. We use non-invasive methods to locate problems without damage.",              imageSrc: "http://img.b2bpic.net/free-photo/male-worker-operating-machinery-factory_107420-96043.jpg?_wi=2",              imageAlt: "Professional leak detection"},
            {
              id: 4,
              title: "Blocked Drains",              description: "Expert blocked drain services using modern equipment. We clear stubborn blockages safely and efficiently, then clean the line thoroughly.",              imageSrc: "http://img.b2bpic.net/free-photo/top-view-plumber-checking-kitchen-fixtures_1098-17864.jpg?_wi=2",              imageAlt: "Drain cleaning service"},
            {
              id: 5,
              title: "General Maintenance",              description: "Regular plumbing maintenance to prevent issues before they start. Inspections, repairs, and preventive care for residential and commercial properties.",              imageSrc: "http://img.b2bpic.net/free-photo/male-plumber-working-with-client-fix-kitchen-problems_23-2150990690.jpg?_wi=2",              imageAlt: "Plumbing maintenance and inspection"},
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="Peter Tavener Plumbing"
          copyrightText="© 2025 Peter Tavener Plumbing Services Pty Ltd. 9 Hamel Rd, Holland Park West QLD 4121. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}