/* ============================================================
   ETS-Tender Design Tokens
   Единственный источник правды по цветам, типографике, отступам, радиусам.
   Подключается через <link> из B2BCenter\Ets\View\FontAssets.
   --ets-font: Manrope (kaz → Inter, переопределяется в FontAssets).
   ============================================================ */

:root {
  /* ----- Brand colors ----- */
  --ets-teal:        #00A896;
  --ets-teal-bright: #00BFA8;   /* gradient start */
  --ets-blue:        #1648CC;   /* gradient end, link color */
  --ets-blue-soft:   #4A6FE0;   /* hover on links */
  --ets-link:        #1648CC;   /* семантический токен ссылок (в дарке → sky-blue) */
  --ets-link-hover:  #00A896;   /* hover (в дарке → blue-300) */
  --ets-navy:        #0F172A;   /* darkest text, dark headers */
  --ets-purple:      #6633CC;   /* logo accent only */

  /* The signature ETS gradient — primary CTAs, logo, hero accents */
  --ets-grad: linear-gradient(135deg, #00BFA8 0%, #1648CC 100%);
  --ets-grad-soft: linear-gradient(135deg, rgba(0,191,168,.08) 0%, rgba(22,72,204,.08) 100%);

  /* ----- Surfaces ----- */
  --ets-bg:          #FFFFFF;   /* page background */
  --ets-surface:     #FFFFFF;   /* cards, panels */
  --ets-surface-2:   #F1F5F9;   /* nested / striped rows */
  --ets-border:      #E2E8F0;   /* dividers, card edges */
  --ets-border-strong:#CBD5E1;  /* form inputs */

  /* Dark surface (header, modals over photo) */
  --ets-dark:        #0F172A;
  --ets-dark-2:      #1E293B;
  --ets-dark-3:      #334155;

  /* ----- Text ----- */
  --ets-text-1:      #0F172A;   /* primary */
  --ets-text-2:      #475569;   /* secondary */
  --ets-text-3:      #94A3B8;   /* tertiary, placeholders, captions */
  --ets-muted:       #64748B;   /* nav, footer copy */

  /* ----- Semantic ----- */
  --ets-success:     #00A896;
  --ets-success-bg:  rgba(0,168,150,.10);
  --ets-warn:        #F59E0B;
  --ets-warn-bg:     rgba(245,158,11,.12);
  --ets-error:       #DC2626;
  --ets-error-bg:    rgba(220,38,38,.10);
  --ets-info:        #1648CC;
  --ets-info-bg:     rgba(22,72,204,.08);

  /* Danger — насыщенный flat для бейджей и outline delete-кнопок. */
  --ets-danger:           #EF4444;
  --ets-danger-border:    #FECACA;
  --ets-danger-bg-soft:   #FEF2F2;

  /* Подсветка непрочитанных строк (списки сообщений и т.п.) */
  --ets-unread-bg:        #EFF9F8;

  /* ----- Type scale ----- */
  --ets-font: 'Manrope', 'Helvetica Neue', Arial, sans-serif;
  --ets-font-mono: 'JetBrains Mono', 'SF Mono', Consolas, monospace;

  --ets-fs-display: 32px;  /* page heros — used sparingly */
  --ets-fs-h1: 24px;       /* page title */
  --ets-fs-h2: 20px;       /* section title */
  --ets-fs-h3: 16px;       /* card title */
  --ets-fs-h4: 14px;       /* sub-heading, table head */
  --ets-fs-body: 13px;     /* default body */
  --ets-fs-body-lg: 14px;  /* primary read */
  --ets-fs-small: 12px;    /* meta, captions */
  --ets-fs-micro: 11px;    /* counters, deltas */

  --ets-lh-tight: 1.2;
  --ets-lh-snug: 1.4;
  --ets-lh-body: 1.55;

  --ets-fw-regular: 400;
  --ets-fw-medium:  500;
  --ets-fw-semibold:600;
  --ets-fw-bold:    700;
  --ets-fw-black:   800;

  /* ----- Spacing (4px base) ----- */
  --ets-s-1: 4px;
  --ets-s-2: 8px;
  --ets-s-3: 12px;
  --ets-s-4: 16px;
  --ets-s-5: 20px;
  --ets-s-6: 24px;
  --ets-s-7: 32px;
  --ets-s-8: 40px;
  --ets-s-9: 48px;
  --ets-s-10: 64px;

  /* ----- Radii ----- */
  --ets-r-sm: 4px;     /* form inputs */
  --ets-r-md: 6px;     /* buttons */
  --ets-r-lg: 8px;     /* small cards, pills */
  --ets-r-xl: 12px;    /* main cards */
  --ets-r-2xl: 16px;   /* hero cards */
  --ets-r-pill: 999px; /* badges */

  /* ----- Shadows ----- */
  --ets-shadow-sm:  0 1px 2px rgba(15,23,42,.04);
  --ets-shadow-md:  0 2px 8px rgba(15,23,42,.06);
  --ets-shadow-lg:  0 8px 24px rgba(15,23,42,.08);
  --ets-shadow-xl:  0 16px 48px rgba(15,23,42,.12);
  --ets-shadow-cta: 0 4px 14px rgba(22,72,204,.25);

  /* ----- Layout ----- */
  --ets-container: 1200px;
  --ets-container-wide: 1400px;
  --ets-sidebar: 220px;

  /* ----- Motion ----- */
  --ets-ease: cubic-bezier(.4,0,.2,1);
  --ets-dur-fast: 120ms;
  --ets-dur: 180ms;
  --ets-dur-slow: 280ms;
}

/* Reset/baseline */
*, *::before, *::after { box-sizing: border-box; }
body {
  font-family: var(--ets-font);
  font-size: var(--ets-fs-body);
  line-height: var(--ets-lh-body);
  color: var(--ets-text-1);
  background: var(--ets-bg);
  margin: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Custom scrollbar — webkit-only, чтобы Chrome 121+ не подменял стиль на свой "thin". */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: #F0F4FF; }
::-webkit-scrollbar-thumb { background: var(--ets-blue); border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: var(--ets-blue-soft); }

/* ============================================================
   DARK THEME — <body class="dark">
   Инвертируем surface + text, бренд (teal/blue/purple/gradient) сохраняем.
   Активируется через cookie color_scheme + #scheme-trigger (opt-in,
   список контроллеров — в project_dark_theme_cleanup_targets.md).
   ============================================================ */
body.dark {
  /* Surfaces */
  --ets-bg:           #0B1120;
  --ets-surface:      #1A2335;
  --ets-surface-2:    #111A2E;
  --ets-border:       #283449;
  --ets-border-strong:#3B4A66;

  /* Text */
  --ets-text-1:       #F1F5F9;
  --ets-text-2:       #CBD5E1;
  --ets-text-3:       #94A3B8;
  --ets-muted:        #94A3B8;

  /* Blue осветляем — иначе #1648CC сливается с тёмным surface. */
  --ets-blue:         #4A6FE0;
  --ets-blue-soft:    #7B96E8;

  /* Ссылки — sky-blue, контраст к surface ≥ WCAG AA. */
  --ets-link:         #60A5FA;
  --ets-link-hover:   #93C5FD;

  /* Semantic — ярче на ступень для читаемости. */
  --ets-success:      #34D399;
  --ets-success-bg:   rgba(52,211,153,.14);
  --ets-warn:         #FBBF24;
  --ets-warn-bg:      rgba(251,191,36,.14);
  --ets-error:        #F87171;
  --ets-error-bg:     rgba(248,113,113,.14);
  --ets-info:         #4A6FE0;
  --ets-info-bg:      rgba(74,111,224,.14);

  --ets-danger:           #F87171;
  --ets-danger-border:    rgba(239,68,68,.45);
  --ets-danger-bg-soft:   rgba(239,68,68,.10);

  --ets-unread-bg:        rgba(0,168,150,.10);

  /* Тени глубже для тёмного UI. */
  --ets-shadow-sm:    0 1px 2px rgba(0,0,0,.4);
  --ets-shadow-md:    0 2px 8px rgba(0,0,0,.35);
  --ets-shadow-lg:    0 8px 24px rgba(0,0,0,.45);
  --ets-shadow-xl:    0 16px 48px rgba(0,0,0,.55);
  --ets-shadow-cta:   0 4px 14px rgba(0,168,150,.40);

  --ets-dark:         #1A2335;
  --ets-dark-2:       #283449;
  --ets-dark-3:       #3B4A66;

  color-scheme: dark;
}

body.dark ::-webkit-scrollbar-track {
  background: var(--ets-surface-2);
}

/* Плавное переключение темы (только color-свойства). */
html { transition: background-color var(--ets-dur) var(--ets-ease); }
body, .card, .frame, [class*="-card"], [class*="-panel"] {
  transition: background-color var(--ets-dur) var(--ets-ease),
              border-color var(--ets-dur) var(--ets-ease),
              color var(--ets-dur) var(--ets-ease);
}

/* ============================================================
   DARK COMPONENT OVERRIDES
   Точечные правки для классов с hardcoded цветами (#fff, #EBEBEB),
   которые не используют токены. Лежат в tokens.css — подключается
   единственным conditional include на kaz-гейте, без пересборки LESS.
   ============================================================ */

/* .primaryBg — rgb(235,235,235)!important в base.less. */
body.dark .primaryBg {
  background-color: var(--ets-surface) !important;
  color: var(--ets-text-1);
}

/* .neutralBg — #F5F5F5, большие серые секции. */
body.dark .neutralBg {
  background-color: var(--ets-surface-2) !important;
  color: var(--ets-text-1);
}

/* .featured-layout — hero-обёртка главной (#F8FAFC в kaz/components). */
body.dark .featured-layout {
  background-color: var(--ets-surface-2);
  color: var(--ets-text-1);
}

/* Hero h1 и заголовки карточек "Поставщикам/Заказчикам": var(--ets-navy)!important
   побеждает наш `body.dark h1`. Дублируем override на случай несобранного LESS. */
body.dark .kaz .featured-layout .h1,
body.dark .kaz .featured-layout .featured-hero-suppliers,
body.dark .kaz .featured-layout .featured-hero-customers {
  color: var(--ets-text-1) !important;
}

/* Hero canvas: переключение палитры через CSS-переменную (читается из ets_mainpage_hero.js). */
body.dark .kaz .ets-hero-canvas {
  --ets-hero-canvas-theme: dark;
}
body.dark .kaz .featured-layout .ets-hero__subtitle {
  color: #94A3B8;
}
body.dark .kaz .featured-layout .ets-hero__badge {
  color: var(--ets-teal);
  border-color: rgba(0, 168, 150, .35);
}

/* .card-d.active в ЛК — была hardcoded #F0FDFB. */
body.dark .ets-lk .card-d.active {
  background: rgba(0, 168, 150, .08);
}

/* Админ-панель шапки (#ph-admin-panel) — hardcoded #f5f5f3 в header.less. */
body.dark .header-admin-panel {
  background-color: var(--ets-surface-2);
  color: var(--ets-text-1);
  border-color: var(--ets-border);
}
/* Иконки в админ-панели (.ico) по умолчанию color:#000 (SVG fill:currentColor),
   на тёмном #111A2E невидимы — в т.ч. крестик закрытия cancel-s
   (#Rectangle-10 / #Rectangle-10-Copy). Осветляем. */
body.dark .header-admin-panel .ico {
  color: var(--ets-text-2);
}

/* Выпадающий блок помощи в шапке — hardcoded #fff в header.less. */
body.dark .header-help {
  background-color: var(--ets-surface);
  color: var(--ets-text-1);
  border-color: var(--ets-border);
}

/* Кнопки-переключатели в форме поддержки (#support_header_page .btn-grp):
   .btn-default захардкожен #fff / .active #f2f0eb в header.less. */
body.dark .header-help .btn-grp .btn-default {
  background-color: var(--ets-surface-2);
  border-color: var(--ets-border);
}
body.dark .header-help .btn-grp .btn-default.active {
  background-color: var(--ets-surface);
}

/* .etsTariffBlock:hover — @tr-hvr-bg тёплый бежевый, на дарке вспыхивает. */
body.dark .etsTariffBlock:hover {
  background-color: var(--ets-surface-2);
}

/* .ets-logo-text__primary — hardcoded #0F172A, на тёмной шапке невидим. */
body.dark .ets-logo-text__primary {
  color: var(--ets-text-1);
}

/* .detail-link-d в ЛК — дубль override до пересборки LESS. */
body.dark .ets-lk .detail-link-d {
  color: var(--ets-link);
}
body.dark .ets-lk .detail-link-d:hover {
  color: var(--ets-link-hover);
}

/* .nav-pills на /tariffs/: убираем серый ::after-хвостик, выделяем active
   через teal underline + bold (по образцу .ets-lk-tabs). */
body.dark [class*="nav-pills"] li.active {
  border-bottom-color: var(--ets-teal);
}
body.dark [class*="nav-pills"] li::after {
  content: none;
}
body.dark .afake.active {
  color: var(--ets-text-1);
  font-weight: 600;
}

/* Легаси-контентные карточки с background #fff. */
body.dark table.search,
body.dark .common_block,
body.dark .textbox_lead {
  background: var(--ets-surface);
  color: var(--ets-text-1);
  border-color: var(--ets-border);
}

/* Поля форм: дефолтный белый bg → surface-2 (на ступень темнее основного).
   .form-ctrl и input:not([type]) — инпуты без явного type="" (напр.
   #auctions_and_tender_id_field в админ-панели шапки): селектор
   input[type="text"] их не матчит, поэтому добавлены отдельно. */
body.dark .form-ctrl,
body.dark input:not([type]),
body.dark input[type="text"],
body.dark input[type="search"],
body.dark input[type="email"],
body.dark input[type="password"],
body.dark input[type="tel"],
body.dark input[type="number"],
body.dark input[type="url"],
body.dark input[type="date"],
body.dark input[type="datetime-local"],
body.dark select,
body.dark textarea {
  background-color: var(--ets-surface-2);
  color: var(--ets-text-1);
  border-color: var(--ets-border);
}
body.dark input::placeholder,
body.dark textarea::placeholder {
  color: var(--ets-text-3);
}
body.dark input:focus,
body.dark select:focus,
body.dark textarea:focus {
  border-color: var(--ets-teal);
  outline: none;
}

/* Заголовки — h1-h6 и div.h1-h6 (легаси-практика «псевдо-заголовок»). */
body.dark h1,
body.dark h2,
body.dark h3,
body.dark h4,
body.dark h5,
body.dark h6,
body.dark .h1,
body.dark .h2,
body.dark .h3,
body.dark .h4,
body.dark .h5,
body.dark .h6 {
  color: var(--ets-text-1);
}

/* Ссылки только внутри контентных блоков — глобальный override задел бы табы/навигацию. */
body.dark .common_block a,
body.dark .textbox_lead a,
body.dark .help-info a,
body.dark table.search a {
  color: var(--ets-link);
}
body.dark .common_block a:hover,
body.dark .textbox_lead a:hover,
body.dark .help-info a:hover,
body.dark table.search a:hover {
  color: var(--ets-link-hover);
}

/* .afake — legacy fake-anchor (span/li с hardcoded color rgb(22,72,204) в base.css). */
body.dark .afake {
  color: var(--ets-link);
}
body.dark .afake:hover {
  color: var(--ets-link-hover);
}

/* «Избранное» в нижней панели шапки: bottom-panel.less форсит hover-цвет
   ссылки и .tip в var(--ets-navy)!important. navy в дарке не переопределён
   (#0F172A) → тёмный текст на тёмном фоне, расходится с остальными ссылками
   (те ховерятся в --ets-text-1). Перебиваем тем же !important + body.dark. */
body.dark .hdr-new .header-panel-right > .on_boarding-step-2:hover,
body.dark .hdr-new .header-panel-right > .on_boarding-step-2:focus {
  color: var(--ets-text-1);
}
body.dark .hdr-new .header-panel-right > .on_boarding-step-2:hover .tip,
body.dark .hdr-new .header-panel-right > .on_boarding-step-2:hover .tip a,
body.dark .hdr-new .header-panel-right > .on_boarding-step-2:hover a,
body.dark .hdr-new .header-panel-right > .on_boarding-step-2:focus .tip,
body.dark .hdr-new .header-panel-right > .on_boarding-step-2:focus .tip a,
body.dark .hdr-new .header-panel-right > .on_boarding-step-2:focus a {
  color: var(--ets-text-1) !important;
}

/* =======================================================================
   DARK AUDIT FIXES (2026-05-30)
   Контрастный аудит body.dark по публичным страницам ets-tender.kz.
   Источник проблем — правила светлой темы из components.css (`.kaz …`)
   с hardcoded slate/чёрными цветами и светлыми фонами, которые в дарке
   остаются нетронутыми. tokens.css грузится после components.css, поэтому
   `body.dark .kaz …` (равная/большая специфичность + позже в каскаде)
   перебивает их; точечно добавлен !important против inline-hardcode.
   Палитра: surface #1e293b, deep #0f172a, border #334155,
            text #f1f5f9 / #e2e8f0, secondary #cbd5e1, muted #94a3b8,
            link #8ab4ff, teal #2dd4bf.
   ======================================================================= */

/* --- main: блок «Новости» — заголовок slate-900 + светлые карточки --- */
body.dark .news-head__title,
body.dark .kaz .news-head__title { color: #f1f5f9 !important; }
body.dark .news-item--ets,
body.dark .kaz .news-item--ets { background: #1e293b !important; border-color: #334155 !important; }
body.dark .news-item__title,
body.dark .news-item--ets a { color: #e2e8f0 !important; }
body.dark .news-item__date { color: #94a3b8 !important; }

/* --- main: карточки партнёров (тёмный текст rgb(34,34,34)) --- */
body.dark .col12 a.txt-center article p { color: #cbd5e1 !important; }

/* --- A. заголовки/значения slate-900 и чёрные на тёмном фоне --- */
body.dark .nav-pills li.active > span,
body.dark .comm-title,
body.dark .acc-head-text,
body.dark .acc-rate,
body.dark .acc-name,
body.dark .plan-name,
body.dark .amount,
body.dark .priceRu { color: #f1f5f9 !important; }

/* --- B. tariffs: карточки тарифов остались светлыми --- */
body.dark .plan-card { background: #1e293b !important; border-color: #334155 !important; }
body.dark .plan-card .btn-txt { color: #f1f5f9 !important; }
body.dark .plan-card .plan-period,
body.dark .plan-card .plan-desc,
body.dark .plan-card .plan-sub { color: #cbd5e1 !important; }
body.dark .plan-badge.pro { color: #d2c4ff !important; }
body.dark .plan-badge.baseplus { color: #2dd4bf !important; }

/* --- C. firms: таблица результатов и блоки остались светлыми --- */
body.dark #content table.table-hover td,
body.dark #content table.table-hover th { background: #1e293b !important; color: #e2e8f0 !important; border-color: #334155 !important; }
body.dark .box.accentBg { background: #1e293b !important; color: #e2e8f0 !important; border-color: #334155 !important; }
body.dark .selectize-control .selectize-input,
body.dark .selectize-control .selectize-input > input,
body.dark .selectize-control .selectize-input > input::placeholder,
body.dark .selectize-control.multi .selectize-input.not-full,
body.dark .selectize-input .placeholder { color: #cbd5e1 !important; }
body.dark .selectize-input { background: #0f172a !important; border-color: #334155 !important; }
body.dark .selectize-dropdown { background: #0f172a !important; color: #e2e8f0 !important; }

/* Стрелка-триггер селектов (selectize single + .type-ctrl) — тёмный PNG-спрайт
   icon-set-form-select-arrow.png. На тёмном фоне default-кадр невидим, проступал
   лишь на hover (другой кадр спрайта). Осветляем фильтром во всех состояниях
   (кадры hover/opened через background-position сохраняются). */
body.dark .selectize-input:after,
body.dark .type-ctrl-txt:before {
  filter: brightness(0) invert(0.7);
}
/* Вертикальный разделитель/подложка триггера selectize (#dadada-линия или
   #fff-кнопка в разных сборках) — на тёмном фоне выглядит белым. Под border. */
body.dark .selectize-single .selectize-input:before,
body.dark .selectize-control.single .selectize-input:before {
  background-color: var(--ets-border);
  /* border-left от .selectize-trigger-border() остаётся светлым (#bebebe) —
     на тёмном фоне выглядит белой полоской. Контрастный, но не слепящий. */
  border-left-color: var(--ets-border-strong);
}

/* Выпадающий список: текущий/подсвеченный пункт (.active) — светлый bg
   #f5fafd + тёмный текст #495c68 из jquery.selectize.css, нечитаем на дарке.
   .optgroup-header — белый bg #fff. Приводим к тёмной палитре. */
body.dark .selectize-dropdown .active {
  background-color: rgba(0, 168, 150, .18);
  color: var(--ets-text-1);
}
body.dark .selectize-dropdown .optgroup-header {
  background-color: var(--ets-surface-2);
  color: var(--ets-text-2);
}
body.dark .selectize-dropdown .create {
  color: var(--ets-text-3);
}

/* Пункты этой сборки selectize используют .selectize-option.js-selected
   (выбранный) и .js-active (наведённый): в components.css им заданы светлые
   bg (#f5f578 / #f5f5f5) — на дарке нечитаемы. color !important бьёт даже
   высокоспецифичное (но не-important) правило поиска ниже. */
body.dark .selectize-option.js-selected,
body.dark .selectize-option.js-active {
  background-color: rgba(0, 168, 150, .18);
  color: var(--ets-text-1) !important;
}
body.dark .selectize-dropdown .selectize-option:hover {
  background-color: rgba(0, 168, 150, .12);
  color: var(--ets-text-1) !important;
}

/* Поиск (.search-filter на market/classifier): kaz-правило в components.css
   красит выбранный/наведённый пункт в var(--ets-success-bg)!important +
   color:var(--ets-navy) (тёмно-синий текст). Перебиваем тем же !important,
   подняв специфичность через body.dark (структуру селектора повторяем). */
body.dark #page.kaz #content:has(#search-form) .search-filter .selectize-dropdown .selectize-option.js-active,
body.dark #page.kaz #content:has(#search-form) .search-filter .selectize-dropdown .selectize-option.js-selected,
body.dark #page.kaz #content:has(#search-form) .search-filter .selectize-dropdown .selectize-option:hover,
body.dark #page.kaz #content:has(#trades-classifier-search-form) .search-filter .selectize-dropdown .selectize-option.js-active,
body.dark #page.kaz #content:has(#trades-classifier-search-form) .search-filter .selectize-dropdown .selectize-option.js-selected,
body.dark #page.kaz #content:has(#trades-classifier-search-form) .search-filter .selectize-dropdown .selectize-option:hover {
  background-color: rgba(0, 168, 150, .22) !important;
  color: var(--ets-text-1) !important;
}

/* Иконка поиска в селекте (.selectize-ico) — color:#000 в components.css,
   SVG наследует currentColor → чёрная на тёмном. Осветляем. */
body.dark .selectize-ico {
  color: var(--ets-muted);
}
body.dark .selectize-ico:hover {
  color: var(--ets-text-1);
}

/* Тултип «Избранное» в шапке (.header_bottom_favorite-tooltip, top_favorite_widget.css):
   светлый #F5F5F5 фон + тёмный текст, в дарке остаётся светлым; крестик-закрыть
   (.tip-close, иконка #94A3B8) на нём не виден. Затемняем тултип и стрелку. */
body.dark .header_bottom_favorite-tooltip {
  background-color: var(--ets-surface) !important;
  border-color: var(--ets-border) !important;
  color: var(--ets-text-1);
}
body.dark .header_bottom_favorite-tooltip::before,
body.dark .header_bottom_favorite-tooltip::after {
  background-color: var(--ets-surface) !important;
  border-color: var(--ets-border) !important;
}
body.dark #firms-search-form .btn-default { background: #1e293b !important; border-color: #334155 !important; color: #e2e8f0 !important; }
body.dark #firms-search-form .btn-default.cs-checked,
body.dark #firms-search-form .clear_button .btn-txt { color: #2dd4bf !important; }

/* --- D. admin/ЛК: плитки рабочего места остались светлыми --- */
body.dark .menuBox { background: #1e293b !important; border-color: #334155 !important; color: #e2e8f0 !important; }
body.dark .menuBox a { color: #8ab4ff; }
body.dark .menuBox .nobr { color: #e2e8f0 !important; }
body.dark .searchBlock { background: #0f172a !important; border-color: #334155 !important; }
body.dark .menuBox-count-current,
body.dark .menuBox-count-total,
body.dark .menuBox .small { color: #94a3b8 !important; }

/* --- F. ссылки/edit-контролы с хардкодом ets-blue на тёмном --- */
body.dark .featured-hero p.lead a,
body.dark .hint-controls-wrap a,
body.dark #footer_text_block a,
body.dark #content table thead th a { color: #a3c2ff !important; }
body.dark .page-footer-ets a.page-footer-ets__link,
body.dark .page-footer-ets__address span { color: #a3c2ff !important; }

/* --- G. чёрный контентный текст в hero/CTA-секциях --- */
body.dark .contacts-hero__loc,
body.dark .contacts-hero__loc span { color: #f1f5f9 !important; }
body.dark .start-cta a,
body.dark .start-cta .btn-txt { color: #f1f5f9 !important; }
body.dark .start-rss__text,
body.dark .start-rss__text span { color: #cbd5e1 !important; }

/* =======================================================================
   DARK AUDIT FIXES — раунд 2 (повышенная специфичность через #page)
   Конкуренты в components.css используют ID-селекторы `#page.kaz …`
   (часто с !important), которые перебивают `body.dark .class`. Здесь —
   правила той же ID-специфичности, чтобы выиграть каскад честно.
   ======================================================================= */

/* заголовки страниц: #page.kaz красит .h3 в --ets-navy/slate-900;
   возвращаем светлый текст для дарка. */
body.dark#page .h3,
body.dark #page .h3,
body.dark#page h1.h3,
body.dark #page h1.h3 { color: var(--ets-text-1) !important; }

/* tariffs: кнопка "Подключиться" (btn-primary, тёмный фон) и спецификации */
body.dark #page.kaz .ets-tariffs .plan-cta .btn .btn-txt,
body.dark #page.kaz .ets-tariffs .plan-cta button .btn-txt,
body.dark #page.kaz .ets-tariffs .plan-cta a.btn .btn-txt,
body.dark #page.kaz .ets-tariffs .plan-cta .btn span,
body.dark #page.kaz .ets-tariffs .plan-cta button span { color: #f1f5f9 !important; }
body.dark #page.kaz .ets-tariffs .feat-item b,
body.dark #page.kaz .ets-tariffs .feat-item { color: #e2e8f0 !important; }

/* admin/ЛК: .menuBox .lead красится в чёрный из components.css */
body.dark #page .menuBox .lead,
body.dark #page .menuBox .lead a { color: #f1f5f9 !important; }

/* start: кнопки btn-default/btn-link с чёрным/teal текстом на тёмном */
body.dark .btn-default .btn-txt,
body.dark .video_button .btn-txt { color: #e2e8f0 !important; }
body.dark .btn-link .btn-txt,
body.dark .btn-link { color: #2dd4bf !important; }

/* start: активный таб-свитчер li.afake.active (чёрный span внутри) */
body.dark .afake.active,
body.dark .afake.active span { color: #f1f5f9 !important; }

/* firms: ссылки в таблице результатов (глобальный a{color:#1648cc} из base.css) */
body.dark #content table.search-results a,
body.dark #content table.table-hover a { color: #a3c2ff !important; }

/* контентные ссылки с глобальным hardcoded a{color:#1648cc} (base.css):
   "Изменить", e-mail, текстовые ссылки внутри #content. Кнопки, табы,
   карточки-ссылки и уже перекрашенные блоки исключены. */
body.dark #content a:not(.btn):not(.afake):not([class*="card"]):not([class*="tab"]):not(.page-footer-ets__link):not(.market-card__title):not(.firm-card__name) {
  color: #a3c2ff;
}
body.dark .start-hero a:not(.btn),
body.dark .contacts-hero a:not(.btn) { color: #a3c2ff !important; }
body.dark .hint-controls-wrap a { color: #a3c2ff !important; }
body.dark #content .lead a,
body.dark #content p a { color: #a3c2ff !important; }

/* --- H. ЛК «Календарь событий»: легаси-фильтры со светлым фоном --- */
body.dark .event_viewer_filter,
body.dark .event_viewer_content .tab,
body.dark .custom_period { background: #1e293b !important; border-color: #334155 !important; }
body.dark .event_viewer_filter b,
body.dark .event_viewer_filter label,
body.dark .event_viewer_filter .b2btooltip,
body.dark .event_viewer_content p,
body.dark .event_viewer_content label { color: #e2e8f0 !important; }
body.dark .reset_period_form,
body.dark .period_trigger,
body.dark .event_viewer .apseudo { color: #a3c2ff !important; }

/* --- market/view: белая кнопка "В избранное" --- */
body.dark .favorite-button.btn-accent { background: #1e293b !important; border-color: #334155 !important; color: #e2e8f0 !important; }

/* --- I. ЛК «Рекомендации»: информационный баннер со светлым фоном --- */
body.dark .information-banner-container { background: #1e293b !important; border-color: #334155 !important; }
body.dark .information-banner-title { color: #f1f5f9 !important; }
body.dark .information-banner-text { color: #cbd5e1 !important; }
/* Бейдж-иконка .info типа — hardcoded серый #999 (widget_information_banner.css),
   на тёмном контейнере выглядит мутно/неконсистентно с цветными бейджами
   success/warning/danger. Даём дарк-токен info. */
body.dark .information-banner-container.info .information-banner-icon {
  background-color: var(--ets-info);
}

/* --- K. Выпадающий календарь spinCalendar (поля выбора даты, напр.
   /personal/fund/withdrawal/). Legacy _spin-calendar даёт белый фон #fff
   + светло-жёлтые состояния #f6f6db, из-за чего светлый текст невидим. --- */
body.dark .spinCalendar { background: #1e293b !important; border-color: #334155 !important; color: #e2e8f0; }
body.dark .spinCalendar-value-holder { background: #0f172a !important; }
/* hover/active/today день */
body.dark .spinCalendar-days span:hover { background: #334155 !important; }
body.dark .spinCalendar-days .spinCalendar-day-active { background: rgba(0, 168, 150, .22) !important; color: #5eead4 !important; }
body.dark .spinCalendar-days .spinCalendar-nowday { background: #334155 !important; }
/* слайдеры выбора месяца/года */
body.dark [class*="spinCalendar-month-slider"] > div,
body.dark [class*="spinCalendar-year-slider"] > div { background: rgba(0, 168, 150, .22) !important; }
/* выбранный год */
body.dark .spinCalendar-years span.active { color: #5eead4 !important; }
/* иконка-календарь в поле (была чёрной) */
body.dark .spinCalendar-field .spinCalendar-field-ico { color: #94a3b8; }
/* праздники остаются акцентно-красными, но осветляем для контраста на тёмном */
body.dark .spinCalendar-days .spinCalendar-holidays { color: #f87171 !important; }

/* --- messages: кнопка-фильтр «Показать» (.btn-show) --- */
/* messages-page.less: .btn-show { background: var(--ets-text-1); color:#fff }
   + :hover { #1E293B }. В свете — тёмная пилюля с белым текстом. В дарке
   --ets-text-1 инвертируется в светлый (#F1F5F9), а color:#fff и тёмный hover
   захардкожены → белый текст на светлом фоне / тёмный hover = нечитаемо.
   Сохраняем высококонтрастную пилюлю как инверсию: светлый фон + тёмный текст. */
body.dark .ets-lk-messages .btn-show {
  background: var(--ets-text-1);
  color: var(--ets-navy);
}
body.dark .ets-lk-messages .btn-show:hover {
  background: var(--ets-text-2);
  color: var(--ets-navy);
}

/* --- registration: индикатор шагов (.steps из registration_page.css) --- */
/* Легаси-компонент: белые кружки (background:#fff) с серой рамкой/номером
   (#B2B2B2) и рамкой #333 у текущего шага. На тёмном фоне белые кружки выглядят
   неадаптированными, а номер текущего шага (.current наследует color:inherit →
   светлый --ets-text-1) становится невидимым на белом кружке. Приводим к тёмной
   палитре: тёмные кружки, читаемые номера, teal-акцент у текущего шага. */
body.dark .steps li {
  color: var(--ets-text-3);
}
body.dark .steps li::before {
  background-color: var(--ets-surface-2);
  border-color: var(--ets-border-strong);
  color: var(--ets-text-3);
}
body.dark .steps .current {
  color: var(--ets-text-1);
}
body.dark .steps .current::before {
  background-color: var(--ets-surface-2);
  border-color: var(--ets-teal);
  color: var(--ets-text-1);
}
/* Завершённый шаг: тёмный кружок под зелёной галочкой-иконкой. */
body.dark .steps .succes::before {
  background-color: var(--ets-surface-2);
}
/* Цифры в кружках шагов не центрированы по вертикали: legacy line-height
   (1.57143em ≈ 20.4px) больше внутренней высоты кружка (20px − 2×2px border =
   16px при box-sizing:border-box) → номер съезжает вниз. Выравниваем line-height
   по высоте контента. Тема-агностично (обе темы). Скоуп через #page — tokens.css
   подключается только на ETS-гейте; (1,1,2) перебивает legacy .steps li::before (0,1,2). */
#page .steps li::before {
  line-height: 16px;
}
