.login-body{
    min-height:100vh;
}

.login-page {
    min-height: 100vh;
    /* Quitamos el degradado y dejamos solo la imagen */
    background-image: url('../img/fondo_login.jpg') !important;
    background-size: cover;
    background-position: center;
    background-color: rgb(211, 187, 81); /* Si la imagen falla, verás todo rojo */
}
.login-card{
    background:rgba(255,255,255,.94);
    backdrop-filter: blur(8px);
    border:1px solid var(--border);
    border-radius:28px;
    box-shadow:var(--shadow-md);
    padding:2rem;
}

.login-card-compact {
    max-width: 550px !important; /* El !important obliga al navegador a usar este valor */
    width: 100% !important;
    margin: 0 auto;
}

.login-logo-wrap{
    width:96px;
    height:96px;
    margin:0 auto;
    border-radius:24px;
    background:#fff;
    border:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 10px 24px rgba(217,119,6,.10);
    padding:4px;
}

.login-logo{
    width:96%;
    height:96%;
    object-fit:contain;
    display:block;
}

.form-label{
    font-weight:600;
    color:var(--title);
    margin-bottom:.45rem;
}

.input-group-modern .input-group-text{
    background:#FFF7ED;
    border:1px solid var(--border);
    border-right:0;
    color:var(--brand);
    border-radius:14px 0 0 14px;
    min-width:48px;
    justify-content:center;
}

.input-group-modern .form-control{
    border:1px solid var(--border);
    border-left:0;
    min-height:52px;
    box-shadow:none;
    color:var(--text);
}

.input-group-modern .form-control:focus{
    box-shadow:none;
    border-color:#EBCFAF;
}

.input-group-modern .form-control:has(+ .btn-toggle-password) {
    border-right: 0;
}

/* 3. Si el input es el último elemento del grupo (como en el Usuario), redondeamos su esquina derecha */
.input-group-modern .form-control:last-child {
    border-radius: 0 14px 14px 0;
}



.btn-toggle-password{
    border:1px solid var(--border);
    border-left:0;
    background:#fff;
    color:var(--muted);
    border-radius:0 14px 14px 0;
    min-width:52px;
}

.btn-toggle-password:hover{
    background:#FFFBF5;
    color:var(--brand);
}

.login-link{
    color:var(--brand);
    font-weight:600;
}

.login-link:hover{
    text-decoration:underline;
}

.alert{
    border-radius:16px;
    font-size:.95rem;
}

@media (max-width: 575.98px){
    .login-card{
        padding:1.35rem;
        border-radius:22px;
    }

    .login-card-compact{
        max-width:100%;
    }

    .login-logo-wrap{
        width:84px;
        height:84px;
    }
}