/* Estilos generales */
.select2 span {
    display: inline-block; /* Asegura que el span ocupe solo el ancho del contenido */
    text-align: center; /* Centra el contenido dentro del span */
    line-height: 48px; /* Alinea verticalmente el contenido en el centro */
}

span.select2, span.select2-container--default {
    border: 2px solid #CFCFCF !important;
    border-radius: 15px !important;
    width: fit-content; /* Ajusta el ancho al contenido */
    margin: 0 auto; /* Centra horizontalmente */
    height: 48px !important;
}

.select2-selection {
    border-style: none !important;
    border-radius: 15px !important;
}

.selection {
    width: 100% !important;
    height: 100% !important;
    background-color: #FFFFFF !important;
    border-radius: 15px !important;
}

.page-item {
    display: inline-block; /* Asegura que el span ocupe solo el ancho del contenido */
    text-align: center; /* Centra el contenido dentro del span */
}

.select2-selection__arrow {
    line-height: 18px !important; /* Alinea verticalmente el contenido en el centro */
}

.select2-results__option, .select2-search {
    line-height: 48px !important; /* Alinea verticalmente el contenido en el centro */
}

.form-switch input {
    min-width: 96px !important;
}

body {
    background-color: #F1F1F1;
}

.form-switch .form-check-label {
    margin-left: -30px !important;
    margin-top: 18px !important;
}

.input-group-text {
    min-height: 48px !important;
}

/* Estilos específicos para pantallas pequeñas (móviles) */
@media (max-width: 767.98px) {
    .form-check-input,
    button,
    .form-control input,
    .select2,
    .selection,
    .form-control,
    select,
    .select2-selection__arrow,
    .select2-results__option,
    .select2-search,
    .page-item {
        min-width: 48px !important;
        min-height: 48px !important;
    }
}





/* cafe 00b5d4  0a4570*/

.btn-cafe {
    color: #fff;
    background-color: #0a4570;
    border-color: #0a4570;
}

.btn-cafe:hover {
    color: #fff;
    background-color: #00b5d4;
    border-color: #00b5d4;
}

.btn-cafe:focus,
.btn-cafe.focus {
    color: #fff;
    background-color: #00b5d4;
    border-color: #00b5d4;
    box-shadow: 0 0 0 0.2rem rgba(111, 78, 55, 0.5);
}

.btn-cafe.disabled,
.btn-cafe:disabled {
    color: #fff;
    background-color: #00b5d4;
    border-color: #00b5d4;
}

.btn-cafe:not(:disabled):not(.disabled):active,
.btn-cafe:not(:disabled):not(.disabled).active,
.show > .btn-cafe.dropdown-toggle {
    color: #fff;
    background-color: #00b5d4;
    border-color: #00b5d4;
}

.bg-cafe-b {
    background: linear-gradient(135deg, #0a4570, #00b5d4);
    color: #FFF!important;

    /* Ajustar la sombra para que empiece con 10px y finalice con 1px a la derecha */
    box-shadow: 10px 0px 10px rgba(0, 0, 0, 0.3), /* sombra principal */
                7px 0px 7px rgba(0, 0, 0, 0.2),  /* sombra intermedia */
                4px 0px 4px rgba(0, 0, 0, 0.1),  /* sombra más pequeña */
                1px 0px 1px rgba(0, 0, 0, 0.05); /* sombra más suave */
}


.form-check-input-cafe {
    width: 1.25em;
    height: 1.25em;
}

.form-check-input-cafe:checked {
    background-color: #00b5d4; /* Color café (marrón) */
    border-color: #00b5d4; /* Color del borde */
}

.form-check-input-cafe:focus {
    border-color: #00b5d4;
    box-shadow: 0 0 0 0.25rem rgba(139, 69, 19, 0.25); /* Sombra color café */
}

.form-check-input-cafe:checked:hover {
    background-color: #7A3D11; /* Color café oscuro al pasar el mouse */
    border-color: #7A3D11;
}

.form-check-input-cafe:checked:focus {
    border-color: #00b5d4;
    box-shadow: 0 0 0 0.25rem rgba(139, 69, 19, 0.25);
}

.form-check-input-cafe:disabled {
    background-color: #e9ecef;
}

.form-check-input-cafe:disabled:checked {
    background-color: rgba(139, 69, 19, 0.5); /* Color café claro cuando está deshabilitado */
    border-color: rgba(139, 69, 19, 0.5);
}

.custom-focus:focus {
            border-color: #795548; /* Color café */
            box-shadow: 0 0 5px #795548; /* Resplandor de color café */
        }
        /* Estilo para select enfocado */
        .custom-focus-select:focus {
            border-color: #795548; /* Color café */
            box-shadow: 0 0 5px #795548; /* Resplandor de color café */
            outline: none; /* Quita el outline por defecto */
        }
.active:not(.text-mm) {
    border-color: #00b5d4!important;
    
}
.page-link .bg-cafe-b{
    color:#FFF!important;
}
a .bg-cafe-b{
    color:#FFF!important;
}
.nav-link:not(.text-mm) .active:not(.text-mm) {
    color: #00b5d4!important;
    
}

.selected {
    color: #00b5d4!important;
    background-color: #00b5d4 !important; /* !important se usa para asegurar que esta regla sobrescriba cualquier otra definición */
}
.focused {
    border-color: #00b5d4!important;
    box-shadow: 0 0 0 0.1rem rgba(139, 69, 19, 0.25)!important;
}
.select-input:focus {
    border-color: #00b5d4!important;
    box-shadow: 0 0 0 0.1rem rgba(139, 69, 19, 0.25)!important;
}
input:focus {
    border-color: #00b5d4!important;
    box-shadow: 0 0 0 0.1rem rgba(139, 69, 19, 0.25)!important;
}

.hover-shadow-img:hover{
    filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.5));
    transition:0.5s;
}
a:not(.sidenav-link):not(.text-white):not(.text-mm) {
    color: #0a4570!important;
}
a{
    cursor:pointer;
}
.form-outline{
    --mdb-form-outline-select-notch-border-color:#00b5d4!important;
}
#loading-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #ffffff; /* Fondo blanco, puedes cambiarlo */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999; /* Asegúrate de que esté en el frente */
}

header, main {
    display: none; /* Oculta el header y el contenido principal hasta que la página esté cargada */
}

.nav-tabs .nav-link {
    font-weight: unset !important;
    font-size: unset !important;
}
a .text-mm{
    color:#6c757d!important;
}

a .text-mm .active{
    color:#000!important;
}


@font-face {
    font-family: 'MiFuenteM';
    src: url('TECWO-BF66be02aa9bad6.ttf') format('truetype');
}

.owari {
    font-family: 'MiFuenteM', sans-serif!important;
    /* Otras propiedades de estilo como tamaño, color, etc. */
}

.btn-warning:disabled  {
    color:#000!important;
    background-color:#fff!important;
} 
.btn-warning  {
    color:#000!important;
    background-color:#fff!important;
}

.active{
    color:#000!important;
}