/* ============================================================
   CertifiD — Login marca blanca (renovación Premium)
   Conserva los selectores nativos de WordPress (#login, .login).
   La variable --certifid-brand-color la inyecta el PHP por tenant.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700;800&display=swap');

:root{
    --brand-400:#1fd093;
    --brand-500:#00b67a;
    --brand-600:#009a68;
    --brand-900:#0c3f30;
    --brand-950:#072a20;
    --ink-900:#0f211d;
    --ink-600:#4c605a;
    --ink-400:#93a39d;
    --line:#e3ebe7;
    --paper:#f4f8f6;
    --font:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
    --cfd-color: var(--certifid-brand-color, #00b67a);
}

/* Fondo: entorno SaaS premium en verde profundo */
body.login{
    background:
        radial-gradient(120% 80% at 85% -10%, rgba(31,208,147,.26), rgba(31,208,147,0) 50%),
        linear-gradient(160deg, var(--brand-900), var(--brand-950)) !important;
    min-height:100vh;
    font-family:var(--font);
}
/* Marca de agua del isotipo */
body.login::before{
    content:""; position:fixed; left:-120px; bottom:-140px; width:520px; height:520px;
    background:url('../images/isotipo-certifid-white.png') no-repeat center/contain; opacity:.05; pointer-events:none;
}

#login{
    background:#ffffff;
    padding:38px 34px 30px;
    border-radius:24px;
    box-shadow:0 40px 80px -24px rgba(0,0,0,.5);
    width:404px;
    max-width:92vw;
    margin:clamp(28px, 8vh, 90px) auto 28px !important;
    position:relative;
    z-index:1;
}

/* Avisos de WordPress (mensajes/errores) con la marca */
.login .message,
.login #login_error{
    border-left:4px solid var(--brand-500) !important;
    border-radius:10px !important;
    box-shadow:0 1px 2px rgba(11,40,32,.05) !important;
    background:var(--brand-50) !important;
    color:var(--ink-700) !important;
    font-size:13px !important;
}
.login #login_error{ border-left-color:var(--danger) !important; background:var(--danger-bg) !important; }

/* Selector de idioma de WP: discreto, fuera del foco */
.login .language-switcher{ margin-top:20px; text-align:center; opacity:.7; }

/* Logo vectorial inyectado por PHP */
.login h1 a{
    background-image:var(--certifid-brand-logo) !important;
    background-size:contain !important;
    background-position:center !important;
    background-repeat:no-repeat !important;
    width:100% !important;
    height:56px !important;
    margin-bottom:8px !important;
    display:block !important;
    text-indent:-9999px;
    overflow:hidden;
    white-space:nowrap;
}
.login h1{ margin-bottom:0 !important; }

/* Mensajes base de WP */
.login #backtoblog, .login #nav{
    text-align:center; padding:0 !important; margin-top:16px !important;
}
.login #backtoblog a, .login #nav a{
    color:var(--ink-400) !important; font-size:13px; font-weight:600; transition:color .2s ease;
}
.login #backtoblog a:hover, .login #nav a:hover{ color:var(--cfd-color) !important; }

/* Formulario */
.login form{
    background:transparent !important; border:none !important; padding:0 !important; box-shadow:none !important;
    margin-top:8px;
}
.login label{
    font-weight:600 !important; color:var(--ink-600) !important; font-size:13.5px !important;
}
.login input[type="text"], .login input[type="password"]{
    width:100% !important;
    box-sizing:border-box !important;
    border:1px solid var(--line) !important;
    border-radius:10px !important;
    padding:12px 14px !important;
    font-size:15px !important;
    color:var(--ink-900) !important;
    background:var(--paper) !important;
    transition:all .2s ease;
    box-shadow:none !important;
}
.login input[type="text"]:focus, .login input[type="password"]:focus{
    border-color:var(--brand-400) !important;
    background:#ffffff !important;
    box-shadow:0 0 0 3px rgba(0,182,122,.18) !important;
}

/* Recordarme */
.login .forgetmenot label{ color:var(--ink-600) !important; font-size:13px !important; }

/* Botón principal */
.login .button-primary{
    background:linear-gradient(180deg, var(--cfd-color), var(--brand-600)) !important;
    color:#ffffff !important;
    border:none !important;
    text-shadow:none !important;
    box-shadow:0 10px 24px -8px rgba(0,182,122,.45) !important;
    height:46px !important;
    line-height:46px !important;
    width:100% !important;
    border-radius:10px !important;
    font-weight:800 !important;
    font-size:15px !important;
    margin-top:18px !important;
    transition:filter .2s ease !important;
}
.login .button-primary:hover{ filter:brightness(1.05); }
.login .button-primary:focus{ box-shadow:0 0 0 3px rgba(0,182,122,.25) !important; }
