import { SignUp } from "@clerk/nextjs";
import { Database } from "lucide-react";

export default function SignUpPage() {
  return (
    <div className="flex min-h-screen items-center justify-center bg-background">
      <div className="flex flex-col items-center gap-8">
        <div className="flex items-center gap-3">
          <div className="flex items-center justify-center w-10 h-10 rounded-xl bg-primary">
            <Database className="w-5 h-5 text-primary-foreground" />
          </div>
          <div>
            <p className="text-lg font-bold tracking-tight">DemoBMS</p>
            <p className="text-xs text-muted-foreground">Infrastructure Management</p>
          </div>
        </div>
        <SignUp />
      </div>
    </div>
  );
}