"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import SplitAbout from '@/components/sections/about/SplitAbout';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import { Car, Clock, Coffee, Home, Mountain, Waves, Wifi } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="mediumSmall"
        sizing="large"
        background="floatingGradient"
        cardStyle="outline"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Home",
          id: "#home",
        },
        {
          name: "Rooms",
          id: "#rooms",
        },
        {
          name: "Amenities",
          id: "#amenities",
        },
        {
          name: "Gallery",
          id: "#gallery",
        },
        {
          name: "Reviews",
          id: "#reviews",
        },
        {
          name: "Booking",
          id: "#booking",
        },
      ]}
      brandName="Boone Motel"
    />
  </div>

  <div id="home" data-section="home">
      <HeroSplitKpi
      background={{
        variant: "plain",
      }}
      title="Comfortable Stays in Boone"
      description="Clean rooms, friendly staff, warm breakfast, and relaxing mountain atmosphere."
      kpis={[
        {
          value: "100%",
          label: "Cleanliness",
        },
        {
          value: "4.9",
          label: "Guest Rating",
        },
        {
          value: "Free",
          label: "Breakfast",
        },
      ]}
      enableKpiAnimation={true}
      buttons={[
        {
          text: "Book Now",
          href: "#booking",
        },
        {
          text: "Explore Rooms",
          href: "#rooms",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/beautiful-shot-house-with-foggy-mountain-panticosa_181624-47854.jpg"
      mediaAnimation="slide-up"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/positive-caucasian-business-male-taking-off-face-mask-virus-protection-show-his-smile-with-cheerful-get-well-fight-spread-covid-19-epidemic-health-ideas-concept_609648-1061.jpg",
          alt: "Smiling guest",
        },
        {
          src: "http://img.b2bpic.net/free-photo/cheerful-old-woman-hotel-reception_482257-90621.jpg",
          alt: "Friendly staff",
        },
        {
          src: "http://img.b2bpic.net/free-photo/full-shot-happy-family-traveling_23-2149272096.jpg",
          alt: "Happy family",
        },
        {
          src: "http://img.b2bpic.net/free-photo/young-man-with-backpack-looks-way-with-binoculars_641386-1063.jpg",
          alt: "Hiker",
        },
        {
          src: "http://img.b2bpic.net/free-photo/business-trip-corporate-people-concept-male-gray-coat-senior-wit-passport_1157-48844.jpg",
          alt: "Traveler",
        },
      ]}
      avatarText="Trusted by 5,000+ travelers"
      marqueeItems={[
        {
          type: "text",
          text: "Mountain View",
        },
        {
          type: "text",
          text: "Free Parking",
        },
        {
          type: "text",
          text: "Pet Friendly",
        },
        {
          type: "text",
          text: "High-Speed Wi-Fi",
        },
        {
          type: "text",
          text: "Heated Pool",
        },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <SplitAbout
      textboxLayout="split"
      useInvertedBackground={false}
      title="Authentic Mountain Retreat"
      description="Nestled in the heart of the Blue Ridge mountains, we offer a cozy, affordable escape for travelers seeking rest and rejuvenation."
      bulletPoints={[
        {
          title: "Heart of Boone",
          description: "Conveniently located near downtown.",
        },
        {
          title: "Cozy Atmosphere",
          description: "Mountain-inspired wood interior design.",
        },
        {
          title: "Friendly Staff",
          description: "We treat every guest like family.",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/hallway-rural-house_181624-36698.jpg"
      mediaAnimation="blur-reveal"
    />
  </div>

  <div id="rooms" data-section="rooms">
      <ProductCardOne
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="four-items-2x2-equal-grid"
      useInvertedBackground={true}
      products={[
        {
          id: "room-1",
          name: "Queen Deluxe",
          price: "$99",
          imageSrc: "http://img.b2bpic.net/free-photo/bed-room_1373-481.jpg",
        },
        {
          id: "room-2",
          name: "King Suite",
          price: "$129",
          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-cozy-bed-arrangement-with-coffee-cup_23-2150326104.jpg",
        },
        {
          id: "room-3",
          name: "Double Queen",
          price: "$115",
          imageSrc: "http://img.b2bpic.net/free-photo/tent-interior-glamping-night_1268-20438.jpg",
        },
        {
          id: "room-4",
          name: "Family Studio",
          price: "$145",
          imageSrc: "http://img.b2bpic.net/free-photo/photorealistic-wooden-house-interior-with-timber-decor-furnishings_23-2151263520.jpg",
        },
        {
          id: "room-5",
          name: "Accessible Queen",
          price: "$105",
          imageSrc: "http://img.b2bpic.net/free-photo/photorealistic-timber-house-interior-with-wooden-decor-furnishings_23-2151263578.jpg",
        },
        {
          id: "room-6",
          name: "Cozy King",
          price: "$109",
          imageSrc: "http://img.b2bpic.net/free-photo/white-comfortable-pillow-bed-decoration-interior-bed-room_74190-10023.jpg",
        },
      ]}
      title="Our Accommodations"
      description="Relax in our clean, updated, and affordable rooms."
    />
  </div>

  <div id="amenities" data-section="amenities">
      <FeatureCardTen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          title: "Comfort & Convenience",
          description: "Everything you need for a relaxing stay.",
          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/summertime-season-fun_23-2151977115.jpg",
          },
          reverse: false,
          items: [
            {
              text: "Heated Pool",
              icon: Waves,
            },
            {
              text: "Free Breakfast",
              icon: Coffee,
            },
            {
              text: "Fast Wi-Fi",
              icon: Wifi,
            },
            {
              text: "Ample Parking",
              icon: Car,
            },
            {
              text: "Pet Friendly",
              icon: Dog,
            },
          ],
          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-house-with-foggy-mountain-panticosa_181624-47854.jpg",
          imageAlt: "hotel heated swimming pool",
        },
      ]}
      title="Hotel Amenities"
      description="Enjoy these perks during your mountain getaway."
    />
  </div>

  <div id="reviews" data-section="reviews">
      <TestimonialCardTwo
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      testimonials={[
        {
          id: "1",
          name: "Sarah J.",
          role: "Traveler",
          testimonial: "Very clean and comfy rooms. The breakfast was a great start to our day!",
          imageSrc: "http://img.b2bpic.net/free-photo/senior-man-talking-phone_23-2148404354.jpg",
        },
        {
          id: "2",
          name: "Mike B.",
          role: "Family",
          testimonial: "Kids loved the heated pool. Staff was incredibly friendly.",
          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-happy-couple-posing-near-water_23-2148693748.jpg",
        },
        {
          id: "3",
          name: "Emily P.",
          role: "Hiker",
          testimonial: "Perfect location near the trails. Great price and very cozy.",
          imageSrc: "http://img.b2bpic.net/free-photo/front-view-elder-tourist-woman-forest_23-2148620143.jpg",
        },
        {
          id: "4",
          name: "David L.",
          role: "Business",
          testimonial: "Reliable Wi-Fi and quiet atmosphere. Will stay again.",
          imageSrc: "http://img.b2bpic.net/free-photo/businessman-with-suitcase-walking-summer-city_1157-38184.jpg",
        },
        {
          id: "5",
          name: "Anna K.",
          role: "Couple",
          testimonial: "Loved the rustic vibe of the place. Very convenient location.",
          imageSrc: "http://img.b2bpic.net/free-photo/cute-young-couple-enjoying-favorite-song-sitting-white-bed-with-eyes-closed-portrait-graceful-long-haired-girl-with-laptop-earphones-having-fun-with-her-boyfriend-home-morning_197531-3214.jpg",
        },
      ]}
      title="Guest Reviews"
      description="See why travelers choose our motel."
    />
  </div>

  <div id="gallery" data-section="gallery">
      <MetricCardOne
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="bento-grid"
      useInvertedBackground={false}
      metrics={[
        {
          id: "m1",
          value: "15+",
          title: "Room Styles",
          description: "Comfortable configurations",
          icon: Home,
        },
        {
          id: "m2",
          value: "24/7",
          title: "Service",
          description: "Friendly support always",
          icon: Clock,
        },
        {
          id: "m3",
          value: "100%",
          title: "Cozy Vibe",
          description: "Authentic mountain feel",
          icon: Mountain,
        },
      ]}
      title="Motel Highlights"
      description="Explore our cozy mountain retreat."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitText
      useInvertedBackground={true}
      faqs={[
        {
          id: "f1",
          title: "Is parking free?",
          content: "Yes, we provide free parking for all guests.",
        },
        {
          id: "f2",
          title: "Are pets allowed?",
          content: "We are a pet-friendly property!",
        },
        {
          id: "f3",
          title: "Do you offer breakfast?",
          content: "Yes, a warm breakfast is served daily.",
        },
      ]}
      sideTitle="Common Questions"
      sideDescription="Everything you need to know."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="booking" data-section="booking">
      <ContactCenter
      useInvertedBackground={false}
      background={{
        variant: "plain",
      }}
      tag="Booking"
      title="Ready to Book?"
      description="Secure your mountain getaway today."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterMedia
      imageSrc="http://img.b2bpic.net/free-photo/view-nature-with-mountains_1268-14447.jpg"
      logoText="Boone Motel"
      columns={[
        {
          title: "Quick Links",
          items: [
            {
              label: "Rooms",
              href: "#rooms",
            },
            {
              label: "Amenities",
              href: "#amenities",
            },
            {
              label: "Contact",
              href: "#booking",
            },
          ],
        },
        {
          title: "Legal",
          items: [
            {
              label: "Privacy Policy",
              href: "#",
            },
            {
              label: "Terms of Use",
              href: "#",
            },
          ],
        },
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
