/* Cabza Design System aplicado al producto. Sin degradados, sin blur, radios 2-4px. */
:root{
  --green-500:#3d7432;--green-600:#2f5d27;--green-700:#234a1e;--green-800:#123c21;--green-900:#0b2815;
  --green-100:#d7e6cd;--green-200:#b0cd9d;--green-300:#89b46e;--green-400:#5f9548;--green-50:#eef4ea;
  --n-0:#fff;--n-50:#f7f7f5;--n-100:#eeeeec;--n-200:#dcdcd8;--n-300:#c2c2bc;--n-400:#9a9a93;
  --n-500:#74746c;--n-600:#5a5c61;--n-700:#45464b;--n-800:#2c2e35;
  --error:#a83f32;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;min-height:100%}
body{font-family:Montserrat,system-ui,sans-serif;background:var(--n-50);color:var(--n-700);font-size:15px;line-height:1.55}
h1{letter-spacing:-0.01em}
a{color:var(--green-600)}
a:hover{color:var(--green-800)}
[hidden]{display:none !important}

/* login */
.pantalla-centro{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:48px 24px}
.marca{height:36px}
.marca-sm{height:26px}
.tarjeta{background:var(--n-0);border:1px solid var(--n-200);border-radius:4px;box-shadow:0 1px 2px rgba(27,28,32,.06)}
.tarjeta-login{width:100%;max-width:360px;padding:30px}
#form-login{display:flex;flex-direction:column;gap:16px}
.campo{display:flex;flex-direction:column;gap:6px}
.campo>span{font-size:12px;font-weight:600;color:var(--n-800)}
.campo input{font-family:inherit;font-size:15px;color:var(--n-800);background:var(--n-0);border:1px solid var(--n-300);border-radius:2px;padding:11px 13px;outline:none}
.campo input:focus{border-color:var(--green-500)}
.campo-clave{position:relative;display:flex}
.campo-clave input{flex:1;padding-right:70px}
#btn-ver{position:absolute;right:5px;top:5px;bottom:5px;padding:0 10px;font-family:inherit;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--n-500);background:transparent;border:0;border-radius:2px;cursor:pointer}
#btn-ver:hover{background:var(--n-100)}
.msg-error{margin:0;font-size:12.5px;color:var(--error)}
.pie{margin:0;font-size:11.5px;color:var(--n-400);text-align:center}

/* botones */
.boton{font-family:inherit;font-weight:600;border-radius:2px;cursor:pointer;transition:background 140ms ease,transform 140ms ease}
.boton-oscuro{background:var(--green-800);color:var(--n-0);border:1px solid transparent;font-size:15px;padding:13px 20px}
.boton-oscuro:hover{background:var(--green-900);transform:translateY(-1px)}
.boton-oscuro[disabled]{background:var(--n-200);color:var(--n-500);cursor:not-allowed;transform:none}
.boton-ancho{width:100%}
.boton-claro{background:transparent;color:var(--n-600);border:1px solid var(--n-200);font-size:12px;padding:7px 12px}
.boton-claro:hover{background:var(--n-100)}

/* barra superior */
.barra{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 28px;background:var(--n-0);border-bottom:1px solid var(--n-200)}
.barra-titulo{margin:0;font-size:17px;font-weight:700;color:var(--n-800)}
.barra-derecha{display:flex;align-items:center;gap:14px}
.usuario{font-size:13px;color:var(--n-600)}

/* hub */
#vista-hub{min-height:100vh;display:flex;flex-direction:column}
.hub{flex:1;display:flex;align-items:center;justify-content:center;padding:56px 24px}
.hub-caja{width:100%;max-width:640px;display:flex;flex-direction:column;gap:22px}
.hub-titulo h1{margin:0 0 6px;font-size:26px;font-weight:700;color:var(--n-800)}
.hub-titulo p{margin:0;font-size:14.5px;color:var(--n-500)}
.hub-rejilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.seccion{text-align:left;border-radius:4px;padding:22px;display:flex;flex-direction:column;gap:10px;font-family:inherit}
.seccion-activa{background:var(--green-800);border:1px solid var(--green-800);cursor:pointer;transition:transform 150ms ease}
.seccion-activa:hover{transform:translateY(-1px)}
.seccion-vacia{background:var(--n-0);border:1px dashed var(--n-300)}
.seccion-activa .seccion-nombre{font-size:19px;font-weight:700;color:var(--n-0)}
.seccion-activa .seccion-desc{font-size:13px;color:var(--green-200)}
.seccion-cta{margin-top:6px;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--n-0)}
.seccion-vacia .seccion-nombre{font-size:19px;font-weight:700;color:var(--n-400)}
.seccion-vacia .seccion-desc{font-size:13px;color:var(--n-400)}
.eti{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--n-400)}
.eti-verde{color:var(--green-300)}
.eti-borde{border:1px solid rgba(255,255,255,.45);padding:2px 7px;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--green-100)}

/* app financiera */
.app{min-height:100vh;display:grid;grid-template-columns:248px minmax(0,1fr)}
.lateral{background:var(--green-800);color:var(--n-0);padding:22px 18px;display:flex;flex-direction:column;justify-content:space-between;gap:28px}
.lateral-arriba{display:flex;flex-direction:column;gap:22px}
.lateral-marca{display:flex;align-items:center;gap:10px}
.lateral-marca img{height:26px;filter:brightness(0) invert(1)}
.menu{display:flex;flex-direction:column;gap:4px}
.menu-grupo{padding:14px 12px 6px;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--green-400)}
.menu a{padding:10px 12px;border-radius:2px;font-size:13.5px;color:var(--green-200);text-decoration:none}
.menu a:hover{background:var(--green-700);color:var(--n-0)}
.menu a.activo{background:var(--green-700);color:var(--n-0);font-weight:600}
.menu span.pendiente{padding:9px 12px;font-size:13.5px;color:var(--green-300)}
.boton-lateral{font-family:inherit;font-size:12px;font-weight:600;color:var(--green-100);background:transparent;border:1px solid rgba(255,255,255,.3);border-radius:2px;padding:9px 12px;cursor:pointer;text-align:left}
.boton-lateral:hover{background:var(--green-700)}
.cuerpo{display:flex;flex-direction:column;min-width:0}
.lienzo{flex:1;padding:28px;display:flex}
.vacio{flex:1;border:1px dashed var(--n-300);border-radius:4px;background:var(--n-0);display:flex;align-items:center;justify-content:center;padding:40px}
.vacio p{margin:0;max-width:44ch;text-align:center;font-size:14px;color:var(--n-400)}
@media (max-width:760px){.app{grid-template-columns:1fr}.lateral{min-height:auto}}

/* aviso de versión nueva */
.aviso-version{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;align-items:center;justify-content:center;gap:14px;
  padding:12px 18px;background:var(--green-800);color:var(--n-0);font-size:13.5px;border-top:1px solid var(--green-700)}
.aviso-version button{font-family:inherit;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--green-800);background:var(--n-0);border:0;border-radius:2px;padding:8px 14px;cursor:pointer}
.aviso-version button:hover{background:var(--green-100)}

.sello{font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--n-400);border:1px solid var(--n-200);border-radius:2px;padding:3px 7px}