/* ============================================================
   Авто ЮНА-Лайф — дизайн-токены
   Единственное место, где заданы цвета, шрифты, отступы и радиусы.
   Подключается первым, до site.css и custom.css.
   ============================================================ */

:root {
  /* --- Фирменный цвет ---------------------------------------
     Этап 02: переведён на #0B67C9 из дизайн-предложения. Прежний #0191ff
     на тёмной подложке шапки и на белом фоне давал недостаточный контраст
     для текста на кнопках. */
  --aj-brand: #0B67C9;
  --aj-brand-strong: #08528F;
  --aj-brand-tint: #e1eefb;
  --aj-on-brand: #ffffff;

  /* --- Смысловые цвета: наличие, срок, ошибка --------------- */
  --aj-ok: #0f7554;
  --aj-ok-tint: #daf0e7;
  --aj-wait: #9c5c08;
  --aj-wait-tint: #faebd3;
  --aj-danger: #a82a20;
  --aj-danger-tint: #fae4e1;

  /* --- Нейтральные: холодный графит, не чёрный -------------- */
  --aj-ink: #0f1a24;
  --aj-ink-2: #3d4c59;
  --aj-muted: #6c7c8a;
  --aj-line: #d2dae3;
  --aj-line-soft: #e5ebf1;
  --aj-surface: #ffffff;
  --aj-surface-2: #f5f8fb;
  --aj-paper: #eaeff4;

  /* --- Шрифты ----------------------------------------------
     Пока системные. На этапе 02 сюда подставляются локальные
     Golos Text / Oswald / JetBrains Mono из wwwroot/fonts. */
  --aj-font-ui: 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
  --aj-font-display: 'Segoe UI Semibold', 'Segoe UI', system-ui, Arial, sans-serif;
  --aj-font-mono: 'Cascadia Mono', Consolas, 'Courier New', monospace;

  /* --- Шкала отступов, шаг 8 px ----------------------------- */
  --aj-space-1: 4px;
  --aj-space-2: 8px;
  --aj-space-3: 16px;
  --aj-space-4: 24px;
  --aj-space-5: 32px;
  --aj-space-6: 48px;

  /* --- Радиусы и тени --------------------------------------- */
  --aj-radius-s: 4px;
  --aj-radius-m: 8px;
  --aj-shadow-1: 0 1px 2px rgba(15, 26, 36, .05), 0 2px 10px rgba(15, 26, 36, .05);
}

/* ============================================================
   Подвал сайта
   ============================================================ */

.aj-footer {
  margin-top: var(--aj-space-6);
  background: var(--aj-surface-2);
  border-top: 1px solid var(--aj-line);
  color: var(--aj-ink-2);
  font-size: .875rem;
  line-height: 1.6;
}

.aj-footer__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: var(--aj-space-4);
  padding: var(--aj-space-5) 0 var(--aj-space-4);
}

.aj-footer__title {
  font-family: var(--aj-font-display);
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: .72rem;
  color: var(--aj-muted);
  margin-bottom: var(--aj-space-2);
}

.aj-footer__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.aj-footer__list li {
  padding: 2px 0;
}

.aj-footer a,
.aj-footer__link {
  color: var(--aj-ink-2);
  text-decoration: none;
  background: none;
  border: 0;
  padding: 0;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.aj-footer a:hover,
.aj-footer__link:hover {
  color: var(--aj-brand);
  text-decoration: underline;
}

.aj-footer__req {
  color: var(--aj-muted);
  font-size: .8rem;
}

.aj-footer__bottom {
  border-top: 1px solid var(--aj-line-soft);
  padding: var(--aj-space-3) 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--aj-space-3);
  align-items: center;
  color: var(--aj-muted);
  font-size: .8rem;
}

.aj-footer__pay {
  margin-left: auto;
}

.aj-footer__pay img {
  max-width: 220px;
  height: auto;
}

/* Текст про приём карт: раньше был набран инлайновым font-size: 11px */
.aj-paynote {
  font-size: .78rem;
  color: var(--aj-muted);
  line-height: 1.55;
}

/* ============================================================
   Доступность: видимый фокус с клавиатуры
   ============================================================ */

:focus-visible {
  outline: 2px solid var(--aj-brand);
  outline-offset: 2px;
  border-radius: var(--aj-radius-s);
}

/* Мышиный клик не должен рисовать рамку, клавиатура — должна */
:focus:not(:focus-visible) {
  outline: none;
}

.btn:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible {
  outline: 2px solid var(--aj-brand);
  outline-offset: 1px;
  box-shadow: none;
}
