"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import SplitAboutCards from '@/components/sections/about/SplitAboutCards';
import FeatureCardTwenty from '@/components/sections/feature/FeatureCardTwenty';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Heart, Mail, Sparkles, Star } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="sharp"
      contentWidth="small"
      sizing="smallSizeLargeTitles"
      background="floatingGradient"
      cardStyle="floating"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="outline"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Products", id: "feature" },
            { name: "Contact", id: "contact" },
            { name: "Giving Back", id: "metric" }
          ]}
          brandName="Moroccan Bakery"
          logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766162773520-d3l7c32r.jpg"
          logoAlt="Moroccan Bakery Logo"
          bottomLeftText="Family Owned Since 2010"
          bottomRightText="orders@moroccanpastries.com"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardScroll
          title="Ethically Sourced Moroccan Pastries"
          description="Handcrafted with love by our family bakery. Every bite supports our commitment to quality, tradition, and giving back to our community."
          tag="Family Owned & Ethical"
          tagIcon={Heart}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766245914004-rta09f98.jpg"
          imageAlt="Golden Moroccan pastries fresh from the bakery"
          buttons={[
            { text: "Order Now", href: "contact" },
            { text: "Learn More", href: "about" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <SplitAboutCards
          title="Our Story"
          description="Started by our grandmother in Morocco, our family bakery brings authentic recipes and ethical values to every pastry. We believe in honest ingredients, fair practices, and making a difference."
          tag="Family Heritage"
          features={[
            {
              id: "ethical-sourcing",
              title: "Ethically Sourced",
              description: "All ingredients sourced from fair-trade suppliers and local producers who share our commitment to quality and community.",
              label: "100% Ethical"
            },
            {
              id: "charity-giving",
              title: "Charity Giving",
              description: "A portion of every purchase goes directly to local charities supporting food security and education in our community.",
              label: "Giving Back"
            }
          ]}
          buttons={[{ text: "Read Full Story", href: "#" }]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="feature" data-section="feature">
        <FeatureCardTwenty
          images={[
            {
              id: 1,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766245914997-wo2j0unx.jpg",
              imageAlt: "Almond and honey baklava"
            },
            {
              id: 2,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766245915923-b1ivl61z.jpg",
              imageAlt: "Delicate phyllo pastry layers"
            },
            {
              id: 3,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766245916839-74vg230k.jpg",
              imageAlt: "Date and almond filled pastries"
            },
            {
              id: 4,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766245917685-45ajkf5b.jpg",
              imageAlt: "Savory spinach and feta pastry"
            }
          ]}
          title="Our Signature Pastries"
          description="Each pastry is handcrafted using traditional Moroccan techniques passed down through generations. We use only the finest organic ingredients to create pastries that taste as authentic as they look."
          tag="Artisan Crafted"
          tagIcon={Sparkles}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          buttons={[{ text: "View All Products", href: "contact" }]}
        />
      </div>

      <div id="metric" data-section="metric">
        <MetricCardFourteen
          title="Our commitment to giving back and ethical practices has created real impact for our community."
          tag="Impact & Values"
          metrics={[
            {
              id: "1",
              value: "$50K+",
              description: "Donated to local charities supporting food security and youth education programs"
            },
            {
              id: "2",
              value: "100%",
              description: "of our ingredients ethically sourced from fair-trade and sustainable suppliers"
            }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonial" data-section="testimonial">
        <TestimonialCardTwelve
          testimonials={[
            {
              id: "1",
              name: "Sarah Johnson",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766245919968-9vhvqd14.jpg",
              imageAlt: "Sarah Johnson"
            },
            {
              id: "2",
              name: "Michael Chen",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766245920754-l4cqyyki.jpg",
              imageAlt: "Michael Chen"
            },
            {
              id: "3",
              name: "Emma Williams",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766245921797-npjio3ch.jpg",
              imageAlt: "Emma Williams"
            },
            {
              id: "4",
              name: "David Martinez",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766245922650-m2lwe26o.jpg",
              imageAlt: "David Martinez"
            }
          ]}
          cardTitle="Loved by thousands of customers who trust our quality and values"
          cardTag="Customer Love"
          cardTagIcon={Star}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Get in Touch"
          title="Order Your Pastries"
          description="Subscribe to our newsletter for fresh pastry updates, special seasonal offerings, and exclusive ordering information. Join our community of pastry lovers."
          tagIcon={Mail}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183584228-m2bixr3w.jpg"
          imageAlt="Fresh pastries ready to order"
          mediaPosition="right"
          inputPlaceholder="Enter your email"
          buttonText="Subscribe"
          termsText="We respect your privacy. You can unsubscribe anytime."
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766162773520-d3l7c32r.jpg"
          logoAlt="Moroccan Bakery"
          logoText="Moroccan Bakery"
        />
      </div>
    </ThemeProvider>
  );
}