"use client";

/** Último recurso si falla el layout raíz: HTML mínimo sin dependencias. */
export default function GlobalError({
  reset,
}: {
  error: Error & { digest?: string };
  reset: () => void;
}) {
  return (
    <html lang="es-PE">
      <body
        style={{ margin: 0, background: "#080808", color: "#ffffff", fontFamily: "sans-serif" }}
      >
        <main
          style={{
            minHeight: "100dvh",
            display: "grid",
            placeItems: "center",
            textAlign: "center",
            padding: 24,
          }}
        >
          <div>
            <p style={{ color: "#f51b2b", letterSpacing: "0.3em", fontWeight: 600 }}>500</p>
            <h1>Algo salió mal</h1>
            <button
              type="button"
              onClick={reset}
              style={{ marginTop: 16, padding: "12px 24px", cursor: "pointer" }}
            >
              Reintentar
            </button>
          </div>
        </main>
      </body>
    </html>
  );
}
