"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Phone } from "lucide-react";

export default function BeforeAfterPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="small"
      sizing="mediumLarge"
      background="none"
      cardStyle="solid"
      primaryButtonStyle="inset-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="Early Bird Landscaping"
          navItems={[
            { name: "Services", id: "/services" },
            { name: "Before & After", id: "/before-after" },
            { name: "Reviews", id: "/reviews" },
            { name: "About", id: "/about" }
          ]}
        />
      </div>

      <div id="gallery" data-section="gallery">
        <ProductCardOne
          title="Transformation Gallery"
          description="See the dramatic difference professional landscaping makes. Every project includes complete cleanup and debris removal—no mess left behind."
          products={[
            {
              id: "1",
              name: "Complete Yard Makeover",
              price: "Before & After",
              imageSrc: "https://img.b2bpic.net/free-photo/full-shot-woman-raking-outdoors_23-2149382185.jpg?_wi=3",
              imageAlt: "Complete yard transformation from overgrown to beautiful"
            },
            {
              id: "2",
              name: "Overgrown Property Restoration",
              price: "Before & After",
              imageSrc: "https://img.b2bpic.net/free-photo/old-man-running-alone-outdoors_23-2148297549.jpg",
              imageAlt: "Overgrown property restored to pristine condition"
            },
            {
              id: "3",
              name: "Rental Property Cleanup",
              price: "Before & After",
              imageSrc: "https://img.b2bpic.net/free-photo/woman-with-vegetables-utility-cart_23-2147954312.jpg?_wi=1",
              imageAlt: "Rental property cleanup transformation"
            },
            {
              id: "4",
              name: "Weed-Infested Lawn Recovery",
              price: "Before & After",
              imageSrc: "https://img.b2bpic.net/free-photo/man-cutting-grass-with-lawn-mover-back-yard-male-shirt_1157-41448.jpg",
              imageAlt: "Weed-free lawn restoration"
            },
            {
              id: "5",
              name: "Debris-Filled Yard Cleanup",
              price: "Before & After",
              imageSrc: "https://img.b2bpic.net/free-photo/woman-with-vegetables-utility-cart_23-2147954312.jpg?_wi=2",
              imageAlt: "Debris removal and yard cleanup"
            },
            {
              id: "6",
              name: "Landscape Design Implementation",
              price: "Before & After",
              imageSrc: "https://img.b2bpic.net/free-photo/full-shot-woman-raking-outdoors_23-2149382185.jpg?_wi=4",
              imageAlt: "Professional landscape design implementation"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          buttons={[{ text: "Start Your Transformation", href: "tel:+1-555-0123" }]}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="testimonial" data-section="testimonial">
        <TestimonialCardFifteen
          testimonial="I couldn't believe the transformation! What used to be an embarrassing eyesore is now the nicest yard on the block. The crew worked incredibly hard and left everything spotless."
          rating={5}
          author="Michael Rodriguez, Property Manager"
          avatars={[
            { src: "https://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg", alt: "Michael Rodriguez" },
            { src: "https://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg", alt: "Happy customer" },
            { src: "https://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg", alt: "Satisfied client" },
            { src: "https://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg", alt: "Customer review" }
          ]}
          ratingAnimation="slide-up"
          avatarsAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="Ready for Your Transformation?"
          ctaDescription="Send us photos of your property and we'll show you what's possible with a fast, free estimate."
          ctaButton={{ text: "Get Your Quote", href: "tel:+1-555-0123" }}
          ctaIcon={Phone}
          faqs={[
            {
              id: "1",
              title: "How do you create such dramatic transformations?",
              content: "We combine hard work with attention to detail. Every project gets thorough cleanup, proper debris removal, and finishing touches that make the difference."
            },
            {
              id: "2",
              title: "How long do these transformations typically take?",
              content: "Most projects are completed in 1-3 days depending on size and scope. We work efficiently while maintaining quality standards."
            },
            {
              id: "3",
              title: "Do you provide maintenance after the transformation?",
              content: "Yes! We offer ongoing maintenance packages to keep your transformed property looking its best year-round."
            },
            {
              id: "4",
              title: "Can you work with challenging properties?",
              content: "Absolutely. We specialize in problem properties—overgrown lots, neglected rentals, and spaces others won't tackle."
            }
          ]}
          useInvertedBackground={false}
          animationType="slide-up"
        />
      </div>

      <FooterSimple
        columns={[
          {
            title: "Services",
            items: [
              { label: "Yard Cleanouts", href: "/services" },
              { label: "Weed Removal", href: "/services" },
              { label: "Trimming & Pruning", href: "/services" },
              { label: "Rental Cleanup", href: "/services" }
            ]
          },
          {
            title: "Company",
            items: [
              { label: "About Us", href: "/about" },
              { label: "Before & After", href: "/before-after" },
              { label: "Reviews", href: "/reviews" },
              { label: "Get a Quote", href: "#quote" }
            ]
          },
          {
            title: "Contact",
            items: [
              { label: "Call Us", href: "tel:+1-555-0123" },
              { label: "Text for Quote", href: "sms:+1-555-0123" },
              { label: "Email", href: "mailto:info@earlybird-landscaping.com" },
              { label: "Hours", href: "#" }
            ]
          },
          {
            title: "Legal",
            items: [
              { label: "Privacy Policy", href: "#" },
              { label: "Terms of Service", href: "#" },
              { label: "Service Areas", href: "#" }
            ]
          }
        ]}
        bottomLeftText="© 2025 Early Bird Landscaping. All rights reserved."
        bottomRightText="Serving your neighborhood with pride."
      />
    </ThemeProvider>
  );
}