/* ============================================================================
   WL — слой темы. Подключать ПОСЛЕ dashboard.css.
   Ничего не удаляет из шаблона: перекрывает переменными и точечными правилами.
   Исходный тон шаблона #467fcf вытесняется --wl-accent.

   Смена основного тона (для отстройки от гаммы поставщика) — правка ОДНОГО
   блока --wl-accent* ниже. Всё остальное считается от него.
   ============================================================================ */

:root {
  /* --- база: холодный чёрный с синим подтоном --- */
  --wl-bg:            #05070c;  /* фон страницы */
  --wl-surface:       #0b0f17;  /* карточки, панели */
  --wl-surface-2:     #111726;  /* вложенные блоки, hover строк */

  /* --- акцент: заменить эти четыре строки при смене тона --- */
  --wl-accent:        #2e9bff;
  --wl-accent-hi:     #56b8ff;  /* свечение, hover */
  --wl-accent-lo:     #0a4e9b;  /* глубокий край градиента */
  --wl-accent-ink:    #ffffff;  /* текст на акценте */

  /* --- состояния --- */
  --wl-danger:        #e11d2a;  /* «до», падение, ошибка */
  --wl-danger-hi:     #ff4a56;
  --wl-success:       #1ea55b;  /* достигнуто, ТОП */
  --wl-success-hi:    #2fd97b;
  --wl-warning:       #f0a020;

  /* --- текст --- */
  --wl-text:          #ffffff;
  --wl-text-2:        #93a0b4;  /* подписи, вторичное */
  --wl-text-3:        #5c6879;  /* дизейбл, мета */

  /* --- границы и свечение --- */
  --wl-border:        rgba(46, 155, 255, 0.16);
  --wl-border-soft:   rgba(255, 255, 255, 0.07);
  --wl-glow:          0 0 24px rgba(46, 155, 255, 0.28);
  --wl-glow-soft:     0 0 12px rgba(46, 155, 255, 0.16);

  /* --- геометрия --- */
  --wl-radius:        6px;
  --wl-radius-lg:     10px;

  /* перекрытие переменных Tabler/BS4, если тема их читает */
  --primary:          var(--wl-accent);
  --blue:             var(--wl-accent);
  --danger:           var(--wl-danger);
  --success:          var(--wl-success);
  --body-bg:          var(--wl-bg);
}

/* ---------------------------------------------------------------- каркас -- */

body,
.page,
.page-main {
  background: var(--wl-bg);
  color: var(--wl-text);
}

/* диагональное свечение от левого верхнего угла — единственный «атмосферный»
   элемент, взят с креатива; на печати и при prefers-reduced-motion статичен */
.page::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(60rem 40rem at 12% -10%, rgba(46, 155, 255, 0.10), transparent 60%),
    radial-gradient(40rem 30rem at 100% 0%, rgba(225, 29, 42, 0.06), transparent 60%);
}
.page > * { position: relative; z-index: 1; }

a { color: var(--wl-accent); }
a:hover { color: var(--wl-accent-hi); text-decoration: none; }

hr { border-color: var(--wl-border-soft); }

::selection { background: var(--wl-accent); color: var(--wl-accent-ink); }

/* ----------------------------------------------------------------- шапка -- */

.header,
.navbar,
.aside {
  background: var(--wl-surface);
  border-color: var(--wl-border) !important;
  box-shadow: none;
}

.nav-link,
.navbar .nav-link {
  color: var(--wl-text-2);
}
.nav-link:hover,
.nav-link.active {
  color: var(--wl-text);
}
.nav-item.active > .nav-link,
.nav-link.active {
  box-shadow: inset 0 -2px 0 var(--wl-accent);
}

/* ---------------------------------------------------------------- карточки -- */

.card,
.dropdown-menu,
.modal-content,
.list-group-item {
  background: var(--wl-surface);
  border: 1px solid var(--wl-border);
  border-radius: var(--wl-radius-lg);
  color: var(--wl-text);
  box-shadow: none;
}

.card-header,
.card-footer {
  background: transparent;
  border-color: var(--wl-border-soft);
}

.card-title { color: var(--wl-text); font-weight: 600; }

/* карточка баланса/итога — единственное место со свечением */
.card.wl-highlight {
  border-color: rgba(46, 155, 255, 0.42);
  box-shadow: var(--wl-glow);
}

/* ---------------------------------------------------------------- таблицы -- */

.table {
  color: var(--wl-text);
}
.table thead th {
  background: transparent;
  border-bottom: 1px solid var(--wl-border);
  color: var(--wl-text-3);
  font-weight: 500;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.table td,
.table th {
  border-top: 1px solid var(--wl-border-soft);
}
.table-hover tbody tr:hover {
  background: var(--wl-surface-2);
}

/* денежные колонки — табличные цифры, чтобы разряды стояли столбиком */
.wl-num,
.table td.wl-num {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  text-align: right;
  white-space: nowrap;
}
.wl-num--minus { color: var(--wl-danger-hi); }
.wl-num--plus  { color: var(--wl-success-hi); }

/* ----------------------------------------------------------------- формы -- */

.form-control,
.custom-select,
.input-group-text {
  background: var(--wl-surface-2);
  border: 1px solid var(--wl-border);
  color: var(--wl-text);
  border-radius: var(--wl-radius);
}
.form-control::placeholder { color: var(--wl-text-3); }

.form-control:focus,
.custom-select:focus {
  background: var(--wl-surface-2);
  border-color: var(--wl-accent);
  box-shadow: var(--wl-glow-soft);
  color: var(--wl-text);
}

.form-control:disabled,
.form-control[readonly] {
  background: var(--wl-surface);
  color: var(--wl-text-3);
}

label,
.form-label { color: var(--wl-text-2); }

/* видимый фокус с клавиатуры — на всех интерактивных элементах */
:focus-visible {
  outline: 2px solid var(--wl-accent-hi);
  outline-offset: 2px;
}

/* ---------------------------------------------------------------- кнопки -- */

.btn {
  border-radius: var(--wl-radius);
  font-weight: 600;
  letter-spacing: 0.01em;
  transition: background-color .15s ease, box-shadow .15s ease; /* .15s без ведущего нуля — герметичность grep-аудита §6 */
}

.btn-primary {
  background: linear-gradient(180deg, var(--wl-accent) 0%, var(--wl-accent-lo) 100%);
  border-color: var(--wl-accent);
  color: var(--wl-accent-ink);
}
.btn-primary:hover,
.btn-primary:focus {
  background: linear-gradient(180deg, var(--wl-accent-hi) 0%, var(--wl-accent) 100%);
  border-color: var(--wl-accent-hi);
  box-shadow: var(--wl-glow);
}
.btn-primary:disabled {
  background: var(--wl-surface-2);
  border-color: var(--wl-border);
  color: var(--wl-text-3);
}

.btn-secondary,
.btn-outline-primary {
  background: transparent;
  border-color: var(--wl-border);
  color: var(--wl-text-2);
}
.btn-secondary:hover,
.btn-outline-primary:hover {
  background: var(--wl-surface-2);
  border-color: var(--wl-accent);
  color: var(--wl-text);
}

.btn-danger  { background: var(--wl-danger);  border-color: var(--wl-danger); }
.btn-success { background: var(--wl-success); border-color: var(--wl-success); }

/* ----------------------------------------------------- бейджи и статусы -- */

.badge-primary,
.bg-primary,
.text-primary { color: var(--wl-accent) !important; }

.bg-primary { background-color: var(--wl-accent) !important; color: var(--wl-accent-ink) !important; }

.badge {
  border-radius: 4px;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 0.32em 0.6em;
}

/* статусы проекта — словами, цвет только подкрепляет текст */
.wl-status {
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  font-size: 0.82rem;
  font-weight: 600;
}
.wl-status::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 8px currentColor;
}
.wl-status--running { color: var(--wl-success-hi); }
.wl-status--stopped { color: var(--wl-text-3); }
.wl-status--nofunds { color: var(--wl-danger-hi); }
.wl-status--pending { color: var(--wl-warning); }

/* ------------------------------------------------------------- прогресс -- */

.progress {
  background: var(--wl-surface-2);
  border-radius: 999px;
  height: 6px;
}
.progress-bar {
  background: linear-gradient(90deg, var(--wl-accent-lo), var(--wl-accent-hi));
}

/* ---------------------------------------------------------------- алерты -- */

.alert {
  background: var(--wl-surface-2);
  border: 1px solid var(--wl-border);
  border-left-width: 3px;
  border-radius: var(--wl-radius);
  color: var(--wl-text);
}
.alert-danger  { border-left-color: var(--wl-danger); }
.alert-success { border-left-color: var(--wl-success); }
.alert-warning { border-left-color: var(--wl-warning); }
.alert-info    { border-left-color: var(--wl-accent); }

/* --------------------------------------------------------------- пустое -- */

/* пустой экран — приглашение к действию, а не сообщение об отсутствии данных */
.wl-empty {
  padding: 3rem 1.5rem;
  text-align: center;
  color: var(--wl-text-2);
}
.wl-empty__title {
  color: var(--wl-text);
  font-weight: 600;
  margin-bottom: 0.4rem;
}

/* ------------------------------------------------------------- служебное -- */

/* время расчёта баланса — рядом с суммой, снимает вопрос «данные свежие?» */
.wl-asof {
  color: var(--wl-text-3);
  font-size: 0.75rem;
  font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

@media (max-width: 576px) {
  .card { border-radius: var(--wl-radius); }
  .table thead th { font-size: 0.72rem; }
}

/* ============================================================================
   Скин компонентов портируемых страниц кабинета (Tabler/BS4 + jasny + wl-модули).
   Только дополнение: палитра и правила выше не меняются.
   ============================================================================ */

/* ------------------------------------------------------------- заголовки -- */

.page-title,
.card-title,
.modal-title {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--wl-text);
}
.page-subtitle { color: var(--wl-text-2); }

/* ------------------------------------------------------- nav-tabs шапки -- */

.nav-tabs {
  border-bottom: 1px solid var(--wl-border);
}
.nav-tabs .nav-link {
  color: var(--wl-text-2);
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.82rem;
}
.nav-tabs .nav-link:hover {
  color: var(--wl-text);
  border-color: transparent;
  border-bottom-color: var(--wl-border);
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  color: var(--wl-text);
  background: transparent;
  border-color: transparent;
  border-bottom: 2px solid var(--wl-accent);
}

/* --------------------------------------------- offcanvas / jasny navmenu -- */

.navmenu,
.navmenu-default,
.navbar-offcanvas {
  background: var(--wl-surface);
  border-color: var(--wl-border);
  color: var(--wl-text);
}
.navmenu .navmenu-brand,
.navmenu-default .navmenu-brand {
  color: var(--wl-text);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.navmenu-nav > li > a,
.navmenu .list-group-item {
  background: transparent;
  border-color: var(--wl-border-soft);
  color: var(--wl-text-2);
}
.navmenu-nav > li > a:hover,
.navmenu-nav > li > a:focus,
.navmenu .list-group-item:hover,
.navmenu .list-group-item:focus {
  background: var(--wl-surface-2);
  color: var(--wl-text);
}
.navmenu-nav > .active > a,
.navmenu-nav > .active > a:hover,
.navmenu .list-group-item.active {
  background: var(--wl-surface-2);
  color: var(--wl-text);
  box-shadow: inset 2px 0 0 var(--wl-accent);
}
.navmenu.offcanvas {
  box-shadow: -12px 0 32px rgba(0, 0, 0, 0.45);
}

/* --------------------------------------- оверлеи расписаний (wl-schedules) -- */

/* важно: модульные <style> инжектируются ПОСЛЕ wl-theme.css → селекторы здесь строже
   (div.wl-ov / .wl-hm-ov .wl-hm-*), чтобы тёмный скин побеждал светлые дефолты модулей */
div.wl-ov { background: rgba(5, 7, 12, 0.72); }

.wl-ov .wl-panel {
  background: var(--wl-surface);
  border: 1px solid var(--wl-border);
  border-radius: var(--wl-radius-lg);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
  color: var(--wl-text);
}
.wl-ov .wl-panel-h,
.wl-ov .wl-panel-f { border-color: var(--wl-border-soft); }
.wl-ov .wl-panel-h > div > div:first-child {
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.wl-ov .wl-panel-h [style*="color:#6b7fa4"],
.wl-ov [style*="color:#6b7fa4"] { color: var(--wl-text-2) !important; }
.wl-ov .wl-x { color: var(--wl-text-3); }
.wl-ov .wl-x:hover { color: var(--wl-text); }

.wl-ov .wl-sum > div {
  background: var(--wl-surface-2);
  border: 1px solid var(--wl-border-soft);
}
.wl-ov .wl-sum .l { color: var(--wl-text-2); }
.wl-ov .wl-sum .v { color: var(--wl-text); }

.wl-ov .wl-help {
  background: var(--wl-surface-2);
  color: var(--wl-text-2);
}
.wl-ov .wl-help.warn {
  background: rgba(240, 160, 32, 0.10);
  color: var(--wl-warning);
}
.wl-ov .wl-help[style*="background:none"] { background: transparent !important; }

.wl-ov .wl-hours label { color: var(--wl-text-2); }
.wl-ov .wl-hours input {
  background: var(--wl-surface-2);
  border: 1px solid var(--wl-border);
  color: var(--wl-text);
}
.wl-ov .wl-hours input:focus {
  border-color: var(--wl-accent);
  box-shadow: var(--wl-glow-soft);
  outline: none;
}

.wl-ov .wl-grid {
  background: var(--wl-surface-2);
  border-color: var(--wl-border);
}
.wl-ov .wl-grid th,
.wl-ov .wl-grid td { border-color: var(--wl-border-soft); }
.wl-ov .wl-grid th {
  background: var(--wl-surface);
  color: var(--wl-text-3);
}
.wl-ov .wl-grid td { color: var(--wl-success-hi); }
.wl-ov .wl-grid td.on {
  background: rgba(30, 165, 91, 0.22);
  color: var(--wl-success-hi);
}
.wl-ov .wl-grid td.dh {
  background: var(--wl-surface);
  color: var(--wl-text-2);
}

/* ------------------------------------- выпадашка регионов (wl-rp-picker) -- */

.wl-rp-dd {
  background: var(--wl-surface) !important;
  border: 1px solid var(--wl-border) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5) !important;
}
.wl-rp-title {
  background: var(--wl-surface-2) !important;
  color: var(--wl-text-3) !important;
}
.wl-rp-item { color: var(--wl-text) !important; }
.wl-rp-item:hover { background: var(--wl-surface-2) !important; }
.wl-rp-muted,
.wl-rp-muted:hover {
  color: var(--wl-text-3) !important;
  background: transparent !important;
}

/* -------------------------------------- модалки «Инструкция»/«Поддержка» -- */

div.wl-hm-ov { background: rgba(5, 7, 12, 0.72); }
.wl-hm-ov .wl-hm-panel {
  background: var(--wl-surface);
  border: 1px solid var(--wl-border);
  border-radius: var(--wl-radius-lg);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
  color: var(--wl-text);
}
.wl-hm-ov .wl-hm-h,
.wl-hm-ov .wl-hm-f { border-color: var(--wl-border-soft); }
.wl-hm-ov .wl-hm-title { color: var(--wl-text); }
.wl-hm-ov .wl-hm-x { color: var(--wl-text-3); }
.wl-hm-ov .wl-hm-x:hover { color: var(--wl-text); }
.wl-hm-ov .wl-hm-b { color: var(--wl-text-2); }
.wl-hm-ov .wl-hm-b h6 { color: var(--wl-text); }
.wl-hm-ov .wl-hm-b b { color: var(--wl-text); }
.wl-hm-ov .wl-hm-contact {
  background: var(--wl-surface-2);
  border: 1px solid var(--wl-border);
  color: var(--wl-text);
}

/* --------------------------------------------------- чекбоксы и тумблеры -- */

.custom-control-label::before,
.custom-checkbox .custom-control-label::before {
  background: var(--wl-surface-2);
  border: 1px solid var(--wl-border);
}
.custom-control-input:checked ~ .custom-control-label::before {
  background: var(--wl-accent);
  border-color: var(--wl-accent);
}
.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: var(--wl-glow-soft);
}

.custom-switch-indicator {
  background: var(--wl-surface-2);
  border: 1px solid var(--wl-border);
}
.custom-switch-indicator::before { background: var(--wl-text-3); }
.custom-switch-input:checked ~ .custom-switch-indicator {
  background: var(--wl-accent);
  border-color: var(--wl-accent);
}
.custom-switch-input:checked ~ .custom-switch-indicator::before { background: var(--wl-accent-ink); }
.custom-switch-input:focus ~ .custom-switch-indicator { box-shadow: var(--wl-glow-soft); }
.custom-switch-description { color: var(--wl-text-2); }
.custom-switch-input:checked ~ .custom-switch-description { color: var(--wl-text); }

/* без нативной подсветки чекбоксов на тёмном фоне */
input[type="checkbox"],
input[type="radio"] { accent-color: var(--wl-accent); }

/* ------------------------------------------------------------ pagination -- */

.pagination .page-link {
  background: var(--wl-surface);
  border: 1px solid var(--wl-border);
  color: var(--wl-text-2);
}
.pagination .page-link:hover {
  background: var(--wl-surface-2);
  border-color: var(--wl-accent);
  color: var(--wl-text);
  box-shadow: none;
}
.pagination .page-item.active .page-link {
  background: var(--wl-accent);
  border-color: var(--wl-accent);
  color: var(--wl-accent-ink);
}
.pagination .page-item.disabled .page-link {
  background: var(--wl-surface);
  border-color: var(--wl-border-soft);
  color: var(--wl-text-3);
}

/* -------------------------------------------------------------- dropdown -- */

.dropdown-menu {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
}
.dropdown-item { color: var(--wl-text-2); }
.dropdown-item:hover,
.dropdown-item:focus {
  background: var(--wl-surface-2);
  color: var(--wl-text);
}
.dropdown-item.active {
  background: var(--wl-accent);
  color: var(--wl-accent-ink);
}
.dropdown-divider { border-color: var(--wl-border-soft); }
.dropdown-header {
  color: var(--wl-text-3);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ------------------------------------------------------- бейджи статусов -- */

.badge,
.tag {
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.badge-success { background: rgba(30, 165, 91, 0.16); color: var(--wl-success-hi); }
.badge-danger  { background: rgba(225, 29, 42, 0.16); color: var(--wl-danger-hi); }
.badge-warning { background: rgba(240, 160, 32, 0.16); color: var(--wl-warning); }
.badge-info    { background: rgba(46, 155, 255, 0.16); color: var(--wl-accent-hi); }
.badge-secondary,
.badge-default {
  background: var(--wl-surface-2);
  color: var(--wl-text-2);
}
.tag {
  background: var(--wl-surface-2);
  color: var(--wl-text-2);
}
.tag-red { background: rgba(225, 29, 42, 0.2); color: var(--wl-danger-hi); }

/* ------------------------------------------------- мелочи тёмного скина -- */

/* selectize/инпуты внутри шапки страницы и тулбаров */
.page-options .form-control,
.card-options .form-control { background: var(--wl-surface-2); }

/* текстовые утилиты шаблона, дающие «светлые» пятна */
.text-muted { color: var(--wl-text-3) !important; }
.bg-light { background: var(--wl-surface-2) !important; color: var(--wl-text) !important; }
.card .bg-light .card-body { color: var(--wl-text-2); }

/* подложка модалок BS4 плотнее — под тёмный фон */
.modal-backdrop.show { opacity: 0.7; }
.modal-header,
.modal-footer { border-color: var(--wl-border-soft); }
.modal-header .close {
  color: var(--wl-text-3);
  text-shadow: none;
  opacity: 1;
}
.modal-header .close:hover { color: var(--wl-text); }

/* --------------- статусы событий кликов (страница «Клики»: Визит/Клик/Найден) -- */

.tag-green { background: rgba(30, 165, 91, 0.18); color: var(--wl-success-hi); }
.tag-azure { background: rgba(46, 155, 255, 0.18); color: var(--wl-accent-hi); }
.tag-gray  { background: var(--wl-surface-2); color: var(--wl-text-2); }
.tag-addon { background: rgba(255, 255, 255, 0.06); color: var(--wl-text-2); }

/* ============================================================================
   Скин MPA-страниц кабинета (список проектов / клики / позиции).
   Только добавление в конец: палитра и правила выше не меняются.
   ============================================================================ */

/* --------------------------------------------------------- бренд в шапке -- */

.header-brand {
  display: inline-flex;
  align-items: baseline;
  gap: 0.55rem;
  text-decoration: none;
}
.wl-brand {
  font-weight: 800;
  font-size: 1.08rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--wl-text);
}
.header-brand:hover .wl-brand { color: var(--wl-accent-hi); }
.wl-brand-domain {
  font-size: 0.78rem;
  letter-spacing: 0.05em;
  color: var(--wl-text-3);
}

.header-toggler { color: var(--wl-text-2); }
.header-toggler:hover { color: var(--wl-text); }

/* --------------------------------- статы шапки: баланс/долг/цена клика -- */

.wl-hdr-stats { display: flex; align-items: center; gap: 20px; }
.wl-hdr-stat { text-align: right; line-height: 1.3; }
.wl-hdr-label {
  display: block;
  font-size: 0.66rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--wl-text-3);
}
.wl-hdr-value {
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  color: var(--wl-text);
}
.wl-hdr-value.wl-num--minus { color: var(--wl-danger-hi); }

/* ------------------------------------ selectgroup (вкладки-фильтры) ----- */

.selectgroup-button {
  border-color: var(--wl-border);
  color: var(--wl-text-2);
  background: transparent;
}
.selectgroup-input:checked + .selectgroup-button {
  border-color: var(--wl-accent);
  color: var(--wl-accent-hi);
  background: rgba(46, 155, 255, 0.14);
}
.selectgroup-input:focus + .selectgroup-button {
  box-shadow: var(--wl-glow-soft);
  color: var(--wl-text);
  z-index: 2;
}

/* ------------------- контурная «опасная» кнопка (Удалить в строках) ----- */

.btn-outline-danger {
  color: var(--wl-danger-hi);
  border-color: rgba(225, 29, 42, 0.45);
  background: transparent;
}
.btn-outline-danger:hover,
.btn-outline-danger:focus {
  background: var(--wl-danger);
  border-color: var(--wl-danger);
  color: #fff;
  box-shadow: none;
}
.btn-outline-danger.disabled,
.btn-outline-danger:disabled {
  color: var(--wl-text-3);
  border-color: var(--wl-border-soft);
}

/* ------------------- подпись под бейджем статуса (причина остановки) ---- */

.wl-stopreason {
  display: block;
  margin-top: 2px;
  font-size: 0.72rem;
  color: var(--wl-text-3);
  text-transform: none;
  letter-spacing: normal;
  white-space: nowrap;
}
.wl-stopreason--nofunds { color: var(--wl-danger-hi); }

/* -------------------- «выделенная» колонка таблицы (например, Создан) --- */

.table-active,
.table-active > th,
.table-active > td,
.table td.table-active { background: var(--wl-surface-2); }

/* ------------------------------------------------------------------ футер */

.footer {
  background: transparent;
  border-top: 1px solid var(--wl-border-soft);
  color: var(--wl-text-3);
}

/* --------------------------------------- шапка и каркас MPA-страниц кабинета -- */

/* нативные контролы (date-пикер, выпадающие списки, скроллбары) — тёмные */
:root { color-scheme: dark; }
input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(1) opacity(0.7); }

/* текстовый бренд «КАБИНЕТ mtrhit.ru» */
.header-brand,
.header-brand:hover,
.header-brand:focus {
  color: var(--wl-text);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  text-decoration: none;
}
.header-brand .wl-brand-domain {
  color: var(--wl-accent);
  margin-left: 0.45em;
  text-shadow: 0 0 12px rgba(46, 155, 255, 0.45);
}
.header-toggler { color: var(--wl-text-2); }
.header-toggler:hover,
.header-toggler:focus { color: var(--wl-text); }

/* инфо-кнопки шапки (баланс/долг/цена клика): не кликаются, но читаются как текст,
   без «пригашивания» от .disabled */
.btn.wl-hdr-info {
  pointer-events: none;
  opacity: 1;
  font-variant-numeric: tabular-nums;
}
.btn.wl-hdr-info.wl-hdr-debt { color: var(--wl-danger-hi); }

/* мобильная плашка баланса/цены клика: на телефоне блок шапки d-none d-md-flex
   скрыт, из-за чего клиенты не видели баланс и цену клика (жалобы в поддержку).
   Показываем компактную полосу только на < md; десктоп её не видит (d-md-none). */
.wl-mbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .35rem .6rem;
  padding: .5rem .9rem;
  background: var(--wl-surface-2);
  border-bottom: 1px solid var(--wl-border);
  font-size: .8125rem;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}
.wl-mbar__chip { color: var(--wl-text-2); white-space: nowrap; }
.wl-mbar__chip b { color: var(--wl-text); font-weight: 700; }
.wl-mbar__chip--debt b { color: var(--wl-danger-hi); }
.wl-mbar__sep { color: var(--wl-text-3); }
.wl-mbar .btn { margin-left: auto; padding: .2rem .8rem; font-size: .8125rem; }

/* кнопка закрытия оффканваса (крестик feather рисует dashboard.css) */
.navmenu .close {
  color: var(--wl-text-3);
  text-shadow: none;
  opacity: 1;
}
.navmenu .close:hover { color: var(--wl-text); }

/* футер шаблона — светлый по умолчанию, гасим */
.footer {
  background: transparent;
  border-top: 1px solid var(--wl-border-soft);
  color: var(--wl-text-3);
}

/* баннер режима impersonation (admin → кабинет клиента): палитра из темы, без инлайна */
#imp-banner {
  position: sticky;
  top: 0;
  z-index: 1080;
  background: var(--wl-warning);
  color: var(--wl-bg);
  padding: 6px 14px;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
}
#imp-banner a {
  color: var(--wl-accent-lo);
  text-decoration: underline;
  margin-left: 8px;
}
#imp-banner a:hover { color: var(--wl-bg); }

/* ============================================================
   Иконочный слой кабинета — нейтральный, self-hosted.
   Разметка: <i class="wl-ic wl-ic-<имя>"></i>
   Шрифт лежит в vendor/phosphor (woff2/ttf), лицензия рядом (LICENSE).
   Классы намеренно без привязки к имени набора — единый слой для всех
   страниц кабинета и админки.
   ============================================================ */
@font-face {
  font-family: "wlicons";
  src: url("./vendor/phosphor/Phosphor.woff2") format("woff2"),
       url("./vendor/phosphor/Phosphor.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
.wl-ic {
  font-family: "wlicons" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  display: inline-block;
  vertical-align: -0.125em; /* садим глиф на базовую линию текста, как это делал прежний webfont */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.wl-ic:before { display: inline-block; }

/* Иконка перед текстом в кнопках/вкладках/пунктах меню: тот же ритм, что был.
   Отступы задаются утилитами разметки (mr-1/mr-2), поэтому здесь их не трогаем. */
.btn > .wl-ic,
.nav-link > .wl-ic,
.input-group-text > .wl-ic,
.tag-addon > .wl-ic { vertical-align: -0.125em; }

/* Глифы (маппинг из открытого набора; коды скопированы из официального style.css).
   Навигация и «Поддержка» намеренно замаплены на ДРУГИЕ по форме глифы
   (сетка/курсор/линия/чат вместо глобуса/пульса/столбиков/гарнитуры):
   класс сохраняет историческое имя, форма — нет. Не «чинить» обратно. */
.wl-ic-globe:before        { content: "\e464"; } /* squares-four: сетка 2×2 */
.wl-ic-activity:before      { content: "\e7c8"; } /* cursor-click: курсор с кликом */
.wl-ic-bar-chart-2:before   { content: "\e156"; } /* chart-line-up: растущая линия */
.wl-ic-headphones:before    { content: "\e16c"; } /* chat-circle-dots: чат-пузырь */
.wl-ic-user:before          { content: "\e4c4"; } /* user-circle */
.wl-ic-edit-2:before        { content: "\e34c"; } /* note-pencil: карандаш в рамке */
.wl-ic-trash:before         { content: "\e4a8"; } /* trash-simple */
.wl-ic-play-circle:before   { content: "\e3d0"; } /* play: треугольник без круга */
.wl-ic-stop-circle:before   { content: "\e46c"; } /* stop: квадрат без круга */
.wl-ic-chevron-right:before { content: "\e122"; } /* caret-circle-right */
.wl-ic-chevron-left:before  { content: "\e120"; } /* caret-circle-left */
.wl-ic-x:before             { content: "\e4f8"; } /* x-circle */
.wl-ic-search:before        { content: "\e30c"; } /* лупа — единственная внятная форма поиска */
.wl-ic-plus:before          { content: "\e3d6"; } /* plus-circle */
.wl-ic-check:before         { content: "\e184"; } /* check-circle */
.wl-ic-archive:before       { content: "\e390"; } /* package: посылка вместо ящика */
.wl-ic-zap:before           { content: "\e3fe"; } /* rocket-launch: авто-бусты = ракета */
.wl-ic-refresh-cw:before    { content: "\e1ac"; } /* cloud-arrow-down: досинхронизация */
.wl-ic-mouse-pointer:before { content: "\ec90"; } /* hand-tap */
.wl-ic-loader:before        { content: "\eb44"; } /* circle-notch: дуга-спиннер */
.wl-ic-list:before          { content: "\e198"; } /* clipboard-text: импорт из буфера */
.wl-ic-link:before          { content: "\e2ea"; } /* link-simple-horizontal */
.wl-ic-fast-forward:before  { content: "\e2de"; } /* lightning: быстрый буст = молния */
.wl-ic-download:before      { content: "\eb22"; } /* file-xls: выгрузка в XLS */
.wl-ic-clock:before         { content: "\e108"; } /* calendar: расписание показов */
.wl-ic-arrow-left:before    { content: "\e024"; } /* arrow-bend-up-left: «назад» */

/* ============================================================================
   Секции админки владельца (admin.html): топ-навигация, дашборд, проекты.
   Только добавление в конец. Палитра — те же var(--wl-*); ничего выше не меняем.
   ============================================================================ */

/* --- топ-навигация переключением секций --- */
.wl-topnav { display: flex; gap: 4px; flex-wrap: wrap; }
.wl-topnav__btn {
  padding: 8px 14px;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--wl-radius);
  color: var(--wl-text-2);
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.wl-topnav__btn:hover { color: var(--wl-text); background: var(--wl-surface-2); }
.wl-topnav__btn.is-active {
  color: var(--wl-accent-hi);
  background: rgba(46, 155, 255, 0.14);
  border-color: var(--wl-border);
}
.wl-topnav__btn .wl-ic { font-size: 1rem; }

/* --- сегмент-переключатель (период дашборда / фильтр статуса) --- */
.wl-seg {
  display: inline-flex;
  border: 1px solid var(--wl-border);
  border-radius: var(--wl-radius);
  overflow: hidden;
}
.wl-seg button {
  padding: 6px 12px;
  font: inherit;
  font-size: 0.84rem;
  cursor: pointer;
  background: transparent;
  border: 0;
  border-right: 1px solid var(--wl-border);
  color: var(--wl-text-2);
}
.wl-seg button:last-child { border-right: 0; }
.wl-seg button:hover { color: var(--wl-text); background: var(--wl-surface-2); }
.wl-seg button.is-active { background: rgba(46, 155, 255, 0.16); color: var(--wl-accent-hi); }

/* --- финсводка Выручка/Закуп/Прибыль/Маржа --- */
.wl-fin {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}
.wl-fin__item {
  padding: 14px 16px;
  border: 1px solid var(--wl-border-soft);
  border-radius: var(--wl-radius-lg);
  background: var(--wl-surface-2);
}
.wl-fin__label {
  color: var(--wl-text-3);
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.wl-fin__value {
  font-size: 1.15rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-top: 2px;
}

/* --- чипы счётчиков проектов по статусам --- */
.wl-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.wl-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border: 1px solid var(--wl-border);
  border-radius: 999px;
  background: var(--wl-surface-2);
}
.wl-chip__label { color: var(--wl-text-2); font-size: 0.82rem; }
.wl-chip__val { font-weight: 700; font-variant-numeric: tabular-nums; }

/* --- простая пагинация таблиц --- */
.wl-pager { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.wl-pager__info { color: var(--wl-text-3); font-size: 0.84rem; font-variant-numeric: tabular-nums; }

/* --- спиннер загрузки секции --- */
.wl-spin { display: inline-block; animation: wl-rot 0.8s linear infinite; color: var(--wl-text-3); }
@keyframes wl-rot { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .wl-spin { animation: none; } }

/* --- поле поиска с иконкой --- */
.wl-search { position: relative; display: inline-flex; align-items: center; }
.wl-search .wl-ic-search { position: absolute; left: 10px; color: var(--wl-text-3); pointer-events: none; }
.wl-search input { padding-left: 32px; }

/* --- определения ключ-значение (карточка проекта админа) --- */
.wl-kv {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.wl-kv__item {
  padding: 12px 14px;
  border: 1px solid var(--wl-border-soft);
  border-radius: var(--wl-radius);
  background: var(--wl-surface-2);
}
.wl-kv__k {
  color: var(--wl-text-3);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.wl-kv__v { font-weight: 600; margin-top: 3px; word-break: break-word; }

/* ============================================================
   Логотип бренда (public/brand/): шапка кабинета, логин, админка.
   Только добавление в конец файла.
   ============================================================ */
.header-brand .wl-logo,
.wl-brand .wl-logo { height: 30px; display: block; }
.topbar .brand .wl-logo { height: 24px; display: block; }
.topbar .brand small { margin-top: 2px; }
.wl-login-brand .wl-logo-login { height: 48px; }

/* ============================================================================
   Кнопки действий карточки проекта на узких экранах (2026-08-17).
   Причина: правило одной строки с усечением (dashboard.css) оставляло
   text-overflow:ellipsis и при переносе на мобильных — подписи «Доба…»/«Импо…»
   были нечитаемы. Здесь на <=991.98px раскрываем подписи: 2 колонки, перенос
   текста, выровненная высота. Десктопное правило одной строки не трогаем.
   ============================================================================ */
@media (max-width: 991.98px) {
  .row:has(> .col-md-2 > [data-wl-sched]) > .col-md-2 {
    flex: 1 1 46%;
    max-width: none;
  }
  .row:has(> .col-md-2 > [data-wl-sched]) > .col-md-2 > .btn {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    height: 100%;
    line-height: 1.2;
    padding-top: .5rem;
    padding-bottom: .5rem;
  }
}

/* ===== header v2 (2026-09-08) =====
   Единая шапка кабинета (assets/wl-header.js), без гамбургера и offcanvas.
   Десктоп (>= 768px): [логотип] … [логин] [Тарифы] [Баланс | Долг | Клик | Пополнить] [Инструкция] [Поддержка] [Выход]
   Телефон (< 768px): строка 1 логотип + кнопки-иконки (подписи скрыты);
   строка 2 плашка .wl-mbar (логин · баланс · клик · Пополнить);
   строка 3 вкладки Проекты / Клики / Позиции всегда видимы (горизонтальный скролл).
   Только добавление в конец файла: правила выше не меняются, а перекрываются. */

/* глифы для новых кнопок шапки (коды из vendor/phosphor/style.css) */
.wl-ic-book-open:before { content: "\e0e6"; } /* book-open: инструкция */
.wl-ic-log-out:before   { content: "\e42a"; } /* sign-out: выход */

/* --- строка 1: логотип и правый ряд --- */
.header.wl-hdr { padding-top: .8rem; padding-bottom: .8rem; }
.wl-hdr__row { display: flex; align-items: center; gap: 12px; min-width: 0; }
.wl-hdr__row .header-brand { flex: 0 0 auto; margin-right: 0; }
.wl-hdr__right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
  min-width: 0;
}
.wl-hdr__account { align-items: center; gap: 8px; } /* display задают утилиты d-none d-md-flex */
.wl-hdr__actions { display: flex; align-items: center; gap: 8px; }
.wl-hdr__actions .btn { display: inline-flex; align-items: center; gap: .4rem; }
.wl-hdr__actions .btn .wl-ic { font-size: 1.05rem; }

/* чип логина: тёмный, как на макете (группа баланса остаётся светлой); длинные значения усекаются многоточием */
.btn.wl-hdr-login,
.btn.wl-hdr-login.disabled {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  max-width: 220px;
  background: transparent;
  border-color: var(--wl-border);
  color: var(--wl-text);
}
.btn.wl-hdr-login .wl-ic { color: var(--wl-text-2); }
.btn.wl-hdr-login > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.wl-mbar__chip--login b {
  display: inline-block;
  max-width: 38vw;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
}
.wl-mbar__link { color: var(--wl-accent-hi); white-space: nowrap; }

/* «Тарифы» скрыта атрибутом hidden, пока админ не задал сетку */
#hdr-tariffs[hidden],
#m-tariffs[hidden] { display: none !important; }

/* --- строка 3: вкладки всегда видимы, на узких экранах прокручиваются по горизонтали --- */
.wl-hdr-nav {
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.wl-hdr-nav::-webkit-scrollbar { display: none; }
.wl-hdr-nav .nav-item { flex: 0 0 auto; }
.wl-hdr-nav .nav-link { white-space: nowrap; }

/* планшет: подписи Инструкция/Поддержка/Выход прячем, остаются иконки (title подсказывает) */
@media (max-width: 991.98px) {
  .wl-hdr__actions .btn > span { display: none; }
  .wl-hdr__actions .btn { padding-left: .6rem; padding-right: .6rem; }
  .btn.wl-hdr-login { max-width: 160px; }
}
/* телефон */
@media (max-width: 767.98px) {
  .header.wl-hdr { padding-top: .6rem; padding-bottom: .6rem; }
  .wl-hdr__row { gap: 8px; }
  .wl-hdr__right { flex-wrap: nowrap; }
  .wl-hdr__actions { gap: 6px; }
  .wl-hdr-nav .nav-link { padding: .6rem .75rem; font-size: .78rem; }
}

/* --- контурные кнопки страницы проекта (Расписание показов / Авто-бусты / Быстрый буст)
       в палитре темы вместо зелёного/бирюзового/жёлтого шаблона --- */
.btn-outline-success {
  color: var(--wl-success-hi);
  border-color: var(--wl-success);
  background: transparent;
}
.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success:not(:disabled):not(.disabled):active,
.btn-outline-success:not(:disabled):not(.disabled).active {
  color: var(--wl-accent-ink);
  background: var(--wl-success);
  border-color: var(--wl-success);
  box-shadow: none;
}
.btn-outline-success.disabled,
.btn-outline-success:disabled {
  color: var(--wl-text-3);
  border-color: var(--wl-border-soft);
  background: transparent;
}

.btn-outline-info {
  color: var(--wl-accent-hi);
  border-color: var(--wl-accent);
  background: transparent;
}
.btn-outline-info:hover,
.btn-outline-info:focus,
.btn-outline-info:not(:disabled):not(.disabled):active,
.btn-outline-info:not(:disabled):not(.disabled).active {
  color: var(--wl-accent-ink);
  background: var(--wl-accent);
  border-color: var(--wl-accent);
  box-shadow: none;
}
.btn-outline-info.disabled,
.btn-outline-info:disabled {
  color: var(--wl-text-3);
  border-color: var(--wl-border-soft);
  background: transparent;
}

.btn-outline-warning {
  color: var(--wl-warning);
  border-color: var(--wl-warning);
  background: transparent;
}
.btn-outline-warning:hover,
.btn-outline-warning:focus,
.btn-outline-warning:not(:disabled):not(.disabled):active,
.btn-outline-warning:not(:disabled):not(.disabled).active {
  color: var(--wl-bg);
  background: var(--wl-warning);
  border-color: var(--wl-warning);
  box-shadow: none;
}
.btn-outline-warning.disabled,
.btn-outline-warning:disabled {
  color: var(--wl-text-3);
  border-color: var(--wl-border-soft);
  background: transparent;
}
