"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import SplitAbout from '@/components/sections/about/SplitAbout';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-shift"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="mediumLarge"
        sizing="largeSmallSizeMediumTitles"
        background="floatingGradient"
        cardStyle="solid"
        primaryButtonStyle="primary-glow"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        { name: "Home", id: "hero" },
        { name: "Experience", id: "about" },
        { name: "Services", id: "features" },
        { name: "Menu", id: "products" },
        { name: "Contact", id: "contact" },
      ]}
      brandName="Ondine"
      button={{
        text: "Book Now",        href: "#contact"}}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboard
      background={{
        variant: "sparkles-gradient"}}
      title="Your Private Window to the Nile"
      description="Experience Maadi's finest riverside dining. At Ondine, every table offers a curated view of the Nile, accompanied by artisan coffee and an atmosphere of pure tranquility."
      buttons={[
        {
          text: "Book Your Nile-View Table",          href: "#contact"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/great-landscape-opens-cosy-dinner-table_8353-93.jpg"
      mediaAnimation="blur-reveal"
    />
  </div>

  <div id="about" data-section="about">
      <SplitAbout
      textboxLayout="split"
      useInvertedBackground={true}
      title="Where the Nile Meets Tranquility"
      description="Ondine offers more than just a meal; we provide a sanctuary. Our location in the heart of Maadi is designed to maximize the breathtaking Nile vistas, turning every visit into a peaceful escape from the everyday."
      bulletPoints={[
        {
          title: "Prime Nile Views",          description: "Unobstructed, elevated perspectives of the majestic river."},
        {
          title: "Peaceful Sanctuary",          description: "A curated environment focused on relaxation and quiet enjoyment."},
        {
          title: "Exceptional Service",          description: "Attentive care ensuring your time by the Nile is perfect."},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/autumn-scenery_1204-338.jpg"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyEight
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          id: "f1",          title: "Nile Panorama",          subtitle: "Primary Attraction",          category: "Setting",          value: "Waterfront"},
        {
          id: "f2",          title: "Artisan Selection",          subtitle: "Curated menu",          category: "Dining",          value: "Daily"},
        {
          id: "f3",          title: "Serene Lounge",          subtitle: "Comfort redefined",          category: "Atmosphere",          value: "Relax"},
      ]}
      title="The Ondine Difference"
      description="We pride ourselves on pairing premium refreshments with the most serene riverside setting in Cairo."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardOne
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={true}
      products={[
        {
          id: "p1",          name: "Riverside Signature Blend",          price: "Premium",          imageSrc: "http://img.b2bpic.net/free-photo/water-glass-bottle-iced-latte-pink-stand-salt-paper-wooden-table_343596-1518.jpg"},
        {
          id: "p2",          name: "Nile View Afternoon Tea",          price: "Selected",          imageSrc: "http://img.b2bpic.net/free-photo/sauteed-roasted-lamb-bone-served-teriyaki-sauce_114579-1895.jpg"},
        {
          id: "p3",          name: "Chef's Choice Light Meal",          price: "Varied",          imageSrc: "http://img.b2bpic.net/free-photo/vegetable-salad-with-caviar-shrimps_140725-6375.jpg"},
      ]}
      title="Menu & Refreshments"
      description="Carefully selected items that enhance your relaxation as you take in the Nile view."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTwelve
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",          name: "Sarah Ahmed",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-beautiful-women-work-portable-laptop-computer-charming-female-student-using-net-book-while-sitting-cafe_1153-7026.jpg"},
        {
          id: "t2",          name: "Mohamed Hassan",          imageSrc: "http://img.b2bpic.net/free-photo/attractive-happy-young-bearded-man-trendy-hat-texting-messages-via-social-networks-browsing-internet-using-free-wifi-his-electronic-device-coffee-break-restaurant_273609-1934.jpg"},
        {
          id: "t3",          name: "Layla Khaled",          imageSrc: "http://img.b2bpic.net/free-photo/charming-brunette-with-long-shiny-hair_1304-5010.jpg"},
      ]}
      cardTitle="Guest Reflections"
      cardTag="Reviews"
      cardAnimation="blur-reveal"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitText
      useInvertedBackground={true}
      faqs={[
        {
          id: "q1",          title: "How do I book a Nile-view table?",          content: "Use our booking buttons across the site to secure your prime waterfront location."},
        {
          id: "q2",          title: "Are you open for breakfast?",          content: "Yes, we open daily with morning selections overlooking the peaceful Nile."},
        {
          id: "q3",          title: "What are your operating hours?",          content: "We welcome you daily until 12:00 AM."},
      ]}
      sideTitle="Help Center"
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCTA
      useInvertedBackground={false}
      background={{
        variant: "radial-gradient"}}
      tag="Book Now"
      title="Secure Your View of the Nile"
      description="Don't miss out on the perfect riverside experience in Maadi. Reserve your table today."
      buttons={[
        {
          text: "Book Table",          href: "#"},
        {
          text: "Contact Us",          href: "mailto:hello@ondine.com"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterMedia
      imageSrc="http://img.b2bpic.net/free-photo/side-view-attractive-young-woman-drinking-coffee-caf_23-2147871313.jpg"
      logoText="Ondine Maadi"
      columns={[
        {
          title: "Quick Links",          items: [
            { label: "Home", href: "#hero" },
            { label: "About", href: "#about" },
            { label: "Menu", href: "#products" },
          ],
        },
        {
          title: "Support",          items: [
            { label: "Reservations", href: "#contact" },
            { label: "Privacy", href: "#" },
          ],
        },
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}