header {
    height:60px;
    padding:0.5rem;
    padding-left:2rem;
    background-color: #2b77b321;
}

.input-icon {
    position: relative;
}

    .input-icon .form-control:not(:first-child) {
        padding-left: 3rem;
    }

    .input-icon .form-control:not(:last-child) {
        padding-right: 2.5rem;
    }

    .input-icon .input-icon-addon {
        position: absolute;
        left: 1rem;
        top: 0;
        height: 100%;
        display: flex;
        align-items: center;
    }

        .input-icon .input-icon-addon:last-child {
            left: auto;
            right: 1rem;
        }


.container-bg {
    background: #2B77B3;
    background: linear-gradient(360deg,rgba(43, 119, 179, 1) 16%, rgba(61, 172, 95, 1) 100%);
    background-repeat: no-repeat;
    height: calc(100vh - (60px + 40px));
    position:relative
}

    .container-bg::after {
        content: "";
        position: absolute;
        inset: 0;
        background: url("/img/logo-blanco.png") no-repeat left bottom / 45%;
        /* degradado vertical hacia arriba */
        mask-image: linear-gradient(to top, rgba(0,0,0,1) 40%, rgba(0,0,0,0) 100%);
        -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,1) 70%, rgba(0,0,0,0) 100%);
        transform: translateX(-16%);
        opacity: 0.1;
        pointer-events: none;
    }

footer {
    height: 40px;
    line-height: 15px !important;
    background-color: #ffff;
    padding: 1rem;
}

.login {
    background-color: #2872B9;
    color:white;
    border-radius:15px;
    font-weight:600;
    font-size:1.2rem;
    padding:10px 50px;
}

.login-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content:center;
    height:100%;
}

.input-login {

    background-color: transparent;
    color: white;
    border: 0;
    border-radius: 0px;
    border-bottom: 2px solid;
}

.input-login::placeholder{
    color:#c7c7c7;
}

    .input-login:focus {
        background-color: transparent;
        outline: none; /* quita el borde azul de enfoque del navegador */
        box-shadow: none; /* elimina sombras de Bootstrap */
        border-color: #2B77B3; /* cambia el color del borde al hacer foco */
        color: #fff; /* color del texto si el fondo es oscuro */
    }