// Reusable empty-state for a customer-area route shell. Every M5.2 route
// renders one of these; real content lands in M10.1 / M11.x / M12.x /
// M14.x / etc.

export function ShellEmpty({
  title,
  description,
  milestone,
}: {
  title: string;
  description: string;
  milestone: string;
}) {
  return (
    <section style={{ maxWidth: 720 }}>
      <h1 style={{ fontSize: 28, marginBottom: 8 }}>{title}</h1>
      <p style={{ color: "#444", marginBottom: 24 }}>{description}</p>
      <div
        style={{
          padding: 16,
          border: "1px dashed #ddd",
          borderRadius: 8,
          background: "#fafafa",
          color: "#666",
          fontSize: 14,
        }}
      >
        This surface is a route shell. Real implementation lands in{" "}
        <code>{milestone}</code>. See{" "}
        <a
          href="https://gitea.meghsakha.com/platform/docs/src/branch/main/PLATFORM_ARCHITECTURE.md"
          style={{ color: "#0070f3" }}
        >
          PLATFORM_ARCHITECTURE.md §5a
        </a>{" "}
        for the spec.
      </div>
    </section>
  );
}

export function NotAuthorized() {
  return (
    <section style={{ maxWidth: 720 }}>
      <h1 style={{ fontSize: 28, marginBottom: 8 }}>403 — Not authorized</h1>
      <p style={{ color: "#444" }}>
        This surface requires a role your account doesn&apos;t have. If you think
        that&apos;s a mistake, ask an IT_ADMIN on your tenant to invite you with
        the right role.
      </p>
    </section>
  );
}