/******************************************* Etiquetas Iconos e Imagenes *******************************************/

.nomCondominio {
    color: #fff7cc;
    font-family: Adobe Caslon Pro;
    font-size: 35px;
    text-align: center;
    font-weight: bold;
    padding-top: 20px;
}

.divIconosCent {
    text-align: center;
}

.imgLogo {
    width: auto;
    height: 42px;
}


/******************************************* Body Login *******************************************/

.bodyLogin {
    /*background: #d3dcf0;*/
    background-image: url('../img/home/imagen.jpg');
    /*background-color: #b2c3ec;*/
    background-size: cover;
    /*background-repeat: no-repeat;*/
    /*background-size: 100%;*/
    /*padding: 13.6rem 10rem;*/
    /*color: #fff;*/
    /*box-shadow: 0px 0px 25px #222;*/
}

.bodyRec {
    /*background: #d3dcf0;*/
    background-image: url('../img/home/Piano.jpg');
    /*background-color: #b2c3ec;*/
    background-size: cover;
}

.logo {
    background: rgb(0 0 0 / 20%);
    backdrop-filter: blur(6px);
    height: 100vh;
    width: 100%;
    position: fixed;
}

/* Cabecera */
.marco-cabecera {
    background: #003473;
}

.marco-buscar {
    background: #000;
    color: white;
    width: 250px;
    /* position: fixed;  <-- quítalo */
    /* right: 100px;     <-- ya no hace falta */
    z-index: 2;
    /* mucho más bajo, o incluso puedes quitarlo */
    float: right;
    /* se va a la derecha dentro de su contenedor */
    margin: 10px 30px 10px 20px;
    /* separaciones para que no pegue al texto */
}

/******************************************* Ventana Emergente*******************************************/

/* AJUSTE: No forzamos z-index altísimo aquí para no romper el stacking de Bootstrap */
/* .modalFrontino { z-index: 5000; } */

/* Colores del header del modal */
.modal-header {
    color: #ffffff;
    background: #98c8fd;
}

.modal-xxl {
    max-width: 90% !important;
}

.modal-s {
    max-width: 600px !important;
}


/******************************************* Grid *******************************************/

/*
grid.setStyle(
    "background-color:navy;color:white; font-weight:bold;", "","color:red;", ""
);
*/

div.gridbox_dhx_skyblue.isModern table.hdr tr td {
    background-color: navy !important;
    color: black !important;
    font-weight: bold !important;
    font-size: 11px;
}

.gridbox {
    -webkit-box-sizing: content-box !important;
    -moz-box-sizing: content-box !important;
    box-sizing: content-box !important;
}

.div-grid-consulta {
    width: 95% !important;
}

.div-grid-consulta-alto {
    width: 90% !important;
    height-min: 300px !important;
}

.paginacion {
    background: white;
    border: 0px solid #ffffff;
    border-radius: .25rem;
    border-width: .1rem;
    width: max-content;
    padding: 5px;
    margin: 5px;
}

.label-primary {
    position: relative;
    /*display: block;*/
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #1072BA;
    font-weight: bold;
    /*
    background-color: #fff;
    border: 1px solid #dee2e6;
    float: inline-end;
    */
}

.label-info {
    color: blue;
    font-weight: bold;
}

.label-info-sel {
    background-color: blue;
    color: #ffffff;
    font-weight: bold;
    padding-left: 3px;
    padding-right: 3px;
}

/* Barra de navegación dentro de la cabecera */
.navbar {
    position: absolute;
    width: 70%;
    height: 40px;
    bottom: 0px;
    z-index: 1030;
    /* AJUSTE: por debajo del modal (1050) */
}

.navbar-nav {
    margin-bottom: revert;
}

.btn-group,
.btn-group-vertical {
    /*left: 7px;
    z-index: 100;*/
    /*background: #fff;*/
}

@media (max-width: 700px) and (min-width: 300px) {
    .imgLogo {
        width: auto;
        height: 42px;
    }

    .nomCondominio {
        display: none;
    }
}

.card-boder {
    border-radius: 20px !important;
    background: rgba(32, 19, 179, 0.6) !important;
    color: wheat !important;
}

.iconoDesktop {
    width: auto;
    height: 100px;
}

/* SELECT2 */
.select2-container .select2-selection--single .select2-selection__rendered {
    display: block;
    width: 100%;
    height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.select2-container .select2-selection--single {
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    height: 40px;
    user-select: none;
    -webkit-user-select: none;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px;
    position: absolute;
    top: 1px;
    right: 1px;
    width: 20px;
}


/* =========================
   FIJES PARA EL STACKING
   ========================= */

/* Toda la cabecera y barras por debajo del backdrop(1040) y modal(1050) */
#encabezado,
#barraEncabezado,
#barraMenuPrincipal,
.marco-cabecera {
    position: relative;
    z-index: 1030;
    /* AJUSTE */
}

/* Asegura que el backdrop quede bajo el modal pero sobre la cabecera */
.modal-backdrop {
    z-index: 1040;
    /* coincide con Bootstrap 4 */
}

/* Nota: No forzamos z-index en .modal para no bloquear el cálculo JS de stacking */