:root{--azul:#1f3a5f;--azul2:#2d5a8c;--fondo:#f4f6f9;--borde:#dde3ea;--texto:#1d2733;--gris:#6b7785;--ok:#1d7a46;--err:#b42318;--warn:#a15c00}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-size:14px;color:var(--texto);background:var(--fondo)}
a{color:var(--azul2);text-decoration:none}a:hover{text-decoration:underline}
.app{display:flex;min-height:100vh}
nav.lateral{width:230px;background:var(--azul);color:#fff;flex-shrink:0;padding:14px 0;position:sticky;top:0;height:100vh;overflow:auto}
nav.lateral .marca{padding:0 18px 12px;font-weight:700;font-size:15px;border-bottom:1px solid rgba(255,255,255,.15)}
nav.lateral .marca small{display:block;font-weight:400;opacity:.75;font-size:12px}
nav.lateral .ico{display:inline-block;width:26px;font-size:15px}
nav.lateral details.modulo summary{list-style:none;cursor:pointer;padding:9px 18px;font-weight:600;display:flex;align-items:center;user-select:none}
nav.lateral details.modulo summary::-webkit-details-marker{display:none}
nav.lateral details.modulo summary::after{content:'▸';margin-left:auto;opacity:.7;transition:transform .15s}
nav.lateral details.modulo[open] summary::after{transform:rotate(90deg)}
nav.lateral details.modulo summary:hover{background:rgba(255,255,255,.08)}
nav.lateral details.modulo[open]{background:rgba(0,0,0,.12)}
nav.lateral details.modulo .sub a{padding:6px 18px 6px 44px;font-size:13.5px}
nav.lateral a.modulo-link{padding:9px 18px;font-weight:600}
nav.lateral h4{margin:14px 18px 4px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;opacity:.6}
nav.lateral a{display:block;color:#e8eef5;padding:6px 18px}nav.lateral a:hover,nav.lateral a.activo{background:rgba(255,255,255,.12);text-decoration:none}
main{flex:1;padding:22px 28px;min-width:0}
.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:12px;flex-wrap:wrap}
h1{font-size:21px;margin:0}h2{font-size:16px;margin:22px 0 10px}
.card{background:#fff;border:1px solid var(--borde);border-radius:8px;padding:16px;margin-bottom:16px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:16px}
.kpi{background:#fff;border:1px solid var(--borde);border-radius:8px;padding:14px}.kpi b{display:block;font-size:20px;margin-top:4px}.kpi span{color:var(--gris);font-size:12px}
table{width:100%;border-collapse:collapse;background:#fff}
th,td{padding:7px 9px;border-bottom:1px solid var(--borde);text-align:left;vertical-align:top}
th{background:#eef2f6;font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:#3c4a5a}
td.n,th.n{text-align:right;white-space:nowrap}tr.total td{font-weight:700;background:#f7f9fb}tr.grupo td{font-weight:600;background:#fafbfc}
.tabla{overflow:auto;border:1px solid var(--borde);border-radius:8px}
form.inline{display:inline}
label{display:block;font-size:12px;color:#3c4a5a;margin-bottom:3px;font-weight:600}
input,select,textarea{width:100%;padding:7px 9px;border:1px solid #c5cfda;border-radius:6px;font:inherit;background:#fff}
input[type=checkbox]{width:auto}
.grid>*{min-width:0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.campo{margin-bottom:10px}
.btn{display:inline-block;padding:7px 14px;border-radius:6px;border:1px solid var(--azul2);background:var(--azul2);color:#fff;cursor:pointer;font:inherit;font-weight:600}
.btn:hover{background:var(--azul);text-decoration:none}.btn.sec{background:#fff;color:var(--azul2)}.btn.peligro{background:var(--err);border-color:var(--err)}.btn.sm{padding:4px 9px;font-size:12px}
.acciones{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.flash{padding:10px 14px;border-radius:6px;margin-bottom:14px}.flash.ok{background:#e5f4ec;color:var(--ok)}.flash.error{background:#fdecea;color:var(--err)}
.aviso{background:#fff7e6;border:1px solid #f3d9a4;color:var(--warn);padding:10px 14px;border-radius:6px;margin-bottom:10px}
.badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:700;background:#e6ebf1;color:#3c4a5a}
.badge.aceptado{background:#e5f4ec;color:var(--ok)}.badge.rechazado,.badge.error{background:#fdecea;color:var(--err)}.badge.en_proceso,.badge.firmado,.badge.aceptado_condicional{background:#fff3dc;color:var(--warn)}.badge.anulado{background:#eee;color:#777}
.muted{color:var(--gris);font-size:12px}.mono{font-family:ui-monospace,Consolas,monospace;font-size:12px}
.login{max-width:360px;margin:10vh auto}
pre{white-space:pre-wrap;word-break:break-all;background:#f7f9fb;padding:10px;border-radius:6px;max-height:300px;overflow:auto}
/* POS */
.pos{display:grid;grid-template-columns:1fr 380px;gap:14px}
.pos .prods{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.pos .prod{background:#fff;border:1px solid var(--borde);border-radius:8px;padding:10px;cursor:pointer;min-height:70px}.pos .prod:hover{border-color:var(--azul2)}
.pos .prod b{display:block;font-size:13px}.pos .carrito{position:sticky;top:10px}
.pos .total{font-size:28px;font-weight:800;text-align:right;margin:10px 0}
.pos input.buscar{font-size:16px;padding:10px}
/* Barra superior y menú tipo cajón en celular/tablet */
.barra-movil{display:none}
.pos-barra{display:none}
.velo{display:none}
@media (max-width:900px){
  .app{display:block}
  .barra-movil{display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:30;background:var(--azul);color:#fff;padding:10px 14px;box-shadow:0 2px 6px rgba(0,0,0,.15)}
  .barra-movil button{background:none;border:0;color:#fff;font-size:24px;line-height:1;padding:4px 6px;cursor:pointer}
  .barra-movil b{font-size:15px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .barra-movil a{color:#fff;font-size:13px;border:1px solid rgba(255,255,255,.5);border-radius:6px;padding:5px 9px}
  nav.lateral{position:fixed;left:0;top:0;bottom:0;z-index:50;width:min(82vw,300px);height:100vh;transform:translateX(-100%);transition:transform .2s ease}
  body.menu-abierto nav.lateral{transform:none;box-shadow:4px 0 18px rgba(0,0,0,.3)}
  body.menu-abierto .velo{display:block;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:40}
  nav.lateral details.modulo summary,nav.lateral a{padding-top:12px;padding-bottom:12px}
  main{padding:14px}
  h1{font-size:19px}
  .top{align-items:flex-start}
  .grid{grid-template-columns:1fr 1fr!important}
  .grid>.campo[style*="span"],.grid>div[style*="span"]{grid-column:1/-1!important}
  .kpis{grid-template-columns:1fr 1fr}
  .kpi b{font-size:17px}
  input,select,textarea{font-size:16px;padding:10px}
  .btn{padding:10px 14px}
  .btn.sm{padding:6px 10px}
  th,td{padding:8px 7px}
  .tabla{-webkit-overflow-scrolling:touch}
  .tabla table{min-width:560px}
  /* POS en celular: productos arriba, carrito abajo con total fijo */
  .pos{grid-template-columns:1fr}
  .pos .prods{grid-template-columns:repeat(2,1fr)}
  .pos .carrito{position:static}
  .pos .carrito .tabla table{min-width:0}
  .pos .total{font-size:24px}
  .pos-barra{display:flex;align-items:center;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--azul);color:#fff;padding:10px 14px;box-shadow:0 -2px 10px rgba(0,0,0,.2)}
  .pos-barra #pbTotal{font-weight:800;font-size:18px}
  .pos-barra .btn{margin-left:auto;background:#fff;color:var(--azul);border-color:#fff}
  .pos{padding-bottom:70px}
}
@media (max-width:520px){
  .grid{grid-template-columns:1fr!important}
  .kpis{grid-template-columns:1fr 1fr}
  .acciones .btn{flex:1 1 auto;text-align:center}
}
@media print{nav.lateral,.noprint,.btn{display:none!important}main{padding:0}.card{border:none}body{background:#fff}}
td.mono,.mono{overflow-wrap:anywhere}