"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import SplitAbout from '@/components/sections/about/SplitAbout';
import { Award, Package, Users, ShieldCheck } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="smallMedium"
        sizing="medium"
        background="noiseDiagonalGradient"
        cardStyle="inset"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="layered"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        { name: "Home", id: "hero" },
        { name: "About", id: "about" },
        { name: "Products", id: "products" },
        { name: "Features", id: "features" },
        { name: "Gallery", id: "gallery" },
        { name: "Stats", id: "stats" },
        { name: "Reviews", id: "testimonials" },
        { name: "Contact", id: "contact" },
      ]}
      brandName="Neeta Trading Co."
      button={{ text: "Contact Us", href: "#contact" }}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardScroll
      title="Luxury Jewellery Packaging"
      description="Premium velvet boxes and custom display solutions crafted for elite jewellery brands in Surat."
      background={{ variant: "sparkles-gradient" }}
      buttons={[{ text: "Explore Collection", href: "#products" }]}
      imageSrc="http://img.b2bpic.net/free-photo/white-pearls-necklace-with-different-white-boxes-pastel-paper-background_23-2147874223.jpg"
    />
  </div>

  <div id="about" data-section="about">
      <SplitAbout
      title="Two Decades of Precision Packaging"
      description="At Neeta Trading Co., we blend tradition with modern design to provide packaging that reflects the luxury of your jewellery. Based in Surat, we serve premium brands globally."
      bulletPoints={[
        { title: "Expert Craftsmanship", description: "High precision in every stitch and fold.", icon: Award },
        { title: "Premium Materials", description: "Only the finest velvet and sustainable materials.", icon: Package },
        { title: "Customized Solutions", description: "Personalized branding to match your unique identity.", icon: ShieldCheck },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/display-shiny-luxurious-golden-chain_23-2149635269.jpg"
      imagePosition="right"
      textboxLayout="split"
      useInvertedBackground={false}
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardTwo
      title="Exclusive Product Range"
      description="Tailored packaging for rings, necklaces, and bangles."
      animationType="slide-up"
      gridVariant="three-columns-all-equal-width"
      textboxLayout="split"
      useInvertedBackground={false}
      products={[
        { id: "p1", brand: "Luxury", name: "Velvet Ring Box", price: "₹45", rating: 5, reviewCount: "120+", imageSrc: "http://img.b2bpic.net/free-photo/jewelry-box_1339-384.jpg" },
        { id: "p2", brand: "Premium", name: "Necklace Case", price: "₹120", rating: 5, reviewCount: "85+", imageSrc: "http://img.b2bpic.net/free-photo/display-shiny-luxurious-golden-chain_23-2149635269.jpg" },
        { id: "p3", brand: "Elite", name: "Bangle Display", price: "₹450", rating: 4, reviewCount: "200+", imageSrc: "http://img.b2bpic.net/free-photo/queen-crown-still-life_23-2150409267.jpg" }
      ]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardNineteen
      title="Why Choose Us?"
      features={[
        { tag: "Fast", title: "Quick Delivery", subtitle: "On-time shipment", description: "Ensuring your business operations never halt.", imageSrc: "http://img.b2bpic.net/free-photo/hands-holding-closed-red-box_1208-342.jpg" },
        { tag: "Value", title: "Wholesale Price", subtitle: "Unmatched rates", description: "Economical pricing without sacrificing luxury.", imageSrc: "http://img.b2bpic.net/free-photo/valentines-day-still-life-design_23-2149246350.jpg" }
      ]}
      textboxLayout="split"
      useInvertedBackground={false}
    />
  </div>

  <div id="gallery" data-section="gallery">
    <FeatureCardNineteen
        title="Craftsmanship Showcase"
        features={[
            { tag: "Portfolio", title: "Luxury Finish", subtitle: "In detail", description: "High-quality velvet texture detail.", imageSrc: "http://img.b2bpic.net/free-photo/view-elegant-luxurious-wedding-stationery-planner-resources_23-2150166937.jpg" }
        ]}
        textboxLayout="split"
        useInvertedBackground={false}
    />
  </div>

  <div id="stats" data-section="stats">
      <MetricCardFourteen
      title="Our Growth Impact"
      tag="Achievements"
      useInvertedBackground={false}
      metrics={[
        { id: "m1", value: "20+", description: "Years Experience" },
        { id: "m2", value: "5000+", description: "Trusted Clients" },
        { id: "m3", value: "100%", description: "Quality Satisfaction" }
      ]}
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSixteen
      title="Client Success Stories"
      description="Hear from jewellers who trust our packaging."
      textboxLayout="split"
      useInvertedBackground={false}
      kpiItems={[
          { value: "98%", label: "Retention Rate" },
          { value: "5k+", label: "Boxes Shipped" },
          { value: "24h", label: "Fast Quote" }
      ]}
      animationType="slide-up"
      testimonials={[
          { id: "t1", name: "Rajesh Mehta", role: "Owner", company: "Mehta Jewellers", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-point-finger-you_93675-135553.jpg" }
      ]}
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      title="Get Your Free Quote"
      description="Contact us for wholesale pricing and custom orders today."
      useInvertedBackground={false}
      inputs={[
          { name: "name", type: "text", placeholder: "Full Name" },
          { name: "email", type: "email", placeholder: "Email Address" }
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/closeup-computer-laptop-marble-table_53876-139709.jpg"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseReveal
      logoText="Neeta Trading Co."
      columns={[
        { title: "Navigation", items: [{ label: "Home", href: "#" }, { label: "Products", href: "#products" }] },
        { title: "Contact", items: [{ label: "Surat, India", href: "#" }, { label: "+91 0261 259 1277", href: "tel:+9102612591277" }] }
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}