"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import ProductCardSeven from '@/components/sections/product/ProductCardSeven';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import TestimonialCardEight from '@/components/sections/testimonial/TestimonialCardEight';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Phone } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="small"
      sizing="small"
      background="fluid"
      cardStyle="glass-elevated"
      primaryButtonStyle="neon-glow-border"
      secondaryButtonStyle="layered"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={[
            { name: "Home", id: "hero" },
            { name: "Rooms", id: "rooms" },
            { name: "Amenities", id: "amenities" },
            { name: "Reviews", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Book Now",
            href: "contact"
          }}
          brandName="LuxeStay"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplit
          tag="Premium Accommodations"
          title="Ekkerienc sss Likssse Never Before"
          description="Discover our world-class hotel featuring elegant rooms, world-renowned service, and unforgettable experiences tailored to every guest."
          buttons={[
            { text: "Book Your Stay", href: "contact" },
            { text: "Explore Rooms", href: "rooms" }
          ]}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184710583-yt05ru42.jpg"
          imageAlt="Luxury hotel lobby with elegant interior design"
          imagePosition="right"
        />
      </div>

      <div id="rooms" data-section="rooms">
        <ProductCardSeven
          title="Our Room Collection"
          description="Choose from our carefully curated selection of rooms and suites designed for your comfort and relaxation"
          tag="Accommodations"
          products={[
            {
              id: "1",
              name: "Standard Room",
              price: "$149/night",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184717131-qr8fo1hm.jpg",
              imageAlt: "Bright and modern standard hotel room"
            },
            {
              id: "2",
              name: "Deluxe Room",
              price: "$249/night",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184712312-lhl1h85w.jpg",
              imageAlt: "Spacious deluxe room with premium amenities"
            },
            {
              id: "3",
              name: "Grand Suite",
              price: "$449/night",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766243008667-twrhhm4j.jpg",
              imageAlt: "Luxurious grand suite with panoramic views"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          containerStyle="default"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="amenities" data-section="amenities">
        <FeatureCardThree
          title="World-Class Amenities"
          description="Everything you need for an unforgettable stay"
          tag="Facilities"
          features={[
            {
              id: "01",
              title: "Olympic Pool",
              description: "Stunning outdoor swimming pool with panoramic city views and poolside bar service",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184722691-mip9ww4c.jpg",
              imageAlt: "Luxury hotel swimming pool"
            },
            {
              id: "02",
              title: "Spa Wellness",
              description: "Full-service spa offering massages, facials, and holistic wellness treatments",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184718060-6nx8o2ui.jpg",
              imageAlt: "Relaxing spa treatment area"
            },
            {
              id: "03",
              title: "Fine Dining",
              description: "Award-winning restaurant featuring international cuisine and carefully curated wine selection",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766452376695-4rxtbd0x.jpg",
              imageAlt: "Elegant restaurant dining area"
            },
            {
              id: "04",
              title: "Fitness Center",
              description: "State-of-the-art fitness facilities with personal training and group classes available",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184719816-2670gl5k.jpg",
              imageAlt: "Modern hotel fitness center"
            }
          ]}
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          containerStyle="default"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardEight
          title="Guest Experiences"
          description="Hear what our valued guests have to say about their stays"
          tag="Reviews"
          testimonials={[
            {
              id: "1",
              name: "Sarah Anderson",
              role: "Travel Blogger",
              company: "Wanderlust Chronicles",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183586665-q5sajrdt.jpg",
              imageAlt: "Sarah Anderson"
            },
            {
              id: "2",
              name: "Michael Chen",
              role: "Business Executive",
              company: "Tech Innovations Inc",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183587552-1pqoe5c0.jpg",
              imageAlt: "Michael Chen"
            },
            {
              id: "3",
              name: "Emma Thompson",
              role: "Event Coordinator",
              company: "Luxe Events",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766154634313-y5tjxwwi.jpg",
              imageAlt: "Emma Thompson"
            },
            {
              id: "4",
              name: "James Rodriguez",
              role: "Corporate Manager",
              company: "Global Solutions Ltd",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766163678723-295psgl3.jpg",
              imageAlt: "James Rodriguez"
            },
            {
              id: "5",
              name: "Lisa Park",
              role: "Honeymoon Couple",
              company: "Newlyweds",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766184724760-wxlm9bjg.jpg",
              imageAlt: "Lisa Park"
            },
            {
              id: "6",
              name: "David Wilson",
              role: "Hotel Critic",
              company: "Elite Travel Magazine",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140061652-x0v8jc88.jpg",
              imageAlt: "David Wilson"
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="Book Your Perfect Getaway"
          ctaDescription="Contact our reservations team to secure your luxury accommodation and personalized experience"
          ctaButton={{
            text: "Reserve Now",
            href: "mailto:reservations@luxestay.com"
          }}
          ctaIcon={Phone}
          faqs={[
            {
              id: "1",
              title: "What are your cancellation policies?",
              content: "We offer flexible cancellation up to 48 hours before arrival for a full refund. Cancellations within 48 hours may incur one night's charge depending on the rate type."
            },
            {
              id: "2",
              title: "Do you offer airport transfers?",
              content: "Yes, we provide complimentary airport transfers for all guests. Please arrange this during booking or contact our concierge upon arrival."
            },
            {
              id: "3",
              title: "Are pets allowed?",
              content: "We welcome well-behaved pets with a one-time fee of $50. Please notify us during booking so we can prepare a pet-friendly room."
            },
            {
              id: "4",
              title: "What time are check-in and check-out?",
              content: "Standard check-in is at 3:00 PM and check-out is at 11:00 AM. Early check-in and late check-out available upon request, subject to availability."
            },
            {
              id: "5",
              title: "Is Wi-Fi included in the room rate?",
              content: "Yes, complimentary high-speed Wi-Fi is included with all room bookings for all guests staying at the hotel."
            },
            {
              id: "6",
              title: "Do you have meeting and event spaces?",
              content: "Absolutely! We feature multiple ballrooms and meeting rooms perfect for weddings, conferences, and private events. Contact our events team for details."
            }
          ]}
          useInvertedBackground="noInvert"
          animationType="slide-up"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="LuxeStay"
          copyrightText="© 2024 LuxeStay Hotels. All rights reserved."
          columns={[
            {
              title: "About",
              items: [
                { label: "Our Story", href: "#about" },
                { label: "Awards", href: "#awards" },
                { label: "Careers", href: "#careers" },
                { label: "Press", href: "#press" }
              ]
            },
            {
              title: "Guest Services",
              items: [
                { label: "Reservations", href: "#reservations" },
                { label: "Loyalty Program", href: "#loyalty" },
                { label: "Group Bookings", href: "#groups" },
                { label: "Contact Us", href: "#contact" }
              ]
            },
            {
              title: "Facilities",
              items: [
                { label: "Rooms & Suites", href: "#rooms" },
                { label: "Dining", href: "#dining" },
                { label: "Spa", href: "#spa" },
                { label: "Events", href: "#events" }
              ]
            },
            {
              title: "Legal",
              items: [
                { label: "Privacy Policy", href: "#privacy" },
                { label: "Terms of Service", href: "#terms" },
                { label: "Cookie Policy", href: "#cookies" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}