html,
body,
.login-page{

    margin:0;
    padding:0;

    width:100%;
    height:100%;

    overflow:hidden;

    background:#020066 !important;

}

/* REMOVE COMPONENTES PADRÃO ADMINLTE */

.login-logo,
.auth-logo,
.register-logo,
.card-header,
.login-box .card-header,
.login-card-body .login-logo,
.auth-header,
.login-box-msg{

    display:none !important;

}

.login-box,
.card,
.card-body,
.card-outline,
.card-primary,
.login-card-body{

    background:transparent !important;

    border:none !important;

    box-shadow:none !important;

}

/* REMOVE PADDING NATIVO */

.login-card-body,
.card-body{

    padding:0 !important;

}

.login-box{

    width:100% !important;

    max-width:100% !important;

    margin:0 auto !important;

    padding:0 !important;

}

/* CENTRALIZA */

.card-body{

    height:100vh;

    display:flex;

    justify-content:center;

    align-items:center;

    overflow:hidden;

}

/* CONTAINER */

.login-wrapper{

    width:100%;

    max-width:550px;

    padding:20px 60px;

}

/* LOGO */

.logo-area{

    text-align:center;

    margin-bottom:30px;

}

.logo-area img{

    /* width:420px; */

    max-width:100%;

    /* margin-bottom:15px; */

}

/* TITULO */

.subtitle{

    color:#FFF;

    font-size:35px;

    font-weight:700;

    margin-bottom:10px;

}

.description{

    color:rgba(255,255,255,.85);

    font-size:18px;

}

/* LABELS */

.form-label{

    display:block;

    color:#FFF;

    font-size:18px;

    margin-bottom:10px;

}

/* INPUTS */

.input-custom{

    width:100%;

    height:50px;

    background:#ECECEC;

    border:none;

    border-radius:12px;

    padding:0 25px;

    font-size:18px;

    margin-bottom:24px;

}

.input-custom:focus{

    outline:none;

    box-shadow:none;

}

/* FOOTER */

.footer-login{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-top:10px;

}

.remember{

    display:flex;

    align-items:center;

    gap:10px;

}

.remember input{

    width:22px;

    height:22px;

}

.remember label{

    color:#FFF;

    margin:0;

    font-size:17px;

}

/* BOTAO */

.btn-login{

    width:170px;

    height:50px;

    border:none;

    border-radius:12px;

    color:white;

    font-size:20px;

    font-weight:600;

    cursor:pointer;

    /* Azul da marca DuPro (#3740FF, extraído do logo) */
    background:linear-gradient(
        90deg,
        #3740FF,
        #5E5CF8
    );

    transition:filter .15s;

}

.btn-login:hover{

    filter:brightness(1.08);

}

/* CAMPO DE SENHA COM BOTÃO "MOSTRAR" */

.password-wrap{

    position:relative;

}

.password-wrap .input-custom{

    padding-right:56px;

}

.toggle-password{

    position:absolute;

    top:13px;

    right:16px;

    border:none;

    background:none;

    padding:4px;

    cursor:pointer;

    color:#6b7280;

    font-size:17px;

    line-height:1;

}

.toggle-password:hover{

    color:#111827;

}

/* LINK */

.forgot{

    text-align:center;

    margin-top:28px;

}

.forgot a{

    color:#FFF;

    text-decoration:none;

    font-size:15px;

}

/* RESPONSIVO */

@media(max-width:768px){

    html,
    body,
    .login-page{

        overflow:auto;

    }

    .login-wrapper{

        padding:25px;

    }

    .logo-area img{

        width:260px;

    }

    .subtitle{

        font-size:28px;

    }

    .description{

        font-size:15px;

    }

    .footer-login{

        flex-direction:column;

        gap:20px;

    }

    .btn-login{

        width:100%;

    }

}