"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import AboutPhoneTimeline from '@/components/sections/about/AboutPhoneTimeline';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import ContactInline from '@/components/sections/contact/ContactInline';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="bounce-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="mediumSmall"
      sizing="mediumLargeSizeMediumTitles"
      background="plain"
      cardStyle="gradient-mesh"
      primaryButtonStyle="layered-depth"
      secondaryButtonStyle="outline"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={[
            { name: "Rooms", id: "rooms" },
            { name: "Amenities", id: "amenities" },
            { name: "About", id: "about" },
            { name: "Reviews", id: "reviews" },
            { name: "Contact", id: "contact" }
          ]}
          brandName="Luxe Stay"
          bottomLeftText="Premium Hotel Experience"
          bottomRightText="reservations@luxestay.com"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogo
          logoText="Luxe Stay"
          description="Experience unparalleled comfort and elegance at our award-winning luxury hotel. Discover exceptional service and world-class amenities."
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184710583-yt05ru42.jpg"
          imageAlt="Modern luxury hotel lobby with contemporary design"
          showDimOverlay={true}
          buttons={[
            { text: "Book Your Stay", href: "contact" },
            { text: "Explore Rooms", href: "rooms" }
          ]}
        />
      </div>

      <div id="rooms" data-section="rooms">
        <ProductCardOne
          title="Our Room Collection"
          description="Choose from our carefully curated selection of luxurious rooms and suites, each designed for your ultimate comfort and relaxation."
          tag="Accommodations"
          textboxLayout="default"
          animationType="slide-up"
          gridVariant="three-columns-all-equal-width"
          products={[
            {
              id: "1",
              name: "Deluxe Room",
              price: "$199/night",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766452376695-4rxtbd0x.jpg",
              imageAlt: "Spacious deluxe room with king-size bed"
            },
            {
              id: "2",
              name: "Executive Suite",
              price: "$349/night",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184712312-lhl1h85w.jpg",
              imageAlt: "Luxury executive suite with lounge area"
            },
            {
              id: "3",
              name: "Standard Room",
              price: "$129/night",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184721770-arv4645s.jpg",
              imageAlt: "Comfortable standard room with modern amenities"
            }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="amenities" data-section="amenities">
        <FeatureCardOne
          title="World-Class Amenities"
          description="Indulge in our comprehensive range of premium facilities designed to enhance your stay and provide total rejuvenation."
          tag="Facilities"
          textboxLayout="default"
          animationType="slide-up"
          gridVariant="four-items-2x2-equal-grid"
          features={[
            {
              title: "Luxury Spa",
              description: "Rejuvenate your mind and body with our full-service spa offering massages, facials, and wellness treatments.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185878910-obewt98e.jpg",
              imageAlt: "Serene spa treatment room"
            },
            {
              title: "Fine Dining Restaurant",
              description: "Savor exquisite cuisine prepared by world-renowned chefs in our elegant dining establishment.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184722691-mip9ww4c.jpg",
              imageAlt: "Upscale restaurant with fine dining setup"
            },
            {
              title: "Olympic Pool",
              description: "Dive into relaxation with our heated outdoor pool, perfect for swimming and sunbathing.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766849142731-hp8i7zi3.jpg",
              imageAlt: "Luxury outdoor swimming pool"
            },
            {
              title: "State-of-Art Fitness Center",
              description: "Stay in shape with cutting-edge equipment, personal trainers, and group fitness classes.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766843736372-3ltc72sy.jpg",
              imageAlt: "Modern fitness center with equipment"
            }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="about" data-section="about">
        <AboutPhoneTimeline
          tag="Our Story"
          title="A Legacy of Excellence"
          description="Founded in 2005, Luxe Stay has been synonymous with hospitality excellence. We combine timeless elegance with modern comfort to create unforgettable experiences for every guest."
          textboxLayout="default"
          phoneOne={{
            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766854198888-392pi2tb.jpg",
            imageAlt: "Hotel exterior architecture"
          }}
          phoneTwo={{
            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767006037732-pjwx8627.jpg",
            imageAlt: "Elegant hotel hallway"
          }}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="reviews" data-section="reviews">
        <TestimonialCardSix
          title="Guest Testimonials"
          description="Read what our satisfied guests have to say about their unforgettable experiences at Luxe Stay."
          tag="Reviews"
          textboxLayout="default"
          animationType="slide-up"
          testimonials={[
            {
              id: "1",
              name: "Sarah Mitchell",
              handle: "@sarahmitchell_travels",
              testimonial: "An absolutely breathtaking experience. The staff was incredibly attentive and every detail exceeded our expectations. We cannot wait to return.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183587552-1pqoe5c0.jpg",
              imageAlt: "Sarah Mitchell"
            },
            {
              id: "2",
              name: "David Chen",
              handle: "@davidchen88",
              testimonial: "The spa treatments were world-class and the rooms are immaculate. This hotel set a new standard for luxury accommodation. Highly recommended!",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766154635301-vse33sxl.jpg",
              imageAlt: "David Chen"
            },
            {
              id: "3",
              name: "Jessica Rodriguez",
              handle: "@jessicatravels",
              testimonial: "From the moment we arrived, we felt completely pampered. The fine dining was spectacular and the service was impeccable throughout our stay.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183841431-v1xtegko.jpg",
              imageAlt: "Jessica Rodriguez"
            },
            {
              id: "4",
              name: "Michael Thompson",
              handle: "@mthompson_luxury",
              testimonial: "I stay at many hotels for business, and Luxe Stay is by far the best. The rooms are stunning, the amenities are comprehensive, and the staff genuinely cares.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766182321167-i4kvpj5f.jpg",
              imageAlt: "Michael Thompson"
            },
            {
              id: "5",
              name: "Emma Wilson",
              handle: "@emmawilson_wanderer",
              testimonial: "Perfect honeymoon destination. Every moment was magical, from the sunset at the pool to the romantic dinner. Thank you for creating such special memories.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183587552-1pqoe5c0.jpg",
              imageAlt: "Emma Wilson"
            },
            {
              id: "6",
              name: "James Patterson",
              handle: "@jpatterson_ceo",
              testimonial: "The executive suite is perfect for business travelers. High-speed internet, professional workspace, and exceptional room service. Luxury redefined.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766154635301-vse33sxl.jpg",
              imageAlt: "James Patterson"
            }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactInline
          text="Ready to experience luxury? Reserve your room today and start your journey."
          animationType="background-highlight"
          inputPlaceholder="Enter your email for special offers"
          buttonText="Request Reservation"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Luxe Stay"
          columns={[
            {
              items: [
                { label: "Rooms", href: "rooms" },
                { label: "Amenities", href: "amenities" },
                { label: "About Us", href: "about" }
              ]
            },
            {
              items: [
                { label: "Contact Us", href: "contact" },
                { label: "Privacy Policy", href: "#" },
                { label: "Terms & Conditions", href: "#" }
              ]
            },
            {
              items: [
                { label: "Phone: +1 (555) 123-4567", href: "#" },
                { label: "Email: info@luxestay.com", href: "#" },
                { label: "Address: 123 Luxury Lane, Paradise City", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}