/* ds-theming.css — нормализация кастомных компонентов + тёмная тема НА ТОКЕНАХ.
   Значения берутся из ds-tokens.css. Тёмная тема активна при html[data-bs-theme="dark"].
   Светлые базовые правила ниже — потому что реальных определений этих -custom
   классов нет в подключённом в витрину CSS. */

/* ===================== LIGHT: базовые кастомные кнопки ===================== */
.btn-primary-custom { background:var(--accent); border-color:var(--accent); color:var(--on-accent); font-weight:var(--fw-bold); }
.btn-primary-custom:hover { background:var(--accent-hover); border-color:var(--accent-hover); color:var(--on-accent); }
.btn-light-custom { background:var(--surface-3); border:1px solid var(--border); color:var(--text); font-weight:var(--fw-semi); }
.btn-light-custom:hover { background:var(--surface-sunken); color:var(--text); }
.btn-secondary-outline { background:transparent; border:1px solid var(--border-strong); color:var(--text); font-weight:var(--fw-semi); }
.btn-secondary-outline:hover { background:var(--surface-3); color:var(--text); }

/* ===================== DARK (селектор data-bs-theme=dark) ===================== */
/* — Кнопки — */
html[data-bs-theme="dark"] .btn-primary-custom { background:var(--accent); border-color:var(--accent); color:var(--on-accent); }
html[data-bs-theme="dark"] .btn-primary-custom:hover { background:var(--accent-hover); border-color:var(--accent-hover); }
html[data-bs-theme="dark"] .btn-light-custom { background:var(--surface-2); border-color:var(--border-strong); color:var(--text); }
html[data-bs-theme="dark"] .btn-light-custom:hover { background:var(--surface-3); color:var(--text-strong); }
html[data-bs-theme="dark"] .btn-secondary-outline { background:transparent; border-color:var(--border-strong); color:var(--text); }
html[data-bs-theme="dark"] .btn-secondary-outline:hover { background:var(--surface-2); color:var(--text-strong); }
html[data-bs-theme="dark"] .btn-secondary { background:var(--surface-3); border-color:var(--surface-3); color:var(--text); }
html[data-bs-theme="dark"] .btn-secondary:hover { background:var(--border-strong); border-color:var(--border-strong); color:var(--text-strong); }
html[data-bs-theme="dark"] .btn-light { background:var(--surface-3); border-color:var(--border-strong); color:var(--text); }
html[data-bs-theme="dark"] .btn-outline-primary.border-dashed { color:var(--accent); border-color:#6f6224; }
html[data-bs-theme="dark"] .btn-outline-primary.border-dashed:hover { background:rgba(254,204,0,.10); }
html[data-bs-theme="dark"] .btn-link.text-muted { color:var(--text-subtle) !important; }
/* иконочные / ghost */
html[data-bs-theme="dark"] .btn-icon { color:var(--text); }
html[data-bs-theme="dark"] .btn-icon.btn-primary { color:var(--on-accent); }
html[data-bs-theme="dark"] .btn-ghost-secondary { color:var(--text); }
html[data-bs-theme="dark"] .btn-ghost-danger { color:var(--c-danger); }

/* — cs-btn (настройки слотов) — */
html[data-bs-theme="dark"] .cs-btn--ghost { background:var(--surface-2); color:var(--text); }
html[data-bs-theme="dark"] .cs-btn--primary { background:var(--accent); color:var(--on-accent); }

/* — Формы — */
html[data-bs-theme="dark"] .form-control,
html[data-bs-theme="dark"] .form-select,
html[data-bs-theme="dark"] textarea.form-control { background-color:var(--surface-2); border-color:var(--border-strong); color:var(--text); }
html[data-bs-theme="dark"] .form-control::placeholder { color:var(--text-subtle); }
html[data-bs-theme="dark"] .form-control[readonly] { background-color:var(--surface-3); color:var(--text-muted); }
html[data-bs-theme="dark"] .cs-input { background:var(--surface-2); border-color:var(--border-strong); color:var(--text); }
html[data-bs-theme="dark"] .cs-select { border-color:var(--border-strong); color:var(--text);
  background:var(--surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23aaa' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center; }
html[data-bs-theme="dark"] .cs-prefix { background:var(--surface-3); border-color:var(--border-strong); color:var(--text-muted); }

/* — Чипы / переключатели — */
html[data-bs-theme="dark"] .cs-chip { background:var(--surface-2); border-color:var(--border-strong); color:var(--text-muted); }
html[data-bs-theme="dark"] .cs-chip.is-active { background:var(--accent-subtle); border-color:var(--accent); color:var(--accent); }
html[data-bs-theme="dark"] .cs-toggle-row { border-top-color:var(--border); }
html[data-bs-theme="dark"] .cs-toggle-row__text { color:var(--text); }
html[data-bs-theme="dark"] .cs-toggle-row__sub { color:var(--text-muted); }
html[data-bs-theme="dark"] .cs-switch { background:var(--border-strong); }

/* — Статусы / бейджи каналов — */
html[data-bs-theme="dark"] .mych-status--active { background:var(--c-success-bg); color:var(--c-success); }
html[data-bs-theme="dark"] .mych-status--paused { background:var(--c-warning-bg); color:var(--c-warning); }
html[data-bs-theme="dark"] .mych-status--rejected { background:var(--c-danger-bg); color:var(--c-danger); }
html[data-bs-theme="dark"] .mych-platform-tag--tg { color:var(--c-tg); }
html[data-bs-theme="dark"] .mych-platform-tag--max { color:var(--c-max); }
html[data-bs-theme="dark"] .catalog-table-cell__badge { color:var(--text); border-color:var(--border-strong); }
/* жёлтые бейджи с утилитой text-dark — светлый текст на тёмно-жёлтом фоне */
html[data-bs-theme="dark"] .badge.bg-yellow-lt.text-dark,
html[data-bs-theme="dark"] .badge.bg-yellow-lt { color:#e5c04a !important; }

/* — Карточка «Мои каналы» / таблица каталога — */
html[data-bs-theme="dark"] .mych-card { background:var(--surface); box-shadow:none; border:1px solid var(--border); }
html[data-bs-theme="dark"] .mych-btn-gear { background:var(--surface-2); color:var(--text-muted); }
html[data-bs-theme="dark"] .catalog-table-cell__about-link { color:var(--text); }
html[data-bs-theme="dark"] .catalog-table-cell__about-link-external { color:var(--text-muted); }
html[data-bs-theme="dark"] .catalog-table-cell__pic-number { background:rgba(28,32,39,.85); color:var(--text); }
html[data-bs-theme="dark"] .catalog-table-cell,
html[data-bs-theme="dark"] .catalog-table-cell--text { color:#d3d7de; }
html[data-bs-theme="dark"] .catalog-table-cell--quality { color:var(--text); }
html[data-bs-theme="dark"] .project-row td,
html[data-bs-theme="dark"] .card-table td { color:#d3d7de; }
html[data-bs-theme="dark"] .project-row .col-channel { color:var(--text); }
html[data-bs-theme="dark"] .btn.text-dark { color:var(--text-muted) !important; }
/* границы таблиц — тёмные вместо белых линий под шапкой */
html[data-bs-theme="dark"] .table,
html[data-bs-theme="dark"] .table > :not(caption) > * > * { border-color:var(--border) !important; }
html[data-bs-theme="dark"] .table > thead,
html[data-bs-theme="dark"] .table thead th,
html[data-bs-theme="dark"] .table-heading,
html[data-bs-theme="dark"] .table-heading th { border-bottom-color:var(--border) !important; }
html[data-bs-theme="dark"] .table-heading { background:var(--surface-sunken); }

/* — Выпадающее меню — */
html[data-bs-theme="dark"] .dropdown-menu { background:var(--surface); border-color:var(--border); box-shadow:var(--sh-lg); }
html[data-bs-theme="dark"] .dropdown-item { color:#d3d7de; }
html[data-bs-theme="dark"] .dropdown-item .text-muted { color:var(--text-muted) !important; }
html[data-bs-theme="dark"] .dropdown-divider { border-top-color:var(--border); }

/* — Табы — */
html[data-bs-theme="dark"] .custom-tabs .nav-link { color:var(--text-muted); }
html[data-bs-theme="dark"] .custom-tabs .nav-link.active { background:var(--surface-2); color:var(--text); }

/* — Тултип подборки — */
html[data-bs-theme="dark"] .bookmark-tooltip { background:var(--surface); border-color:var(--border); color:var(--text); }
html[data-bs-theme="dark"] .bookmark-tooltip__title { color:var(--text); }
html[data-bs-theme="dark"] .bookmark-tooltip__subtitle { color:var(--text-muted); }
html[data-bs-theme="dark"] .bookmark-tooltip__footer { border-top-color:var(--border); }
html[data-bs-theme="dark"] .bookmark-tooltip__input { background:var(--surface-2); border-color:var(--border-strong); color:var(--text); }

/* — Модалки — */
html[data-bs-theme="dark"] .channel-modal-content,
html[data-bs-theme="dark"] .modal-content { background:var(--surface); color:var(--text); }
html[data-bs-theme="dark"] .channel-modal-title { color:var(--text); }
html[data-bs-theme="dark"] .channel-modal-text { color:var(--text-muted); }
html[data-bs-theme="dark"] .cancel-modal__box { background:var(--surface); }
html[data-bs-theme="dark"] .cancel-modal__head { border-bottom-color:var(--border); }
html[data-bs-theme="dark"] .cancel-modal__title { color:var(--text); }
html[data-bs-theme="dark"] .cancel-modal__subtitle { color:var(--text-muted); }
html[data-bs-theme="dark"] .cancel-modal__label { color:var(--text-muted); }
html[data-bs-theme="dark"] .cancel-modal__footer { border-top-color:var(--border); }
html[data-bs-theme="dark"] .cancel-chip { background:var(--surface-2); border-color:var(--border-strong); color:#c7ccd6; }
html[data-bs-theme="dark"] .cancel-chip.is-active { border-color:#e05561; background:var(--c-danger-bg); color:var(--c-danger); }
html[data-bs-theme="dark"] .cancel-reason-input { background:var(--surface-2); border-color:var(--border-strong); color:var(--text); }
html[data-bs-theme="dark"] .cancel-btn-ghost { background:transparent; border-color:var(--border-strong); color:#c7ccd6; }

/* ===================== DARK: hover / focus ===================== */
html[data-bs-theme="dark"] .btn-icon:hover,
html[data-bs-theme="dark"] .btn-outline-secondary:hover,
html[data-bs-theme="dark"] .btn-ghost-secondary:hover { background:var(--surface-3); border-color:var(--border-strong); color:var(--text-strong); }
html[data-bs-theme="dark"] .btn-icon.btn-primary:hover { background:var(--accent-hover); color:var(--on-accent); }
html[data-bs-theme="dark"] .btn-ghost-danger:hover { background:var(--c-danger-bg); color:var(--c-danger-strong); }
html[data-bs-theme="dark"] .btn-light:hover { background:var(--border-strong); border-color:var(--border-strong); color:var(--text-strong); }
html[data-bs-theme="dark"] .btn-link:hover { color:var(--text-strong); }
html[data-bs-theme="dark"] .cs-btn--ghost:hover { background:var(--surface-3); }
html[data-bs-theme="dark"] .cancel-btn-ghost:hover { background:var(--surface-3); color:var(--text-strong); }
html[data-bs-theme="dark"] .mych-btn:hover { opacity:.9; }
html[data-bs-theme="dark"] .mych-btn-gear:hover { background:var(--border-strong); color:var(--text-strong); }
html[data-bs-theme="dark"] .cs-chip:hover { border-color:var(--border-hover); color:var(--text); }
html[data-bs-theme="dark"] .cancel-chip:hover { border-color:var(--border-hover); background:var(--surface-3); color:var(--text-strong); }
html[data-bs-theme="dark"] .custom-tabs .nav-link:hover { background:var(--surface-sunken); color:var(--text); }
html[data-bs-theme="dark"] .dropdown-item:hover { background:var(--surface-3); color:var(--text-strong); }
html[data-bs-theme="dark"] .dropdown-item.text-danger:hover { background:var(--c-danger-bg); color:var(--c-danger-strong); }
html[data-bs-theme="dark"] .bookmark-tooltip__item:hover { background:var(--surface-3); }
html[data-bs-theme="dark"] .catalog-table-cell__badge:hover { background:var(--surface-3); border-color:var(--border-hover); color:var(--text-strong); }
html[data-bs-theme="dark"] .catalog-table-cell__about-link:hover { color:var(--link); }
html[data-bs-theme="dark"] .table-hover > tbody > tr:hover > *,
html[data-bs-theme="dark"] .project-row:hover td { background:rgba(255,255,255,.04); }
html[data-bs-theme="dark"] .tm-period button:hover,
html[data-bs-theme="dark"] .tm-seg button:hover:not(.is-active),
html[data-bs-theme="dark"] .tm-pill-btn:hover { background:var(--surface-3); color:var(--text); }
/* Поля — фокус (единый focus-ring токен) */
html[data-bs-theme="dark"] .form-control:focus,
html[data-bs-theme="dark"] .form-select:focus,
html[data-bs-theme="dark"] .cs-input:focus,
html[data-bs-theme="dark"] .cs-select:focus,
html[data-bs-theme="dark"] .cancel-reason-input:focus,
html[data-bs-theme="dark"] .bookmark-tooltip__input:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--focus-ring); outline:none; }

/* — Виджеты / приглушённый текст — */
html[data-bs-theme="dark"] .dash-cal-day { color:var(--text); }
html[data-bs-theme="dark"] .dash-calendar thead th { color:var(--text-muted); }
html[data-bs-theme="dark"] .dash-stat-value { color:var(--text); }
html[data-bs-theme="dark"] .metric-table td { color:#d3d7de; }
html[data-bs-theme="dark"] .dsx-main .text-muted { color:var(--text-muted); }
