"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroSplitLarge from '@/components/sections/hero/HeroSplitLarge';
import ParallaxAbout from '@/components/sections/about/ParallaxAbout';
import ProductCardSeven from '@/components/sections/product/ProductCardSeven';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterCard from '@/components/sections/footer/FooterCard';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="smallMedium"
      sizing="largeSmallSizeLargeTitles"
      background="noiseGradient"
      cardStyle="gradient-bordered"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Luxe Tokyo"
          navItems={[
            { name: "About", id: "about" },
            { name: "Amenities", id: "features" },
            { name: "Rooms", id: "products" },
            { name: "Reviews", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Book Now",
            href: "contact"
          }}
        />
      </div>
      
      <div id="hero" data-section="hero">
        <HeroSplitLarge
          title="Experience Luxury in the Heart of Tokyo"
          description="Discover the perfect blend of traditional Japanese aesthetics and modern elegance. Your sanctuary awaits at Luxe Tokyo."
          tag="Premium Hospitality"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766837634719-5otl8omu.jpg"
          imageAlt="Luxe Tokyo exterior at night"
          buttons={[
            { text: "Reserve Now", href: "contact" },
            { text: "Learn More", href: "about" }
          ]}
        />
      </div>
      
      <div id="about" data-section="about">
        <ParallaxAbout
          title="Where Tradition Meets Modern Excellence"
          description="Since 2015, Luxe Tokyo has set the standard for luxury hospitality in the capital. Our commitment to exceptional service, sustainable practices, and authentic Japanese experiences creates unforgettable moments for every guest."
          tag="Our Story"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185878910-obewt98e.jpg"
          imageAlt="Luxe Tokyo interior design"
          buttons={[
            { text: "Explore Our Heritage", href: "#" }
          ]}
        />
      </div>
      
      <div id="features" data-section="features">
        <ProductCardSeven
          title="World-Class Amenities"
          description="Every detail crafted for your comfort and pleasure"
          tag="Amenities"
          products={[
            {
              id: "1",
              title: "Spa & Wellness",
              price: "Rejuvenate",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184712312-lhl1h85w.jpg",
              imageAlt: "Spa & Wellness"
            },
            {
              id: "2",
              title: "Fine Dining",
              price: "Experience",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766849442209-g2s3b84q.jpg",
              imageAlt: "Fine Dining"
            },
            {
              id: "3",
              title: "Fitness Center",
              price: "Strengthen",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184710583-yt05ru42.jpg",
              imageAlt: "Fitness Center"
            },
            {
              id: "4",
              title: "Sky Lounge",
              price: "Unwind",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766837634719-5otl8omu.jpg",
              imageAlt: "Sky Lounge"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="products" data-section="products">
        <ProductCardSeven
          title="Curated Room Collection"
          description="Select from our thoughtfully designed rooms and suites"
          tag="Accommodations"
          products={[
            {
              id: "1",
              title: "Deluxe Room",
              price: "$250/night",
              description: "King Bed • 450 sq ft",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184712312-lhl1h85w.jpg",
              imageAlt: "Deluxe Room"
            },
            {
              id: "2",
              title: "Executive Suite",
              price: "$450/night",
              description: "Two Queen or King • 650 sq ft",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766849442209-g2s3b84q.jpg",
              imageAlt: "Executive Suite"
            },
            {
              id: "3",
              title: "Premium Suite with View",
              price: "$650/night",
              description: "King Bed + Sofa • 850 sq ft",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184710583-yt05ru42.jpg",
              imageAlt: "Premium Suite with View"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwo
          title="Guest Experiences"
          description="Hear what our valued guests have to say about their stay"
          tag="Reviews"
          testimonials={[
            {
              id: "1",
              name: "Sarah Anderson",
              role: "Travel Entrepreneur",
              testimonial: "Luxe Tokyo exceeded every expectation. The attention to detail, the service, and the atmosphere created memories that will last a lifetime. Truly exceptional.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766850777333-gk776zjh.jpg",
              imageAlt: "Sarah Anderson"
            },
            {
              id: "2",
              name: "Michael Chen",
              role: "Business Executive",
              testimonial: "A perfect blend of business convenience and luxury comfort. The facilities are world-class and the staff understands genuine hospitality.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140101670-ttp7xdlv.jpg",
              imageAlt: "Michael Chen"
            },
            {
              id: "3",
              name: "Hiroshi Nakamura",
              role: "Cultural Consultant",
              testimonial: "As a Tokyo native, I appreciate how seamlessly Luxe Tokyo honors tradition while embracing modernity. Exceptional in every way.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183841431-v1xtegko.jpg",
              imageAlt: "Hiroshi Nakamura"
            },
            {
              id: "4",
              name: "Emma Richardson",
              role: "Luxury Travel Blogger",
              testimonial: "Simply outstanding. The spa, the dining, the rooms, the service—every element is thoughtfully curated for maximum guest satisfaction.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140152452-p4x3ah4p.jpg",
              imageAlt: "Emma Richardson"
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Reserve Your Stay"
          description="Contact our reservations team to book your perfect getaway. We look forward to welcoming you to Luxe Tokyo."
          inputs={[
            { name: "name", type: "text", placeholder: "Full Name", required: true },
            { name: "email", type: "email", placeholder: "Email Address", required: true },
            { name: "phone", type: "tel", placeholder: "Phone Number", required: true },
            { name: "arrival", type: "date", placeholder: "Check-in Date", required: true }
          ]}
          textarea={{
            name: "message",
            placeholder: "Additional requests or special occasions...",
            rows: 4,
            required: false
          }}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766843737297-1izy0u6f.jpg"
          imageAlt="Luxe Tokyo lobby"
          mediaPosition="right"
          buttonText="Complete Reservation"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="footer" data-section="footer">
        <FooterCard
          logoText="Luxe Tokyo"
          copyrightText="© 2025 Luxe Tokyo. All rights reserved. | Privacy Policy | Terms & Conditions"
        />
      </div>
    </ThemeProvider>
  );
}