"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import { Award, Shield, Sparkles, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="compact"
        sizing="mediumLargeSizeLargeTitles"
        background="none"
        cardStyle="gradient-radial"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="solid"
        headingFontWeight="medium"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        { name: "Home", id: "hero" },
        { name: "Products", id: "products" },
        { name: "About", id: "about" },
        { name: "Contact", id: "contact" },
      ]}
      brandName="NEFER KA"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitKpi
      background={{ variant: "plain" }}
      title="NEFER KA - The Spirit of Beauty"
      description="Experience the ultimate comfort of 100% Bolivar cotton, meticulously treated to remain fresh, bacteria-free, and lint-resistant."
      kpis={[
        { value: "100%", label: "Bolivar Cotton" },
        { value: "24/7", label: "Freshness" },
        { value: "Premium", label: "Quality" },
      ]}
      enableKpiAnimation={true}
      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AY7rzFunkBryeTyPNg3oitiDwI/uploaded-1778764194110-t8vsk4lc.jpg"
      mediaAnimation="slide-up"
      avatars={[]}
    />
  </div>

  <div id="about" data-section="about">
      <TestimonialAboutCard
      useInvertedBackground={false}
      tag="OUR STORY"
      title="Crafted with Excellence"
      description="At NEFER KA, we blend traditional craftsmanship with modern innovation to deliver apparel that feels as good as it looks."
      subdescription="Our Bolivar cotton is harvested responsibly and treated with advanced anti-lint and anti-bacterial technology."
      icon={Sparkles}
      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AY7rzFunkBryeTyPNg3oitiDwI/uploaded-1778764194111-5hhrimah.jpg"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardEight
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        { title: "100% Bolivar Cotton", description: "Superior natural fibers for ultimate softness and breathability.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-colorful-fabric-material_23-2148383702.jpg" },
        { title: "Anti-Bacterial Protection", description: "Specially treated fabrics that stay fresh longer and resist odors.", imageSrc: "http://img.b2bpic.net/free-photo/wardrobe-renovation-winter_23-2149183937.jpg" },
        { title: "Lint-Free Fabric", description: "Advanced weaving technology that prevents pilling and lint build-up.", imageSrc: "http://img.b2bpic.net/free-photo/mechanic-using-laptop-counter_1170-2483.jpg" },
      ]}
      title="Why Choose NEFER KA?"
      description="Technology meets comfort for everyday wear."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardTwo
      animationType="slide-up"
      textboxLayout="split-actions"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      buttons={[
        { text: "Upload New Product", onClick: () => { window.location.href = "/upload-product"; } }
      ]}
      products={[
        { id: "1", brand: "NEFER KA", name: "Essential White Tee", price: "$45", rating: 5, reviewCount: "12", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AY7rzFunkBryeTyPNg3oitiDwI/uploaded-1778764194110-rspkmfgb.jpg" },
        { id: "2", brand: "NEFER KA", name: "Classic Beige Tee", price: "$45", rating: 5, reviewCount: "8", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AY7rzFunkBryeTyPNg3oitiDwI/uploaded-1778764194111-dxqgi20n.jpg" }
      ]}
      title="Our Collection"
      description="Explore our premium selection of essentials."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardThree
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      metrics={[
        { id: "m1", icon: Award, title: "Cotton Purity", value: "100%" },
        { id: "m2", icon: Shield, title: "Lint Protection", value: "99%" },
        { id: "m3", icon: Zap, title: "Bacteria Defense", value: "95%" },
      ]}
      title="Our Quality Standards"
      description="Delivering quality you can feel."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTwo
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[]}
      title="Loved by Customers"
      description="Join our community of satisfied wearers."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[]}
      title="Common Questions"
      description="Everything you need to know about our products."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={false}
      background={{ variant: "plain" }}
      text="Need assistance or have a bulk order inquiry?"
      buttons={[
          { text: "Email Us", href: "mailto:mahmoudsamy5001@gmail.com" },
          { text: "WhatsApp", href: "https://wa.me/20100773229" }
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseCard
      logoText="NEFER KA"
      columns={[]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}