"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import AboutMetric from '@/components/sections/about/AboutMetric';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Star, Users, Trophy, MapPin, ThumbsUp, Globe, Bell } from 'lucide-react';

export default function LuxeHavenPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="compact"
      sizing="mediumLargeSizeLargeTitles"
      background="aurora"
      cardStyle="glass-elevated"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen 
          brandName="Luxe Haven"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "Rooms", id: "rooms" },
            { name: "Amenities", id: "amenities" },
            { name: "About", id: "about" },
            { name: "Contact", id: "contact" }
          ]}
          bottomLeftText="Luxury Hospitality"
          bottomRightText="reservations@luxehaven.com"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogo 
          logoText="Luxe Haven"
          description="Experience world-class hospitality in our luxury resort. Discover elegance, comfort, and unforgettable moments."
          buttons={[
            { text: "Book Your Stay", href: "contact" },
            { text: "Explore Rooms", href: "rooms" }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/luxury-bedroom-interior-with-rich-furniture-scenic-view-from-walkout-deck_1258-111483.jpg"
          imageAlt="Luxury hotel lobby with elegant interior design"
          showDimOverlay={true}
          logoLineHeight={1.15}
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric 
          title="Award-winning luxury hospitality delivering exceptional guest experiences for over two decades"
          useInvertedBackground="invertDefault"
          metrics={[
            { icon: Star, label: "Guest Rating", value: "4.9/5" },
            { icon: Users, label: "Happy Guests", value: "50K+" },
            { icon: Trophy, label: "Industry Awards", value: "25+" },
            { icon: MapPin, label: "Years of Excellence", value: "20+" }
          ]}
        />
      </div>

      <div id="rooms" data-section="rooms">
        <ProductCardTwo 
          title="Our Luxurious Room Collections"
          description="Choose from our curated selection of elegant suites and rooms, each designed for ultimate comfort and relaxation."
          textboxLayout="default"
          animationType="slide-up"
          gridVariant="uniform-all-items-equal"
          useInvertedBackground="noInvert"
          products={[
            {
              id: "deluxe",              brand: "Standard Comfort",              name: "Deluxe Room",              price: "from $189",              rating: 5,
              reviewCount: "1.2k",              imageSrc: "https://img.b2bpic.net/free-photo/luxury-bedroom-interior-with-rich-furniture-scenic-view-from-walkout-deck_1258-111483.jpg",              imageAlt: "Deluxe suite with modern furnishings"
            },
            {
              id: "presidential",              brand: "Premium Luxury",              name: "Presidential Suite",              price: "from $599",              rating: 5,
              reviewCount: "856",              imageSrc: "https://img.b2bpic.net/free-photo/luxury-bedroom-interior-with-rich-furniture-scenic-view-from-walkout-deck_1258-111480.jpg",              imageAlt: "Presidential suite with panoramic views"
            },
            {
              id: "oceanview",              brand: "Beachfront Collection",              name: "Ocean View Suite",              price: "from $349",              rating: 5,
              reviewCount: "2.1k",              imageSrc: "https://img.b2bpic.net/free-photo/hotel-room-with-lit-lamp_1203-547.jpg",              imageAlt: "Ocean view room with private balcony"
            }
          ]}
        />
      </div>

      <div id="amenities" data-section="amenities">
        <FeatureCardSeven 
          title="World-Class Amenities"
          description="Indulge in our premium facilities designed to enhance your stay and provide ultimate relaxation"
          tag="Amenities"
          textboxLayout="default"
          animationType="blur-reveal"
          useInvertedBackground="invertDefault"
          features={[
            {
              id: 1,
              title: "Luxury Spa & Wellness",              description: "Rejuvenate your mind and body with our full-service spa offering massage therapy, facials, and wellness treatments in a serene environment.",              imageSrc: "https://img.b2bpic.net/free-photo/spa-equipments-with-soap-cotton-flower_23-2147844979.jpg",              imageAlt: "Spa and wellness center"
            },
            {
              id: 2,
              title: "Fine Dining Restaurant",              description: "Savor world-class cuisine prepared by our award-winning chefs in our elegant dining room with panoramic views.",              imageSrc: "https://img.b2bpic.net/free-photo/spa-massage-concept-with-woman_23-2147817023.jpg",              imageAlt: "Fine dining restaurant"
            },
            {
              id: 3,
              title: "Resort Swimming Pool",              description: "Relax by our infinity pool overlooking the landscape, complete with poolside service and comfortable lounge areas.",              imageSrc: "https://img.b2bpic.net/free-photo/blanket-with-red-rose-blurred-background_1122-1473.jpg",              imageAlt: "Luxury resort pool"
            },
            {
              id: 4,
              title: "State-of-the-Art Fitness",              description: "Stay active in our modern gym equipped with the latest fitness technology and personal training services available.",              imageSrc: "https://img.b2bpic.net/free-photo/woman-relaxing-bath-with-bubbles_1303-24667.jpg",              imageAlt: "Fitness center with modern equipment"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwelve 
          testimonials={[
            {
              id: "1",              name: "Sarah Mitchell",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-airline-check-attendant-counter_107420-95799.jpg",              imageAlt: "Sarah Mitchell"
            },
            {
              id: "2",              name: "James Richardson",              imageSrc: "https://img.b2bpic.net/free-photo/woman-with-shopping-cart-by-grocery-store-talking-phone_1303-28930.jpg",              imageAlt: "James Richardson"
            },
            {
              id: "3",              name: "Emma & David Thompson",              imageSrc: "https://img.b2bpic.net/free-photo/smiling-woman-walking-with-trolley-bag-airport-terminal_107420-85050.jpg",              imageAlt: "Emma and David Thompson"
            },
            {
              id: "4",              name: "The Anderson Family",              imageSrc: "https://img.b2bpic.net/free-photo/stylish-smiling-young-woman-coming-out-from-elevator-with-her-suitcase_23-2148033340.jpg",              imageAlt: "Anderson Family"
            }
          ]}
          cardTitle="Over 50,000 guests trust Luxe Haven for their perfect getaway"
          cardTag="Guest Reviews"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="socialproof" data-section="socialproof">
        <MetricCardOne 
          title="Featured In"
          description="Recognized by leading travel and hospitality publications worldwide"
          textboxLayout="default"
          animationType="opacity"
          gridVariant="uniform-all-items-equal"
          useInvertedBackground="invertDefault"
          metrics={[
            {
              id: "1",              value: "4.9",              title: "Rating",              description: "On all major booking platforms",              icon: Star
            },
            {
              id: "2",              value: "25",              title: "Awards",              description: "International hospitality recognitions",              icon: Trophy
            },
            {
              id: "3",              value: "98",              title: "Percent",              description: "Guest return rate and satisfaction",              icon: ThumbsUp
            },
            {
              id: "4",              value: "50",              title: "Countries",              description: "Guests from around the world",              icon: Globe
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter 
          tag="Get In Touch"
          title="Ready to Experience Luxury?"
          description="Join thousands of satisfied guests who have experienced our world-class hospitality. Reserve your perfect getaway today."
          tagIcon={Bell}
          useInvertedBackground="noInvert"
          inputPlaceholder="Enter your email"
          buttonText="Book Now"
          termsText="By booking with us, you agree to our Terms and Conditions. We respect your privacy."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple 
          columns={[
            {
              title: "Explore",              items: [
                { label: "Home", href: "#hero" },
                { label: "Rooms", href: "#rooms" },
                { label: "Amenities", href: "#amenities" },
                { label: "About", href: "#about" }
              ]
            },
            {
              title: "Services",              items: [
                { label: "Reservations", href: "#contact" },
                { label: "Group Bookings", href: "#contact" },
                { label: "Spa & Wellness", href: "#amenities" },
                { label: "Restaurant", href: "#amenities" }
              ]
            },
            {
              title: "Support",              items: [
                { label: "Contact Us", href: "#contact" },
                { label: "FAQ", href: "#" },
                { label: "Cancellation Policy", href: "#" },
                { label: "Accessibility", href: "#" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms & Conditions", href: "#" },
                { label: "Cookie Policy", href: "#" },
                { label: "Sitemap", href: "#" }
              ]
            }
          ]}
          bottomLeftText="© 2025 Luxe Haven. All rights reserved."
          bottomRightText="Crafted with elegance"
        />
      </div>
    </ThemeProvider>
  );
}