/* Color legible para TODO el footer (el tema deja el copyright en blanco y sobre fondo
   claro queda invisible, como un espacio vacio). Cubre las tres secciones. */
.footer_one,
.footer_one *,
.footer_middle_area,
.footer_middle_area *,
.footer_bottom_area,
.footer_bottom_area *,
.copyright-widget,
.copyright-widget * {
    color: #5B5A5B;
}

/* Campo de contrasena con "mostrar/ocultar" (#show_hide_password).
   Blindaje del layout: algunas pantallas (p.ej. restablecer-validar) cargan un
   Bootstrap 3 adicional sobre el Bootstrap 4 del master; en BS3 el .input-group es
   display:table y el boton del ojo se rompe hacia abajo. Forzamos el layout flex de
   BS4 con !important para que el ojo quede dentro del input en cualquier pantalla. */
.input-group#show_hide_password {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex !important;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -ms-flex-align: stretch;
    align-items: stretch;
}
#show_hide_password > .form-control {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 1% !important;
    float: none;
}
#show_hide_password > .input-group-prepend,
#show_hide_password > .input-group-append {
    display: -ms-flexbox;
    display: flex;
}
#show_hide_password .input-group-text {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    margin: 0;
}

/* Footer pegado al fondo en las paginas internas (Mi cuenta / dashboard) cuando el contenido
   es corto, para que no quede el espacio en blanco al final de la pagina. Se acota con :has()
   SOLO a las paginas con .our-dashbord (las de misdatos), asi no toca las demas pantallas ni
   las publicas con slider. En un navegador sin soporte de :has() la regla simplemente se
   ignora y queda el comportamiento de antes (no rompe nada). */
.wrapper:has(> .our-dashbord) {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
.wrapper:has(> .our-dashbord) > .footer_one {
    margin-top: auto;
}

/* Footer con dos logos (produce + INACAL). En desktop valen los estilos inline de cada logo
   (produce a la izquierda con su margen, INACAL a la derecha). En pantallas medianas y chicas
   ese reparto a los extremos queda desalineado (distinta altura por el tamano de cada logo),
   asi que aqui se centran y se alinean verticalmente. Va con !important porque los estilos
   inline de cada div solo se pueden pisar asi. */
@media only screen and (max-width: 991px) {
    .footer_middle_area .row {
        align-items: center;
    }
    .footer_middle_area .logo-widget.home1 {
        justify-content: center !important;
        margin-top: 0 !important;
    }
}