"use client"

import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import ContactText from '@/components/sections/contact/ContactText';
import FooterBase from '@/components/sections/footer/FooterBase';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Heart, Paw } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="bounce-effect"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="small"
      sizing="medium"
      background="aurora"
      cardStyle="glass-depth"
      primaryButtonStyle="inset-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Paws Haven"
          navItems={[
            { name: "About", id: "about" },
            { name: "Pets", id: "pets" },
            { name: "Adopt", id: "adopt" },
            { name: "Impact", id: "impact" },
            { name: "Contact", id: "contact" }
          ]}
          button={{ text: "Adopt Today", href: "adopt" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardScroll
          background={{ variant: "aurora" }}
          tag="Welcome to Paws Haven"
          tagIcon={Heart}
          title="Give a Pet a Forever Home"
          description="Meet our amazing animals waiting for their perfect match. Every adoption saves a life and opens our hearts to new possibilities."
          imageSrc="https://img.b2bpic.net/free-photo/woman-interacting-with-rescue-dogs-shelter_23-2148682952.jpg"
          imageAlt="Happy dogs and cats at our shelter"
          buttons={[
            { text: "Browse Pets", href: "pets" },
            { text: "Learn More", href: "about" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <TestimonialAboutCard
          tag="Our Mission"
          title="Dedicated to animal welfare and finding loving homes for every creature in our care."
          description="Paws Haven Shelter"
          subdescription="Serving our community since 2010"
          icon={Paw}
          imageSrc="https://img.b2bpic.net/free-photo/lots-cute-rescue-dogs-shelter-waiting-be-adopted_23-2148682950.jpg"
          imageAlt="Volunteers caring for shelter animals"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="pets" data-section="pets">
        <ProductCardThree
          title="Meet Our Adoptable Pets"
          description="Each animal has a unique personality and story. Get to know them and find your perfect companion today."
          products={[
            {
              id: "1",              name: "Max - Golden Retriever",              price: "Adoption Fee: $150",              imageSrc: "https://img.b2bpic.net/free-photo/hipster-woman-smile-enjoy-playing-with-her-puppy-summer-field-vintage-tone-filter_1150-1188.jpg",              imageAlt: "Max, a friendly golden retriever",              initialQuantity: 1
            },
            {
              id: "2",              name: "Luna - Tabby Cat",              price: "Adoption Fee: $75",              imageSrc: "https://img.b2bpic.net/free-photo/elegant-fashion-girls-summer-park_1157-21448.jpg",              imageAlt: "Luna, a gentle tabby cat",              initialQuantity: 1
            },
            {
              id: "3",              name: "Charlie - Lab Mix",              price: "Adoption Fee: $125",              imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-girl-with-cute-dog-bench_23-2148699660.jpg",              imageAlt: "Charlie, a playful brown lab mix",              initialQuantity: 1
            },
            {
              id: "4",              name: "Daisy - Rabbit",              price: "Adoption Fee: $50",              imageSrc: "https://img.b2bpic.net/free-photo/elevated-view-human-hand-stroking-dog_23-2147840625.jpg",              imageAlt: "Daisy, a sweet rabbit",              initialQuantity: 1
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="impact" data-section="impact">
        <MetricCardSeven
          title="Our Impact"
          description="Numbers that show our commitment to animal welfare and community care."
          metrics={[
            {
              id: "1",              value: "2,450+",              title: "Animals Rescued & Rehomed",              items: ["Success stories every month", "Lifelong support provided"]
            },
            {
              id: "2",              value: "98%",              title: "Adoption Success Rate",              items: ["Happy pet-parent matches", "Follow-up support included"]
            },
            {
              id: "3",              value: "150+",              title: "Active Volunteers",              items: ["Hours of care per week", "Community champions"]
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="adopt" data-section="adopt">
        <FeatureCardTwelve
          title="How to Adopt"
          description="Our simple and caring adoption process ensures the best match for you and your new pet."
          features={[
            {
              id: "step1",              label: "Step 1",              title: "Browse & Meet",              items: ["Visit our online profiles", "Meet pets in person", "Learn about their personalities"]
            },
            {
              id: "step2",              label: "Step 2",              title: "Application & Interview",              items: ["Complete adoption form", "Home evaluation process", "Discuss lifestyle fit"]
            },
            {
              id: "step3",              label: "Step 3",              title: "Welcome Home",              items: ["Finalize paperwork", "Receive care guide", "Start your new family"]
            }
          ]}
          animationType="opacity"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="Finding our beloved rescue dog at Paws Haven changed our lives. The staff's dedication and care made the entire adoption process wonderful. We couldn't have asked for a better experience!"
          rating={5}
          author="Sarah & Tom Mitchell"
          avatars={[
            { src: "https://img.b2bpic.net/free-photo/woman-smiles-toothily-looks-surprised-hears-awesome-news-wears-casual-yellow-sweater-poses-white-human-face-expressions-emotions-feelings-concept_273609-55936.jpg", alt: "Sarah Mitchell" },
            { src: "https://img.b2bpic.net/free-photo/woman-with-curly-hair-toothy-smile-has-carefree-happy-expression-wears-casual-jumper-poses-against-beige-positive-human-emotions-face-expressions-concept_273609-56482.jpg", alt: "Happy adopter" },
            { src: "https://img.b2bpic.net/free-photo/close-up-portrait-curly-haired-young-woman-isolated_273609-48299.jpg", alt: "Pet parent" },
            { src: "https://img.b2bpic.net/free-photo/beautiful-sincere-woman-with-afro-hair-smiles-broadly-has-white-perfect-teeth-doesnt-hide-positive-emotions-wears-knitted-sweater-isolated-brown-wall_273609-43964.jpg", alt: "Satisfied customer" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          background={{ variant: "plain" }}
          text="Ready to open your heart and home to a deserving animal? Contact us today to start your adoption journey or to learn how you can support our mission."
          animationType="entrance-slide"
          buttons={[
            { text: "Get Started", href: "adopt" },
            { text: "Volunteer", href: "#" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="Paws Haven"
          copyrightText="© 2025 Paws Haven Shelter. All rights reserved."
          columns={[
            {
              title: "Adopt",              items: [
                { label: "Available Pets", href: "pets" },
                { label: "Adoption Process", href: "adopt" },
                { label: "FAQ", href: "#" }
              ]
            },
            {
              title: "About",              items: [
                { label: "Our Mission", href: "about" },
                { label: "Our Impact", href: "impact" },
                { label: "Testimonials", href: "testimonials" }
              ]
            },
            {
              title: "Get Involved",              items: [
                { label: "Volunteer", href: "#" },
                { label: "Donate", href: "#" },
                { label: "Contact Us", href: "contact" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}