"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroCentered from '@/components/sections/hero/HeroCentered';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="slide-background"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="mediumLarge"
      sizing="largeSmallSizeMediumTitles"
      background="aurora"
      cardStyle="gradient-mesh"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="solid"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Blago"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Services", id: "feature" },
            { name: "Gallery", id: "product" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Order Now",            href: "contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCentered
          title="Blago - Artisan Floral Design Studio"
          description="Exquisite floral arrangements crafted with passion and expertise. From intimate celebrations to grand events, we create unforgettable moments with nature's finest blooms."
          background={{ variant: "downward-rays-animated" }}
          avatars={[
            {
              src: "https://img.b2bpic.net/free-photo/close-up-portrait-young-bearded-man-white-shirt-jacket-posing-camera-with-broad-smile-isolated-gray_171337-629.jpg",              alt: "Client 1"
            },
            {
              src: "https://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg",              alt: "Client 2"
            },
            {
              src: "https://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg",              alt: "Client 3"
            }
          ]}
          avatarText="Trusted by 500+ satisfied clients"
          buttons={[
            {
              text: "Browse Arrangements",              href: "product"
            },
            {
              text: "Learn Our Story",              href: "about"
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            {
              type: "text",              content: "Premium floral artistry meets sustainable practices. At Blago, every arrangement tells a story of nature's beauty and our passion for perfection."
            }
          ]}
          useInvertedBackground="noInvert"
          buttons={[
            {
              text: "Our Services",              href: "feature"
            },
            {
              text: "View Portfolio",              href: "product"
            }
          ]}
        />
      </div>

      <div id="feature" data-section="feature">
        <FeatureCardTwentyThree
          title="Our Specialized Services"
          description="Discover the full range of bespoke floral services we offer for every occasion and celebration."
          features={[
            {
              id: "1",              title: "Wedding Bouquets & Ceremonies",              tags: ["Weddings", "Custom Design"],
              imageSrc: "https://img.b2bpic.net/free-photo/mixed-flower-composition-side-vieq_140725-9166.jpg"
            },
            {
              id: "2",              title: "Corporate Event Arrangements",              tags: ["Events", "Bulk Orders"],
              imageSrc: "https://img.b2bpic.net/free-photo/pretty-decoration-with-pink-flowers_23-2147609386.jpg"
            },
            {
              id: "3",              title: "Weekly Subscription Boxes",              tags: ["Subscriptions", "Fresh Delivery"],
              imageSrc: "https://img.b2bpic.net/free-photo/woman-holding-bouquet-yellow-orange-dahliason-light-background_169016-39443.jpg"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="product" data-section="product">
        <ProductCardTwo
          title="Curated Gallery"
          description="Browse our collection of stunning floral arrangements, each one a masterpiece of color, texture, and design."
          products={[
            {
              id: "1",              brand: "Blago Premium",              name: "Rose Romance Collection",              price: "$185",              rating: 5,
              reviewCount: "342",              imageSrc: "https://img.b2bpic.net/free-photo/cream-color-purple-set-flowers-flower-art_114579-2483.jpg",              imageAlt: "Premium rose bouquet arrangement"
            },
            {
              id: "2",              brand: "Blago Spring",              name: "Tulip Garden Bouquet",              price: "$145",              rating: 5,
              reviewCount: "218",              imageSrc: "https://img.b2bpic.net/free-photo/side-view-pink-lilac-color-roses-flowers-composition-wooden-box_140725-12179.jpg",              imageAlt: "Colorful tulip arrangement"
            },
            {
              id: "3",              brand: "Blago Sunshine",              name: "Sunflower Dream Bundle",              price: "$165",              rating: 5,
              reviewCount: "189",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-pretty-floral-decoration_23-2147609389.jpg",              imageAlt: "Bright sunflower arrangement"
            },
            {
              id: "4",              brand: "Blago Luxury",              name: "Peony Elegance Collection",              price: "$245",              rating: 5,
              reviewCount: "267",              imageSrc: "https://img.b2bpic.net/free-photo/bouquet-single-autumn-flowers-around-table_114579-1730.jpg",              imageAlt: "Elegant peony arrangement"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonial" data-section="testimonial">
        <TestimonialCardTwelve
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              imageSrc: "https://img.b2bpic.net/free-photo/smiling-businessman-face-portrait-wearing-suit_53876-148135.jpg"
            },
            {
              id: "2",              name: "Michael Chen",              imageSrc: "https://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5367.jpg"
            },
            {
              id: "3",              name: "Emma Rodriguez",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-caucasian-unshaved-man-eyeglasses-looking-camera-with-sincere-smile-isolated-gray_171337-630.jpg"
            },
            {
              id: "4",              name: "David Kim",              imageSrc: "https://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg"
            }
          ]}
          cardTitle="Over 2,000 customers trust Blago for their most cherished moments"
          cardTag="See what they say"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Start Your Floral Journey"
          description="Ready to create something beautiful? Reach out to our team and let's discuss your floral vision. We're here to bring your dreams to life."
          inputs={[
            {
              name: "name",              type: "text",              placeholder: "Your Name",              required: true
            },
            {
              name: "email",              type: "email",              placeholder: "Email Address",              required: true
            },
            {
              name: "phone",              type: "tel",              placeholder: "Phone Number",              required: false
            },
            {
              name: "occasion",              type: "text",              placeholder: "What's the occasion?",              required: true
            }
          ]}
          textarea={{
            name: "message",            placeholder: "Tell us about your floral vision and preferences...",            rows: 5,
            required: true
          }}
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-photo/cozy-pretty-bouquet-blue-purple-combination-flowers_114579-1547.jpg"
          imageAlt="Floral workspace and design"
          mediaPosition="right"
          buttonText="Request Consultation"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Blago"
          columns={[
            {
              items: [
                { label: "Home", href: "hero" },
                { label: "About", href: "about" },
                { label: "Services", href: "feature" }
              ]
            },
            {
              items: [
                { label: "Gallery", href: "product" },
                { label: "Testimonials", href: "testimonial" },
                { label: "Contact", href: "contact" }
              ]
            },
            {
              items: [
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Facebook", href: "https://facebook.com" },
                { label: "Pinterest", href: "https://pinterest.com" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}