/*Custom Styles para grids mas pequeños*/

.hpgrid-table-kendo {
    font-size: 14px;
    width: 100%;
    overflow-y: auto;
}

    .hpgrid-table-kendo.k-grid-header .k-header {
        background-color: #002B66;
        background-color: var(--dark-blue);
        color: white;
    }

    .hpgrid-table-kendo .k-loading-mask {
        display: none !important;
    }

    .hpgrid-table-kendo .k-grid-header .k-i-sort-asc-sm {
        color: white !important;
    }

    .hpgrid-table-kendo .k-grid-header .k-i-sort-desc-sm {
        color: white !important;
    }

    .hpgrid-table-kendo .k-grid-header .k-sort-order {
        color: white !important;
    }

    .hpgrid-table-kendo .k-alt {
        background-color: #dee2e6 !important;
    }

    .hpgrid-table-kendo tbody tr:hover:not(.k-alt) {
        background-color: transparent !important;
    }

    .hpgrid-table-kendo ::selection {
        background-color: #11acef;
        text-shadow: none !important;
        color: white !important;
    }

    .hpgrid-table-kendo .k-grid-content {
        overflow-y: auto !important;
    }

    .hpgrid-table-kendo .k-grid-norecords {
        color: #11acef;
        font-size: 18px;
        font-family: 'Monserrat-Black' !important;
        padding-top: 2rem;
        padding-bottom: 2rem;
        justify-content: center;
    }

    .hpgrid-table-kendo table {
        table-layout: fixed;
    }

    .hpgrid-table-kendo .k-grid-filter.k-state-active {
        background-color: transparent;
        color: white;
    }

        .hpgrid-table-kendo .k-grid-filter.k-state-active .k-icon {
            opacity: 1;
        }

    .hpgrid-table-kendo .k-grid-header .k-header .k-link {
        color: white !important;
        text-align: center !important;
        font-size: 12px !important;
        white-space: nowrap !important;
    }

    .hpgrid-table-kendo .k-grid-header .k-header span {
        color: white !important;
        text-align: center !important;
        font-size: 14px !important;
        white-space: nowrap !important;
        flex-direction: column;
    }

        .hpgrid-table-kendo .k-grid-header .k-header span .k-link {
            padding-block: 0px;
            padding-inline: 0px;
            padding-bottom: 8px;
            padding-top: 8px;
            order: 2; /* Coloca el k-link después del k-grid-filter-menu */
            flex-direction: row;
        }

        .hpgrid-table-kendo .k-grid-header .k-header span .k-grid-filter-menu {
            margin-inline-end: 0px;
            padding-bottom: 0px;
            margin-bottom: -12px;
            order: 1; /* Coloca el k-grid-filter-menu antes del k-link */
        }

    .hpgrid-table-kendo .k-grid-header .k-header {
        background-color: #002B66;
        background-color: var(--dark-blue);
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .hpgrid-table-kendo div.k-grid-content, .k-grid-content-locked, .k-pager-wrap {
        height: auto !important;
    }

    .hpgrid-table-kendo thead th {
        background-color: rgba(0,49,109,0.8);
        white-space: nowrap !important;
        text-align: center !important;
    }

    .hpgrid-table-kendo tbody td {
        font-family: "Monserrat","Arial" !important;
        font-size: 14px !important;
    }

    .hpgrid-table-kendo .k-detail-row {
        background-color: white;
        font-family: "Monserrat","Arial";
    }

div.hpgrid-grid-kendo {
    overflow-y: hidden;
}

.hpgrid-table-kendo-total {
    color: #002b66;
    font-family: "Monserrat","Arial";
}

.hpgrid-table-kendo-export {
    text-align: right !important;
}

    .hpgrid-table-kendo-export .k-button {
        background: #009BDE !important;
        background-color: #009BDE !important;
        color: white !important;
        font-weight: bold !important;
        border-radius: 20px !important;
        -webkit-border-radius: 20px !important;
        -moz-border-radius: 20px !important;
        border-color: #009BDE !important;
    }

        .hpgrid-table-kendo-export .k-button:hover,
        .hpgrid-table-kendo-export .k-button:active,
        .hpgrid-table-kendo-export .k-button:focus {
            background: #0089c5 !important;
            border-color: #0089c5 !important;
            color: white !important;
        }

    .hpgrid-table-kendo-export span input {
        background: none !important;
        border: none !important;
        color: white !important;
        outline: none !important;
        text-transform: uppercase !important;
    }

.hpgrid-table-kendo-total {
    color: #002b66;
    font-family: "Monserrat","Arial";
}

.hpgrid-table-kendo-bar {
    padding-bottom: 10px;
}

/* NUEVOS ESTILOS */

.k-grid .k-table-th, .k-grid td, .k-grid .k-table-td {
    border-inline-start-color: #e6e6e6;
}

.k-widget.k-tooltip {
    background-color: #00306e !important;
    font-family: 'Monserrat-SemiBold' !important;
    border-bottom-color: #00306e !important;
    border-radius: 15px !important;
    -webkit-border-radius: 15px !important;
    -moz-border-radius: 15px !important;
    padding: 3px 15px !important;
    font-size: 12px;
    text-align: center;
    white-space: nowrap;
}

.k-callout-s {
    border-top-color: #00306e !important;
}

.k-grid-header .k-table-th {
    font-weight: 400;
}

.k-grid-header th.k-header {
    padding: .786em .6em;
}

.k-table-md .k-table-td {
    padding-inline: 10px;
}

.k-grid .k-table-thead, .k-grid .k-table-tbody, .k-grid .k-table-tfoot {
    text-align: center;
}

.k-grid .k-cell-inner > .k-link {
    justify-content: center;
}

.k-grid a {
    color: #007bff;
    text-decoration: none;
}

    .k-grid a:hover {
        color: #0056b3;
        text-decoration: underline;
    }

.k-grid .k-detail-row .k-detail-cell {
    overflow: auto;
}

.k-table-md {
    font-size: 12px;
}

.k-grid .k-grid-header-locked, .k-grid .k-grid-content-locked, .k-grid .k-grid-header-locked .k-table-th, .k-grid .k-grid-content-locked td, .k-grid .k-grid-content-locked .k-table-td {
    border-color: #e6e6e6;
}

/*------------------------------------------
DIV
------------------------------------------*/
#divGridContainerReferences {
    overflow: hidden;
}

/* ------------- BACKGROUND ----------------*/

.hpgrid-text-bold {
    font-weight: bold !important;
}

.hpgrid-table-kendo .k-grid .hpgrid-table-kendo .k-table-tbody > .hpgrid-table-kendo .k-table-row:not(.k-detail-row):hover, .hpgrid-table-kendo.k-grid .hpgrid-table-kendo .k-table-tbody > .hpgrid-table-kendo .k-table-row:not(.k-detail-row).k-hover {
    background-color: transparent !important;
}

/*---------------------------------------------------------------------------------------------------------------
Filtros de Kendo-Table
------------------------------------------------------------------------------------------------------------------    */
.k-filter-menu .k-filter-menu-container .k-searchbox {
    align-items: center;
    border-top-color: #e6e6e6 !important
}

    .k-filter-menu .k-filter-menu-container .k-searchbox:focus-within {
        border: 1px solid transparent !important;
    }

    .k-filter-menu .k-filter-menu-container .k-searchbox input:hover {
        box-shadow: none !important;
    }

    .k-filter-menu .k-filter-menu-container .k-searchbox input:focus {
        box-shadow: none !important;
    }

    .k-filter-menu .k-filter-menu-container .k-searchbox .k-icon {
        margin-left: 3px;
    }

.k-filter-menu .k-filter-menu-container .k-multicheck-wrap .k-item label {
    align-items: center;
}

.k-filter-menu .k-filter-menu-container .k-actions {
    justify-content: center;
}

    .k-filter-menu .k-filter-menu-container .k-actions button[type="submit"] {
        background-color: transparent;
        border: none;
        color: #00b0ff;
    }

    .k-filter-menu .k-filter-menu-container .k-actions button[type="reset"] {
        background-color: transparent;
        border: none;
    }

.k-filter-menu .k-filter-menu-container .k-searchbox:hover {
    border-color: #e6e6e6;
}

.k-filter-menu .k-filter-menu-container .k-textbox {
    background-color: white;
    border: 1px solid #e6e6e6 !important
}

.k-filter-menu .k-filter-menu-container .k-input-solid::after {
    border-width: 0 0 1px 0;
}

.k-pager-numbers-wrap select {
    border: 1px solid #e6e6e6 !important;
    border-radius: 2px !important;
    background-color: white;
    width: 3em;
}

.k-pager-input .k-textbox {
    border: 1px solid #e6e6e6 !important;
    border-radius: 2px !important;
    background-color: white;
    width: 3em;
}

    .k-pager-input .k-textbox::after {
        border-width: 0 0 1px 0;
    }

.k-upload .k-upload-button {
    background-color: white;
    box-shadow: 6px 1px 15px 0 #c9c9c9;
}

.k-button-flat-primary {
    color: inherit;
}

.k-checkbox:checked, .k-checkbox.k-checked {
    border-color: #00b0ff;
    color: white;
    background-color: #00b0ff;
}

.k-grid-header .k-grid-filter.k-active, .k-grid-header .k-table-th-column-menu.k-active, .k-grid-header .k-grid-header-menu.k-active, .k-grid-header .k-hierarchy-cell .k-icon.k-active {
    color: white;
    background-color: #02407fbd;
}

/*Estilos para tablas de bootstrap*/
.hp-table-b {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

    .hp-table-b thead th {
        background-color: #002E6D;
        color: white !important;
        font-family: "Arial", "Monserrat-Medium";
        font-size: 12px;
        white-space: nowrap;
        padding: 8px;
        text-align: center;
        border: 1px solid #ddd;
    }

    .hp-table-b tbody td {
        font-family: "Monserrat", "Arial";
        font-size: 12px;
        padding: 8px;
        border: 1px solid #ddd;
    }

    .hp-table-b .hp-selected-row {
        font-weight: bold !important;
        font-style: italic !important;
        background-color: #d4e6f1 !important;
    }

.table-striped tbody tr:nth-of-type(odd) {
    background-color: #FFF
}

.table-striped tbody tr:nth-of-type(even) {
    background-color: #dee2e6
}

/* Estilo para alinear los textos a la izquierda */
.hp-table-b tbody td {
    text-align: center;
}

    /* Estilo para las fechas y horas */
    .hp-table-b tbody td[data-type="date"],
    .hp-table-b tbody td[data-type="time"] {
        white-space: nowrap;
    }

.table td, .table th {
    vertical-align: middle;
}

.btn-circle-inverted {
    width: 36px;
    height: 36px;
    padding: 6px 0;
    border-radius: 50%;
    border: 2px solid #FFFFFF;
    background-color: #002E6D;
    color: #FFFFFF;
    text-align: center;
    font-size: 16px;
    line-height: 1.2;
    transition: background-color 0.3s, color 0.3s;
    margin-right: 12px;
}

    .btn-circle-inverted i {
        color: #FFFFFF;
    }

    .btn-circle-inverted:hover {
        background-color: #FFFFFF;
        color: #002E6D;
    }

        .btn-circle-inverted:hover i {
            color: #002E6D;
        }