/* ===== DataTables Buttons + SearchBuilder — Dark (Neutral / shadcn-like) ===== */
:root {
    /* Prefer aligning with admin_panel/statics/css/custom/theme.css */
    --dt-bg: var(--uc-bg-1, #0f172a); /* surface */
    --dt-bg-2: var(--uc-bg-2, #111c33); /* surface alt */
    --dt-hover: rgba(148, 163, 184, 0.08); /* hover */
    --dt-border: var(--uc-border, rgba(148, 163, 184, 0.18)); /* border */
    --dt-text: var(--uc-text, #e5e7eb); /* text */
    --dt-muted: var(--uc-text-muted, #94a3b8); /* muted */
    --dt-accent: var(--uc-accent, #3b82f6); /* focus/active */
    --dt-accent-rgb: var(--uc-accent-rgb, 59, 130, 246);
    --dt-shadow: 0 10px 30px rgba(0, 0, 0, 0.55);
}

/* Кнопки в панели */
.dt-buttons .dt-button,
.dt-buttons .btn.dt-button {
    /* если используешь bootstrap-стили */
    background: var(--dt-bg);
    color: var(--dt-text);
    border: 1px solid var(--dt-border);
    border-radius: 12px;
    padding: 8px 12px;
    line-height: 1.2;
}
.dt-buttons .dt-button:hover,
.dt-buttons .btn.dt-button:hover {
    background: var(--dt-hover);
    border-color: var(--dt-border);
    color: var(--dt-text);
}
.dt-buttons .dt-button:focus,
.dt-buttons .btn.dt-button:focus,
.dt-buttons .dt-button:active {
    outline: 0;
    border-color: var(--dt-accent);
    box-shadow: 0 0 0 3px rgba(var(--dt-accent-rgb), 0.25);
}

/* Стрелочка у dropdown (оба варианта) */
.dt-button .dt-down-arrow {
    border-top-color: var(--dt-muted);
}
.dt-buttons .dt-button.dropdown-toggle::after {
    border-top-color: var(--dt-muted);
}

/* Коллекции (Export/Visibility меню) */
.dt-button-collection,
.dt-button-collection .dropdown-menu {
    /* bootstrap вариант */
    background: var(--dt-bg-2);
    border: 1px solid var(--dt-border);
    border-radius: 12px;
    box-shadow: var(--dt-shadow);
    padding: 6px;
}
.dt-button-collection .dt-button,
.dt-button-collection .dropdown-item {
    background: transparent;
    color: var(--dt-text);
    border: 0;
    border-radius: 8px;
    padding: 8px 10px;
}
.dt-button-collection .dt-button:hover,
.dt-button-collection .dropdown-item:hover {
    background: var(--dt-hover);
    color: var(--dt-text);
}

/* SearchBuilder блок */
div.dtsb-searchBuilder {
    background: var(--dt-bg-2);
    border: 1px solid var(--dt-border);
    border-radius: 12px;
    color: var(--dt-text);
    box-shadow: var(--dt-shadow);
}
div.dtsb-searchBuilder .dtsb-title {
    color: var(--dt-text);
}

div.dtsb-searchBuilder select,
div.dtsb-searchBuilder input,
div.dtsb-searchBuilder .dtsb-value select,
div.dtsb-searchBuilder .dtsb-value input {
    background: var(--dt-bg);
    color: var(--dt-text);
    border: 1px solid var(--dt-border);
    border-radius: 8px;
}
div.dtsb-searchBuilder .dtsb-delete,
div.dtsb-searchBuilder .dtsb-clearGroup,
div.dtsb-searchBuilder .dtsb-add {
    background: var(--dt-bg);
    color: var(--dt-text);
    border: 1px solid var(--dt-border);
    border-radius: 8px;
}
div.dtsb-searchBuilder .dtsb-delete:hover,
div.dtsb-searchBuilder .dtsb-clearGroup:hover,
div.dtsb-searchBuilder .dtsb-add:hover {
    background: var(--dt-hover);
}

/* Состояния disabled */
.dt-buttons .dt-button.disabled,
.dt-buttons .btn.dt-button.disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* На случай агрессивных чужих стилей — усиливаем */
.dt-buttons .dt-button,
.dt-button-collection,
div.dtsb-searchBuilder {
    color-scheme: dark;
}

/* ===== DataTables Buttons & SearchBuilder — hard dark ===== */

/* Панель кнопок (оба варианта: чистый DT и Bootstrap) */
div.dt-buttons .dt-button,
div.dt-buttons .btn.dt-button,
div.dt-buttons .btn {
    background: var(--dt-bg) !important;
    color: var(--dt-text) !important;
    border: 1px solid var(--dt-border) !important;
    border-radius: 12px !important;
    padding: 8px 12px !important;
    line-height: 1.2 !important;
    box-shadow: none !important;
}
div.dt-buttons .dt-button:hover,
div.dt-buttons .btn.dt-button:hover,
div.dt-buttons .btn:hover {
    background: var(--dt-hover) !important;
    color: var(--dt-text) !important;
    border-color: var(--dt-border) !important;
}
div.dt-buttons .dt-button:focus,
div.dt-buttons .btn:focus,
div.dt-buttons .dt-button:active,
div.dt-buttons .btn:active {
    outline: 0 !important;
    border-color: var(--dt-accent) !important;
    box-shadow: 0 0 0 3px rgba(var(--dt-accent-rgb), 0.25) !important;
}

/* Иконка-стрелка у dropdown */
div.dt-buttons .dt-button .dt-down-arrow,
div.dt-buttons .dt-button.dropdown-toggle::after,
div.dt-buttons .btn.dropdown-toggle::after {
    border-top-color: #9ca3af !important;
}

/* Меню коллекций (Export/Visibility) — оба способа рендера */
div.dt-button-collection,
div.dt-button-collection .dropdown-menu,
body > div.dt-button-collection,           /* коллекция рендерится в <body> */
body > div.dt-button-collection .dropdown-menu {
    background: var(--dt-bg-2) !important;
    border: 1px solid var(--dt-border) !important;
    border-radius: 12px !important;
    box-shadow: var(--dt-shadow) !important;
    padding: 6px !important;
}
div.dt-button-collection .dt-button,
div.dt-button-collection .dropdown-item {
    background: transparent !important;
    color: var(--dt-text) !important;
    border: 0 !important;
    border-radius: 8px !important;
    padding: 8px 10px !important;
}
div.dt-button-collection .dt-button:hover,
div.dt-button-collection .dropdown-item:hover {
    background: var(--dt-hover) !important;
    color: var(--dt-text) !important;
}

/* SearchBuilder блок и его элементы */
div.dtsb-searchBuilder {
    background: var(--dt-bg-2) !important;
    border: 1px solid var(--dt-border) !important;
    border-radius: 12px !important;
    color: var(--dt-text) !important;
    box-shadow: var(--dt-shadow) !important;
}
div.dtsb-searchBuilder .dtsb-title {
    color: var(--dt-text) !important;
}

div.dtsb-searchBuilder select,
div.dtsb-searchBuilder input,
div.dtsb-searchBuilder .dtsb-value select,
div.dtsb-searchBuilder .dtsb-value input {
    background: var(--dt-bg) !important;
    color: var(--dt-text) !important;
    border: 1px solid var(--dt-border) !important;
    border-radius: 8px !important;
}
div.dtsb-searchBuilder .dtsb-delete,
div.dtsb-searchBuilder .dtsb-clearGroup,
div.dtsb-searchBuilder .dtsb-add {
    background: var(--dt-bg) !important;
    color: var(--dt-text) !important;
    border: 1px solid var(--dt-border) !important;
    border-radius: 8px !important;
}
div.dtsb-searchBuilder .dtsb-delete:hover,
div.dtsb-searchBuilder .dtsb-clearGroup:hover,
div.dtsb-searchBuilder .dtsb-add:hover {
    background: var(--dt-hover) !important;
}

/* На всякий — выключаем светлые градиенты/бэкграунды из чужих UI-китов */
div.dt-buttons .dt-button,
div.dt-buttons .btn,
div.dt-button-collection,
div.dtsb-searchBuilder {
    background-image: none !important;
    color-scheme: dark;
}