/**
 * Página 404.
 *
 * Um painel só tem duas hipóteses: mostra o que devia, ou fica sem sinal.
 * É essa a leitura do erro.
 */

function Screen404({ onNavigate, slug }) {
  return (
    <div className="flex min-h-screen items-center justify-center p-6">
      <div className="w-full max-w-md border border-border bg-card p-8">
        <p className="label-eyebrow">Erro 404</p>
        <h1 className="mt-2 font-display text-5xl leading-none">SEM SINAL</h1>
        <p className="mt-4 text-sm text-muted-foreground">
          Esta página não existe. Verifica o endereço ou volta ao dashboard.
        </p>
        <button
          type="button"
          onClick={() => onNavigate(slug ? `/${slug}/dashboard` : '/')}
          className="mt-6 bg-primary px-5 py-2.5 text-sm text-primary-foreground hover:opacity-90"
        >
          Voltar ao dashboard
        </button>
      </div>
    </div>
  );
}
