/* ============================================================================
   mobile-theme.css — РЕМАП ЗАХАРДКОЖЕННЫХ ЦВЕТОВ admin-macos → ТОКЕНЫ
   ----------------------------------------------------------------------------
   Проблема: десятки страниц в /macos/css/style.css написаны dark-only.
   Прямые hex/rgba (фоны инпутов rgba(255,255,255,.04), карточки, статус-пиллы
   пастельные, тёмные инпуты #0c0c0c/#0d0d0d/#050505, жирные тени rgba(0,0,0,.x))
   на СВЕТЛОЙ теме дают «белое-на-белом» либо «чёрную кляксу на светлом».

   Что чиню ЗДЕСЬ: только прямые hex/rgba — преимущественно ФОНЫ, БОРДЕРЫ,
   ПАСТЕЛЬНЫЕ СТАТУС-ЦВЕТА и ТЕНИ. Это НЕ покрыто light-theme.css (там — тексты).

   Принцип:
   - Цветовые ремапы → ГЛОБАЛЬНО под .admin-main, БЕЗ @media и БЕЗ theme-гейта.
     Так чинятся ОБЕ темы сразу (токены сами разруливаются :root vs data-theme).
   - Токены: --bg / --bg-surface / --border / --text-strong / --mkt-muted /
     --accent / --accent-bg / --accent-contrast / --green(+bg) / --red(+bg) /
     --blue / --yellow / --shadow-lg / --shadow-md.
   - НИКАКИХ новых hex/шрифтов/эмодзи. Только ремап на существующие токены.
   - !important — для перебивания прямых hex (особенно атрибутных селекторов
     input[type=text]/[type=color] с высокой специфичностью).
   - Модалки (.api-modal-card / .dwm-box / .totp-modal) рендерятся ВНЕ
     .admin-main → таргечу их по собственному классу.
   - НЕ трогаю support-* / user-detail-* — ими заняты другие агенты.
   ========================================================================== */

/* ════════════════════════════════════════════════════════════════════════
   STATISTICS — online-блок, device-bars (dark-only фоны/пастель)
   ════════════════════════════════════════════════════════════════════════ */

/* активный range-btn / включённый chip: захардкожен rgba(255,255,255,..) фон */
.admin-main .online-range-btn.is-active {
  background: var(--accent-bg) !important;
  color: var(--accent) !important;
}
.admin-main .online-chip.is-on {
  background: var(--accent-bg) !important;
  border-color: color-mix(in srgb, var(--accent) 40%, transparent) !important;
  color: var(--accent) !important;
}

/* device-bars: пастельные hex → семантические токены (различимы в обеих темах) */
.admin-main .device-bar-fill--desktop { background: var(--green) !important; }
.admin-main .device-bar-fill--mobile  { background: var(--blue) !important; }
.admin-main .device-bar-fill--tablet  { background: var(--yellow) !important; }
.admin-main .device-bar-fill--other   { background: var(--mkt-muted) !important; }

/* ════════════════════════════════════════════════════════════════════════
   WORKER-COMMISSIONS — инпуты с белым полупрозрачным фоном + code-block
   ════════════════════════════════════════════════════════════════════════ */

/* инпуты комиссий: rgba(255,255,255,.04) фон + #f0f0f0 текст = невидимы на свету */
.admin-main .commissions-table .commission-input,
.admin-main .commissions-default-input {
  background: var(--bg-surface) !important;
  color: var(--text-strong) !important;
  border-color: color-mix(in srgb, var(--accent) 36%, var(--border)) !important;
}
.admin-main .commissions-table .commission-input::placeholder,
.admin-main .commissions-default-input::placeholder {
  color: var(--mkt-muted) !important;
}

/* code-block: rgba(0,0,0,.32) фон + #c0c0c0 текст */
.admin-main .code-block {
  background: var(--bg-surface) !important;
  color: var(--text-strong) !important;
  border: 1px solid var(--border) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   SWEEP-AUDIT — селекты с белым полупрозрачным фоном
   ════════════════════════════════════════════════════════════════════════ */
.admin-main .audit-controls .select {
  background: var(--bg-surface) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-strong) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   SWEEP-MONITOR — status-card / count-card / status-pill (пастель dark-only)
   ════════════════════════════════════════════════════════════════════════ */

/* базовые карточки: rgba(255,255,255,.03..) фон, белые тексты */
.admin-main .status-card,
.admin-main .count-card {
  background: var(--bg-surface) !important;
  border: 1px solid var(--border) !important;
}
.admin-main .status-card strong,
.admin-main .count-card strong {
  color: var(--text-strong) !important;
}
.admin-main .status-card-label,
.admin-main .status-card small,
.admin-main .count-card small {
  color: var(--mkt-muted) !important;
}

/* семантические модификаторы карточек: пастель → токен-bg + бордер */
.admin-main .status-card--ok {
  background: var(--green-bg) !important;
  border-color: color-mix(in srgb, var(--green) 30%, transparent) !important;
}
.admin-main .status-card--danger {
  background: var(--red-bg) !important;
  border-color: color-mix(in srgb, var(--red) 30%, transparent) !important;
}
.admin-main .count-card--ok     { background: var(--green-bg) !important; }
.admin-main .count-card--danger { background: var(--red-bg) !important; }
.admin-main .count-card--warn   { background: color-mix(in srgb, var(--yellow) 14%, transparent) !important; }
.admin-main .count-card--info   { background: color-mix(in srgb, var(--blue) 14%, transparent) !important; }

/* status-pill: пастельный текст #b6f0c1/#fec8c8/.. почти не виден на свету */
.admin-main .status-pill--ok {
  background: var(--green-bg) !important;
  color: var(--green) !important;
}
.admin-main .status-pill--muted {
  background: color-mix(in srgb, var(--mkt-muted) 16%, transparent) !important;
  color: var(--mkt-muted) !important;
}
.admin-main .status-pill--info {
  background: color-mix(in srgb, var(--blue) 16%, transparent) !important;
  color: var(--blue) !important;
}
.admin-main .status-pill--warn {
  background: color-mix(in srgb, var(--yellow) 16%, transparent) !important;
  color: var(--yellow) !important;
}
.admin-main .status-pill--danger {
  background: var(--red-bg) !important;
  color: var(--red) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   TOTP-ENROLL — карточки на белом-прозрачном, инпут #fff, accent-num
   ════════════════════════════════════════════════════════════════════════ */

/* карточки состояния/инфо/энролла: rgba(255,255,255,.03) фон */
.admin-main .totp-page .totp-state-card,
.admin-main .totp-info-card,
.admin-main .totp-enroll-card {
  background: var(--bg-surface) !important;
  border: 1px solid var(--border) !important;
}
.admin-main .totp-state-card--ok {
  background: var(--green-bg) !important;
  border-color: color-mix(in srgb, var(--green) 30%, transparent) !important;
}

/* нумерованные шаги: rgba(96,165,250,.18) + #c0d8ff = голубой → accent */
.admin-main .totp-enroll-num {
  background: var(--accent-bg) !important;
  color: var(--accent) !important;
}

/* secret-block ссылка: чужой синий #2a6fc7 → accent */
.admin-main .totp-secret-block .btn-link { color: var(--accent) !important; }
.admin-main .totp-secret-block .btn-link:hover { color: var(--accent-hover) !important; }

/* поле ввода кода: высокая специфичность input[type=text] + #fff текст */
.admin-main .totp-confirm-form input[type="text"] {
  background: var(--bg-surface) !important;
  color: var(--text-strong) !important;
  border: 1px solid var(--border) !important;
}
.admin-main .totp-confirm-form input[type="text"]::placeholder {
  color: var(--mkt-muted) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   WITHDRAW-MODULE — textarea с чёрным фоном #0c0c0c
   ════════════════════════════════════════════════════════════════════════ */
.admin-main .wm-textarea {
  background: var(--bg-surface) !important;
  color: var(--text-strong) !important;
  border: 1px solid var(--border) !important;
}
.admin-main .wm-textarea::placeholder { color: var(--mkt-muted) !important; }

/* ════════════════════════════════════════════════════════════════════════
   FB-PIXEL / VERIFICATION-CARD — panel-head тёмный фон, vf-input #0d0d0d
   ════════════════════════════════════════════════════════════════════════ */

/* шапка панели: rgba(24,24,24,.9) тёмный фон → прозрачный + нижний бордер */
.admin-main .verification-card .panel-head {
  background: transparent !important;
  border-bottom: 1px solid var(--border) !important;
}
.admin-main .verification-card .panel-head h2 {
  color: var(--text-strong) !important;
}

/* поле авто-секунд: #0d0d0d фон + #f5f5f5 текст (высокая специфичность .input) */
.admin-main .vf-auto-field .input {
  background: var(--bg-surface) !important;
  color: var(--text-strong) !important;
  border: 1px solid var(--border) !important;
}
.admin-main .vf-auto-field .input::placeholder { color: var(--mkt-muted) !important; }

/* hint-warn: accent-тинт уже задан через #ed6432, текст #f0c8b6 нечитаем на свету */
.admin-main .hint-warn {
  background: var(--accent-bg) !important;
  border-color: color-mix(in srgb, var(--accent) 30%, transparent) !important;
  color: color-mix(in srgb, var(--accent) 70%, var(--text-strong)) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   API PAGE — details/pre/code тёмные фоны (фоны; тексты уже в light-theme.css)
   ════════════════════════════════════════════════════════════════════════ */

/* details карточки: rgba(20,20,20,.35) фон + #1e1e1e бордер */
.admin-main .api-docs details {
  background: var(--bg-surface) !important;
  border: 1px solid var(--border) !important;
}
.admin-main .api-docs details[open] {
  background: var(--bg-surface) !important;
  border-color: var(--border-hover) !important;
}

/* pre code-блок: #0c0c0c фон */
.admin-main .api-docs pre {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-strong) !important;
}
.admin-main .api-docs pre code,
.admin-main .api-docs pre code * {
  color: var(--text-strong) !important;
}
/* inline code: чужой жёлто-коричневый #e9b66e → accent */
.admin-main .api-docs code { color: var(--accent) !important; }

/* api-warning strong: #fff → невидимо на белом фоне-тинте */
.admin-main .api-warning strong { color: var(--text-strong) !important; }

/* модалка api ВНЕ .admin-main: btn-dark с #fff текстом на ховере */
.api-modal-card .btn-dark {
  background: var(--bg-surface) !important;
  color: var(--text-strong) !important;
  border: 1px solid var(--border) !important;
}
.api-modal-card .btn-dark:hover {
  background: color-mix(in srgb, var(--text-strong) 8%, transparent) !important;
  color: var(--text-strong) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   MATERIALS — em/списки/копи-кнопка ховер (фоны; тексты частью в light-theme)
   ════════════════════════════════════════════════════════════════════════ */

/* копи-кнопка ховер: #1f1f1f фон + #fff текст */
.admin-main .materials-doc .md-codeblock-copy:hover {
  background: color-mix(in srgb, var(--text-strong) 8%, transparent) !important;
  color: var(--text-strong) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   DOMAIN EDITOR — seg-control / color-input (частью вне .admin-main)
   ════════════════════════════════════════════════════════════════════════ */

/* seg-control контейнер: #1a1a1a фон */
.admin-main .seg-control,
.seg-control {
  background: var(--bg-surface) !important;
}
.admin-main .seg-btn,
.seg-btn { color: var(--mkt-muted) !important; }
.admin-main .seg-btn:hover,
.seg-btn:hover { color: var(--text-strong) !important; }
.admin-main .seg-btn.is-active,
.seg-btn.is-active {
  background: var(--bg) !important;
  color: var(--text-strong) !important;
}

/* color picker: #050505 фон + #303030 бордер */
.admin-main .color-control input[type="color"],
.color-control input[type="color"] {
  background: var(--bg) !important;
  border: 1px solid var(--border) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   DRAIN-EVENTS — модалка .dwm-box ВНЕ .admin-main: кнопки наследуют дефолт
   ════════════════════════════════════════════════════════════════════════ */
.dwm-box .btn {
  background: var(--accent) !important;
  color: var(--accent-contrast) !important;
  border: none !important;
}
.dwm-box .btn.btn-dark {
  background: color-mix(in srgb, var(--text-strong) 6%, transparent) !important;
  color: var(--text-strong) !important;
  border: 1px solid var(--border) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   PAYOUT-DESTINATIONS / MASTER — белые-прозрачные фоны, жирные тени, hover hex
   ════════════════════════════════════════════════════════════════════════ */

/* история выплат: rgba(255,255,255,.02) фон */
.admin-main .pd-history {
  background: var(--bg-surface) !important;
}

/* save-кнопка hover: чужой #f57544 → accent-hover */
.admin-main .pd-action-btn-save:hover:not(:disabled) {
  background: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
}

/* плавающая action-bar: жирная rgba(0,0,0,.32) тень → токен */
.admin-main .pd-action-bar-inner {
  box-shadow: var(--shadow-lg) !important;
}

/* payout-master подсказки: rgba(255,255,255,.025) фон + белые тексты */
.admin-main .master-tips article {
  background: var(--bg-surface) !important;
  border: 1px solid var(--border) !important;
}
.admin-main .master-tips strong { color: var(--text-strong) !important; }
.admin-main .master-tips p { color: var(--mkt-muted) !important; }

/* ============================================================================
   ТОГГЛЫ (.toggle) — macos красит включённый в бело-серый (#f5f5f5), а
   выключенный в #3b3b3b/#111 → в светлой теме выглядят ЧЁРНЫМИ. Делаем как
   бренд: включённый = АКЦЕНТ, выключенный = нейтральный серый, бегунок белый.
   Обе темы, моб + ПК. (.pset-switch уже акцентный — его не трогаем.)
   ========================================================================== */
.admin-main .toggle {
  background: color-mix(in srgb, var(--text-strong) 22%, transparent) !important;
}
.admin-main .toggle::after {
  background: #fff !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.28) !important;
}
.admin-main .toggle.is-on {
  background: var(--accent) !important;
}
.admin-main .toggle.is-on::after {
  background: #fff !important;
}

/* ============================================================================
   HOME — вторичная кнопка hero «Open support» была .btn-dark на тёмном hero →
   тёмная на тёмном, невидима (на скрине осталась только оранжевая «Add domain»).
   Делаем её стеклянной/читаемой поверх тёмного hero. ПК + мобила.
   ========================================================================== */
.admin-main .hero-command .hero-actions .btn-dark {
  background: rgba(255, 255, 255, 0.14) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  backdrop-filter: blur(2px);
}
.admin-main .hero-command .hero-actions .btn-dark:hover {
  background: rgba(255, 255, 255, 0.22) !important;
}
.admin-main .hero-command .hero-actions .btn-dark svg { stroke: #fff !important; }

/* ============================================================================
   HOME — не показывать карточки доменов, которых нет. home.js добивает список
   пустыми заглушками (.domain-cube.is-empty → «—») до 4 штук. Скрываем их —
   видны только реальные домены. ПК + мобила.
   ========================================================================== */
.admin-main .domain-cube.is-empty { display: none !important; }
@media (min-width: 769px) {
  /* чтобы 2 реальных домена заполняли ряд, а не жались в первые ячейки сетки */
  .admin-main .domain-cubes {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  }
}