"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Sparkles, Leaf, Flower2 } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="slide-background"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="small"
      sizing="mediumLargeSizeMediumTitles"
      background="circleGradient"
      cardStyle="layered-gradient"
      primaryButtonStyle="flat"
      secondaryButtonStyle="layered"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Magnolia"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Collections", id: "products" },
            { name: "Services", id: "features" },
            { name: "Testimonials", id: "testimonials" }
          ]}
          button={{
            text: "Order Now",            href: "contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Welcome to Magnolia Flowers Studio"
          description="Exquisite floral designs crafted with passion and artistry for every occasion. Experience the beauty of premium flower arrangements."
          background={{ variant: "sparkles-gradient" }}
          tag="Luxury Floral Design"
          tagIcon={Sparkles}
          buttons={[
            { text: "Browse Collections", href: "products" },
            { text: "Book Consultation", href: "contact" }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/white-blossoms-wellington-boot-textured-wooden-background_23-2147925513.jpg"
          imageAlt="Stunning magnolia flower arrangement"
        />
      </div>

      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            { type: "text", content: "Magnolia Flowers Studio brings" },
            { type: "image", src: "https://img.b2bpic.net/free-photo/beautiful-white-flowers-glass-bottle-with-water_23-2147925523.jpg", alt: "Magnolia flowers" },
            { type: "text", content: "artistry and expertise to every arrangement" }
          ]}
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Learn Our Story", href: "#" },
            { text: "View Services", href: "features" }
          ]}
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardOne
          title="Featured Collections"
          description="Discover our carefully curated selection of premium floral arrangements, each designed to elevate your special moments."
          tag="New Arrivals"
          tagIcon={Sparkles}
          products={[
            {
              id: "1",              name: "Bridal Bouquet",              price: "$185",              imageSrc: "https://img.b2bpic.net/free-photo/white-orchid-living-romm_268835-3707.jpg",              imageAlt: "Elegant bridal bouquet"
            },
            {
              id: "2",              name: "Seasonal Arrangement",              price: "$95",              imageSrc: "https://img.b2bpic.net/free-photo/white-orchidea-wreath-artificial-cage_114579-2102.jpg",              imageAlt: "Seasonal flower arrangement"
            },
            {
              id: "3",              name: "Corporate Elegance",              price: "$125",              imageSrc: "https://img.b2bpic.net/free-photo/white-purple-orchidea-flowers-branch_114579-2702.jpg",              imageAlt: "Corporate flower arrangement"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "View All Collections", href: "#" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwelve
          title="Our Services"
          description="Comprehensive floral solutions tailored to your needs and vision"
          tag="Services"
          tagIcon={Leaf}
          features={[
            {
              id: "custom-arrangements",              label: "Custom",              title: "Bespoke Floral Arrangements",              items: [
                "Personalized design consultation",                "Premium flower selection",                "Detailed styling and execution",                "Same-day delivery available"
              ],
              buttons: [
                { text: "Order Custom", href: "contact" }
              ]
            },
            {
              id: "wedding-flowers",              label: "Wedding",              title: "Wedding & Event Florals",              items: [
                "Complete event floral design",                "Bridal bouquets and accessories",                "Venue decorations",                "Dedicated day-of coordination"
              ],
              buttons: [
                { text: "Plan Your Wedding", href: "contact" }
              ]
            }
          ]}
          animationType="opacity"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="Magnolia Flowers Studio created the most breathtaking bridal bouquet for my wedding day. Every detail was perfect, and the team's attention to artistry was unmatched. Highly recommend!"
          rating={5}
          author="Sarah Mitchell, Bride"
          avatars={[
            { src: "https://img.b2bpic.net/free-photo/smiling-young-professional-businesswoman-looking-upper-left-corner-with-hopeful-face-expression-standing-white_176420-41313.jpg", alt: "Sarah Mitchell" },
            { src: "https://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg", alt: "Emma Richardson" },
            { src: "https://img.b2bpic.net/free-photo/studio-portrait-successful-young-businesswoman_1262-5844.jpg", alt: "Jessica Thompson" },
            { src: "https://img.b2bpic.net/free-photo/hopeful-young-manager-businesswoman-cross-arms-chest-smiling-looking-confident-like-real-professional-white-background_176420-47052.jpg", alt: "Rachel Martinez" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Newsletter"
          title="Get Inspired"
          description="Subscribe to our floral design tips, seasonal collections, and exclusive offers delivered to your inbox."
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-photo/white-flower-twig-bottle-with-water-against-rustic-background_23-2147925522.jpg"
          imageAlt="Beautiful floral arrangement for inspiration"
          mediaPosition="right"
          tagIcon={Flower2}
          inputPlaceholder="Enter your email"
          buttonText="Subscribe"
          termsText="By subscribing, you agree to receive updates from Magnolia Flowers Studio. Unsubscribe anytime."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Magnolia"
          columns={[
            {
              items: [
                { label: "Home", href: "hero" },
                { label: "Collections", href: "products" },
                { label: "Services", href: "features" }
              ]
            },
            {
              items: [
                { label: "About Us", href: "about" },
                { label: "Testimonials", href: "testimonials" },
                { label: "Contact", href: "contact" }
              ]
            },
            {
              items: [
                { label: "Custom Orders", href: "contact" },
                { label: "Wedding Flowers", href: "features" },
                { label: "Consultations", href: "contact" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}