"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroPersonalLinks from '@/components/sections/hero/HeroPersonalLinks';
import TextAbout from '@/components/sections/about/TextAbout';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Heart, Users, Mail, HelpingHand, Brain, Home, TrendingUp } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="small"
      sizing="largeSmall"
      background="noiseDiagonalGradient"
      cardStyle="inset"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="solid"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          brandName="Pawsitive Haven"
          navItems={[
            { name: "Home", id: "home" },
            { name: "Adopt", id: "featured-pets" },
            { name: "About Us", id: "about" },
            { name: "Get Involved", id: "how-to-help" },
            { name: "Contact", id: "contact" }
          ]}
          bottomLeftText="Saving Lives, One Paw at a Time"
          bottomRightText="info@pawsitivehaven.org"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroPersonalLinks
          background={{ variant: "plain" }}
          title="Give Shelter Pets a Second Chance at Happiness"
          socialLinks={[
            { icon: Heart, label: "Support", href: "https://example.com/donate" },
            { icon: Users, label: "Volunteer", href: "https://example.com/volunteer" },
            { icon: Mail, label: "Newsletter", href: "https://example.com/newsletter" }
          ]}
          linkCards={[
            {
              icon: Heart,
              title: "Find Your Perfect Companion",              description: "Browse our available pets waiting for their forever homes",              button: { text: "Meet Our Pets", href: "#featured-pets" }
            },
            {
              icon: Heart,
              title: "Make a Difference",              description: "Support our mission to rescue and rehome animals in need",              button: { text: "Donate Now", href: "#contact" }
            },
            {
              icon: HelpingHand,
              title: "Join Our Team",              description: "Volunteer your time and become part of our caring community",              button: { text: "Get Involved", href: "#how-to-help" }
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <TextAbout
          tag="Our Mission"
          tagIcon={Heart}
          title="Every animal deserves love, care, and a safe home. At Pawsitive Haven, we rescue abandoned and neglected pets, provide medical care, rehabilitation, and training—then match them with families who will cherish them forever. Together, we're creating a world where no pet is left behind."
          useInvertedBackground={false}
          buttons={[
            { text: "Learn Our Story", href: "#about" },
            { text: "See Our Impact", href: "#metrics" }
          ]}
        />
      </div>

      <div id="featured-pets" data-section="featured-pets">
        <ProductCardThree
          title="Ready for Adoption"
          description="Meet some of our wonderful pets looking for loving homes. Each animal has been cared for and is ready to bring joy to your family."
          products={[
            {
              id: "1",              name: "Max - Golden Retriever",              price: "Adoption Fee: $150",              imageSrc: "https://img.b2bpic.net/free-photo/smiley-woman-playing-with-dog-shelter_23-2148682979.jpg",              imageAlt: "Golden Retriever puppy",              initialQuantity: 1
            },
            {
              id: "2",              name: "Luna - Tabby Cat",              price: "Adoption Fee: $75",              imageSrc: "https://img.b2bpic.net/free-photo/direct-look-into-face-duck-tolling-retriever-dog_493961-1048.jpg",              imageAlt: "Tabby cat",              initialQuantity: 1
            },
            {
              id: "3",              name: "Charlie - Beagle Mix",              price: "Adoption Fee: $125",              imageSrc: "https://img.b2bpic.net/free-photo/happy-girl-embracing-her-dog_23-2147637103.jpg",              imageAlt: "Energetic beagle mix",              initialQuantity: 1
            },
            {
              id: "4",              name: "Bella - Holland Lop Rabbit",              price: "Adoption Fee: $50",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-girl-hugging-cute-dog_23-2148699657.jpg",              imageAlt: "Fluffy white rabbit",              initialQuantity: 1
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentyFive
          title="How We Care"
          description="Our comprehensive approach ensures every animal receives the best possible care"
          features={[
            {
              title: "Medical Care",              description: "Complete veterinary services including exams, vaccinations, and treatments",              icon: Heart,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/cute-cat-medical-examination-veterinary-clinic-measuring-blood-pressure_613910-21569.jpg",                  imageAlt: "Veterinary care"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/caring-volunteers-bring-assistance-needy-charity-food-drive-sharing-food-nourishments-voluntary-young-individuals-provide-hunger-relief-less-fortunate-showcasing-spirit-volunteering_482257-72973.jpg",                  imageAlt: "Caring staff"
                }
              ]
            },
            {
              title: "Behavioral Training",              description: "Professional training to help pets adjust and prepare for their new homes",              icon: Brain,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/young-puppy-veterinarian-going-health-checkup-professional-examining-dog-using-stethoscope_839833-8462.jpg",                  imageAlt: "Pet training"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/happy-girl-embracing-her-dog_23-2147637103.jpg",                  imageAlt: "Happy trained pet"
                }
              ]
            }
          ]}
          animationType="depth-3d"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardOne
          title="Our Impact"
          description="The lives we've transformed through rescue, rehabilitation, and rehoming"
          metrics={[
            {
              id: "1",              value: "2847",              title: "Animals Rescued",              description: "Since 2015, we've brought hope to thousands",              icon: Heart
            },
            {
              id: "2",              value: "2.2K",              title: "Successfully Adopted",              description: "Finding their forever homes",              icon: Home
            },
            {
              id: "3",              value: "98%",              title: "Return Rate",              description: "Our animals stay in their adoptive homes",              icon: TrendingUp
            },
            {
              id: "4",              value: "500+",              title: "Volunteers",              description: "Compassionate people helping daily",              icon: Users
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="scale-rotate"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="Finding Bella through Pawsitive Haven changed our lives. She's brought so much joy and love to our family. The care and dedication the team showed made the adoption process seamless, and we can't imagine life without her now."
          rating={5}
          author="Sarah & Tom Miller"
          avatars={[
            {
              src: "https://img.b2bpic.net/free-photo/portrait-young-blonde-woman_273609-12060.jpg",              alt: "Sarah Miller"
            },
            {
              src: "https://img.b2bpic.net/free-photo/cheerful-young-caucasian-female-wearing-her-red-hair-bun-laughing-out-loud_273609-9260.jpg",              alt: "Tom Miller"
            },
            {
              src: "https://img.b2bpic.net/free-photo/caucasion-woman-casual-confident-concept_53876-137678.jpg",              alt: "Family photo"
            },
            {
              src: "https://img.b2bpic.net/free-photo/close-up-young-pleasant-girl-smiling-looking-friendly-happy-cute-face-expression-smile-white-teeth-standing-casual-blouse-against-white-background_176420-47612.jpg",              alt: "Happy family"
            }
          ]}
          ratingAnimation="slide-up"
          avatarsAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="how-to-help" data-section="how-to-help">
        <FeatureCardTwentyFive
          title="Ways to Make a Difference"
          description="Your support in any form helps us continue our mission to rescue and rehome animals"
          features={[
            {
              title: "Donate",              description: "Fund medical care, food, shelter, and rehabilitation programs for rescued animals",              icon: Heart,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/donate-sign-charity-campaign_53876-127165.jpg",                  imageAlt: "Support animals"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/caring-volunteers-bring-assistance-needy-charity-food-drive-sharing-food-nourishments-voluntary-young-individuals-provide-hunger-relief-less-fortunate-showcasing-spirit-volunteering_482257-72973.jpg",                  imageAlt: "Community giving"
                }
              ]
            },
            {
              title: "Volunteer",              description: "Join our team to help care for animals, assist with adoptions, and organize events",              icon: HelpingHand,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/caring-volunteers-bring-assistance-needy-charity-food-drive-sharing-food-nourishments-voluntary-young-individuals-provide-hunger-relief-less-fortunate-showcasing-spirit-volunteering_482257-72973.jpg",                  imageAlt: "Volunteers helping"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/smiley-woman-playing-with-dog-shelter_23-2148682979.jpg",                  imageAlt: "Pet care"
                }
              ]
            }
          ]}
          animationType="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to open your heart and home to a pet in need? Contact us today to learn about adoption, volunteering, or supporting our mission."
          animationType="entrance-slide"
          background={{ variant: "plain" }}
          useInvertedBackground={false}
          buttons={[
            { text: "Start Adoption Process", href: "https://example.com/adopt-apply" },
            { text: "Donate Today", href: "https://example.com/donate" }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Pawsitive Haven"
          columns={[
            {
              items: [
                { label: "Home", href: "#home" },
                { label: "Featured Pets", href: "#featured-pets" },
                { label: "About Us", href: "#about" }
              ]
            },
            {
              items: [
                { label: "Get Involved", href: "#how-to-help" },
                { label: "Donate", href: "https://example.com/donate" },
                { label: "Volunteer", href: "https://example.com/volunteer" }
              ]
            },
            {
              items: [
                { label: "Contact", href: "mailto:info@pawsitivehaven.org" },
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}