"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Heart, Star, Sparkles } from "lucide-react";

export default function DonatePage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="smallMedium"
      sizing="largeSmall"
      background="aurora"
      cardStyle="gradient-radial"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="solid"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="PawsHome Shelter"
          navItems={[
            { name: "About", id: "/about" },
            { name: "Adopt", id: "/adopt" },
            { name: "Donate", id: "/donate" },
            { name: "Contact", id: "/contact" }
          ]}
        />
      </div>

      <div id="donate-plans" data-section="donate-plans">
        <PricingCardTwo
          title="Support Our Mission"
          description="Your donation helps us care for animals in need and find them loving homes. Every contribution makes a real difference in an animal's life."
          plans={[
            {
              id: "supporter",
              badge: "Supporter",
              badgeIcon: Heart,
              price: "$25",
              subtitle: "One-time monthly gift",
              buttons: [{ text: "Donate Now", href: "https://donate.example.com" }],
              features: ["Provides one week of food", "Monthly impact report", "Supporter recognition"]
            },
            {
              id: "champion",
              badge: "Champion",
              badgeIcon: Star,
              price: "$50",
              subtitle: "Meaningful monthly commitment",
              buttons: [{ text: "Donate Now", href: "https://donate.example.com" }],
              features: ["Covers medical care for one animal", "Exclusive updates and photos", "Champion tier badge"]
            },
            {
              id: "guardian",
              badge: "Guardian",
              badgeIcon: Sparkles,
              price: "$100",
              subtitle: "Dedicated annual partnership",
              buttons: [{ text: "Become a Guardian", href: "https://donate.example.com" }],
              features: ["Full year support for one animal", "Personalized updates and photos", "VIP event invitations", "Legacy recognition"]
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Donation Questions"
          description="Learn more about how your support helps animals in need"
          faqs={[
            {
              id: "1",
              title: "How is my donation used?",
              content: "Your donation directly supports animal care including food, medical treatment, shelter maintenance, and staff salaries. We're committed to transparency in how funds are allocated."
            },
            {
              id: "2",
              title: "Is my donation tax-deductible?",
              content: "Yes! PawsHome Shelter is a registered 501(c)(3) nonprofit organization. You'll receive a tax-deductible receipt for your contribution."
            },
            {
              id: "3",
              title: "Can I donate supplies instead of money?",
              content: "Absolutely! We accept donations of pet food, blankets, toys, and medical supplies. Please contact us to arrange drop-off times and see our current needs list."
            },
            {
              id: "4",
              title: "How can I volunteer my time?",
              content: "We welcome volunteers for various activities including dog walking, cat socialization, administrative tasks, and special events. Fill out our volunteer application to get started."
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://img.b2bpic.net/free-photo/smiley-woman-spending-time-with-cute-rescue-dogs-shelter_23-2148682966.jpg"
          imageAlt="PawsHome Shelter volunteers caring for animals"
          logoText="PawsHome Shelter"
          copyrightText="© 2025 PawsHome Shelter. All rights reserved."
          columns={[
            {
              title: "Adopt",
              items: [
                { label: "Browse Pets", href: "/adopt" },
                { label: "About Us", href: "/about" },
                { label: "Success Stories", href: "/" }
              ]
            },
            {
              title: "Support",
              items: [
                { label: "Donate", href: "/donate" },
                { label: "Contact", href: "/contact" },
                { label: "Volunteer", href: "/contact" }
              ]
            },
            {
              title: "Contact",
              items: [
                { label: "info@pawshome.org", href: "mailto:info@pawshome.org" },
                { label: "(555) 123-4567", href: "tel:+15551234567" },
                { label: "Tue-Sun 10am-6pm", href: "" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}