"use client";

import { Calendar, Star, CreditCard } from "lucide-react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import FooterSimple from '@/components/sections/footer/FooterSimple';

export default function ContactPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="medium"
      sizing="largeSmallSizeMediumTitles"
      background="circleGradient"
      cardStyle="layered-gradient"
      primaryButtonStyle="flat"
      secondaryButtonStyle="solid"
      headingFontWeight="extrabold"
    >
      {/* Navigation */}
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={[
            { name: "Home", id: "/" },
            { name: "Rooms", id: "/rooms" },
            { name: "Amenities", id: "/amenities" },
            { name: "About", id: "/about" },
            { name: "Book Now", id: "/contact" }
          ]}
          brandName="Luxe Haven"
          bottomLeftText="Luxury Hospitality"
          bottomRightText="reservations@luxehaven.com"
        />
      </div>

      {/* Main Contact Section */}
      <div id="main-contact" data-section="main-contact">
        <ContactCenter
          tag="Reservations"
          title="Book Your Luxury Escape Today"
          description="Experience the pinnacle of hospitality at Luxe Haven. Our reservations team is ready to help you plan the perfect stay, complete with personalized service and exclusive amenities."
          tagIcon={Calendar}
          useInvertedBackground="noInvert"
          inputPlaceholder="Enter your email for booking assistance"
          buttonText="Start Booking"
          termsText="By submitting your email, you'll receive personalized booking assistance and exclusive offers from Luxe Haven."
        />
      </div>

      {/* Booking Options */}
      <div id="booking-options" data-section="booking-options">
        <PricingCardThree
          title="Choose Your Perfect Stay"
          description="Select from our range of elegantly appointed accommodations. Each booking includes complimentary WiFi, access to our fitness center, and 24/7 concierge service."
          tag="Book Now"
          tagIcon={CreditCard}
          plans={[
            {
              id: "standard",              price: "$180",              name: "Standard Room",              buttons: [
                { text: "Book Now", href: "#" },
                { text: "Check Availability", href: "#" }
              ],
              features: [
                "Queen or Twin Beds",                "Marble Bathroom",                "HD Smart TV",                "Free WiFi",                "Air Conditioning",                "24/7 Room Service"
              ]
            },
            {
              id: "deluxe",              badge: "Most Popular",              badgeIcon: Star,
              price: "$280",              name: "Deluxe Room",              buttons: [
                { text: "Book Now", href: "#" },
                { text: "Check Availability", href: "#" }
              ],
              features: [
                "King Bed with Premium Linens",                "Luxury Bathroom with Amenities",                "City View Balcony",                "Minibar & Coffee Maker",                "Concierge Service",                "Free Spa Credit",                "Complimentary Airport Transfer"
              ]
            },
            {
              id: "suite",              price: "$550",              name: "Presidential Suite",              buttons: [
                { text: "Book Now", href: "#" },
                { text: "Check Availability", href: "#" }
              ],
              features: [
                "Separate Living Area",                "Master Bedroom Suite",                "Panoramic City Views",                "Premium Toiletries & Amenities",                "24/7 Dedicated Concierge",                "Complimentary Breakfast",                "Spa & Restaurant Credit",                "Private Airport Transfers"
              ]
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      {/* Contact Methods */}
      <div id="contact-methods" data-section="contact-methods">
        <FeatureCardOne
          title="Multiple Ways to Connect"
          description="Our guest services team is available around the clock to assist with reservations, special requests, and travel planning. Choose your preferred method of contact."
          tag="Contact Options"
          features={[
            {
              title: "Phone Reservations",              description: "Speak directly with our reservations specialists available 24/7. Call us for immediate booking assistance and personalized recommendations.",              imageSrc: "https://img.b2bpic.net/free-photo/side-view-woman-looking-out-window_23-2149622868.jpg",              imageAlt: "Hotel concierge service"
            },
            {
              title: "Email Concierge",              description: "Send us your detailed requests and preferences via email. Our concierge team will respond within 2 hours with personalized recommendations.",              imageSrc: "https://img.b2bpic.net/free-photo/luxury-bedroom-interior-with-rich-furniture-scenic-view-from-walkout-deck_1258-111483.jpg",              imageAlt: "Luxury hotel communication"
            },
            {
              title: "In-Person Visits",              description: "Visit our elegant lobby to meet with our guest services team. Experience our hospitality firsthand before making your reservation.",              imageSrc: "https://img.b2bpic.net/free-photo/hotel-resort-palm-trees-summer-time_116348-4.jpg",              imageAlt: "Hotel lobby and reception"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      {/* Footer */}
      <FooterSimple
        columns={[
          {
            title: "Hotel",            items: [
              { label: "About Us", href: "/about" },
              { label: "Rooms", href: "/rooms" },
              { label: "Amenities", href: "/amenities" },
              { label: "Book Now", href: "/contact" }
            ]
          },
          {
            title: "Guest Services",            items: [
              { label: "Concierge", href: "#" },
              { label: "Room Service", href: "#" },
              { label: "Spa & Wellness", href: "#" },
              { label: "Restaurant", href: "#" }
            ]
          },
          {
            title: "Information",            items: [
              { label: "Contact Us", href: "/contact" },
              { label: "Location", href: "#" },
              { label: "Careers", href: "#" },
              { label: "Group Bookings", href: "#" }
            ]
          },
          {
            title: "Legal",            items: [
              { label: "Privacy Policy", href: "#" },
              { label: "Terms & Conditions", href: "#" },
              { label: "Cookie Policy", href: "#" },
              { label: "Sitemap", href: "#" }
            ]
          }
        ]}
        bottomLeftText="© 2025 Luxe Haven Hotel. All rights reserved."
        bottomRightText="Crafted for Luxury Hospitality"
      />
    </ThemeProvider>
  );
}