"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';

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="treatment-categories" data-section="treatment-categories">
      <ProductCardTwo
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="two-columns-alternating-heights"
      useInvertedBackground={false}
      products={[
        {
          id: "botox-injectables",
          brand: "Aesthetic Enhancements",
          name: "Botox & Injectables",
          price: "Personalized",
          rating: 5,
          reviewCount: "245",
          imageSrc: "http://img.b2bpic.net/free-photo/woman-beauty-salon-looking-into-mirror_1303-16737.jpg",
          imageAlt: "Botox & Injectables",
        },
        {
          id: "dermal-fillers",
          brand: "Volume Restoration",
          name: "Dermal Fillers",
          price: "Personalized",
          rating: 5,
          reviewCount: "180",
          imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-cosmetic-treatment_23-2148825296.jpg",
          imageAlt: "Dermal Fillers",
        },
        {
          id: "laser-treatments",
          brand: "Skin Rejuvenation",
          name: "Laser Treatments",
          price: "Personalized",
          rating: 5,
          reviewCount: "120",
          imageSrc: "http://img.b2bpic.net/free-photo/nail-serum-with-transparent-bottle-mirror_23-2149046485.jpg",
          imageAlt: "Laser Treatments",
        },
        {
          id: "skin-rejuvenation",
          brand: "Complexion Renewal",
          name: "Skin Rejuvenation",
          price: "Personalized",
          rating: 5,
          reviewCount: "90",
          imageSrc: "http://img.b2bpic.net/free-photo/luxury-hotel-room-comfort-elegance-relaxation-romance-generated-by-ai_188544-29044.jpg",
          imageAlt: "Skin Rejuvenation",
        },
        {
          id: "body-contouring",
          brand: "Sculpt & Define",
          name: "Body Contouring",
          price: "Personalized",
          rating: 5,
          reviewCount: "210",
          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-getting-beauty-treatment_23-2148910535.jpg",
          imageAlt: "Body Contouring",
        },
        {
          id: "weight-loss",
          brand: "Wellness Programs",
          name: "Weight Loss Programs",
          price: "Personalized",
          rating: 5,
          reviewCount: "300",
          imageSrc: "http://img.b2bpic.net/free-photo/dermatologist-removing-mole-from-womans-shoulder_107420-74017.jpg",
          imageAlt: "Weight Loss Programs",
        },
      ]}
      title="Our Signature Treatments"
      description="Explore a comprehensive range of luxury aesthetic and wellness treatments tailored to your unique needs."
      buttons={[
        {
          text: "View All Treatments",
          href: "/treatments",
        },
      ]}
    />
  </div>

  <div id="treatment-benefits" data-section="treatment-benefits">
      <FeatureCardNine
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          title: "Targeted Anti-Aging",
          description: "Combat fine lines, wrinkles, and volume loss with our advanced injectable and skin rejuvenation therapies.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-s-chin-side-view_23-2148267251.jpg",
            imageAlt: "Anti-aging treatment on phone screen",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7563.jpg",
            imageAlt: "Before and after comparison",
          },
          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ga8cvi&_wi=2",
          imageAlt: "botox injectable treatment luxury",
        },
        {
          title: "Holistic Wellness Approach",
          description: "Beyond aesthetics, we offer wellness programs that integrate seamlessly into your lifestyle for overall vitality.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/monochrome-beauty-product-skincare_23-2151307252.jpg",
            imageAlt: "Wellness app on phone screen",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/woman-lying-massage-room-face-up_1262-413.jpg",
            imageAlt: "Healthy lifestyle visual",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/home-interior-design-arrangement_23-2148986618.jpg?_wi=4",
          imageAlt: "botox injectable treatment luxury",
        },
        {
          title: "Cutting-Edge Technology",
          description: "Our Medspa utilizes the latest in laser and body contouring technology for safe, effective, and precise treatments.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/young-woman-reception-beautician-doctor-two-women-sit-sofa-salon-communicate-choose-procedure_343596-4161.jpg",
            imageAlt: "Laser device on phone screen",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/young-doctor-checking-patient-before-ct-scan_23-2149341517.jpg",
            imageAlt: "Body sculpting technology",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-doing-skincare-home_23-2150642531.jpg?_wi=2",
          imageAlt: "botox injectable treatment luxury",
        },
      ]}
      showStepNumbers={false}
      title="Tailored Solutions for Lasting Beauty"
      description="Each treatment at TREAT Medspa is designed to deliver exceptional results, enhancing your natural beauty and well-being."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterMedia
      imageSrc="http://img.b2bpic.net/free-photo/luxury-modern-apartment-boasts-elegant-furniture-design-generated-by-ai_188544-26999.jpg?_wi=3"
      imageAlt="Luxury Medspa Interior"
      videoSrc="http://img.b2bpic.net/free-photo/winter-season-lodging-entrance_482257-103218.jpg?_wi=3"
      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>
  );
}
