$login-width:400px;

.login-scroller {
    position: relative;
    height: 100vh;
    background: #f2f2f2;
}

.login-navbar {
    height: $navbar-height;
    background: $navbar-bg;
}

.login-container {
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(to bottom, #e6e5f2, #4599cd);
    z-index: 10;

    >.row::after {
        content: '';
        min-height: inherit;
        font-size: 0;
    }
}

.login-wrapper {
    width: $login-width;
    max-width: 100%;
    min-height: 300px;
    margin: auto;
    @include display-flex();
    flex-direction: column;

    font-family: $type1;
    // font-size: $default-font-size;
}

.login-head {
    min-height: 40px;
}

.login-content {
    padding: 1.5rem 0.875rem;
    background-color: rgba(223, 226, 242, 0.3);
    border-radius: 4px;

    .form-control {
        font-family: $type1;
        font-size: $default-font-size;
    }

    .btn-login {
        background-color: #CBD8EC;

        &:hover,
        &:active {
            background-color: #EFEEF8;
        }
    }

    .login-pwd-eye {
        background-color: #fff;
        cursor: pointer;
    }
}

.checkbox-pwd-eye {
    display: none;

    &+.bi {
        &::before {
            content: "\f341";
        }
    }

    &:checked+.bi {
        &::before {
            content: "\f340";
        }
    }
}