/* ============ ROCA · Sistema de Gestión · Etiglobal ============ */
:root {
  --paper:#FFFFFF; --paper-2:#F0F5FC; --paper-3:#DDE8F5;
  --ink:#0A1929; --ink-2:#1E3558; --ink-soft:#3D5A80;
  --muted:#6B80A0; --rule:#B8CCE0;
  --rust:#1F5ABF; --rust-dark:#0C3B87;
  --olive:#0B7A93; --olive-dark:#084F60;
  --amber:#C78A2E; --gold:#E8B84F;
  --red:#C4342C; --red-dark:#8F2118;
  --num-font:'Inter',system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%;background:var(--paper);color:var(--ink);font-family:'Inter',system-ui,sans-serif;line-height:1.4}
a{color:inherit;text-decoration:none}
button{font-family:inherit}

/* ============ AUTH (login + cambio clave) ============ */
body.auth-page{
  background:linear-gradient(135deg,#0A1929 0%,#1E3558 100%);
  min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px
}
.auth-shell{width:100%;max-width:420px}
.auth-card{
  background:#fff;border:2px solid var(--ink);padding:36px 32px;
  box-shadow:0 30px 80px rgba(10,25,41,.4)
}
.auth-brand{display:flex;align-items:center;gap:8px;margin-bottom:24px;flex-wrap:wrap}
.auth-dot{width:10px;height:10px;background:#FFEB3B;border-radius:50%;box-shadow:0 0 8px rgba(255,235,59,.7);animation:dot-pulse 2s ease-in-out infinite;flex-shrink:0}
@keyframes dot-pulse{0%,100%{opacity:1}50%{opacity:.4}}
.auth-name{font-family:'JetBrains Mono',monospace;font-size:13px;letter-spacing:.22em;font-weight:800;color:var(--ink)}
.auth-sub{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.18em;color:var(--muted);text-transform:uppercase}
.auth-title{font-size:26px;font-weight:800;letter-spacing:-.02em;line-height:1;margin-bottom:20px}
.auth-info{padding:12px 14px;background:#FFF8E5;border-left:3px solid var(--amber);font-size:13px;line-height:1.5;color:var(--ink-2);margin-bottom:18px}
.auth-error{padding:12px 14px;background:#FFE5E5;border-left:3px solid var(--red);font-size:13px;line-height:1.5;color:var(--red-dark);margin-bottom:18px;font-weight:500}
.auth-form{display:flex;flex-direction:column;gap:16px}
.field{display:flex;flex-direction:column;gap:6px}
.field span{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--ink-soft)}
.field input{
  font-family:'Inter',sans-serif;font-size:14px;padding:12px 14px;
  border:1.5px solid var(--rule);background:var(--paper);color:var(--ink);
  outline:none;font-weight:500;border-radius:0;transition:border-color .15s ease
}
.field input:focus{border-color:var(--rust)}
.btn-primary{
  background:var(--ink);color:var(--paper);border:1.5px solid var(--ink);
  padding:13px 18px;font-family:'JetBrains Mono',monospace;font-size:11px;
  letter-spacing:.18em;text-transform:uppercase;font-weight:700;cursor:pointer;
  transition:all .15s ease;margin-top:6px
}
.btn-primary:hover{background:var(--rust);border-color:var(--rust)}
.auth-foot{margin-top:22px;padding-top:14px;border-top:1px solid var(--rule);
  font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--muted);text-align:center}
.auth-foot a{color:var(--rust);font-weight:600}
.auth-foot a:hover{color:var(--rust-dark)}

/* ============ DASHBOARD ============ */
body.dashboard-page{padding-top:54px}

.topnav{
  position:fixed;top:0;left:0;right:0;z-index:5000;
  background:linear-gradient(135deg,#0A1929 0%,#1E3558 100%);
  padding:10px 20px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  border-bottom:1.5px solid #0A1929;box-shadow:0 4px 14px rgba(10,25,41,.25);
  height:54px
}
.topnav-brand{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.2em;
  color:#fff;font-weight:700;text-transform:uppercase;display:flex;align-items:center;gap:8px}
.topnav-dot{width:8px;height:8px;background:#FFEB3B;border-radius:50%;box-shadow:0 0 8px rgba(255,235,59,.7);animation:dot-pulse 2s ease-in-out infinite}
.topnav-sub{opacity:.6;font-weight:500}
.topnav-spacer{flex:1}
.topnav-user{display:flex;flex-direction:column;line-height:1.2;text-align:right;color:#fff;margin-right:10px}
.user-name{font-size:13px;font-weight:600}
.user-role{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.65)}
.topnav-link{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:rgba(255,255,255,.85);padding:8px 12px;
  border:1px solid rgba(255,255,255,.15);font-weight:600;transition:all .15s ease}
.topnav-link:hover{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.3)}
.topnav-link.logout{background:#FF1493;border-color:#FF1493;color:#fff}
.topnav-link.logout:hover{background:#fff;color:#FF1493}

.shell{max-width:1080px;margin:0 auto;padding:24px 18px 28px}
.page-head{margin-bottom:22px}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:var(--rust);margin-bottom:6px;font-weight:600}
.page-head h1{font-size:clamp(22px,3vw,32px);font-weight:800;letter-spacing:-.02em;line-height:1.05;margin-bottom:6px}
.page-head h1 em{font-style:normal;color:var(--rust);font-weight:600}
.page-head .lead{color:var(--ink-soft);font-size:14px;line-height:1.45;max-width:600px}

.modules-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:8px}
@media (max-width:840px){.modules-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.modules-grid{grid-template-columns:1fr}}

.module-card{
  position:relative;display:flex;flex-direction:column;min-height:160px;
  padding:16px 18px 14px;background:var(--paper);border:1.5px solid var(--ink);
  text-decoration:none;color:inherit;transition:all .18s ease;overflow:hidden;cursor:pointer
}
.module-card:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(10,25,41,.18);border-color:var(--rust)}
.module-icon{font-size:32px;line-height:1;margin-bottom:10px}
.module-title{font-size:18px;font-weight:800;letter-spacing:-.01em;margin-bottom:4px}
.module-desc{font-size:12px;line-height:1.4;color:var(--ink-soft);margin-bottom:12px;flex:1}
.module-foot{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:8px;border-top:1px solid var(--rule)}
.badge{font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;padding:3px 7px;background:var(--paper-2);color:var(--ink-soft);border:1px solid var(--rule);font-weight:700}
.arrow{font-size:18px;color:var(--ink-soft);transition:transform .18s ease,color .18s ease}
.module-card:hover .arrow{transform:translateX(5px);color:var(--rust)}

.module-card.accent-rust{border-left:4px solid var(--rust)}
.module-card.accent-olive{border-left:4px solid var(--olive)}
.module-card.accent-amber{border-left:4px solid var(--amber)}
.module-card.accent-ink{border-left:4px solid var(--ink-2)}

.page-foot{margin-top:28px;padding-top:14px;border-top:1px solid var(--rule);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted)}
.page-foot b{color:var(--ink);font-weight:600}
