"use client"

import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Crown, Users, Award, Star, Home, Heart, Utensils, Zap, Waves, Sparkles, Phone } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="small"
      sizing="mediumLarge"
      background="floatingGradient"
      cardStyle="gradient-mesh"
      primaryButtonStyle="inset-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Luxury Hotels"
          navItems={[
            { name: "Home", id: "home" },
            { name: "Rooms", id: "rooms" },
            { name: "Amenities", id: "amenities" },
            { name: "Pricing", id: "pricing" },
            { name: "Testimonials", id: "testimonials" }
          ]}
          button={{
            text: "Book Now",            href: "#contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardGallery
          title="Experience Luxury Hospitality"
          description="Discover our world-class accommodations and exceptional service in a serene natural setting. Every detail crafted for your perfect getaway."
          background={{ variant: "radial-gradient" }}
          tag="Award-Winning Resort"
          tagIcon={Crown}
          buttons={[
            { text: "Book Your Stay", href: "#contact" },
            { text: "Explore Rooms", href: "#rooms" }
          ]}
          mediaItems={[
            {
              imageSrc: "https://img.b2bpic.net/free-photo/luxury-bedroom-interior-with-rich-furniture-scenic-view-from-walkout-deck_1258-111483.jpg",              imageAlt: "Luxury hotel suite with panoramic views"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/luxury-bedroom-interior-with-rich-furniture-scenic-view-from-walkout-deck_1258-111480.jpg",              imageAlt: "Resort landscape with ocean views"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/pillow-bed_1203-3064.jpg",              imageAlt: "Elegant hotel lobby interior"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920954.jpg",              imageAlt: "Sophisticated hotel lounge"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/cozy-lively-home-interior-design_23-2151118953.jpg",              imageAlt: "Relaxing poolside area"
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric
          title="Your Premier Destination for Unforgettable Memories and World-Class Hospitality"
          useInvertedBackground="invertDefault"
          metrics={[
            { icon: Users, label: "Happy Guests", value: "50,000+" },
            { icon: Award, label: "Years Excellence", value: "25+" },
            { icon: Star, label: "Five-Star Rating", value: "4.9" },
            { icon: Home, label: "Luxury Suites", value: "200+" }
          ]}
        />
      </div>

      <div id="rooms" data-section="rooms">
        <FeatureCardTwentyFour
          title="Our Room Collections"
          description="Elegantly designed accommodations with premium amenities and stunning views"
          tag="Rooms"
          features={[
            {
              id: "deluxe-room",              title: "Deluxe Room",              author: "Perfect for Couples",              description: "Spacious rooms with king-size beds, marble bathrooms, and balcony views of the gardens. Premium linens and modern amenities ensure your comfort.",              tags: ["King Bed", "Balcony", "Marble Bath"],
              imageSrc: "https://img.b2bpic.net/free-photo/white-pillow-bed_74190-4628.jpg",              imageAlt: "Deluxe hotel room with garden view"
            },
            {
              id: "executive-suite",              title: "Executive Suite",              author: "For Business Travelers",              description: "Premium suite with separate living area, work desk, and complimentary airport transfers. Executive lounge access and concierge service included.",              tags: ["Living Area", "Work Desk", "Lounge Access"],
              imageSrc: "https://img.b2bpic.net/free-photo/hotel-room-with-open-balcony-soft-light-through-curtains-cozy-bedroom_169016-70022.jpg",              imageAlt: "Executive suite with living area"
            },
            {
              id: "penthouse",              title: "Presidential Penthouse",              author: "For Special Occasions",              description: "Ultra-luxurious penthouse suite with private infinity pool, panoramic terrace, and 24-hour butler service. The ultimate luxury experience.",              tags: ["Private Pool", "Butler Service", "Panoramic View"],
              imageSrc: "https://img.b2bpic.net/free-photo/white-comfortable-pillow-blanket-decoration-bed-interior-bedroom_74190-13564.jpg",              imageAlt: "Presidential penthouse suite"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="amenities" data-section="amenities">
        <MetricCardThree
          title="World-Class Amenities"
          description="Discover our comprehensive facilities designed for relaxation, wellness, and entertainment"
          tag="Facilities"
          metrics={[
            { id: "spa", icon: Heart, title: "Luxury Spa", value: "24/7" },
            { id: "restaurant", icon: Utensils, title: "Fine Dining", value: "5 Star" },
            { id: "fitness", icon: Zap, title: "Fitness Center", value: "State Art" },
            { id: "pool", icon: Waves, title: "Olympic Pool", value: "50m" }
          ]}
          animationType="scale-rotate"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardThree
          title="Transparent Pricing"
          description="Choose the perfect package for your stay. All prices include breakfast and airport transfers."
          tag="Packages"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          plans={[
            {
              id: "weekday",              price: "$159",              name: "Weekday Escape",              buttons: [
                { text: "Reserve Now", href: "#contact" },
                { text: "Learn More", href: "#rooms" }
              ],
              features: [
                "Deluxe room accommodation",                "Breakfast included",                "Airport transfers",                "WiFi access",                "Pool access"
              ]
            },
            {
              id: "weekend",              badge: "Most Popular",              badgeIcon: Sparkles,
              price: "$249",              name: "Weekend Luxury",              buttons: [
                { text: "Reserve Now", href: "#contact" },
                { text: "Learn More", href: "#rooms" }
              ],
              features: [
                "Suite accommodation",                "Breakfast & dinner",                "Airport transfers",                "Spa credit $50",                "Concierge service",                "Priority booking"
              ]
            },
            {
              id: "vip",              price: "$499",              name: "Presidential Experience",              buttons: [
                { text: "Reserve Now", href: "#contact" },
                { text: "Learn More", href: "#rooms" }
              ],
              features: [
                "Penthouse suite",                "All meals included",                "Private transfers",                "Full spa access",                "24-hour butler",                "Personal concierge"
              ]
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="What Our Guests Say"
          description="Real experiences from travelers who've discovered their perfect retreat with us"
          tag="Reviews"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          testimonials={[
            {
              id: "1",              name: "Sarah Mitchell",              handle: "Honeymoon Guest",              testimonial: "The most magical stay! Every detail was perfect, from the room to the spa service. The staff went above and beyond to make our honeymoon unforgettable.",              imageSrc: "https://img.b2bpic.net/free-photo/casual-smile-street-style-background-spring_1139-777.jpg",              imageAlt: "Sarah Mitchell"
            },
            {
              id: "2",              name: "James Chen",              handle: "Business Traveler",              testimonial: "Outstanding facilities and exceptional service. The executive suite was spacious and the concierge team helped arrange everything perfectly for my meetings.",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-positive-executive-work_1098-519.jpg",              imageAlt: "James Chen"
            },
            {
              id: "3",              name: "Emma Rodriguez",              handle: "Family Vacation",              testimonial: "Our family loved every minute! The kids enjoyed the pool, we relaxed at the spa, and the restaurants were fantastic. Can't wait to return!",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-attractive-caucasian-smiling-woman_93675-135471.jpg",              imageAlt: "Emma Rodriguez"
            },
            {
              id: "4",              name: "David Thompson",              handle: "Solo Traveler",              testimonial: "Peaceful, luxurious, and welcoming. The staff made me feel at home despite traveling alone. The natural surroundings are absolutely breathtaking.",              imageSrc: "https://img.b2bpic.net/free-photo/businesswoman-glasses-portrait_1262-1461.jpg",              imageAlt: "David Thompson"
            },
            {
              id: "5",              name: "Lisa Anderson",              handle: "Anniversary Celebration",              testimonial: "They arranged a surprise candlelit dinner on the terrace. The attention to detail and personal touch made our anniversary truly special.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-cheerful-teenage-girl-sitting-cafe_1262-3048.jpg",              imageAlt: "Lisa Anderson"
            },
            {
              id: "6",              name: "Michael Park",              handle: "Wellness Retreat",              testimonial: "The spa treatments were world-class and the wellness program helped me truly disconnect and recharge. Highly recommend for anyone seeking renewal.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-young-business-woman-standing-outside-office-buildings-business-success-concept_58466-12274.jpg",              imageAlt: "Michael Park"
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="Ready to Book?"
          ctaDescription="Contact our reservations team to secure your perfect stay. We're available 24/7 to assist you."
          ctaButton={{
            text: "Schedule Your Stay",            href: "https://booking.example.com"
          }}
          ctaIcon={Phone}
          faqs={[
            {
              id: "1",              title: "What's included in room rates?",              content: "All room rates include complimentary breakfast, WiFi, airport transfers, and access to our fitness facilities. Premium packages include spa credits, dining vouchers, and concierge services."
            },
            {
              id: "2",              title: "What's your cancellation policy?",              content: "We offer flexible cancellation up to 7 days before arrival for a full refund. Cancellations within 7 days may incur a one-night charge. Emergency cancellations are handled on a case-by-case basis."
            },
            {
              id: "3",              title: "Do you offer group bookings?",              content: "Yes! We specialize in group accommodations for corporate retreats, weddings, and family reunions. Please contact our group sales team for custom packages and pricing."
            },
            {
              id: "4",              title: "Are pets allowed?",              content: "Selected rooms are pet-friendly with an additional fee of $25 per night. Pets must be registered at check-in. We provide pet amenities including food bowls and bedding."
            },
            {
              id: "5",              title: "What dining options are available?",              content: "We offer 5 restaurants including fine dining, casual café, poolside bar, and room service. Special dietary requirements can be accommodated with advance notice."
            },
            {
              id: "6",              title: "Is there parking available?",              content: "Complimentary valet parking is included with all room bookings. We also offer secure underground parking and EV charging stations for electric vehicles."
            }
          ]}
          useInvertedBackground="noInvert"
          animationType="slide-up"
          accordionAnimationType="smooth"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Luxury Hotels"
          columns={[
            {
              items: [
                { label: "About Us", href: "#about" },
                { label: "Our Rooms", href: "#rooms" },
                { label: "Amenities", href: "#amenities" }
              ]
            },
            {
              items: [
                { label: "Pricing", href: "#pricing" },
                { label: "Testimonials", href: "#testimonials" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              items: [
                { label: "Privacy Policy", href: "/privacy" },
                { label: "Terms of Service", href: "/terms" },
                { label: "Careers", href: "/careers" }
              ]
            },
            {
              items: [
                { label: "Email: info@luxuryhotels.com", href: "mailto:info@luxuryhotels.com" },
                { label: "Phone: +1 (555) 123-4567", href: "tel:+15551234567" },
                { label: "Address: 123 Resort Lane", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}