"use client";

import Link from "next/link";
import { Sparkles, Award, CheckCircle, Star, Heart, Mail, Instagram, Facebook, Linkedin } from "lucide-react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import MediaAbout from '@/components/sections/about/MediaAbout';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterCard from '@/components/sections/footer/FooterCard';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";

export default function HomePage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="reveal-blur"
      borderRadius="sharp"
      contentWidth="compact"
      sizing="medium"
      background="fluid"
      cardStyle="soft-shadow"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="solid"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered 
          brandName="Milano Atelier"
          navItems={[
            { name: "Collections", id: "/collections" },
            { name: "About", id: "/about" },
            { name: "Craft", id: "/about" },
            { name: "Contact", id: "/contact" }
          ]}
          button={{ text: "Shop Now", href: "/collections" }}
        />
      </div>

      <div id="hero" data-section="hero" className="py-24">
        <HeroBillboardCarousel 
          title="Timeless Elegance Crafted in Milan"
          description="Discover our exclusive collection of handcrafted luxury Italian clothing, where tradition meets contemporary sophistication. Each piece represents the pinnacle of artisanal excellence and refined taste."
          tag="Luxury Fashion"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          background={{ variant: "plain" }}
          buttons={[
            { text: "Explore Collections", href: "/collections" },
            { text: "Book Consultation", href: "/contact" }
          ]}
          buttonAnimation="slide-up"
          mediaItems={[
            { imageSrc: "https://img.b2bpic.net/free-photo/pretty-blonde-woman-with-wavy-hair-dressed-skirt-light-blouse-white-jacket-sits-chair_197531-33594.jpg", imageAlt: "Luxury clothing collection" },
            { imageSrc: "https://img.b2bpic.net/free-psd/elegant-young-woman-long-pink-satin-evening-gown_9975-132967.jpg?_wi=1", imageAlt: "Evening gown collection" },
            { imageSrc: "https://img.b2bpic.net/free-photo/side-view-man-choosing-jacket-shop_171337-18967.jpg?_wi=1", imageAlt: "Designer blazer" },
            { imageSrc: "https://img.b2bpic.net/free-photo/young-woman-wearing-handkerchief-as-neck-accessory_23-2149091380.jpg?_wi=1", imageAlt: "Luxury accessories" },
            { imageSrc: "https://img.b2bpic.net/free-photo/male-suit-close-up-holding-coffee-hand_1303-10298.jpg?_wi=1", imageAlt: "Premium tailored pieces" }
          ]}
          ariaLabel="Hero section showcasing luxury Italian clothing collections"
        />
      </div>

      <div id="about" data-section="about" className="py-20">
        <MediaAbout 
          title="Heritage of Italian Craftsmanship"
          description="Founded in the heart of Milan, Milano Atelier has been the custodian of Italian sartorial tradition for three generations. Our commitment to excellence is reflected in every stitch, every fabric selection, and every design we create. We believe that true luxury lies in the meticulous attention to detail and the masterful execution of timeless designs."
          tag="Our Story"
          tagIcon={Award}
          tagAnimation="slide-up"
          imageSrc="https://img.b2bpic.net/free-photo/suitmaker-tailor-cutting-fabric_482257-78193.jpg?_wi=1"
          imageAlt="Milano Atelier workshop showcasing Italian craftsmanship"
          buttons={[{ text: "Visit Our Atelier", href: "/contact" }]}
          buttonAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="products" data-section="products" className="py-20">
        <ProductCardThree 
          title="Featured Pieces"
          description="Curated selections from our current collections, each piece a masterpiece of Italian tailoring and design"
          tag="Exclusive"
          tagIcon={Star}
          tagAnimation="slide-up"
          products={[
            {
              id: "1",
              name: "Midnight Evening Gown",
              price: "€2,850",
              imageSrc: "https://img.b2bpic.net/free-psd/elegant-young-woman-long-pink-satin-evening-gown_9975-132967.jpg?_wi=2",
              imageAlt: "Midnight evening gown in silk charmeuse",
              initialQuantity: 1
            },
            {
              id: "2",
              name: "Tailored Wool Blazer",
              price: "€1,650",
              imageSrc: "https://img.b2bpic.net/free-photo/side-view-man-choosing-jacket-shop_171337-18967.jpg?_wi=2",
              imageAlt: "Classic tailored wool blazer",
              initialQuantity: 1
            },
            {
              id: "3",
              name: "Silk Twill Scarf",
              price: "€485",
              imageSrc: "https://img.b2bpic.net/free-photo/young-woman-wearing-handkerchief-as-neck-accessory_23-2149091380.jpg?_wi=2",
              imageAlt: "Hand-printed Italian silk scarf",
              initialQuantity: 1
            },
            {
              id: "4",
              name: "High-Waist Trousers",
              price: "€925",
              imageSrc: "https://img.b2bpic.net/free-photo/male-suit-close-up-holding-coffee-hand_1303-10298.jpg?_wi=2",
              imageAlt: "Premium tailored high-waist trousers",
              initialQuantity: 1
            }
          ]}
          gridVariant="two-columns-alternating-heights"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          buttonAnimation="slide-up"
          buttons={[{ text: "View All Collections", href: "/collections" }]}
        />
      </div>

      <div id="contact" data-section="contact" className="py-20">
        <ContactCTA 
          tag="Get in Touch"
          tagIcon={Mail}
          tagAnimation="slide-up"
          title="Experience Milano Atelier"
          description="Visit our atelier in the heart of Milan or schedule a private consultation. Our team is dedicated to helping you discover the perfect pieces that reflect your personal style and values."
          buttons={[
            { text: "Schedule Consultation", href: "/contact" },
            { text: "Visit Us", href: "/contact" }
          ]}
          buttonAnimation="slide-up"
          background={{ variant: "plain" }}
          useInvertedBackground={false}
        />
      </div>

      <FooterCard 
        logoText="Milano Atelier"
        copyrightText="© 2025 Milano Atelier | Crafted with Excellence in Milan"
        socialLinks={[
          { icon: Instagram, href: "https://instagram.com/milanog-atelier", ariaLabel: "Instagram" },
          { icon: Facebook, href: "https://facebook.com/milanog-atelier", ariaLabel: "Facebook" },
          { icon: Linkedin, href: "https://linkedin.com/company/milano-atelier", ariaLabel: "LinkedIn" }
        ]}
      />
    </ThemeProvider>
  );
}