"use client"

import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="mediumSmall"
      sizing="large"
      background="none"
      cardStyle="glass-depth"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleMinimal
          brandName="ATELIER"
          button={{
            text: "Shop",            href: "#products"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogo
          logoText="ATELIER"
          description="Curated luxury streetwear inspired by Parisian craftsmanship. Limited editions. Bold statements."
          buttons={[
            {
              text: "Explore Collection",              href: "#products"
            },
            {
              text: "About Us",              href: "#about"
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/young-handsome-african-american-man-posing-outdoors-paris-happy-smile-fashion-style-lights-evening-cafes_1321-3400.jpg"
          imageAlt="Luxury streetwear editorial photography"
          showDimOverlay={true}
          logoLineHeight={1}
        />
      </div>

      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            {
              type: "text",              content: "Haute"
            },
            {
              type: "image",              src: "https://img.b2bpic.net/free-photo/full-shot-woman-stairs-outdoors_23-2148760471.jpg",              alt: "Atelier"
            },
            {
              type: "text",              content: "Streetwear"
            }
          ]}
          buttons={[
            {
              text: "Our Story",              href: "#contact"
            }
          ]}
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardThree
          title="Curated Selection"
          description="Each piece handpicked for bold expression and timeless design"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          products={[
            {
              id: "1",              name: "Oversized Wool Jacket",              price: "$485",              imageSrc: "https://img.b2bpic.net/free-photo/handsome-adult-man-posing-outdoors_23-2148466091.jpg",              imageAlt: "Oversized wool jacket in black",              initialQuantity: 1
            },
            {
              id: "2",              name: "Essential Hoodie",              price: "$295",              imageSrc: "https://img.b2bpic.net/free-photo/handsome-men-outdoors-sun_23-2148803615.jpg",              imageAlt: "Premium essential hoodie",              initialQuantity: 1
            },
            {
              id: "3",              name: "Tailored Trousers",              price: "$385",              imageSrc: "https://img.b2bpic.net/free-photo/handsome-adult-male-posing-with-sunglasses_23-2148466092.jpg",              imageAlt: "Tailored luxury trousers",              initialQuantity: 1
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardNineteen
          title="Crafted for Distinction"
          description="Three pillars define every ATELIER creation"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          features={[
            {
              id: 1,
              tag: "ARTISANSHIP",              title: "Handcrafted Quality",              subtitle: "Master techniques meet modern design",              description: "Each piece is constructed with meticulous attention to detail, honoring traditional Parisian tailoring methods while embracing contemporary streetwear innovation.",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-engraving-art-tools_23-2149186734.jpg",              imageAlt: "Artisan craftsmanship detail"
            },
            {
              id: 2,
              tag: "MATERIALS",              title: "Premium Fabrics",              subtitle: "Only the finest textiles selected",              description: "We source exclusive fabrics from European mills, ensuring every garment feels luxurious and performs beautifully. Quality that lasts generations.",              imageSrc: "https://img.b2bpic.net/free-photo/stunning-african-man-posing-with-gently-smile-stairs-handsome-guy-checkered-jacket-sitting-steps-evening_197531-22068.jpg",              imageAlt: "Premium fabric details"
            },
            {
              id: 3,
              tag: "DESIGN",              title: "Bold Expression",              subtitle: "Minimalist silhouettes with maximum impact",              description: "Clean lines, unexpected proportions, and thoughtful details create pieces that transcend trends. Fashion for those who lead, not follow.",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-cobbler-doing-measurments-shoe_171337-12243.jpg",              imageAlt: "Design process"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="Voices of Distinction"
          description="Celebrated by those who understand true luxury"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          testimonials={[
            {
              id: "1",              name: "Margot Beaumont",              role: "Fashion Editor",              company: "Vogue Paris",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/dreamy-curly-woman-pink-suit-sitting-near-mirror_197531-16809.jpg",              imageAlt: "Margot Beaumont"
            },
            {
              id: "2",              name: "Claude Leclerc",              role: "Luxury Designer",              company: "Saint Laurent Legacy",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/european-woman-with-bright-make-up-elegant-outfit-preparing-birthday-party_291650-580.jpg",              imageAlt: "Claude Leclerc"
            },
            {
              id: "3",              name: "Sophia Rousseau",              role: "Style Icon",              company: "Parisian Influencer",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/confident-beautiful-young-woman-portrait_23-2148148150.jpg",              imageAlt: "Sophia Rousseau"
            },
            {
              id: "4",              name: "Antoine Moreau",              role: "Fashion Critic",              company: "Le Monde Luxe",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/curly-woman-eyeglasses-grey-jacket-smiling-taking-selfie_197531-27156.jpg",              imageAlt: "Antoine Moreau"
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Join the Movement"
          description="Subscribe for exclusive drops, early access, and stories from the atelier."
          inputs={[
            {
              name: "name",              type: "text",              placeholder: "Your name",              required: true
            },
            {
              name: "email",              type: "email",              placeholder: "your@email.com",              required: true
            }
          ]}
          textarea={{
            name: "message",            placeholder: "Your thoughts...",            rows: 4,
            required: false
          }}
          useInvertedBackground="invertDefault"
          imageSrc="https://img.b2bpic.net/free-photo/elegant-woman-posing-near-piano-stylish-light-room_273443-4278.jpg"
          imageAlt="Luxury atelier studio"
          mediaPosition="right"
          buttonText="Subscribe"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={[
            {
              title: "Shop",              items: [
                {
                  label: "New Arrivals",                  href: "#products"
                },
                {
                  label: "All Collections",                  href: "#products"
                },
                {
                  label: "Limited Editions",                  href: "#products"
                }
              ]
            },
            {
              title: "About",              items: [
                {
                  label: "Our Story",                  href: "#about"
                },
                {
                  label: "Craftsmanship",                  href: "#features"
                },
                {
                  label: "Contact",                  href: "#contact"
                }
              ]
            },
            {
              title: "Legal",              items: [
                {
                  label: "Privacy Policy",                  href: "#"
                },
                {
                  label: "Terms of Service",                  href: "#"
                },
                {
                  label: "Returns & Exchanges",                  href: "#"
                }
              ]
            }
          ]}
          copyrightText="© 2025 ATELIER. Crafted in Paris."
        />
      </div>
    </ThemeProvider>
  );
}