"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ContactText from '@/components/sections/contact/ContactText';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import { Award, Building2, Check, Smile, Utensils, Wifi, Dumbbell, MapPin, Phone, Mail } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="mediumSmall"
        sizing="medium"
        background="aurora"
        cardStyle="inset"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        { name: "Home", id: "hero" },
        { name: "About", id: "about" },
        { name: "Rooms & Prices", id: "rooms" },
        { name: "Contact", id: "contact" },
      ]}
      brandName="The Fern Residency"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroCarouselLogo
      logoText="The Fern Residency"
      description="Environmentally sensitive hotels that offer a unique blend of comfort and sustainability."
      buttons={[
        { text: "View Rooms", href: "#rooms" },
      ]}
      slides={[
        { imageSrc: "http://img.b2bpic.net/free-photo/pillow-bed_74190-4640.jpg", imageAlt: "Luxury room" },
        { imageSrc: "http://img.b2bpic.net/free-photo/pillow-bed_74190-4485.jpg", imageAlt: "Modern lobby" },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <AboutMetric
      useInvertedBackground={true}
      title="Our Commitment"
      metrics={[
        { icon: Building2, label: "Properties", value: "80+" },
        { icon: Smile, label: "Happy Guests", value: "500k+" },
        { icon: Award, label: "Sustainability", value: "100%" },
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="rooms" data-section="rooms">
      <ProductCardFour
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={true}
      products={[
        { id: "1", name: "Winter Green Room", price: "₹4,500 / night", variant: "Cozy", imageSrc: "http://img.b2bpic.net/free-vector/classic-family-bedroom-interior-design_1284-10414.jpg" },
        { id: "2", name: "Fern Club Room", price: "₹6,500 / night", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/abstract-blur-furniture-shop-store-interior_1203-8583.jpg" },
        { id: "3", name: "Hazel Suite", price: "₹9,000 / night", variant: "Luxury", imageSrc: "http://img.b2bpic.net/free-photo/white-pillow-bed_74190-4628.jpg" },
      ]}
      title="Rooms & Rates"
      description="Discover our range of eco-friendly and comfortable accommodation options."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      text="Contact Us: 8128939346 | reservation@fernhotels.com | The Fern Residency, Panjim, Goa"
      background={{ variant: "plain" }}
      useInvertedBackground={false}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseReveal
      logoText="The Fern Residency"
      columns={[
        { title: "Company", items: [{ label: "About", href: "#about" }, { label: "Careers", href: "#" }] },
        { title: "Support", items: [{ label: "Contact", href: "#contact" }, { label: "Privacy", href: "#" }] },
      ]}
      copyrightText="© 2025 The Fern Residency. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}