/* =====================================================
   Telerik Grid / UI dark-mode overrides
   Se activan solo cuando html tiene data-theme-mode="dark"
   ===================================================== */

/* =====================================================
   GLOBAL: Siempre mostrar el bell de notificaciones
   (el template lo oculta en mobile con !important)
   ===================================================== */
.notifications-dropdown {
    display: flex !important;
    align-items: center !important;
}

/* ======================================================
   PALETA AZUL-NAVY COHERENTE
   Sidebar  #11192a · Header  #111c2d
   Fondo    #0d1117 · Cards  #162032
   ====================================================== */

/* Fondo de la página */
[data-theme-mode="dark"] body,
[data-theme-mode="dark"] html {
    background-color: #0d1117 !important;
}
[data-theme-mode="dark"] .main-content,
[data-theme-mode="dark"] .app-content,
[data-theme-mode="dark"] .mud-layout,
[data-theme-mode="dark"] .mud-main-content {
    background-color: #0d1117 !important;
}

/* Cards y paneles MudBlazor */
[data-theme-mode="dark"] .mud-card,
[data-theme-mode="dark"] .custom-card,
[data-theme-mode="dark"] .mud-paper,
[data-theme-mode="dark"] .mud-paper-outlined {
    background-color: #162032 !important;
    border-color: rgba(255,255,255,0.06) !important;
}

/* Drawer / modal MudBlazor */
[data-theme-mode="dark"] .mud-drawer,
[data-theme-mode="dark"] .mud-drawer-content,
[data-theme-mode="dark"] .mud-overlay-drawer {
    background-color: #162032 !important;
}

/* Dialog MudBlazor */
[data-theme-mode="dark"] .mud-dialog,
[data-theme-mode="dark"] .mud-dialog-content {
    background-color: #162032 !important;
}

/* Inputs MudBlazor */
[data-theme-mode="dark"] .mud-input-control,
[data-theme-mode="dark"] .mud-input,
[data-theme-mode="dark"] .mud-select-input {
    background-color: #0d1117 !important;
    color: #c8ccd5 !important;
}

/* Dividers y separadores */
[data-theme-mode="dark"] .mud-divider,
[data-theme-mode="dark"] hr {
    border-color: rgba(255,255,255,0.07) !important;
}

/* Chips y badges */
[data-theme-mode="dark"] .mud-chip {
    background-color: rgba(132,90,223,0.15) !important;
}

/* Listas MudBlazor */
[data-theme-mode="dark"] .mud-list-item:hover {
    background-color: rgba(255,255,255,0.04) !important;
}

/* Tabla MudBlazor (MudTable) */
[data-theme-mode="dark"] .mud-table-container,
[data-theme-mode="dark"] .mud-table {
    background-color: #162032 !important;
}
[data-theme-mode="dark"] .mud-table-row:hover {
    background-color: rgba(132,90,223,0.08) !important;
}
[data-theme-mode="dark"] .mud-table-head .mud-table-row {
    background-color: #0f1929 !important;
}

/* Progress circular / linear */
[data-theme-mode="dark"] .mud-progress-linear {
    background-color: rgba(255,255,255,0.08) !important;
}

/* Tooltip, popover */
[data-theme-mode="dark"] .mud-popover,
[data-theme-mode="dark"] .mud-tooltip {
    background-color: #1e2a3a !important;
    color: #c8ccd5 !important;
}

/* ======================================================
   SIDEBAR Y HEADER FORZADO A DARK — independiente de
   data-menu-styles / data-header-styles (que no llegan)
   ====================================================== */
[data-theme-mode="dark"] .app-sidebar,
[data-theme-mode="dark"] .app-sidebar .main-sidebar-header,
[data-theme-mode="dark"] .app-sidebar .main-sidebar {
    background: #11192a !important;
    border-color: rgba(255,255,255,0.08) !important;
}

[data-theme-mode="dark"] .app-sidebar .side-menu__item,
[data-theme-mode="dark"] .app-sidebar .side-menu__label,
[data-theme-mode="dark"] .app-sidebar .category-name,
[data-theme-mode="dark"] .app-sidebar .side-menu__angle {
    color: rgba(255,255,255,0.55) !important;
}

[data-theme-mode="dark"] .app-sidebar .side-menu__item.active,
[data-theme-mode="dark"] .app-sidebar .side-menu__item:hover {
    background: rgba(255,255,255,0.06) !important;
}

[data-theme-mode="dark"] .app-sidebar .side-menu__item.active .side-menu__label,
[data-theme-mode="dark"] .app-sidebar .side-menu__item:hover .side-menu__label,
[data-theme-mode="dark"] .app-sidebar .side-menu__item.active .side-menu__icon {
    color: #fff !important;
}

[data-theme-mode="dark"] .app-header {
    background: #111c2d !important;
    border-color: rgba(255,255,255,0.08) !important;
}

[data-theme-mode="dark"] .app-header .main-header-container {
    background: #111c2d !important;
}

/* Texto e íconos del header */
[data-theme-mode="dark"] .app-header .header-link,
[data-theme-mode="dark"] .app-header .nav-link,
[data-theme-mode="dark"] .app-header .header-element span {
    color: rgba(255,255,255,0.7) !important;
}

[data-theme-mode="dark"] .k-grid,
[data-theme-mode="dark"] .k-widget.k-grid {
    background: #1e2337 !important;
    color: #c8ccd5;
    border-color: rgba(255,255,255,0.07);
}

/* ---- Fondo blanco bajo las filas (contenedor scrollable) ---- */
[data-theme-mode="dark"] .k-grid-content,
[data-theme-mode="dark"] .k-grid-content-locked,
[data-theme-mode="dark"] .k-grid-content > *,
[data-theme-mode="dark"] .k-virtual-content {
    background: #1e2337 !important;
}

/* ================================================================
   BOTONES COLUMNA COMANDOS — ghost icon style
   Sin fondo por defecto, color suave, tinte leve en hover
   Selector correcto: k-command-cell (no k-grid-command-cell)
   ================================================================ */

/* Reset base: quita todo el rojo Kendo */
[data-theme-mode="dark"] .k-command-cell .k-button,
[data-theme-mode="dark"] .k-grid-command-cell .k-button {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 5px !important;
    min-width: 28px !important;
    height: 28px !important;
    padding: 0 6px !important;
    transition: background 0.15s, color 0.15s !important;
}

/* Editar → lila moonlight #A3A3CC con tinte suave */
[data-theme-mode="dark"] .k-command-cell .k-button-solid-primary,
[data-theme-mode="dark"] .k-grid-command-cell .k-button-solid-primary {
    background: rgba(163,163,204,0.1) !important;
    color: #A3A3CC !important;
}
[data-theme-mode="dark"] .k-command-cell .k-button-solid-primary:hover,
[data-theme-mode="dark"] .k-grid-command-cell .k-button-solid-primary:hover {
    background: rgba(92,92,153,0.25) !important;
    color: #CCCCFF !important;
}

/* Guardar → teal */
[data-theme-mode="dark"] .k-command-cell .k-button-solid-success,
[data-theme-mode="dark"] .k-grid-command-cell .k-button-solid-success {
    background: rgba(38,191,148,0.1) !important;
    color: #26bf94 !important;
}
[data-theme-mode="dark"] .k-command-cell .k-button-solid-success:hover,
[data-theme-mode="dark"] .k-grid-command-cell .k-button-solid-success:hover {
    background: rgba(38,191,148,0.22) !important;
    color: #3ddab0 !important;
}

/* Cancelar → gris azulado */
[data-theme-mode="dark"] .k-command-cell .k-button-solid-base,
[data-theme-mode="dark"] .k-grid-command-cell .k-button-solid-base {
    background: rgba(255,255,255,0.05) !important;
    color: #7a8499 !important;
}
[data-theme-mode="dark"] .k-command-cell .k-button-solid-base:hover,
[data-theme-mode="dark"] .k-grid-command-cell .k-button-solid-base:hover {
    background: rgba(255,255,255,0.1) !important;
    color: #adb5bd !important;
}

/* Eliminar → rojo con presencia pero sin gritar */
[data-theme-mode="dark"] .k-command-cell .k-button-solid-error,
[data-theme-mode="dark"] .k-grid-command-cell .k-button-solid-error {
    background: rgba(232,70,87,0.1) !important;
    color: rgba(232,70,87,0.75) !important;
}
[data-theme-mode="dark"] .k-command-cell .k-button-solid-error:hover,
[data-theme-mode="dark"] .k-grid-command-cell .k-button-solid-error:hover {
    background: rgba(232,70,87,0.2) !important;
    color: #e84657 !important;
}

/* Toolbar: Agregar y otros botones de acción principal → sólido visible */
[data-theme-mode="dark"] .k-grid-toolbar .k-button-solid-primary {
    background: #845adf !important;
    border-color: #845adf !important;
    color: #fff !important;
    border-radius: 6px !important;
}
[data-theme-mode="dark"] .k-grid-toolbar .k-button-solid-primary:hover {
    background: #6f48c9 !important;
    border-color: #6f48c9 !important;
}

/* Popup de edición: botón Save → teal sólido */
[data-theme-mode="dark"] .k-window .k-button-solid-primary,
[data-theme-mode="dark"] .k-dialog .k-button-solid-primary {
    background: #845adf !important;
    border-color: #845adf !important;
    color: #fff !important;
    border-radius: 6px !important;
}
[data-theme-mode="dark"] .k-window .k-button-solid-primary:hover,
[data-theme-mode="dark"] .k-dialog .k-button-solid-primary:hover {
    background: #6f48c9 !important;
}

/* Popup de edición: botón Cancel */
[data-theme-mode="dark"] .k-window .k-button-solid-base,
[data-theme-mode="dark"] .k-dialog .k-button-solid-base {
    background: rgba(255,255,255,0.07) !important;
    border-color: transparent !important;
    color: #9ba6b5 !important;
    border-radius: 6px !important;
}
[data-theme-mode="dark"] .k-window .k-button-solid-base:hover,
[data-theme-mode="dark"] .k-dialog .k-button-solid-base:hover {
    background: rgba(255,255,255,0.14) !important;
    color: #e0e4ef !important;
}

/* Toolbar (Agregar / Buscar) */
[data-theme-mode="dark"] .k-grid-toolbar {
    background-color: #1a1f32;
    border-color: rgba(255,255,255,0.07);
    color: #c8ccd5;
}

/* Header row */
[data-theme-mode="dark"] .k-grid-header,
[data-theme-mode="dark"] .k-grid-header-wrap,
[data-theme-mode="dark"] .k-table-thead,
[data-theme-mode="dark"] .k-header,
[data-theme-mode="dark"] .k-table-th {
    background-color: #161b2e !important;
    color: #c8ccd5 !important;
    border-color: rgba(255,255,255,0.08) !important;
}

[data-theme-mode="dark"] .k-column-title {
    color: #c8ccd5;
}

/* Data rows */
[data-theme-mode="dark"] .k-table-row,
[data-theme-mode="dark"] .k-table-td {
    background-color: #1e2337;
    color: #c8ccd5;
    border-color: rgba(255,255,255,0.05) !important;
}

/* Alternate row */
[data-theme-mode="dark"] .k-table-row.k-alt,
[data-theme-mode="dark"] .k-table-row.k-alt .k-table-td {
    background-color: #1a1f31 !important;
}

/* Hover */
[data-theme-mode="dark"] .k-table-row:hover,
[data-theme-mode="dark"] .k-table-row:hover .k-table-td {
    background-color: rgba(255,255,255,0.04) !important;
    color: #e0e4ef !important;
}

/* Selected row */
[data-theme-mode="dark"] .k-table-row.k-selected,
[data-theme-mode="dark"] .k-table-row.k-selected .k-table-td {
    background-color: rgba(132,90,223,0.18) !important;
}

/* Group header row */
[data-theme-mode="dark"] .k-grouping-row td,
[data-theme-mode="dark"] .k-group-footer td {
    background-color: #1a1f31 !important;
    color: #a0a8bb !important;
    border-color: rgba(255,255,255,0.05) !important;
}

/* Pager */
[data-theme-mode="dark"] .k-pager,
[data-theme-mode="dark"] .k-pager-wrap,
[data-theme-mode="dark"] .k-grid-pager {
    background-color: #161b2e !important;
    color: #c8ccd5 !important;
    border-color: rgba(255,255,255,0.07) !important;
}

[data-theme-mode="dark"] .k-pager-nav,
[data-theme-mode="dark"] .k-pager-numbers .k-link,
[data-theme-mode="dark"] .k-pager-sizes .k-dropdownlist {
    color: #c8ccd5 !important;
    background-color: transparent !important;
    border-color: rgba(255,255,255,0.1) !important;
}

[data-theme-mode="dark"] .k-pager-numbers .k-link.k-selected,
[data-theme-mode="dark"] .k-pager-numbers .k-selected {
    background-color: #845adf !important;
    color: #fff !important;
    border-color: #845adf !important;
}

[data-theme-mode="dark"] .k-pager-nav:hover,
[data-theme-mode="dark"] .k-pager-numbers .k-link:hover {
    background-color: rgba(132,90,223,0.15) !important;
    color: #e0e4ef !important;
}

/* Filter menu */
[data-theme-mode="dark"] .k-filter-menu,
[data-theme-mode="dark"] .k-popup,
[data-theme-mode="dark"] .k-child-animation-container {
    background-color: #1e2337 !important;
    color: #c8ccd5 !important;
    border-color: rgba(255,255,255,0.1) !important;
}

[data-theme-mode="dark"] .k-filtercell .k-textbox,
[data-theme-mode="dark"] .k-filtercell input,
[data-theme-mode="dark"] .k-filter-menu input {
    background-color: #161b2e !important;
    color: #c8ccd5 !important;
    border-color: rgba(255,255,255,0.15) !important;
}

/* Sort icons */
[data-theme-mode="dark"] .k-sort-icon,
[data-theme-mode="dark"] .k-i-sort-asc-sm,
[data-theme-mode="dark"] .k-i-sort-desc-sm,
[data-theme-mode="dark"] .k-icon {
    color: #8a92ab;
}

/* Filter icon button */
[data-theme-mode="dark"] .k-grid-filter-menu .k-grid-filter,
[data-theme-mode="dark"] .k-grid-header .k-grid-filter {
    color: #8a92ab !important;
}
[data-theme-mode="dark"] .k-grid-header .k-grid-filter:hover,
[data-theme-mode="dark"] .k-grid-header .k-active {
    background-color: rgba(132,90,223,0.15) !important;
    color: #845adf !important;
}

/* DropDown en toolbar */
[data-theme-mode="dark"] .k-dropdownlist,
[data-theme-mode="dark"] .k-picker,
[data-theme-mode="dark"] .k-combobox {
    background-color: #161b2e !important;
    color: #c8ccd5 !important;
    border-color: rgba(255,255,255,0.12) !important;
}

[data-theme-mode="dark"] .k-list-container,
[data-theme-mode="dark"] .k-list-ul {
    background-color: #1e2337 !important;
    color: #c8ccd5 !important;
}

[data-theme-mode="dark"] .k-list-item:hover,
[data-theme-mode="dark"] .k-list-optionlabel:hover {
    background-color: rgba(132,90,223,0.15) !important;
}

[data-theme-mode="dark"] .k-list-item.k-selected {
    background-color: #845adf !important;
    color: #fff !important;
}

/* Switches / Checkboxes Telerik */
[data-theme-mode="dark"] .k-switch-off .k-switch-track {
    background-color: #3a3f55 !important;
    border-color: #3a3f55 !important;
}

/* Loading overlay */
[data-theme-mode="dark"] .k-loading-mask {
    background-color: rgba(22,27,46,0.6) !important;
}

/* Popup edit form */
[data-theme-mode="dark"] .k-window,
[data-theme-mode="dark"] .k-dialog {
    background-color: #1e2337 !important;
    color: #c8ccd5 !important;
    border-color: rgba(255,255,255,0.1) !important;
}

[data-theme-mode="dark"] .k-window-titlebar,
[data-theme-mode="dark"] .k-dialog-titlebar {
    background-color: #161b2e !important;
    color: #e0e4ef !important;
    border-color: rgba(255,255,255,0.08) !important;
}

[data-theme-mode="dark"] .k-window-content,
[data-theme-mode="dark"] .k-dialog-content {
    background-color: #1e2337 !important;
    color: #c8ccd5 !important;
}

[data-theme-mode="dark"] .k-form-field label,
[data-theme-mode="dark"] .k-label {
    color: #a0a8bb !important;
}

[data-theme-mode="dark"] .k-input,
[data-theme-mode="dark"] .k-textbox,
[data-theme-mode="dark"] .k-textarea,
[data-theme-mode="dark"] .k-datepicker .k-input-inner,
[data-theme-mode="dark"] .k-numerictextbox .k-input-inner {
    background-color: #161b2e !important;
    color: #c8ccd5 !important;
    border-color: rgba(255,255,255,0.15) !important;
}

[data-theme-mode="dark"] .k-input:focus,
[data-theme-mode="dark"] .k-input:focus-within {
    border-color: #845adf !important;
    box-shadow: 0 0 0 2px rgba(132,90,223,0.25) !important;
}

/* Grouping bar */
[data-theme-mode="dark"] .k-grouping-header {
    background-color: #161b2e !important;
    color: #8a92ab !important;
    border-color: rgba(255,255,255,0.07) !important;
}

/* Search box in toolbar */
[data-theme-mode="dark"] .k-grid-search .k-input {
    background-color: #161b2e !important;
    color: #c8ccd5 !important;
    border-color: rgba(255,255,255,0.15) !important;
}

/* ---- Columna bloqueada (Locked="true") — "Comandos" ---- */
[data-theme-mode="dark"] .k-grid-content-locked,
[data-theme-mode="dark"] .k-grid-header-locked {
    background-color: #1e2337 !important;
    border-color: rgba(255,255,255,0.08) !important;
}

[data-theme-mode="dark"] .k-grid-content-locked .k-table-row,
[data-theme-mode="dark"] .k-grid-content-locked .k-table-td {
    background-color: #1e2337 !important;
    color: #c8ccd5 !important;
    border-color: rgba(255,255,255,0.05) !important;
}

[data-theme-mode="dark"] .k-grid-content-locked .k-table-row.k-alt,
[data-theme-mode="dark"] .k-grid-content-locked .k-table-row.k-alt .k-table-td {
    background-color: #1a1f31 !important;
}

[data-theme-mode="dark"] .k-grid-content-locked .k-table-row:hover,
[data-theme-mode="dark"] .k-grid-content-locked .k-table-row:hover .k-table-td {
    background-color: rgba(255,255,255,0.04) !important;
}

[data-theme-mode="dark"] .k-grid-header-locked .k-table-th {
    background-color: #161b2e !important;
    color: #c8ccd5 !important;
    border-color: rgba(255,255,255,0.08) !important;
}

/* ---- Espacio vacío bajo las filas ---- */
[data-theme-mode="dark"] .k-grid-content,
[data-theme-mode="dark"] .k-grid-content-locked {
    background-color: #1e2337 !important;
}

/* La tabla en sí y su tbody — cubre el hueco bajo las últimas filas */
[data-theme-mode="dark"] .k-grid .k-table,
[data-theme-mode="dark"] .k-grid .k-table-tbody {
    background-color: #1e2337 !important;
}

/* El scroll-container que puede quedarse en blanco */
[data-theme-mode="dark"] .k-grid-table-wrap,
[data-theme-mode="dark"] .k-grid-content > div,
[data-theme-mode="dark"] .k-grid-content-locked > div {
    background-color: #1e2337 !important;
}