"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import SplitAbout from '@/components/sections/about/SplitAbout';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import TeamCardTen from '@/components/sections/team/TeamCardTen';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Heart, Info, Stethoscope, Home, BookOpen, Users, Star, HelpCircle } from "lucide-react";

export default function PetShelterPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="compact"
      sizing="largeSmall"
      background="none"
      cardStyle="outline"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="Paws & Whiskers"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Our Animals", id: "animals" },
            { name: "Help", id: "faq" },
            { name: "Contact", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplit
          title="Give a Loving Home to a Furry Friend"
          description="Every animal deserves a second chance. At Paws & Whiskers shelter, we rescue and care for animals in need, connecting them with loving families. Start your adoption journey today."
          tag="Save a Life"
          tagIcon={Heart}
          background={{ variant: "plain" }}
          imageSrc="https://img.b2bpic.net/free-photo/smiley-woman-playing-with-cute-dog-up-adoption_23-2148682991.jpg"
          imageAlt="Pet shelter with happy animals"
          imagePosition="right"
          buttons={[
            { text: "Browse Animals", href: "animals" },
            { text: "Donate Now", href: "#contact" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <SplitAbout
          title="Our Mission: Rescue, Rehabilitate, Rehome"
          description="Since 2010, Paws & Whiskers has been dedicated to rescuing abandoned and neglected animals, providing them with medical care and rehabilitation, and finding them loving forever homes."
          tag="About Us"
          tagIcon={Info}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          imagePosition="left"
          imageSrc="https://img.b2bpic.net/free-photo/smiley-woman-spending-time-with-cute-rescue-dogs-shelter_23-2148682966.jpg"
          imageAlt="Our dedicated shelter team caring for animals"
          bulletPoints={[
            {
              title: "Expert Care",              description: "Veterinary services, rehabilitation programs, and behavioral training for all rescued animals",              icon: Stethoscope
            },
            {
              title: "Safe Haven",              description: "No-kill facility providing shelter, food, and love until each animal finds their perfect home",              icon: Home
            },
            {
              title: "Education & Support",              description: "Resources for pet owners on adoption, care, training, and responsible pet ownership",              icon: BookOpen
            },
            {
              title: "Community Impact",              description: "Volunteer opportunities and community events that promote animal welfare awareness",              icon: Users
            }
          ]}
          buttons={[
            { text: "Learn More", href: "#team" }
          ]}
        />
      </div>

      <div id="animals" data-section="animals">
        <ProductCardFour
          title="Available for Adoption"
          description="Meet our amazing animals looking for loving homes. Each profile includes personality traits, medical history, and adoption details."
          tag="New Arrivals"
          tagIcon={Star}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          products={[
            {
              id: "dog-max",              name: "Max",              price: "Adoption Fee: $150",              variant: "Golden Retriever • 5 years old • Friendly",              imageSrc: "https://img.b2bpic.net/free-photo/woman-brown-coat-lady-with-labrador_1157-42407.jpg",              imageAlt: "Max the Golden Retriever"
            },
            {
              id: "cat-bella",              name: "Bella",              price: "Adoption Fee: $75",              variant: "Orange Tabby • 3 years old • Playful",              imageSrc: "https://img.b2bpic.net/free-photo/e6mmqmducags9ema81vqg4lssvin112lzmqib9g8jpg_181624-57371.jpg",              imageAlt: "Bella the Orange Tabby Cat"
            },
            {
              id: "puppy-luna",              name: "Luna",              price: "Adoption Fee: $200",              variant: "Labrador Mix • 1 year old • Energetic",              imageSrc: "https://img.b2bpic.net/free-photo/golden-retriever-sitting-sand-park-with-afternoon-sun_181624-1393.jpg",              imageAlt: "Luna the Playful Puppy"
            }
          ]}
          buttons={[
            { text: "See All Animals", href: "#" }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardFourteen
          title="Our Impact: Thousands of Lives Changed Through Rescue and Rehabilitation"
          tag="Impact"
          useInvertedBackground="invertDefault"
          metrics={[
            {
              id: "1",              value: "5,200+",              description: "Animals rescued and rehomed since 2010"
            },
            {
              id: "2",              value: "98%",              description: "Successful adoption rate with minimal returns"
            },
            {
              id: "3",              value: "1,500+",              description: "Active volunteers supporting our mission"
            },
            {
              id: "4",              value: "24/7",              description: "Emergency care and support for animals in crisis"
            }
          ]}
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardTen
          title="Meet the Hearts Behind the Mission - Our Dedicated Team"
          tag="Our Team"
          memberVariant="card"
          useInvertedBackground="noInvert"
          members={[
            {
              id: "1",              name: "Dr. Sarah Mitchell",              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-sad-woman-saying-goodbye-her-old-german-shepherd-professional-male-veterinarian-preparing-ready-put-down-sick-dog_662251-2307.jpg",              imageAlt: "Dr. Sarah Mitchell, Veterinary Director"
            },
            {
              id: "2",              name: "James Chen",              imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-owner-holding-dog_23-2149304308.jpg",              imageAlt: "James Chen, Executive Director"
            },
            {
              id: "3",              name: "Emma Rodriguez",              imageSrc: "https://img.b2bpic.net/free-photo/happy-female-vet-smiling-petting-beautiful-beagle-dog-exam-table-professional-veterinarian-man-holding-pet-while-examining-healthy-pet-clinic_662251-2251.jpg",              imageAlt: "Emma Rodriguez, Adoption Coordinator"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="Adopting from Paws & Whiskers was the best decision we ever made. The staff was incredibly helpful, and our new family member Max has brought so much joy to our home. We can't thank them enough for their dedication and care."
          rating={5}
          author="The Johnson Family"
          useInvertedBackground="invertDefault"
          avatars={[
            {
              src: "https://img.b2bpic.net/free-photo/young-stylish-couple-walking-with-dog-street-man-woman-happy-together-with-husky-breed_285396-1635.jpg",              alt: "The Johnson Family"
            },
            {
              src: "https://img.b2bpic.net/free-photo/family-together-man-his-daughter-na-walk-with-their-dog_259150-57273.jpg",              alt: "Happy adopter with cat"
            },
            {
              src: "https://img.b2bpic.net/free-photo/medium-shot-happy-man-holding-map_23-2148765207.jpg",              alt: "Family with rescue dog"
            },
            {
              src: "https://img.b2bpic.net/free-photo/full-shot-women-dog-posing_23-2148977468.jpg",              alt: "Pet owner smiling"
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="Frequently Asked Questions"
          description="Have questions about adoption, volunteering, or donating? Find answers to common questions below."
          tag="Help"
          tagIcon={HelpCircle}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "What is the adoption process?",              content: "Our adoption process is simple and straightforward. First, browse our available animals online or visit us in person. When you find a pet you love, complete an adoption application. Our team reviews your application to ensure a good match. Once approved, you'll pay the adoption fee and take your new friend home. We typically process applications within 2-3 business days."
            },
            {
              id: "2",              title: "Are adopted animals spayed/neutered and vaccinated?",              content: "Yes! All animals adopted from Paws & Whiskers have been spayed or neutered, vaccinated, microchipped, and given a health exam by our veterinary team. You'll receive complete medical records for your new pet."
            },
            {
              id: "3",              title: "What if my adopted pet doesn't work out?",              content: "We want both you and your pet to be happy. If for any reason the adoption doesn't work out within the first 30 days, we offer a full refund and will take the animal back, no questions asked. Our success rate is very high because we carefully match pets with families."
            },
            {
              id: "4",              title: "How can I volunteer at the shelter?",              content: "We'd love to have you volunteer! We offer many opportunities including animal care, adoption support, fundraising, and administrative help. Simply fill out our volunteer application on our website or contact our volunteer coordinator at volunteer@pawsandwhiskers.org. Training is provided for all volunteers."
            },
            {
              id: "5",              title: "What are your adoption fees?",              content: "Adoption fees vary by animal type and age. Dogs typically range from $150-$250, cats from $75-$150, and specialty animals may vary. Fees help cover our veterinary care, food, shelter operations, and rescue missions. 100% of adoption fees go directly toward caring for animals in need."
            },
            {
              id: "6",              title: "Can I sponsor an animal?",              content: "Absolutely! Animal sponsorships are a wonderful way to support our mission. As a sponsor, you'll receive updates and photos of your sponsored animal, and your contribution helps cover their care costs. Monthly sponsorship starts at just $25."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Get Involved"
          title="Join Our Mission to Save Lives"
          description="Whether you want to adopt, volunteer, or donate, every action helps. Sign up to stay updated on available animals and special events."
          tagIcon={Heart}
          useInvertedBackground="invertDefault"
          inputPlaceholder="Your email address"
          buttonText="Sign Up"
          termsText="We respect your privacy and will only send updates about available animals and shelter events. Unsubscribe anytime."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="Paws & Whiskers"
        />
      </div>
    </ThemeProvider>
  );
}