/* ============================================================
   CRM-UI — единый слой стилей для всех ролей (админ / менеджер /
   исполнитель). Подключается ПОСЛЕДНИМ в обоих layout'ах и приводит
   старые bootstrap-компоненты к одному современному виду.
   Создано 2026-06-12. Разметка шаблонов не меняется.
   ============================================================ */

:root {
    --ui-bg:            #f4f6f9;
    --ui-surface:       #ffffff;
    --ui-surface-2:     #f9fafb;
    --ui-border:        #e5e7eb;
    --ui-border-strong: #d1d5db;
    --ui-text:          #1f2937;
    --ui-text-muted:    #6b7280;
    --ui-primary:       #2563eb;
    --ui-primary-hover: #1d4ed8;
    --ui-success:       #059669;
    --ui-success-hover: #047857;
    --ui-danger:        #dc2626;
    --ui-danger-hover:  #b91c1c;
    --ui-warning:       #d97706;
    --ui-info:          #0284c7;
    --ui-header:        #1e2535;
    --ui-radius:        8px;
    --ui-radius-sm:     6px;
    --ui-radius-lg:     10px;
    --ui-shadow:        0 1px 2px rgba(0,0,0,.05);
    --ui-shadow-md:     0 4px 12px rgba(0,0,0,.08);
}

/* ---------- База ---------- */
body {
    background: var(--ui-bg) !important;
    color: var(--ui-text);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    -webkit-font-smoothing: antialiased;
}
a { color: var(--ui-primary); }
a:hover, a:focus { color: var(--ui-primary-hover); }
h1, h2, h3, h4, h5 { color: var(--ui-text); }
.page-title, .header-title { color: var(--ui-text); font-weight: 600; }
.text-muted { color: var(--ui-text-muted) !important; }

/* ---------- Хедер: воркерский топбар в цвет админского ---------- */
#topnav, .topbar, .topbar .topbar-left, .navbar-custom {
    background: var(--ui-header) !important;
    border: none !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.topbar .logo, .topbar .logo:hover, .logo span { color: #fff !important; }
.navbar-custom .nav > li > a, .topbar .nav > li > a { color: rgba(255,255,255,.8) !important; }
.navbar-custom .nav > li > a:hover, .topbar .nav > li > a:hover { color: #fff !important; background: rgba(255,255,255,.08) !important; }

/* ---------- Кнопки (bootstrap) ---------- */
.btn {
    border-radius: var(--ui-radius-sm);
    font-weight: 500;
    box-shadow: none;
    transition: background .12s, border-color .12s, color .12s;
}
.btn:focus, .btn:active:focus { outline: none; box-shadow: 0 0 0 3px rgba(37,99,235,.18); }
.btn-default, .btn-secondary, .btn-white {
    background: var(--ui-surface);
    border: 1px solid var(--ui-border-strong);
    color: var(--ui-text);
}
.btn-default:hover, .btn-default:focus, .btn-default:active,
.btn-secondary:hover, .btn-white:hover {
    background: var(--ui-surface-2);
    border-color: var(--ui-text-muted);
    color: var(--ui-text);
}
.btn-primary, .btn-custom, .btn-info {
    background: var(--ui-primary);
    border-color: var(--ui-primary);
    color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary:active:hover,
.btn-custom:hover, .btn-info:hover, .btn-info:focus {
    background: var(--ui-primary-hover);
    border-color: var(--ui-primary-hover);
    color: #fff;
}
.btn-success { background: var(--ui-success); border-color: var(--ui-success); }
.btn-success:hover, .btn-success:focus, .btn-success:active { background: var(--ui-success-hover); border-color: var(--ui-success-hover); }
.btn-danger { background: var(--ui-danger); border-color: var(--ui-danger); }
.btn-danger:hover, .btn-danger:focus, .btn-danger:active { background: var(--ui-danger-hover); border-color: var(--ui-danger-hover); }
.btn-warning { background: var(--ui-warning); border-color: var(--ui-warning); color: #fff; }
.btn-warning:hover { background: #b45309; border-color: #b45309; color: #fff; }
.btn[disabled], .btn.disabled { opacity: .55; }

/* ---------- Формы ---------- */
.form-control, select.form-control, textarea.form-control,
.dataTables_filter input, .dataTables_length select {
    border: 1px solid var(--ui-border-strong);
    border-radius: var(--ui-radius-sm);
    color: var(--ui-text);
    box-shadow: none;
    background: var(--ui-surface);
}
.form-control:focus, .dataTables_filter input:focus {
    border-color: var(--ui-primary);
    box-shadow: 0 0 0 3px rgba(37,99,235,.15);
}
label { color: var(--ui-text); font-weight: 500; }
.input-group-addon { background: var(--ui-surface-2); border-color: var(--ui-border-strong); color: var(--ui-text-muted); border-radius: var(--ui-radius-sm); }
.checkbox label, .radio label { font-weight: 400; }

/* select2 под общий вид */
.select2-container .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border: 1px solid var(--ui-border-strong) !important;
    border-radius: var(--ui-radius-sm) !important;
}
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--ui-primary) !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--ui-primary); }

/* ---------- Панели / карточки ---------- */
.panel, .card-box, .portlet {
    background: var(--ui-surface);
    border: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-lg);
    box-shadow: var(--ui-shadow);
}
.panel-default > .panel-heading, .panel-heading {
    background: var(--ui-surface);
    border-bottom: 1px solid var(--ui-border);
    border-radius: var(--ui-radius-lg) var(--ui-radius-lg) 0 0;
    color: var(--ui-text);
    font-weight: 600;
}
.panel-body { border-radius: 0 0 var(--ui-radius-lg) var(--ui-radius-lg); }
.well { background: var(--ui-surface-2); border: 1px solid var(--ui-border); border-radius: var(--ui-radius); box-shadow: none; }

/* ---------- Таблицы ---------- */
.table { color: var(--ui-text); }
.table > thead > tr > th {
    background: var(--ui-surface-2);
    color: var(--ui-text-muted);
    font-weight: 500;
    border-bottom: 1px solid var(--ui-border) !important;
    border-top: none;
    white-space: nowrap;
}
.table > tbody > tr > td { border-top: 1px solid #f1f5f9; vertical-align: middle; }
.table-hover > tbody > tr:hover { background: #f8fafc; }
.table-bordered, .table-bordered > thead > tr > th, .table-bordered > tbody > tr > td { border-color: var(--ui-border); }
.table-striped > tbody > tr:nth-of-type(odd) { background: var(--ui-surface-2); }

/* DataTables обвязка */
.dataTables_wrapper .dataTables_info { color: var(--ui-text-muted); }
.dataTables_wrapper .dataTables_paginate .paginate_button {
    border-radius: var(--ui-radius-sm) !important;
    border: 1px solid transparent !important;
    background: transparent !important;
    color: var(--ui-text) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--ui-surface-2) !important;
    border-color: var(--ui-border-strong) !important;
    color: var(--ui-text) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--ui-primary) !important;
    border-color: var(--ui-primary) !important;
    color: #fff !important;
}

/* ---------- Пагинация bootstrap ---------- */
.pagination > li > a, .pagination > li > span {
    color: var(--ui-text);
    border-color: var(--ui-border);
    margin: 0 2px;
    border-radius: var(--ui-radius-sm) !important;
}
.pagination > li > a:hover { background: var(--ui-surface-2); color: var(--ui-text); }
.pagination > .active > a, .pagination > .active > a:hover, .pagination > .active > span {
    background: var(--ui-primary);
    border-color: var(--ui-primary);
}

/* ---------- Бейджи / лейблы (мягкая палитра) ---------- */
.label, .badge { border-radius: var(--ui-radius-sm); font-weight: 600; padding: .25em .6em; }
.label-default, .badge-default { background: #eef2f7; color: #374151; }
.label-primary, .badge-primary { background: #dbeafe; color: #1e40af; }
.label-success, .badge-success { background: #d1fae5; color: #065f46; }
.label-danger,  .badge-danger  { background: #fee2e2; color: #991b1b; }
.label-warning, .badge-warning { background: #fef3c7; color: #92400e; }
.label-info,    .badge-info    { background: #e0f2fe; color: #075985; }

/* ---------- Алерты ---------- */
.alert { border-radius: var(--ui-radius); border-width: 1px; }
.alert-success { background: #f0fdf4; border-color: #bbf7d0; color: #166534; }
.alert-danger  { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.alert-warning { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.alert-info    { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }

/* ---------- Вкладки ---------- */
.nav-tabs { border-bottom: 1px solid var(--ui-border); }
.nav-tabs > li > a { color: var(--ui-text-muted); border: none; border-bottom: 2px solid transparent; border-radius: 0; }
.nav-tabs > li > a:hover { background: transparent; color: var(--ui-text); border-bottom-color: var(--ui-border-strong); }
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    color: var(--ui-primary);
    border: none;
    border-bottom: 2px solid var(--ui-primary);
    background: transparent;
}

/* ---------- Модалки ---------- */
.modal-content { border-radius: 12px; border: 1px solid var(--ui-border); box-shadow: var(--ui-shadow-md); }
.modal-header { border-bottom: 1px solid var(--ui-border); }
.modal-footer { border-top: 1px solid var(--ui-border); }

/* ---------- Дропдауны ---------- */
.dropdown-menu { border: 1px solid var(--ui-border); border-radius: var(--ui-radius); box-shadow: var(--ui-shadow-md); }
.dropdown-menu > li > a { color: var(--ui-text); }
.dropdown-menu > li > a:hover { background: var(--ui-surface-2); color: var(--ui-text); }

/* ---------- Тонкие скроллбары ---------- */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; border: 2px solid var(--ui-bg); }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
::-webkit-scrollbar-track { background: transparent; }

/* ============================================================
   ЭТАЛОН «Клиенты» (выбран 2026-06-12): единые шапки страниц
   и KPI-карточки по всему интерфейсу. Значения взяты из
   clients-redesign.css — страница «Клиенты» остаётся как есть,
   остальные подтягиваются к ней.
   ============================================================ */

/* --- Заголовки страниц: 22px / medium / тёмный, без капса --- */
h1, h2,
h4.page-title, .page-title,
.db-title, .crm-as-title, .ssp-head__title {
    font-size: 22px !important;
    font-weight: 500 !important;
    color: var(--ui-text) !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}
h1, h2 { margin-top: 0; }

/* --- Подпись под заголовком: 13px, приглушённая --- */
.crm-c-title-sub, .page-sub, .db-sub,
.page-title + p, h1 + span, h1 + .sub, h2 + p {
    font-size: 13px !important;
    color: var(--ui-text-muted) !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* --- KPI-карточки: лейбл 12px серый без капса, значение 22px/medium ---
   Покрывает: Заявки (.crm-widget__*), Должники (.db-kpi-*).
   Цветовые модификаторы значений (red/blue/green/amber) сохраняются. */
.crm-widget__label, .db-kpi-label {
    font-size: 12px !important;
    color: var(--ui-text-muted) !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}
.crm-widget__val, .db-kpi-val {
    font-size: 22px !important;
    font-weight: 500 !important;
    line-height: 1.15 !important;
    font-variant-numeric: tabular-nums;
}
/* значения без цветового модификатора — тёмные, а не блеклые */
.crm-widget__val { color: var(--ui-text); }
.crm-widget__val-sub { font-size: 11px !important; color: var(--ui-text-muted) !important; }

/* ============================================================
   ver=3 (2026-06-12): финальная унификация под эталон «Клиенты»
   ============================================================ */

/* --- 1. KPI-карточки: оставшиеся страницы ---
   managers + statistics (.stat-*), coldbase (.cb-funnel-*),
   журнал ИИ-рассылок (.q-an-*), закрепление дисциплин (.ssp-widget__*) */
.stat-label, .cb-funnel-label, .q-an-label, .ssp-widget__label {
    font-size: 12px !important;
    color: var(--ui-text-muted) !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}
.stat-value, .cb-funnel-value, .q-an-value, .ssp-widget__val {
    font-size: 22px !important;
    font-weight: 500 !important;
    line-height: 1.15 !important;
    font-variant-numeric: tabular-nums;
}

/* --- 2. Шапки таблиц: единые по всему интерфейсу, без капса --- */
.table thead th, table thead th, .crm-table th {
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--ui-text-muted) !important;
}

/* --- 3. Пагинация: единый вид на всех страницах ---
   statement (.crm-pager), debtors (.crm-pagination),
   clients (.crm-c-pagination), coldbase (.cb-page-link),
   dispatch и пр. bootstrap (.pagination) */
.crm-pager a, .crm-pager button,
.crm-pagination a, .crm-pagination button,
.crm-c-pagination a, .crm-c-pagination button,
.cb-page-link,
.pagination > li > a, .pagination > li > span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 32px;
    height: 32px;
    padding: 0 10px !important;
    margin: 0 2px;
    border: 1px solid var(--ui-border-strong) !important;
    border-radius: 6px !important;
    background: #fff !important;
    color: #4b5563 !important;
    font-size: 13px !important;
    line-height: 1 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    float: none !important;
}
.crm-pager a:hover, .crm-pager button:hover,
.crm-pagination a:hover, .crm-pagination button:hover,
.crm-c-pagination a:hover, .crm-c-pagination button:hover,
.cb-page-link:hover,
.pagination > li > a:hover {
    background: #f3f4f6 !important;
    color: var(--ui-text) !important;
}
.crm-pager .active, .crm-pager [class*="--active"], .crm-pager a.active,
.crm-pagination .active, .crm-pagination a.active,
.crm-c-pagination .active, .crm-c-pagination a.active,
.cb-page-link.active,
.pagination > .active > a, .pagination > .active > span,
.pagination > li > a.active {
    background: var(--ui-primary) !important;
    border-color: var(--ui-primary) !important;
    color: #fff !important;
}
.pagination > .disabled > a, .pagination > .disabled > span,
.crm-pager .disabled, .crm-pagination .disabled { opacity: .5; }

/* --- 4. Кнопки во всю ширину (настройки, парсер) — компактные --- */
.btn-block {
    width: auto !important;
    display: inline-block !important;
}

/* --- 5. Работники: селекты ВУЗов/предметов не на весь экран --- */
.staff-page .select2-container { max-width: 420px !important; }

/* --- 6. Зарплата исполнителя: на всю ширину, как остальные страницы --- */
.crm-wk-salary-wrap { max-width: none !important; margin: 0 !important; }

/* ============================================================
   ver=4 (2026-06-12, hotfix18): контраст текста, общий навбар
   для воркерского layout, точечные фиксы по скринам
   ============================================================ */

/* --- 1. Глобально: вторичный текст темнее (был #6b7280 → стал #4b5563).
   Поднимает читабельность лейблов KPI, шапок таблиц, .text-muted везде. --- */
:root { --ui-text-muted: #4b5563; }

/* Основной текст ячеек таблиц — всегда тёмный */
.table > tbody > tr > td { color: var(--ui-text); }

/* --- 2. /statement/: контраст локальной палитры страницы.
   FIX 2026-06-12: страница объявляет --crm-text-2/3 на :root в своём
   <style>; переопределяем на обёртке .crm-page — element-scope
   побеждает :root для всех потомков. --- */
.crm-page { --crm-text-2: #4b5563; --crm-text-3: #6b7280; }
.crm-page .crm-table td { color: #1f2937; }
.crm-page .crm-disc-name { color: #1f2937; }

/* FIX 2026-06-12: tr.app-blacklist имел opacity:.7 — выцветала ВСЯ строка
   (а в выдаче таких строк большинство). Оставляем серый фон как маркер ЧС,
   но текст больше не глушим. */
.crm-page .crm-table tbody tr.app-blacklist { opacity: 1; background: #f3f4f6 !important; }
.crm-page .crm-table tbody tr.app-blacklist td { color: #374151; }

/* --- 3. /coldbase/: вторичные строки (группа, форма, институт) читабельнее --- */
.cb-small { color: #6b7280 !important; }
.cb-when-cold { color: #6b7280 !important; }

/* --- 4. Общий навбар .crm-nav — теперь и для воркерского layout.
   Источник истины разметки — main.twig (инлайн-стили там дублируются,
   это ок: значения идентичны). Здесь копия, чтобы worker/include/user.twig
   мог использовать ту же разметку без своего <style>. --- */
#topnav { min-height: 46px !important; }
.crm-nav { display: flex; align-items: center; justify-content: space-between; padding: 0 16px; height: 46px; }
.crm-nav__left { display: flex; align-items: center; gap: 4px; }
.crm-nav__logo { font-size: 14px; font-weight: 600; color: #fff; letter-spacing: .05em; text-decoration: none; padding: 0 8px; }
.crm-nav__logo:hover, .crm-nav__logo:focus { color: #fff; }
.crm-nav__role { font-size: 11px; color: #94a3b8; background: rgba(255,255,255,.08); padding: 2px 9px; border-radius: 99px; margin-right: 8px; }
.crm-nav__user { font-size: 12px; color: #cbd5e1; margin-right: 10px; white-space: nowrap; }
.crm-nav__items { display: flex; gap: 2px; }
.crm-nav__item { position: relative; width: 34px; height: 34px; border-radius: 6px; display: flex; align-items: center; justify-content: center; color: #94a3b8; font-size: 16px; text-decoration: none; cursor: pointer; transition: background .15s, color .15s; }
.crm-nav__item:hover { background: rgba(255,255,255,.12); color: #fff; }
.crm-nav__item.active { background: rgba(255,255,255,.15); color: #fff; }
.crm-nav__item .crm-nav__tip { display: none; position: absolute; top: 38px; left: 50%; transform: translateX(-50%); background: #111827; color: #fff; font-size: 11px; padding: 3px 8px; border-radius: 4px; white-space: nowrap; z-index: 999; border: 1px solid rgba(255,255,255,.1); pointer-events: none; }
.crm-nav__item:hover .crm-nav__tip { display: block; }
.crm-nav__right { display: flex; align-items: center; gap: 10px; }
.crm-nav__notif { position: relative; color: #94a3b8; font-size: 18px; text-decoration: none; display: flex; align-items: center; }
.crm-nav__notif:hover { color: #fff; }
.crm-nav__notif-count { position: absolute; top: -4px; right: -6px; background: #ef4444; color: #fff; font-size: 10px; font-weight: 600; min-width: 16px; height: 16px; border-radius: 99px; display: flex; align-items: center; justify-content: center; padding: 0 3px; }
.crm-nav__notif-dot { position: absolute; top: -2px; right: -3px; width: 9px; height: 9px; border-radius: 50%; background: #ef4444; border: 2px solid #1e2535; box-sizing: content-box; }
.crm-nav__logout { font-size: 12px; color: #94a3b8; text-decoration: none; padding: 4px 10px; border-radius: 4px; }
.crm-nav__logout:hover { color: #fff; background: rgba(255,255,255,.08); }

/* Текстовый глиф вместо иконочного шрифта (например ❄︎ у «Холодной базы» —
   FIX 2026-06-12: глифа zmdi-snowflake нет в icons.css, иконка была пустой) */
.crm-nav__glyph { font-style: normal; font-size: 15px; line-height: 1; }

/* Точка «есть новые уведомления» (.noti-dot, добавляет extra.js) — на колокольчике.
   FIX 2026-06-12: в старой теме точка позиционировалась от <li>, в новом баре
   садится на саму ссылку .crm-nav__notif (position:relative). Pulse-анимация старой
   темы не нужна. */
.crm-nav__notif .noti-dot { position: absolute; top: -3px; right: -4px; pointer-events: none; }
.crm-nav__notif .noti-dot .dot { display: block; width: 9px; height: 9px; border-radius: 50%; background: #ef4444; border: 2px solid #1e2535; box-sizing: content-box; }
.crm-nav__notif .noti-dot .pulse { display: none; }