/* ==========================================================================
   Tabulator Grozny Analytics — скины таблиц «Аэро»
   Полностью на токенах темы (--ms-*): в тёмной схеме (body.ms-dark-mode)
   значения токенов переопределяются, поэтому светлые скины адаптируются
   автоматически; отдельный .tabulator-ga-dark оставлен для форс-режима из
   theme.js. Заголовок — в стиле KPI-подписи «Аэро» (11px, uppercase, muted).
   ========================================================================== */

/* Общая база для всех скинов */
.tabulator[class*="tabulator-ga-"] {
    border-radius: var(--ms-radius-card, 14px);
    overflow: hidden;
}

.tabulator[class*="tabulator-ga-"] .tabulator-header {
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 0.04em;
    font-weight: 600;
}

/* 1. GLASS (дефолт «Аэро») — чистая поверхность */
.tabulator-ga-glass.tabulator {
    background: var(--ms-surface) !important;
    border: 1px solid var(--ms-border) !important;
}

.tabulator-ga-glass .tabulator-header {
    background: var(--ms-surface-2) !important;
    border-bottom: 1px solid var(--ms-border) !important;
    color: var(--ms-text-muted) !important;
}

.tabulator-ga-glass .tabulator-col {
    background: transparent !important;
}

.tabulator-ga-glass .tabulator-row {
    background: transparent !important;
    border-bottom: 1px solid var(--ms-border-soft) !important;
    color: var(--ms-text-main);
}

.tabulator-ga-glass .tabulator-row:hover {
    background: var(--ms-surface-2) !important;
}

.tabulator-ga-glass .tabulator-row.tabulator-selected {
    background: var(--ms-primary-soft) !important;
    color: var(--ms-primary);
}

/* 2. MODERN CLEAN */
.tabulator-ga-modern.tabulator {
    border: 1px solid var(--ms-border) !important;
    background: var(--ms-surface) !important;
}

.tabulator-ga-modern .tabulator-header {
    background: var(--ms-surface-2) !important;
    border-bottom: 1px solid var(--ms-border) !important;
    color: var(--ms-text-muted) !important;
}

.tabulator-ga-modern .tabulator-row {
    color: var(--ms-text-main);
}

.tabulator-ga-modern .tabulator-row:nth-child(even) {
    background: var(--ms-surface-2);
}

.tabulator-ga-modern .tabulator-row:hover {
    background: var(--ms-surface-2) !important;
}

/* 3. BUSINESS / CORPORATE — тёмная шапка на инвертированном тексте */
.tabulator-ga-business.tabulator {
    border: 1px solid var(--ms-border) !important;
    background: var(--ms-surface) !important;
}

.tabulator-ga-business .tabulator-header {
    background: var(--ms-text-main) !important;
    color: var(--ms-surface) !important;
    border-bottom: none !important;
}

.tabulator-ga-business .tabulator-row { color: var(--ms-text-main); }
.tabulator-ga-business .tabulator-row-odd { background: var(--ms-surface) !important; }
.tabulator-ga-business .tabulator-row-even { background: var(--ms-surface-2) !important; }
.tabulator-ga-business .tabulator-row:hover { background: var(--ms-surface-2) !important; }

/* 4. DARK ANALYTICS — форс-режим из theme.js (токены уже в тёмных значениях) */
.tabulator-ga-dark.tabulator {
    background: var(--ms-surface) !important;
    color: var(--ms-text-main) !important;
    border: 1px solid var(--ms-border) !important;
}

.tabulator-ga-dark .tabulator-header {
    background: var(--ms-bg) !important;
    color: var(--ms-text-main) !important;
    border-bottom: 1px solid var(--ms-border) !important;
}

.tabulator-ga-dark .tabulator-col { background: transparent !important; }

.tabulator-ga-dark .tabulator-row {
    background: var(--ms-surface) !important;
    color: var(--ms-text-main);
    border-bottom: 1px solid var(--ms-border-soft) !important;
}

.tabulator-ga-dark .tabulator-row:hover {
    background: var(--ms-surface-2) !important;
}

.tabulator-ga-dark .tabulator-row.tabulator-selected {
    background: var(--ms-primary-soft) !important;
    color: var(--ms-primary);
}

/* Пагинация — единая для всех скинов */
.tabulator-footer {
    background: transparent !important;
    padding: 10px 15px !important;
}

.tabulator-page {
    border-radius: var(--ms-radius-ctl-sm, 9px) !important;
    border: 1px solid var(--ms-border) !important;
    color: var(--ms-text-muted) !important;
    transition: 0.2s;
}

.tabulator-page:hover {
    background: var(--ms-surface-2) !important;
}

.tabulator-page.active {
    background: var(--ms-primary-gradient) !important;
    color: var(--ms-btn-text) !important;
    border: none !important;
}

/* ==========================================================================
   Выпадающие фильтры в шапке таблиц (headerFilter: 'list').
   Попап Tabulator рендерится в <body>, вне контейнера таблицы, поэтому
   красится здесь и только токенами — в тёмной схеме подхватывается сам.
   ========================================================================== */

.tabulator-popup-container,
.tabulator-edit-list {
    background: var(--ms-surface) !important;
    border: 1px solid var(--ms-border) !important;
    border-radius: var(--ms-radius-ctl, 10px);
    box-shadow: var(--ms-shadow-md, 0 8px 24px rgba(0, 0, 0, .18));
    color: var(--ms-text-main);
}

.tabulator-edit-list .tabulator-edit-list-item {
    color: var(--ms-text-main) !important;
    padding: 6px 10px;
    border-radius: var(--ms-radius-ctl-sm, 8px);
}

.tabulator-edit-list .tabulator-edit-list-item:hover,
.tabulator-edit-list .tabulator-edit-list-item.focused {
    background: var(--ms-surface-2) !important;
    color: var(--ms-text-main) !important;
}

.tabulator-edit-list .tabulator-edit-list-item.active {
    background: var(--ms-primary-soft) !important;
    color: var(--ms-primary) !important;
}

/* Поле фильтра в шапке — под контролы «Аэро» */
.tabulator .tabulator-header-filter input {
    background: var(--ms-surface) !important;
    color: var(--ms-text-main) !important;
    border: 1px solid var(--ms-border) !important;
    border-radius: var(--ms-radius-ctl-sm, 8px);
}

.tabulator .tabulator-header-filter input:focus {
    border-color: var(--ms-primary) !important;
    outline: none;
}
