export default function AdminDashboardPage() {
  return (
    <div className="mx-auto max-w-7xl px-4 py-8">
      <h1 className="text-2xl font-semibold">Dashboard</h1>
      <p className="text-slate-500 mt-1">
        Project planning, machines, operations, and users will appear here as each area is built.
      </p>
      <div className="mt-8 grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
        <Card title="Projects" desc="Plan work: assemblies, parts, and operations." />
        <Card title="Machines" desc="Manage shop-floor equipment." />
        <Card title="Operation templates" desc="Reusable step recipes." />
        <Card title="Fasteners & POs" desc="Aggregate BOM, generate purchase orders." />
        <Card title="Users" desc="Admins and operator PIN accounts." />
        <Card title="Audit log" desc="Who did what, when." />
      </div>
    </div>
  );
}

function Card({ title, desc }: { title: string; desc: string }) {
  return (
    <div className="rounded-xl bg-white border border-slate-200 p-5">
      <h2 className="font-medium">{title}</h2>
      <p className="text-sm text-slate-500 mt-1">{desc}</p>
    </div>
  );
}