import { Suspense } from "react";
import { LoginForm } from "./login-form";

export default function LoginPage() {
  return (
    <main className="grid min-h-screen place-items-center bg-brand-paper px-6 py-10 text-slate-950">
      <section className="w-full max-w-md rounded-lg border border-brand-primary/20 bg-white p-6 shadow-sm">
        <p className="text-sm font-semibold text-brand-primary">WorkOnClock</p>
        <h1 className="mt-2 text-2xl font-semibold">Sign in</h1>
        <Suspense fallback={null}>
          <LoginForm />
        </Suspense>
      </section>
    </main>
  );
}