"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroCentered from '@/components/sections/hero/HeroCentered';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Flower2, Heart, Mail } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="compact"
      sizing="largeSmall"
      background="fluid"
      cardStyle="inset"
      primaryButtonStyle="flat"
      secondaryButtonStyle="layered"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Erika"
          navItems={[
            { name: "Our Story", id: "about" },
            { name: "The Book", id: "book" },
            { name: "Advocacy", id: "advocacy" },
            { name: "Shop", id: "shop" }
          ]}
          button={{ text: "Get the Book", href: "cta" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCentered
          title="A Big World, a Gentle Heart"
          description="Meet Erika and Learn to Sign"
          background={{ variant: "plain" }}
          avatars={[
            { src: "http://img.b2bpic.net/free-photo/pretty-girl-bright-dress-poses-field_8353-128.jpg", alt: "Erika standing on hillside" }
          ]}
          buttons={[
            { text: "Watch Erika Sign", href: "#book" }
          ]}
          buttonAnimation="slide-up"
          ariaLabel="Hero section introducing Erika's story"
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric
          title="Our Story"
          metrics={[
            { icon: Flower2, label: "Gratitude", value: "Joy in Small Moments" },
            { icon: Heart, label: "Inclusion & Advocacy", value: "Celebrating Differences" }
          ]}
          metricsAnimation="slide-up"
          useInvertedBackground={false}
          ariaLabel="Our mission and values section"
        />
      </div>

      <div id="book" data-section="book">
        <FeatureCardTwentySeven
          title="Global Heart"
          description="Love Without Borders"
          tag="Featured"
          features={[
            {
              id: "1",              title: "A Story for Every Child",              description: "Written with a soft but strong message of empathy, this book is a safe space that celebrates our differences and teaches that love can bridge any distance.",              imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-world-book-day-concept_23-2148474507.jpg",              imageAlt: "Love Without Borders book cover"
            },
            {
              id: "2",              title: "Journey from the Himalayas",              description: "Follow Erika as she travels from her village in the Himalayas to the furthest stars, showing us that we all belong in this beautiful world.",              imageSrc: "http://img.b2bpic.net/free-photo/travelling-nepal_8327-281.jpg",              imageAlt: "Prayer flags in Bhutanese landscape"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          ariaLabel="The Book section showcasing Erika's story"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="What People Are Saying"
          description="Hear from families, educators, and advocates touched by Erika's story"
          testimonials={[
            {
              id: "1",              name: "Sarah Martinez",              role: "Parent",              company: "Autism Community",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-parents-with-baby_1098-1201.jpg",              imageAlt: "Sarah Martinez"
            },
            {
              id: "2",              name: "James Chen",              role: "Special Education Teacher",              company: "Inclusive Schools",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-senior-businessman-library_1262-2398.jpg",              imageAlt: "James Chen"
            },
            {
              id: "3",              name: "Dr. Pema Tshering",              role: "Advocacy Director",              company: "Bhutan Accessibility Network",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-woman-posing_23-2149429383.jpg",              imageAlt: "Dr. Pema Tshering"
            },
            {
              id: "4",              name: "Jennifer Williams",              role: "Children's Librarian",              company: "Community Libraries",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-library_23-2148680199.jpg",              imageAlt: "Jennifer Williams"
            },
            {
              id: "5",              name: "Michael Park",              role: "Parent & Advocate",              company: "Inclusion Matters",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/couple-enjoying-winter-home-lifestyle_23-2149198810.jpg",              imageAlt: "Michael Park"
            },
            {
              id: "6",              name: "Ana Rodriguez",              role: "Community Organizer",              company: "Global Hearts Initiative",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/close-up-people-with-clothes_23-2149196128.jpg",              imageAlt: "Ana Rodriguez"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="Testimonials from families and educators"
        />
      </div>

      <div id="cta" data-section="cta">
        <ContactCTA
          tag="Take Action"
          tagIcon={Heart}
          title="Let's Build a More Gentle World, Together"
          description="Join us in spreading kindness, inclusion, and the beautiful message that love knows no borders. Get Erika's book today and be part of this movement."
          buttons={[
            { text: "Get the Book", href: "#shop" },
            { text: "Learn About Advocacy", href: "#advocacy" }
          ]}
          buttonAnimation="slide-up"
          background={{ variant: "plain" }}
          useInvertedBackground={false}
          ariaLabel="Call to action for book purchase and advocacy"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Erika's World"
          columns={[
            {
              items: [
                { label: "Our Story", href: "#about" },
                { label: "The Book", href: "#book" },
                { label: "Shop", href: "#shop" }
              ]
            },
            {
              items: [
                { label: "Advocacy", href: "#advocacy" },
                { label: "About Us", href: "#about" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Follow Us", href: "#" }
              ]
            }
          ]}
          ariaLabel="Site footer with navigation"
        />
      </div>
    </ThemeProvider>
  );
}
