/*
 * AlfionAMS Theme
 * CSS custom-property structure ported from SmogWeb (the MECHANISM only, not its green
 * palette - see docs/UI_GRID_FORM_PATTERNS.md). Keeps the current brand color (the admin
 * template's stock blue, #556ee6) but gives DevExtreme components - which the Bootstrap
 * admin template does not theme at all - and a few shared UI classes a single place to
 * read brand color from. Change --ams-primary here to re-brand the whole app later.
 */

:root {
    --ams-primary: #556ee6;
    --ams-primary-subtle: rgba(85, 110, 230, 0.1);
    --ams-primary-subtle-border: rgba(85, 110, 230, 0.2);
    --ams-primary-hover-row: rgba(85, 110, 230, 0.05);
}

/* Card header variant (mechanism from SmogWeb's card-header-dark-green) */
.card-header-primary {
    background-color: var(--ams-primary-subtle);
    border-bottom: 1px solid var(--ams-primary-subtle-border);
    color: var(--ams-primary);
}

/* Tab badge counters, e.g. Details-page sub-tab record counts */
.badge-count {
    background-color: var(--ams-primary) !important;
    color: #fff;
}

.badge-count-muted {
    background-color: #e9ecef !important;
    color: #6c757d;
}

/* ===== DevExtreme grid theming (not covered by the Bootstrap admin template) ===== */
.dx-datagrid-headers {
    background-color: var(--ams-primary-subtle) !important;
}

.dx-datagrid-headers .dx-datagrid-text-content {
    color: var(--ams-primary) !important;
    font-weight: 600 !important;
}

.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused) > td {
    background-color: var(--ams-primary-subtle) !important;
}

.dx-datagrid-rowsview .dx-row:not(.dx-row-focused):hover > td {
    background-color: var(--ams-primary-hover-row) !important;
}

/* Native browser scrollbar - only takes effect on grids that opt into
   scrolling.mode:"virtual"/"infinite" with useNative:true (see docs/UI_GRID_FORM_PATTERNS.md §9:
   useNative must be explicit, "auto" falls back to a simulated scrollbar this CSS hides). */
.dx-datagrid .dx-scrollable-container {
    overflow: auto !important;
}

.dx-datagrid .dx-scrollable-scrollbar {
    display: none !important;
}

.dx-datagrid .dx-scrollable-container::-webkit-scrollbar {
    width: 14px;
    height: 14px;
}

.dx-datagrid .dx-scrollable-container::-webkit-scrollbar-track {
    background: #f5f5f5;
}

.dx-datagrid .dx-scrollable-container::-webkit-scrollbar-thumb {
    background-color: rgba(85, 110, 230, 0.5);
    border: 2px solid #f5f5f5;
    border-radius: 7px;
}

.dx-datagrid .dx-scrollable-container::-webkit-scrollbar-corner {
    background: #f5f5f5;
}

/* Header-filter popup width fix - long value lists get clipped at the default width */
.dx-header-filter-menu .dx-overlay-content {
    width: auto !important;
    min-width: 260px;
    max-width: 560px;
}

.dx-header-filter-menu .dx-list-item-content,
.dx-header-filter-menu .dx-treeview-item-content span,
.dx-header-filter-menu .dx-treeview-item span {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    word-break: break-word;
}