/* ULTRA DARK THEME - MÁXIMA PRIORIDAD - CONTROL DE NÓMINAS */

/* Variables del tema dark */
:root {
    --primary-bg: #0d1117 !important;
    --secondary-bg: #161b22 !important;
    --tertiary-bg: #21262d !important;
    --card-bg: #0d1117 !important;
    --hover-bg: #30363d !important;
    --border-color: #30363d !important;
    --primary-text: #c9d1d9 !important;
    --secondary-text: #8b949e !important;
    --primary-accent: #58a6ff !important;
    --success-color: #3fb950 !important;
    --error-color: #f85149 !important;
    --warning-color: #d29922 !important;
    --input-bg: #0d1117 !important;
    --input-border: #30363d !important;
    --input-focus-border: #58a6ff !important;
}


/* HTML y BODY - BASE DARK */
html {
    background-color: var(--primary-bg) !important;
    color: var(--primary-text) !important;
    color-scheme: dark !important;
}

body {
    background-color: var(--primary-bg) !important;
    color: var(--primary-text) !important;
    min-height: 100vh !important;
}

/* =================================================================== */
/* SYNCFUSION GRID - ESTILOS GLOBALES (Basado en Bancos)              */
/* =================================================================== */

/* Grid Container */

.grid-dark {
}

    .grid-dark .e-grid {
        background: #1e2530 !important;
        color: #e8eaf6 !important;
        border: none !important;
    }

        /* Grid Header Area - cuando está vacío o sin columnas */
        .grid-dark .e-grid .e-gridheader,
        .grid-dark .e-grid .e-columnheader,
        .grid-dark .e-grid .e-gridheader .e-table {
            background: #2d3142 !important;
        }

        /* Grid Content Area - cuando está vacío o sin columnas */
        .grid-dark .e-grid .e-gridcontent,
        .grid-dark .e-grid .e-content,
        .grid-dark .e-grid .e-table {
            background: #1e2530 !important;
        }

        /* Empty Record Template */
        .grid-dark .e-grid .e-emptyrecord {
            background: #1e2530 !important;
            color: #e8eaf6 !important;
        }

        /* Header Cells */
        .grid-dark .e-grid .e-headercell {
            background: linear-gradient(90deg, #2d3142 100%, #3a3f58 100%) !important;
            /*background: linear-gradient(135deg, #2d3142 0%, #3a3f58 100%) !important;*/
            color: #e8eaf6 !important;
            border-color: rgba(100, 181, 246, 0.1) !important;
            font-weight: 600;
        }

        /* Regular Rows */
        .grid-dark .e-grid .e-row {
            background: #2d3142 !important;
            border-color: rgba(100, 181, 246, 0.05) !important;
            color: white !important;
        }

            .grid-dark .e-grid .e-row:hover,
            .grid-dark .e-grid .e-row:hover td {
                background: #4a4f68 !important;
                color: white !important;
            }

            .grid-dark .e-grid .e-row .e-rowcell {
                color: white !important;
            }

            .grid-dark .e-grid .e-row:hover .e-rowcell {
                color: white !important;
            }

        /* Alternate Rows */
        .grid-dark .e-grid .e-altrow {
            background: #262a3b !important;
            color: white !important;
        }

            .grid-dark .e-grid .e-altrow:hover,
            .grid-dark .e-grid .e-altrow:hover td {
                background: #4a4f68 !important;
                color: white !important;
            }

            .grid-dark .e-grid .e-altrow .e-rowcell {
                color: white !important;
            }

            .grid-dark .e-grid .e-altrow:hover .e-rowcell {
                color: white !important;
            }

        /* Selected Row - Fila Seleccionada */
        .grid-dark .e-grid .e-row.e-selectionbackground,
        .grid-dark .e-grid .e-row.e-active,
        .grid-dark .e-grid .e-altrow.e-selectionbackground,
        .grid-dark .e-grid .e-altrow.e-active,
        .grid-dark .e-grid tr.e-selectionbackground,
        .grid-dark .e-grid tr.e-active {
            background-color: #000000 !important;
            background: #000000 !important;
            color: white !important;
        }

            .grid-dark .e-grid .e-row.e-selectionbackground td,
            .grid-dark .e-grid .e-row.e-active td,
            .grid-dark .e-grid .e-altrow.e-selectionbackground td,
            .grid-dark .e-grid .e-altrow.e-active td,
            .grid-dark .e-grid .e-row.e-selectionbackground .e-rowcell,
            .grid-dark .e-grid .e-row.e-active .e-rowcell,
            .grid-dark .e-grid .e-altrow.e-selectionbackground .e-rowcell,
            .grid-dark .e-grid .e-altrow.e-active .e-rowcell,
            .grid-dark .e-grid tr.e-selectionbackground td,
            .grid-dark .e-grid tr.e-active td {
                background-color: #000000 !important;
                background: #000000 !important;
                color: white !important;
            }

            /* Selected row hover - mantener el color negro cuando se hace hover sobre fila seleccionada */
            .grid-dark .e-grid .e-row.e-selectionbackground:hover,
            .grid-dark .e-grid .e-row.e-active:hover,
            .grid-dark .e-grid .e-altrow.e-selectionbackground:hover,
            .grid-dark .e-grid .e-altrow.e-active:hover,
            .grid-dark .e-grid tr.e-selectionbackground:hover,
            .grid-dark .e-grid tr.e-active:hover {
                background-color: #000000 !important;
                background: #000000 !important;
                color: white !important;
            }

                .grid-dark .e-grid .e-row.e-selectionbackground:hover td,
                .grid-dark .e-grid .e-row.e-active:hover td,
                .grid-dark .e-grid .e-altrow.e-selectionbackground:hover td,
                .grid-dark .e-grid .e-altrow.e-active:hover td,
                .grid-dark .e-grid .e-row.e-selectionbackground:hover .e-rowcell,
                .grid-dark .e-grid .e-row.e-active:hover .e-rowcell,
                .grid-dark .e-grid .e-altrow.e-selectionbackground:hover .e-rowcell,
                .grid-dark .e-grid .e-altrow.e-active:hover .e-rowcell,
                .grid-dark .e-grid tr.e-selectionbackground:hover td,
                .grid-dark .e-grid tr.e-active:hover td {
                    background-color: #000000 !important;
                    background: #000000 !important;
                    color: white !important;
                }

        /* Pager */
        .grid-dark .e-grid .e-pager {
            background: #1e2530 !important;
            color: #e8eaf6 !important;
            border-color: rgba(100, 181, 246, 0.1) !important;
        }

        .grid-dark .e-grid .e-pagercontainer {
            background: #1e2530 !important;
        }

            /* Números de página y links */
            .grid-dark .e-grid .e-pagercontainer .e-link, grid-dark .e-grid .e-pagercontainer .e-numericitem {
                color: #b0bec5 !important;
                background: transparent !important;
            }

            /* Página actual */
            .grid-dark .e-grid .e-pagercontainer .e-currentitem {
                background: #64b5f6 !important;
                color: #fff !important;
                border-color: #64b5f6 !important;
            }

        /* Botones de navegación (First, Prev, Next, Last) */
        .grid-dark .e-grid .e-pager .e-first,
        .grid-dark .e-grid .e-pager .e-prev,
        .grid-dark .e-grid .e-pager .e-next,
        .grid-dark .e-grid .e-pager .e-last,
        .grid-dark .e-grid .e-pager .e-np,
        .grid-dark .e-grid .e-pager .e-pp {
            color: #b0bec5 !important;
            background: transparent !important;
        }

            /* Hover en números de página y botones */
            .grid-dark .e-grid .e-pagercontainer .e-numericitem:hover,
            .grid-dark .e-grid .e-pager .e-first:hover,
            grid-dark .e-grid .e-pager .e-prev:hover,
            grid-dark .e-grid .e-pager .e-next:hover,
            grid-dark .e-grid .e-pager .e-last:hover {
                background: #3a3f58 !important;
                color: #fff !important;
            }

        /* Dropdown y otros elementos del pager */
        .grid-dark .e-grid .e-pager .e-pagesizes,
        .grid-dark .e-grid .e-pager .e-pagecountmsg,
        .grid-dark .e-grid .e-pager .e-parentmsgbar {
            color: #b0bec5 !important;
            background: transparent !important;
        }

        /* Input del paginador */
        .grid-dark .e-grid .e-pager input {
            background: #2d3142 !important;
            color: #e8eaf6 !important;
            border-color: rgba(100, 181, 246, 0.2) !important;
        }

        /* Dropdown del paginador */
        .grid-dark .e-grid .e-pager .e-dropdownlist {
            background: #2d3142 !important;
            color: #e8eaf6 !important;
            border-color: rgba(100, 181, 246, 0.2) !important;
        }

            .grid-dark .e-grid .e-pager .e-dropdownlist .e-input-group {
                background: #2d3142 !important;
            }

                .grid-dark .e-grid .e-pager .e-dropdownlist .e-input-group input {
                    color: #e8eaf6 !important;
                    background: #2d3142 !important;
                }

            .grid-dark .e-grid .e-pager .e-dropdownlist .e-ddl-icon {
                color: #b0bec5 !important;
            }

            /* Popup del dropdown cuando se abre */
            .grid-dark .e-grid .e-pager .e-dropdownlist .e-content,
            .grid-dark .e-dropdownbase.e-popup {
                background: #2d3142 !important;
                border-color: rgba(100, 181, 246, 0.2) !important;
            }

                /* Items dentro del dropdown */
                .grid-dark .e-dropdownbase.e-popup .e-list-item {
                    background: #2d3142 !important;
                    color: #e8eaf6 !important;
                }

                    .grid-dark .e-dropdownbase.e-popup .e-list-item:hover {
                        background: #3a3f58 !important;
                        color: #fff !important;
                    }

                    .grid-dark .e-dropdownbase.e-popup .e-list-item.e-active {
                        background: #64b5f6 !important;
                        color: #fff !important;
                    }

/* =================================================================== */
/* SYNCFUSION DIALOG - ESTILOS GLOBALES                               */
/* =================================================================== */

.dlg {
}

    .dlg .e-dialog {
        background: linear-gradient(135deg, #1e2530 0%, #2d3142 100%) !important;
        border: 1px solid rgba(100, 181, 246, 0.2) !important;
        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6) !important;
    }

        .dlg .e-dialog .e-dlg-header {
            color: unset !important;
        }

        .dlg .e-dialog .e-dlg-header-content {
            background: linear-gradient(135deg, #2d3142 0%, #3a3f58 100%) !important;
            border-bottom: 1px solid rgba(100, 181, 246, 0.1) !important;
            color: white !important;
        }

            /* Título del dialog */
            .dlg .e-dialog .e-dlg-header-content .e-dlg-header,
            .e-dialog .e-dlg-header {
                color: white !important;
            }

            /* Icono de cerrar del dialog */
            .dlg .e-dialog .e-dlg-header-content .e-icon-dlg-close {
                color: white !important;
            }

                .dlg .e-dialog .e-dlg-header-content .e-icon-dlg-close:hover {
                    color: white !important;
                    background: rgba(239, 83, 80, 0.2) !important;
                }

        .dlg .e-dialog .e-dlg-content {
            background: #1a1d29 !important;
            color: #e8eaf6 !important;
        }

        /* Inputs dentro del dialog */
        .dlg .e-dialog .e-input-group input,
        .e-dialog .e-input-group.e-control-wrapper input {
            background: #2d3142 !important;
            color: #e8eaf6 !important;
            border-color: rgba(100, 181, 246, 0.2) !important;
        }

            .dlg .e-dialog .e-input-group input:focus {
                border-color: #64b5f6 !important;
            }

        /* Dropdowns dentro del dialog */
        .dlg .e-dialog .e-dropdownlist,
        .e-dialog .e-ddl {
            background: #2d3142 !important;
            color: #e8eaf6 !important;
        }

            .dlg .e-dialog .e-dropdownlist .e-input-group input {
                color: #e8eaf6 !important;
            }

/* =================================================================== */
/* SYNCFUSION DIALOG-DARK - ESTILO GLOBAL REUTILIZABLE                */
/* Uso: <SfDialog CssClass="dialog-dark">                             */
/* =================================================================== */

.dialog-dark.e-dialog {
    background: linear-gradient(135deg, #1e2530 0%, #2d3142 100%) !important;
    border: 1px solid rgba(100, 181, 246, 0.2) !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6) !important;
    border-radius: 12px !important;
}

    /* Header del dialog */
    .dialog-dark.e-dialog .e-dlg-header-content {
        background: linear-gradient(135deg, #2d3142 0%, #3a3f58 100%) !important;
        border-bottom: 1px solid rgba(100, 181, 246, 0.1) !important;
        padding: 1.25rem 1.5rem !important;
        border-radius: 12px 12px 0 0 !important;
    }

    /* Título del dialog */
    .dialog-dark.e-dialog .e-dlg-header-content .e-dlg-header {
        color: #e8eaf6 !important;
        font-size: 1.25rem !important;
        font-weight: 600 !important;
    }

    /* Botón de cerrar */
    .dialog-dark.e-dialog .e-dlg-header-content .e-icon-dlg-close {
        color: #b0bec5 !important;
        font-size: 1rem !important;
        transition: all 0.3s ease !important;
    }

        .dialog-dark.e-dialog .e-dlg-header-content .e-icon-dlg-close:hover {
            color: #fff !important;
            background: rgba(239, 83, 80, 0.2) !important;
            border-radius: 4px !important;
        }

    /* Contenido del dialog */
    .dialog-dark.e-dialog .e-dlg-content {
        background: #1a1d29 !important;
        color: #e8eaf6 !important;
        padding: 1.5rem !important;
    }

    /* Footer del dialog */
    .dialog-dark.e-dialog .e-footer-content {
        background: #1e2530 !important;
        border-top: 1px solid rgba(100, 181, 246, 0.1) !important;
        padding: 1rem 1.5rem !important;
        border-radius: 0 0 12px 12px !important;
    }

    /* Inputs dentro del dialog-dark */
    .dialog-dark.e-dialog .e-input-group input,
    .dialog-dark.e-dialog .e-input-group.e-control-wrapper input,
    .dialog-dark.e-dialog .e-textbox {
        background: #2d3142 !important;
        color: #e8eaf6 !important;
        border: 1px solid rgba(100, 181, 246, 0.2) !important;
        border-radius: 6px !important;
        transition: all 0.3s ease !important;
    }

        .dialog-dark.e-dialog .e-input-group input:focus,
        .dialog-dark.e-dialog .e-textbox:focus {
            border-color: #64b5f6 !important;
            box-shadow: 0 0 0 2px rgba(100, 181, 246, 0.1) !important;
        }

    /* TextArea dentro del dialog-dark */
    .dialog-dark.e-dialog textarea.e-input {
        background: #2d3142 !important;
        color: #e8eaf6 !important;
        border: 1px solid rgba(100, 181, 246, 0.2) !important;
        border-radius: 6px !important;
    }

        .dialog-dark.e-dialog textarea.e-input:focus {
            border-color: #64b5f6 !important;
            box-shadow: 0 0 0 2px rgba(100, 181, 246, 0.1) !important;
        }

    /* Dropdowns dentro del dialog-dark */
    .dialog-dark.e-dialog .e-dropdownlist,
    .dialog-dark.e-dialog .e-ddl {
        background: #2d3142 !important;
        border: 1px solid rgba(100, 181, 246, 0.2) !important;
        border-radius: 6px !important;
    }

        .dialog-dark.e-dialog .e-dropdownlist .e-input-group input,
        .dialog-dark.e-dialog .e-ddl .e-input-group input {
            color: #e8eaf6 !important;
            background: transparent !important;
        }

        .dialog-dark.e-dialog .e-dropdownlist .e-ddl-icon {
            color: #b0bec5 !important;
        }

    /* NumericTextBox dentro del dialog-dark */
    .dialog-dark.e-dialog .e-numerictextbox {
        background: #2d3142 !important;
        border: 1px solid rgba(100, 181, 246, 0.2) !important;
        border-radius: 6px !important;
    }

        .dialog-dark.e-dialog .e-numerictextbox input {
            background: transparent !important;
            color: #e8eaf6 !important;
        }

        .dialog-dark.e-dialog .e-numerictextbox .e-spin-up,
        .dialog-dark.e-dialog .e-numerictextbox .e-spin-down {
            color: #b0bec5 !important;
        }

            .dialog-dark.e-dialog .e-numerictextbox .e-spin-up:hover,
            .dialog-dark.e-dialog .e-numerictextbox .e-spin-down:hover {
                background: rgba(100, 181, 246, 0.1) !important;
                color: #64b5f6 !important;
            }

    /* DatePicker dentro del dialog-dark */
    .dialog-dark.e-dialog .e-datepicker {
        background: #2d3142 !important;
        border: 1px solid rgba(100, 181, 246, 0.2) !important;
        border-radius: 6px !important;
    }

        .dialog-dark.e-dialog .e-datepicker input {
            background: transparent !important;
            color: #e8eaf6 !important;
        }

        .dialog-dark.e-dialog .e-datepicker .e-input-group-icon {
            color: #b0bec5 !important;
        }

    /* CheckBox dentro del dialog-dark */
    .dialog-dark.e-dialog .e-checkbox-wrapper .e-frame {
        background: #2d3142 !important;
        border-color: rgba(100, 181, 246, 0.3) !important;
    }

        .dialog-dark.e-dialog .e-checkbox-wrapper .e-frame.e-check {
            background: #64b5f6 !important;
            border-color: #64b5f6 !important;
        }


    /* Labels dentro del dialog-dark */
    .dialog-dark.e-dialog label {
        color: #b0bec5 !important;
        font-weight: 500 !important;
    }

    /* Span requerido */
    .dialog-dark.e-dialog .required {
        color: #ef5350 !important;
    }

    /* Botones en el footer */
    .dialog-dark.e-dialog .e-footer-content .e-btn {
        border-radius: 6px !important;
        font-weight: 600 !important;
        transition: all 0.3s ease !important;
    }

        .dialog-dark.e-dialog .e-footer-content .e-btn.e-primary {
            background: #64b5f6 !important;
            border-color: #64b5f6 !important;
            box-shadow: 0 2px 8px rgba(100, 181, 246, 0.3) !important;
        }

            .dialog-dark.e-dialog .e-footer-content .e-btn.e-primary:hover {
                background: #42a5f5 !important;
                border-color: #42a5f5 !important;
                box-shadow: 0 4px 12px rgba(100, 181, 246, 0.4) !important;
                transform: translateY(-2px) !important;
            }

        .dialog-dark.e-dialog .e-footer-content .e-btn.e-flat,
        .dialog-dark.e-dialog .e-footer-content .e-btn.e-outline {
            background: transparent !important;
            color: #b0bec5 !important;
            border: 1px solid rgba(100, 181, 246, 0.2) !important;
        }

            .dialog-dark.e-dialog .e-footer-content .e-btn.e-flat:hover,
            .dialog-dark.e-dialog .e-footer-content .e-btn.e-outline:hover {
                background: rgba(100, 181, 246, 0.1) !important;
                color: #64b5f6 !important;
                border-color: #64b5f6 !important;
            }

/* Overlay del dialog-dark */
.dialog-dark + .e-dlg-overlay {
    background: rgba(0, 0, 0, 0.7) !important;
    backdrop-filter: blur(4px) !important;
}

/* =================================================================== */
/* SYNCFUSION TAB-DARK - ESTILO GLOBAL REUTILIZABLE                   */
/* Uso: <SfTab CssClass="tab-dark">                                   */
/* =================================================================== */

.tab-dark.e-tab {
    background: transparent !important;
    margin-top: 1rem !important;
}

    /* Tab Header Container */
    .tab-dark.e-tab .e-tab-header {
        background: #1e2530 !important;
        border-bottom: 2px solid rgba(100, 181, 246, 0.2) !important;
        padding: 0 !important;
        border-radius: 8px 8px 0 0 !important;
    }

        /* Tab Items (Headers) - Inactivos */
        .tab-dark.e-tab .e-tab-header .e-toolbar-item {
            background: rgba(26, 29, 41, 0.3) !important;
            border: none !important;
            border-bottom: 2px solid transparent !important;
            transition: all 0.3s ease !important;
        }

            .tab-dark.e-tab .e-tab-header .e-toolbar-item .e-tab-wrap {
                padding: 1.25rem 1.5rem !important;
                color: #8b949e !important;
                font-weight: 500 !important;
                border-radius: 8px 8px 0 0 !important;
                transition: all 0.3s ease !important;
                min-height: 3rem !important;
                display: flex !important;
                align-items: center !important;
                line-height: 1.5 !important;
            }

                .tab-dark.e-tab .e-tab-header .e-toolbar-item .e-tab-wrap:hover {
                    background: rgba(100, 181, 246, 0.08) !important;
                    color: #b0bec5 !important;
                }

            /* Active Tab - MUY VISIBLE */
            .tab-dark.e-tab .e-tab-header .e-toolbar-item.e-active {
                background: linear-gradient(135deg, #3a3f58 0%, #4a4f68 100%) !important;
                border-bottom: 3px solid #64b5f6 !important;
                box-shadow: 0 2px 8px rgba(100, 181, 246, 0.4) !important;
            }

                .tab-dark.e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
                    color: #64b5f6 !important;
                    font-weight: 700 !important;
                    text-shadow: 0 0 10px rgba(100, 181, 246, 0.5) !important;
                }

                .tab-dark.e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-wrap i {
                    color: #64b5f6 !important;
                }

                    .tab-dark.e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-text {
                        color: white !important;
                    }

    /* Tab Content */
    .tab-dark.e-tab .e-content {
        background: #1a1d29 !important;
        border: 1px solid rgba(100, 181, 246, 0.1) !important;
        border-top: none !important;
        border-radius: 0 0 8px 8px !important;
        padding: 0 !important;
    }

        .tab-dark.e-tab .e-content .e-item {
            color: #e8eaf6 !important;
            padding: 0 !important;
        }

    /* Tab Content Wrapper (para agregar padding interno) */
    .tab-content-wrapper {
        padding: 1.5rem !important;
    }

    /* Iconos en los tabs */
    .tab-dark.e-tab .e-tab-header .e-toolbar-item .e-tab-wrap i {
        margin-right: 0.5rem !important;
        font-size: 0.875rem !important;
    }

  

/* =================================================================== */
/* SCROLLBAR GLOBAL                                                    */
/* =================================================================== */

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #1a1d29;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    background: #546e7a;
    border-radius: 4px;
}

    ::-webkit-scrollbar-thumb:hover {
        background: #607d8b;
    }

/* =================================================================== */
/* SYNCFUSION EXCEL FILTER - DARK THEME                               */
/* =================================================================== */

/* Menu principal del filtro Excel */
.grid-dark .e-grid .e-filtermenudiv,
.grid-dark .e-filtermenudiv,
.e-grid .e-filtermenudiv {
    background: #2d3142 !important;
    color: #e8eaf6 !important;
}

/* Popup del filtro Excel */
.e-excelfilter.e-popup,
.e-excel-menu.e-popup {
    background: #2d3142 !important;
    border-color: rgba(100, 181, 246, 0.2) !important;
}

/* Contenedor del filtro Excel */
.e-excelfilter .e-dlg-content,
.e-excel-menu .e-dlg-content {
    background: #2d3142 !important;
    color: #e8eaf6 !important;
}

/* Input de búsqueda en el filtro Excel */
.e-excelfilter input[type="text"],
.e-excel-menu input[type="text"],
.e-searchbox input {
    background: #1e2530 !important;
    color: #e8eaf6 !important;
    border-color: rgba(100, 181, 246, 0.2) !important;
}

    .e-excelfilter input[type="text"]::placeholder,
    .e-excel-menu input[type="text"]::placeholder,
    .e-searchbox input::placeholder {
        color: #8b949e !important;
    }

/* Lista de checkboxes del filtro Excel */
.e-excelfilter .e-checkboxlist,
.e-excel-menu .e-checkboxlist {
    background: #2d3142 !important;
    color: #e8eaf6 !important;
}

    .e-excelfilter .e-checkboxlist .e-list-item,
    .e-excel-menu .e-checkboxlist .e-list-item {
        background: transparent !important;
        color: #e8eaf6 !important;
    }

        .e-excelfilter .e-checkboxlist .e-list-item:hover,
        .e-excel-menu .e-checkboxlist .e-list-item:hover {
            background: rgba(100, 181, 246, 0.1) !important;
            color: #fff !important;
        }

/* Checkboxes dentro del filtro Excel */
.e-excelfilter .e-checkbox-wrapper .e-label,
.e-excel-menu .e-checkbox-wrapper .e-label {
    color: #e8eaf6 !important;
}

.e-excelfilter .e-checkbox-wrapper .e-frame,
.e-excel-menu .e-checkbox-wrapper .e-frame {
    background: #1e2530 !important;
    border-color: rgba(100, 181, 246, 0.3) !important;
}

    .e-excelfilter .e-checkbox-wrapper .e-frame.e-check,
    .e-excel-menu .e-checkbox-wrapper .e-frame.e-check {
        background: #64b5f6 !important;
        border-color: #64b5f6 !important;
    }

/* Botones del filtro Excel */
.e-excelfilter .e-footer-content,
.e-excel-menu .e-footer-content {
    background: #2d3142 !important;
    border-top-color: rgba(100, 181, 246, 0.1) !important;
}

.e-excelfilter .e-btn,
.e-excel-menu .e-btn {
    color: #e8eaf6 !important;
    border-color: rgba(100, 181, 246, 0.2) !important;
}

    .e-excelfilter .e-btn:hover,
    .e-excel-menu .e-btn:hover {
        background: rgba(100, 181, 246, 0.1) !important;
        color: #fff !important;
    }

    .e-excelfilter .e-btn.e-primary,
    .e-excel-menu .e-btn.e-primary {
        background: #64b5f6 !important;
        border-color: #64b5f6 !important;
        color: #fff !important;
    }

/* Textos generales dentro del filtro Excel */
.e-excelfilter .e-dlg-header,
.e-excel-menu .e-dlg-header,
.e-excelfilter span,
.e-excel-menu span,
.e-excelfilter label,
.e-excel-menu label,
.e-excelfilter .e-ftrchk,
.e-excel-menu .e-ftrchk {
    color: #e8eaf6 !important;
}

/* Radio buttons en filtros personalizados */
.e-excelfilter .e-radio + label,
.e-excel-menu .e-radio + label {
    color: #e8eaf6 !important;
}

/* Dropdowns dentro del filtro Excel */
.e-excelfilter .e-dropdownlist,
.e-excel-menu .e-dropdownlist {
    background: #1e2530 !important;
    border-color: rgba(100, 181, 246, 0.2) !important;
}

    .e-excelfilter .e-dropdownlist input,
    .e-excel-menu .e-dropdownlist input {
        color: #e8eaf6 !important;
    }

/* DatePicker dentro del filtro Excel */
.e-excelfilter .e-datepicker,
.e-excel-menu .e-datepicker {
    background: #1e2530 !important;
    border-color: rgba(100, 181, 246, 0.2) !important;
}

    .e-excelfilter .e-datepicker input,
    .e-excel-menu .e-datepicker input {
        color: #e8eaf6 !important;
    }

/* NumericTextBox dentro del filtro Excel */
.e-excelfilter .e-numerictextbox,
.e-excel-menu .e-numerictextbox {
    background: #1e2530 !important;
    border-color: rgba(100, 181, 246, 0.2) !important;
}

    .e-excelfilter .e-numerictextbox input,
    .e-excel-menu .e-numerictextbox input {
        color: #e8eaf6 !important;
    }

/* Scrollbar dentro del filtro Excel */
.e-excelfilter ::-webkit-scrollbar-thumb,
.e-excel-menu ::-webkit-scrollbar-thumb {
    background: #546e7a !important;
}

/* =================================================================== */
/* GRID DARK - SELECTED ROW - MÁXIMA PRIORIDAD                        */
/* Estilos al final del archivo para mayor especificidad              */
/* ULTRA ESPECÍFICOS para sobrescribir Syncfusion                     */
/* =================================================================== */

/* Fila seleccionada - Fondo NEGRO - Todos los selectores posibles */
.grid-dark .e-grid tbody .e-row[aria-selected="true"],
.grid-dark .e-grid tbody .e-altrow[aria-selected="true"],
.grid-dark .e-grid tbody tr[aria-selected="true"],
.grid-dark .e-grid tbody .e-row.e-selectionbackground,
.grid-dark .e-grid tbody .e-altrow.e-selectionbackground,
.grid-dark .e-grid tbody tr.e-selectionbackground,
.grid-dark .e-grid tbody .e-row.e-active,
.grid-dark .e-grid tbody .e-altrow.e-active,
.grid-dark .e-grid tbody tr.e-active {
    background-color: #000000 !important;
    background-image: none !important;
    background: #000000 !important;
    color: white !important;
}

/* Celdas de fila seleccionada - Fondo NEGRO */
.grid-dark .e-grid tbody .e-row[aria-selected="true"] td,
.grid-dark .e-grid tbody .e-altrow[aria-selected="true"] td,
.grid-dark .e-grid tbody tr[aria-selected="true"] td,
.grid-dark .e-grid tbody .e-row[aria-selected="true"] .e-rowcell,
.grid-dark .e-grid tbody .e-altrow[aria-selected="true"] .e-rowcell,
.grid-dark .e-grid tbody tr[aria-selected="true"] .e-rowcell,
.grid-dark .e-grid tbody .e-row.e-selectionbackground td,
.grid-dark .e-grid tbody .e-altrow.e-selectionbackground td,
.grid-dark .e-grid tbody tr.e-selectionbackground td,
.grid-dark .e-grid tbody .e-row.e-active td,
.grid-dark .e-grid tbody .e-altrow.e-active td,
.grid-dark .e-grid tbody tr.e-active td,
.grid-dark .e-grid tbody .e-row.e-selectionbackground .e-rowcell,
.grid-dark .e-grid tbody .e-altrow.e-selectionbackground .e-rowcell,
.grid-dark .e-grid tbody tr.e-selectionbackground .e-rowcell,
.grid-dark .e-grid tbody .e-row.e-active .e-rowcell,
.grid-dark .e-grid tbody .e-altrow.e-active .e-rowcell,
.grid-dark .e-grid tbody tr.e-active .e-rowcell {
    background-color: #000000 !important;
    background-image: none !important;
    background: #000000 !important;
    color: white !important;
}

/* Fila seleccionada con hover - Mantener NEGRO */
.grid-dark .e-grid tbody .e-row[aria-selected="true"]:hover,
.grid-dark .e-grid tbody .e-altrow[aria-selected="true"]:hover,
.grid-dark .e-grid tbody tr[aria-selected="true"]:hover,
.grid-dark .e-grid tbody .e-row.e-selectionbackground:hover,
.grid-dark .e-grid tbody .e-altrow.e-selectionbackground:hover,
.grid-dark .e-grid tbody tr.e-selectionbackground:hover,
.grid-dark .e-grid tbody .e-row.e-active:hover,
.grid-dark .e-grid tbody .e-altrow.e-active:hover,
.grid-dark .e-grid tbody tr.e-active:hover {
    background-color: #000000 !important;
    background-image: none !important;
    background: #000000 !important;
    color: white !important;
}

/* Celdas de fila seleccionada con hover - Mantener NEGRO */
.grid-dark .e-grid tbody .e-row[aria-selected="true"]:hover td,
.grid-dark .e-grid tbody .e-altrow[aria-selected="true"]:hover td,
.grid-dark .e-grid tbody tr[aria-selected="true"]:hover td,
.grid-dark .e-grid tbody .e-row[aria-selected="true"]:hover .e-rowcell,
.grid-dark .e-grid tbody .e-altrow[aria-selected="true"]:hover .e-rowcell,
.grid-dark .e-grid tbody tr[aria-selected="true"]:hover .e-rowcell,
.grid-dark .e-grid tbody .e-row.e-selectionbackground:hover td,
.grid-dark .e-grid tbody .e-altrow.e-selectionbackground:hover td,
.grid-dark .e-grid tbody tr.e-selectionbackground:hover td,
.grid-dark .e-grid tbody .e-row.e-active:hover td,
.grid-dark .e-grid tbody .e-altrow.e-active:hover td,
.grid-dark .e-grid tbody tr.e-active:hover td,
.grid-dark .e-grid tbody .e-row.e-selectionbackground:hover .e-rowcell,
.grid-dark .e-grid tbody .e-altrow.e-selectionbackground:hover .e-rowcell,
.grid-dark .e-grid tbody tr.e-selectionbackground:hover .e-rowcell,
.grid-dark .e-grid tbody .e-row.e-active:hover .e-rowcell,
.grid-dark .e-grid tbody .e-altrow.e-active:hover .e-rowcell,
.grid-dark .e-grid tbody tr.e-active:hover .e-rowcell {
    background-color: #000000 !important;
    background-image: none !important;
    background: #000000 !important;
    color: white !important;
}