"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Sparkles, Heart, Award, Facebook, Instagram, Twitter, Linkedin } from 'lucide-react';

export default function RoomsPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="mediumLarge"
      sizing="mediumLarge"
      background="circleGradient"
      cardStyle="soft-shadow"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Serenity Hotel"
          navItems={[
            { name: "Home", id: "/" },
            { name: "About", id: "/about" },
            { name: "Rooms", id: "/rooms" },
            { name: "Amenities", id: "/amenities" },
            { name: "Contact", id: "/contact" }
          ]}
          button={{ text: "Book Now", href: "/contact" }}
        />
      </div>

      <div id="rooms" data-section="rooms">
        <ProductCardThree
          title="Our Luxury Accommodations"
          description="From elegant standard rooms to opulent penthouse suites, each space is designed to provide the ultimate comfort and sophistication for your stay."
          textboxLayout="default"
          animationType="slide-up"
          gridVariant="three-columns-all-equal-width"
          useInvertedBackground="noInvert"
          products={[
            {
              id: "standard",
              name: "Standard Room",
              price: "$149/night",
              imageSrc: "https://img.b2bpic.net/free-photo/pillow-bed_1203-9643.jpg",
              imageAlt: "Standard Room with queen bed",
              initialQuantity: 1
            },
            {
              id: "deluxe",
              name: "Deluxe Suite",
              price: "$249/night",
              imageSrc: "https://img.b2bpic.net/free-photo/luxury-bedroom-interior-with-rich-furniture-scenic-view-from-walkout-deck_1258-111480.jpg",
              imageAlt: "Deluxe Suite with panoramic views",
              initialQuantity: 1
            },
            {
              id: "penthouse",
              name: "Penthouse Suite",
              price: "$599/night",
              imageSrc: "https://img.b2bpic.net/free-photo/room-interior-hotel-bedroom_23-2150683421.jpg",
              imageAlt: "Penthouse Suite with private terrace",
              initialQuantity: 1
            }
          ]}
        />
      </div>

      <div id="room-features" data-section="room-features">
        <FeatureCardThree
          title="Room Features & Amenities"
          description="Every room at Serenity Hotel comes equipped with premium amenities and thoughtful touches to enhance your stay."
          textboxLayout="default"
          animationType="slide-up"
          gridVariant="four-items-2x2-equal-grid"
          useInvertedBackground="invertDefault"
          features={[
            {
              id: "01",
              title: "Premium Bedding",
              description: "Egyptian cotton linens, down pillows, and luxurious mattresses for the perfect night's sleep.",
              imageSrc: "https://img.b2bpic.net/free-photo/luxury-bedroom-interior-with-rich-furniture-scenic-view-from-walkout-deck_1258-111483.jpg",
              imageAlt: "Premium luxury bedding"
            },
            {
              id: "02",
              title: "City Views",
              description: "Floor-to-ceiling windows showcasing breathtaking panoramic city and skyline views.",
              imageSrc: "https://img.b2bpic.net/free-photo/luxury-bedroom-interior-with-rich-furniture-scenic-view-from-walkout-deck_1258-111480.jpg",
              imageAlt: "City view from luxury room"
            },
            {
              id: "03",
              title: "Modern Amenities",
              description: "High-speed WiFi, smart TV, minibar, coffee maker, and premium toiletries.",
              imageSrc: "https://img.b2bpic.net/free-photo/modern-luxurious-bedroom-elegant-comfortable-design-generated-by-ai_188544-29281.jpg",
              imageAlt: "Modern room amenities"
            },
            {
              id: "04",
              title: "Spacious Design",
              description: "Thoughtfully designed spaces with separate living areas and elegant furnishings.",
              imageSrc: "https://img.b2bpic.net/free-photo/room-interior-hotel-bedroom_23-2150683421.jpg",
              imageAlt: "Spacious room design"
            }
          ]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardEight
          title="Flexible Booking Plans"
          description="Select the perfect package tailored to your needs and budget."
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          plans={[
            {
              id: "weekday",
              badge: "Popular",
              badgeIcon: Sparkles,
              price: "$149 - $249",
              subtitle: "Monday to Thursday",
              buttons: [{ text: "Book Weekday", href: "https://booking.example.com" }],
              features: [
                "Standard or Deluxe Room",
                "Full breakfast included",
                "Spa discount (20%)",
                "Complimentary parking",
                "WiFi access"
              ]
            },
            {
              id: "weekend",
              badge: "Value for Couples",
              badgeIcon: Heart,
              price: "$299 - $399",
              subtitle: "Friday to Sunday",
              buttons: [{ text: "Book Weekend", href: "https://booking.example.com" }],
              features: [
                "Deluxe Suite",
                "Breakfast and dinner",
                "Spa package (2 treatments)",
                "Welcome champagne",
                "Room upgrade (based on availability)"
              ]
            },
            {
              id: "extended",
              badge: "Best Value",
              badgeIcon: Award,
              price: "$1,299/week",
              subtitle: "7 nights or more",
              buttons: [{ text: "Book Extended Stay", href: "https://booking.example.com" }],
              features: [
                "Any room type",
                "All meals included",
                "Daily spa service",
                "Complimentary activities",
                "Private concierge service",
                "Free airport transfer"
              ]
            }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="Serenity Hotel"
          copyrightText="© 2025 Serenity Hotel. All rights reserved."
          socialLinks={[
            { icon: Facebook, href: "https://facebook.com/serenityhotel", ariaLabel: "Facebook" },
            { icon: Instagram, href: "https://instagram.com/serenityhotel", ariaLabel: "Instagram" },
            { icon: Twitter, href: "https://twitter.com/serenityhotel", ariaLabel: "Twitter" },
            { icon: Linkedin, href: "https://linkedin.com/company/serenityhotel", ariaLabel: "LinkedIn" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}