/* Polar Remitos — tablet Android en la planta. Misma familia que Polar
   (Archivo + Plex Mono, blanco/tinta, rojo Polar solo para la marca y los
   errores). Todo lo que se toca mide 48px o más. */
:root{
  --paper:#f4f5f6;--surface:#fff;--sunken:#f7f7f8;--ink:#15171b;--ink-2:#3a3d43;--muted:#5f656e;--plomo:#7b8189;
  --border:rgba(21,23,27,.12);--border-strong:rgba(21,23,27,.24);
  --polar:#d62921;--mal:#a61d16;--mal-bg:#fbe4e2;--bien:#1d7a3e;--bien-bg:#e6f4ea;
  --e-blewald:#1f4e9e;--e-azai:#3d3f44;--e-meida:#c2185b;--e-prueba:#9a5b00;
  --f-ui:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;--f-data:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --r:12px;
}
@media (prefers-color-scheme: dark){
  :root{--paper:#0e1014;--surface:#161a1f;--sunken:#12151a;--ink:#e8eaee;--ink-2:#c3c8cf;--muted:#9aa1ab;--plomo:#8b9099;
    --border:rgba(255,255,255,.1);--border-strong:rgba(255,255,255,.22);--mal:#f59a92;--mal-bg:#2c1515;--bien:#5cc27a;--bien-bg:#15261b;
    --e-blewald:#8fb3ff;--e-azai:#c9ccd2;--e-meida:#f48fb1;--e-prueba:#f0b85a}
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0}
body{font:400 16px/1.45 var(--f-ui);color:var(--ink);background:var(--paper)}
button,input,select,textarea{font:inherit;color:inherit}
[hidden]{display:none!important}
h1{font:650 26px var(--f-ui);font-stretch:112%;margin:0;text-wrap:balance}
h2{font:600 12px var(--f-ui);font-stretch:110%;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.sub{color:var(--muted);font-size:14px;margin:2px 0 0}
:focus-visible{outline:3px solid rgba(214,41,33,.45);outline-offset:2px}

/* Marca */
.marca{display:flex;align-items:flex-start;gap:7px}
.marca img{height:19px;width:auto}
.marca small{font:500 10px var(--f-data);letter-spacing:.12em;color:var(--plomo);line-height:1;margin-top:-1px}
.marca.grande img{height:34px}.marca.grande small{font-size:12px}
@media (prefers-color-scheme: dark){.marca img{filter:brightness(1.15)}}

/* Ingreso */
.login{min-height:100vh;display:grid;place-items:center;padding:16px}
.login-box{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:32px;width:min(420px,100%);display:flex;flex-direction:column;gap:14px}
.login-sub{color:var(--muted);font-size:14px;margin:4px 0 4px}
.login-box label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}
input,select,textarea{border:1px solid var(--border-strong);border-radius:9px;padding:11px 12px;background:var(--surface);outline:none;min-width:0;min-height:48px;font-size:17px}
textarea{min-height:64px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--ink-2);box-shadow:0 0 0 3px rgba(214,41,33,.14)}
.error{color:var(--mal);font-size:14px;min-height:18px}

/* Botones */
.btn{border:1px solid var(--border-strong);background:var(--surface);border-radius:10px;padding:10px 16px;min-height:48px;cursor:pointer;font-weight:550;white-space:nowrap;touch-action:manipulation}
.btn:active{transform:translateY(1px)}
.btn.primario{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.btn.chico{min-height:38px;padding:6px 12px;font-size:14px}
.btn.grande{min-height:54px;font-size:17px;padding:12px 20px}
.btn.enorme{min-height:62px;font-size:19px;padding:14px 26px;border-radius:12px}
.btn.enorme span{font-size:24px;line-height:0;margin-right:4px}
.btn:disabled{opacity:.5}

/* Barra */
.barra{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:16px;padding:10px 20px;padding-top:max(10px,env(safe-area-inset-top));background:var(--surface);border-bottom:1px solid var(--border)}
.empresas{display:flex;gap:6px;flex:1;justify-content:center;flex-wrap:wrap}
.emp{display:flex;align-items:center;gap:8px;border:1px solid var(--border);background:var(--sunken);border-radius:10px;padding:8px 14px;min-height:48px;cursor:pointer;font:600 14px var(--f-data);letter-spacing:.05em;color:var(--muted)}
.emp img{height:20px;width:20px;object-fit:contain}
.emp-p{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:5px;background:var(--e-prueba);color:#fff;font:700 12px var(--f-ui)}
.emp.activa{background:var(--surface);border-color:var(--ink);color:var(--ink);box-shadow:inset 0 -3px 0 var(--polar)}
.yo{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--muted)}

/* Vistas */
.vista{max-width:1100px;margin:0 auto;padding:20px 20px 140px}
.lista-cab{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.lista{display:flex;flex-direction:column;gap:8px}
.dia{font:600 12px var(--f-ui);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:14px 2px 2px}
.fila{display:grid;grid-template-columns:190px 1fr 130px auto;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:12px 16px}
.fila.anulada{opacity:.55}
.f-num{font:500 15px var(--f-data)}
.f-cli b{display:block;font-weight:600}.f-cli small{color:var(--muted);font-size:13.5px}
.f-tot{text-align:right;font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}.f-tot b{color:var(--ink)}
.f-acc{display:flex;gap:8px;align-items:center}
.chip{font:600 11px var(--f-data);text-transform:uppercase;letter-spacing:.05em;padding:3px 8px;border-radius:6px}
.chip.mal{background:var(--mal-bg);color:var(--mal)}.chip.bien{background:var(--bien-bg);color:var(--bien)}
.vacio{background:var(--surface);border:1px dashed var(--border-strong);border-radius:var(--r);padding:40px;text-align:center;color:var(--muted)}

/* Formulario */
.form-cab{display:flex;align-items:center;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.form-cab h1{flex:1}
.bloque{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:18px;margin-bottom:14px}
.in-grande{width:100%}
.grilla{display:grid;gap:12px}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.span2{grid-column:span 2}
.grilla label,.obs{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}
.obs{margin-top:14px}
.cli-lista{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}
.cli-lista .dia,.cli-lista .sub{grid-column:1/-1}
.cli-item{text-align:left;border:1px solid var(--border);background:var(--sunken);border-radius:10px;padding:12px 14px;min-height:60px;cursor:pointer}
.cli-item b{display:block;font-weight:600}.cli-item small{color:var(--muted);font-size:13px}
.cli-item.nuevo{border-style:dashed}
.cli-item:active{border-color:var(--ink)}
.cli-elegido{display:flex;justify-content:space-between;align-items:center;gap:12px}
.cli-elegido b{font-size:20px;display:block;margin-bottom:6px}
.cuit{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}.cuit input{width:200px;font-family:var(--f-data)}
.letra{margin-top:14px;display:flex;flex-direction:column;gap:12px}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.seg button{border:1px solid var(--border-strong);background:var(--sunken);border-radius:10px;padding:10px 14px;min-height:60px;text-align:left;cursor:pointer}
.seg button b{display:block}.seg button small{color:var(--muted);font-size:13px}
.seg button.activa{background:var(--ink);color:var(--surface);border-color:var(--ink)}.seg button.activa small{color:inherit;opacity:.8}
.items{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
.renglon{display:grid;grid-template-columns:1.6fr 1.3fr 100px 120px auto;gap:10px;align-items:end;padding-bottom:10px;border-bottom:1px solid var(--border)}
.renglon:has([data-k="precio"]){grid-template-columns:1.5fr 1.2fr 90px 110px 120px auto}
.renglon label{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--muted)}
.renglon input[type=number]{text-align:right;font-variant-numeric:tabular-nums}
.quitar{width:48px;height:48px;border:1px solid var(--border);background:var(--sunken);border-radius:10px;font-size:24px;color:var(--mal);cursor:pointer}
.pie{position:fixed;left:0;right:0;bottom:0;z-index:4;background:var(--surface);border-top:1px solid var(--border);padding:12px 20px;padding-bottom:max(12px,env(safe-area-inset-bottom));display:flex;align-items:center;gap:16px;box-shadow:0 -6px 20px rgba(0,0,0,.06)}
.totales{display:flex;gap:20px;font-size:17px;flex:1;font-variant-numeric:tabular-nums}
.pie .error{flex:1;text-align:right}

/* Confirmar */
.modal{position:fixed;inset:0;z-index:10;background:rgba(10,12,15,.5);display:grid;place-items:center;padding:16px}
.modal-box{background:var(--surface);border-radius:16px;padding:24px;width:min(600px,100%);max-height:90vh;overflow:auto}
.modal-box h2{font:650 22px var(--f-ui);letter-spacing:0;text-transform:none;color:var(--ink);margin-bottom:12px}
.conf-cli b{display:block;font-size:18px}.conf-cli small{color:var(--muted)}
.conf-tab{width:100%;border-collapse:collapse;margin:12px 0;font-variant-numeric:tabular-nums}
.conf-tab td{padding:8px 4px;border-bottom:1px solid var(--border)}.conf-tab td+td{text-align:right;white-space:nowrap}
.conf-tab .tot td{font-weight:650;border-bottom:0}
.modal-acc{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}

/* Avisos */
.aviso{position:fixed;left:50%;bottom:100px;transform:translate(-50%,20px);background:var(--ink);color:var(--surface);padding:12px 18px;border-radius:10px;opacity:0;pointer-events:none;transition:.2s;z-index:20;max-width:90vw}
.aviso.ver{opacity:1;transform:translate(-50%,0)}.aviso.error{background:var(--mal);color:#fff}
.cargando{position:fixed;inset:0;z-index:30;background:rgba(255,255,255,.4);display:grid;place-items:center}
.cargando span{width:36px;height:36px;border:3px solid var(--border-strong);border-top-color:var(--polar);border-radius:50%;animation:gira .8s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){.cargando span{animation-duration:3s}.aviso{transition:none}}

/* Vista de impresión (en pantalla) */
.impr-cab{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.impr-acc{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
#impr{background:#fff;color:#15171b;padding:12px;border-radius:var(--r);font:11px Arial,Helvetica,sans-serif}
.hoja{border:1.5px solid #15171b;padding:12px 14px;min-height:135mm;position:relative;page-break-inside:avoid;break-inside:avoid;margin-bottom:6mm;display:flex;flex-direction:column}
.hoja .cab{display:grid;grid-template-columns:1fr 90px 1fr;gap:10px;align-items:start;border-bottom:1.5px solid #15171b;padding-bottom:8px}
.emp-d{display:flex;gap:10px;align-items:flex-start;line-height:1.4}.emp-d b{font-size:14px}.emp-d img{height:38px}
.x{text-align:center}.x span{display:block;border:2px solid #15171b;font:700 34px Arial;width:54px;margin:0 auto;line-height:50px}
.x em{display:block;font:700 9px Arial;font-style:normal;margin-top:2px}.x small{display:block;font-size:7.5px;margin-top:3px;line-height:1.2}
.num{line-height:1.5}.num h1{font:700 17px Arial;margin:0}.nro{font:700 14px "Courier New",monospace}
.hoja .cli{display:grid;grid-template-columns:2fr 1fr;gap:4px 14px;padding:8px 0;border-bottom:1px solid #15171b;line-height:1.6}.hoja .cli .anc{grid-column:1/-1}
.hoja table{width:100%;border-collapse:collapse;margin-top:6px}
.hoja th{text-align:left;border-bottom:1.5px solid #15171b;padding:4px 6px;font-size:10px;text-transform:uppercase}
.hoja td{padding:4px 6px;border-bottom:1px solid #ddd}.hoja .n{text-align:right;white-space:nowrap}.hoja .c{text-align:center;width:60px}
.hoja tfoot td{font-weight:700;border-top:1.5px solid #15171b;border-bottom:0}
.obs-i{margin-top:8px}.pie-i{margin-top:auto;padding-top:14px;display:flex;justify-content:space-between;align-items:flex-end}
.firma{border-top:1px solid #15171b;width:220px;text-align:center;padding-top:3px}
.cai{border-top:1px solid #15171b;margin-top:8px;padding-top:4px;font-size:10.5px;text-align:right}
.copia{position:absolute;right:14px;bottom:4px;font-size:8.5px;color:#7b8189}

@media print{
  @page formulario{size:A4;margin:0}
  body{background:#fff}
  .barra,.no-print,#vLista,#vForm,.aviso,.cargando,.modal{display:none!important}
  #app,#vImpr{display:block!important}
  .vista{padding:0;max-width:none}
  #impr{padding:0;border-radius:0}
}

/* Tablet vertical / teléfono */
@media (max-width:820px){
  .barra{flex-wrap:wrap;gap:10px}.empresas{order:3;flex-basis:100%;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap}
  .fila{grid-template-columns:1fr auto;gap:6px 12px}.f-num{grid-column:1/-1;font-size:13px;color:var(--muted)}.f-tot{text-align:left}
  .g3{grid-template-columns:1fr}.span2{grid-column:auto}
  .cli-lista{grid-template-columns:1fr}
  .renglon,.renglon:has([data-k="precio"]){grid-template-columns:1fr 1fr}.renglon .r-art{grid-column:1/-1}.quitar{justify-self:end}
  .pie{flex-wrap:wrap}.totales{flex-basis:100%}
}

/* Remito R: número del formulario de papel */
.num-papel{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted);background:var(--sunken);border:1px solid var(--border);border-radius:10px;padding:12px 14px}
.num-papel-in{display:flex;align-items:center;gap:6px;font:600 22px var(--f-data);color:var(--ink)}
.num-papel-in input{font:600 22px var(--f-data);width:200px}
.conf-papel{background:var(--sunken);border:1px solid var(--border-strong);border-radius:10px;padding:12px 14px;margin-bottom:12px;font-size:16px}
.conf-papel b{font-family:var(--f-data)}.conf-papel small{display:block;color:var(--muted);font-size:13px;margin-top:2px}
.impr-acc .btn.activa{border-color:var(--ink);box-shadow:inset 0 -3px 0 var(--polar)}
.ayuda-form{margin:-6px 0 12px}
.x.ctrl{border:1.5px dashed #15171b;padding:6px 2px;align-self:start}.x.ctrl small{font-size:8px;font-weight:700}

/* Datos sobre el formulario preimpreso: posiciones absolutas en mm (A4) */
.sobre-form{padding:0!important;background:none!important}
.form-hoja{page:formulario;position:relative;width:210mm;height:297mm;background:#fff;color:#000;font:11pt Arial,Helvetica,sans-serif;margin:0 auto 12px;box-shadow:0 0 0 1px var(--border);overflow:hidden}
.form-hoja .d{position:absolute;white-space:nowrap}
.form-hoja .d.r{transform:translateX(-100%)}.form-hoja .d.c{transform:translateX(-50%)}.form-hoja .d.b{font-weight:700}
@media print{
  body.formulario{margin:0}
  .form-hoja{box-shadow:none;margin:0;page-break-after:always;break-after:page}
  .form-hoja:last-child{page-break-after:auto;break-after:auto}
}
@page formulario{size:A4;margin:0}

/* Próximo formulario y controles del papel */
.proximo{display:flex;justify-content:space-between;align-items:center;gap:14px;background:var(--surface);border:1px solid var(--border-strong);border-left:4px solid var(--polar);border-radius:var(--r);padding:12px 16px;margin-bottom:14px}
.proximo small{display:block;color:var(--muted);font-size:12.5px}
.proximo b{display:block;font:600 24px var(--f-data);margin:2px 0}
.quedan-pocos{color:var(--mal);font-weight:600}
.btn.peligro{color:var(--mal);border-color:var(--mal)}
.campo{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted);margin-top:10px}
.form-hoja .d.ref{font-size:7pt;color:#555}
