/* Boot-cloak — прибирає спалах нестилізованого HTML (FOUC) на перезавантаженні.
   Основні стилі UI приходять із JS-бандла (import "./styles/*-entry.css"), тому
   до його виконання браузер встигає намалювати «голий» HTML: сирі заголовки,
   логотип у натуральний розмір, форму входу. Цей файл — єдиний блокуючий
   стиль у <head>: він тримає сторінку однотонною, поки дизайн-система не
   застосована. Клас .enver-booting ставить theme-init.js і знімає boot-reveal.js
   одразу після імпорту CSS-бандла (без JS клас не ставиться — noscript не страждає). */

html.enver-booting {
  background: #f4f6f2;
}

html.enver-booting[data-theme="dark"] {
  background: #0e1210;
}

html.enver-booting body {
  margin: 0;
  min-height: 100vh;
  background: inherit;
}

/* Ховаємо весь нестилізований вміст, а не просто робимо прозорим:
   невидимий логотип у натуральний розмір інакше дав би скрол і стрибок. */
html.enver-booting body > * {
  display: none !important;
}

/* Спінер зʼявляється із затримкою: швидке завантаження має бути просто
   чистим фоном, без блимання індикатора. */
html.enver-booting body::before {
  content: "";
  position: fixed;
  top: 50%;
  left: 50%;
  width: 34px;
  height: 34px;
  margin: -17px 0 0 -17px;
  border-radius: 50%;
  border: 3px solid rgba(36, 92, 59, 0.18);
  border-top-color: #1f6b45;
  animation:
    enver-boot-fade 0.2s ease 0.35s both,
    enver-boot-spin 0.8s linear infinite;
}

html.enver-booting[data-theme="dark"] body::before {
  border-color: rgba(74, 158, 106, 0.22);
  border-top-color: #4a9e6a;
}

@keyframes enver-boot-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes enver-boot-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.enver-booting body::before {
    animation:
      enver-boot-fade 0.2s ease 0.35s both,
      enver-boot-spin 2.4s linear infinite;
  }
}