/* pagina-login.css — estilos propios de login.php (extraído del <style> local + inline styles, CSP hardening) */

.login-contenedor {
    display:        flex;
    flex-direction: column;
    align-items:    center;
    justify-content: center;
    min-height:     100vh;
    padding:        24px;
}
.login-caja {
    width:     100%;
    max-width: 400px;
}
.login-logo {
    text-align:    center;
    margin-bottom: 24px;
    border-bottom: 1px solid var(--oro-oscuro);
    padding-bottom: 16px;
}
.login-titulo {
    font-family:    var(--fuente);
    font-size:      18px;
    letter-spacing: 2px;
    color:          var(--oro);
    margin-top:     10px;
    text-shadow:    0 0 12px rgba(194, 138, 29, 0.45), 0 0 4px rgba(194, 138, 29, 0.25);
}
.login-subtitulo {
    font-family:    var(--fuente);
    font-size:      9px;
    letter-spacing: 2px;
    color:          var(--oro-apagado);
    margin-top:     5px;
    text-transform: uppercase;
}
/* Pestañas */
.login-tabs {
    display:       flex;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--gris);
}
.login-tab {
    flex:         1;
    text-align:   center;
    padding:      10px 0;
    font-family:  var(--fuente-ui);
    font-size:    11px;
    letter-spacing: 1px;
    color:        var(--texto-dim);
    cursor:       pointer;
    border-bottom: 2px solid transparent;
    transition:   all 0.2s;
    text-transform: uppercase;
}
.login-tab.activa {
    color:             var(--oro);
    border-bottom-color: var(--oro);
}
/* Campos */
.login-campo {
    margin-bottom: 16px;
}
.login-campo label {
    display:        block;
    font-family:    var(--fuente);
    font-size:      9px;
    letter-spacing: 2px;
    color:          var(--texto-dim);
    margin-bottom:  6px;
    line-height:    1.5;
    text-transform: uppercase;
}
.login-campo input {
    width:       100%;
    background:  var(--fondo-panel);
    border:      1px solid var(--gris);
    padding:     12px 14px;
    color:       var(--blanco-sucio);
    font-family: var(--fuente-ui);
    font-size:   14px;
    box-sizing:  border-box;
    outline:     none;
    transition:  border-color 0.2s;
}
.login-campo input:focus {
    border-color: var(--oro-oscuro);
}
.login-campo .campo-hint {
    font-size:   11px;
    color:       var(--texto-dim);
    margin-top:  4px;
    font-style:  italic;
    opacity:     0.6;
}
/* Error / exito */
.login-error {
    background:    rgba(217, 74, 58, 0.15);
    border:        1px solid rgba(217, 74, 58, 0.4);
    border-left:   3px solid var(--rojo-vivo);
    padding:       10px 14px;
    font-size:     12px;
    color:         #e88;
    margin-bottom: 16px;
    line-height:   1.5;
}
.login-exito {
    background:    rgba(143, 170, 114, 0.15);
    border:        1px solid rgba(143, 170, 114, 0.4);
    border-left:   3px solid var(--verde-ico);
    padding:       10px 14px;
    font-size:     12px;
    color:         #8e8;
    margin-bottom: 16px;
}
.login-pie {
    text-align:  center;
    font-family: var(--fuente);
    font-size:   9px;
    letter-spacing: 1.5px;
    color:       var(--oro-apagado);
    margin-top:  24px;
    line-height: 1.8;
    opacity:     0.6;
}
.login-seccion { display: none; }
.login-seccion.activa { display: block; }

/* ── Antiguos inline styles ── */

.pg-btn-pwa {
    display: none;
    position: fixed;
    top: 12px;
    right: 12px;
    z-index: 999;
}
.pg-btn-pwa-accion {
    background: rgba(209,151,33,0.9);
    border: 1px solid #c28a1d;
    color: #c28a1d;
    padding: 8px 14px;
    font-size: 11px;
    letter-spacing: 1px;
    border-radius: 4px;
    cursor: pointer;
}
.pg-logo-img {
    width: 64px;
    height: 64px;
    opacity: 0.85;
    display: block;
    margin: 0 auto 10px;
}
.pg-mt8 {
    margin-top: 8px;
}
.pg-center-mt14 {
    text-align: center;
    margin-top: 14px;
}
.pg-link-muted {
    font-size: 11px;
    color: var(--oro-apagado);
}
.pg-texto-recuperar-intro {
    font-size: 12px;
    color: var(--texto-dim);
    line-height: 1.6;
    margin-bottom: 16px;
}
.pg-sello-mini-wrap {
    text-align: center;
    margin: 6px 0 18px;
}
.pg-sello-mini {
    width: 40px;
    height: 40px;
    opacity: 0.4;
}
.pg-registro-intro {
    font-size: 13px;
    color: var(--texto-dim);
    line-height: 1.75;
    margin-bottom: 16px;
    text-align: center;
}
.pg-txt-strong-claro {
    color: var(--blanco-sucio);
}
.pg-txt-strong-oro {
    color: var(--oro);
}
.pg-registro-sub {
    font-size: 12px;
    color: var(--texto-dim);
    line-height: 1.7;
    margin-bottom: 20px;
    text-align: center;
}
.pg-btn-block-center {
    display: block;
    text-align: center;
    text-decoration: none;
}
.pg-footer-legal {
    text-align: center;
    padding: 16px 0 4px;
    border-top: 1px solid rgba(209,151,33,0.2);
    margin-top: 12px;
}
.pg-footer-link {
    font-family: var(--fuente);
    font-size: 10px;
    letter-spacing: 1px;
    color: var(--texto-dim);
    text-decoration: none;
    margin: 0 10px;
}
.pg-footer-sep {
    color: rgba(209,151,33,0.4);
}
.pg-banner-cookies {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background: rgba(8,7,4,0.97);
    border-top: 2px solid var(--oro-oscuro);
    padding: 16px;
}
.pg-banner-titulo {
    font-family: var(--fuente);
    font-size: 9px;
    letter-spacing: 3px;
    color: var(--oro-oscuro);
    margin-bottom: 8px;
}
.pg-banner-texto {
    font-family: var(--fuente-texto);
    font-size: 12px;
    color: var(--texto-dim);
    line-height: 1.75;
    margin: 0 0 14px;
}
.pg-txt-strong-normal {
    color: var(--texto);
}
.pg-link-oro {
    color: var(--oro);
    text-decoration: none;
}
.pg-btn-banner-confirmar {
    width: 100%;
    padding: 10px;
    font-size: 11px;
}