"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import ContactCenterForm from '@/components/sections/contact/ContactCenterForm';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Sparkles, Flame, Star } from "lucide-react";

export default function OmakasePage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="mediumLarge"
      sizing="mediumLargeSizeLargeTitles"
      background="noiseDiagonalGradient"
      cardStyle="spotlight"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Omakase Niseko"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Experience", id: "feature" },
            { name: "Reviews", id: "testimonial" },
            { name: "Contact", id: "contact" }
          ]}
          button={{ text: "Reserve Now", href: "contact" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Premium Omakase in Niseko"
          description="An intimate culinary journey showcasing the finest fresh fish and traditional Japanese craftsmanship. Reserve your seat at our counter for an unforgettable dining experience."
          tag="Fine Dining"
          tagIcon={Sparkles}
          imageSrc="https://img.b2bpic.net/free-photo/sushi-with-red-caviar-ginger-horseradish-soy-sauce_140725-2217.jpg"
          imageAlt="Premium omakase presentation"
          frameStyle="card"
          buttons={[
            { text: "Reserve a Table", href: "contact" },
            { text: "Learn More", href: "about" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <MediaSplitTabsAbout
          title="The Art of Omakase"
          description="Discover our philosophy and commitment to excellence in every piece."
          tabs={[
            {
              id: "sourcing",              label: "Premium Sourcing",              description: "We partner with the finest suppliers in Japan and internationally to source the freshest fish and ingredients daily. Each ingredient is selected for its quality, flavor profile, and seasonal perfection."
            },
            {
              id: "craftsmanship",              label: "Master Craftsmanship",              description: "Our head chef brings decades of experience perfecting the art of nigiri, sashimi, and traditional omakase preparation. Every movement is deliberate, every piece is a work of art."
            },
            {
              id: "experience",              label: "Curated Experience",              description: "Sit at our intimate counter and enjoy a personalized omakase journey. We adapt to your preferences, introducing seasonal highlights and customer favorites throughout your meal."
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/chef-putting-tomatoes-avocado_23-2148471901.jpg?id=7188418"
          imageAlt="Chef preparing omakase"
          imagePosition="right"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="feature" data-section="feature">
        <FeatureCardTwentyOne
          title="Signature Offerings"
          description="Explore our carefully curated selection of premium preparations that define the omakase experience."
          tag="Menu Highlights"
          tagIcon={Flame}
          accordionItems={[
            {
              id: "nigiri",              title: "Nigiri Selection",              content: "Hand-crafted nigiri featuring seasonal selections of bluefin tuna, salmon, sea bream, and specialty varieties. Each piece is prepared with perfectly seasoned sushi rice and topped with the finest fish available that day."
            },
            {
              id: "sashimi",              title: "Premium Sashimi",              content: "Thinly sliced raw fish showcasing the delicate flavors and textures of our sourced ingredients. Served minimally to let the quality and freshness shine. Includes toro, chu-toro, and white fish selections."
            },
            {
              id: "seasonal",              title: "Seasonal Specials",              content: "Our chef introduces limited seasonal offerings based on ingredient availability and culinary inspiration. These rotating specialties ensure every visit brings new discoveries."
            },
            {
              id: "preparation",              title: "Traditional Preparation",              content: "Watch as our chef employs traditional Japanese techniques passed down through generations. From rice preparation to precise knife work, every element reflects authentic omakase tradition."
            }
          ]}
          imageSrc="https://img.b2bpic.net/premium-photo/close-up-ladybug-table_1048944-18927701.jpg?id=117644828"
          imageAlt="Close-up of premium nigiri"
          useInvertedBackground="noInvert"
          mediaPosition="left"
        />
      </div>

      <div id="testimonial" data-section="testimonial">
        <TestimonialCardThirteen
          title="What Our Guests Say"
          description="Hear from those who have experienced our premium omakase service in Niseko."
          tag="Testimonials"
          tagIcon={Star}
          testimonials={[
            {
              id: "1",              name: "Takeshi Yamamoto",              handle: "@takeshi_y",              testimonial: "An absolutely transcendent dining experience. The chef's expertise and dedication to the craft is evident in every piece. Simply the best omakase in Niseko.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-confident-entrepreneur_1098-21617.jpg",              imageAlt: "Takeshi Yamamoto"
            },
            {
              id: "2",              name: "Sarah Mitchell",              handle: "@sarahmitchell",              testimonial: "Exceptional quality and attention to detail. The chef explained each preparation with passion. Worth every penny for a truly memorable evening.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/proud-student-with-long-hair_1149-433.jpg",              imageAlt: "Sarah Mitchell"
            },
            {
              id: "3",              name: "Hiroshi Tanaka",              handle: "@hiroshi_tanaka",              testimonial: "As someone who appreciates fine omakase, this ranks among the best I've experienced. The sourcing is impeccable and the execution is flawless.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/portrait-cheerful-young-woman-standing-with-folded-arms-window_1098-17204.jpg",              imageAlt: "Hiroshi Tanaka"
            },
            {
              id: "4",              name: "Emma Richardson",              handle: "@emma_r",              testimonial: "The intimate counter setting, the chef's personality, and the incredible food made this a night to remember. Highly recommend for special occasions.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/smiling-asian-woman-posing-front-escalator-with-finger-touching-cheek_1098-17240.jpg",              imageAlt: "Emma Richardson"
            }
          ]}
          showRating={true}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertCard"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitText
          sideTitle="Frequently Asked Questions"
          sideDescription="Everything you need to know about our omakase experience and dining policies."
          faqs={[
            {
              id: "1",              title: "How do I make a reservation?",              content: "Reservations can be made through our contact form or by calling us directly. We recommend booking in advance, especially during peak seasons. Our intimate counter seats a limited number of guests to ensure personalized service."
            },
            {
              id: "2",              title: "What is the price for omakase?",              content: "Omakase pricing varies based on the seasonal ingredients available and the number of pieces served. Typically ranging from ¥15,000 to ¥25,000 per person, we offer exceptional value for the quality and experience provided."
            },
            {
              id: "3",              title: "Can you accommodate dietary restrictions?",              content: "Yes, we can accommodate vegetarian preferences and allergies. Please mention any dietary restrictions when making your reservation so our chef can prepare an appropriate experience for you."
            },
            {
              id: "4",              title: "What is the dress code?",              content: "We recommend smart casual attire. As a premium dining establishment, we appreciate guests who dress to respect the occasion and culinary artistry they're about to experience."
            },
            {
              id: "5",              title: "How long is the omakase experience?",              content: "A typical omakase service lasts approximately 1.5 to 2 hours. This allows time for the chef to prepare each piece carefully and for you to savor the experience without rushing."
            },
            {
              id: "6",              title: "Do you offer beverages or sake pairings?",              content: "Yes, we offer a curated selection of premium sake and Japanese beverages. Optional sake pairings are available to complement your omakase experience."
            }
          ]}
          textPosition="left"
          useInvertedBackground="noInvert"
          animationType="smooth"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenterForm
          title="Reserve Your Experience"
          description="Join us for an unforgettable omakase journey. Secure your reservation at our intimate Niseko counter."
          inputs={[
            { name: "name", type: "text", placeholder: "Your Name", required: true },
            { name: "email", type: "email", placeholder: "Your Email", 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 dietary restrictions...", rows: 4, required: false }}
          useInvertedBackground="invertCard"
          buttonText="Reserve Now"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="Omakase Niseko"
          copyrightText="© 2025 Omakase Niseko | Premium Fine Dining"
          columns={[
            {
              title: "Experience",              items: [
                { label: "About", href: "about" },
                { label: "Menu", href: "feature" },
                { label: "Reviews", href: "testimonial" }
              ]
            },
            {
              title: "Information",              items: [
                { label: "FAQ", href: "faq" },
                { label: "Reservations", href: "contact" },
                { label: "Location", href: "contact" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Instagram", href: "https://www.instagram.com" },
                { label: "Contact", href: "contact" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}