/* Estilos compartidos de los modulos: tablas, botones chicos, pills,
   formularios y la matriz de permisos. Heredan la paleta de estilos.css. */

.sub2{color:var(--mut);font-size:14px;margin-bottom:20px}

/* barra de acciones arriba de una tabla */
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.row .sp{flex:1}
.search{max-width:340px}
.filtro{max-width:200px}

/* botones chicos (dentro de tablas/paneles) */
.btnx{display:inline-block;font-size:13px;font-weight:500;padding:7px 12px;
  border:1px solid var(--line2);border-radius:3px;background:var(--paper);
  color:var(--ink);cursor:pointer;font-family:inherit;white-space:nowrap;width:auto}
.btnx:hover{border-color:var(--ink)}
.btnx.p{background:var(--ink);border-color:var(--ink);color:#fff}
.btnx.p:hover{background:#000}
.btnx.d{color:var(--red);border-color:#F0C1C1;background:#FCEBEB}
.btnx.d:hover{border-color:var(--red)}

/* tablas */
table{width:100%;border-collapse:collapse;background:var(--paper);
  border:1px solid var(--line);border-radius:4px;overflow:hidden;font-size:14px}
th{background:var(--surf2);text-align:left;font-size:11px;font-family:"IBM Plex Mono";
  letter-spacing:.1em;text-transform:uppercase;color:var(--mut);padding:11px 14px;
  border-bottom:1px solid var(--line)}
td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--surf)}
td .acc{display:flex;gap:6px;justify-content:flex-end}

/* pills de estado */
.pill{display:inline-block;font-family:"IBM Plex Mono";font-size:10.5px;
  letter-spacing:.06em;padding:3px 8px;border:1px solid var(--line2);
  border-radius:2px;color:var(--mut);white-space:nowrap}
.pill.ok{color:var(--ok);border-color:#B7DCCB;background:#EEF7F2}
.pill.no{color:var(--warn);border-color:#E0CFA4;background:#FDF8EC}
.pill.red{color:var(--red);border-color:#F0C1C1;background:#FCEBEB}

.empty{background:var(--paper);border:1px dashed var(--line2);border-radius:4px;
  padding:40px 24px;text-align:center;color:var(--mut)}

/* formulario en panel */
.panel{background:var(--paper);border:1px solid var(--line);border-radius:4px;
  margin-bottom:18px;overflow:hidden}
.panel .ph{padding:14px 18px;border-bottom:1px solid var(--line);background:var(--surf2);
  font-family:"IBM Plex Mono";font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--mut);display:flex;align-items:center;gap:12px}
.panel .ph .sp{flex:1}
.panel .pb{padding:18px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fld{margin-bottom:14px}
.fld label{display:block;font-family:"IBM Plex Mono";font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mut2);margin-bottom:5px}
.fld input{font-family:inherit;font-size:14px;padding:9px 11px;border:1px solid var(--line2);
  border-radius:3px;background:var(--paper);color:var(--ink);width:100%}
.fld input:focus{outline:none;border-color:var(--ink)}
select{font-family:inherit;font-size:14px;padding:9px 11px;border:1px solid var(--line2);
  border-radius:3px;background:var(--paper);color:var(--ink);width:100%}
select:focus{outline:none;border-color:var(--ink)}
textarea{font-family:inherit;font-size:14px;padding:9px 11px;border:1px solid var(--line2);
  border-radius:3px;background:var(--paper);color:var(--ink);width:100%;resize:vertical;line-height:1.5}
textarea:focus{outline:none;border-color:var(--ink)}
.msg{font-size:13px;margin:6px 0}
.msg.err{color:var(--red)}

/* clave temporal mostrada tras resetear */
.clavebox{font-family:"IBM Plex Mono";font-size:16px;background:var(--surf2);
  border:1px dashed var(--line2);border-radius:4px;padding:12px 14px;text-align:center;
  letter-spacing:.05em;margin:10px 0}

/* matriz de permisos */
.matriz{width:100%;border-collapse:collapse;font-size:13.5px}
.matriz th{text-align:center}
.matriz th:first-child{text-align:left}
.matriz td{text-align:center;border-bottom:1px solid var(--line)}
.matriz td:first-child{text-align:left;font-weight:500}
.matriz input[type=checkbox]{width:auto}
.matriz .modrow td{background:var(--surf)}

/* ============================================================
   LISTADO DE PEDIDOS - tabla compacta estilo LASER76
   ============================================================ */
table.oplist td{vertical-align:top;padding:14px 14px}
.oplist .opnum{width:70px}
.oplist .opnum span{font-family:"IBM Plex Mono";font-size:16px;font-weight:500;
  color:var(--ink);border-bottom:2px solid var(--line2);padding-bottom:1px}
.oplist .opnum a.oplink{font-family:"IBM Plex Mono";font-size:16px;font-weight:500;
  color:var(--ink);border-bottom:2px solid var(--line2);padding-bottom:1px;cursor:pointer}
.oplist .opnum a.oplink:hover{border-bottom-color:var(--red);color:var(--red)}
.oplist .opfecha{width:120px;color:var(--mut);font-size:13px;white-space:nowrap}
.oplist .opcli{min-width:0}
.oplist .opnom{font-weight:600;color:var(--ink)}
.oplist .opciudad{color:var(--mut2);font-size:13px}
.oplist .opl{font-size:13.5px;color:var(--mut);margin-top:4px;line-height:1.5}
.oplist .opl:first-of-type{margin-top:7px}
.oplist .opcod{font-family:"IBM Plex Mono";font-size:12.5px;color:var(--mut2)}
.oplist .opdesc{color:var(--ink)}
.oplist .opest{color:var(--mut2);font-size:12.5px}
.oplist .optot{width:150px;text-align:right;white-space:nowrap;
  font-family:"IBM Plex Mono";font-size:15px;color:var(--ink)}
/* flecha de orden en encabezados clickeables */
.oplist th.th-ord{cursor:pointer;user-select:none}
.oplist th.th-ord:hover{color:var(--ink)}
.oplist th .ord{color:var(--line2);font-size:11px}
.oplist th .ord.on{color:var(--red)}
/* link a la OP dentro del renglon de ingreso */
.oplist .opl a.oplink{color:var(--ink);border-bottom:1px solid var(--line2);cursor:pointer}
.oplist .opl a.oplink:hover{color:var(--red);border-bottom-color:var(--red)}
/* link del MES en el analisis (abre proveedores de ese mes) */
.oplist a.anlink{color:var(--ink);border-bottom:2px solid var(--line2);padding-bottom:1px;cursor:pointer;font-weight:600}
.oplist a.anlink:hover{color:var(--red);border-bottom-color:var(--red)}
.oplist tfoot a.anlink.antot{color:#fff;border-bottom-color:rgba(255,255,255,.4)}
.oplist tfoot a.anlink.antot:hover{color:#fff;border-bottom-color:#fff}
/* filas de subtotal por mes y total del periodo (estadisticas) */
.oplist tr.estsub td{background:var(--surf2);border-top:1px solid var(--line2)}
.oplist tfoot tr.esttot td{background:var(--ink);color:#fff;border-top:2px solid #000}
.oplist tfoot tr.esttot .optot{color:#fff}

/* listado de stock AGRUPADO por modelo. Columnas nivel 1:
   CANTIDAD STOCK (izq) | MODELO (centro) | CANTIDAD VENDIDA (der). */
table.oplist.stagrup td{vertical-align:middle}
.oplist.stagrup th.stcant{text-align:center}
.oplist.stagrup th.stmod{text-align:left}
.oplist.stagrup th.stvend{text-align:center}
.oplist.stagrup td.stcant{width:150px;text-align:center;white-space:nowrap;
  font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:15px;font-weight:700;color:var(--ink)}
.oplist.stagrup td.stmod{text-align:left}
.oplist.stagrup td.stvend{width:170px;text-align:center;white-space:nowrap;
  font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:15px;font-weight:700;color:var(--mut)}
.oplist.stagrup tfoot td{background:var(--surf2);border-top:2px solid var(--line2);
  border-bottom:0;font-weight:600;color:var(--ink);font-size:13.5px}
.oplist.stagrup tfoot td.stcant,
.oplist.stagrup tfoot td.stvend{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:15px}
.oplist.stagrup tbody tr.strow{cursor:pointer}
.oplist.stagrup td.stmod a.stlink{color:var(--ink);border-bottom:1px solid var(--line2);
  cursor:pointer;font-weight:600}
.oplist.stagrup tbody tr.strow:hover td.stmod a.stlink{color:var(--red);border-bottom-color:var(--red)}
.oplist.stagrup tbody tr.stcero td.stcant{color:var(--mut2)}
.oplist.stagrup tbody tr.stcero td.stmod a.stlink{color:var(--mut)}

/* nivel 2 - series individuales del modelo */
.oplist.stagrup.stserlist td.stserie{width:150px;text-align:center;white-space:nowrap;
  font-family:"IBM Plex Mono";font-size:15px;font-weight:600;color:var(--ink)}
.oplist.stagrup.stserlist th.stserie{text-align:center}
.oplist.stagrup.stserlist td.stmodrep{text-align:left;font-size:14px;color:var(--ink);font-weight:600}
.oplist.stagrup.stserlist th.stmodrep{text-align:left}
.oplist.stagrup.stserlist td.stubi{width:120px;text-align:center;font-size:14px;color:var(--ink)}
.oplist.stagrup.stserlist th.stubi{text-align:center}
.oplist.stagrup.stserlist td.stest{width:120px;text-align:center}
.oplist.stagrup.stserlist th.stest{text-align:center}
.oplist.stagrup.stserlist .stsinu{color:var(--mut2);font-style:italic;font-size:13px}
.oplist.stagrup.stserlist tfoot td.stserie{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:15px}

/* nivel 2 - columnas de bolso (solo pedaleras) */
.oplist.stagrup.stserlist th.stbol,.oplist.stagrup.stserlist td.stbol{width:110px;text-align:center}
.oplist.stagrup.stserlist th.stbolnro,.oplist.stagrup.stserlist td.stbolnro{width:160px;text-align:center}
.oplist.stagrup.stserlist td.stbolnro .bolnro{font-family:"IBM Plex Mono";font-size:14px;font-weight:600;color:var(--ink)}
.oplist.stagrup.stserlist td.stbolnro .bolnro.vacio{color:var(--mut2);font-weight:400}
.oplist.stagrup.stserlist td.stbolnro .bolubi{color:var(--mut2);font-size:12px;font-weight:400}
.oplist.stagrup.stserlist td.stbolnro.prok{background:#EEF7F2;transition:background .3s}
/* toggle si/no */
.tgl{position:relative;display:inline-block;width:42px;height:23px;cursor:pointer}
.tgl input{opacity:0;width:0;height:0}
.tgl .tglslider{position:absolute;inset:0;background:var(--line2);border-radius:999px;transition:.2s}
.tgl .tglslider:before{content:"";position:absolute;height:17px;width:17px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.tgl input:checked + .tglslider{background:var(--red)}
.tgl input:checked + .tglslider:before{transform:translateX(19px)}
.tgl input:disabled + .tglslider{opacity:.5}
/* toggle bloqueado (disponibilidad): atenuado y con candadito hasta doble clic */
.tgl.locked{opacity:.55;cursor:not-allowed}
.tgl.locked input:checked + .tglslider{background:#1E7A54}
.tgl.unlocked{opacity:1;cursor:pointer;box-shadow:0 0 0 2px rgba(217,28,38,.35);border-radius:999px}
.tgl.unlocked input:checked + .tglslider{background:#1E7A54}

/* nivel 2 COMPACTO: columnas encogidas a su contenido (width:1%) y una columna
   de relleno al final que absorbe el sobrante. El contenido de Nº de serie,
   Ubicacion, Lleva bolso, Nº de bolso y Disponible va CENTRADO respecto a su
   titulo; Modelo y Descripcion del bolso van a la izquierda. */
.oplist.stagrup.stcompact th,.oplist.stagrup.stcompact td{white-space:nowrap}
.oplist.stagrup.stcompact th.stserie,.oplist.stagrup.stcompact td.stserie,
.oplist.stagrup.stcompact th.stmodrep,.oplist.stagrup.stcompact td.stmodrep,
.oplist.stagrup.stcompact th.stubi,.oplist.stagrup.stcompact td.stubi,
.oplist.stagrup.stcompact th.stbol,.oplist.stagrup.stcompact td.stbol,
.oplist.stagrup.stcompact th.stbolnro,.oplist.stagrup.stcompact td.stbolnro,
.oplist.stagrup.stcompact th.stboldesc,.oplist.stagrup.stcompact td.stboldesc,
.oplist.stagrup.stcompact th.stdisp,.oplist.stagrup.stcompact td.stdisp{width:1%}
.oplist.stagrup.stcompact th.stserie,.oplist.stagrup.stcompact td.stserie,
.oplist.stagrup.stcompact th.stubi,.oplist.stagrup.stcompact td.stubi,
.oplist.stagrup.stcompact th.stbol,.oplist.stagrup.stcompact td.stbol,
.oplist.stagrup.stcompact th.stbolnro,.oplist.stagrup.stcompact td.stbolnro,
.oplist.stagrup.stcompact th.stdisp,.oplist.stagrup.stcompact td.stdisp{text-align:center}
.oplist.stagrup.stcompact th.stmodrep,.oplist.stagrup.stcompact td.stmodrep,
.oplist.stagrup.stcompact th.stboldesc,.oplist.stagrup.stcompact td.stboldesc{text-align:left}
/* columna descripcion del bolso */
.oplist.stagrup.stcompact th.stboldesc,.oplist.stagrup.stcompact td.stboldesc{padding-right:22px}
.oplist.stagrup.stcompact td.stboldesc .boldesc{font-size:14px;color:var(--ink);font-weight:600}
.oplist.stagrup.stcompact td.stboldesc .boldesc.vacio{color:var(--mut2);font-weight:400}
/* columna disponible */
.oplist.stagrup.stcompact th.stdisp,.oplist.stagrup.stcompact td.stdisp{padding-left:18px}
/* columna de relleno que empuja todo a la izquierda */
.oplist.stagrup.stcompact th.stfill,.oplist.stagrup.stcompact td.stfill{width:auto}

/* fila NO DISPONIBLE: toda la linea atenuada y bloqueada (solo el toggle de
   disponibilidad se puede desbloquear con doble clic para reactivar) */
.oplist.stagrup.stserlist tbody tr.stnodisp td{color:var(--mut2);background:var(--surf)}
.oplist.stagrup.stserlist tbody tr.stnodisp:hover td{background:var(--surf)}
.oplist.stagrup.stserlist tbody tr.stnodisp td.stserie{color:var(--mut)}
.oplist.stagrup.stserlist tbody tr.stnodisp .tgl.bloq{opacity:.4;pointer-events:none}
.oplist.stagrup.stserlist tbody tr.stnodisp td.stboldesc .boldesc{color:var(--mut2);font-weight:400}
/* separador antes de los no disponibles */
.oplist.stagrup.stserlist tbody tr.stsep td{background:var(--surf2);
  font-family:"IBM Plex Mono";font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--mut2);text-align:left;padding:8px 14px;border-top:2px solid var(--line2)}
.oplist.stagrup.stserlist tbody tr.stsep:hover td{background:var(--surf2)}

/* barra sobre el listado: filtros a la izq, boton PDF a la der */
.stbar{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.stbar-izq{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:center}
.stbar-der{flex:none}

/* ============================================================
   LISTA DE PRECIOS - tabla maestra editable
   ============================================================ */
.oplist.prlist th.th-ord{cursor:pointer;user-select:none}
.oplist.prlist th.th-ord:hover{color:var(--ink)}
.oplist.prlist th .ord{color:var(--line2);font-size:11px;margin-left:2px}
.oplist.prlist th .ord.on{color:var(--red)}
.oplist.prlist td.prcod{width:64px;font-family:"IBM Plex Mono";font-size:13px;color:var(--mut2);text-align:center}
.oplist.prlist th.prcod{text-align:center}
.oplist.prlist td.prmod{text-align:left}
.oplist.prlist td.prmod a.prlink{color:var(--ink);border-bottom:1px solid var(--line2);cursor:pointer;font-weight:600}
.oplist.prlist td.prmod a.prlink:hover{color:var(--red);border-bottom-color:var(--red)}
.oplist.prlist td.prpre{width:130px;text-align:right;white-space:nowrap;font-family:"IBM Plex Mono";font-size:14px;color:var(--ink)}
.oplist.prlist th.prpre{text-align:right}
.oplist.prlist td.prpre.pedit{cursor:cell}
.oplist.prlist td.prpre.pedit:hover{background:var(--surf);box-shadow:inset 0 0 0 1px var(--line2)}
.oplist.prlist td.prpre input.prinp{font-family:"IBM Plex Mono";font-size:14px;text-align:right;
  width:110px;padding:5px 7px;border:1px solid var(--ink);border-radius:3px;background:var(--paper);color:var(--ink)}
.oplist.prlist td.prpre input.prinp:focus{outline:none;border-color:var(--red)}
.oplist.prlist td.prpre.prok{background:#EEF7F2;box-shadow:inset 0 0 0 1px #B7DCCB;transition:background .3s}

/* ============================================================
   PLANIFICACION - reposicion (Productos > Planificacion)
   ============================================================ */
/* franja superior: filtros de calculo a la izquierda, celda total + PDF arriba a la derecha */
.pltop{display:flex;gap:20px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;margin-bottom:14px}
.plctrl{display:flex;flex-wrap:wrap;gap:26px;align-items:flex-start;flex:1;min-width:280px}
.plgrp{display:flex;flex-direction:column;gap:7px}
.plgrp.plgrp-inline{flex-direction:row;align-items:center;gap:10px;flex-wrap:wrap}
.pllbl{font-family:"IBM Plex Mono";font-size:10px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--mut2)}
.plchips{display:flex;gap:6px;flex-wrap:wrap}
.plchip{font-size:13px;font-weight:500;padding:6px 13px;border:1px solid var(--line2);
  border-radius:999px;background:var(--paper);color:var(--mut);cursor:pointer;white-space:nowrap}
.plchip:hover{border-color:var(--ink);color:var(--ink)}
.plchip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.plseldia{max-width:120px}
.plsugtxt{color:var(--red)}

/* barra de proxima compra COMPACTA (al lado del selector de dia) */
.plbar{display:flex;align-items:center;gap:8px;min-width:200px;margin-top:4px}
.plbar-txt{font-size:12.5px;color:var(--ink);white-space:nowrap}
.plbar-txt b{font-weight:600}
.plbar-dias{font-family:"IBM Plex Mono";font-size:11px;color:var(--mut2)}
.plbar-dias.urg{color:var(--red);font-weight:600}
.plbar-track{flex:1;min-width:70px;height:6px;background:var(--surf2);border:1px solid var(--line);border-radius:999px;overflow:hidden}
.plbar-fill{height:100%;background:var(--ink);border-radius:999px;transition:width .3s}
.plbar-fill.urg{background:var(--red)}

/* bloque derecho (arriba): celda total + PDF, apilados */
.plhead-der{display:flex;flex-direction:column;gap:8px;align-items:stretch;flex:none}
/* fila de busqueda/filtros de la tabla (debajo de la franja superior) */
.plhead-izq{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.plsolo{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;color:var(--mut);cursor:pointer}
.plsolo input{width:auto}
/* titulo fijo "Pedalboards" en Planificacion de fabricacion (reemplaza los filtros) */
.fbtitulo{font-family:"Days One";font-size:18px;color:var(--ink)}
/* fila titulo Pedalboards + check, juntos y compactos (fabricacion) */
.fbhead{display:flex;align-items:center;gap:16px;margin-top:2px}
/* la tabla de fabricacion arranca mas arriba (mas alto util) */
.fbwrap{max-height:calc(100vh - 210px)}

/* celda CUADRADA con el total a reponer */
.plres{display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:180px;min-height:88px;padding:10px 12px;border:1px solid var(--line2);
  border-radius:10px;background:var(--surf2);text-align:center}
.plres-lbl{font-family:"IBM Plex Mono";font-size:9px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--mut2)}
.plres-val{font-family:"Days One";font-size:34px;color:var(--red);line-height:1.05}
.plres-sub{font-size:11px;color:var(--mut2)}
.plres-sub2{font-size:11px;color:var(--mut2)}
.plpdfbtn{width:180px;text-align:center}

/* ENCABEZADO FIJO: la tabla vive dentro de un contenedor con scroll propio
   (.plwrap) cuya altura se acota para llenar la pantalla. Los th se pegan
   arriba de ese contenedor (top:0) y los datos scrollean por debajo. */
.plwrap{max-height:calc(100vh - 240px);overflow:auto;
  border:1px solid var(--line);border-radius:4px;background:var(--paper)}
table.oplist.pllist{border:0;border-radius:0;overflow:visible}
.oplist.pllist thead th{position:-webkit-sticky;position:sticky;top:0;z-index:5}
.oplist.pllist thead th.pledit{background:#EAF1FB}
.oplist.pllist thead th.plsug{background:#FCEBEB}
.oplist.pllist thead th.prcod,
.oplist.pllist thead th.prmod,
.oplist.pllist thead th.plnum{background:var(--surf2)}

.oplist.pllist td.prcod{width:56px}
/* columnas editables por el usuario: fondo levemente azulado */
.oplist.pllist th.pledit{text-align:center;background:#EAF1FB;color:#2B5C97}
.oplist.pllist td.pledit{width:96px;text-align:center;white-space:nowrap;
  font-family:"IBM Plex Mono";font-size:14px;color:#1f4f86;background:#F4F8FD;cursor:cell}
.oplist.pllist td.pledit:hover{background:#E7F0FB;box-shadow:inset 0 0 0 1px #BBD5F0}
.oplist.pllist td.pledit.prok{background:#EEF7F2;box-shadow:inset 0 0 0 1px #B7DCCB;transition:background .3s}
.oplist.pllist td.pledit input.prinp{font-family:"IBM Plex Mono";font-size:14px;text-align:center;
  width:74px;padding:5px 6px;border:1px solid var(--ink);border-radius:3px;background:var(--paper);color:var(--ink)}
.oplist.pllist td.pledit input.prinp:focus{outline:none;border-color:var(--red)}
.oplist.pllist .plu{font-family:"IBM Plex Mono";font-size:9px;color:#5A7CA6;letter-spacing:0}
.oplist.pllist .plu2{font-family:"IBM Plex Mono";font-size:9px;color:#C77;letter-spacing:0}
.oplist.pllist .plvacio{color:var(--mut2)}
/* columna SUGERIDA (stock de seguridad auto): rojo, solo lectura */
.oplist.pllist th.plsug{text-align:center;background:#FCEBEB;color:var(--red)}
.oplist.pllist td.plsug{width:92px;text-align:center;white-space:nowrap;
  font-family:"IBM Plex Mono";font-size:14px;font-weight:600;color:var(--red);background:#FEF5F5}
/* columnas calculadas */
.oplist.pllist th.plnum{text-align:center}
.oplist.pllist td.plnum{width:92px;text-align:center;white-space:nowrap;
  font-family:"IBM Plex Mono";font-size:14px;color:var(--ink)}
.oplist.pllist td.plnum.plmut{color:var(--mut)}
.oplist.pllist td.plnum .plrep{color:var(--red);font-weight:600}
.oplist.pllist td.prmod{text-align:left;font-weight:600}
/* fila ALARMA: stock por debajo del punto de reposicion (borde rojo a la izq) */
.oplist.pllist tbody tr.plalarma td:first-child{box-shadow:inset 3px 0 0 var(--red)}
.oplist.pllist tbody tr.plalarma td.prmod{color:var(--red)}

/* ============================================================
   FICHA DE PRODUCTO (serie puntual) - TARJETA estilo LASER76
   ============================================================ */
.pcard{background:#000;border-radius:16px;padding:16px;overflow:hidden;
  box-shadow:0 20px 50px -20px rgba(0,0,0,.5);max-width:820px}
.pcard-head{display:flex;align-items:flex-start;justify-content:space-between;
  gap:16px;padding:6px 8px 18px}
.pcard-brand{color:#fff;line-height:1;font-family:"Days One";font-size:30px;letter-spacing:.01em}
.pcard-brand .a{color:var(--red)}
.pcard-brand sup{font-size:11px;top:-1.1em}
.pcard-sub{font-family:"IBM Plex Mono";font-size:11px;letter-spacing:.42em;
  color:#fff;margin-top:6px;padding-left:2px}
.pcard-claim{font-family:"IBM Plex Mono";font-size:10px;letter-spacing:.18em;
  color:#fff;text-align:right;line-height:1.7;border-right:2px solid var(--red);
  padding-right:10px}
.pcard-grid{display:grid;gap:12px;margin-top:12px}
.pcard-g2{grid-template-columns:1fr 1fr}
.pcard-g3{grid-template-columns:1fr 1fr 1fr}
.pc-cell{background:#fff;border-radius:12px;padding:14px 16px;display:flex;
  align-items:center;gap:14px;min-width:0}
.pc-ic{flex:none;width:48px;height:48px;border-radius:11px;background:var(--red);
  color:#fff;display:flex;align-items:center;justify-content:center}
.pc-ic svg{width:24px;height:24px}
.pc-body{min-width:0}
.pc-lbl{font-family:"IBM Plex Mono";font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--mut2)}
.pc-val{margin-top:3px;min-width:0}
.pc-serie{font-family:"Days One";font-size:26px;color:var(--ink)}
.pc-prod{font-weight:700;font-size:17px;color:var(--ink);display:block;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pc-tag{display:inline-block;margin-top:4px;font-family:"IBM Plex Mono";font-size:9.5px;
  letter-spacing:.1em;background:var(--surf2);color:var(--mut);border-radius:4px;padding:3px 8px}
.pc-est{display:inline-flex;align-items:center;gap:4px;font-family:"IBM Plex Mono";
  font-size:13px;font-weight:600;letter-spacing:.04em}
.pc-est.stock{color:var(--ok)}
.pc-est.vend{color:var(--red)}
.pc-est.nodisp{color:var(--warn)}
.pc-ubi{font-family:"Days One";font-size:18px;color:var(--ink)}
.pc-ord{font-family:"Days One";font-size:18px;color:var(--ink)}

/* ============================================================
   STOCK DE PRODUCTOS - layout partido estilo LASER76
   ============================================================ */
.stbuscador{max-width:none;flex:1}
.stocktop{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;margin-bottom:22px;align-items:stretch}
.stockcards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.stockcards .card{padding:16px 16px}
.stockcards .card .t{font-family:"IBM Plex Mono";font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut2)}
.stockcards .card .v{font-family:"Days One";font-size:26px;margin-top:6px}
.stockcards .card .s{font-size:11.5px;color:var(--mut);margin-top:2px}
.stockcards .card.big{background:var(--ink)}
.stockcards .card.big .t{color:#8A8A92}
.stockcards .card.big .v{color:#fff}
.stockcards .card.big .s{color:#8A8A92}
.stiposbox{background:var(--paper);border:1px solid var(--line);border-radius:5px;padding:16px 18px;display:flex;flex-direction:column}
.stiposcab{font-family:"IBM Plex Mono";font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--mut2);text-align:center;margin-bottom:12px}
.stiposcuerpo{display:grid;grid-template-columns:1fr 1fr;gap:4px 22px;flex:1;align-content:center}
.stiprow{display:flex;align-items:center;gap:8px;font-size:13.5px;min-width:0;
  cursor:pointer;padding:5px 8px;margin:0 -8px;border-radius:5px}
.stiprow:hover{background:var(--surf)}
.stiprow.on{background:#FCEBEB}
.stiprow.on .stipnom{color:var(--red);font-weight:600}
.stipdot{width:10px;height:10px;border-radius:3px;flex:none}
.stippct{font-family:"IBM Plex Mono";font-size:12px;color:var(--mut2);width:34px;text-align:right}
.stipsep{color:var(--mut2)}
.stipcant{font-family:"Days One";font-size:15px;min-width:28px}
.stipnom{color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stfiltro{display:inline-flex;align-items:center;gap:8px;background:var(--surf);
  border:1px solid var(--line2);border-radius:999px;padding:7px 14px;font-size:13.5px;
  color:var(--mut);margin-bottom:14px;margin-right:8px}
.stfiltro b{color:var(--ink)}

/* ============================================================
   FICHA DE ORDEN (consulta) - diseño estilo LASER76
   ============================================================ */
.opv-head{display:flex;align-items:flex-start;gap:14px 18px;flex-wrap:wrap;margin-bottom:16px}
.opv-titulo{font-family:"Days One";font-size:24px;line-height:1.15;color:var(--ink)}
.opv-titulo .num{color:var(--red)}
.opv-titulo .sep{color:var(--line2);margin:0 8px}
.opv-titulo .cli{border-bottom:2px solid var(--line2);padding-bottom:1px}
.opv-ciudad{color:var(--mut2);font-size:15px;font-weight:400;font-family:"IBM Plex Sans"}
.opv-head .sp{flex:1}
.opv-negras{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.opv-negras .sp{flex:1;min-width:0}
.opv-total{display:inline-flex;align-items:center;gap:14px;
  padding:12px 20px;border-radius:12px;background:linear-gradient(180deg,#161618,#000);
  border:1px solid #000;box-shadow:0 12px 26px -16px rgba(0,0,0,.7)}
.opv-total .ico{flex:none;width:40px;height:40px;display:flex;align-items:center;justify-content:center;
  border-radius:10px;color:var(--red);background:rgba(217,28,38,.14)}
.opv-total .ico svg{width:22px;height:22px}
.opv-total .cont{text-align:right;line-height:1.15}
.opv-total .cont.izq{text-align:left}
.opv-total .rot{font-family:"IBM Plex Mono";font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.opv-total .val{font-family:"IBM Plex Mono";font-size:22px;margin-top:3px;color:#fff}
.opv-total .negra-inp{background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.25);
  color:#fff;font-family:"IBM Plex Mono";font-size:20px;margin-top:2px;padding:1px 0;width:auto;
  color-scheme:dark}
.opv-total .negra-inp:focus{outline:none;border-bottom-color:var(--red)}
.opv-estados{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}

/* tabla de items dentro de la ficha/alta de orden de compra y de pedido:
   Cantidad | Descripcion | Precio unit. | Subtotal (misma tipografia en todo) */
table.ocdet{border:0;border-radius:0;font-size:14px}
.ocdet th{background:var(--surf2);font-family:"IBM Plex Mono";font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--mut2);padding:10px 14px}
.ocdet td{padding:12px 14px;border-bottom:1px solid var(--line);color:var(--ink);vertical-align:middle}
.ocdet tbody tr:last-child td{border-bottom:0}
.ocdet td.ocd-cant{width:96px;text-align:center;white-space:nowrap}
.ocdet td.ocd-desc{text-align:left}
.ocdet td.ocd-pu{width:150px;text-align:right;white-space:nowrap}
.ocdet td.ocd-sub{width:160px;text-align:right;white-space:nowrap;font-weight:600}
.ocdet td.ocd-x{width:60px;text-align:right}
.ocdet th.ocd-cant{text-align:center}
.ocdet th.ocd-desc{text-align:left}
.ocdet th.ocd-pu,.ocdet th.ocd-sub{text-align:right}
/* columna Nro de serie (ficha de pedido) */
.ocdet td.ocd-nser{width:110px;text-align:center;white-space:nowrap}
.ocdet th.ocd-nser{text-align:center}
.ocdet td.ocd-nser .ocd-serie{font-family:"IBM Plex Mono";font-size:14px;color:var(--ink);
  border:1px solid var(--line2);border-radius:4px;padding:3px 8px}
/* tabla EDITABLE (alta/edicion): inputs de cantidad y precio dentro de las celdas */
.ocdet.ocdet-ed td.ocd-cant input.canted{width:60px;text-align:center;font-family:"IBM Plex Mono";
  font-size:14px;padding:6px 6px;border:1px solid var(--line2);border-radius:3px;background:var(--paper);color:var(--ink)}
.ocdet.ocdet-ed td.ocd-cant input.canted:focus{outline:none;border-color:var(--ink)}
.ocdet.ocdet-ed td.ocd-pu input.precioed{width:120px;text-align:right;font-family:"IBM Plex Mono";
  font-size:14px;padding:6px 8px;border:1px solid var(--line2);border-radius:3px;background:var(--paper);color:var(--ink)}
.ocdet.ocdet-ed td.ocd-pu input.precioed:focus{outline:none;border-color:var(--ink)}
.ocdet.ocdet-ed td.ocd-sub{white-space:nowrap}
.ocdet.ocdet-ed td.ocd-sub .quitar{margin-left:10px;font-weight:400}
/* linea de tags (tipo / ubicacion / entrega) debajo de la descripcion en ventas */
.ocdet .ocd-sub2{margin-top:6px;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.ocdet .ocd-meta{font-size:12px;color:var(--mut2)}
.ocdet td.ocd-desc .cod{font-family:"IBM Plex Mono";font-size:12px;color:var(--mut2);
  border:1px solid var(--line2);border-radius:4px;padding:2px 6px;margin-right:4px}
.ocdet td.ocd-desc .cod.concepto{color:#fff;background:var(--red);border:0;
  text-transform:uppercase;letter-spacing:.04em;font-size:10.5px;padding:3px 8px}

.opv-panel{border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:18px}
.opv-panel .barra{background:linear-gradient(90deg,#161618 68%,#2a0d10 100%);color:#fff;
  padding:14px 18px;display:flex;align-items:center;gap:11px;position:relative;overflow:hidden}
.opv-panel .barra::after{content:"";position:absolute;top:0;right:0;width:120px;height:100%;
  background:linear-gradient(115deg,transparent 40%,rgba(217,28,38,.55) 100%);pointer-events:none}
.opv-panel .barra .ic{flex:none;color:var(--red);display:flex;z-index:1}
.opv-panel .barra .ic svg{width:18px;height:18px}
.opv-panel .barra .tit{font-family:"IBM Plex Mono";font-size:11px;letter-spacing:.13em;text-transform:uppercase;z-index:1}
.opv-panel .cuerpo{padding:18px}
.opv-item{border:1px solid var(--line);border-radius:11px;overflow:hidden;margin-bottom:12px}
.opv-item:last-child{margin-bottom:0}
.opv-item .fila1{display:flex;align-items:center;gap:12px;padding:13px 16px;background:var(--surf);border-bottom:1px solid var(--line);flex-wrap:wrap}
.opv-item .cod{font-family:"IBM Plex Mono";font-size:12px;color:var(--mut2);border:1px solid var(--line2);border-radius:4px;padding:3px 7px}
.opv-item .desc{font-weight:600;font-size:15px}
.opv-item .fila1 .sp{flex:1}
.opv-item .fila2{display:flex;gap:26px;padding:12px 16px;flex-wrap:wrap}
.opv-item .dato .l{font-family:"IBM Plex Mono";font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:var(--mut2)}
.opv-item .dato .v{font-size:13.5px;margin-top:2px}
.opv-item .cantver{font-family:"IBM Plex Mono";font-size:13px;color:var(--mut2)}
.opv-item .precio{font-family:"IBM Plex Mono";font-size:15px;color:var(--mut)}
.opv-item .subver{font-family:"IBM Plex Mono";font-size:15px;color:var(--ink);
  min-width:120px;text-align:right;font-weight:600}
.opv-totbar{background:linear-gradient(90deg,#161618 68%,#2a0d10 100%);color:#fff;
  padding:15px 20px;display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden}
.opv-totbar::after{content:"";position:absolute;top:0;right:0;width:160px;height:100%;
  background:linear-gradient(115deg,transparent 40%,rgba(217,28,38,.55) 100%);pointer-events:none}
.opv-totbar .l{font-family:"IBM Plex Mono";font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.6);z-index:1}
.opv-totbar .v{font-family:"IBM Plex Mono";font-size:20px;color:#fff;z-index:1}
.opv-obs{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:14px}
.opv-obs .ph2{background:var(--surf);border-bottom:1px solid var(--line);padding:12px 16px;
  display:flex;align-items:center;gap:10px;position:relative}
.opv-obs .ph2::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:17px;background:var(--red);border-radius:0 3px 3px 0}
.opv-obs .ph2 .ic{color:var(--red);display:flex}.opv-obs .ph2 .ic svg{width:16px;height:16px}
.opv-obs .ph2 .tit{font-family:"IBM Plex Mono";font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--mut)}
.opv-obs .cuerpo{padding:16px;font-size:14px;line-height:1.5;white-space:pre-wrap}
.opv-obs .cuerpo.vacio{color:var(--mut2)}
.opv-obs.cliente-combo{position:relative;z-index:60;overflow:visible}
.opv-obs.cliente-combo .cuerpo{overflow:visible}

/* ============================================================
   ALTA DE ORDEN
   ============================================================ */
.buscares{border:1px solid var(--line);border-radius:4px;margin-top:6px;overflow:hidden;background:var(--paper)}
.buscares:empty{display:none}
.bres{padding:10px 12px;border-bottom:1px solid var(--line);cursor:pointer;display:flex;align-items:center;gap:8px;font-size:13.5px}
.bres:last-child{border-bottom:0}
.bres:hover{background:var(--surf)}
.clisel{display:flex;align-items:center;gap:8px;margin-top:8px;padding:10px 12px;
  border:1px solid var(--line2);border-radius:4px;background:var(--surf);font-size:14px}
.quitar{color:var(--red);font-size:13px;cursor:pointer}
.quitar:hover{text-decoration:underline}
.precioed{font-family:"IBM Plex Mono";font-size:14px;padding:7px 10px;border:1px solid var(--line2);
  border-radius:3px;background:var(--paper);color:var(--ink);width:130px}
.precioed:focus{outline:none;border-color:var(--ink)}
.cantwrap{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px}
.cantlbl{font-family:"IBM Plex Mono";font-size:8.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mut2)}
.canted{font-family:"IBM Plex Mono";font-size:14px;padding:7px 8px;border:1px solid var(--line2);
  border-radius:3px;background:var(--paper);color:var(--ink);width:64px;text-align:center}
.canted:focus{outline:none;border-color:var(--ink)}
.canted.fija{background:var(--surf2);color:var(--mut2);cursor:not-allowed;border-style:dashed}
.subt{font-family:"IBM Plex Mono";font-size:15px;color:var(--ink);font-weight:600;
  min-width:120px;text-align:right}
.optotrow{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding:14px 16px;
  background:var(--ink);border-radius:5px;color:#fff}
.optotrow span{font-family:"IBM Plex Mono";font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.optotrow b{font-family:"Days One";font-size:20px}
.combo{position:relative}
.combo-lista{position:absolute;left:0;right:0;top:100%;z-index:9999;margin-top:4px;
  background:var(--paper);border:1px solid var(--line2);border-radius:5px;
  box-shadow:0 14px 30px -12px rgba(0,0,0,.35);max-height:280px;overflow:auto;display:none}
.combo-lista.open{display:block}
.combo-item{padding:10px 12px;border-bottom:1px solid var(--line);cursor:pointer;font-size:14px}
.combo-item:last-child{border-bottom:0}
.combo-item:hover{background:var(--surf)}
.combo-item.vacio{color:var(--mut2);cursor:default}
.op-add{display:grid;grid-template-columns:200px 1fr;gap:14px;align-items:start;margin-bottom:4px}
.op-add label{display:block;font-family:"IBM Plex Mono";font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mut2);margin-bottom:5px}
.op-add-detalle .search{margin:0}
.op-cpt-row{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.op-cpt-row label{display:block;font-family:"IBM Plex Mono";font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mut2);margin-bottom:5px}
.op-cpt-row input{font-family:inherit;font-size:14px;padding:9px 11px;
  border:1px solid var(--line2);border-radius:3px;background:var(--paper);color:var(--ink);width:100%}
.op-cpt-row input:focus{outline:none;border-color:var(--ink)}
.op-cpt-txt{flex:1;min-width:200px}
.op-cpt-txt input,.op-cpt-monto input{font-family:inherit;font-size:14px;padding:9px 11px;
  border:1px solid var(--line2);border-radius:3px;background:var(--paper);color:var(--ink);width:100%}
.op-cpt-txt input:focus,.op-cpt-monto input:focus{outline:none;border-color:var(--ink)}
.op-cpt-monto{width:150px}
.op-cpt-monto input{font-family:"IBM Plex Mono";text-align:right}
.op-cpt-row input[type=number]{font-family:inherit;font-size:14px;padding:9px 11px;
  border:1px solid var(--line2);border-radius:3px;background:var(--paper);color:var(--ink);width:100%}
.op-cpt-row input[type=number]:focus{outline:none;border-color:var(--ink)}
.opv-item.concepto{border-color:#F0C1C1}
.opv-item.concepto .fila1{background:#FCEBEB;border-bottom:0}
.cod.concepto{font-family:"IBM Plex Mono";font-size:10.5px;letter-spacing:.04em;
  color:#fff;background:var(--red);border:0;border-radius:4px;padding:4px 9px;text-transform:uppercase}

/* ============================================================
   ESTADISTICAS DE VENTAS
   ============================================================ */
.estper{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.estperlab{font-family:"IBM Plex Mono";font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--mut2);margin-right:4px}
.chip{font-size:13.5px;font-weight:500;padding:8px 15px;border:1px solid var(--line2);
  border-radius:999px;background:var(--paper);color:var(--mut);cursor:pointer;font-family:inherit;white-space:nowrap}
.chip:hover{border-color:var(--ink);color:var(--ink)}
.chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.estfecha{font-family:inherit;font-size:13.5px;padding:7px 10px;border:1px solid var(--line2);
  border-radius:6px;background:var(--paper);color:var(--ink);width:auto}
.estsep{color:var(--mut2);font-size:13px}
.estrango{margin-bottom:18px;font-size:13px}
.estcards .card{cursor:pointer;text-align:center;transition:.15s}
.estcards .card .t{text-align:center}
.estcards .card .v{font-family:"Days One";font-size:30px;margin-top:8px}
.estcards .card.sel{border-color:var(--red);box-shadow:0 0 0 1px var(--red) inset}
.estcards .card.sel .v{color:var(--red)}
.tipwrap{display:flex;gap:30px;align-items:center;flex-wrap:wrap}
.dona{width:180px;height:180px;border-radius:50%;flex:none;position:relative;
  -webkit-mask:radial-gradient(circle 54px at 50% 50%,transparent 98%,#000 100%);
          mask:radial-gradient(circle 54px at 50% 50%,transparent 98%,#000 100%)}
.donac{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.donac b{font-family:"Days One";font-size:26px;line-height:1}
.donac span{font-family:"IBM Plex Mono";font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut2);margin-top:2px}
.tiplist{flex:1;min-width:280px}
.tiprow{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.tiprow:last-child{border-bottom:0}
.tippct{font-family:"Days One";font-size:18px;color:var(--ink);width:58px;text-align:right}
.tipdot{width:10px;height:10px;border-radius:3px;flex:none}
.tipcant{font-family:"Days One";font-size:17px;min-width:34px}
.tipnom{flex:1;min-width:0}
.tipmonto{font-family:"IBM Plex Mono";font-size:13.5px;color:var(--mut);white-space:nowrap}
.barras{display:flex;align-items:flex-end;gap:10px;padding:20px 4px 0;min-height:210px}
.barcol{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px}
.barval{font-family:"IBM Plex Mono";font-size:11px;color:var(--mut);white-space:nowrap}
.bar{width:100%;max-width:56px;background:var(--red);border-radius:4px 4px 0 0;min-height:2px}
.barmes{font-family:"IBM Plex Mono";font-size:11px;letter-spacing:.06em;color:var(--mut2)}

/* ============================================================
   ESTADISTICAS DE PRODUCCION - grafico por dia clickeable (filtro)
   ============================================================ */
/* cada columna es un boton de filtro por dia */
.prodbarcol{border-radius:6px;padding:4px 2px 2px;transition:background .12s}
.prodbarcol:hover{background:var(--surf)}
.prodbarcol:hover .bar{filter:brightness(.92)}
/* dia seleccionado: columna resaltada y etiqueta marcada */
.prodbarcol.on{background:var(--surf2)}
.prodbarcol.on .barval{color:var(--ink);font-weight:600}
.prodbarcol.on .barmes{color:var(--ink);font-weight:600}
/* tarjeta total cuando hay un dia filtrado */
.card.destacada.prodfiltrado{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink) inset}

/* MES COMPLETO: todas las columnas del mes, finas y juntas, alineadas al inicio
   para que se vea la secuencia del mes (1..fin) y donde estamos parados. */
.barras.barras-mes{gap:3px;justify-content:flex-start;overflow-x:auto;padding-bottom:6px}
.barras.barras-mes .prodbarcol{flex:1 1 0;min-width:16px;max-width:38px;padding:4px 1px 2px}
.barras.barras-mes .bar{max-width:26px;border-radius:3px 3px 0 0}
.barras.barras-mes .barval{font-size:10px}
.barras.barras-mes .barmes{font-size:9.5px}
/* dias sin produccion: barra base tenue y numeros/etiqueta atenuados, sin hover */
.prodbarcol.prodvacio{cursor:default}
.prodbarcol.prodvacio:hover{background:transparent}
.prodbarcol.prodvacio:hover .bar{filter:none}
.prodbarcol.prodvacio .barmes{color:var(--mut2)}

/* ============================================================
   ESTADISTICAS DE COMPRAS
   ============================================================ */
.provlist{display:flex;flex-direction:column;gap:16px}
.provrow{min-width:0}
.provtop{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:6px}
.provnom{font-weight:600;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.provmonto{font-family:"IBM Plex Mono";font-size:14px;color:var(--ink);white-space:nowrap;flex:none}
.provpct{color:var(--mut2);font-size:12.5px}
.provbarbg{background:var(--surf2);border-radius:999px;height:10px;overflow:hidden}
.provbar{height:100%;border-radius:999px;min-width:2px}
.provsub{font-family:"IBM Plex Mono";font-size:11px;color:var(--mut2);margin-top:4px}

@media(max-width:820px){
  .grid2{grid-template-columns:1fr}
  table{font-size:13px}th,td{padding:9px 10px}
  .search,.filtro{max-width:none}
  .oplist .opnum{width:48px}.oplist .opfecha{width:auto}.oplist .optot{width:auto}
  .oplist.stagrup td.stcant,.oplist.stagrup td.stvend{width:auto}
  .oplist.stagrup.stserlist td.stserie,.oplist.stagrup.stserlist td.stubi{width:auto}
  .oplist.prlist td.prpre{width:auto}
  .oplist.pllist td.pledit,.oplist.pllist td.plnum,.oplist.pllist td.plsug{width:auto}
  .plwrap{max-height:calc(100vh - 180px)}
  .fbwrap{max-height:calc(100vh - 160px)}
  .pltop{flex-direction:column}
  .plctrl{gap:14px}
  .plseldia{max-width:none}
  .plhead-der{flex-direction:row;width:100%}
  .plres{width:auto;flex:1;min-height:70px}
  .plpdfbtn{width:auto;flex:1}
  .opv-titulo{font-size:20px}
  .opv-negras{flex-direction:column}.opv-total{width:100%;justify-content:flex-start}
  .opv-negras .sp{display:none}
  .op-add{grid-template-columns:1fr}
  .ocdet td.ocd-pu,.ocdet td.ocd-sub,.ocdet td.ocd-nser{width:auto}
  .stocktop{grid-template-columns:1fr}
  .stockcards{grid-template-columns:repeat(3,1fr)}
  .stiposcuerpo{grid-template-columns:1fr}
  .tipwrap{gap:18px}.dona{width:140px;height:140px}
  .barras{gap:5px}.barval{font-size:9px}
  .barras.barras-mes{gap:2px}
  .barras.barras-mes .prodbarcol{min-width:12px}
  .subt,.opv-item .subver{min-width:0}
  .pcard-g2,.pcard-g3{grid-template-columns:1fr}
  .pcard-claim{font-size:9px}
  .pcard-brand{font-size:24px}
}