/*Forms*/
.dxbl-row {
    padding: 2rem;
}

.dxbl-group-body-content .dxbl-row {
    padding: 0;
}

.dxbl-group-header {
    background-color: var(--dxbl-group-bg) !important;
}

.dxbl-text-edit {
    border: none !important;
    font-size: 1.1rem !important;
    color: var(--kt-input-color) !important;
    min-height: 2.8rem;
    border-radius: 0.5rem;
}

    .dxbl-text-edit[readonly],
    .dxbl-text-edit.dxbl-readonly::before {
        background-color: var(--kt-secondary) !important;
        opacity: 65%;
    }

    .dxbl-text-edit > input {
        font-weight: 500;
    }

    .dxbl-text-edit.dxbl-readonly::before {
        background-color: var(--kt-secondary) !important;
        opacity: 65%;
    }

        .dxbl-text-edit.dxbl-readonly::before:has(input:read-only) {
            background-color: var(--kt-secondary) !important;
            opacity: 65%;
        }

    .dxbl-text-edit,
    .dxbl-text-edit:focus {
        background-color: var(--kt-light) !important;
        border: none;
        border-color: inherit !important;
    }

        .dxbl-text-edit.dxbl-focused,
        .dxbl-text-edit:focus-within {
            -webkit-box-shadow: none;
            box-shadow: none;
        }
        /*Botones laterales (comboboxes, datepicker, etc)*/
        .dxbl-text-edit > .dxbl-btn-group,
        .dxbl-text-edit > .dxbl-btn-group-vertical {
            background-color: inherit;
            width: 3rem;
        }

            .dxbl-text-edit > .dxbl-btn-group-vertical > .dxbl-btn:not(.dxbl-btn.dxbl-edit-btn-clear),
            .dxbl-text-edit > .dxbl-btn-group > .dxbl-btn:not(.dxbl-btn.dxbl-edit-btn-clear),
            .dxbl-text-edit > .dxbl-btn:not(.dxbl-btn.dxbl-edit-btn-clear) {
                width: 3rem;
            }

        .dxbl-text-edit.dxbl-focused > .dxbl-btn,
        .dxbl-text-edit.dxbl-focused > .dxbl-btn-group-vertical > .dxbl-btn,
        .dxbl-text-edit.dxbl-focused > .dxbl-btn-group > .dxbl-btn, .dxbl-text-edit:focus-within > .dxbl-btn,
        .dxbl-text-edit:focus-within > .dxbl-btn-group-vertical > .dxbl-btn,
        .dxbl-text-edit:focus-within > .dxbl-btn-group > .dxbl-btn {
            border-color: var(--dxbl-text-edit-border-color) !important;
        }

/*PRUEBA*/
/* Contenedor para posicionamiento relativo */
.search-wrapper {
    position: relative;
}

    /* Aseguramos que el input tenga espacio a la izquierda para el ícono */
    .search-wrapper input {
        padding-left: 2.5rem; /* Ajusta según el tamaño del ícono */
    }

    /* Posicionamiento del ícono de la lupa */
    .search-wrapper .svg-icon {
        position: absolute;
        left: 0.5rem;
        top: 50%;
        transform: translateY(-50%);
        transition: opacity 0.2s ease;
        opacity: 1;
    }

    /* Ocultar la lupa cuando el input está enfocado o tiene contenido */
    .search-wrapper input:focus + .svg-icon,
    .search-wrapper input:not(:placeholder-shown) + .svg-icon {
        opacity: 0;
    }
/*PRUEBA*/
/*para el background-color del boton de la derecha de los campos del formulario*/
.dxbl-fl-ctrl .dxbl-btn:not(.dxbl-edit-btn-clear) {
    background-color: var(--kt-secondary) !important;
    border-top-right-radius: 0.4rem;
    border-bottom-right-radius: 0.4rem;
}

.dxbl-grid-edit-form-buttons button {
    font-size: 1rem !important;
}

.dxbl-grid-popup-edit-form {
    margin-top: -15px;
}

.dxbl-grid-edit-form-buttons {
    margin-top: 10px;
}

.is-required:after {
    content: "\00a0*";
    color: red;
}

.dxbl-fl-group > .card > .card-header {
    margin-left: -10px;
    margin-bottom: -25px;
    border: none;
}

.dxbl-tagbox > .dxbl-text-edit {
    border-radius: 7px;
    padding: 5px;
}

.dxbl-text {
    font-weight: 500 !important;
    font-size: 1.075rem !important;
    padding-bottom: calc(0.5rem + 1px) !important;
}

.dxbl-col {
    margin-bottom: 1rem !important;
}

/*Listbox*/

.dxbl-list-box-render-container li {
    font-size: 1rem;
    color: var(--kt-input-color);
}

.dxbl-list-box-render-container > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li.dxbl-list-box-item-selected:not(.dxbl-list-box-item-disabled), .dxbl-list-box > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li.dxbl-list-box-item-selected:not(.dxbl-list-box-item-disabled) {
    background-color: var(--kt-primary, unset);
}

.dxbl-list-box-render-container:not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly):not(.dxbl-list-box-multi-select)[data-dx-focus-hidden] > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > :not(.dxbl-list-box-empty-data-container) > li:not(.dxbl-list-box-item-disabled):not(.dxbl-list-box-group-item):not([dxbl-top-virtual-spacer-element]):not([dxbl-bottom-virtual-spacer-element]).dxbl-list-box-item-selected:hover, .dxbl-list-box:not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly):not(.dxbl-list-box-multi-select)[data-dx-focus-hidden] > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > :not(.dxbl-list-box-empty-data-container) > li:not(.dxbl-list-box-item-disabled):not(.dxbl-list-box-group-item):not([dxbl-top-virtual-spacer-element]):not([dxbl-bottom-virtual-spacer-element]).dxbl-list-box-item-selected:hover {
    background-color: var(--kt-primary-active, unset);
}

.dxbl-list-box-render-container {
    border: none;
}

    .dxbl-list-box-render-container li.dxbl-list-box-item-focused,
    .dxbl-list-box-render-container li:focus,
    .dxbl-list-box-render-container li:active {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
        font-size: 1rem !important;
        color: var(--kt-input-color);
        background-color: var(--kt-light-active);
    }

.dxbl-dropdown > .dxbl-dropdown-dialog.dxbl-edit-dropdown, .dxbl-modal > .dxbl-modal-root > .dxbl-popup.dxbl-edit-dropdown > .dxbl-modal-content {
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.30);
}

.dxbl-group > .dxbl-group-header::before {
    background-color: #ffff;
}

dxbl-combobox input {
    cursor: pointer !important;
}

.dxbl-dropdown > .dxbl-dropdown-dialog.dxbl-edit-dropdown > .dxbl-edit-dropdown-body .dxbl-listbox, .dxbl-modal > .dxbl-modal-root > .dxbl-popup.dxbl-edit-dropdown > .dxbl-modal-content > .dxbl-edit-dropdown-body .dxbl-listbox {
    width: 100%;
}

.form-check-input {
    height: 1.4rem !important;
    width: 1.4rem !important;
}

    .form-check-input:checked {
        border: none !important;
    }

.form-check-label {
    font-size: 1rem;
    font-weight: 500;
}

.dxbl-treeview .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled).dxbl-checkbox-checked:not(.dxbl-readonly) > .dxbl-checkbox-check-element:not(:hover), .dxbl-treeview .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled).dxbl-checkbox-indeterminate:not(.dxbl-readonly) > .dxbl-checkbox-check-element:not(:hover) {
    background-color: var(--kt-primary-active);
}

.dxbl-treeview .dxbl-checkbox {
    --dxbl-checkbox-check-element-checked-hover-bg: var(--kt-primary-active);
}

.dxbl-checkbox label {
    font-size: 1rem !important;
    font-weight: 500;
}

.dxbl-edit-btn-dropdown {
    background-color: inherit !important;
}

.dxbl-input-group.input-group input.dxbl-text-edit:focus,
.dxbl-text-edit:focus {
    background-color: var(--kt-light-active) !important;
}

.input-group > .dxbl-input-group-append .dxbl-editor-clear-btn.btn:hover::before {
    background-color: transparent;
}

.custom-switch input {
    width: 2.5rem !important;
}

.dxbl-checkbox label {
    margin-top: 10px !important;
}

.dxbl-grid-edit-form-buttons .dxbl-btn {
    border-radius: 0.475rem;
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.5;
    box-shadow: none;
    border: 0;
    height: 3rem;
}

.dxbl-grid-edit-form-buttons .dxbl-btn-primary {
    color: var(--kt-primary-inverse);
    border-color: var(--kt-primary);
    background-color: var(--kt-primary);
}

.dxbl-btn-primary:hover {
    background-color: var(--kt-primary-active) !important;
}

.dxbl-group {
    padding: 1rem;
    --dxbl-group-border-color: #ebe8e8;
}

.dxbl-date-time-edit-calendar {
    width: auto !important;
}

.dxbl-dropdown > .dxbl-dropdown-dialog.dxbl-edit-dropdown .dxbl-edit-dropdown-header, .dxbl-modal > .dxbl-modal-root > .dxbl-popup.dxbl-edit-dropdown > .dxbl-modal-content .dxbl-edit-dropdown-header {
    background-color: var(--dxbl-edit-dropdown-bg) !important;
}

.dxbl-dropdown > .dxbl-dropdown-dialog.dxbl-edit-dropdown > .dxbl-edit-dropdown-body > *, .dxbl-modal > .dxbl-modal-root > .dxbl-popup.dxbl-edit-dropdown > .dxbl-modal-content > .dxbl-edit-dropdown-body > * {
    width: 22rem;
}

/*Comboboxes*/
.dxbl-dropdown-dialog {
    border-radius: 1rem !important;
}

.dxbl-listbox .dxbl-editor-input-container .dx-reset-readonly-style {
    background-color: var(--kt-light) !important;
}

.dxbl-listbox {
    background-color: var(--kt-light) !important;
    border-radius: 0.55em;
    border: none;
}

.dxbl-dropdown > .dxbl-dropdown-dialog.dxbl-edit-dropdown-shown, .dxbl-modal > .dxbl-modal-root > .dxbl-popup.dxbl-edit-dropdown > .dxbl-modal-content-shown {
    border-radius: 0.45em !important;
}

.dxbl-listbox-item {
    color: var(--kt-input-color) !important;
    margin-top: 2px;
    font-size: 1.1rem;
    font-weight: 500;
}

.custom-switch-danger.dxbl-checkbox.valid.modified .form-check-input:checked {
    background-color: var(--kt-danger) !important;
    border-color: var(--kt-danger) !important;
}

.custom-switch-danger .form-check-input:checked[type=checkbox] {
    background-color: var(--kt-danger) !important;
}

.custom-switch-danger.dxbl-checkbox.form-switch.valid.modified .form-check-input {
    background-color: inherit;
    border: 1px solid rgba(0,0,0,.25)
}

/*DxMenu*/
/*EmployeeOverview Actions DxMenu*/
.dxmenu-employee-overview .dropdown-menu {
    border-radius: 0.475rem !important;
}

@media only screen and (min-width: 1900px) {
    .dxmenu-employee-overview .dropdown-menu {
        transform: matrix(1, 0, 0, 1, -22, 12) !important;
    }
}

.dxbl-menu .dxbl-menu-item-list > .dxbl-menu-list-item > .dxbl-menu-item > .dxbl-btn:not(.dxbl-disabled):not(:disabled).dxbl-active:not(.dxbl-disabled):not(:disabled):hover::before {
    background-color: transparent !important;
}

.dxbl-menu .dxbl-menu-item-list > .dxbl-menu-list-item > .dxbl-menu-item > .dxbl-btn:not(.dxbl-disabled):not(:disabled).dxbl-active:not(:hover)::before {
    background-color: transparent !important;
}

.dxbl-menu-dropdown.dxbl-dropdown-dialog > .dxbl-dropdown-body .dxbl-menu-item-list > .dxbl-menu-list-item > .dxbl-menu-item > .dxbl-btn:not(.dxbl-disabled):not(:disabled):hover:not(.dxbl-selected):not(.dxbl-active)::before {
    background-color: transparent !important;
}

.dxbl-dropdown > .dxbl-dropdown-dialog, .dxbl-itemlist-dropdown > .dxbl-dropdown-dialog {
    border: none !important;
    padding: 0.5rem;
}

.dxbl-menu-dropdown-item {
    font-size: 1rem !important;
}

/*Menu separator opacity*/
.dxbl-menu .separator {
    opacity: 1;
}

.dx-menu-item-text-bold .dx-menu-item-text {
    font-weight: 500;
}

/*No background color when hovering a submenu*/
.dxbl-menu .dx-menu-item > dxbl-menu-item > a:not(disabled):focus:before,
.dxbl-menu .dx-menu-item > dxbl-menu-item > a:not(disabled):hover.selected:not(.mute-selection):before,
.dxbl-menu .dx-menu-item > dxbl-menu-item > a:not(disabled):hover:before {
    background-color: transparent;
}

/*Submenu shadow*/
.dxbl-menu .dropdown-menu.dx-dropdown-menu {
    box-shadow: 0 0.25rem 1.5rem rgb(0 0 0 / 12%);
    padding: 0.5rem;
    position: fixed;
}

.submenu-item-low-padding {
    padding: 0.3rem !important;
}

.dropdown-menu {
    min-width: 9rem !important;
}

/*Forms validation*/
.invalid .dxbl-input-group input.dxbl-text-edit,
.invalid .dxbl-input-group textarea.dxbl-text-edit,
.invalid.dxbl-tagbox .dxbl-text-edit {
    background-color: #ffefef !important;
}

    .invalid .dxbl-input-group input.dxbl-text-edit:focus,
    .invalid .dxbl-input-group textarea.dxbl-text-edit:focus,
    .invalid.dxbl-tagbox .dxbl-text-edit:focus {
        background-color: #ffeaea !important;
    }

/*Avoids checkboxes to turn green*/
.dxbl-checkbox.valid.modified .form-check-input:checked {
    background-color: #009ef7 !important;
    border-color: #009ef7 !important;
}

.dxbl-checkbox.valid.modified .form-check-input,
.dxbl-checkbox .custom-control > .custom-control-input {
    background-color: #f5f8fa;
    border: 1px solid rgba(0,0,0,.25);
}

.form-check-input:checked[type=checkbox] {
    background-color: #009ef7 !important;
}

/*Dialogs*/
.large-popup {
    max-width: 1000px !important;
}

.xlarge-popup {
    max-width: 1300px !important;
}

.xxlarge-popup {
    width: 1500px !important;
    max-width: 1500px !important;
}

.full-screen-popup {
    width: 95vw !important;
    max-width: none !important;
    max-height: none !important;
    overflow-y: auto;
}

.popup-content-wrapper {
    max-width: 100%;
    max-height: 100%;
    overflow: auto;
    box-sizing: border-box;
    padding: 1rem;
}

.full-screen-popup .dx-popup-content {
    padding: 0 !important;
    height: 100% !important;
    max-height: 100vh !important;
    overflow: hidden;
}

.dxbl-popup {
    animation-duration: 0.3s;
    animation-timing-function: ease;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: none;
    animation-play-state: running;
    animation-name: swal2-show;
}

.dxbl-modal-header {
    border-radius: 0.75rem !important;
    border-bottom: none !important;
}

.dxbl-modal-footer {
    border-radius: 0.75rem !important;
    border-top: none !important;
}

.dxbl-modal-content {
    border-radius: 0.75rem !important;
}

.dxbl-modal-title {
    font-size: 1.5rem !important;
    font-weight: 600 !important;
    margin-left: 20px;
    margin-top: 0.9rem !important;
    margin-bottom: 0.8rem !important;
}

dxbl-modal > .dxbl-modal > .dxbl-popup .dxbl-popup-header-button {
    margin-right: 0.8rem;
}

.dxbl-popup-header-button > .dxbl-image {
    height: 1.5rem;
    width: 1.5rem;
}

.dxbl-modal-header,
.dxbl-modal-footer {
    background-color: var(--dxbl-popup-bg) !important;
    border-color: #e7e9eb !important;
}

/*DxGrid*/
.dxbl-grid {
    border: none;
}

    .dxbl-grid .dxbl-grid-table > tbody > tr > td, .dxbl-grid .dxbl-grid-table > tbody > tr > th,
    .dxbl-grid .dxbl-grid-table > tfoot > tr > td, .dxbl-grid .dxbl-grid-table > tfoot > tr > th,
    .dxbl-grid .dxbl-grid-table > thead > tr > td, .dxbl-grid .dxbl-grid-table > thead > tr > th {
        font-size: 1rem !important;
        border: none;
    }

.dxbl-grid-header-row {
    background-color: inherit !important;
}

.dxbl-grid-header-content {
    color: #b7bbc1;
}

.custom-dxgrid .dxbl-grid-filter-row {
    display: none; /*Hides default searchbars of DxGrid (we only want to show our custom searchbar)*/
}

.dxbl-grid-filter-row dxbl-input-editor {
    min-height: 2rem;
    margin-right: 0.4rem !important;
}

.custom-dxgrid-zebra table tbody tr:nth-child(even) {
    background-color: #d3e2f736;
}

.custom-dxbl-grid .dxbl-grid-table .dxbl-grid-selected-row:not(.dxbl-grid-focused-row):not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell) {
    background-color: aqua;
}

.custom-dxgrid {
    border-radius: 0px !important;
}

    .custom-dxgrid thead {
        background-color: inherit !important;
    }

    .custom-dxgrid table tbody tr {
        color: #7e8299;
        font-weight: 500;
    }

        .custom-dxgrid table tbody tr:nth-child(odd) {
            background-color: transparent;
        }

    .custom-dxgrid:not(.custom-dxgrid-zebra) table tbody tr:nth-child(even) {
        background-color: transparent;
    }

    .custom-dxgrid table tbody .dxbl-grid-group-row {
        background-color: #1e1e2d0f;
        font-weight: 600;
    }

    .custom-dxgrid table th {
        background-color: transparent !important;
        font-size: 1rem !important;
        color: #b5b5c3;
    }

    .custom-dxgrid.dashboard-maxheight {
        max-height: 220px !important;
        overflow-y: auto !important;
    }

.grid-button-icon {
    height: 5px;
    max-height: 9px;
    font-size: 1.3rem !important;
    margin-left: 4px;
    margin-top: 5px;
}

table tr,
table th,
table td {
    border-bottom-width: thin !important;
    border-bottom-style: dashed !important;
    border-bottom-color: var(--kt-light-active) !important;
}

.dxbl-grid-sort-asc, .dxbl-grid-sort-desc {
    margin-left: inherit;
}

/*DxGrid pagination style*/
.dxbl-pager {
    --dxbl-pager-btn-border-width: unset;
}

.dxbl-pager-container {
    justify-content: center;
    padding-top: 0.6rem !important;
    padding-bottom: 0rem !important;
}

.dxbl-pager-active-page-btn {
    color: var(--bs-pagination-hover-color) !important;
    background-color: var(--kt-light-active);
}

.dxbl-pager:not(:first-child) .dxbl-pager-page-btn {
    width: 4rem !important;
    padding-top: 0.4rem !important;
}

.dxbl-pager .dxbl-page-selector input {
    border-radius: 0.6rem !important;
}

.dxbl-pager-page-btn {
    width: 2rem;
    font-size: 1.05rem;
    color: grey;
    margin-left: 1rem;
    margin-right: 1rem;
    border-radius: 0.45em;
}

.dxbl-pager-active-page-btn {
    background-color: var(--kt-secondary-light) !important;
    color: var(--kt-primary) !important;
}

.dxbl-pager .dxbl-btn {
    border-radius: 0.45em;
    margin-left: 0.8rem !important;
    margin-right: 0.8rem !important;
}

.dxbl-pager-page-edit-text {
    padding-bottom: unset !important;
    color: grey;
}

.dxbl-pager-page-edit {
    color: var(--kt-primary) !important;
}

/*DxGrid leveled (f.e. Calendars)*/
tr.dxbl-grid-group-row td {
    background-color: #f5f8fa;
    border-radius: 0px 8px 8px 0px;
}

tr.dxbl-grid-group-row .dxbl-grid-expand-button-cell {
    border-radius: 8px 0px 0px 8px;
}


.dxbl-grid-expand-button {
    width: 18px !important;
}


/*DxGrid column search*/
.dxbl-grid-filter-row dxbl-input-editor .dxbl-text-edit-input {
    /* Reemplaza la URL base64 por la de tu icono preferido */
    background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIiB2aWV3Qm94PSIwIDAgNTEyIDUxMiI+CiAgPHBhdGggZmlsbD0iY3VycmVudENvbG9yIiBkPSJNNDE0IDM1NHEtMTgtMTgtNDEtMTFsLTMyLTMycTQzLTUzIDQzLTExOXEwLTgwLTU2LTEzNlQxOTIgMFQ1NiA1NlQwIDE5MnQ1NiAxMzZ0MTM2IDU2cTcwIDAgMTE5LTQzbDMyIDMycS02IDI0IDExIDQxbDg1IDg1cTEzIDEzIDMwIDEzcTE4IDAgMzAtMTNxMTMtMTMgMTMtMzB0LTEzLTMwem0tMjIyLTEzcS02MiAwLTEwNS41LTQzLjVUNDMgMTkyVDg2LjUgODYuNVQxOTIgNDN0MTA1LjUgNDMuNVQzNDEgMTkydC00My41IDEwNS41VDE5MiAzNDF6Ii8+Cjwvc3ZnPg==") no-repeat 4px center;
    padding-left: 22px; /* Ajusta según el tamaño de tu ícono */
    background-size: 14px 14px; /* Define el tamaño del ícono */
}

    /* Opcional: estilos para el placeholder */
    .dxbl-grid-filter-row dxbl-input-editor .dxbl-text-edit-input::placeholder {
        color: #999;
        font-style: italic;
    }

.dxbl-grid .dxbl-grid-table > tbody > tr.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-command-cell):not(.dxbl-grid-selection-cell) > .dxbl-text-edit:has(:focus)::after, .dxbl-grid .dxbl-grid-table > tfoot > tr.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-command-cell):not(.dxbl-grid-selection-cell) > .dxbl-text-edit:has(:focus)::after, .dxbl-grid .dxbl-grid-table > thead > tr.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-command-cell):not(.dxbl-grid-selection-cell) > .dxbl-text-edit:has(:focus)::after {
    border-bottom: calc(var(--dxbl-grid-inplace-edit-border-width)) var(--dxbl-text-edit-border-style) #378cc5 !important;
}

/*DxCalendar*/
.dxbl-calendar {
    border: none;
    --dxbl-calendar-border-radius: 0.625rem !important;
    --dxbl-calendar-line-height: 2rem !important;
    --dxbl-calendar-not-current-month-color: #909497 !important;
    --dxbl-calendar-border-color: #e9e9e9 !important;
    --dxbl-calendar-item-selected-bg: #dae5ed !important;
}

.dxbl-calendar-content {
    margin: 0 !important;
    padding: 0 !important;
}

.dxbl-active.dxbl-date-time-edit-tabs-date span span.dxbl-tabs-text-overflow,
.dxbl-active.dxbl-date-time-edit-tabs-time span span.dxbl-tabs-text-overflow {
    color: var(--kt-primary-active) !important;
    /*background-color: var(--kt-primary) !important;*/
    /*border-bottom-color: var(--kt-primary) !important;*/
}

.dxbl-tabs > .dxbl-tabs-tablist > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl):not(.dxbl-disabled):not(:disabled).dxbl-active::after, .dxbl-tabs > .dxbl-tabs-tablist > ul > li > .dxbl-tabs-item:not(.dxbl-tabs-tmpl):not(.dxbl-disabled):not(:disabled).dxbl-active::after {
    background-color: var(--kt-primary-active) !important;
}

.dxbl-calendar th:empty {
    display: none;
}

.dxbl-calendar.dxbl-readonly > .dxbl-calendar-content::before {
    background-color: transparent;
    font-size: 1rem !important;
}

.dxbl-calendar:not(.dxbl-disabled):not(:disabled) .dxbl-calendar-content > table > tbody > tr td:not(.dxbl-calendar-disabled-item):not(.dxbl-calendar-week-number):not(.dxbl-calendar-selected-range):not(.dxbl-disabled):not(:disabled):hover {
    border-radius: 20px;
    --dxbl-calendar-item-hover-bg: var(--kt-light-active);
}

.dxbl-calendar-selected-range {
    border-radius: 20px;
}

.dxbl-calendar table {
    width: 100% !important;
    padding-right: calc(var(--bs-gutter-x) * 0.5) !important;
    padding-left: calc(var(--bs-gutter-x) * 0.5) !important;
    margin-right: auto !important;
    margin-left: auto !important;
}

    .dxbl-calendar table td, .dxbl-calendar table th {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

.dxbs-calendar td:not(.dxbs-day) {
    display: none;
}

.dxbl-calendar-days-of-week {
    margin-right: 3rem;
}

.dxbl-calendar-week-number {
    display: none;
}

.dxbl-calendar-days-of-week > td {
    display: none !important;
}

.dxbl-calendar-header {
    background-color: var(--dxbl-calendar-bg) !important;
    min-height: 4rem;
    border-radius: 15px 15px 0 0 !important;
    padding: 0 !important;
}

.dxbl-calendar-footer {
    background-color: var(--dxbl-calendar-bg) !important;
    padding: 3px;
}

    .dxbl-calendar-footer button {
        --dxbl-btn-box-shadow: unset !important;
        background-color: var(--kt-secondary-light) !important;
        border-radius: 0.45em;
    }

.dxbl-calendar:not(.dxbl-disabled):not(:disabled) .dxbl-calendar-content > table > tbody > tr:not(.dxbl-calendar-days-of-week) td:not(.dxbl-calendar-disabled-item):not(.dxbl-calendar-week-number).dxbl-calendar-selected-item:not(.dxbl-disabled):not(:disabled):hover {
    background-color: var(--kt-primary) !important;
    color: white;
}

.dxbl-calendar:not(.dxbl-disabled):not(:disabled) .dxbl-calendar-content > table > tbody > tr:not(.dxbl-calendar-days-of-week) td:not(.dxbl-calendar-disabled-item):not(.dxbl-calendar-week-number).dxbl-calendar-selected-range {
    background-color: var(--kt-primary) !important;
    color: white;
}

.dxbl-calendar:not(.dxbl-disabled):not(:disabled) .dxbl-calendar-content > table > tbody > tr:not(.dxbl-calendar-days-of-week) td:not(.dxbl-calendar-disabled-item):not(.dxbl-calendar-week-number).dxbl-calendar-selected-range {
    background-color: var(--kt-primary) !important;
    color: white;
}

.nonWorkingDaysCalendar td {
    padding: 0 !important;
}

    .nonWorkingDaysCalendar td label {
        padding: 0.3rem 1rem 0.3rem 1rem;
    }

.dxbl-calendar .dxbl-calendar-header button {
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--kt-input-color);
    padding: 0.7rem !important;
    border-radius: 0.5rem !important;
}

.dxbl-calendar-day {
    margin-right: 0.5rem;
    margin-left: 0.5rem;
}

.dxbl-calendar-footer {
    padding: .5rem 1rem !important;
}

.dxbl-calendar-selected-item,
.dxbl-calendar:not([disabled]):not([readonly])
.dxbl-calendar-table td:not(.dxbl-calendar-disabled-item):not(.dxbl-calendar-table-today):not(.dxbl-calendar-table-week-number):active {
    background-color: var(--kt-light-active);
    border-radius: 20px;
}

.dxbl-calendar:not([disabled]):not([readonly]) .dxbl-calendar-header button:hover,
.dxbl-calendar:not([disabled]):not([readonly]) .dxbl-calendar-header button:not([disbled]):hover {
    background-color: var(--kt-light-active);
    color: var(--kt-primary);
    border-radius: 5px;
}

.dxbl-calendar:not([disabled]):not([readonly])
.dxbl-calendar-table td:not(.dxbl-calendar-disabled-item):not(.dxbl-calendar-table-today):not(.dxbl-calendar-table-week-number):not(.dxbl-calendar-selected-item):not(.dxbl-calendar-table-week-number):hover {
    background-color: var(--kt-light);
    border-radius: 20px;
}

.dxbl-calendar dxbl-calendar-table-container table .dxbl-calendar-today {
    border-radius: 20px;
}

.dxbl-calendar-days-of-week {
    font-family: 'Oxygen Mono', monospace !important;
}

    .dxbl-calendar-days-of-week th {
        font-size: 1rem !important;
    }

.dxbl-calendar .dxbl-calendar-content .dxbl-calendar-today {
    border: solid 1px var(--kt-primary) !important;
}

/*CHECKBOXES*/
.dxbl-checkbox {
    --dxbl-checkbox-check-element-unchecked-border-width: unset !important;
    --dxbl-checkbox-check-element-checked-bg: var(--kt-primary);
    --dxbl-checkbox-radio-check-bg: var(--kt-primary);
    --dxbl-checkbox-radio-checked-border-color: var(--kt-primary);
    --dxbl-checkbox-radio-check-bg: var(--kt-primary);
    --dxbl-checkbox-radio-checked-border-color: var(--kt-primary-active);
    --dxbl-checkbox-radio-checked-hover-bg: var(--kt-primary-active);
    --dxbl-checkbox-switch-unchecked-bg: var(--kt-secondary) !important;
    --dxbl-checkbox-switch-checked-bg: var(--kt-primary);
    --dxbl-checkbox-switch-checked-hover-bg: var(--kt-primary-active);
    --dxbl-checkbox-switch-height: 1.3rem !important;
    --dxbl-checkbox-switch-element-size: 1rem !important;
    --dxbl-checkbox-check-element-checked-hover-bg: var(--kt-primary);
    box-shadow: none !important;
}

    .dxbl-checkbox.dxbl-checkbox-checked .dxbl-checkbox-check-element:focus-within, .dxbl-checkbox.dxbl-checkbox-checked .dxbl-checkbox-check-element:has(:focus), .dxbl-checkbox.dxbl-checkbox-indeterminate .dxbl-checkbox-check-element:focus-within, .dxbl-checkbox.dxbl-checkbox-indeterminate .dxbl-checkbox-check-element:has(:focus) {
        box-shadow: none !important;
    }

    .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly).dxbl-checkbox-checked .dxbl-checkbox-check-element, .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly).dxbl-checkbox-indeterminate .dxbl-checkbox-check-element {
        background-color: var(--kt-primary);
        border-radius: 0.45em;
    }

        .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly).dxbl-checkbox-checked .dxbl-checkbox-check-element:not(.dxbl-disabled):not(:disabled):hover, .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly).dxbl-checkbox-indeterminate .dxbl-checkbox-check-element:not(.dxbl-disabled):not(:disabled):hover {
            background-color: var(--kt-primary-active);
        }

    .dxbl-checkbox input {
        position: inherit;
        min-height: 1.4rem;
        min-width: 1.4rem;
    }

input[type="checkbox"]:not(:checked) {
    border: 1px solid rgba(0,0,0,.25);
    border-radius: 0.45em;
}

.dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio).dxbl-checkbox-checked .dxbl-checkbox-check-element {
    width: 1.4rem !important;
    height: 1.4rem !important;
    border: 1px solid rgba(0,0,0,.25);
    border-radius: 0.45em;
}

    .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio).dxbl-checkbox-checked .dxbl-checkbox-check-element .dxbl-image {
        width: 1.2em;
        height: 1.2rem;
        background-color: var(--kt-primary);
        border-radius: 0.45em;
    }

.dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio).dxbl-checkbox-indeterminate .dxbl-checkbox-check-element {
    width: 1.4rem;
    height: 1.4rem;
}

.dxbl-checkbox.dxbl-checkbox-unchecked .dxbl-checkbox-check-element:focus-within, .dxbl-checkbox.dxbl-checkbox-unchecked .dxbl-checkbox-check-element:has(:focus) {
    box-shadow: unset !important;
}

.dxbl-checkbox > .dxbl-text {
    font-size: 1rem !important;
    color: var(--dxbl-fl-caption-color);
}

.form-check-input:checked[type="checkbox"] {
    background-color: var(--kt-primary) !important;
}


.dxbl-treeview .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled).dxbl-checkbox-checked > .dxbl-checkbox-check-element:not(:hover), .dxbl-treeview .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled).dxbl-checkbox-indeterminate > .dxbl-checkbox-check-element:not(:hover) {
    background-color: var(--kt-primary);
}

.dxbl-treeview .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled).dxbl-checkbox-checked > .dxbl-checkbox-check-element:not(:hover), .dxbl-treeview .dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio):not(.dxbl-disabled):not(:disabled).dxbl-checkbox-indeterminate > .dxbl-checkbox-check-element:not(:hover) {
    opacity: 100%;
}



.dxbl-checkbox.valid.modified:not([type=checkbox]) {
    --dxbl-checkbox-check-element-checked-bg: unset;
    --dxbl-checkbox-switch-checked-bg: unset;
    --dxbl-checkbox-checked-focus-shadow-color: unset;
    --dxbl-checkbox-unchecked-focus-shadow-color: unset;
    --dxbl-checkbox-check-element-checked-hover-bg: unset;
    --dxbl-checkbox-switch-checked-hover-bg: unset;
    --dxbl-checkbox-radio-checked-hover-bg: unset;
}

    .dxbl-checkbox.valid.modified:not([type=checkbox]):not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio).dxbl-checkbox-unchecked .dxbl-checkbox-check-element::before {
        border: none;
    }

dxbl-check {
    display: inline-block !important;
}

.dxbl-checkbox > .dxbl-text {
    transform: translate(0, -0.5rem) !important;
}

.custom-switch input[type="checkbox"]:not(:checked) {
    border: none !important;
}

.dxbl-checkbox.dxbl-checkbox-switch.dxbl-checkbox-unchecked .dxbl-checkbox-check-element {
    background-color: var(--kt-secondary-active);
}

.custom-switch label {
    transform: translateY(-5px);
}

dxbl-check label {
    transform: translateY(-5px);
}

.dxbl-checkbox:not(.dxbl-checkbox-switch):not(.dxbl-checkbox-radio).dxbl-checkbox-checked .dxbl-checkbox-check-element .dxbl-image {
    background-color: transparent !important;
}

/*FLYOUTS (p.e. menú de filtros)*/
.dxbl-flyout-dialog {
    border-radius: 0.6rem !important;
}

.dxbl-flyout-header {
    --dxbl-flyout-header-bg: var(--dxbl-flyout-bg) !important;
    border-bottom: none !important;
    font-size: 1.2rem !important;
    border-radius: 0.6rem !important;
}

    .dxbl-flyout-header .dxbl-text {
        margin-top: 0.6rem;
        margin-left: 1rem;
        font-size: 1.2rem !important;
    }

.dxbl-flyout-body .dxbl-row {
    padding-top: 0;
}


/* Custom Form */
.reduced-padding-form .dxbl-row {
    padding: 0.5rem;
}

.reduced-padding-form .dxbl-group-header {
    padding-top: 0;
    padding-bottom: 0;
}

.reduced-padding-form dxbl-group-control {
    padding: 0.5rem 0.5rem 0.25rem 0.5rem;
}

.reduced-padding-form .dxbl-group-body-content {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.reduced-padding-form dxbl-form-layout-item {
    margin-bottom: 0 !important;
}

/*Custom Form for printer*/
.custom-security-printer-form .dxbl-row {
    padding-top: 0 !important;
    padding-bottom: 1rem !important;
}

.reduced-padding-dxbl-layout {
    padding: -1rem !important;
    margin: -1rem !important;
    margin-right: -3rem !important;
    margin-top: -2rem !important;
}

.reduced-padding-dxbl-layout-group {
    padding: -1rem !important;
    padding-top: 1rem !important;
    margin-bottom: -1rem !important;
    margin: -1rem !important;
}

    .reduced-padding-dxbl-layout-group .dxbl-group {
        padding-bottom: 0 !important;
    }

/*Se quita el outline morado que aparece al hacer focus en las barras de búsqueda del DxGrid*/
.dxbl-grid .dxbl-grid-table > tbody > tr.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-command-cell):not(.dxbl-grid-selection-cell):focus-within, .dxbl-grid .dxbl-grid-table > tbody > tr.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-command-cell):not(.dxbl-grid-selection-cell):has(.dxbl-text-edit.dxbl-focused), .dxbl-grid .dxbl-grid-table > tfoot > tr.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-command-cell):not(.dxbl-grid-selection-cell):focus-within, .dxbl-grid .dxbl-grid-table > tfoot > tr.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-command-cell):not(.dxbl-grid-selection-cell):has(.dxbl-text-edit.dxbl-focused), .dxbl-grid .dxbl-grid-table > thead > tr.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-command-cell):not(.dxbl-grid-selection-cell):focus-within, .dxbl-grid .dxbl-grid-table > thead > tr.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-command-cell):not(.dxbl-grid-selection-cell):has(.dxbl-text-edit.dxbl-focused) {
    outline: none;
}

/* PIE CHART CARD AND LEGEND */
.dx-piechart {
    margin-left: 9.5rem !important;
    margin-right: 2.5rem !important;
}

/* Solo el donut del gráfico con la clase custompiechart */
.custompiechart .dx-piechart,
.dxc-chart {
    transform: translateX(9.7em);
}

.dxbl-chart-title {
    margin-bottom: 2rem !important;
    margin-bottom: 4rem !important;
}

dxbl-chart-title dxbl-align-center {
    padding-bottom: 4rem !important;
}

.dxbl-chart-legend-inside .dxbl-chart-legend {
    border: none !important;
    background: transparent !important;
    box-shadow: 0 4px 20px rgba(30, 41, 59, 0.11);
    border-radius: 1rem !important;
    padding: 1rem 1.5rem !important;
}

.dxbl-chart-tooltip-content-container {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
    max-width: none !important;
    display: block !important;
}

.dxbl-chart-tooltip {
    background: #fff !important;
    color: var(--kt-input-color, #24292f) !important;
    font-size: 1.12rem !important;
    border-radius: 0.8rem !important;
    padding: 0.8rem 1.35rem !important;
    border: none !important;
    min-width: 0 !important;
    max-width: 320px;
    line-height: 1.4;
    text-align: center;
    opacity: 1;
    z-index: 100;
}

.dxbl-chart-legend-icon {
    border-radius: 0.5em;
    margin-right: 10px;
}

/* Changes */

/**/
.dxbl-list-box-render-container > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul,
.dxbl-list-box > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > ul {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
    overflow: hidden;
    background-clip: padding-box;
}

/*Radios y anchura de lista de combobox*/
.dxbl-dropdown > .dxbl-dropdown-dialog.dxbl-edit-dropdown,
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.dxbl-edit-dropdown > .dxbl-modal-content {
    border-top-left-radius: 0.25rem !important;
    border-top-right-radius: 0.25rem !important;
    border-bottom-left-radius: 1rem !important;
    border-bottom-right-radius: 1rem !important;
    width: auto !important;
}

.dxbl-dropdown > .dxbl-dropdown-dialog.dxbl-edit-dropdown,
.dxbl-modal > .dxbl-modal-root > .dxbl-popup.dxbl-edit-dropdown > .dxbl-modal-content {
    min-width: max-content !important;
}

/*botones de paginación de toolbar inferior*/
:not(.dxbl-btn-plain-toolbar) > .dxbl-btn-group > .dxbl-btn-group > .dxbl-btn-split:not(:last-child):not(.dxbl-btn-last),
:not(.dxbl-btn-plain-toolbar) > .dxbl-btn-group > .dxbl-btn-group > .dxbl-btn:not(:last-child):not(.dxbl-btn-last),
:not(.dxbl-btn-plain-toolbar) > .dxbl-btn-group > .dxbl-btn-split:not(:last-child):not(.dxbl-btn-last),
:not(.dxbl-btn-plain-toolbar) > .dxbl-btn-group > .dxbl-btn:not(:last-child):not(.dxbl-btn-last) {
    width: 2.5rem !important;
    height: 2.5rem !important;
    border-radius: 50% !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.dxbl-fl .dxbl-fl-item {
    display: flex !important; /* make the item itself a flex container */
    flex: 1 1 auto !important; /* allow it to grow and fill all free space */
    justify-content: center !important; /* center children horizontally */
    align-items: center !important; /* center children vertically */
}

/*Texto de radio checkbox*/
.dxbl-checkbox:not(.dxbl-disabled):not(:disabled):not(.dxbl-readonly):hover > .dxbl-text {
    color: var(--kt-input-color, #24292f) !important; /* un gris oscuro que contraste */
}

/* === Hover styling for inline-edit columns === */
.dxbl-grid .dxbl-grid-cell[data-field="Result"]:hover,
.dxbl-grid .dxbl-grid-cell[data-field="ValidityDate"]:hover {
    background-color: #e8f5e9 !important; /* light green background */
}

    .dxbl-grid .dxbl-grid-cell[data-field="Result"]:hover i.fa-pencil,
    .dxbl-grid .dxbl-grid-cell[data-field="ValidityDate"]:hover i.fa-pencil {
        color: #28a745 !important; /* green pencil icon */
        cursor: pointer; /* show pointer on hover */
    }

.dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content .dxbl-popup-header > .dxbl-modal-header, .dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content > .dxbl-modal-header {
    border-bottom: none !important;
}

.dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content > .dxbl-modal-footer {
    border-top: none !important;
    padding-bottom: 10px !important;
    padding-top: 1px !important;
    border-bottom: none !important;
}

.dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content .dxbl-popup-header > .dxbl-modal-header, .dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content > .dxbl-modal-header {
    border-bottom: none !important;
}


/*DxListBox*/
.dxbl-list-box {
    border: none !important;
    height: auto;
}

dxbl-list-box {
    font-size: 1rem !important;
}

.select-all-checkbox {
    padding-left: 0.35rem;
}



/*.dxbl-list-box-multi-select .dxbl-checkbox input, .dxbl-list-box-multi-select dxbl-checkbox-check-element input {
    margin-top: 0.1rem;
}*/
.dxbl-list-box .dxbl-list-box-item,
.dxbl-list-box .dxbl-list-box-item-selected {
    display: flex !important;
    align-items: center !important; /* centra ambos elementos verticalmente */
    height: 2.2rem
}

    .dxbl-list-box .dxbl-list-box-item .dxbl-checkbox,
    .dxbl-list-box .dxbl-list-box-item-selected .dxbl-checkbox {
        display: flex !important;
        align-items: center !important; /* centra ambos elementos verticalmente */
    }


/*TreeView*/
.dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-treeview-item-container:not(.dxbl-disabled):not(:disabled).dxbl-active::before {
    background-color: #daf1ff !important;
}

.dxbl-treeview .dxbl-treeview-item > .dxbl-treeview-item-content > .dxbl-treeview-item-container:not(.dxbl-disabled):not(:disabled).dxbl-active{
    color: #181C32 !important;
}