@charset "UTF-8";
/* =====================================================
   all_base.css — Глобальные базовые стили
   Путь: /css2/all_base.css
   Группа конфигуратора: css_общие (1-й, загружается первым)
   Версия: 3.3 — light theme default (no data-theme fallback)
   ===================================================== */

/* ═══ CSS CUSTOM PROPERTIES ═══ */
:root {
  --header-h: 160px;
  --page-max-w: 1500px;
  --transition-speed: 0.35s;
  --focus-color: #3b82f6;
  --focus-offset: 2px;
}
[data-theme="dark"] {
  --focus-color: #5e9aff;
}

/* ═══ СБРОС ═══ */
*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  font-family: Verdana, Arial, Helvetica, sans-serif;
}
.body {
  background-color: #eef2f7;
  background-image:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(59, 130, 246, 0.06) 0%, transparent 60%),
    radial-gradient(ellipse 40% 60% at 95% 30%, rgba(59, 130, 246, 0.04) 0%, transparent 50%),
    radial-gradient(ellipse 40% 60% at 5% 70%, rgba(59, 130, 246, 0.04) 0%, transparent 50%),
    repeating-linear-gradient(
      135deg,
      transparent 0px,
      transparent 40px,
      rgba(59, 130, 246, 0.025) 40px,
      rgba(59, 130, 246, 0.025) 41px
    ),
    repeating-linear-gradient(
      45deg,
      transparent 0px,
      transparent 40px,
      rgba(59, 130, 246, 0.02) 40px,
      rgba(59, 130, 246, 0.02) 41px
    ),
    linear-gradient(170deg, #eef2f7 0%, #e8edf5 30%, #edf1f8 60%, #f0f4f8 100%);
  background-attachment: fixed;
  min-height: 100vh;
}

/* Тёмная тема — свой фон */
[data-theme="dark"] .body {
  background-color: #0c1220;
  background-image:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(58, 88, 148, 0.15) 0%, transparent 60%),
    radial-gradient(ellipse 40% 60% at 95% 30%, rgba(62, 100, 180, 0.08) 0%, transparent 50%),
    radial-gradient(ellipse 40% 60% at 5% 70%, rgba(45, 75, 140, 0.08) 0%, transparent 50%),
    repeating-linear-gradient(
      135deg,
      transparent 0px,
      transparent 40px,
      rgba(80, 120, 200, 0.025) 40px,
      rgba(80, 120, 200, 0.025) 41px
    ),
    repeating-linear-gradient(
      45deg,
      transparent 0px,
      transparent 40px,
      rgba(80, 120, 200, 0.02) 40px,
      rgba(80, 120, 200, 0.02) 41px
    ),
    linear-gradient(170deg, #0e1628 0%, #101d35 30%, #0f1a2e 60%, #0c1422 100%);
}

/* Мобильные: background-attachment: fixed вызывает repaint при скролле */
@media (hover: none) and (pointer: coarse) {
  .body,
  [data-theme="dark"] .body {
    background-attachment: scroll;
  }
}

/* ═══════════════════════════════════════════════════════
   GLOBAL FOCUS-VISIBLE
   Единая обводка фокуса для всех интерактивных элементов.
   Компоненты могут переопределять через более специфичный селектор.
   ═══════════════════════════════════════════════════════ */
:focus { outline: none; }
:focus-visible {
  outline: 2px solid var(--focus-color);
  outline-offset: var(--focus-offset);
}

/* ═══════════════════════════════════════════════════════
   PAGE LAYOUT
   ═══════════════════════════════════════════════════════ */
.page {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.header {
  width: 100%;
  position: sticky;
  top: 0;
  z-index: 1000;
}

.footer {
  width: 100%;
  margin-top: auto;
}

main {
  width: 100%;
  min-width: 0;
  padding: 0 10px;
}

/* ═══ УТИЛИТЫ ═══ */
.page__hidden { display: none !important; }
.page__show-grid { display: block !important; }
.page__show-flex { display: flex !important; }
.page__button-unavailable {
  opacity: 0.35;
  pointer-events: none;
}

/* ═══ Yandex рейтинг iframe ═══ */
.footer__yandex {
  border: none;
  overflow: hidden;
  display: block;
  max-width: 150px;
  height: 50px;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.footer__yandex::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

/* ═══ АДАПТИВ ═══ */
@media (max-width: 1080px) {
  main { padding: 0 5px; }
}

@media (max-width: 540px) {
  main { padding: 0; }
}
