/* IT2GO® ADD — overrides sobre el CSS base de IT2GO id */
#vAuth { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; position:relative; z-index:1; }
#vApp  { display:none; }
.sf    { display:flex; min-height:100vh; }
#sb    { width:240px; min-height:100vh; background:var(--navy); display:flex; flex-direction:column; position:fixed; top:0; left:0; bottom:0; z-index:200; }
.sb-logo { padding:20px 18px 16px; border-bottom:1px solid rgba(255,255,255,.07); display:flex; align-items:center; gap:10px; }
.sb-logo .logo-mark { width:36px; height:36px; border-radius:10px; background:linear-gradient(135deg,var(--brand),var(--navy-light)); display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:800; color:#fff; flex-shrink:0; box-shadow:0 4px 12px rgba(0,131,111,.3); }
.sb-logo .logo-text { color:#fff; font-size:15px; font-weight:700; line-height:1.2; }
.sb-logo .logo-sub  { color:rgba(255,255,255,.35); font-size:10px; }
#mn { flex:1; padding:10px 8px; overflow-y:auto; }
.mn-section { font-size:10px; font-weight:600; color:rgba(255,255,255,.25); text-transform:uppercase; letter-spacing:.8px; padding:14px 8px 6px; }
.mn-item { display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:8px; cursor:pointer; color:rgba(255,255,255,.55); font-size:13px; transition:all .15s; margin-bottom:1px; }
.mn-item svg { width:17px; height:17px; flex-shrink:0; stroke-width:1.8; }
.mn-item:hover  { background:rgba(255,255,255,.07); color:rgba(255,255,255,.85); }
.mn-item.active { background:var(--brand); color:#fff; font-weight:600; }
.sb-foot { padding:12px 10px; border-top:1px solid rgba(255,255,255,.07); }
.sb-user { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:8px; cursor:pointer; transition:background .15s; }
.sb-user:hover { background:rgba(255,255,255,.07); }
.sb-av   { width:32px; height:32px; border-radius:50%; background:var(--brand); display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; color:#fff; flex-shrink:0; }
.sb-user .name { color:#fff; font-size:12px; font-weight:500; }
.sb-user .role { color:rgba(255,255,255,.35); font-size:11px; }
.btn-logout { width:100%; padding:8px; margin-top:6px; background:transparent; border:1px solid rgba(255,255,255,.1); color:rgba(255,255,255,.4); border-radius:8px; font-size:12px; cursor:pointer; font-family:inherit; transition:all .15s; }
.btn-logout:hover { background:rgba(220,38,38,.15); color:#fca5a5; border-color:rgba(220,38,38,.3); }
#mc  { margin-left:240px; flex:1; display:flex; flex-direction:column; min-height:100vh; }
#hB  { height:54px; background:rgba(255,255,255,.92); backdrop-filter:saturate(180%) blur(20px); border-bottom:1px solid var(--border-soft); display:flex; align-items:center; padding:0 28px; gap:16px; position:sticky; top:0; z-index:100; }
#hP  { font-size:16px; font-weight:700; color:var(--navy); letter-spacing:-.3px; flex:1; }
.page { display:none; padding:28px 32px 60px; }
.page.active { display:block; }
.stats-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; margin-bottom:28px; }
.stat-card  { background:var(--surface); border-radius:14px; padding:16px; border:1px solid var(--border-soft); transition:all .15s; }
.stat-card:hover { border-color:rgba(0,131,111,.3); transform:translateY(-2px); box-shadow:0 8px 20px rgba(1,38,64,.06); }
.stat-label { font-size:11px; color:var(--text-dim); font-weight:600; text-transform:uppercase; letter-spacing:.5px; margin-bottom:6px; }
.stat-value { font-size:26px; font-weight:700; letter-spacing:-.6px; color:var(--navy); line-height:1; }
.stat-sub   { font-size:12px; color:var(--text-faint); margin-top:4px; }
.tbl-wrap   { overflow-x:auto; }
.badge { display:inline-block; padding:3px 9px; border-radius:6px; font-size:11px; font-weight:600; }
.badge-blue   { background:rgba(2,132,199,.12);   color:#075985; }
.badge-green  { background:rgba(0,131,111,.12);   color:var(--brand-dark); }
.badge-yellow { background:rgba(245,158,11,.12);  color:#92400e; }
.badge-red    { background:rgba(220,38,38,.12);   color:#b91c1c; }
.badge-gray   { background:rgba(100,116,139,.12); color:#475569; }
.badge-purple { background:rgba(124,58,237,.12);  color:#6d28d9; }
.badge-cyan   { background:rgba(2,132,199,.12);   color:#075985; }
.grid-2  { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.mb-4    { margin-bottom:16px; }
.mt-4    { margin-top:16px; }
.flex-between { display:flex; align-items:center; justify-content:space-between; }
.spinner { width:20px; height:20px; border:2px solid var(--border); border-top-color:var(--brand); border-radius:50%; animation:spin .7s linear infinite; }
#toasts  { position:fixed; bottom:24px; right:24px; z-index:2000; display:flex; flex-direction:column; gap:8px; }
.toast   { display:flex; align-items:center; gap:10px; padding:12px 16px; background:var(--surface); border:1px solid var(--border); border-radius:12px; box-shadow:0 8px 24px rgba(1,38,64,.12); font-size:13px; min-width:260px; animation:toastIn .2s ease; }
.toast.error   { border-left:3px solid var(--danger); }
.toast.success { border-left:3px solid var(--brand); }
@keyframes toastIn { from { transform:translateX(40px); opacity:0; } to { transform:none; opacity:1; } }
.modal-overlay { position:fixed; inset:0; background:rgba(1,38,64,.5); backdrop-filter:blur(8px); z-index:1000; display:flex; align-items:center; justify-content:center; padding:20px; opacity:0; pointer-events:none; transition:opacity .2s; }
.modal-overlay.open { opacity:1; pointer-events:all; }
.modal { background:var(--surface); border-radius:20px; padding:32px; width:100%; max-width:520px; box-shadow:0 30px 80px rgba(1,38,64,.25); transform:translateY(16px); transition:transform .2s; max-height:90vh; overflow-y:auto; }
.modal-overlay.open .modal { transform:translateY(0); }
.modal-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.modal-title  { font-size:18px; font-weight:700; color:var(--navy); }
.modal-close  { width:32px; height:32px; border-radius:50%; background:var(--surface-2); border:none; cursor:pointer; color:var(--text-dim); font-size:18px; display:flex; align-items:center; justify-content:center; }
.modal-close:hover { background:var(--danger); color:white; }
.modal-footer { display:flex; justify-content:flex-end; gap:8px; margin-top:20px; }
.upload-zone { border:2px dashed var(--border); border-radius:12px; padding:28px; text-align:center; cursor:pointer; background:var(--surface-2); transition:all .15s; }
.upload-zone:hover,.upload-zone.drag { border-color:var(--brand); background:rgba(0,131,111,.04); }
.upload-zone svg { width:32px; height:32px; color:var(--text-faint); margin-bottom:10px; }
.empty { padding:48px; text-align:center; color:var(--text-faint); }
.empty svg { width:40px; height:40px; margin-bottom:12px; opacity:.3; }
.btn   { display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:8px; font-size:13px; font-weight:600; cursor:pointer; border:1px solid transparent; transition:all .15s; font-family:inherit; white-space:nowrap; }
.btn svg { width:14px; height:14px; flex-shrink:0; }
.btn-primary   { background:var(--brand); color:white; border-color:var(--brand); box-shadow:0 2px 6px rgba(0,131,111,.2); }
.btn-primary:hover:not(:disabled) { background:var(--brand-dark); transform:translateY(-1px); }
.btn-secondary { background:var(--surface); color:var(--text-dim); border-color:var(--border); }
.btn-secondary:hover { background:var(--bg); color:var(--text); border-color:var(--brand); }
.btn-danger    { background:rgba(220,38,38,.08); color:var(--danger); border-color:rgba(220,38,38,.3); }
.btn-danger:hover { background:var(--danger); color:#fff; }
.btn-sm  { padding:6px 12px; font-size:12px; }
.btn:disabled { opacity:.55; cursor:not-allowed; }
.form-group { margin-bottom:14px; }
.form-label { display:block; font-size:12px; font-weight:600; color:var(--text-dim); margin-bottom:6px; text-transform:uppercase; letter-spacing:.3px; }
.form-control { width:100%; padding:14px 16px; background:rgba(250,251,252,.8); border:1px solid var(--border); border-radius:12px; color:var(--text); font-size:14px; font-family:inherit; transition:all .2s; outline:none; }
.form-control:focus { border-color:var(--brand); background:var(--surface); box-shadow:0 0 0 4px rgba(0,131,111,.12); }
select.form-control { cursor:pointer; }
.form-hint { font-size:11px; color:var(--text-faint); margin-top:4px; }
.form-row  { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.progress  { height:7px; background:var(--border-soft); border-radius:99px; overflow:hidden; }
.progress-bar { height:100%; background:linear-gradient(90deg,var(--brand),var(--brand-light)); border-radius:99px; transition:width .4s; }
.td-mono { font-family:'SF Mono',monospace; font-size:12px; color:var(--navy); font-weight:600; }
.text-muted { color:var(--text-faint); }
.text-sm    { font-size:12px; }
.auth-box   { background:rgba(255,255,255,.85); backdrop-filter:blur(30px); border-radius:24px; padding:48px 40px; width:100%; max-width:420px; box-shadow:0 1px 2px rgba(1,38,64,.04),0 24px 60px rgba(1,38,64,.12); border:1px solid rgba(255,255,255,.6); }
.auth-logo  { text-align:center; margin-bottom:28px; }
.auth-logo .mark { width:72px; height:72px; background:linear-gradient(135deg,var(--brand),var(--navy)); border-radius:20px; display:inline-flex; align-items:center; justify-content:center; box-shadow:0 12px 28px rgba(0,131,111,.35); position:relative; overflow:hidden; margin-bottom:16px; }
.auth-logo .mark::before { content:''; position:absolute; top:-50%; left:-50%; width:200%; height:200%; background:linear-gradient(45deg,transparent 30%,rgba(255,255,255,.2) 50%,transparent 70%); animation:shine 3s ease-in-out infinite; }
@keyframes shine { 0%,100%{transform:translate(-50%,-50%);}50%{transform:translate(50%,50%);} }
.auth-logo .mark-text { color:white; font-weight:800; font-size:18px; position:relative; z-index:1; }
.auth-logo h1 { font-size:26px; font-weight:800; letter-spacing:-.7px; color:var(--navy); margin-bottom:4px; }
.auth-logo p  { font-size:14px; color:var(--text-dim); }
.btn-login { width:100%; padding:14px; background:linear-gradient(135deg,var(--brand),var(--brand-dark)); color:white; border:none; border-radius:12px; font-size:15px; font-weight:600; cursor:pointer; font-family:inherit; transition:all .15s; box-shadow:0 8px 20px rgba(0,131,111,.25); margin-top:4px; }
.btn-login:hover:not(:disabled) { transform:translateY(-1px); box-shadow:0 12px 28px rgba(0,131,111,.35); }
@media(max-width:768px){
  #sb{width:60px;}
  .sb-logo .logo-text,.sb-logo .logo-sub,.mn-item span,.mn-section,.sb-user .name,.sb-user .role{display:none;}
  .mn-item{justify-content:center;}
  #mc{margin-left:60px;}
  .page{padding:20px 16px 40px;}
  .form-row{grid-template-columns:1fr;}
  .grid-2{grid-template-columns:1fr;}
}
