"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
import MediaAbout from '@/components/sections/about/MediaAbout';
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Instagram, Facebook, Whatsapp } from 'lucide-react';

export default function Page() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="compact"
      sizing="largeSmall"
      background="floatingGradient"
      cardStyle="glass-elevated"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Rincón del Mar Eco-Hostal"
          navItems={[
            { name: "Home", id: "#hero" },
            { name: "Experience", id: "#about" },
            { name: "Activities", id: "#experiences" },
            { name: "Gallery", id: "#gallery" },
            { name: "Reviews", id: "#testimonials" },
            { name: "Contact", id: "#final-cta" }
          ]}
          button={{ text: "Book on WhatsApp", href: "https://wa.me/<your-whatsapp-number>" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitTestimonial
          title="A Hidden Paradise Where Time Slows Down"
          description="Experience the authentic magic of Rincón del Mar with peaceful beaches, unforgettable sunsets, warm hospitality and unique adventures by the sea."
          background={{ variant: "plain" }}
          testimonials={[
            { name: "Maria P.", handle: "@MariaP_Travels", testimonial: "An incredible escape! Truly beachfront.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-joyful-woman-laughs-happily-keeps-arms-folded-expresses-positive-emotions-grins-from-happiness-dressed-casual-jumper-isolated-blue-wall-has-fun-hears-funny-joke_273609-44695.jpg", imageAlt: "Maria P." },
            { name: "Juan S.", handle: "@Juan_Explorer", testimonial: "Service felt so personal and warm.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-beautiful-african-woman-posing_23-2151438198.jpg", imageAlt: "Juan S." }
          ]}
          mediaAnimation="opacity"
          useInvertedBackground={false}
          buttons={[
            { text: "Book on WhatsApp", href: "https://wa.me/<your-whatsapp-number>" },
            { text: "View Rooms", href: "#gallery" }
          ]}
          avatars={[
            { src: "http://img.b2bpic.net/free-photo/happy-joyful-woman-laughs-happily-keeps-arms-folded-expresses-positive-emotions-grins-from-happiness-dressed-casual-jumper-isolated-blue-wall-has-fun-hears-funny-joke_273609-44695.jpg", alt: "Maria P." },
            { src: "http://img.b2bpic.net/free-photo/medium-shot-beautiful-african-woman-posing_23-2151438198.jpg", alt: "Juan S." },
            { src: "http://img.b2bpic.net/free-photo/teenager-holding-her-hat-enjoying-sunshine_1139-274.jpg", alt: "Guest Avatar 3" },
            { src: "http://img.b2bpic.net/free-photo/3d-rendering-cartoon-character-beach_23-2151054508.jpg", alt: "Guest Avatar 4" }
          ]}
          avatarText="Trusted by hundreds of happy guests!"
          imageSrc="http://img.b2bpic.net/free-photo/view-tank-container-water-storage_23-2151748285.jpg"
          imageAlt="Pristine Caribbean beach at sunset with turquoise water and palm trees"
          marqueeItems={[
            { type: "text", text: "Beachfront Location" },
            { type: "text", text: "Personalized Service" },
            { type: "text", text: "Local Caribbean Cuisine" },
            { type: "text", text: "Nature & Adventure Experiences" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <MediaAbout
          title="Escape the Noise. Discover the Real Caribbean."
          description="Far from crowded tourist destinations, our hostal offers a peaceful retreat surrounded by nature, crystal-clear waters, and genuine local culture. Here, every sunrise begins with the sound of the ocean and every sunset becomes a memory you'll never forget."
          useInvertedBackground={true}
          imageSrc="http://img.b2bpic.net/free-photo/sad-woman-near-sea_23-2150343336.jpg"
          imageAlt="Exterior view of beachfront eco-hostal surrounded by tropical nature"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentySeven
          features={[
            { id: "feat-1", title: "Exceptional Hospitality", descriptions: ["Our team is dedicated to making every guest feel at home."], imageSrc: "http://img.b2bpic.net/free-photo/welcome-pub_1098-22012.jpg", imageAlt: "Smiling face icon" },
            { id: "feat-2", title: "Comfort & Cleanliness", descriptions: ["Well-maintained rooms and comfortable spaces designed for rest."], imageSrc: "http://img.b2bpic.net/free-vector/basin-with-soapy-water-hand-neon-sign_1262-15368.jpg", imageAlt: "Sparkle icon" },
            { id: "feat-3", title: "Delicious Caribbean Cuisine", descriptions: ["Fresh local flavors prepared daily."], imageSrc: "http://img.b2bpic.net/free-photo/cook-holding-plate-with-salad-near-service-bell_23-2148040240.jpg", imageAlt: "Food icon" },
            { id: "feat-4", title: "Peaceful Atmosphere", descriptions: ["The perfect destination to disconnect and recharge."], imageSrc: "http://img.b2bpic.net/free-photo/tranquil-sunset-reflecting-mountain-lake-surface-generated-by-ai_188544-15168.jpg", imageAlt: "Leaf icon" }
          ]}
          animationType="blur-reveal"
          title="Why Guests Love Us"
          description="Our commitment to genuine hospitality and unique experiences sets us apart."
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="experiences" data-section="experiences">
        <ProductCardTwo
          products={[
            { id: "exp-1", brand: "Rincón del Mar", name: "Bioluminescence Tour", price: "Included", rating: 5, reviewCount: "100+", imageSrc: "http://img.b2bpic.net/free-photo/floating-island_1048-4665.jpg", imageAlt: "Bioluminescent ocean at night" },
            { id: "exp-2", brand: "Rincón del Mar", name: "Island Adventures", price: "From $50", rating: 5, reviewCount: "90+", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-tropical-nature_23-2151979548.jpg", imageAlt: "Boat approaching a tropical island" },
            { id: "exp-3", brand: "Rincón del Mar", name: "Sunset Moments", price: "Complimentary", rating: 5, reviewCount: "80+", imageSrc: "http://img.b2bpic.net/free-photo/scenery-sunset-beach-with-calming-waves-ocean_181624-10008.jpg", imageAlt: "Couple watching sunset on the beach" },
            { id: "exp-4", brand: "Rincón del Mar", name: "Local Culture Immersion", price: "From $25", rating: 5, reviewCount: "70+", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-living-farmhouse_23-2150621736.jpg", imageAlt: "Colorful local market in Rincón del Mar" },
            { id: "exp-5", brand: "Rincón del Mar", name: "Snorkeling & Diving", price: "From $40", rating: 5, reviewCount: "65+", imageSrc: "http://img.b2bpic.net/free-photo/snorkeling-tropical-maldives-island_1232-4495.jpg", imageAlt: "People snorkeling in clear waters" },
            { id: "exp-6", brand: "Rincón del Mar", name: "Kayaking in Mangroves", price: "From $30", rating: 5, reviewCount: "50+", imageSrc: "http://img.b2bpic.net/free-photo/young-couple-walking-with-huskies-dog-canyon-near-water_176420-4186.jpg", imageAlt: "Kayakers in a lush mangrove forest" }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="scale-rotate"
          title="Unforgettable Experiences Await"
          description="Immerse yourself in the unique beauty and culture of Rincón del Mar."
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="gallery" data-section="gallery">
        <ProductCardTwo
          products={[
            { id: "gallery-1", brand: "Gallery", name: "Pristine Beach", price: "", rating: 0, reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/coast-lovely-day_1308-41449.jpg", imageAlt: "Rincón del Mar pristine beach" },
            { id: "gallery-2", brand: "Gallery", name: "Comfortable Rooms", price: "", rating: 0, reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/bed-beach_1203-305.jpg", imageAlt: "Interior of a modern and comfortable room" },
            { id: "gallery-3", brand: "Gallery", name: "Dining Area", price: "", rating: 0, reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/sliced-carrots-bowl-vegetables-towel-blue-table_114579-90027.jpg", imageAlt: "Outdoor dining area at the hostal" },
            { id: "gallery-4", brand: "Gallery", name: "Golden Sunset", price: "", rating: 0, reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/nature-moon-paradise-beach-travel_1203-4910.jpg", imageAlt: "Stunning Caribbean sunset over the ocean" },
            { id: "gallery-5", brand: "Gallery", name: "Bioluminescent Night", price: "", rating: 0, reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/world-photography-day-celebration_23-2151644799.jpg", imageAlt: "Glowing bioluminescent water at night" },
            { id: "gallery-6", brand: "Gallery", name: "Island Excursion", price: "", rating: 0, reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/aerial-shot-ocean-coast-with-sandy-beach-greenery-foreground_181624-48931.jpg", imageAlt: "Boat arriving at a beautiful tropical island" },
            { id: "gallery-7", brand: "Gallery", name: "Happy Guests", price: "", rating: 0, reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/friends-having-fun-beach-with-drinks_1157-32247.jpg", imageAlt: "Guests enjoying their time at the hostal" }
          ]}
          gridVariant="bento-grid"
          animationType="slide-up"
          title="Our Gallery"
          description="A glimpse into the beauty and tranquility of your next escape."
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive
          testimonials={[
            { id: "t-1", name: "Sarah Johnson", date: "January 2024", title: "Exceptional Stay", quote: "Everything was exactly as promised. The staff was attentive and incredibly kind.", tag: "Hospitality", avatarSrc: "http://img.b2bpic.net/free-photo/happy-joyful-woman-laughs-happily-keeps-arms-folded-expresses-positive-emotions-grins-from-happiness-dressed-casual-jumper-isolated-blue-wall-has-fun-hears-funny-joke_273609-44695.jpg", avatarAlt: "Sarah Johnson", imageSrc: "http://img.b2bpic.net/free-photo/cropped-shot-lovely-homosexual-couple-have-good-rest-hot-country-recreate-cozy-cafe-hold-glasses-cocktails-have-cheerful-expressions-happy-women-celebrate-something-summer-party_273609-2943.jpg", imageAlt: "Smiling woman on a beach" },
            { id: "t-2", name: "Michael Chen", date: "February 2024", title: "Beyond Expectations", quote: "Excellent experience. The facilities, cleanliness, food and service exceeded expectations.", tag: "Quality", avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-beautiful-african-woman-posing_23-2151438198.jpg", avatarAlt: "Michael Chen", imageSrc: "http://img.b2bpic.net/free-photo/sporty-man-drinking-bright-cocktail-swimming-pool-man-with-dark-hair-glass-with-bright-beverage-looking-camera-leisure-friendship-party-concept_74855-21406.jpg", imageAlt: "Man enjoying a sunset" },
            { id: "t-3", name: "Emily Rodriguez", date: "March 2024", title: "Peaceful Retreat", quote: "A beautiful place to rest and disconnect. Highly recommended.", tag: "Relaxation", avatarSrc: "http://img.b2bpic.net/free-photo/teenager-holding-her-hat-enjoying-sunshine_1139-274.jpg", avatarAlt: "Emily Rodriguez", imageSrc: "http://img.b2bpic.net/free-photo/stylish-traveller-enjoying-vacation-outdoors_23-2148588595.jpg", imageAlt: "Couple walking on the beach" },
            { id: "t-4", name: "David Kim", date: "April 2024", title: "Incredible Views", quote: "The views are incredible and the atmosphere is peaceful and relaxing.", tag: "Scenery", avatarSrc: "http://img.b2bpic.net/free-photo/3d-rendering-cartoon-character-beach_23-2151054508.jpg", avatarAlt: "David Kim", imageSrc: "http://img.b2bpic.net/free-photo/front-view-female-tourist-with-pink-bag_179666-32732.jpg", imageAlt: "Woman looking at ocean view" },
            { id: "t-5", name: "Jessica Lee", date: "May 2024", title: "Magical Experience", quote: "The bioluminescence experience was unforgettable.", tag: "Adventure", avatarSrc: "http://img.b2bpic.net/free-photo/horizontal-shot-beautiful-female-with-attractive-look-has-broad-pleasant-smile-wears-summer-hat-drinks-fresh-cocktail-exotic-beverage-makes-selfie-people-recreation-positiveness-concept_273609-2355.jpg", avatarAlt: "Jessica Lee", imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-perforated-paper-star-shape-with-ocean-background_53876-46921.jpg", imageAlt: "Night bioluminescence boat tour" },
            { id: "t-6", name: "Daniel Wilson", date: "June 2024", title: "Perfect Getaway", quote: "Every moment was pure bliss. We can't wait to return to this serene paradise.", tag: "Couples", avatarSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-elder-tourist-woman_23-2148620263.jpg", avatarAlt: "Daniel Wilson", imageSrc: "http://img.b2bpic.net/free-photo/long-haired-curly-woman-white-shirt-resting-balcony-with-computer-while-her-husband-making-photo-man-with-professional-camera-taking-pictures-his-gorgeous-wife-morning_197531-3201.jpg", imageAlt: "Couple on tropical beach happy" }
          ]}
          title="What Our Guests Say"
          description="Hear from travelers who discovered their hidden paradise with us."
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitMedia
          faqs={[
            { id: "q1", title: "How do I get to Rincón del Mar?", content: "You can reach Rincón del Mar by bus or private transfer from Cartagena. We can assist with arranging transportation upon request." },
            { id: "q2", title: "Do you offer tours?", content: "Yes, we offer a variety of local tours and activities including bioluminescence tours, island hopping, snorkeling, and cultural experiences. Please inquire upon arrival for details." },
            { id: "q3", title: "How close is the beach?", content: "Our hostal is beachfront, so you are just steps away from the pristine Caribbean sands and turquoise waters." },
            { id: "q4", title: "Is this a good place for couples?", content: "Absolutely! Our tranquil atmosphere, beautiful sunsets, and romantic experiences make it an ideal destination for couples seeking a peaceful getaway." },
            { id: "q5", title: "How can I make a reservation?", content: "You can make a reservation directly through our WhatsApp channel by clicking the 'Book on WhatsApp' button throughout the site, or contacting us via phone." }
          ]}
          mediaAnimation="opacity"
          title="Common Questions"
          description="Find answers to frequently asked questions about your stay."
          faqsAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-photo/concierge-returns-passport-traveler_482257-90498.jpg"
          imageAlt="Hotel staff assisting a guest at reception"
        />
      </div>

      <div id="final-cta" data-section="final-cta">
        <HeroSplitTestimonial
          title="Your Next Caribbean Escape Starts Here"
          description="Wake up by the sea, experience authentic Caribbean hospitality and create unforgettable memories."
          background={{ variant: "plain" }}
          testimonials={[
            { name: "Satisfied Guest", handle: "", testimonial: "Ready for paradise!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-wearing-striped-shirt-eyeglasses_273609-13250.jpg", imageAlt: "Smiling traveler" }
          ]}
          mediaAnimation="opacity"
          useInvertedBackground={true}
          buttons={[
            { text: "Reserve on WhatsApp", href: "https://wa.me/<your-whatsapp-number>" }
          ]}
          avatars={[
            { src: "http://img.b2bpic.net/free-photo/young-woman-wearing-striped-shirt-eyeglasses_273609-13250.jpg", alt: "Guest" },
            { src: "http://img.b2bpic.net/free-photo/medium-shot-beautiful-african-woman-posing_23-2151438198.jpg", alt: "Guest 2" },
            { src: "http://img.b2bpic.net/free-photo/teenager-holding-her-hat-enjoying-sunshine_1139-274.jpg", alt: "Guest 3" },
            { src: "http://img.b2bpic.net/free-photo/3d-rendering-cartoon-character-beach_23-2151054508.jpg", alt: "Guest 4" }
          ]}
          avatarText="Join our growing family of happy travelers!"
          imageSrc="http://img.b2bpic.net/free-photo/umbrella-pool-chair_1203-3001.jpg"
          imageAlt="Full-width cinematic sunset beach view"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="Rincón del Mar Eco-Hostal"
          copyrightText="© 2024 Rincón del Mar Eco-Hostal. All rights reserved."
          socialLinks={[
            { icon: Instagram, href: "https://www.instagram.com/yourhostal", ariaLabel: "Instagram" },
            { icon: Facebook, href: "https://www.facebook.com/yourhostal", ariaLabel: "Facebook" },
            { icon: Whatsapp, href: "https://wa.me/<your-whatsapp-number>", ariaLabel: "WhatsApp" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}
