"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroLogoCarousel from '@/components/sections/hero/HeroLogoCarousel';
import AboutPhoneTimeline from '@/components/sections/about/AboutPhoneTimeline';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { Phone } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="background-highlight"
      borderRadius="sharp"
      contentWidth="smallMedium"
      sizing="large"
      background="aurora"
      cardStyle="elevated-accent"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="glass"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Luxe Hotel"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "Rooms", id: "feature" },
            { name: "About", id: "about" },
            { name: "Reviews", id: "testimonial" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Book Now",
            href: "contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoCarousel
          logoText="Luxe Hotel"
          description="Experience timeless elegance and world-class hospitality at our five-star luxury hotel. Discover comfort, refinement, and unforgettable moments."
          mediaItems={[
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184710583-yt05ru42.jpg",
              imageAlt: "Grand hotel lobby with elegant design"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766452376695-4rxtbd0x.jpg",
              imageAlt: "Luxurious suite bedroom with premium furnishings"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184712312-lhl1h85w.jpg",
              imageAlt: "Resort pool area with spa facilities"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184721770-arv4645s.jpg",
              imageAlt: "Fine dining restaurant interior"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185878910-obewt98e.jpg",
              imageAlt: "Luxury hotel exterior architecture"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184722691-mip9ww4c.jpg",
              imageAlt: "Professional concierge service"
            }
          ]}
          logoLineHeight={1.1}
          ariaLabel="Luxe Hotel hero section"
        />
      </div>

      <div id="about" data-section="about">
        <AboutPhoneTimeline
          tag="Our Mission"
          title="Redefining Hospitality Excellence"
          description="At Luxe Hotel, we believe every stay should be a memorable journey. Our commitment to exceptional service, luxurious accommodations, and thoughtful attention to detail sets us apart. We create moments that guests cherish long after they leave."
          phoneOne={{
            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766242509936-5sra46kr.jpg",
            imageAlt: "Hotel booking app interface"
          }}
          phoneTwo={{
            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766347536220-k0f3hjlf.jpg",
            imageAlt: "Reservation management app"
          }}
          textboxLayout="default"
          buttons={[
            { text: "Book Your Stay", href: "contact" },
            { text: "Learn More", href: "#" }
          ]}
          useInvertedBackground="noInvert"
          ariaLabel="About our hotel mission"
        />
      </div>

      <div id="feature" data-section="feature">
        <FeatureCardNineteen
          tag="Room Types"
          title="Discover Our Collection"
          description="From cozy comfort to ultimate luxury, we offer room types to suit every traveler's needs."
          textboxLayout="default"
          useInvertedBackground="noInvert"
          features={[
            {
              id: 1,
              tag: "Comfort",
              title: "Standard Room",
              subtitle: "Perfect for solo travelers and couples",
              description: "Our Standard Rooms offer contemporary comfort with essential amenities. Each room features a comfortable bed, modern bathroom, high-speed WiFi, and a work desk. Enjoy city views and access to all hotel facilities.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766849142731-hp8i7zi3.jpg",
              imageAlt: "Standard room accommodation"
            },
            {
              id: 2,
              tag: "Premium",
              title: "Deluxe Room",
              subtitle: "Spacious luxury for discerning guests",
              description: "Deluxe Rooms provide extra space and enhanced amenities. Features include premium bedding, marble bathroom with rainfall shower, sitting area, and exclusive access to our club lounge. Perfect for extended stays.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766843736372-3ltc72sy.jpg",
              imageAlt: "Deluxe room with luxury amenities"
            },
            {
              id: 3,
              tag: "Ultimate",
              title: "Penthouse Suite",
              subtitle: "The pinnacle of luxury hospitality",
              description: "Our Penthouse Suite is the crown jewel of accommodation. Featuring panoramic views, separate living and sleeping areas, private spa bath, premium service, and butler assistance. An unparalleled experience.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766854198888-392pi2tb.jpg",
              imageAlt: "Penthouse suite with luxury furnishings"
            },
            {
              id: 4,
              tag: "Wellness",
              title: "Spa Suite",
              subtitle: "Rejuvenation and relaxation combined",
              description: "Spa Suites integrate luxury accommodation with wellness features. Includes hydrotherapy bathtub, sauna access, spa treatments, and wellness consultations. Designed for ultimate relaxation and renewal.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767006036722-1o803gi1.jpg",
              imageAlt: "Spa suite with wellness features"
            }
          ]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardNine
          tag="Room Rates"
          title="Our Room Packages"
          description="Transparent pricing for world-class accommodations. Rates include breakfast, WiFi, and access to all hotel facilities."
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          plans={[
            {
              id: "standard",
              title: "Standard Room",
              price: "$149",
              period: "/night",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767006037732-pjwx8627.jpg",
              imageAlt: "Standard room image",
              button: {
                text: "Reserve Room",
                href: "contact"
              },
              features: [
                "Queen or twin beds",
                "Modern bathroom",
                "High-speed WiFi",
                "Work desk and chair",
                "City or garden view",
                "24-hour room service"
              ]
            },
            {
              id: "deluxe",
              title: "Deluxe Room",
              price: "$249",
              period: "/night",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767006038597-n7qc8lnx.jpg",
              imageAlt: "Deluxe room image",
              button: {
                text: "Reserve Room",
                href: "contact"
              },
              features: [
                "King bed with luxury linens",
                "Marble bathroom with rainfall shower",
                "Sitting area",
                "Club lounge access",
                "Premium toiletries",
                "Concierge service"
              ]
            },
            {
              id: "penthouse",
              title: "Penthouse Suite",
              price: "$549",
              period: "/night",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184199984-xnv4032m.jpg",
              imageAlt: "Penthouse suite image",
              button: {
                text: "Reserve Suite",
                href: "contact"
              },
              features: [
                "Separate living and sleeping areas",
                "Panoramic city views",
                "Private spa bath",
                "Butler service",
                "Premium minibar",
                "Exclusive suite amenities"
              ]
            }
          ]}
        />
      </div>

      <div id="testimonial" data-section="testimonial">
        <TestimonialCardFifteen
          testimonial="Luxe Hotel exceeded all our expectations. The service was impeccable, the accommodations luxurious, and every detail was thoughtfully attended to. We'll definitely return for our next vacation."
          rating={5}
          author="Sarah Mitchell, Travel Enthusiast"
          avatars={[
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766163678723-295psgl3.jpg",
              alt: "Guest review avatar"
            },
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184724760-wxlm9bjg.jpg",
              alt: "Guest review avatar"
            },
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185880597-ieb2jad3.jpg",
              alt: "Guest review avatar"
            },
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766185881440-0jwi2e86.jpg",
              alt: "Guest review avatar"
            },
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767006040246-qjrduxzp.jpg",
              alt: "Guest review avatar"
            },
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140152452-p4x3ah4p.jpg",
              alt: "Guest review avatar"
            }
          ]}
          useInvertedBackground="noInvert"
          ariaLabel="Guest testimonials"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="Ready to Book?"
          ctaDescription="Get in touch with our team to reserve your perfect room or ask any questions about your stay."
          ctaButton={{
            text: "Contact Us",
            href: "#"
          }}
          ctaIcon={Phone}
          useInvertedBackground="noInvert"
          animationType="slide-up"
          accordionAnimationType="smooth"
          faqs={[
            {
              id: "1",
              title: "What is your cancellation policy?",
              content: "We offer flexible cancellation up to 24 hours before arrival for most bookings. Cancellations made within 24 hours will incur the first night's charge. Certain promotional rates may have stricter policies."
            },
            {
              id: "2",
              title: "Do you offer airport transfer service?",
              content: "Yes, we provide complimentary airport transfer for all guests staying 3 nights or more. For shorter stays, airport transfer is available at a nominal charge. Please arrange this when booking."
            },
            {
              id: "3",
              title: "What amenities are included?",
              content: "All room rates include complimentary breakfast, WiFi, access to fitness center, swimming pool, and spa facilities. Premium rooms include club lounge access with complimentary beverages and snacks."
            },
            {
              id: "4",
              title: "Do you have pet-friendly rooms?",
              content: "Yes, we welcome well-behaved pets in designated rooms with a nominal daily fee. Please inform us when booking and provide information about your pet to ensure a comfortable stay."
            },
            {
              id: "5",
              title: "Can you accommodate special requests?",
              content: "Absolutely. We're happy to arrange special requests such as romantic setups, birthday celebrations, dietary requirements, or accessible accommodations. Contact us at least 48 hours in advance."
            },
            {
              id: "6",
              title: "What is your check-in and check-out time?",
              content: "Standard check-in is 3:00 PM and check-out is 11:00 AM. Early check-in and late check-out are available subject to availability. Please contact our concierge to arrange."
            }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={[
            {
              title: "Hotel",
              items: [
                { label: "About Us", href: "about" },
                { label: "Rooms & Suites", href: "feature" },
                { label: "Amenities", href: "#" },
                { label: "Gallery", href: "#" }
              ]
            },
            {
              title: "Services",
              items: [
                { label: "Room Service", href: "#" },
                { label: "Spa & Wellness", href: "#" },
                { label: "Restaurant", href: "#" },
                { label: "Events & Meetings", href: "#" }
              ]
            },
            {
              title: "Contact",
              items: [
                { label: "Reservations", href: "contact" },
                { label: "Customer Support", href: "#" },
                { label: "Privacy Policy", href: "#" },
                { label: "Terms & Conditions", href: "#" }
              ]
            }
          ]}
          copyrightText="© 2025 Luxe Hotel. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}