:root{
    --mbl-green:#3c961f;
    --mbl-green-dark:#287018;
    --mbl-dark:#101820;
    --mbl-muted:#7b8794;
    --mbl-border:#dfe4ea;
}

*{box-sizing:border-box}

body.login-page{
    min-height:100vh;
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:
        radial-gradient(circle at center, rgba(255,255,255,.95), rgba(234,240,240,.95)),
        linear-gradient(135deg,#f7f9f8,#e8eeee);
    font-family:'Inter',Arial,sans-serif;
}

/* CARD PRINCIPAL */
.login-card{
    width:1040px;
    max-width:94vw;
    min-height:410px;
    background:
        linear-gradient(rgba(255,255,255,.88), rgba(255,255,255,.88)),
        url('/assets/img/fundo-logo.png') center bottom / 100% auto no-repeat;
    border:1px solid var(--mbl-border);
    border-radius:18px;
    box-shadow:0 24px 65px rgba(15,23,42,.16);
    display:grid;
    grid-template-columns:460px 1fr;
    overflow:hidden;
    position:relative;
}

/* remove gnaisse fake antigo */
.login-card::before,
.login-card::after{
    display:none;
}

/* LOGO PRINCIPAL ESQUERDA */
.login-brand{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:35px 20px 35px 45px;
    z-index:1;
}

.login-brand img{
    width:345px;
    max-width:100%;
    display:block;
    background:transparent;
    border:0;
    border-radius:0;
    padding:0;
    box-shadow:none;
}

/* LADO DIREITO */
.login-form{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:42px 70px 34px 20px;
    z-index:1;
}

/* LOGO HORIZONTAL */
.login-logo-horizontal{
    width:390px;
    max-width:100%;
    display:block;
    margin:0 auto 30px;
}

/* não usar textos extras no padrão atual */
.login-title,
.login-subtitle,
.form-group label{
    display:none;
}

.form-group{
    margin-bottom:13px;
}

/* CAMPOS */
.input-icon{
    position:relative;
}

.input-icon i{
    position:absolute;
    left:17px;
    top:50%;
    transform:translateY(-50%);
    color:#707b88;
    font-size:17px;
    width:20px;
    text-align:center;
}

.input-icon input{
    width:100%;
    height:44px;
    padding:0 14px 0 52px;
    border:1px solid #d7dde3;
    border-radius:8px;
    background:rgba(255,255,255,.94);
    color:#101820;
    font-size:15px;
    font-weight:500;
    outline:none;
    box-shadow:0 1px 2px rgba(15,23,42,.04);
}

.input-icon input::placeholder{
    color:#8994a1;
    font-weight:500;
}

.input-icon input:focus{
    border-color:var(--mbl-green);
    box-shadow:0 0 0 3px rgba(60,150,31,.12);
}

/* BOTÃO */
.login-btn{
    width:100%;
    height:50px;
    margin-top:12px;
    border:0;
    border-radius:8px;
    background:linear-gradient(180deg,#45a528,var(--mbl-green-dark));
    color:#fff;
    font-size:15px;
    font-weight:700;
    cursor:pointer;
    box-shadow:0 10px 24px rgba(60,150,31,.24);
}

.login-btn:hover{
    background:linear-gradient(180deg,#3f9d24,#246914);
}

.login-btn:active{
    transform:translateY(1px);
}

/* RODAPÉ */
.login-footer{
    margin-top:22px;
    text-align:center;
    color:#667085;
    font-size:13px;
    font-weight:600;
}

.login-footer strong{
    color:#101820;
}

/* ERRO */
.alert-error{
    background:#fee2e2;
    color:#991b1b;
    padding:10px 12px;
    border-radius:8px;
    margin-bottom:13px;
    font-size:14px;
}

/* MOBILE */
@media(max-width:900px){
    .login-card{
        grid-template-columns:1fr;
        min-height:auto;
        width:92vw;
        background:
            linear-gradient(rgba(255,255,255,.91), rgba(255,255,255,.91)),
            url('/assets/img/fundo-logo.png') center bottom / cover no-repeat;
    }

    .login-brand{
        display:none;
    }

    .login-form{
        padding:36px 28px;
    }

    .login-logo-horizontal{
        width:100%;
        max-width:370px;
    }
}

/* Ajuste fino - logo principal maior */
.login-card{
    grid-template-columns:500px 1fr;
}

.login-brand{
    padding:30px 15px 30px 45px;
}

.login-brand img{
    width:430px;
    max-width:430px;
}

/* Mantém o formulário proporcional */
.login-form{
    padding:42px 70px 34px 10px;
}

.login-logo-horizontal{
    width:380px;
    margin-bottom:28px;
}