/* Светлая тема: мягкий белый и светло-серый, пастельные акценты, воздух.

   Подключается последним и только доуточняет готовую раскладку. В базовых
   файлах часть цветов задана напрямую под тёмный фон — здесь они переводятся
   на токены. Тёмная тема не затрагивается: все правила ограничены
   :root[data-theme="light"], поэтому переключатель работает как прежде. */

:root[data-theme="light"]{
 color-scheme:light;
 /* Поверхности: белый контент на едва тёплом сером полотне. */
 --bg:#f7f8fb;
 --surface:#ffffff;
 --surface-soft:#fbfcfe;
 --surface-hover:#f2f5fa;
 /* Текст: глубокий сине-серый вместо чистого чёрного — мягче для глаз. */
 --ink:#1d2430;
 --ink-secondary:#515c6c;
 /* Приглушённые ступени потемнели до порога WCAG AA на полотне #f7f8fb:
    было 4.34 у --muted и 2.82 у --faint. Прежде недобор не ловился — фон
    страницы задавался градиентом, и проверка контраста пропускала всё, что
    лежит прямо на полотне: подпись над заголовком, описание раздела, время
    обновления и строку подвала. */
 --muted:#667080;
 --faint:#707a89;
 /* Линии: тонкие и светлые, разделяют без жёсткости. */
 --border:#e8ecf3;
 --field-border:#dde3ec;
 /* Боковая панель перестаёт быть тёмной: светлая со стеклянной подложкой. */
 --nav:#f2f4f9;
 --nav-ink:#39434f;
 --nav-ink-soft:#6d7889;
 --nav-hover:#e9edf5;
 --nav-active:#ffffff;
 --green:#1b8a68;
 /* Мягкое свечение и деликатное стекло. */
 --glass:rgba(255,255,255,.72);
 --glass-line:rgba(18,32,54,.07);
 --glass-shadow:0 2px 10px rgba(22,34,56,.05);
 --shadow-card:0 1px 2px rgba(22,34,56,.04),0 8px 24px rgba(22,34,56,.05);
 --shadow-card-hover:0 2px 6px rgba(22,34,56,.06),0 16px 40px rgba(22,34,56,.08);
 --shadow-pop:0 20px 56px rgba(18,28,48,.14);
}

/* --- Полотно. Голубое и лиловое пятна убраны: светлая тема держится на одном
   нейтральном, а цвет остаётся за графиками и состояниями. --- */
:root[data-theme="light"] body{
 background:linear-gradient(180deg,#ffffff,var(--bg));
 background-attachment:fixed;
}

/* --- Боковая панель: светлое матовое стекло, а не тёмный блок --- */
:root[data-theme="light"] .sidebar{
 background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(247,249,253,.88));
 color:var(--nav-ink);
 border-right:1px solid var(--border);
 backdrop-filter:blur(18px) saturate(140%);
 -webkit-backdrop-filter:blur(18px) saturate(140%);
}
:root[data-theme="light"] .nav-heading{color:var(--faint)}
:root[data-theme="light"] .nav-item{color:var(--nav-ink-soft)}
:root[data-theme="light"] .nav-item:hover{background:var(--nav-hover);color:var(--ink)}
:root[data-theme="light"] .nav-item.selected{
 background:var(--nav-active);color:var(--ink);
 box-shadow:0 1px 2px rgba(22,34,56,.05),0 6px 18px rgba(22,34,56,.07);
}
:root[data-theme="light"] .nav-item.selected>svg{color:var(--accent)}
:root[data-theme="light"] .nav-count{background:#e6eaf2;color:var(--ink-secondary)}
:root[data-theme="light"] .connection-card{border-color:var(--border);background:rgba(255,255,255,.6)}
:root[data-theme="light"] .connection-card div>span{color:var(--faint)}
:root[data-theme="light"] .user-bar{border-top-color:var(--border)}
:root[data-theme="light"] .user-avatar{background:#e8ecf4;color:var(--ink-secondary)}
:root[data-theme="light"] .user-bar div>span{color:var(--faint)}
:root[data-theme="light"] .logout{color:var(--muted)!important}
:root[data-theme="light"] .brand-sub{color:var(--faint)}

/* --- Карточки и таблицы: белые поверхности, тонкие линии --- */
:root[data-theme="light"] .panel,
:root[data-theme="light"] .stat-card{background:var(--surface);border-color:var(--border)}
:root[data-theme="light"] thead{background:var(--surface-soft)}
:root[data-theme="light"] th{color:var(--faint);border-bottom-color:var(--border)}
:root[data-theme="light"] td{border-bottom-color:#f0f3f8}
:root[data-theme="light"] tbody tr:hover{background:var(--surface-hover)}
:root[data-theme="light"] .count-chip{background:#edf1f7;color:var(--muted)}
:root[data-theme="light"] .balance-mini{background:var(--surface-soft);border-color:var(--border)}
:root[data-theme="light"] .account-name{color:var(--ink)}
:root[data-theme="light"] .account-sub,
:root[data-theme="light"] .cell-meta,
:root[data-theme="light"] .order-meta,
:root[data-theme="light"] .event-time{color:var(--faint)}
:root[data-theme="light"] .proxy-chip,
:root[data-theme="light"] .orders-count{background:#eff2f7;color:var(--muted)}

/* --- Кнопки и поля --- */
:root[data-theme="light"] .secondary{background:var(--surface);border-color:var(--border);color:var(--ink-secondary)}
:root[data-theme="light"] .secondary:hover:not(:disabled){background:var(--surface-hover)}
:root[data-theme="light"] .text-button{color:var(--ink-secondary)}
:root[data-theme="light"] .text-button:hover:not(:disabled){background:var(--surface-hover)}
:root[data-theme="light"] .icon-button{color:var(--muted)}
:root[data-theme="light"] .icon-button:hover:not(:disabled){background:var(--surface-hover);color:var(--ink)}
:root[data-theme="light"] input,
:root[data-theme="light"] textarea,
:root[data-theme="light"] select{background:var(--surface);border-color:var(--field-border);color:var(--ink)}
:root[data-theme="light"] label{color:var(--ink-secondary)}

/* --- Модальные окна: белое стекло и мягкая тень --- */
:root[data-theme="light"] .modal{background:var(--surface);border-color:var(--border)}
:root[data-theme="light"] .modal::backdrop{background:rgba(24,36,58,.28);backdrop-filter:blur(4px)}
:root[data-theme="light"] .modal-heading,
:root[data-theme="light"] .form-divider{border-bottom-color:var(--border)}
:root[data-theme="light"] .modal-footer{background:var(--surface-soft);border-top-color:var(--border)}
:root[data-theme="light"] .proxy-box{background:var(--surface-soft);border-color:var(--border)}

/* --- Прочее --- */
:root[data-theme="light"] .toast{background:#252f3f;color:#fff;box-shadow:var(--shadow-pop)}
/* Подвал и сноски берут --muted, а не --faint: это обычный текст, а не
   вспомогательная метка рядом с подписанным полем, и 4.09 у --faint на
   полотне ниже порога. Сам --faint остаётся для меток, которые дублируют
   уже названное рядом. */
:root[data-theme="light"] .page-footer,
:root[data-theme="light"] .footnote{color:var(--muted)}
:root[data-theme="light"] .empty-state p{color:var(--muted)}
:root[data-theme="light"] .mono{color:var(--muted)}

/* --- Контраст: приглушённые серые из тёмной темы не проходят WCAG AA
       на белом фоне. Ниже — те же роли, но с достаточной насыщенностью.
       Проверено аудитом tests/ui/ui-audit-native.test.cjs. --- */
:root[data-theme="light"] th{color:#5c6775}                    /* было 2.92 */
:root[data-theme="light"] .account-username,
:root[data-theme="light"] .account-sub{color:#5f6b7a}           /* было 3.00 */
:root[data-theme="light"] .account-sub span,
:root[data-theme="light"] .account-sub strong{color:inherit}
:root[data-theme="light"] .proxy-chip{background:#eef1f6;color:#5a6676} /* было 4.10 */
:root[data-theme="light"] .bot-label{color:#5f6b7a}
:root[data-theme="light"] .bot-label.on{color:#1d7557}          /* было 4.30 */
:root[data-theme="light"] .bot-label.off{color:#a4323f}
:root[data-theme="light"] .optional-chip{color:#5f6b7a}         /* было 4.49 */
:root[data-theme="light"] .metric-trend.good{color:#146b47}     /* было 4.30 */
:root[data-theme="light"] .metric-trend.bad{color:#a8384a}
:root[data-theme="light"] .metric-trend.flat{color:#5c6775}     /* было 4.49 */
/* Рейтинг и число отзывов: один бейдж с вложенными span. */
:root[data-theme="light"] .reputation-badge,
:root[data-theme="light"] .reputation-badge span{color:#2f6fb5} /* было 4.10 */

/* --- Выбор темы при первом входе: работает в обеих темах --- */
.theme-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.theme-choice{
 display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;
 border:1px solid var(--border);border-radius:var(--radius-lg,16px);
 background:var(--surface);color:var(--ink);padding:12px;
 transition:border-color .15s cubic-bezier(.22,1,.36,1),box-shadow .15s cubic-bezier(.22,1,.36,1);
}
.theme-choice:hover{border-color:var(--accent);box-shadow:var(--shadow-card-hover)}
.theme-choice strong{font-size:calc(var(--text-13) * var(--font-scale));font-weight:500}
.theme-choice .small{font-weight:400;line-height:1.45}
.theme-preview{
 display:block;width:100%;height:62px;border-radius:10px;overflow:hidden;
 border:1px solid var(--border);margin-bottom:4px;position:relative;
}
.theme-preview-bar{display:block;height:100%;width:34%;position:absolute;left:0;top:0}
.theme-preview-body{display:block;height:100%;margin-left:34%}
.theme-preview.light .theme-preview-bar{background:#eef1f7}
.theme-preview.light .theme-preview-body{background:linear-gradient(135deg,#ffffff,#f5f7fc)}
.theme-preview.dark .theme-preview-bar{background:#0c1119}
.theme-preview.dark .theme-preview-body{background:linear-gradient(135deg,#1a2230,#10151d)}
.theme-preview.system .theme-preview-bar{background:linear-gradient(180deg,#eef1f7 50%,#0c1119 50%)}
.theme-preview.system .theme-preview-body{background:linear-gradient(180deg,#ffffff 50%,#1a2230 50%)}
#theme-dialog .modal-heading{border-bottom:0;padding-bottom:0}
#theme-dialog .modal-body{gap:14px}
@media(max-width:560px){
 .theme-choices{grid-template-columns:1fr}
 .theme-preview{height:52px}
}

@media(prefers-reduced-transparency:reduce){
 :root[data-theme="light"] .sidebar{backdrop-filter:none;-webkit-backdrop-filter:none;background:#f4f6fa}
}