"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureProcessSteps from '@/components/sections/feature/FeatureProcessSteps';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Flower2, Heart, Award, Globe, Sparkles, HelpCircle, Mail } from 'lucide-react';

export default function HomePage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="mediumSmall"
      sizing="mediumLargeSizeMediumTitles"
      background="aurora"
      cardStyle="soft-shadow"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="layered"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Flowers Life"
          navItems={[
            { name: "Home", id: "/" },
            { name: "Services", id: "/services" },
            { name: "Gallery", id: "/gallery" },
            { name: "Contact", id: "/contact" }
          ]}
          button={{ text: "Book Consultation", href: "/contact" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogo
          logoText="Flowers Life"
          description="Celebrating nature's beauty through exquisite floral artistry and design"
          buttons={[
            { text: "Explore Services", href: "/services" },
            { text: "View Gallery", href: "/gallery" }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/beautiful-boho-flowers-assortment_23-2149526015.jpg"
          imageAlt="Beautiful floral arrangement background"
          showDimOverlay={true}
          logoLineHeight={1.2}
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric
          title="At Flowers Life, we believe every bloom tells a story and every arrangement transforms spaces into moments of beauty"
          useInvertedBackground="noInvert"
          metrics={[
            { icon: Flower2, label: "Floral Designs Created", value: "2,500+" },
            { icon: Heart, label: "Happy Customers", value: "1,200+" },
            { icon: Award, label: "Years of Excellence", value: "15+" },
            { icon: Globe, label: "Events Celebrated", value: "800+" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureProcessSteps
          tag="Our Expertise"
          tagIcon={Sparkles}
          title="Creating Botanical Masterpieces"
          description="Our meticulous process ensures every arrangement reflects your vision and emotions, from initial consultation to final presentation."
          buttons={[
            { text: "Start Your Order", href: "/contact" }
          ]}
          steps={[
            {
              number: "01",              title: "Consultation",              tag: "Discovery",              description: "We listen to your ideas, preferences, and the occasion to understand your vision completely."
            },
            {
              number: "02",              title: "Design & Selection",              tag: "Creation",              description: "Our expert florists design a custom arrangement using premium, freshly sourced flowers."
            },
            {
              number: "03",              title: "Crafting",              tag: "Artistry",              description: "Each stem is carefully arranged with precision, ensuring structural integrity and visual harmony."
            },
            {
              number: "04",              title: "Delivery & Beyond",              tag: "Care",              description: "We ensure timely delivery with care instructions to keep your arrangement fresh and beautiful."
            }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardThree
          title="Signature Collections"
          description="Explore our carefully curated floral arrangements, each designed to bring joy and elegance to your special moments"
          tag="Premium Selections"
          tagIcon={Sparkles}
          products={[
            {
              id: "1",              name: "Romantic Rose Bouquet",              price: "$85",              imageSrc: "https://img.b2bpic.net/free-photo/rose-wooden-background_1232-2088.jpg",              imageAlt: "Premium rose bouquet",              initialQuantity: 1
            },
            {
              id: "2",              name: "Wedding Day Elegance",              price: "$250",              imageSrc: "https://img.b2bpic.net/free-photo/bouquet-roses-with-red-bow_23-2147591160.jpg",              imageAlt: "Wedding flower arrangement",              initialQuantity: 1
            },
            {
              id: "3",              name: "Seasonal Celebration",              price: "$95",              imageSrc: "https://img.b2bpic.net/free-photo/elevated-view-red-rose-flower-vase_23-2148181221.jpg",              imageAlt: "Seasonal flower mix",              initialQuantity: 1
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          gridVariant="three-columns-all-equal-width"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="Flowers Life transformed our wedding venue into a floral paradise. Every detail was perfect, and the quality was beyond our expectations. They truly understand the art of celebration through flowers."
          rating={5}
          author="Jessica & Michael Thompson"
          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: "Jessica Thompson" },
            { src: "https://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg", alt: "Michael Thompson" },
            { src: "https://img.b2bpic.net/free-photo/studio-portrait-successful-young-businesswoman_1262-5844.jpg", alt: "Happy customer" },
            { 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: "Satisfied client" },
            { 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: "Customer review" },
            { src: "https://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg", alt: "Client feedback" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Find answers to your questions about our services, delivery, and care instructions"
          tag="Support"
          tagIcon={HelpCircle}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "How far in advance should I order?",              content: "We recommend ordering at least 3-5 days in advance for custom arrangements. For rush orders, please contact us directly as we can often accommodate same-day or next-day delivery depending on availability."
            },
            {
              id: "2",              title: "Do you offer wedding and event services?",              content: "Absolutely! We specialize in wedding florals, corporate events, and special occasions. We provide comprehensive design consultations to ensure your vision comes to life. Contact us for a custom proposal."
            },
            {
              id: "3",              title: "What is your delivery area?",              content: "We deliver throughout the metropolitan area and surrounding regions. For out-of-area orders, we can arrange coordination with trusted partner florists to ensure quality delivery."
            },
            {
              id: "4",              title: "How should I care for my arrangement?",              content: "Keep flowers in cool water away from direct sunlight and heat. Change the water every 2-3 days and trim stems at a 45-degree angle. We provide detailed care instructions with every arrangement."
            },
            {
              id: "5",              title: "Can you accommodate allergies or preferences?",              content: "Yes! We can work around allergies, color preferences, and specific flower requests. Please mention any preferences during consultation so we can create the perfect arrangement for you."
            },
            {
              id: "6",              title: "What payment methods do you accept?",              content: "We accept all major credit cards, digital payments, and bank transfers. A 50% deposit is required to confirm bookings, with the balance due before delivery."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Get In Touch"
          tagIcon={Mail}
          title="Ready to bring your vision to life?"
          description="Join our mailing list to stay updated on seasonal collections, special promotions, and floral inspiration."
          inputPlaceholder="Enter your email address"
          buttonText="Subscribe"
          termsText="We respect your privacy and will never share your email. Unsubscribe anytime."
          useInvertedBackground="noInvert"
        />
      </div>

      <FooterLogoReveal logoText="Flowers Life" />
    </ThemeProvider>
  );
}