/* ---- Tema SERPROF (el que se usa si no se dice otra cosa) ---- */
:root{--azul:#0B4F8A;--azul2:#083B68;--azul3:#1465AD;--azul-claro:#E8F0F8;--celeste:#2E86DE;--gris:#F2F4F7;--borde:#D5DBE3;
  --texto:#1F2937;--muted:#667085;--fondo:#F5F7FA;--acento:#FBBF24;--gris-oscuro:#64748B;--fila-hover:#F8FAFD;--texto-in:#0B3D75;
  --ambar:#D97706;--ambar-claro:#FEF3C7;--verde:#15803D;--verde-claro:#DCFCE7;--rojo:#B42318;--rojo-claro:#FEE4E2;--resalte:#FFF7D6;
  --violeta:#5B21B6;--violeta-claro:#EDE9FE;--barra:linear-gradient(90deg,#083B68,#0B4F8A 55%,#1465AD);--alto-barra:58px;--alto-nav:19px;--alto-logo:40px;--alto-logo-login:110px}

/* ---- Tema ECUPRINT: grafito y azul de base, verde y rojo de acento, logo mas grande ---- */
body[data-negocio="ECUPRINT"]{
  --azul:#175E8F;--azul2:#2E3A45;--azul3:#46586A;--azul-claro:#E6EEF5;--celeste:#4A90C2;--gris:#EDF0F3;--borde:#CBD3DC;
  --texto:#1B2530;--muted:#63727F;--fondo:#F3F5F7;--acento:#2FA36B;--gris-oscuro:#5A6875;--fila-hover:#F5F8FA;--texto-in:#123E5E;
  --ambar:#B45309;--ambar-claro:#FDF0DC;--verde:#15803D;--verde-claro:#DCFCE7;--rojo:#C0392B;--rojo-claro:#FBE3E0;--resalte:#E8F1F8;
  --violeta:#3F5266;--violeta-claro:#E3E9EF;--barra:linear-gradient(90deg,#222C35,#36444F 55%,#48596A);--alto-barra:72px;--alto-nav:26px;--alto-logo:56px;--alto-logo-login:150px}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;font-size:14px;color:var(--texto);background:var(--fondo)}
a{color:var(--azul)}
header{background:var(--barra);color:#fff;display:flex;align-items:center;gap:18px;padding:0 18px;height:var(--alto-barra);position:sticky;top:0;z-index:10;box-shadow:0 2px 6px rgba(0,0,0,.18)}
header .marca{display:flex;align-items:center;gap:10px;font-weight:bold;font-size:19px;letter-spacing:1px;white-space:nowrap}
header .marca img{height:var(--alto-logo);width:var(--alto-logo);object-fit:contain;background:#fff;border-radius:8px;padding:3px}
header .marca small{font-weight:normal;opacity:.8;font-size:11px;letter-spacing:0}
nav{display:flex;flex-wrap:wrap}
nav a{color:#fff;text-decoration:none;padding:var(--alto-nav) 11px;display:inline-block;border-bottom:3px solid transparent;font-size:13.5px}
nav a.activo,nav a:hover{border-bottom-color:var(--acento);background:rgba(255,255,255,.1)}
nav .grupo{position:relative}
nav .grupo>button{font:inherit;color:#fff;background:none;border:none;border-bottom:3px solid transparent;padding:var(--alto-nav) 11px;font-size:13.5px;cursor:pointer;display:inline-flex;align-items:center;gap:4px}
nav .grupo>button:hover,nav .grupo.activo>button{border-bottom-color:var(--acento);background:rgba(255,255,255,.1)}
nav .grupo .flecha{font-size:10px;transition:transform .15s}
nav .grupo.abierto .flecha{transform:rotate(180deg)}
nav .grupo .desplegable{display:none;position:absolute;top:100%;left:0;min-width:200px;background:var(--azul2);border-radius:0 0 8px 8px;box-shadow:0 8px 18px rgba(0,0,0,.25);overflow:hidden;z-index:15}
nav .grupo.abierto .desplegable{display:block}
nav .grupo .desplegable a{display:block;padding:11px 16px;border-bottom:1px solid rgba(255,255,255,.1)}
nav .grupo .desplegable a:last-child{border-bottom:none}
nav .grupo .desplegable a.activo,nav .grupo .desplegable a:hover{background:rgba(255,255,255,.15);border-bottom-color:rgba(255,255,255,.1)}
.buscar-sistema{position:relative;flex:0 1 220px;margin-left:8px}
.buscar-sistema input{width:100%;padding:8px 10px;border-radius:6px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.15);color:#fff}
.buscar-sistema input::placeholder{color:rgba(255,255,255,.75)}
.buscar-sistema input:focus{background:#fff;color:var(--texto);outline:2px solid var(--acento)}
.buscar-sistema input:focus::placeholder{color:var(--muted)}
.buscar-sistema .sug{color:var(--texto)}
header .usuario{margin-left:auto;font-size:12px;opacity:.95;white-space:nowrap}
header .usuario a{color:var(--acento)}
main{max-width:1320px;margin:0 auto;padding:20px}
h1{font-size:20px;margin:0 0 16px;color:var(--azul)}
h2{font-size:15px;margin:18px 0 8px;color:var(--azul)}
.card{background:#fff;border:1px solid var(--borde);border-radius:10px;padding:16px;margin-bottom:16px;box-shadow:0 1px 2px rgba(16,24,40,.04)}
.fila{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.campo{display:flex;flex-direction:column;gap:4px;min-width:120px;flex:1}
.campo.corto{flex:0 0 120px}.campo.medio{flex:0 0 200px}.campo.largo{flex:2}.campo.xcorto{flex:0 0 90px}
label{font-size:12px;color:var(--muted);font-weight:bold}
input,select,textarea{font:inherit;padding:8px;border:1px solid var(--borde);border-radius:6px;background:#fff;color:var(--texto)}
input.in,select.in,textarea.in{background:var(--resalte);border:2px solid var(--azul);color:var(--texto-in);font-weight:bold}
input:focus,select:focus,textarea:focus{outline:2px solid var(--celeste);outline-offset:0}
input[readonly]{background:var(--gris)}
button,.btn{font:inherit;font-weight:bold;padding:9px 16px;border-radius:6px;border:1px solid transparent;cursor:pointer;background:var(--azul);color:#fff;text-decoration:none;display:inline-block}
button:hover{filter:brightness(1.08)}
button.sec{background:var(--gris-oscuro)}button.peligro{background:var(--rojo)}button.ok{background:var(--verde)}button.ambar{background:var(--ambar)}
button.link{background:none;color:var(--azul);padding:4px 6px;text-decoration:underline}
button.toggle{background:#fff;color:var(--azul);border:2px solid var(--azul)}button.toggle.on{background:var(--azul);color:#fff}
button:disabled{opacity:.5;cursor:not-allowed}
table{width:100%;border-collapse:collapse;background:#fff}
th,td{padding:7px 8px;border:1px solid var(--borde);text-align:left;vertical-align:middle}
th{background:var(--azul);color:#fff;font-size:12px;text-transform:uppercase}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
td.c,th.c{text-align:center}
tr:hover td{background:var(--fila-hover)}
.pvp{background:var(--azul-claro);font-weight:bold}
.tag{display:inline-block;padding:2px 8px;border-radius:12px;font-size:11px;font-weight:bold;white-space:nowrap}
.tag.ENTRADA,.tag.FINALIZADA,.tag.ok{background:var(--verde-claro);color:var(--verde)}
.tag.SALIDA,.tag.ANULADA,.tag.bajo{background:var(--rojo-claro);color:var(--rojo)}
.tag.AJUSTE,.tag.EMITIDA,.tag.info{background:var(--azul-claro);color:var(--azul)}
.tag.PENDIENTE,.tag.CONVERTIDA,.tag.warn{background:var(--ambar-claro);color:var(--ambar)}
.tag.serv{background:#EEF0F3;color:#555}
.tag.ADMIN{background:var(--violeta-claro);color:var(--violeta)}.tag.SUPERVISOR{background:var(--azul-claro);color:var(--azul)}.tag.VENDEDOR{background:var(--verde-claro);color:var(--verde)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.kpi{background:#fff;border:1px solid var(--borde);border-radius:10px;padding:14px;border-top:4px solid var(--azul)}
.kpi:nth-child(3n+2){border-top-color:var(--celeste)}.kpi:nth-child(3n){border-top-color:var(--acento)}
.kpi .v{font-size:22px;font-weight:bold;color:var(--azul)}.kpi .l{font-size:12px;color:var(--muted)}
.muted{color:var(--muted);font-size:12px}
.aviso{position:fixed;top:74px;left:50%;transform:translateX(-50%);z-index:9999;min-width:260px;max-width:min(90vw,560px);
  padding:12px 18px;border-radius:8px;margin:0;display:none;font-weight:bold;text-align:center;box-shadow:0 10px 28px rgba(0,0,0,.3)}
.aviso.ok{display:block;background:var(--verde-claro);color:var(--verde);border:1px solid var(--verde)}
.aviso.err{display:block;background:var(--rojo-claro);color:var(--rojo);border:1px solid var(--rojo)}
.modal{display:none;position:fixed;inset:0;background:rgba(3,20,40,.5);z-index:20;align-items:flex-start;justify-content:center;padding:40px 12px;overflow:auto}
.modal.abierto{display:flex}
.modal .card{width:100%;max-width:820px}
.modal .card.chico{max-width:440px}
.error-card{text-align:center}
.error-icono{width:76px;height:76px;line-height:76px;border-radius:50%;background:var(--rojo);color:#fff;font-size:38px;margin:0 auto 14px}
.error-titulo{color:var(--rojo);margin:0 0 10px;font-size:19px;letter-spacing:.3px}
.error-msg{color:var(--texto);font-size:14px;line-height:1.6;margin:0 0 4px;white-space:pre-line}
.acciones{display:flex;gap:8px;justify-content:flex-end;margin-top:12px;flex-wrap:wrap}
.scroll{overflow-x:auto}
.buscar{flex:2;min-width:220px}
.sug{position:absolute;top:100%;left:0;right:0;z-index:5;display:none;padding:0;max-height:260px;overflow:auto;background:#fff;border:1px solid var(--borde);border-radius:0 0 8px 8px;box-shadow:0 6px 16px rgba(0,0,0,.12)}
.sug div{padding:8px 10px;cursor:pointer;border-bottom:1px solid #eee}.sug div:hover{background:var(--azul-claro)}
.totales{margin-left:auto;min-width:320px;max-width:440px;flex:0 0 auto}
.totales td{padding:5px 8px}.totales .total td{background:var(--azul);color:#fff;font-size:17px;font-weight:bold}
.login{max-width:380px;margin:70px auto;text-align:center}
.login img{height:var(--alto-logo-login)}
.login .card{text-align:left}
table.items input,table.items select,table.items textarea{width:100%;padding:6px;box-sizing:border-box}
table.items textarea{resize:vertical;min-height:34px;font-family:inherit}
table.items td{padding:4px 5px}
table.items td:nth-child(3){min-width:320px}
@media(max-width:760px){header{height:auto;flex-wrap:wrap;padding:8px 12px;gap:8px}nav a{padding:8px}nav .grupo>button{padding:8px}
  nav .grupo{position:static}nav .grupo .desplegable{position:static;box-shadow:none;border-radius:0;background:rgba(255,255,255,.08);min-width:0}
  header .usuario{margin-left:0}.buscar-sistema{flex:1 1 100%;order:5;margin-left:0}.campo.corto,.campo.medio{flex:1 1 45%}}
@media print{header,.no-print{display:none!important}main{padding:0}}
