"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 FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import TextAbout from '@/components/sections/about/TextAbout';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-shift"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="medium"
        sizing="medium"
        background="fluid"
        cardStyle="soft-shadow"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="solid"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        { name: "Home", id: "hero" },
        { name: "Menu", id: "services" },
        { name: "Why Us", id: "why-us" },
        { name: "Gallery", id: "gallery" },
        { name: "FAQ", id: "faq" },
      ]}
      brandName="Paris Croisserie"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroLogoBillboard
      logoText="Paris Croisserie "
      description="Experience the delicate crunch of authentic French-inspired pastries. Fresh, daily-baked, and waiting for you."
      buttons={[{ text: "Order Now", href: "#contact" }, { text: "Our Menu", href: "#services" }]}
      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CSEIQLBNEFKYS2Z8ImL4kpsrFT/uploaded-1776399649585-t9sw3y5r.png"
      imageAlt="Artisanal pastries on display"
      mediaAnimation="blur-reveal"
      background={{ variant: "sparkles-gradient" }}
    />
  </div>

  <div id="services" data-section="services">
      <FeatureCardMedia
      animationType="slide-up"
      textboxLayout="split"
      title="Daily Selections"
      description="Handcrafted classics made with premium ingredients to fuel your day."
      features={[
        { id: "1", tag: "Fresh", title: "Croissants & Pastries", description: "Buttery, flaky, and golden perfection.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-chocolate-eclairs-oval-plate-tarts-laeves-cinnamon-dried-oranges-dark-wooden-table-with-copy-space_140725-90858.jpg?_wi=2" },
        { id: "2", tag: "Roasted", title: "Coffee & Drinks", description: "Premium roasts that pair beautifully with every bite.", imageSrc: "http://img.b2bpic.net/free-photo/pouring-milk-mix-latte-coffee-art_1232-2147.jpg" }
      ]}
      useInvertedBackground={false}
    />
  </div>

  <div id="why-us" data-section="why-us">
      <TextAbout
      useInvertedBackground={true}
      tag="Our Commitment"
      title="Why People Choose Us"
      buttons={[
        { text: "Our Story", href: "#" },
      ]}
    />
  </div>

  <div id="gallery" data-section="gallery">
      <MetricCardEleven
      animationType="blur-reveal"
      textboxLayout="default"
      useInvertedBackground={false}
      metrics={[
        { id: "g1", value: "Fresh", title: "Fresh out of the oven", description: "Baked daily.", imageSrc: "http://img.b2bpic.net/free-photo/red-nature-texture-background_23-2147960326.jpg" },
        { id: "g2", value: "Flaky", title: "Perfectly flaky", description: "Our signature.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-tasty-bagels-with-seeds-bread_23-2148365501.jpg" },
        { id: "g3", value: "Local", title: "Local favorite", description: "Community loved.", imageSrc: "http://img.b2bpic.net/free-photo/breakfast-with-croissant_23-2148130539.jpg" },
        { id: "g4", value: "Chic", title: "Cafe vibe", description: "Cozy space.", imageSrc: "http://img.b2bpic.net/free-photo/delicious-indian-dosa-assortment_23-2149086041.jpg" }
      ]}
      title="Gallery"
      description="A glimpse into our bakery world."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="split"
      useInvertedBackground={true}
      faqs={[
        { id: "1", title: "Where are you located?", content: "7610 Milwaukee Ave Suite 300, Lubbock, TX" },
        { id: "5", title: "What are your operating hours?", content: "We are open daily from 7:00 AM to 6:00 PM." },
        { id: "2", title: "Do you offer catering?", content: "Yes, contact us for custom orders." }
      ]}
      title="Frequently Asked Questions"
      description="Everything you need to know about Paris Croisserie."
      buttons={[
        { text: "Order Now", href: "#contact" },
        { text: "Call (806) 777-1229", href: "tel:8067771229" },
      ]}
      faqsAnimation="blur-reveal"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={false}
      background={{ variant: "gradient-bars" }}
      text="Come Try Lubbock’s Favorite Croissants. Fresh pastries, great coffee, and a café you’ll want to come back to."
      buttons={[
        { text: "Get Directions", href: "#" },
        { text: "Call Now", href: "tel:8067771229" },
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterMedia
      imageSrc="http://img.b2bpic.net/free-photo/freshly-baked-bread-oven_140725-4139.jpg"
      logoText="Paris Croisserie"
      columns={[
        { title: "Visit", items: [{ label: "7610 Milwaukee Ave, Lubbock", href: "#" }] },
        { title: "Company", items: [{ label: "About Us", href: "#" }, { label: "Catering", href: "#" }] },
        { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }] }
      ]}
      imageAlt="cozy french cafe atmosphere blur"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}