body{
    margin:0;
    height:100vh;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto;
}

/* WRAPPER */

.login-wrapper{
    display:flex;
    min-height:100vh;
    width:100%;
}

/* HERO */

.login-hero{

    flex:1.2;

    /* Fondo carbón con realce dorado (sin imagen externa). */
    background:
        radial-gradient(120% 120% at 15% 20%, rgba(201,168,106,0.18) 0%, rgba(201,168,106,0) 45%),
        linear-gradient(150deg, #26262b 0%, #1a1a1d 55%, #121214 100%);

    position:relative;

    display:flex;
    align-items:center;

    color:var(--ra-cream);
}

/* filo dorado interior + brillo sutil */

.login-hero::before{

    content:"";
    position:absolute;
    inset:0;

    border-right:2px solid var(--ra-gold);
    box-shadow:inset -12px 0 30px -20px rgba(201,168,106,0.5);
    pointer-events:none;

}

/* contenido hero */

.hero-content{

    position:relative;
    z-index:2;

    padding:80px;

    max-width:520px;

}

.hero-logo{

    height:96px;

    margin-bottom:34px;

    filter:drop-shadow(0 6px 18px rgba(0,0,0,0.55));
}

.hero-content h2{

    font-weight:700;
    font-size:34px;
    letter-spacing:0.02em;
    margin-bottom:20px;
    color:var(--ra-gold);

}

.hero-content p{

    font-size:16px;
    line-height:1.6;
    color:var(--ra-cream-muted);

}

/* PANEL LOGIN */

.login-panel{

    flex:1;

    display:flex;

    align-items:center;
    justify-content:center;

    background:var(--ra-bg-light);
    position:relative;

}

.login-credits{

    position:absolute;
    bottom:16px;
    right:24px;

    display:flex;
    align-items:center;
    gap:6px;

    font-size:0.8rem;
    color:#6c757d;
    opacity:0.85;

}

.login-credits img{
    max-height:24px;

}

/* LOGIN BOX */

.login-box{

    width:380px;

}

/* TITULO */

.login-box h3{

    font-weight:700;
    color:var(--ra-ink);
    margin-bottom:6px;

}

/* INPUT GROUP */

.input-group{

    border-radius:8px;
    overflow:hidden;

}

.input-group-text{

    background:#f1f0ec;
    border:none;
    color:var(--ra-gold-dark);

}

.form-control{
    height:48px;
}

.form-control:focus{
    box-shadow:0 0 0 0.2rem var(--ra-focus);
    border-color:var(--ra-gold-dark);
    background:#fff;
}

.password-group .btn{
    border:none;
    background:#f1f0ec;
    color:var(--ra-gold-dark);
}

/* BOTON */

.btn-login{

    background:var(--ra-gold);
    color:var(--ra-charcoal);

    border:1px solid var(--ra-gold-dark);

    height:48px;

    font-weight:700;

    border-radius:8px;

    transition:all .2s;

}

.btn-login:hover{

    background:var(--ra-gold-dark);
    color:var(--ra-charcoal);
    box-shadow:0 0 0 0.2rem var(--ra-focus);

}

/* CHECK */

.form-check{

    margin-top:10px;

}

.form-check-input:checked{
    background-color:var(--ra-gold-dark);
    border-color:var(--ra-gold-dark);
}

.form-check-input:focus{
    border-color:var(--ra-gold-dark);
    box-shadow:0 0 0 0.25rem var(--ra-focus);
}

/* PÁGINA DE ERROR (sesión expirada / CSRF) */

.error-card{
    max-width:420px;
}

.error-logo{
    height:48px;
    margin-bottom:24px;
}

.error-icon{
    font-size:2.5rem;
    color:var(--ra-gold-dark);
}

/* MOBILE */

@media(max-width:900px){

.login-hero{
    display:none;
}

.login-panel{
    flex:1;
}

}