import type { ReactNode } from "react";
import Link from "next/link";
import { FactoryLogo } from "@/components/layout/factory-logo";

/** Centered card layout shared by /login, /register, /reset-password. */
export default function AuthLayout({ children }: { children: ReactNode }) {
  return (
    <div
      className="flex min-h-screen flex-col items-center justify-center p-4"
      style={{ backgroundImage: "var(--factory-brand-gradient-soft)" }}
    >
      <Link href="/" className="mb-6 flex items-center gap-2 text-lg font-semibold" aria-label="AI Software Factory home">
        <FactoryLogo brand className="size-8 rounded-md" />
        <span className="sr-only">AI Software Factory</span>
      </Link>
      <main className="w-full max-w-sm rounded-xl border border-border bg-card p-6 shadow-sm sm:max-w-md">
        {children}
      </main>
      <p className="mt-6 max-w-sm text-center text-xs text-muted-foreground">
        Pages, databases and realtime collaboration — the AI Software Factory workspace.
      </p>
    </div>
  );
}