/* ============================================================
   RIDEN — páginas fuera de la app (login, forgot-password, errores)
   Autocontenido: NO depende de app.css ni del tema interno (light/claro),
   así que su diseño no se mueve cuando cambie el tema de la app.
   Paleta: la misma del tema claro (grafito/plata, cero azul).
   ============================================================ */
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
:root{ --tinta:#171a26; --gris:#575e70; --gris-3:#9aa1b5; --borde:#e7e7e9; --campo:#fafafa; }
html, body { height:100%; }
body{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  -webkit-font-smoothing:antialiased; color:var(--tinta); background:#fff;
}

/* ── Layout split (login / forgot-password): full-bleed, sin card ── */
.lg-card{ width:100%; min-height:100vh; display:flex; background:#fff; }
.lg-left{ flex:1 1 44%; display:flex; align-items:center; justify-content:center;
  padding:48px 24px; }
.lg-box{ width:100%; max-width:340px; }
.lg-brand{ text-align:center; margin-bottom:30px; }
.lg-logo{ height:53px; width:auto; object-fit:contain; margin:0 auto; display:block; }
.lg-tagline{ font-size:13px; color:var(--gris); margin-top:10px; }

.lg-field{ position:relative; margin-bottom:12px; }
.lg-ic{ position:absolute; left:14px; top:50%; transform:translateY(-50%);
  width:16px; height:16px; color:var(--gris-3); pointer-events:none; }
.lg-in{ width:100%; font-size:14px; padding:13px 14px 13px 40px; border:1px solid var(--borde);
  border-radius:11px; background:var(--campo); color:var(--tinta); font-family:inherit; }
.lg-in:focus{ outline:none; border-color:#c7cad2; background:#fff;
  box-shadow:0 0 0 3px rgba(23,26,38,.06); }
.lg-in::placeholder{ color:var(--gris-3); }
/* Chrome pinta el autofill con su azul pálido propio — se aplasta con un
   inset del mismo gris del campo para que no rompa la paleta. */
.lg-in:-webkit-autofill,
.lg-in:-webkit-autofill:hover,
.lg-in:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px var(--campo) inset;
  -webkit-text-fill-color:var(--tinta);
  caret-color:var(--tinta);
  transition:background-color 9999s ease-out;
}

.lg-btn{ display:block; width:100%; margin-top:8px; padding:13px 14px; font-size:14px; font-weight:700;
  font-family:inherit; color:var(--tinta); background:#ececee; border:1px solid var(--borde);
  border-radius:11px; cursor:pointer; text-align:center; text-decoration:none; transition:background .15s; }
.lg-btn:hover{ background:#e2e2e5; }

.lg-olvide{ display:flex; align-items:center; justify-content:center; gap:5px;
  text-align:center; margin-top:18px; font-size:13px;
  color:var(--gris); text-decoration:none; }
.lg-olvide:hover{ color:var(--tinta); }
.lg-olvide svg{ width:11px; height:11px; flex-shrink:0; }

.lg-hint{ font-size:12.5px; color:var(--gris-3); margin-bottom:16px; line-height:1.5; }

.lg-flash{ display:flex; align-items:center; gap:8px; font-size:13px; padding:10px 13px;
  border-radius:10px; margin-bottom:16px; background:#fdecef; color:#8a2436;
  border:1px solid #f6ccd3; }
.lg-flash svg{ width:15px; height:15px; flex-shrink:0; }
.lg-flash.ok{ background:#e5f7ef; color:#0f6b45; border-color:#bfe9d3; }

/* ── Panel derecho: foto full-bleed ── */
.lg-right{ flex:1 1 56%; position:relative; overflow:hidden;
  background-image:url('https://dsintelligence.com/wp-content/uploads/2026/08/Diseno-sin-titulo-2026-08-16T115218.247.png');
  background-size:cover; background-position:center; }

@media (max-width:860px){
  .lg-card{ min-height:0; }
  .lg-right{ display:none; }
}

/* ── Páginas de error (403/404/429/500/trial vencido): sin split, un
   centro simple con logo, código, mensaje y acción. ── */
.err-wrap{ min-height:100vh; display:flex; align-items:center; justify-content:center;
  padding:24px; text-align:center; }
.err-box{ width:100%; max-width:380px; }
.err-logo{ height:44px; width:auto; object-fit:contain; margin:0 auto 28px; display:block; }
.err-code{ font-size:13px; font-weight:700; color:var(--gris-3); text-transform:uppercase;
  letter-spacing:.06em; margin-bottom:10px; }
.err-title{ font-size:22px; font-weight:800; letter-spacing:-.01em; margin-bottom:10px; }
.err-sub{ font-size:14px; color:var(--gris); line-height:1.55; margin-bottom:26px; }