"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 FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
import MediaAbout from '@/components/sections/about/MediaAbout';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="background-highlight"
        borderRadius="rounded"
        contentWidth="mediumLarge"
        sizing="mediumLargeSizeLargeTitles"
        background="circleGradient"
        cardStyle="outline"
        primaryButtonStyle="primary-glow"
        secondaryButtonStyle="solid"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        { name: "Home", id: "hero" },
        { name: "About", id: "about" },
        { name: "Features", id: "features" },
        { name: "Products", id: "products" },
        { name: "Contact", id: "contact" },
      ]}
      brandName="Siddhbali Paint House"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitDoubleCarousel
      background={{ variant: "gradient-bars" }}
      title="Siddhbali Paint House"
      description="Owned by Saurabh Sharma, we offer premium paint solutions, expert color mixing, and exclusive stock from top brands like Nerolac and JK Max. Transform your home today!"
      leftCarouselItems={[
        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DLYp8Q6eMDlbSl0TDO1bhoPRSy/uploaded-1778067090099-kf7pdkkx.jpg", imageAlt: "Storefront view 1" },
        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DLYp8Q6eMDlbSl0TDO1bhoPRSy/uploaded-1778067272508-k9qodink.jpg", imageAlt: "New storefront view" }
      ]}
      rightCarouselItems={[
        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DLYp8Q6eMDlbSl0TDO1bhoPRSy/uploaded-1778067090100-gbd0y2k3.jpg", imageAlt: "Interior display" },
        { imageSrc: "http://img.b2bpic.net/free-photo/assortment-painting-items-with-green-paint_23-2149579985.jpg", imageAlt: "Supplies" }
      ]}
      buttons={[{ text: "Call Saurabh", href: "tel:9027538973" }]}
    />
  </div>

  <div id="about" data-section="about">
      <MediaAbout
      useInvertedBackground={true}
      title="About Our Expertise"
      description="At Siddhbali Paint House, we provide professional-grade paints and personalized service. Whether you need a specific color matched or premium branding like Nerolac or JK Max, we have you covered."
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyEight
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        { id: "f1", title: "Custom Color Mixing", subtitle: "Get your perfect shade", category: "Customization", value: "Exact" },
        { id: "f2", title: "Nerolac Brand", subtitle: "Premium quality paints", category: "Stock", value: "Premium" },
        { id: "f3", title: "JK Max Brand", subtitle: "Durable finishes", category: "Stock", value: "Durable" },
      ]}
      title="Our Special Services"
      description="We pride ourselves on offering bespoke color mixing and top-tier stock inventory."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardFour
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={true}
      products={[]}
      title="Available Brands"
      description="Browse our premium selection of paints, specifically curated from Nerolac and JK Max."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardThirteen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[]}
      title="Customer Reviews"
      description="See what your neighbors in Dhanaura say about us."
      showRating={true}
    />
  </div>

  <div id="social" data-section="social">
      <SocialProofOne
      names={["Nerolac", "JK Max", "Asian Paints", "Berger"]}
      title="Top Quality Brands Stocked"
      description="We carry only the most trusted brands in the painting industry."
      textboxLayout="default"
      useInvertedBackground={false}
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      faqs={[
        { id: "q1", title: "Do you offer color mixing?", content: "Yes, we provide advanced custom color mixing for all your needs." },
        { id: "q2", title: "What brands do you carry?", content: "We exclusively stock premium quality Nerolac and JK Max products." },
      ]}
      title="FAQ"
      description="Common questions from our valued customers."
      faqsAnimation="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCTA
      tag="Contact Us"
      title="Visit Siddhbali Paint House"
      description="Owned by Saurabh Sharma, we're ready to assist with all your painting needs. Call us today at 9027538973."
      buttons={[{ text: "Call 9027538973", href: "tel:9027538973" }]}
      background={{ variant: "plain" }}
      useInvertedBackground={false}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterSimple
      columns={[]}
      bottomLeftText="© 2024 Siddhbali Paint House"
      bottomRightText="Owned by Saurabh Sharma"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}