"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import { Award, Sparkles, Star } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-shift"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="compact"
        sizing="largeSmall"
        background="circleGradient"
        cardStyle="glass-depth"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="glass"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        {
          name: "Home",          id: "#hero"},
        {
          name: "About",          id: "#about"},
        {
          name: "Products",          id: "#products"},
        {
          name: "Shop",          id: "/shop"},
        {
          name: "Features",          id: "#features"},
        {
          name: "Testimonials",          id: "#testimonials"},
        {
          name: "Contact",          id: "#contact"},
        {
          name: "Cart",          id: "/cart"},
        {
          name: "Signup",          id: "/signup"},
        {
          name: "Order History",          id: "/order-history"},
        {
          name: "Account",          id: "/account"},
      ]}
      logoSrc="http://img.b2bpic.net/free-vector/wedding-badge-vector-gold-vintage-ornamental-style_53876-140182.jpg"
      logoAlt="Elegance Atelier Logo"
      brandName="Elegance Atelier"
      button={{
        text: "Login",        href: "/login"}}
      animateOnLoad={true}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroLogo
      logoText="Elegance Atelier"
      description="Discover a world of unparalleled luxury and exquisite craftsmanship. Each piece curated for the discerning individual."
      buttons={[
        {
          text: "Explore Collection",          href: "#products"},
        {
          text: "Learn Our Story",          href: "#about"},
      ]}
      buttonAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/beautiful-stylish-elegant-silver-wedding-shoes-chair_8353-75.jpg"
      imageAlt="Luxurious boutique interior with elegant displays"
      showDimOverlay={true}
    />
  </div>

  <div id="about" data-section="about">
      <InlineImageSplitTextAbout
      useInvertedBackground={true}
      heading={[
        {
          type: "text",          content: "Crafting "},
        {
          type: "text",          content: "Timeless "},
        {
          type: "text",          content: "Luxury"},
      ]}
      buttons={[
        {
          text: "Our Philosophy",          href: "#"},
      ]}
      buttonAnimation="slide-up"
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardFour
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      products={[
        {
          id: "watch-1",          name: "Chronos Elegance Watch",          price: "$5,200",          variant: "Rose Gold",          imageSrc: "http://img.b2bpic.net/free-photo/groom-fastens-buttons-his-wedding-suit_8353-10664.jpg",          imageAlt: "Luxury rose gold watch"},
        {
          id: "handbag-1",          name: "Empress Alligator Handbag",          price: "$8,900",          variant: "Midnight Black",          imageSrc: "http://img.b2bpic.net/free-photo/happy-father-s-day-composition-father-s-day-top-view_185193-109773.jpg",          imageAlt: "Designer alligator handbag"},
        {
          id: "scarf-1",          name: "Versailles Silk Scarf",          price: "$450",          variant: "Emerald Green",          imageSrc: "http://img.b2bpic.net/free-photo/top-view-pinecone-beige-shawl-dark-surface_140725-63513.jpg",          imageAlt: "Elegant silk scarf"},
        {
          id: "earrings-1",          name: "Celestial Diamond Earrings",          price: "$3,800",          variant: "Platinum",          imageSrc: "http://img.b2bpic.net/free-photo/moment-before-kiss-young-beautiful-caucasian-couple-sunny-day-outdoors_8353-10690.jpg",          imageAlt: "Sparkling diamond earrings"},
        {
          id: "pen-1",          name: "Sovereign Fountain Pen",          price: "$1,100",          variant: "Obsidian Black",          imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-pen-ai-generated_23-2150695517.jpg",          imageAlt: "Luxury fountain pen"},
        {
          id: "cufflinks-1",          name: "Aristocrat Cufflinks",          price: "$680",          variant: "Sterling Silver",          imageSrc: "http://img.b2bpic.net/free-photo/grooms-morning-preparation_1328-1774.jpg",          imageAlt: "Sterling silver cufflinks"},
      ]}
      title="Our Exquisite Collection"
      description="Indulge in our selection of finely crafted pieces, designed to elevate your lifestyle."
      buttons={[
        {
          text: "View All Products",          href: "#"},
      ]}
      buttonAnimation="slide-up"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentySeven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      features={[
        {
          id: "feature-1",          title: "Bespoke Services",          descriptions: [
            "Tailored creations crafted exclusively for you, ensuring a unique and personal touch."],
          imageSrc: "http://img.b2bpic.net/free-photo/image-male-hand-pointing-business-document-discussion-meeting_1423-242.jpg",          imageAlt: "Tailor taking measurements for a bespoke suit"},
        {
          id: "feature-2",          title: "Uncompromised Quality",          descriptions: [
            "We source only the finest materials, guaranteeing durability, beauty, and lasting value."],
          imageSrc: "http://img.b2bpic.net/free-photo/overhead-view-shiny-pink-green-yellow-diamonds-colored-backdrop_23-2147948773.jpg",          imageAlt: "Close-up of fine leather texture"},
        {
          id: "feature-3",          title: "Exclusive Invitations",          descriptions: [
            "Gain access to private viewings, launch events, and curated luxury experiences."],
          imageSrc: "http://img.b2bpic.net/free-photo/mannequins-clothes-shop_23-2147652033.jpg",          imageAlt: "Guests at an exclusive luxury event"},
      ]}
      title="Our Signature Excellence"
      description="Experience the distinction of Elegance Atelier with services and qualities designed for your utmost satisfaction."
      buttons={[
        {
          text: "Discover More",          href: "#"},
      ]}
      buttonAnimation="slide-up"
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "test-1",          name: "Isabella Rossi",          date: "March 2024",          title: "Exquisite Craftsmanship",          quote: "The handbag I purchased is a true masterpiece. The attention to detail and quality of the leather are simply breathtaking.",          tag: "Luxury Handbags",          avatarSrc: "http://img.b2bpic.net/free-photo/gorgeous-smiling-blonde-fashion-model-sits-white-suit-soft-armchair_8353-5476.jpg",          avatarAlt: "Isabella Rossi's avatar",          imageSrc: "http://img.b2bpic.net/free-photo/elegant-woman-with-cup-coffee-bag-making-thumbs-up-high-quality-photo_114579-52841.jpg",          imageAlt: "Woman admiring a luxury handbag"},
        {
          id: "test-2",          name: "Julian Thorne",          date: "February 2024",          title: "Unmatched Elegance",          quote: "My new timepiece from Elegance Atelier is a statement of sophistication. It's more than a watch; it's a legacy.",          tag: "Fine Watches",          avatarSrc: "http://img.b2bpic.net/free-photo/confident-young-businessman-modern-luxury-office-generated-by-ai_188544-17326.jpg",          avatarAlt: "Julian Thorne's avatar",          imageSrc: "http://img.b2bpic.net/free-photo/cabinetmaker-apprentice-inspecting-lumber-block-damages_482257-84366.jpg",          imageAlt: "Man wearing a luxury watch"},
        {
          id: "test-3",          name: "Sophia Dubois",          date: "January 2024",          title: "Jewelry Beyond Compare",          quote: "The diamond earrings are absolutely stunning. Every facet sparkles with exceptional brilliance. A truly special gift.",          tag: "Precious Jewelry",          avatarSrc: "http://img.b2bpic.net/free-photo/joyful-lady-with-dark-curly-hair-sunglasses-white-jacket-sitting-stairs-street-happily-looking-camera-while-showing-two-fingers-gesture_574295-5941.jpg",          avatarAlt: "Sophia Dubois's avatar",          imageSrc: "http://img.b2bpic.net/free-photo/happy-couple-love-paying-with-credit-card-jewelry-stor_7502-7614.jpg",          imageAlt: "Woman trying on diamond earrings"},
        {
          id: "test-4",          name: "Marcus Chen",          date: "December 2023",          title: "Superior Service",          quote: "The shopping experience was as luxurious as the products. Impressed by the personalized attention and swift delivery.",          tag: "Exclusive Service",          avatarSrc: "http://img.b2bpic.net/free-photo/happy-business-woman-standing-with-crossed-arms_23-2148095676.jpg",          avatarAlt: "Marcus Chen's avatar",          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-model-posing-with-checkered-plaid-near-christmas-balls_114579-66827.jpg",          imageAlt: "Woman holding a silk scarf"},
        {
          id: "test-5",          name: "Eleanor Vance",          date: "November 2023",          title: "Investment in Style",          quote: "Each acquisition from Elegance Atelier feels like an investment in timeless style and impeccable quality. Highly recommended.",          tag: "Timeless Appeal",          avatarSrc: "http://img.b2bpic.net/free-photo/low-angle-business-woman-holding-glasses_23-2148317324.jpg",          avatarAlt: "Eleanor Vance's avatar",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-middle-aged-blonde-rich-woman-with-banknotes-purse_23-2149668380.jpg",          imageAlt: "Man browsing a luxury catalog"},
      ]}
      title="Voices of Distinction"
      description="Our esteemed clientele share their experiences with Elegance Atelier's unparalleled products and service."
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={true}
      names={[
        "Vogue",        "Haute Horlogerie",        "Noble Estates",        "Imperial Fashion",        "Grand Jewels",        "Elite Tailors",        "Gourmet & Co."]}
      title="Trusted by Luxury Partners"
      description="Collaborating with the most prestigious names in high fashion and exquisite craftsmanship."
      buttons={[
        {
          text: "Partnership Inquiries",          href: "#contact"},
      ]}
      buttonAnimation="slide-up"
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardFive
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      plans={[
        {
          id: "silver",          tag: "Essential",          tagIcon: Star,
          price: "Complimentary",          period: "for all clients",          description: "Access to our standard curated collection and seasonal lookbooks.",          button: {
            text: "Join Silver",            href: "#"},
          featuresTitle: "Includes:",          features: [
            "Priority Email Support",            "Member-Exclusive Newsletters",            "Early Sale Access"],
        },
        {
          id: "gold",          tag: "Elite",          tagIcon: Award,
          price: "$500",          period: "per annum",          description: "Elevate your experience with personalized services and enhanced privileges.",          button: {
            text: "Upgrade to Gold",            href: "#"},
          featuresTitle: "Everything in Silver, plus:",          features: [
            "Dedicated Personal Shopper",            "Invitation to Private Viewings",            "Complimentary Gift Wrapping",            "Early Access to New Collections"],
        },
        {
          id: "platinum",          tag: "Prestige",          tagIcon: Sparkles,
          price: "$2,000",          period: "per annum",          description: "The ultimate luxury experience, offering bespoke attention and unparalleled access.",          button: {
            text: "Enroll in Platinum",            href: "#"},
          featuresTitle: "Everything in Gold, plus:",          features: [
            "Bespoke Design Consultations",            "Exclusive Concierge Service",            "Private Atelier Appointments",            "First Access to Limited Editions"],
        },
      ]}
      title="Elegance Club Membership"
      description="Unlock exclusive benefits and personalize your luxury experience with our tiered membership options."
      buttons={[
        {
          text: "View Membership Benefits",          href: "#"},
      ]}
      buttonAnimation="slide-up"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="default"
      useInvertedBackground={true}
      faqs={[
        {
          id: "faq-1",          title: "What is your return policy for luxury items?",          content: "Due to the exclusive nature of our luxury items, returns are accepted within 14 days of purchase, provided the item is in its original condition with all tags and packaging intact. Bespoke items are non-returnable."},
        {
          id: "faq-2",          title: "Do you offer international shipping?",          content: "Yes, Elegance Atelier provides insured international shipping to most countries. Shipping costs and delivery times vary by destination. Please refer to our shipping policy for details."},
        {
          id: "faq-3",          title: "How can I authenticate my purchase?",          content: "Every item from Elegance Atelier comes with a certificate of authenticity and a unique serial number. For further verification, you may contact our customer service team."},
        {
          id: "faq-4",          title: "Do you offer repair or maintenance services?",          content: "We offer complimentary cleaning and minor repair services for all our products within the first year of purchase. Extended warranties and comprehensive maintenance plans are also available."},
      ]}
      title="Frequently Asked Questions"
      description="Find answers to common inquiries regarding our luxury products, services, and ordering process."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCTA
      useInvertedBackground={false}
      background={{
        variant: "radial-gradient"}}
      tag="Get in Touch"
      title="Experience Personalized Luxury"
      description="Our dedicated team is here to assist you with bespoke requests, product inquiries, or any special needs."
      buttons={[
        {
          text: "Schedule a Consultation",          href: "#"},
        {
          text: "Email Us Directly",          href: "mailto:info@eleganceatelier.com"},
      ]}
      buttonAnimation="slide-up"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      logoSrc="http://img.b2bpic.net/free-vector/wedding-badge-vector-gold-vintage-ornamental-style_53876-140182.jpg"
      logoAlt="Elegance Atelier Logo"
      columns={[
        {
          items: [
            {
              label: "Home",              href: "#hero"},
            {
              label: "About Us",              href: "#about"},
            {
              label: "Collections",              href: "#products"},
            {
              label: "Shop",              href: "/shop"},
            {
              label: "Membership",              href: "#pricing"},
          ],
        },
        {
          items: [
            {
              label: "Contact",              href: "#contact"},
            {
              label: "FAQ",              href: "#faq"},
            {
              label: "Login",              href: "/login"},
            {
              label: "Signup",              href: "/signup"},
            {
              label: "Cart",              href: "/cart"},
            {
              label: "Order History",              href: "/order-history"},
            {
              label: "Account",              href: "/account"}
          ],
        },
        {
          items: [
            {
              label: "Privacy Policy",              href: "#"},
            {
              label: "Terms of Service",              href: "#"},
            {
              label: "Shipping & Returns",              href: "#"},
          ],
        },
      ]}
      logoText="Elegance Atelier"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}