"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import MediaAbout from '@/components/sections/about/MediaAbout';
import ContactText from '@/components/sections/contact/ContactText';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="reveal-blur"
        borderRadius="rounded"
        contentWidth="smallMedium"
        sizing="medium"
        background="grid"
        cardStyle="gradient-radial"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="layered"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "Home",          id: "/"},
        {
          name: "About Ryan",          id: "/about"},
        {
          name: "Treatments",          id: "/treatments"},
        {
          name: "Locations",          id: "/locations"},
        {
          name: "Before & After",          id: "/gallery"},
        {
          name: "Financing",          id: "/financing"},
        {
          name: "Blog",          id: "/blog"},
        {
          name: "Contact",          id: "/contact"},
      ]}
      logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ga8cvi"
      logoAlt="TREAT Medspa Logo"
      brandName="TREAT Medspa"
      button={{
        text: "Book Consultation",        href: "/contact"}}
    />
  </div>

  <div id="our-locations" data-section="our-locations">
      <ContactText
      useInvertedBackground={false}
      background={{
        variant: "plain"}}
      text="Visit TREAT Medspa at Our Premium Locations"
      buttons={[
        {
          text: "New York City",          href: "#nyc"},
        {
          text: "Miami",          href: "#miami"},
        {
          text: "Los Angeles",          href: "#la"},
      ]}
    />
  </div>

  <div id="location-details" data-section="location-details">
      <MediaAbout
      useInvertedBackground={false}
      title="Find Your Nearest TREAT Medspa"
      description="Each of our locations offers the same standard of luxury, personalized care, and advanced aesthetic treatments."
      buttons={[
        {
          text: "Get Directions",          href: "#"},
        {
          text: "Book at This Location",          href: "/contact"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/modern-architecture-urban-center_1359-870.jpg"
      imageAlt="Interactive map showing Medspa locations"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterMedia
      videoSrc="http://img.b2bpic.net/free-photo/winter-season-lodging-entrance_482257-103218.jpg"
      videoAriaLabel="Luxury Medspa reception area ambiance"
      logoText="TREAT Medspa"
      columns={[
        {
          title: "Explore",          items: [
            {
              label: "Home",              href: "/"},
            {
              label: "About Ryan",              href: "/about"},
            {
              label: "Treatments",              href: "/treatments"},
            {
              label: "Locations",              href: "/locations"},
          ],
        },
        {
          title: "Resources",          items: [
            {
              label: "Before & After",              href: "/gallery"},
            {
              label: "Financing",              href: "/financing"},
            {
              label: "Blog",              href: "/blog"},
            {
              label: "Contact",              href: "/contact"},
          ],
        },
        {
          title: "Legal",          items: [
            {
              label: "Privacy Policy",              href: "#"},
            {
              label: "Terms of Service",              href: "#"},
          ],
        },
      ]}
      copyrightText="© 2025 TREAT Medspa. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
