"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import HeroCentered from "@/components/sections/hero/HeroCentered";
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
import ProductCardThree from "@/components/sections/product/ProductCardThree";
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FaqDouble from "@/components/sections/faq/FaqDouble";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
import { Award, ChefHat, HelpCircle, Sparkles, Star, Trophy, Users } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="mediumSmall"
      sizing="largeSmall"
      background="none"
      cardStyle="soft-shadow"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Ninja Puz"
          navItems={[
            { name: "Home", id: "home" },
            { name: "Menu", id: "menu" },
            { name: "About", id: "about" },
            { name: "Reviews", id: "reviews" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Reserve Table",            href: "#contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCentered
          title="Experience Authentic Asian Cuisine"
          description="Discover the finest flavors of Asia at Ninja Puz. From traditional ramen to contemporary fusion dishes, we blend culinary tradition with modern innovation."
          background={{ variant: "radial-gradient" }}
          avatars={[
            {
              src: "http://img.b2bpic.net/free-photo/side-view-crab-salad-with-vegetables-wasabi-plate-soy-sauce-black_141793-11099.jpg",              alt: "Signature Asian Dish"
            }
          ]}
          buttons={[
            { text: "View Menu", href: "#menu" },
            { text: "Reserve Now", href: "#contact" }
          ]}
          buttonAnimation="slide-up"
          ariaLabel="Ninja Puz Restaurant Hero Section"
          className="w-full"
          containerClassName="max-w-5xl mx-auto px-4"
          textBoxClassName="text-center"
          titleClassName="text-5xl md:text-6xl font-bold"
          descriptionClassName="text-lg md:text-xl text-opacity-90"
          buttonContainerClassName="flex gap-4 justify-center mt-8"
          buttonClassName="px-8 py-3 rounded-lg font-semibold"
          buttonTextClassName="text-sm md:text-base"
        />
      </div>

      <div id="about" data-section="about">
        <TestimonialAboutCard
          tag="Our Story"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          title="Crafted with Passion & Tradition"
          description="Ninja Puz brings together generations of Asian culinary expertise with contemporary dining excellence. Our chefs combine authentic recipes with premium ingredients sourced from trusted suppliers across Asia."
          subdescription="Every dish tells a story of tradition, quality, and respect for culinary art. We're committed to delivering an unforgettable dining experience."
          icon={ChefHat}
          imageSrc="http://img.b2bpic.net/free-photo/elegant-oriental-restaurant_1122-1389.jpg"
          imageAlt="Restaurant Interior"
          mediaAnimation="blur-reveal"
          useInvertedBackground={false}
          ariaLabel="About Ninja Puz Restaurant"
          className="w-full py-16"
          containerClassName="max-w-6xl mx-auto px-4"
          cardClassName="bg-card rounded-xl p-8"
          contentClassName="flex flex-col gap-6"
          tagClassName="inline-flex items-center gap-2 w-fit"
          titleClassName="text-4xl md:text-5xl font-bold"
          descriptionClassName="text-lg leading-relaxed"
          iconBoxClassName="w-16 h-16 rounded-full flex items-center justify-center bg-primary-cta"
          iconClassName="w-8 h-8 text-primary-cta-text"
        />
      </div>

      <div id="featured-dishes" data-section="featured-dishes">
        <ProductCardThree
          title="Our Signature Menu"
          description="Explore our carefully curated selection of authentic Asian dishes, each prepared with premium ingredients and traditional techniques."
          tag="Featured Dishes"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          buttons={[
            { text: "View Full Menu", href: "#menu" }
          ]}
          buttonAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          products={[
            {
              id: "sushi-platter",              name: "Premium Sushi Platter",              price: "$28",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-yummy-sushi-board_23-2147773600.jpg",              imageAlt: "Premium Sushi Platter",              initialQuantity: 1
            },
            {
              id: "dumplings",              name: "Steamed Dumplings",              price: "$12",              imageSrc: "http://img.b2bpic.net/free-photo/khinkali-with-meat-glass-red-wine_140725-10961.jpg",              imageAlt: "Steamed Dumplings",              initialQuantity: 1
            },
            {
              id: "pad-thai",              name: "Authentic Pad Thai",              price: "$15",              imageSrc: "http://img.b2bpic.net/free-photo/steaming-asian-noodles-with-vegetables-shrimp-bowl_84443-81543.jpg",              imageAlt: "Authentic Pad Thai",              initialQuantity: 1
            }
          ]}
          ariaLabel="Featured Dishes"
          className="w-full py-16"
          containerClassName="max-w-6xl mx-auto px-4"
          textBoxClassName="text-center mb-12"
          textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4"
          textBoxDescriptionClassName="text-lg opacity-90 max-w-2xl mx-auto"
          gridClassName="grid gap-8"
          cardClassName="bg-card rounded-xl overflow-hidden hover:shadow-lg transition-shadow"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardOne
          title="Ninja Puz by Numbers"
          description="Trusted by thousands of diners who appreciate authentic Asian cuisine and exceptional service."
          tag="Our Impact"
          tagIcon={Award}
          tagAnimation="slide-up"
          buttons={[]}
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="uniform-all-items-equal"
          animationType="scale-rotate"
          metrics={[
            {
              id: "customers",              value: "15K+",              title: "Happy Customers",              description: "Annual dining guests",              icon: Users
            },
            {
              id: "dishes",              value: "50+",              title: "Signature Dishes",              description: "Carefully crafted recipes",              icon: ChefHat
            },
            {
              id: "experience",              value: "25+",              title: "Years Experience",              description: "Culinary excellence",              icon: Trophy
            },
            {
              id: "rating",              value: "4.8★",              title: "Average Rating",              description: "From verified reviews",              icon: Star
            }
          ]}
          ariaLabel="Restaurant Metrics"
          className="w-full py-16"
          containerClassName="max-w-6xl mx-auto px-4"
          textBoxClassName="text-center mb-12"
          textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4"
          textBoxDescriptionClassName="text-lg opacity-90 max-w-2xl mx-auto"
          gridClassName="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8"
          cardClassName="bg-card rounded-xl p-8 text-center"
          valueClassName="text-4xl md:text-5xl font-bold text-primary-cta mb-2"
          titleClassName="text-xl font-semibold mb-2"
          iconClassName="w-12 h-12 mx-auto mb-4 text-primary-cta"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardThirteen
          title="Guest Experiences"
          description="Hear from our valued customers about their dining experiences at Ninja Puz."
          textboxLayout="default"
          useInvertedBackground={true}
          showRating={true}
          animationType="slide-up"
          testimonials={[
            {
              id: "testimonial-1",              name: "Sarah Chen",              handle: "@sarah_foodie",              testimonial: "Ninja Puz offers the most authentic Asian cuisine I've experienced. Every dish is a masterpiece, and the service is impeccable.",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-outdoors-portrait_158595-3542.jpg",              imageAlt: "Sarah Chen"
            },
            {
              id: "testimonial-2",              name: "Michael Park",              handle: "@michael_dining",              testimonial: "The attention to detail in every dish is remarkable. This is where I bring my clients for special occasions.",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1626.jpg",              imageAlt: "Michael Park"
            },
            {
              id: "testimonial-3",              name: "Emma Rodriguez",              handle: "@emma_explores",              testimonial: "Finally found a place that respects traditional recipes while maintaining modern excellence. Absolutely recommend!",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-cheerful-man-smiling-looking-pleased_482257-101175.jpg",              imageAlt: "Emma Rodriguez"
            },
            {
              id: "testimonial-4",              name: "James Thompson",              handle: "@james_culinary",              testimonial: "As a chef myself, I'm impressed by Ninja Puz's quality and consistency. A true gem in the city.",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/young-blonde-woman-wearing-casual-blue-shirt-success-sign-doing-positive-gesture-with-hand-thumbs-up-smiling-happy-cheerful-expression-winner-gesture_839833-2022.jpg",              imageAlt: "James Thompson"
            },
            {
              id: "testimonial-5",              name: "Lisa Wang",              handle: "@lisa_taste",              testimonial: "The flavors are incredible, and the ambiance is perfect for both casual and fine dining experiences.",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-successful-businessman-suit-showing-okay-sign-looking-satisfied-standing-against-white-ba_1258-173565.jpg",              imageAlt: "Lisa Wang"
            },
            {
              id: "testimonial-6",              name: "David Kim",              handle: "@david_eats",              testimonial: "Ninja Puz has elevated my appreciation for Asian cuisine. I visit every month without fail.",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/person-talking-phone_23-2150409994.jpg",              imageAlt: "David Kim"
            }
          ]}
          ariaLabel="Customer Testimonials"
          className="w-full py-16"
          containerClassName="max-w-6xl mx-auto px-4"
          textBoxClassName="text-center mb-12"
          textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4"
          textBoxDescriptionClassName="text-lg opacity-90 max-w-2xl mx-auto"
          gridClassName="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"
          cardClassName="bg-card rounded-xl p-8"
          imageClassName="w-12 h-12 rounded-full object-cover mb-4"
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          names={["Food & Wine", "Michelin Guide", "Zagat Rated", "OpenTable", "Yelp Elite", "TripAdvisor", "Local Eats"]}
          title="Featured In"
          description="Recognized by top dining platforms and publications for our commitment to culinary excellence."
          textboxLayout="default"
          useInvertedBackground={false}
          showCard={true}
          speed={40}
          ariaLabel="Media Recognition"
          className="w-full py-16"
          containerClassName="max-w-6xl mx-auto px-4"
          textBoxClassName="text-center mb-12"
          textBoxTitleClassName="text-3xl md:text-4xl font-bold mb-4"
          textBoxDescriptionClassName="text-lg opacity-90 max-w-2xl mx-auto"
          logoTextClassName="font-semibold text-sm md:text-base"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Find answers to common questions about our restaurant, reservations, and dining experience."
          textboxLayout="default"
          useInvertedBackground={true}
          faqsAnimation="slide-up"
          tag="Help & Support"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          faqs={[
            {
              id: "faq-1",              title: "Do you accept reservations?",              content: "Yes, we welcome reservations for both small gatherings and large parties. You can book through our website or call us directly. Walk-ins are also accommodated based on availability."
            },
            {
              id: "faq-2",              title: "Are there vegetarian options?",              content: "Absolutely! We offer a diverse vegetarian menu featuring plant-based versions of our signature dishes, all prepared with the same quality and authenticity."
            },
            {
              id: "faq-3",              title: "What are your operating hours?",              content: "We're open Monday to Thursday 11am-10pm, Friday to Saturday 11am-11pm, and Sunday 12pm-9pm. We're closed on major holidays."
            },
            {
              id: "faq-4",              title: "Do you accommodate dietary restrictions?",              content: "Yes, we're happy to accommodate allergies, gluten-free, dairy-free, and other dietary requirements. Please inform our staff when ordering."
            },
            {
              id: "faq-5",              title: "Do you offer catering services?",              content: "Yes! We provide catering for events of all sizes. Contact our catering team at catering@ninjapuz.com for custom menus and pricing."
            },
            {
              id: "faq-6",              title: "Is there parking available?",              content: "We have complimentary parking for our guests. Street parking is also available nearby, and we're accessible via public transportation."
            }
          ]}
          ariaLabel="FAQ Section"
          className="w-full py-16"
          containerClassName="max-w-6xl mx-auto px-4"
          textBoxClassName="text-center mb-12"
          textBoxTitleClassName="text-4xl md:text-5xl font-bold mb-4"
          textBoxDescriptionClassName="text-lg opacity-90 max-w-2xl mx-auto"
          faqsContainerClassName="grid grid-cols-1 lg:grid-cols-2 gap-8"
          accordionClassName="bg-card rounded-xl p-6"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Reserve Your Table"
          description="Plan your visit to Ninja Puz. Contact us for reservations or inquiries about our dining experience."
          inputs={[
            { name: "fullName", type: "text", placeholder: "Your Full Name", required: true },
            { name: "email", type: "email", placeholder: "Your Email Address", required: true },
            { name: "phone", type: "tel", placeholder: "Phone Number", required: true },
            { name: "date", type: "date", placeholder: "Preferred Date", required: true }
          ]}
          textarea={{
            name: "message",            placeholder: "Special requests or questions...",            rows: 5,
            required: false
          }}
          useInvertedBackground={false}
          mediaAnimation="blur-reveal"
          mediaPosition="right"
          buttonText="Make Reservation"
          ariaLabel="Contact and Reservation Form"
          className="w-full py-16"
          containerClassName="max-w-6xl mx-auto px-4"
          contentClassName="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center"
          formCardClassName="bg-card rounded-xl p-8"
          titleClassName="text-4xl md:text-5xl font-bold mb-4"
          descriptionClassName="text-lg opacity-90 mb-8"
          buttonClassName="w-full bg-primary-cta hover:bg-opacity-90 text-primary-cta-text font-semibold py-3 rounded-lg transition-all"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={[
            {
              title: "Restaurant",              items: [
                { label: "Menu", href: "#menu" },
                { label: "Reservations", href: "#contact" },
                { label: "Locations", href: "#" },
                { label: "Catering", href: "#" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" },
                { label: "Press", href: "#" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Facebook", href: "https://facebook.com" },
                { label: "Twitter", href: "https://twitter.com" },
                { label: "Contact", href: "#contact" }
              ]
            }
          ]}
          copyrightText="© 2024 Ninja Puz. All rights reserved."
          ariaLabel="Footer"
          className="w-full bg-foreground text-card"
          containerClassName="max-w-6xl mx-auto px-4 py-12"
          columnsClassName="grid grid-cols-1 md:grid-cols-3 gap-8 mb-8"
          columnTitleClassName="font-bold text-lg mb-4"
          columnItemClassName="opacity-80 hover:opacity-100 transition-opacity"
        />
      </div>
    </ThemeProvider>
  );
}