"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FeatureBento from '@/components/sections/feature/FeatureBento';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SplitAbout from '@/components/sections/about/SplitAbout';
import { Coffee, Croissant, Gauge } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="compact"
        sizing="largeSizeMediumTitles"
        background="noiseDiagonalGradient"
        cardStyle="soft-shadow"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        {
          name: "Home",          id: "hero"},
        {
          name: "Menu",          id: "products"},
        {
          name: "Order",          id: "contact"},
      ]}
      brandName="Futuro Cafe"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardScroll
      background={{
        variant: "gradient-bars"}}
      title="Futuro Cafe Experience"
      description="Taste the future of coffee. Artisanal brews crafted with precision and passion."
      buttons={[
        {
          text: "Explore Menu",          href: "#products"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/city-background-panoramic-view_23-2148892961.jpg"
      imageAlt="Futuristic cafe experience"
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardFour
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      products={[
        {
          id: "p1",          name: "Signature Espresso",          price: "25 DH",          variant: "Hot",          imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-ice-cappuccino-glass-wooden-plate-with-decorations-black_181624-24413.jpg"},
        {
          id: "p2",          name: "Butter Croissant",          price: "15 DH",          variant: "Bakery",          imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-breakfast-with-cinnamon-roll_23-2148543694.jpg"},
        {
          id: "p3",          name: "Iced Caramel",          price: "35 DH",          variant: "Cold",          imageSrc: "http://img.b2bpic.net/free-photo/two-milkshakes-glasses-with-straws-table_181624-38867.jpg"},
        {
          id: "p4",          name: "Dark Mocha",          price: "30 DH",          variant: "Hot",          imageSrc: "http://img.b2bpic.net/free-photo/delicious-coffee-easter-decorations_23-2150249796.jpg"},
        {
          id: "p5",          name: "Velvet Cake",          price: "40 DH",          variant: "Dessert",          imageSrc: "http://img.b2bpic.net/free-photo/slice-cherry-cake-white-plate_181624-22256.jpg"},
        {
          id: "p6",          name: "V60 Drip",          price: "45 DH",          variant: "Hot",          imageSrc: "http://img.b2bpic.net/free-photo/barista-pouring-coffee-with-chemex_1220-7512.jpg"},
      ]}
      title="Our Menu"
      description="Savor the exquisite flavors curated for true coffee connoisseurs."
    />
  </div>

  <div id="feature" data-section="feature">
      <FeatureBento
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      title="Crafted for Perfection"
      description="Our commitment to quality ensures every cup, snack, and moment spent at Futuro Cafe is elevated beyond the ordinary."
      features={[
        {
          title: "Premium Sourcing",          description: "Direct trade coffee beans sourced from sustainable micro-lots worldwide.",          bentoComponent: "reveal-icon",          icon: Coffee,
        },
        {
          title: "Advanced Extraction",          description: "Precision temperature control for consistent flavor profiles.",          bentoComponent: "reveal-icon",          icon: Gauge,
        },
        {
          title: "Artisanal Pastries",          description: "Hand-folded croissants baked fresh every single morning.",          bentoComponent: "reveal-icon",          icon: Croissant,
        },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <SplitAbout
      textboxLayout="default"
      useInvertedBackground={false}
      title="The Futuro Vision"
      description="We blend traditional barista expertise with modern, minimalist design aesthetics to create a space that inspires productivity and relaxation in equal measure."
      imageSrc="http://img.b2bpic.net/free-photo/futuristic-cafe-scene-with-illuminated-kettle_23-2152012011.jpg"
      imageAlt="Futuristic cafe scene"
      mediaAnimation="slide-up"
      bulletPoints={[
        {
          title: "Future-Proof Design",          description: "Experience an immersive atmosphere with neon accents and smart lighting."},
        {
          title: "Expert Baristas",          description: "Professional training at the core of our service philosophy."},
        {
          title: "Seamless Ordering",          description: "Digitized experience optimized for speed and convenience."},
      ]}
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCenter
      useInvertedBackground={false}
      background={{
        variant: "sparkles-gradient"}}
      tag="Order Now"
      title="Ready to order?"
      description="Tap below to contact us directly via WhatsApp and order your favorite drink."
      buttonText="Order on WhatsApp"
      onSubmit={(email: string) => window.location.href = 'https://wa.me/2120682333657'}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoReveal
      logoText="FUTURO CAFE"
      leftLink={{
        text: "Terms of Service",        href: "#"}}
      rightLink={{
        text: "Privacy Policy",        href: "#"}}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
