:root {
    --colorBackgroundLoginCliente: #1e2c79;
}

.cliente {
    background-color: var(--colorBackgroundLoginCliente);
}

@media (max-width: 3840px) and (max-height: 2160px) {

    .fundo-adm {
        background-image: url('/img/login/3840x2160/Sistema.png');
    }

    .cliente, .fundo-adm, .forgot-password {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100% !important;
    }

    .forgot-password {
        background-image: url('/img/login/3840x2160/Esqueci_Senha.png');
    }

    .login-content:not(.adm-login,.forgot-pass) {
        padding-bottom: 15rem !important;
        width: 70%
    }
}

@media (max-width: 2561px) and (max-height: 1200px) {
    .fundo-adm {
        background-image: url('/img/login/2560x1200/Sistema.png');
    }

    .cliente, .fundo-adm, .forgot-password {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100% !important;
    }

    .forgot-password {
        background-image: url('/img/login/2560x1200/Esqueci_Senha.png');
    }
    .login-content:not(.adm-login,.forgot-pass) {
        padding-bottom: 15rem !important;
        width: 70%
    }
}

@media (max-width: 1920px) and (max-height: 1201px) {
    .fundo-adm {
        background-image: url('/img/login/1920x1200/Sistema.png');
    }

    .cliente, .fundo-adm, .forgot-password {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100% !important;
    }

    .forgot-password {
        background-image: url('/img/login/1920x1200/Esqueci_Senha.png');
    }

    .login-content:not(.adm-login,.forgot-pass) {
        padding-top: 5rem !important;
        padding-bottom: 1rem !important;
        width: 50%
    }
}

@media (max-width: 1920px) and (max-height: 1081px) {

    .fundo-adm {
        background-image: url('/img/login/1920x1080/Sistema.png');
    }

    .cliente, .fundo-adm, .forgot-password {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100% !important;
    }

    .forgot-password {
        background-image: url('/img/login/1920x1080/Esqueci_Senha.png');
    }

    .login-content:not(.adm-login,.forgot-pass) {
        padding-top: 0rem !important;
        padding-bottom: 1rem !important;
        width: 50%
    }
}

@media (max-width: 1600px) {

    .fundo-adm {
        background-image: url('/img/login/1440x660/Sistema.png');
    }
    .cliente, .fundo-adm, .forgot-password {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100% !important;
    }

    .forgot-password {
        background-image: url('/img/login/1440x660/Esqueci_Senha.png');
    }
    .login-content:not(.adm-login,.forgot-pass) {
        padding-top: 10rem !important;
        padding-bottom: 1rem !important;
        width: 50%
    }
}

@media (max-width: 1367px) {

    .fundo-adm {
        background-image: url('/img/login/1366x768/Sistema.png');
    }

    .forgot-password {
        background-image: url('/img/login/768x660/Esqueci_Senha.png');
    }

    .cliente, .fundo-adm, .forgot-password {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100% !important;
    }


    .login-content:not(.adm-login,.forgot-pass) {
        padding-top: 5rem !important;
        width: 50%
    }
}


@media (max-width: 1025px) {

    .adm {
        background-image: url('/img/login/768x660/Sistema.png');
    }

    .forgot-password {
        background-image: url('/img/login/768x660/Esqueci_Senha.png');
    }

    .cliente, .adm, .forgot-password {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100% !important;
    }



    .login-content:not(.forgot-pass) {
        padding-top: 5rem !important;
        width: 100%
    }
    .login-aside{
        display:none !important;
    }
}

@media (max-width: 769px) {

    .adm {
        background-image: url('/img/login/768x660/Sistema.png');
    }
    .forgot-password {
        background-image: url('/img/login/768x660/Esqueci_Senha.png');
    }
    .cliente, .adm, .forgot-password {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100% !important;
    }

    .login-content:not(.forgot-pass) {
        padding-top: 5rem !important;
        width: 100%
    }

    .login-aside {
        display: none !important;
    }
}

@media (max-width: 431px){

    .adm {
        background-image: url('/img/login/425x660/Sistema.png');
    }

    .forgot-password {
        background-image: url('/img/login/425x660/Esqueci_Senha.png');
    }

    .cliente, .adm, .forgot-password {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100% !important;
    }

    .login-content:not(.forgot-pass) {
        padding-top: 5rem !important;
        width: 70%
    }

    .logo-login {
        width: 100% !important;
    }
}

@media (max-width: 376px) {

    .adm {
        background-image: url('/img/login/375x660/Sistema.png');
    }

    .forgot-password {
        background-image: url('/img/login/375x660/Esqueci_Senha.png');
    }

    .cliente, .adm, .forgot-password {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100% !important;
    }

    .login-content:not(.forgot-pass) {
        padding-top: 10rem !important;
        width: 70%
    }
}

@media (max-width: 321px) {

    .adm {
        background-image: url('/img/login/320x660/Sistema.png');
    }

    .forgot-password {
        background-image: url('/img/login/320x660/Esqueci_Senha.png');
    }

    .cliente, .adm, .forgot-password {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100% 100% !important;
    }

    .login-content:not(.forgot-pass) {
        padding-top: 10rem !important;
        width: 70%
    }
}

.btn-login {
    background-color: #E56E0A;
    color: white;
}

.btn-login:hover {
    background-color: #d6660a !important;
    color: white !important;
}

.btn-login-green {
    background-color: #E56E0A;
    color: white;
}

.btn-login-green:hover {
    color: black !important;
}

.text-kk {
    color: #E56E0A !important;
}

.text-kk-orange {
    color: #E56E0A !important;
}

.text-kk-orange:hover {
    color: #d6660a !important;
}

.login-content {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 2rem 1rem;
}

.login-wrapper {
    width: 100%;
    max-width: 450px;
    gap: 2rem;
}

.logo-login {
    max-height: 120px;
    width: auto;
    margin-top: -20px;
    margin-left: 5px;
}