"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
import TextAbout from '@/components/sections/about/TextAbout';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import ContactText from '@/components/sections/contact/ContactText';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Coffee, Utensils, Home, MessageCircle, Users, Award, Heart, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="small"
      sizing="mediumLarge"
      background="none"
      cardStyle="gradient-radial"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="solid"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Midnight Cafe"
          navItems={[
            { name: "Menu", id: "menu" },
            { name: "About", id: "about" },
            { name: "Atmosphere", id: "atmosphere" },
            { name: "Community", id: "community" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Visit Today",            href: "#contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboardSplit
          logoText="MIDNIGHT"
          description="Coffee worth planning your day around. Your neighborhood ritual — thoughtfully crafted coffee, fresh pastries, and a space that invites you to stay awhile."
          background={{ variant: "radial-gradient" }}
          buttons={[
            { text: "☕️ View Menu", href: "#menu" },
            { text: "📍 Visit Us Today", href: "#contact" }
          ]}
          layoutOrder="default"
          imageSrc="https://img.b2bpic.net/free-photo/young-attractive-woman-striped-trench-coat-happily-talking-cellphone-sitting-near-big-window-while-spending-time-modern-cafe_574295-4851.jpg"
          imageAlt="Midnight Cafe intimate interior with warm lighting"
          frameStyle="card"
        />
      </div>

      <div id="about" data-section="about">
        <TextAbout
          tag="Our Story"
          tagIcon={Coffee}
          title="More than coffee. A neighborhood ritual that feeds the soul."
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Learn More", href: "#atmosphere" }
          ]}
        />
      </div>

      <div id="menu" data-section="menu">
        <FeatureCardTwentyFour
          tag="Menu"
          tagIcon={Utensils}
          title="Thoughtfully Crafted Offerings"
          description="Each item on our menu is selected with intention—from single-origin espresso to fresh-baked pastries that complement your afternoon work session or morning escape."
          features={[
            {
              id: "espresso",              title: "Signature Espresso Blends",              author: "Sourced directly from specialty roasters",              description: "Our rotating selection of single-origin espresso showcases the world's finest coffee regions. Every cup is pulled with precision and care.",              tags: ["Premium", "Sourced"],
              imageSrc: "https://img.b2bpic.net/free-photo/top-view-delicious-cookies-sweet-with-cup-coffee-pastry-grey-cookie-sugar-biscuit-sweet_140725-34071.jpg",              imageAlt: "Close-up of espresso preparation"
            },
            {
              id: "pastries",              title: "Fresh Pastries & Baked Goods",              author: "Baked daily by local artisans",              description: "Pair your coffee with croissants, tarts, and bread sourced from neighborhood bakers who share our commitment to quality.",              tags: ["Fresh", "Local"],
              imageSrc: "https://img.b2bpic.net/free-photo/top-view-delicious-cookies-sweet-with-cup-coffee-pastry-grey-cookie-sugar-biscuit-sweet_140725-34071.jpg",              imageAlt: "Assorted fresh pastries"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="atmosphere" data-section="atmosphere">
        <ProductCardOne
          tag="The Space"
          tagIcon={Home}
          title="Your Third Place Awaits"
          description="Thoughtfully designed spaces where you can work, think, or simply exist. Comfortable seating, reliable wifi, and a quiet confidence that says: you belong here."
          products={[
            {
              id: "workspace",              name: "Dedicated Work Zone",              price: "Perfect for focus",              imageSrc: "https://img.b2bpic.net/free-photo/young-smiling-man-typing-computer-while-browsing-internet-drinking-coffee-bar_637285-2064.jpg",              imageAlt: "Professional working at cafe table with coffee"
            },
            {
              id: "gathering",              name: "Meeting Nook",              price: "For conversation",              imageSrc: "https://img.b2bpic.net/free-photo/stylish-businessman-working-office-with-partner_1157-21043.jpg",              imageAlt: "Friends gathering at cafe table"
            },
            {
              id: "quiet-corner",              name: "Quiet Corner",              price: "For reflection",              imageSrc: "https://img.b2bpic.net/free-photo/girl-with-phone-night_1303-5741.jpg",              imageAlt: "Cozy corner seating with warm lighting"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTen
          tag="Community Voices"
          tagIcon={MessageCircle}
          title="Trusted by our neighborhood"
          description="Hear from the people who've made Midnight Cafe part of their daily ritual."
          testimonials={[
            {
              id: "1",              title: "My morning sanctuary",              quote: "I've found my perfect work-from-cafe spot. The consistency of the coffee, the thoughtful space, and the genuine hospitality make every visit feel like coming home.",              name: "Sarah Chen",              role: "Freelance Designer",              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-dark-skinned-lady-with-curly-hair-walks-urban-setting-focused-somewhere-wears-raincoat-kerchief-tied-neck-has-contemplative-expression-goes-work-poses-publicity-area_273609-55282.jpg",              imageAlt: "Sarah Chen headshot"
            },
            {
              id: "2",              title: "Where ideas come to life",              quote: "As a writer, I need the right environment. Midnight Cafe provides that—quality coffee, quiet confidence, and a space that understands the creative process.",              name: "Marcus Johnson",              role: "Author & Journalist",              imageSrc: "https://img.b2bpic.net/free-photo/woman-sits-contemplatively-bench-outside-woman-city_169016-66565.jpg",              imageAlt: "Marcus Johnson headshot"
            },
            {
              id: "3",              title: "My third place",              quote: "Between my apartment and the office, this cafe is where I actually feel like myself. The people here get it—this is more than coffee.",              name: "Emma Rodriguez",              role: "Product Manager",              imageSrc: "https://img.b2bpic.net/free-photo/woman-sits-contemplatively-bench-outside-woman-city_169016-66505.jpg",              imageAlt: "Emma Rodriguez headshot"
            },
            {
              id: "4",              title: "A space of belonging",              quote: "As a student balancing life and studies, Midnight Cafe became my unexpected sanctuary. The atmosphere, the community vibe, everything just works.",              name: "David Kim",              role: "Graduate Student",              imageSrc: "https://img.b2bpic.net/free-photo/outdoors-street-portrait-beautiful-young-brunette-woman_1153-5232.jpg",              imageAlt: "David Kim headshot"
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardThree
          tag="Community Impact"
          tagIcon={Users}
          title="Growing Neighborhood Legacy"
          description="Numbers that reflect our commitment to being a cornerstone of the community."
          metrics={[
            {
              id: "1",              icon: Users,
              title: "Regular Visitors",              value: "2,500+"
            },
            {
              id: "2",              icon: Award,
              title: "Local Partnerships",              value: "12"
            },
            {
              id: "3",              icon: Heart,
              title: "Community Events",              value: "40+/year"
            },
            {
              id: "4",              icon: Zap,
              title: "Consistent Rating",              value: "4.9/5"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to join the Midnight Cafe community? Visit us and discover your new neighborhood ritual."
          animationType="entrance-slide"
          buttons={[
            { text: "View Hours & Location", href: "https://maps.google.com" },
            { text: "Reserve a Table", href: "mailto:reservations@midnightcafe.local" }
          ]}
          background={{ variant: "plain" }}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://img.b2bpic.net/free-photo/full-shot-business-owner-standing-outdoors_23-2149434497.jpg"
          imageAlt="Midnight Cafe storefront in the evening"
          logoText="Midnight Cafe"
          copyrightText="© 2025 Midnight Cafe. A neighborhood ritual."
          columns={[
            {
              title: "Hours",              items: [
                { label: "Mon-Fri: 7am - 11pm", href: "" },
                { label: "Sat-Sun: 8am - 12am", href: "" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Email", href: "mailto:hello@midnightcafe.local" },
                { label: "Phone", href: "tel:+1234567890" }
              ]
            },
            {
              title: "Visit",              items: [
                { label: "123 Neighborhood St", href: "https://maps.google.com" },
                { label: "Parking Available", href: "" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}