"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';

export default function LoginPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="background-highlight"
        borderRadius="rounded"
        contentWidth="compact"
        sizing="mediumLargeSizeLargeTitles"
        background="blurBottom"
        cardStyle="gradient-radial"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="layered"
        headingFontWeight="normal"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
            <NavbarLayoutFloatingOverlay
            navItems={[
              { name: "Home", id: "#home" },
              { name: "About", id: "#about" },
              { name: "Features", id: "#features" },
              { name: "Solutions", id: "#solutions" },
              { name: "Pricing", id: "#pricing" },
              { name: "Testimonials", id: "#testimonials" },
              { name: "Contact", id: "#contact" },
              { name: "Login", id: "/login" },
              { name: "Register", id: "/register" },
              { name: "Dashboard", id: "/dashboard" },
              { name: "History", id: "/history" }
            ]}
            brandName="ReservaFlow"
            button={{
              text: "Start Free Trial",              href: "/register"
            }}
          />
        </div>
        <div className="min-h-[calc(100vh-200px)] flex items-center justify-center p-4">
          <h1 className="text-4xl font-bold text-foreground">Customer Login</h1>
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
