/* VOLZAR — цветовые токены
   Принцип: высокий контраст, тиловые «острова» на светлом фоне.
   Без градиентов, без размытых теней.

   КОНТРАСТ. Фирменный тил #2C9991 с белым текстом даёт 3.46:1 — это ниже
   порога WCAG AA для обычного текста (4.5:1). Поэтому ramp разведён:
     --blue-500 #2C9991 — фирменный. Декор: бары, точки, лого, рамки,
                          крупные заголовки от 24px, иконки.
     --blue-600 #247E77 — рабочий. Любая поверхность с мелким белым текстом:
                          кнопки, тил-острова, шапки таблиц, футер. 4.86:1, AA пройден.
   Не заливать мелкий белый текст на --blue-500. */
:root {
  /* ---- Фирменный тил ---- */
  --blue-500: #2C9991;   /* основной фирменный */
  --blue-600: #247E77;   /* hover + поверхности с белым текстом */
  --blue-700: #1C635E;   /* pressed, глубокий, редко */
  --blue-100: #DDEEEC;   /* тинт-поверхность */
  --blue-050: #F1F8F7;   /* самый светлый тинт */

  /* ---- Нейтральные ---- */
  --white:     #FFFFFF;
  --sand-050:  #F5F7F7;  /* почти белый, холодный */
  --sand-100:  #ECEFF0;  /* холодно-серый фон секций */
  --sand-200:  #DCE1E3;  /* волосяные границы */
  --sand-300:  #C6CDD0;  /* граница поплотнее */
  --graphite-900: #1B2024; /* основной текст */
  --graphite-700: #3B4348; /* вторичный текст */
  --graphite-500: #6B7479; /* подписи, приглушённый */
  --graphite-300: #A3ABAF; /* disabled */

  /* ---- Тил вторичный (шапки таблиц, мелкие метки) ---- */
  --teal-500: #2C9991;
  --teal-600: #247E77;
  --teal-100: #DDEEEC;

  /* ---- Функциональные ---- */
  --green-500: #1F9D57;  /* экономия, «да» */
  --green-100: #E4F5EC;
  --red-500:   #D64545;  /* недостаток OEM, «нет» */
  --red-100:   #FBEAEA;
  --amber-500: #FFC734;  /* акцент: пилюли секций, маркеры буллетов */
  --amber-600: #E5AE1C;
  --amber-100: #FFF4D6;

  /* ---- Семантические алиасы ---- */
  --surface-page:       var(--white);
  --surface-alt:        var(--sand-100);   /* чередующиеся секции */
  --surface-card:       var(--white);
  --surface-island:     var(--blue-600);   /* тил-блоки: внутри белый текст */
  --surface-tint:       var(--blue-050);
  --surface-disabled:   var(--sand-100);

  --text-strong:        var(--graphite-900);
  --text-body:          var(--graphite-700);
  --text-muted:         var(--graphite-500);
  --text-on-blue:       var(--white);
  --text-on-blue-soft:  rgba(255,255,255,0.80);
  --text-link:          var(--blue-600);

  --border-subtle:      var(--sand-200);
  --border-strong:      var(--sand-300);
  --border-on-blue:     rgba(255,255,255,0.28);

  --accent:             var(--blue-600);   /* кнопки: белый текст, нужен AA */
  --accent-hover:       var(--blue-700);
  --accent-contrast:    var(--white);
  --accent-brand:       var(--blue-500);   /* декор без текста */
  --table-head:         var(--blue-600);
  --table-stripe:       var(--sand-050);
}