"use client";

/**
 * Глобальный error-boundary (#770 finding #25). Ловит непойманные ошибки рендера
 * корневого layout/страниц — без него Next.js показывает голый дефолтный экран.
 * Должен сам рендерить <html>/<body> (заменяет root layout при краше).
 */
export default function GlobalError({
  reset,
}: {
  error: Error & { digest?: string };
  reset: () => void;
}) {
  return (
    <html lang="ru">
      <body
        style={{
          margin: 0,
          minHeight: "100vh",
          display: "flex",
          alignItems: "center",
          justifyContent: "center",
          fontFamily:
            'Inter, -apple-system, "Segoe UI", system-ui, sans-serif',
          background: "#f6f7f9",
          color: "#111111",
        }}
      >
        <div style={{ textAlign: "center", maxWidth: 420, padding: 24 }}>
          <h1 style={{ fontSize: 22, fontWeight: 600, marginBottom: 8 }}>
            Что-то пошло не так
          </h1>
          <p style={{ fontSize: 14, lineHeight: 1.5, color: "#5b6066", marginBottom: 20 }}>
            Произошла непредвиденная ошибка. Попробуйте обновить страницу — если
            повторится, вернитесь чуть позже.
          </p>
          <button
            type="button"
            onClick={() => reset()}
            style={{
              border: "none",
              borderRadius: 8,
              padding: "10px 18px",
              fontSize: 14,
              fontWeight: 500,
              cursor: "pointer",
              background: "#1d4ed8",
              color: "#ffffff",
            }}
          >
            Обновить
          </button>
        </div>
      </body>
    </html>
  );
}
