"use client"

import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';

export default function PetShelterPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="mediumLarge"
      sizing="mediumLarge"
      background="aurora"
      cardStyle="layered-gradient"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="layered"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Adopt", id: "animals" },
            { name: "Success Stories", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          brandName="Happy Paws Shelter"
          bottomLeftText="Saving Lives Since 2010"
          bottomRightText="hello@happypawsshelter.org"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboard
          logoText="Happy Paws Shelter"
          description="Give a loving home to a furry friend. Every animal deserves a second chance at happiness. Browse our adoptable pets and start your adoption journey today."
          background={{ variant: "aurora" }}
          imageSrc="https://img.b2bpic.net/free-photo/two-dogs-playing-with-flying-disc-park_342744-939.jpg"
          imageAlt="Dogs playing happily at the shelter"
          frameStyle="card"
        />
      </div>

      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            {
              type: "text",              content: "We're dedicated to rescuing, caring for, and rehoming animals in need since 2010."
            }
          ]}
          useInvertedBackground="invertDefault"
          buttons={[
            { text: "Learn Our Mission", href: "#" },
            { text: "Volunteer With Us", href: "#volunteer" }
          ]}
        />
      </div>

      <div id="animals" data-section="animals">
        <ProductCardOne
          title="Meet Our Adoptable Pets"
          description="Discover the wonderful animals waiting for their forever homes. Each pet has a unique personality and deserves love and care."
          products={[
            {
              id: "1",              name: "Buddy",              price: "Adoption Fee: $150",              imageSrc: "https://img.b2bpic.net/free-photo/vertical-shot-domestic-korean-jindo-dog-leash-looking-camera_181624-10640.jpg",              imageAlt: "Buddy the golden retriever"
            },
            {
              id: "2",              name: "Whiskers",              price: "Adoption Fee: $75",              imageSrc: "https://img.b2bpic.net/free-photo/pretty-young-woman-petting-her-dog_23-2148740455.jpg",              imageAlt: "Whiskers the tabby cat"
            },
            {
              id: "3",              name: "Hoppy",              price: "Adoption Fee: $50",              imageSrc: "https://img.b2bpic.net/free-photo/dog-stairs-with-adoption-banner_23-2148699705.jpg",              imageAlt: "Hoppy the fluffy rabbit"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="Success Stories"
          description="Real stories from families who found their perfect companions at Happy Paws Shelter."
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              handle: "Dog Mom",              testimonial: "We found our best friend in Buddy. He's brought so much joy and love into our family. The adoption process was smooth and the staff was incredibly supportive.",              imageSrc: "https://img.b2bpic.net/free-photo/full-shot-family-with-cute-dog-outdoors_23-2148996586.jpg",              imageAlt: "Sarah with her adopted dog"
            },
            {
              id: "2",              name: "Michael Chen",              handle: "Cat Enthusiast",              testimonial: "Whiskers has completely transformed our home. She's playful, affectionate, and the perfect companion. Thank you Happy Paws for helping us find each other!",              imageSrc: "https://img.b2bpic.net/free-photo/smiley-boy-parents-petting-dog-while-park_23-2148647749.jpg",              imageAlt: "Michael with his adopted cat"
            },
            {
              id: "3",              name: "Emily Rodriguez",              handle: "Animal Lover",              testimonial: "The shelter staff really took time to understand what we were looking for. They matched us with the perfect pet for our lifestyle. Highly recommend Happy Paws!",              imageSrc: "https://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg",              imageAlt: "Emily with her adopted pet"
            },
            {
              id: "4",              name: "David Kim",              handle: "Rescue Advocate",              testimonial: "Adopting from Happy Paws was the best decision we ever made. Our rescue dog has enriched our lives in ways we never imagined. Support local shelters!",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-family-dog_329181-20491.jpg",              imageAlt: "David with his rescue dog"
            },
            {
              id: "5",              name: "Jennifer Lee",              handle: "Pet Parent",              testimonial: "From the moment we walked in, we felt the care and dedication of the Happy Paws team. Our new family member is healthy, happy, and so loved.",              imageSrc: "https://img.b2bpic.net/free-photo/happy-boy-posing-park-with-dog-parents_23-2148647786.jpg",              imageAlt: "Jennifer with her family and pet"
            },
            {
              id: "6",              name: "Robert Martinez",              handle: "Senior Adopter",              testimonial: "I never thought I'd adopt a senior dog, but Hoppy is the most grateful companion. The shelter helped me find the perfect match for my needs and lifestyle.",              imageSrc: "https://img.b2bpic.net/free-photo/happy-dog-family-background_329181-20460.jpg",              imageAlt: "Robert with his senior dog"
            }
          ]}
        />
      </div>

      <div id="adoption-process" data-section="adoption-process">
        <FeatureCardTwentyThree
          title="Our Adoption Process"
          description="We make adoption simple and straightforward to help you find your perfect pet match."
          features={[
            {
              id: "1",              title: "Browse & Meet",              tags: ["Step 1", "Connect"],
              imageSrc: "https://img.b2bpic.net/free-photo/vertical-shot-domestic-korean-jindo-dog-leash-looking-camera_181624-10640.jpg",              imageAlt: "Browse available pets"
            },
            {
              id: "2",              title: "Submit Application",              tags: ["Step 2", "Process"],
              imageSrc: "https://img.b2bpic.net/free-photo/signing-agreement_1098-19561.jpg",              imageAlt: "Complete adoption application"
            },
            {
              id: "3",              title: "Meet Your Match",              tags: ["Step 3", "Connect"],
              imageSrc: "https://img.b2bpic.net/free-photo/pretty-young-woman-petting-her-dog_23-2148740455.jpg",              imageAlt: "Meet your new pet"
            },
            {
              id: "4",              title: "Finalize & Take Home",              tags: ["Step 4", "Complete"],
              imageSrc: "https://img.b2bpic.net/free-photo/dog-stairs-with-adoption-banner_23-2148699705.jpg",              imageAlt: "Welcome your new pet home"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="volunteer" data-section="volunteer">
        <FeatureCardTwentyThree
          title="Volunteer Opportunities"
          description="Join our passionate team and make a direct impact on the lives of animals in our care."
          features={[
            {
              id: "1",              title: "Animal Care & Socialization",              tags: ["Hands-on", "Rewarding"],
              imageSrc: "https://img.b2bpic.net/free-photo/diverse-team-employees-have-informal-meeting-domestic-atmosphere-work-with-paper-documents-develop-startup-briefing-focused-serious-male-ceo-holds-cell-phone-checks-email-box-laptop_273609-28975.jpg",              imageAlt: "Volunteers caring for animals"
            },
            {
              id: "2",              title: "Foster Programs",              tags: ["Temporary", "Love"],
              imageSrc: "https://img.b2bpic.net/free-photo/two-dogs-playing-with-flying-disc-park_342744-939.jpg",              imageAlt: "Foster family with pet"
            },
            {
              id: "3",              title: "Administrative Support",              tags: ["Office", "Flexible"],
              imageSrc: "https://img.b2bpic.net/free-photo/cheerful-woman-talking-phone-celebrating_23-2147727660.jpg",              imageAlt: "Shelter administrative work"
            },
            {
              id: "4",              title: "Event Coordination",              tags: ["Community", "Outreach"],
              imageSrc: "https://img.b2bpic.net/free-photo/smiley-woman-playing-with-cute-dog-up-adoption_23-2148682991.jpg",              imageAlt: "Community adoption event"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          buttons={[
            { text: "Sign Up to Volunteer", href: "#contact" }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitText
          sideTitle="Frequently Asked Questions"
          sideDescription="Find answers to common questions about adoption, costs, and our services."
          faqs={[
            {
              id: "1",              title: "What is the adoption process?",              content: "Our adoption process includes browsing available pets, completing an application, meeting your potential pet, and finalizing the paperwork. Most adoptions are completed within 1-2 weeks."
            },
            {
              id: "2",              title: "Are there adoption fees?",              content: "Yes, adoption fees vary by animal type and age. Dogs typically range from $100-200, cats $50-100, and small animals $25-75. These fees help cover medical care, vaccinations, and shelter operations."
            },
            {
              id: "3",              title: "Are pets spayed or neutered?",              content: "Yes, all our animals are spayed or neutered before adoption, as well as up-to-date on vaccinations and microchipped for safety."
            },
            {
              id: "4",              title: "Can I return an adopted pet?",              content: "Absolutely. If for any reason the adoption doesn't work out, we welcome the pet back with no questions asked. We also provide lifetime support for all our adoptees."
            },
            {
              id: "5",              title: "How can I volunteer?",              content: "You can fill out our volunteer application on our website or visit us in person. We offer flexible shifts and various roles to match your interests and availability."
            },
            {
              id: "6",              title: "Do you accept donations?",              content: "Yes! We gratefully accept monetary donations, pet supplies, food, and blankets. Every donation helps us care for more animals. Visit our donation page to contribute."
            }
          ]}
          textPosition="left"
          useInvertedBackground="noInvert"
          animationType="smooth"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Get in Touch"
          description="Have questions about adoption, volunteering, or our services? Contact us today and let's help you find your perfect pet companion or way to give back."
          inputs={[
            { name: "name", type: "text", placeholder: "Your Name", required: true },
            { name: "email", type: "email", placeholder: "Your Email", required: true },
            { name: "phone", type: "tel", placeholder: "Your Phone Number", required: false }
          ]}
          textarea={{
            name: "message",            placeholder: "Tell us how we can help...",            rows: 5,
            required: true
          }}
          useInvertedBackground="invertDefault"
          imageSrc="https://img.b2bpic.net/free-photo/cheerful-woman-talking-phone-celebrating_23-2147727660.jpg"
          imageAlt="Happy Paws Shelter contact"
          mediaPosition="right"
          buttonText="Send Message"
        />
      </div>

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