/* Общие стили UIService (без сборщика) */

:root {
  --primary-color:  #222D52;
  --success-color:  #10b981;
  --danger-color:   #ef4444;
  --warning-color:  #D2B68A;
  --info-color:     #222D52;
  --dark-color:     #000000;
  --light-color:    #EEE5D9;
  --border-color:   #EEE5D9;
  /* Variant-B aliases */
  --navy:  #222D52;
  --gold:  #D2B68A;
  --cream: #EEE5D9;
  --white: #FDFFFF;
}

/* ── СЕМАНТИЧЕСКИЕ ТОКЕНЫ ПОВЕРХНОСТЕЙ ────────────────
   Фирменные переменные выше (--navy, --gold, --cream) описывают ПАЛИТРУ.
   Эти описывают РОЛЬ: что здесь фон, что текст, что граница. Роль может
   менять значение вместе с темой, палитра — нет.

   Отдельный --brand-ink нужен потому, что navy используется двояко: как
   поверхность (шапка, кнопки) и как цвет текста. На тёмном фоне navy-текст
   исчезает, а navy-поверхность остаётся уместной. */
:root {
  --surface:        #FDFFFF;   /* основной фон страниц и карточек */
  --surface-sunk:   #F5F3EF;   /* утопленный фон: шапки таблиц, полосы, треки */
  --surface-accent: #EEE5D9;   /* акцентная плашка: блок фильтров */
  --text:           #171A24;
  --text-muted:     #5A5F6A;
  --border:         #E2D9C8;
  --border-subtle:  #F0ECE6;
  --brand-ink:      #222D52;   /* бренд как ЦВЕТ ТЕКСТА, не как поверхность */
  --navy-hover:     #1A2340;   /* нажатое состояние фирменной кнопки */
  --link:           #0A58CA;   /* дефолтный #0d6efd даёт на белом 4.48 — недобор */
  --code-ink:       #B02566;   /* дефолтный #d63384 даёт ровно 4.48 — тоже недобор */
  --text-up:        #047857;   /* рост: на белом было 2.53 */
  --text-down:      #B91C1C;   /* падение: на белом было 3.75 */
  --shadow:         rgba(34, 45, 82, .07);
  --highlight:      #FFF8DB;   /* подсветка строки «в избранном» */
  --control-surface: #5A5F6A;  /* серые кнопки-действия */

  /* Акцентные плашки справки: информация и предупреждение. Это не оттенки
     серого, а собственный смысл, поэтому у них свои токены. */
  --info-surface:   #EFF6FF;
  --info-border:    #BFDBFE;
  --info-ink:       #1E40AF;
  --warn-surface:   #FFFBEB;
  --warn-border:    #FDE68A;
  --warn-ink:       #92400E;
}

/* Палитра сигналов темы не имеет: каждый бейдж несёт и фон, и чернила, и
   потому одинаково читается на любой поверхности. Меняются только роли. */
@media (prefers-color-scheme: dark) {
  :root {
    --surface:        #12141B;
    --surface-sunk:   #1A1D26;
    --surface-accent: #242835;
    --text:           #EDE8DC;
    --text-muted:     #A7A294;
    --border:         #2F3342;
    --border-subtle:  #262A36;
    --brand-ink:      #93A1DC;
    --text-up:        #6FB88A;
    --text-down:      #E08A7E;
    --shadow:         rgba(0, 0, 0, .5);
    --highlight:      #3A3520;
    --link:           #8AB4F8;
    --code-ink:       #F08FC0;
    --control-surface: #3A3F4A;
    --info-surface:   #16233A;
    --info-border:    #2A4470;
    --info-ink:       #A8C7FA;
    --warn-surface:   #2A2214;
    --warn-border:    #5C4A1E;
    --warn-ink:       #F2CC7A;
  }
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background-color: var(--surface);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  color: var(--text);
}

/* Скрываем страницу до инициализации Keycloak */
body:not(.keycloak-initialized) {
  visibility: hidden;
  opacity: 0;
}
body.keycloak-initialized {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.3s ease-in;
}

/* ── TOPBAR / HEADER ─────────────────────────────── */
.main-header {
  background: var(--navy);
  color: var(--white);
  padding: 0;
  margin-bottom: 1.25rem;
  box-shadow: 0 2px 12px rgba(34, 45, 82, .3);
}

.main-header > .container-fluid {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  padding: 0 1.5rem;
}

/* Brand */
.main-header .header-brand {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.75rem 1rem 0.75rem 0;
  border-right: 1px solid rgba(255, 255, 255, .1);
  margin-right: 0.5rem;
  text-decoration: none;
  flex-shrink: 0;
}
.main-header .brand-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--gold);
}
.main-header .brand-text {
  color: var(--white);
  font-weight: 700;
  font-size: 0.95rem;
  letter-spacing: .01em;
}

/* Nav */
.main-header .flex-grow-1 {
  display: flex;
  align-items: stretch;
}

.main-header .nav-tabs {
  border-bottom: none;
  display: flex;
  align-items: stretch;
  flex: 1;
  flex-wrap: nowrap;
}

.main-header .nav-link {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0 1rem;
  color: rgba(255, 255, 255, .65) !important;
  font-size: 0.85rem;
  font-weight: 500;
  text-decoration: none;
  border: none !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  transition: all .15s;
  white-space: nowrap;
  background: transparent;
}
.main-header .nav-link:hover {
  color: var(--white) !important;
  background: rgba(255, 255, 255, .06);
}
.main-header .nav-link.active {
  color: var(--white) !important;
  background: transparent;
  border-bottom-color: var(--gold) !important;
  font-weight: 700;
  opacity: 1;
}
.main-header .nav-link i {
  font-size: 0.8rem;
}

/* Issue button in topbar */
.btn-header-issue {
  background: transparent;
  color: rgba(255, 255, 255, .7);
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 8px;
  padding: 0.35rem 0.8rem;
  font-size: 0.82rem;
  white-space: nowrap;
  flex-shrink: 0;
}
.btn-header-issue:hover {
  color: var(--white);
  border-color: rgba(255, 255, 255, .6);
  background: rgba(255, 255, 255, .06);
}

/* User info dropdown injected by keycloak-init.js */
#user-info {
  flex-shrink: 0;
  padding: 0.5rem 0;
}
#user-info .btn-outline-primary {
  background: transparent !important;
  color: rgba(255, 255, 255, .75) !important;
  border-color: rgba(255, 255, 255, .3) !important;
  border-radius: 8px !important;
  font-size: 0.82rem !important;
  padding: 0.35rem 0.8rem !important;
}
#user-info .btn-outline-primary:hover,
#user-info .btn-outline-primary:focus,
#user-info .btn-outline-primary.show {
  background: rgba(255, 255, 255, .1) !important;
  color: var(--white) !important;
  border-color: rgba(255, 255, 255, .5) !important;
  box-shadow: none !important;
}

/* ── PAGE BODY PADDING ────────────────────────────── */
.container-fluid {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

/* ── FILTERS SECTION ─────────────────────────────── */
.filters-section {
  background: var(--surface-accent);
  border-radius: 10px;
  border-left: 4px solid var(--gold);
  padding: 0.75rem 1rem;
  margin-bottom: 1.25rem;
  box-shadow: none;
  border-top: none;
  border-right: none;
  border-bottom: none;
}

.filters-header {
  background: transparent;
  color: var(--text);
  border-radius: 0;
  padding: 0;
  margin: 0 0 0.5rem;
  cursor: pointer;
  font-weight: 700;
  font-size: 0.85rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.filters-header::before {
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 2px;
  background: var(--gold);
  flex-shrink: 0;
}

.filter-row { margin-bottom: 0.125rem; }

.filters-section .form-label {
  font-weight: 600;
  color: var(--text-muted);
  font-size: 0.78rem;
  margin-bottom: 0.125rem;
}

.filters-section .form-select,
.filters-section .form-control {
  border-color: rgba(0, 0, 0, .12);
  padding: .3rem .6rem;
  font-size: 0.82rem;
  height: auto;
  background: var(--surface);
  border-radius: 6px;
}

.filters-section .form-select:focus,
.filters-section .form-control:focus {
  border-color: var(--navy);
  box-shadow: 0 0 0 3px rgba(34, 45, 82, .1);
}

/* ── CARD/TABLE CONTAINERS ────────────────────────── */
.table-container,
.accounts-container,
.handbooks-container,
.users-container,
.admin-container {
  background: var(--surface);
  border-radius: 12px;
  padding: 0;
  box-shadow: 0 1px 6px rgba(34, 45, 82, .07);
  border: 1px solid var(--border);
  overflow: hidden;
}

/* Container header bar */
.accounts-header,
.handbooks-header,
.users-header {
  padding: 0.9rem 1.25rem;
  border-bottom: 2px solid var(--border);
  margin-bottom: 0;
}

/* Inner padding for containers */
.accounts-container > *:not(.accounts-header):not(table):not(.table-responsive),
.handbooks-container > *:not(.handbooks-header):not(table):not(.table-responsive):not(.nav-tabs),
.users-container > *:not(.users-header):not(table):not(.table-responsive),
.admin-container > * {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.accounts-container > .table-responsive,
.handbooks-container > .table-responsive,
.users-container > .table-responsive {
  margin: 0;
  border-radius: 0;
  border: none;
}

/* table-container keeps its internal padding for backward compat */
.table-container {
  padding: 1.25rem;
}

/* ── TABLE STYLES ────────────────────────────────── */
.table thead th {
  background: var(--surface-sunk);
  font-size: 0.73rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--text-muted);
  border-bottom: 2px solid var(--border) !important;
  border-top: none;
  white-space: nowrap;
  padding: 0.6rem 0.85rem;
}

.table tbody tr {
  border-bottom: 1px solid #f0ece6;
  transition: background .1s;
}
.table tbody tr:hover {
  background: var(--surface-sunk);
}
.table tbody td {
  vertical-align: middle;
  padding: 0.55rem 0.85rem;
}

/* Master row highlight (accounts) */
.table tbody tr.fw-bold td:first-child {
  border-left: 3px solid var(--gold);
}

/* Table-controls bar */
.table-controls {
  background: var(--surface-sunk);
  border-radius: 8px;
  padding: 1rem;
  border: 1px solid var(--border);
}

/* ── BUTTON OVERRIDES ────────────────────────────── */
.btn-primary {
  background-color: var(--navy);
  border-color: var(--navy);
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--navy-hover);
  border-color: var(--navy-hover);
}

.btn-outline-primary {
  color: var(--brand-ink);
  border-color: var(--navy);
}
.btn-outline-primary:hover,
.btn-outline-primary:focus {
  background-color: var(--navy);
  border-color: var(--navy);
  color: var(--white);
}

/* Gold action button */
.btn-gold {
  background: var(--gold);
  color: var(--navy);
  border: none;
  border-radius: 8px;
  padding: 0.4rem 0.9rem;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  transition: background .15s;
}
.btn-gold:hover { background: #c4a678; }

/* Navy outline button */
.btn-outline-navy {
  background: transparent;
  color: var(--brand-ink);
  border: 1px solid var(--navy);
  border-radius: 8px;
  padding: 0.4rem 0.85rem;
  font-size: 0.82rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.btn-outline-navy:hover {
  background: var(--surface-accent);
}

/* ── STATUS DOTS ─────────────────────────────────── */
.status-dot,
.status-dot-on,
.status-dot-off,
.status-dot-enabled,
.status-dot-disabled {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.status-dot-on,
.status-dot-enabled  { background: #10b981; }
.status-dot-off,
.status-dot-disabled { background: var(--border-subtle); }

/* ── MISC ────────────────────────────────────────── */
.form-check-input:checked {
  background-color: var(--navy);
  border-color: var(--navy);
}
.progress-bar { background-color: var(--navy); }

/* Scrollbar styling */
.table-container { scrollbar-width: thin; scrollbar-color: var(--border) transparent; }
.table-container::-webkit-scrollbar { height: 8px; }
.table-container::-webkit-scrollbar-track { background: var(--surface-sunk); border-radius: 4px; }
.table-container::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
.table-container::-webkit-scrollbar-thumb:hover { background: var(--border-subtle); }

/* Scroll indicator */
.scroll-indicator {
  background: rgba(34, 45, 82, 0.08);
  border: 1px solid rgba(34, 45, 82, 0.15);
  border-radius: 6px;
  padding: 0.5rem;
  font-size: 0.8rem;
}
.scroll-indicator i { color: var(--brand-ink); }

/* Admin card */
.admin-card {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1rem;
  margin-bottom: 1rem;
  background: var(--surface-sunk);
}
.admin-card h6 { margin-bottom: 0.5rem; color: var(--brand-ink); }

/* Modal header override */
.modal-header {
  background: var(--navy);
  color: var(--white);
}
.modal-header .btn-close {
  filter: brightness(0) invert(1);
  opacity: 0.7;
}
.modal-header .btn-close:hover { opacity: 1; }
.modal-title { font-weight: 700; }

/* ── RESPONSIVE ──────────────────────────────────── */
.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--border) transparent;
  touch-action: pan-x;
}
.table-responsive::-webkit-scrollbar { height: 8px; }
.table-responsive::-webkit-scrollbar-track { background: var(--surface-sunk); border-radius: 4px; }
.table-responsive::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
.table-responsive::-webkit-scrollbar-thumb:hover { background: var(--border-subtle); }

@media (hover: none) and (pointer: coarse) {
  .table th, .table td { min-height: 44px; }
  .btn { min-height: 44px; }
  .form-control, .form-select { min-height: 44px; }
  .col-close { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; }
}

/* Мобильная раскладка шапки переехала в styles/mobile.css. */

/* Более заметный бегунок и трек слайдера стратегии */
#strategy-risk-range {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 20px;
  background: transparent;
  cursor: pointer;
}
#strategy-risk-range::-webkit-slider-runnable-track {
  height: 6px;
  border-radius: 3px;
  background: var(--border-subtle);
}
#strategy-risk-range::-moz-range-track {
  height: 6px;
  border-radius: 3px;
  background: var(--border-subtle);
}
#strategy-risk-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--primary-color, #222D52);
  border: 2px solid #fff;
  box-shadow: 0 0 0 2px var(--primary-color, #222D52);
  margin-top: -7px;
  cursor: pointer;
}
#strategy-risk-range::-moz-range-thumb {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--primary-color, #222D52);
  border: 2px solid #fff;
  box-shadow: 0 0 0 2px var(--primary-color, #222D52);
  cursor: pointer;
}

/* Компактная таблица счетов для роли admin */
.accounts-table-admin {
  font-size: 0.78rem;
}
.accounts-table-admin th,
.accounts-table-admin td {
  padding: 0.3rem 0.4rem;
  white-space: nowrap;
}
.accounts-table-admin .col-truncate {
  max-width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ---- Виджет состояния рынков (модуль general market state) ---- */

/* Кнопка повторяет .btn-header-issue: в шапке два соседних контрола, и разъезжаться им нельзя. */
.btn-header-market {
  background: transparent;
  color: rgba(255, 255, 255, .7);
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 8px;
  padding: 0.35rem 0.8rem;
  font-size: 0.82rem;
  white-space: nowrap;
  flex-shrink: 0;
}
.btn-header-market:hover,
.btn-header-market:focus {
  color: var(--white);
  border-color: rgba(255, 255, 255, .6);
  background: rgba(255, 255, 255, .06);
}

/* Точки-индикаторы прямо в кнопке: сводка видна без раскрытия меню. */
.market-state-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-left: 6px;
  vertical-align: middle;
}

.market-state-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 8px;
}
.market-state-chip .market-state-dot {
  margin-left: 0;
}

.market-state-menu {
  min-width: 300px;
  padding: 0;
  font-size: 0.85rem;
}
.market-state-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.6rem 0.9rem;
  border-bottom: 1px solid rgba(0, 0, 0, .08);
  font-weight: 600;
}
.market-state-updated {
  font-weight: 400;
  font-size: 0.75rem;
  color: var(--text-muted);
}
.market-state-row {
  display: flex;
  align-items: baseline;
  gap: 0.55rem;
  padding: 0.55rem 0.9rem;
  border-bottom: 1px solid rgba(0, 0, 0, .05);
}
.market-state-row:last-of-type {
  border-bottom: none;
}
.market-state-country {
  font-weight: 600;
  min-width: 2.2rem;
}
.market-state-regime {
  flex: 1;
  line-height: 1.25;
}
/* Счёт прижат вправо и моноширинными цифрами: числа разной ширины на трёх строках
   не должны прыгать по горизонтали. */
.market-state-score {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  white-space: nowrap;
}
/* Пометка устаревших данных — единственное, что дописывается к строке рынка. */
.market-state-stale {
  font-size: 0.74rem;
  color: #b3541e;
  white-space: nowrap;
}

/* ---- История режимов: кнопка в шапке виджета и модал с графиком ---- */
.market-state-header-right {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}
/* Кнопка-иконка, а не ссылка: клик не должен закрывать dropdown и уводить со страницы. */
.market-state-history-btn {
  border: none;
  background: transparent;
  color: var(--text-muted);
  padding: 0.1rem 0.25rem;
  line-height: 1;
  border-radius: 0.25rem;
  cursor: pointer;
}
.market-state-history-btn:hover {
  color: var(--link);
  background: rgba(13, 110, 253, .08);
}
.market-state-history-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}
.market-state-history-meta {
  font-size: 0.8rem;
  color: var(--text-muted);
}
/* Высота задана здесь, а не атрибутом canvas: Chart.js с maintainAspectRatio=false тянется по
   контейнеру, и без явной высоты график схлопывается в ноль. */
.market-state-history-canvas-wrap {
  position: relative;
  height: 320px;
}
.market-state-history-empty {
  padding: 2rem 0;
  text-align: center;
  color: var(--text-muted);
}

/* ── ПАЛИТРА СИГНАЛОВ ─────────────────────────────────
   Раньше эти 22 цвета были продублированы построчно в index.html и alerts.html,
   и любая правка требовала синхронного редактирования двух файлов.

   Фоны здесь трогать нельзя: вес интервала кодируется именно цветом фона, и его
   изменение поедет по смыслу. Контраст чинится цветом текста — этого хватило
   для всех пар, ни один фон менять не пришлось.

   Кегль бейджей 0.7rem = 11.2px, то есть порог WCAG AA — 4.5:1, а не 3:1. */
:root {
  /* Почти-чёрные чернила для средних тонов, где не проходит ни белый, ни
     семейный тёмный цвет. */
  --ink-strong: #0B1220;
  /* Семейные чернила: уже использовались в палитре и проходят порог. */
  --ink-amber:  #422006;
  --ink-green:  #064e3b;
  --ink-red:    #7f1d1d;
}

.interval-badge {
  font-size: 0.7rem;
  padding: .15rem .35rem;
  border-radius: .25rem;
  margin-right: .25rem;
  color: var(--ink-strong);
}

/* Остальные страны: 1 — SUPER STRIKE (золотой), 2 — светло-зелёный → 11 — тёмно-зелёный; 8–9 — голубые */
.interval-weight-0  { background-color: #9ca3af; }
.interval-weight-1  { background-color: #facc15; color: var(--ink-amber); }
.interval-weight-2  { background-color: #bbf7d0; color: var(--ink-green); }
.interval-weight-3  { background-color: #86efac; color: var(--ink-green); }
.interval-weight-4  { background-color: #4ade80; color: var(--ink-green); }
.interval-weight-5  { background-color: #22c55e; }
.interval-weight-6  { background-color: #16a34a; }
.interval-weight-7  { background-color: #15803d; color: var(--white); }
.interval-weight-8  { background-color: #38bdf8; }
.interval-weight-9  { background-color: #0ea5e9; }
.interval-weight-10 { background-color: #166534; color: var(--white); }
.interval-weight-11 { background-color: #14532d; color: var(--white); }

/* RU LONG: 1 — SUPER STRIKE (золотой), 2 — светло-зелёный → 5 насыщеннее */
.interval-weight-ru-long-1 { background-color: #facc15; color: var(--ink-amber); }
.interval-weight-ru-long-2 { background-color: #bbf7d0; color: var(--ink-green); }
.interval-weight-ru-long-3 { background-color: #86efac; color: var(--ink-green); }
.interval-weight-ru-long-4 { background-color: #4ade80; color: var(--ink-green); }
.interval-weight-ru-long-5 { background-color: #22c55e; }

/* RU SHORT: 1 — SUPER STRIKE (золотой), 2 — насыщенно-красный → 5 — светлее */
.interval-weight-ru-short-1 { background-color: #facc15; color: var(--ink-amber); }
.interval-weight-ru-short-2 { background-color: #dc2626; color: var(--white); }
.interval-weight-ru-short-3 { background-color: #ef4444; }
.interval-weight-ru-short-4 { background-color: #f87171; }
.interval-weight-ru-short-5 { background-color: #fecaca; color: var(--ink-red); }

/* Тип и период сигнала */
.type-badge,
.period-type-badge { font-size: 0.7rem; padding: .2rem .4rem; white-space: nowrap; }
.type-bullish   { background-color: var(--success-color); color: var(--ink-strong); }
.type-bearish   { background-color: var(--danger-color);  color: var(--ink-strong); }
.period-type-4h { background-color: var(--primary-color); color: var(--white); }
.period-type-1d { background-color: var(--warning-color); color: var(--navy); }
.period-type-1w { background-color: var(--info-color);    color: var(--white); }

/* Bootstrap-бейджи по умолчанию идут белым текстом — на светлых фонах это 1.94:1 */
.badge-bullish { background-color: var(--success-color); color: var(--ink-strong); }
.badge-bearish { background-color: var(--danger-color);  color: var(--ink-strong); }
.badge-short   { background-color: var(--info-color);    color: var(--white); }
.badge-high    { background-color: var(--warning-color); color: var(--navy); }

/* Текст на белом: исходные --success-color и --danger-color давали 2.53 и 3.75 */
.growth-positive { color: var(--text-up); font-weight: 600; }
.growth-negative { color: var(--text-down); font-weight: 600; }

/* Крестик скрытия колонки: было #9aa0a6 на #f8f7f5 = 2.47 */
.col-close        { color: var(--text-muted); }
.col-close:hover  { color: var(--text); }

/* ── ДВИЖЕНИЕ ─────────────────────────────────────────
   На страницах алертов и потенциала роста таймеры перерисовывают прогресс-бар
   4–5 раз в секунду всё время, пока страница открыта. Тем, кто просил систему
   уменьшить движение, это не нужно. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ── ФОКУС ────────────────────────────────────────────
   Было три разные толщины кольца в трёх файлах, а у .btn-gold и
   .btn-outline-navy фокуса не было вовсе. :focus-visible не встречался ни разу. */
:where(a, button, input, select, textarea, [tabindex], .btn):focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ── БЕЙДЖИ БРОКЕРА И СТАТУСА ─────────────────────────
   Жили в accounts.html и users.html, поэтому проверка контраста фазы 7 до них
   не дотягивалась: белый текст Bootstrap давал 2.15 и 2.54. */
.badge-broker-tinkoff { background-color: #f59e0b; color: var(--ink-amber); }
.badge-broker-ff      { background-color: #0ea5e9; color: var(--ink-strong); }
.badge-unverified     { background-color: #9ca3af; color: var(--ink-strong); }

/* ── ССЫЛКИ ───────────────────────────────────────────
   Дефолтный синий Bootstrap (#0d6efd) даёт на белом 4.48 — на волос ниже
   порога AA. Подменяем его собственной переменной фреймворка, а не правилами
   поверх: так цвет подхватят и ссылки внутри его компонентов. */
:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
  --bs-link-color: var(--link);
  --bs-link-hover-color: var(--link);
  --bs-link-color-rgb: none;
}

a { color: var(--link); }
a:hover { color: var(--link); }

/* Bootstrap красит <code> в #d63384 — ровно 4.48 на белом, на волос ниже AA. */
:root, [data-bs-theme="light"], [data-bs-theme="dark"] { --bs-code-color: var(--code-ink); }
code { color: var(--code-ink); }

/* Bootstrap оставляет контурной вторичной кнопке #6c757d и в тёмной теме —
   на тёмном фоне это 3.92. Ведём её нашим приглушённым текстом. */
.btn-outline-secondary {
  --bs-btn-color: var(--text-muted);
  --bs-btn-border-color: var(--border);
  --bs-btn-hover-bg: var(--surface-sunk);
  --bs-btn-hover-color: var(--text);
  --bs-btn-hover-border-color: var(--border);
}

/* Bootstrap красит контурную предупреждающую кнопку в #ffc107 — 1.47 на белом
   и столько же на тёмном. Ведём её янтарными чернилами справки. */
.btn-outline-warning {
  --bs-btn-color: var(--warn-ink);
  --bs-btn-border-color: var(--warn-border);
  --bs-btn-hover-bg: var(--warn-surface);
  --bs-btn-hover-color: var(--warn-ink);
  --bs-btn-hover-border-color: var(--warn-border);
}

/* Строки главных сеток кликабельны: раньше курсор задавался инлайново прямо в
   сборке строки, а она переехала в общий модуль. */
.ticker-row,
.alert-row { cursor: pointer; }

/* Оговорка о риске.

   Обязана быть читаемой, а не спрятанной: набирается тем же приглушённым
   цветом, что и остальной вспомогательный текст (он проходит WCAG AA), но с
   рамкой слева — чтобы её нельзя было принять за подпись к полю. */
.risk-disclaimer {
  color: var(--text-muted);
  border-left: 3px solid var(--warn-border);
  background: var(--warn-surface);
  padding: 0.5rem 0.75rem;
  border-radius: 0 4px 4px 0;
}