"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Award, CheckCircle, Coffee, Flame, Globe, Heart, Leaf, Music, Shield, Sparkles, Star, Users, Wifi, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="medium"
      sizing="large"
      background="noiseDiagonalGradient"
      cardStyle="gradient-bordered"
      primaryButtonStyle="inset-glow"
      secondaryButtonStyle="layered"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Fia"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Menu", id: "features" },
            { name: "Stories", id: "testimonial" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Reserve a Table",            href: "#contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitKpi
          title="Welcome to Fia"
          description="Discover exceptional coffee, warm hospitality, and a community where every cup tells a story. Your perfect coffeeshop escape awaits."
          tag="Artisanal Coffee Experience"
          tagIcon={Coffee}
          background={{ variant: "plain" }}
          imageSrc="https://img.b2bpic.net/free-photo/cozy-cafe_1098-13854.jpg"
          imageAlt="Fia Coffeeshop Interior"
          imagePosition="right"
          kpis={[
            { value: "12+", label: "Years of Expertise" },
            { value: "5,000+", label: "Happy Customers" },
            { value: "15+", label: "Bean Origins" }
          ]}
          enableKpiAnimation={true}
          buttons={[
            { text: "Explore Menu", href: "#features" },
            { text: "Reserve Now", href: "#contact" }
          ]}
          mediaAnimation="slide-up"
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric
          title="At Fia, we're passionate about crafting the perfect cup of coffee and creating spaces where communities come together to share stories, ideas, and moments that matter."
          useInvertedBackground={false}
          metrics={[
            { icon: Coffee, label: "Years of Expertise", value: "12+" },
            { icon: Users, label: "Happy Customers", value: "5,000+" },
            { icon: Globe, label: "Bean Origins", value: "15+" },
            { icon: Award, label: "Quality Certified", value: "100%" }
          ]}
          metricsAnimation="slide-up"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTen
          title="The Fia Experience"
          description="From carefully sourced beans to handcrafted beverages, discover what makes our coffeeshop special"
          tag="Menu Highlights"
          tagIcon={Sparkles}
          features={[
            {
              id: "1",              title: "Premium Espresso Blends",              description: "Our signature espresso drinks are crafted with precision using single-origin beans roasted in-house. Every shot is pulled with care to bring out the unique flavor profiles of our carefully selected coffee varieties.",              media: { imageSrc: "https://img.b2bpic.net/free-photo/cafe-interior-with-orange-sofa-three-tables-three-black-chairs_181624-8624.jpg" },
              items: [
                { icon: Zap, text: "Single-origin selections" },
                { icon: Flame, text: "In-house roasted daily" },
                { icon: Star, text: "Barista-crafted perfection" }
              ],
              reverse: false
            },
            {
              id: "2",              title: "Fresh-Baked Pastries",              description: "Pair your coffee with our fresh-baked pastries and seasonal treats, all prepared daily by our skilled pastry team. From croissants to custom cakes, we have something to satisfy every craving.",              media: { imageSrc: "https://img.b2bpic.net/free-photo/set-bakery-pastries-wooden-table_123827-31529.jpg" },
              items: [
                { icon: Heart, text: "Freshly baked daily" },
                { icon: Leaf, text: "Premium ingredients" },
                { icon: CheckCircle, text: "Dietary options available" }
              ],
              reverse: true
            },
            {
              id: "3",              title: "Welcoming Atmosphere",              description: "Fia is more than just a coffeeshop—it's a community space where you can work, study, or simply relax. Our thoughtfully designed interior creates the perfect ambiance for every moment.",              media: { imageSrc: "https://img.b2bpic.net/free-photo/group-friends-meeting-restaurant_23-2148395317.jpg" },
              items: [
                { icon: Wifi, text: "High-speed WiFi included" },
                { icon: Music, text: "Curated playlist" },
                { icon: Coffee, text: "Comfortable seating" }
              ],
              reverse: false
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonial" data-section="testimonial">
        <TestimonialCardFifteen
          testimonial="Fia has become my second home. The coffee is exceptional, the staff genuinely cares about their craft, and the atmosphere makes you want to stay longer. I've never experienced such attention to detail in a coffeeshop before."
          rating={5}
          author="Emma Richardson, Local Writer"
          avatars={[
            { src: "https://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg", alt: "Emma Richardson" },
            { src: "https://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman-looking-camera_74855-4120.jpg", alt: "James Mitchell" },
            { src: "https://img.b2bpic.net/free-photo/businesswoman-glasses-portrait_1262-1461.jpg", alt: "Sofia Garcia" },
            { src: "https://img.b2bpic.net/free-photo/blonde-businesswoman-portrait-with-copy-space_1194-633470.jpg", alt: "David Chen" },
            { src: "https://img.b2bpic.net/free-photo/portrait-business-woman-office_1398-6.jpg", alt: "Olivia Martinez" },
            { src: "https://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg", alt: "Marcus Johnson" }
          ]}
          ratingAnimation="slide-up"
          avatarsAnimation="opacity"
          useInvertedBackground={true}
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Trusted Partners"
          description="We partner with the finest suppliers to ensure every aspect of the Fia experience is exceptional"
          tag="Quality Sourcing"
          tagIcon={Shield}
          textboxLayout="default"
          useInvertedBackground={false}
          names={[
            "Premium Bean Co",            "Artisan Roasters",            "Local Bakery Guild",            "Fair Trade Collective",            "Organic Suppliers",            "Specialty Importer",            "Heritage Coffee Estates"
          ]}
          logos={[
            "https://img.b2bpic.net/free-vector/coffee-logo-template_23-2150529100.jpg",            "https://img.b2bpic.net/free-vector/tea-logo-design-template_742173-32018.jpg",            "https://img.b2bpic.net/free-vector/cold-brew-coffee-labels_23-2148655504.jpg",            "https://img.b2bpic.net/free-vector/coffee-logo-template_23-2150529112.jpg",            "https://img.b2bpic.net/free-vector/geometric-minimalist-food-logo_23-2148918120.jpg",            "https://img.b2bpic.net/free-vector/minimal-style-colourful-logo-set_23-2148381992.jpg",            "https://img.b2bpic.net/free-vector/coffee-shop-logo-template_23-2150529088.jpg"
          ]}
          speed={40}
          showCard={true}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to experience Fia? Join us for an unforgettable coffeeshop journey. Reserve your table today or visit us anytime—we'd love to welcome you."
          animationType="entrance-slide"
          buttons={[
            { text: "Reserve a Table", href: "#" },
            { text: "Get Directions", href: "#" }
          ]}
          background={{ variant: "plain" }}
          useInvertedBackground={true}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Fia"
          columns={[
            {
              items: [
                { label: "Home", href: "#hero" },
                { label: "About", href: "#about" },
                { label: "Menu", href: "#features" }
              ]
            },
            {
              items: [
                { label: "Stories", href: "#testimonial" },
                { label: "Contact", href: "#contact" },
                { label: "Careers", href: "#" }
              ]
            },
            {
              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Sustainability", href: "#" }
              ]
            },
            {
              items: [
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Facebook", href: "https://facebook.com" },
                { label: "Twitter", href: "https://twitter.com" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}