@font-face{font-family:"Lexend Deca";src:url(fonts/LexendDeca.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Open Sans";src:url(fonts/OpenSans.woff2) format("woff2");font-weight:300 800;font-display:swap}
:root{
  --bg:#F4F6FA;--card:#FFFFFF;--line:#E3E7EE;--line-2:#CBD3DF;
  --ink:#17202E;--ink-2:#4E586A;--muted:#8590A3;
  --brand:#1C61E7;--brand-2:#164EB6;--brand-ink:#123E97;--brand-soft:#E8EFFD;--brand-tint:#F3F6FD;--brand-line:#C9D9F9;
  --ok:#178A4C;--ok-soft:#E7F5EC;--warn:#D98A0B;--warn-soft:#FFF4E0;--bad:#D3322B;--bad-soft:#FDECEB;
  --edit:#FFF9E3;--edit-line:#E0B400;--edit-ink:#6B4F00;
  --r:12px;--r2:8px;--sh:0 1px 2px rgba(20,30,50,.05);--sh2:0 6px 18px rgba(20,30,50,.08);
  --tap:44px;--tap-sm:36px;--t:.18s;--ease:cubic-bezier(.22,1,.36,1);
  --font-t:"Lexend Deca","Segoe UI",system-ui,sans-serif;--font:"Open Sans","Segoe UI",system-ui,sans-serif;
  --mono:ui-monospace,Consolas,"SF Mono",Menlo,monospace;
}
[hidden]{display:none!important}
*{box-sizing:border-box}
html{height:100%}
body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font:14px/1.5 var(--font);-webkit-font-smoothing:antialiased;display:flex;flex-direction:column}
h1,h2,h3,h4,.t{font-family:var(--font-t);font-weight:600;letter-spacing:-.01em;margin:0}
h2{font-size:20px} h3{font-size:16px} h4{font-size:13.5px}
.num,.cant,.k,.v{font-variant-numeric:tabular-nums}
a{color:var(--brand)}
button{font:inherit;color:inherit;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}
svg.i{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}
svg.i.sm{width:14px;height:14px} svg.i.lg{width:20px;height:20px}
b,strong{font-weight:600}
.muted{color:var(--muted)} .ink2{color:var(--ink-2)} .small{font-size:12.5px} .tiny{font-size:11.5px}
.lbl{font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.07em;white-space:nowrap}
.sp{flex:1}

/* ---------- barra de progreso ---------- */
#prog{position:fixed;top:0;left:0;height:3px;width:100%;background:var(--brand);transform:scaleX(0);transform-origin:0 50%;opacity:0;z-index:100;transition:transform .6s var(--ease),opacity .25s var(--ease);pointer-events:none}
#prog.on{opacity:1;transform:scaleX(.72)} #prog.done{transform:scaleX(1);opacity:0}

/* ---------- cabecera ---------- */
/* Barra de herramientas: marca · control segmentado centrado de verdad (1fr auto 1fr) · dos acciones. Debajo, la fila de contexto:
   la fecha del jueves como título y un solo indicador del estado de los datos que se despliega en línea. */
.top{position:sticky;top:0;z-index:30;background:var(--card);border-bottom:1px solid var(--line)}
.tb{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;height:60px;padding:0 24px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
/* el logo real de Mebac (v15.3, dueño): el PNG de la web, transparente, 500×105; 26 px de alto en la barra, 22 en el celular */
.brand .logo-mebac{display:block;height:26px;width:auto;max-width:100%;flex:0 0 auto;transform:translateY(-1px)}
.brand b{font:700 15px var(--font-t);letter-spacing:-.01em;color:var(--ink)} .brand span{font-size:13px;line-height:16px;color:var(--muted);padding-left:10px;border-left:1px solid var(--line-2)}
.seg{display:flex;padding:3px;background:var(--bg);border-radius:10px}
.seg button{position:relative;border:0;background:transparent;height:34px;padding:0 18px;border-radius:8px;font:600 13.5px var(--font-t);color:var(--ink-2);display:flex;align-items:center;gap:7px;transition:background var(--t) var(--ease),color var(--t) var(--ease),box-shadow var(--t) var(--ease)}
.seg button+button::before{content:"";position:absolute;left:-1px;top:9px;bottom:9px;width:1px;background:var(--line-2);transition:opacity var(--t) var(--ease)}
.seg button:hover{color:var(--ink)}
.seg button.on{background:var(--card);color:var(--ink);box-shadow:0 1px 2px rgba(20,30,50,.10),0 0 0 1px rgba(20,30,50,.04)}
.seg button.on::before,.seg button.on+button::before{opacity:0}
.seg .n{font:600 11px/18px var(--font-t);background:var(--brand);color:#fff;border-radius:9px;padding:0 6px;min-width:18px;text-align:center} .seg .n.zero{display:none}
.acciones{display:flex;gap:8px;align-items:center;justify-self:end}
.acciones .btn{min-height:40px;padding:0 16px}
.ctx{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 24px;height:46px;border-top:1px solid var(--line)}
.ctx .titulo{display:flex;align-items:baseline;gap:12px;min-width:0}
.ctx .titulo b{font:700 16px var(--font-t);letter-spacing:-.01em;white-space:nowrap;color:var(--ink)} .ctx .titulo span{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.estado{border:0;background:transparent;display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 6px 0 10px;border-radius:8px;font:500 13px var(--font);color:var(--ink-2);white-space:nowrap;transition:background var(--t) var(--ease)}
.estado:hover{background:var(--brand-tint);color:var(--ink)}
.estado .dot,.ctx-det .dot{width:8px;height:8px;border-radius:50%;background:var(--line-2);flex:none}
.estado .dot.ok,.ctx-det .dot.ok{background:var(--ok)} .estado .dot.warn,.ctx-det .dot.warn{background:var(--warn)} .estado .dot.bad,.ctx-det .dot.bad{background:var(--bad)}
.estado .i{color:var(--muted);transition:transform var(--t) var(--ease)} .estado[aria-expanded="true"] .i{transform:rotate(90deg)}
.ctx-det{display:flex;gap:8px 24px;flex-wrap:wrap;padding:9px 24px 11px;border-top:1px solid var(--line);background:var(--bg);font-size:12.5px;color:var(--ink-2)}
.ctx-det[hidden]{display:none}
.ctx-det .it{display:inline-flex;align-items:center;gap:7px} .ctx-det .it b{font-weight:600;color:var(--ink)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-2);background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:1px 9px;line-height:18px;white-space:nowrap}
.chip .dot{width:7px;height:7px;border-radius:50%;background:var(--line-2);flex:none}
.chip.ok .dot{background:var(--ok)} .chip.warn .dot{background:var(--warn)} .chip.bad .dot{background:var(--bad)}
.chip.brand{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand-ink)}
.chip.edit{background:var(--edit);border-color:var(--edit-line);color:var(--edit-ink)}
@media (max-width:1100px){.tb{grid-template-columns:1fr auto;height:auto;padding:10px 20px;row-gap:8px} .seg{grid-column:1 / -1;justify-self:center} .brand span{display:none} .ctx{padding:0 20px}}
@media (max-width:640px){.brand .logo-mebac{height:22px}}

/* ---------- botones e inputs ---------- */
.btn{min-height:var(--tap-sm);border:1px solid var(--line-2);background:var(--card);padding:0 14px;border-radius:var(--r2);font:600 13.5px var(--font-t);display:inline-flex;gap:7px;align-items:center;color:var(--ink);white-space:nowrap;transition:background var(--t) var(--ease),border-color var(--t) var(--ease),color var(--t) var(--ease)}
.btn:hover{background:var(--brand-tint);border-color:var(--brand-line)}
.btn.primary{background:var(--brand);color:#fff;border-color:var(--brand);min-height:var(--tap);padding:0 18px} .btn.primary:hover{background:var(--brand-2);border-color:var(--brand-2)}
.btn.soft{background:var(--brand-soft);color:var(--brand-ink);border-color:var(--brand-line)} .btn.soft:hover{background:var(--brand-line)}
.btn.ghost{border-color:transparent;color:var(--ink-2)} .btn.ghost:hover{background:var(--brand-tint);color:var(--brand-ink)}
.btn.sm{min-height:30px;padding:0 10px;font-size:12.5px}
.btn.on{background:var(--brand);color:#fff;border-color:var(--brand)}
.btn:disabled{opacity:.5;cursor:default}
.btn .badge{background:rgba(255,255,255,.28);border-radius:10px;padding:0 7px;font-size:12px;min-width:20px;text-align:center}
.fld{display:flex;align-items:center;gap:7px;background:var(--card);border:1px solid var(--line-2);border-radius:var(--r2);padding:0 10px;min-height:var(--tap-sm);transition:border-color var(--t) var(--ease)}
.fld:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.fld svg{color:var(--muted)} .fld input,.fld select{border:0;background:transparent;outline:none;min-height:34px;width:100%;min-width:0}
.fld input[type=number]{width:64px;text-align:right;font-family:var(--font-t);font-weight:600}
.fld label{font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.07em;white-space:nowrap}
.fld .suf{color:var(--muted);font-size:12px}
.seg{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:var(--r2);padding:2px}
.seg button{border:0;background:transparent;min-height:30px;padding:0 10px;border-radius:6px;font:600 12.5px var(--font-t);color:var(--muted);display:inline-flex;gap:5px;align-items:center;transition:background var(--t) var(--ease),color var(--t) var(--ease)}
.seg button.on{background:var(--card);color:var(--brand-ink);box-shadow:var(--sh)}
.toggle{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;color:var(--ink-2)}
.toggle input{position:absolute;opacity:0;width:0;height:0}
.toggle .sw{width:34px;height:20px;border-radius:999px;background:var(--line-2);position:relative;transition:background var(--t) var(--ease);flex:none}
.toggle .sw::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:var(--sh);transition:transform var(--t) var(--ease)}
.toggle input:checked+.sw{background:var(--brand)} .toggle input:checked+.sw::after{transform:translateX(14px)}
.toggle input:focus-visible+.sw{outline:2px solid var(--brand);outline-offset:2px}
textarea.ta{width:100%;border:1px solid var(--line-2);border-radius:var(--r2);padding:8px 10px;min-height:56px;resize:vertical;background:var(--card)}
textarea.ta:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}

/* ---------- layout ---------- */
.main{flex:1;padding:0 24px 64px}
.feed{max-width:1180px;margin:0 auto}
.barra{display:flex;align-items:center;gap:10px;padding:14px 0 12px;flex-wrap:wrap;position:sticky;top:var(--top-h,92px);background:var(--bg);z-index:20}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh)}
.aviso{display:flex;gap:10px;align-items:flex-start;padding:10px 14px;border:1px solid var(--line);background:var(--card);border-radius:var(--r2);margin:10px 0;color:var(--ink-2)}
.aviso svg{color:var(--brand);margin-top:2px} .aviso.warn svg{color:var(--warn)} .aviso.bad svg{color:var(--bad)}
.aviso .btn{margin-left:auto}
.toast{position:fixed;right:20px;bottom:20px;background:var(--ink);color:#fff;padding:10px 14px;border-radius:10px;box-shadow:var(--sh2);display:flex;gap:9px;align-items:center;z-index:50;font-size:13px;max-width:420px}
.toast svg{color:#8FD3A9} .toast.malo{background:var(--bad)} .toast.malo svg{color:#fff}
.vacio{padding:36px 20px;text-align:center;color:var(--muted)} .vacio b{display:block;font:600 15px var(--font-t);color:var(--ink-2);margin-bottom:4px}
.img{width:var(--px,40px);height:var(--px,40px);border-radius:8px;background:var(--bg);border:1px solid var(--line);display:grid;place-items:center;color:var(--line-2);flex:none;overflow:hidden;contain:strict}
.img img{width:100%;height:100%;object-fit:contain;display:block}
.chips-fila{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}

/* ---------- selector de rama ---------- */
.rama{position:relative}
.rama > .btn{max-width:420px;overflow:hidden;text-overflow:ellipsis;justify-content:flex-start}
.rama > .btn .crumb{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rama .pop{position:absolute;top:calc(100% + 6px);left:0;width:min(560px,92vw);max-height:70vh;overflow:auto;background:var(--card);border:1px solid var(--line-2);border-radius:var(--r);box-shadow:var(--sh2);z-index:40;padding:10px}
.rama .pop .fld{margin-bottom:8px}
.arbol{list-style:none;margin:0;padding:0}
.arbol li{margin:0} .arbol .nodo{display:flex;align-items:center;gap:6px;min-height:34px;padding:0 8px;border-radius:6px;cursor:pointer;border:0;background:transparent;width:100%;text-align:left}
.arbol .nodo:hover{background:var(--brand-tint)} .arbol .nodo.on{background:var(--brand-soft);color:var(--brand-ink);font-weight:600}
.arbol .nodo .k{margin-left:auto;font-size:11.5px;color:var(--muted)}
.arbol .nodo .tw{width:16px;height:16px;color:var(--muted);transition:transform var(--t) var(--ease)} .arbol li.open > .nodo .tw{transform:rotate(90deg)}
.arbol ul{list-style:none;margin:0;padding-left:18px} .arbol li:not(.open) > ul{display:none}
.arbol .n1 > .nodo{font-family:var(--font-t);font-weight:500}

/* ---------- resumen ---------- */
.resumen{display:flex;gap:18px;align-items:center;padding:12px 18px;margin-top:2px;flex-wrap:wrap}
.resumen .dato b{font:600 18px var(--font-t)} .resumen .dato span{color:var(--muted);font-size:12.5px;margin-left:5px}
.resumen .sep{width:1px;height:26px;background:var(--line)}

/* ---------- transferencias ---------- */
.transf{margin-top:18px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
.col{min-width:0} .tarj{min-width:0}
@media (max-width:980px){.transf{grid-template-columns:1fr}}
.col > .cab{display:flex;align-items:baseline;gap:10px;padding:0 4px 10px}
.col > .cab h2{font-size:18px} .col > .cab .cnt{color:var(--muted);font-size:12.5px} .col > .cab .dir{margin-left:auto;color:var(--muted);font-size:12.5px}
.tarj{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:16px 18px 12px;margin-bottom:12px;display:grid;gap:12px;content-visibility:auto;contain-intrinsic-size:auto 320px;transition:background var(--t) var(--ease),border-color var(--t) var(--ease)}
.tarj.edit{background:var(--edit);border-color:var(--edit-line)}
.tarj .cab{display:flex;gap:14px;align-items:flex-start}
.nombre{min-width:0} .nombre b{display:block;font:600 15px/1.25 var(--font-t)}
.nombre .sub{display:flex;gap:8px;align-items:center;font-size:12px;color:var(--muted);margin-top:2px;flex-wrap:wrap}
.nombre .sub .sku{font-family:var(--mono);font-size:11px;color:var(--ink-2)}
.tarj .cant{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex:none}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line-2);border-radius:10px;background:var(--card);overflow:hidden}
.stepper button{border:0;background:transparent;width:40px;min-height:var(--tap);color:var(--ink-2);display:grid;place-items:center;transition:background var(--t) var(--ease)}
.stepper button:hover{background:var(--brand-tint);color:var(--brand-ink)}
.stepper input{border:0;width:72px;text-align:center;font:700 26px var(--font-t);min-height:var(--tap);background:transparent;outline:none;-moz-appearance:textfield;color:var(--ink)}
.stepper input::-webkit-inner-spin-button{-webkit-appearance:none}
.tarj .cant .u{font-size:12.5px;color:var(--ink-2)} .tarj .cant .u b{font-family:var(--font-t)}
.tabla{display:grid;grid-template-columns:56px 1fr 1.2fr .9fr 1.3fr;gap:5px 12px;align-items:center;font-size:13px;padding:8px 10px;background:var(--brand-tint);border-radius:var(--r2)}
.tabla .r{display:contents}
.tabla .r.h span{font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;padding-bottom:2px}
.tabla .s{font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.tabla .v{font-family:var(--font-t);font-weight:600;display:flex;align-items:center;gap:6px;white-space:nowrap} .tabla .v small{font-weight:400;color:var(--muted);font-family:var(--font)}
.sem{width:8px;height:8px;border-radius:50%;background:var(--line-2);flex:none;display:inline-block}
.sem.ok{background:var(--ok)} .sem.warn{background:var(--warn)} .sem.bad{background:var(--bad)}
.why .h{font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.07em;margin-bottom:6px}
.wl{display:grid;grid-template-columns:28px 76px 1fr;gap:10px;align-items:start;font-size:13px;padding:4px 0;color:var(--ink-2);max-width:72ch}
.wl .ic{width:28px;height:28px;border-radius:50%;background:var(--brand-soft);color:var(--brand-ink);display:grid;place-items:center;flex:none}
.wl .lb{font:600 12px var(--font-t);color:var(--ink);padding-top:5px} .wl .tx{padding-top:4px} .wl b{color:var(--ink)}
.tarj.edit .wl .ic{background:rgba(224,180,0,.18)} .wl.vos .ic{color:var(--edit-ink)} .wl.vos .lb{color:var(--edit-ink)}
.pie-tarj{display:flex;gap:8px;align-items:center;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:8px;font-size:12.5px;color:var(--ink-2)}
.tarj.edit .pie-tarj{border-color:rgba(224,180,0,.35)} .corr b{color:var(--edit-ink)}
.porque .lb{font:600 12.5px var(--font-t);color:var(--edit-ink);display:block;margin-bottom:4px}
.grupo-tabla{border:1px solid var(--line);border-radius:var(--r2);overflow:hidden;font-size:12.5px}
.grupo-tabla .r{display:grid;grid-template-columns:1fr 60px 60px 70px;gap:8px;padding:5px 10px;border-bottom:1px solid var(--line);align-items:center}
.grupo-tabla .r:last-child{border-bottom:0} .grupo-tabla .r.h{background:var(--bg);font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.grupo-tabla .r .v{text-align:right;font-family:var(--font-t);font-weight:600} .grupo-tabla .r.viaja{background:var(--brand-tint)}
.sinmov{margin-top:14px;padding:12px 16px} .sinmov h4{margin-bottom:6px}
.fila-sm{display:flex;gap:10px;align-items:center;min-height:32px;font-size:13px}

/* ---------- panel de productos ---------- */
.disc{margin-top:18px}
.cab-panel{display:flex;align-items:baseline;gap:10px;padding:12px 16px} .cab-panel .cnt{color:var(--muted);font-size:12.5px}
.filtros{display:flex;gap:8px;align-items:center;padding:10px 16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);flex-wrap:wrap;background:var(--brand-tint)}
.filtros .fld{min-height:32px} .filtros .fld input{min-height:30px}
.lista{list-style:none;margin:0;padding:0}
.fila{display:grid;grid-template-columns:44px minmax(220px,1.6fr) minmax(150px,1fr) minmax(120px,.8fr) minmax(170px,1fr) minmax(120px,.8fr);gap:12px;align-items:center;padding:8px 16px;border-bottom:1px solid var(--line);min-height:56px;content-visibility:auto;contain-intrinsic-size:auto 57px}
.fila:last-child{border-bottom:0}
.fila.cab{background:var(--card);position:sticky;top:0;font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.07em;min-height:32px;padding:6px 16px;content-visibility:visible}
.fila:not(.cab){cursor:pointer} .fila:not(.cab):hover{background:var(--brand-tint)} .fila.abierta{background:var(--brand-tint)}
.fila .nombre b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .fila .nombre .sub{white-space:nowrap;overflow:hidden;flex-wrap:nowrap}
.fila .nombre .sub > span{min-width:0;overflow:hidden;text-overflow:ellipsis} .fila .nombre .sub .sku{flex:none}
.fila .nombre .sub .chip{flex:0 1 auto} .fila .nombre .sub .chip .tx{min-width:0;overflow:hidden;text-overflow:ellipsis}
.dos{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;font-size:12.5px;align-items:baseline}
.dos .s{color:var(--muted);font:700 10.5px var(--font-t);text-transform:uppercase;letter-spacing:.06em}
.dos .v{font-family:var(--font-t);font-weight:600} .dos .v small{font-weight:400;color:var(--muted);font-family:var(--font);margin-left:4px}
.cob{display:flex;align-items:center;gap:6px;font-family:var(--font-t);font-weight:600}
.dec{display:inline-flex;align-items:center;gap:4px;font:500 13px var(--font-t);color:var(--brand-ink);background:var(--brand-soft);border-radius:999px;padding:3px 10px;white-space:nowrap}
.dec b{font-weight:700} .dec.no{background:transparent;color:var(--muted)} .dec.edit{background:var(--edit);color:var(--edit-ink)}
.detalle{grid-column:1 / -1;padding:6px 0 10px 56px;cursor:default}
.mas{display:flex;justify-content:center;padding:12px}

/* ---------- Trello ---------- */
.trello{margin-top:22px;padding:16px 18px}
.trello .cab{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.trello pre{margin:0;font:13px/1.5 var(--mono);white-space:pre-wrap;background:var(--bg);border:1px solid var(--line);border-radius:var(--r2);padding:12px 14px;max-height:420px;overflow:auto;color:var(--ink-2)}
.pie{display:flex;gap:14px;align-items:center;color:var(--muted);font-size:11.5px;padding:14px 4px}

/* ---------- vistas secundarias ---------- */
.pagina{max-width:920px;margin:18px auto 0}
.pagina h2{margin-bottom:4px} .pagina .lead{color:var(--ink-2);margin:0 0 14px;max-width:72ch}
.nov{display:grid;grid-template-columns:72px 1fr auto;gap:14px;padding:14px 16px;border-bottom:1px solid var(--line);align-items:start}
.nov:last-child{border-bottom:0} .nov.decidida{opacity:.7}
.nov .acc{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:360px}
.nov .asig{margin-top:8px;display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap}
.sugs{list-style:none;margin:6px 0 0;padding:0;border:1px solid var(--line-2);border-radius:var(--r2);background:var(--card);max-height:240px;overflow:auto;box-shadow:var(--sh2)}
.sugs li button{border:0;background:transparent;width:100%;text-align:left;padding:7px 10px;display:flex;gap:8px;align-items:center;min-height:34px}
.sugs li button:hover{background:var(--brand-tint)} .sugs li button .sku{font-family:var(--mono);font-size:11px;color:var(--muted)}
.grp{padding:14px 16px;border-bottom:1px solid var(--line);content-visibility:auto;contain-intrinsic-size:auto 140px} .grp:last-child{border-bottom:0}
.grp .cab{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.grp .cab h4{font-size:14.5px;font-weight:600} .grp .cab input{font:600 14.5px var(--font-t);border:1px solid var(--brand);border-radius:6px;padding:4px 8px;min-width:320px}
.grp .miembros{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:6px 14px}
.grp .miembros li{display:flex;gap:8px;align-items:center;font-size:12.8px;min-height:30px}
.grp .miembros .sku{font-family:var(--mono);font-size:11px;color:var(--muted)} .grp .miembros .st{margin-left:auto;font-family:var(--font-t);font-weight:600;color:var(--ink-2);white-space:nowrap}
.grp .miembros .x{border:0;background:transparent;color:var(--muted);width:28px;height:28px;border-radius:6px;display:grid;place-items:center} .grp .miembros .x:hover{background:var(--bad-soft);color:var(--bad)}
.form{display:grid;gap:12px;max-width:560px}
.form .row{display:grid;grid-template-columns:180px 1fr;gap:12px;align-items:center}
.form .row .help{grid-column:2;color:var(--muted);font-size:12px;margin-top:-6px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;font-size:13px} .kv dt{color:var(--muted)} .kv dd{margin:0;font-family:var(--mono);font-size:12px;word-break:break-all}
@media (max-width:760px){.fila{grid-template-columns:44px 1fr;gap:6px 12px} .fila.cab{display:none} .top{gap:10px} .tabla{grid-template-columns:48px 1fr 1fr .8fr 1fr;font-size:12px}}

/* ---------- pestaña Stock (qué comprar) ---------- */
.fila-stock{display:grid;grid-template-columns:44px minmax(220px,1.6fr) minmax(210px,1.1fr) minmax(110px,.7fr) minmax(220px,1.2fr);gap:12px;align-items:center;padding:8px 16px;border-bottom:1px solid var(--line);min-height:56px;content-visibility:auto;contain-intrinsic-size:auto 57px}
.fila-stock:last-child{border-bottom:0}
.fila-stock.cab{background:var(--card);position:sticky;top:0;font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.07em;min-height:32px;padding:6px 16px;content-visibility:visible}
.fila-stock:not(.cab){cursor:pointer} .fila-stock:not(.cab):hover{background:var(--brand-tint)} .fila-stock.abierta{background:var(--brand-tint)}
.fila-stock .nombre b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .fila-stock .nombre .sub{white-space:nowrap;overflow:hidden;flex-wrap:nowrap}
.fila-stock .nombre .sub > span{min-width:0;overflow:hidden;text-overflow:ellipsis} .fila-stock .nombre .sub .sku{flex:none}
.fila-stock .nombre .sub .chip{flex:0 1 auto} .fila-stock .nombre .sub .chip .tx{min-width:0;overflow:hidden;text-overflow:ellipsis}
.chip.bad{color:var(--bad);border-color:rgba(211,50,43,.35);flex:none} .chip.bad .dot{background:var(--bad)}
.tres{display:grid;grid-template-columns:auto auto 1fr;gap:2px 8px;font-size:12.5px;align-items:baseline} .tres .r{display:contents}
.tres .s{color:var(--muted);font:700 10.5px var(--font-t);text-transform:uppercase;letter-spacing:.06em}
.tres .v{font-family:var(--font-t);font-weight:600;white-space:nowrap} .tres .v small{font-weight:400;color:var(--muted);font-family:var(--font);margin-left:4px}
.tres .cob{font-size:12.5px;white-space:nowrap}
.ver{display:flex;flex-direction:column;gap:3px;align-items:flex-start;min-width:0} .ver .sub-dec{color:var(--muted);font-size:12px;line-height:1.3}
.fila-stock .detalle{grid-column:1 / -1;padding:4px 0 8px 56px;cursor:default}
.filtros .seg .k{font:600 11px/16px var(--font-t);background:var(--brand-soft);color:var(--brand-ink);border-radius:8px;padding:0 6px;margin-left:2px}
@media (max-width:760px){.fila-stock{grid-template-columns:44px 1fr;gap:6px 12px} .fila-stock.cab{display:none}}

/* ---------- Grupos: acordeón por planilla y código general ---------- */
.gpl{margin-bottom:10px;overflow:hidden}
.gpl-cab{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;text-align:left;padding:12px 16px;min-height:var(--tap);font:600 14.5px var(--font-t);color:var(--ink)}
.gpl-cab:hover{background:var(--brand-tint)} .gpl-cab .tw{color:var(--muted);transition:transform var(--t) var(--ease)} .gpl.open>.gpl-cab .tw{transform:rotate(90deg)}
.gpl-cab .muted{font:400 13px var(--font)} .gpl-cab .k{margin-left:auto;font:600 12px var(--font-t);color:var(--brand-ink);background:var(--brand-soft);border-radius:999px;padding:2px 10px}
.gpl-cuerpo{border-top:1px solid var(--line)} .gpl:not(.open)>.gpl-cuerpo{display:none}
.grp .cod{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px;padding:6px 10px;background:var(--brand-tint);border-radius:var(--r2);font-size:13px}
.grp .cod b{font:700 14px var(--font-t);color:var(--brand-ink);letter-spacing:.02em} .grp .cod .cod-inp{font:600 14px var(--font-t);border:1px solid var(--brand);border-radius:6px;padding:4px 8px;min-width:220px}

/* ---------- Estadísticas ---------- */
.est-graf{padding:14px 18px 10px;margin-top:14px;position:relative}
/* Estadísticas: "Ver en grande" (2026-09-09): la tarjeta del gráfico a pantalla completa, Esc o el botón vuelven */
#v-estadisticas.est-grande:not([hidden]) .est-graf{position:fixed;inset:0;z-index:60;margin:0;border-radius:0;overflow:auto;padding:16px 24px 12px;background:var(--card);box-shadow:none}
#v-estadisticas.est-grande:not([hidden]) .est-graf .cab h3{font-size:18px}
@media (max-width:640px){#v-estadisticas.est-grande:not([hidden]) .est-graf{padding:12px 12px 8px}}
.est-graf .cab{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.leyenda{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--ink-2);margin-left:auto}
.leyenda span{display:inline-flex;align-items:center;gap:6px}
.leyenda .sw{display:inline-block;width:18px;height:2px;background:var(--ink-2);border-radius:1px} .leyenda .sw.crudo{height:0;border-top:1px dashed var(--muted);background:none}
.leyenda .sw.temp{height:10px;width:16px;background:var(--brand-soft);border-radius:2px}
.leyenda .pt{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--warn)} .leyenda .pt.semana{background:var(--bad)} .leyenda .pt.cliente_recurrente{background:#fff;border:1.5px solid var(--warn)}
.grafico{width:100%;height:auto;display:block;font-family:var(--font)} .grafico:focus-visible{outline:2px solid var(--brand);outline-offset:4px;border-radius:8px}
.grafico .temp{fill:var(--brand-tint)} .grafico .temp.clases{fill:var(--brand-soft)}
.grafico .temp-lbl{font:600 10.5px var(--font-t);fill:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.grafico .grid{stroke:var(--line)} .grafico .grid.v{stroke:var(--line);stroke-dasharray:2 4} .grafico .eje{stroke:var(--line-2)}
.grafico .eje-txt{font-size:11px;fill:var(--muted)}
.grafico .linea{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round} .grafico .linea.salta{stroke:var(--brand)} .grafico .linea.jujuy{stroke:var(--ink-2)}
.grafico .linea.crudo{stroke-width:1;stroke-dasharray:3 3;opacity:.55}
.grafico .pt.salta{fill:var(--brand)} .grafico .pt.jujuy{fill:var(--ink-2)}
.grafico .stem{stroke:var(--warn);stroke-width:1;stroke-dasharray:2 2;opacity:.8}
.grafico .out{stroke:#fff;stroke-width:1.5} .grafico .out.semana{fill:var(--bad)} .grafico .out.linea{fill:var(--warn)} .grafico .out.cliente_recurrente{fill:#fff;stroke:var(--warn);stroke-width:1.5}
.grafico .cursor{stroke:var(--ink-2);stroke-dasharray:2 3} .grafico .foco{stroke:#fff;stroke-width:2} .grafico .foco.salta{fill:var(--brand)} .grafico .foco.jujuy{fill:var(--ink-2)}
.est-graf .tt{position:absolute;background:var(--ink);color:#fff;border-radius:8px;padding:8px 10px;font-size:12px;box-shadow:var(--sh2);max-width:320px;pointer-events:none;z-index:5;line-height:1.5}
.est-graf .tt .tt-h{font:600 12px var(--font-t);margin-bottom:2px}
.est-graf .tt .tt-t{border-collapse:collapse;margin-top:4px;font-variant-numeric:tabular-nums} .est-graf .tt .tt-t th{font:600 10px var(--font-t);letter-spacing:.04em;text-transform:uppercase;color:#c9d0dc;text-align:right;padding:0 0 3px 14px}
.est-graf .tt .tt-t td{padding:1px 0 1px 14px;text-align:right;white-space:nowrap} .est-graf .tt .tt-t td:first-child,.est-graf .tt .tt-t th:first-child{text-align:left;padding-left:0}
.est-graf .tt .tt-t.sin-crudo .c-crudo,.est-graf .tt .tt-t.sin-anio .c-anio{display:none} .est-graf .tt .tt-t tr.tot td{border-top:1px solid rgba(255,255,255,.25);padding-top:3px}
.est-graf .tt .up{color:#8ee0a8} .est-graf .tt .dn{color:#f6a6a0} .est-graf .tt .tt-n{margin-top:6px;color:#c9d0dc;max-width:340px;white-space:normal}
#v-estadisticas.est-grande:not([hidden]) .est-graf .tt{font-size:14px;padding:12px 16px;max-width:520px;border-radius:10px;line-height:1.55}
#v-estadisticas.est-grande:not([hidden]) .est-graf .tt .tt-h{font-size:14.5px;margin-bottom:4px} #v-estadisticas.est-grande:not([hidden]) .est-graf .tt .tt-t th{font-size:11px} #v-estadisticas.est-grande:not([hidden]) .est-graf .tt .tt-n{max-width:480px} .est-graf .tt .sw{display:inline-block;width:10px;height:2px;margin-right:6px;vertical-align:middle} .est-graf .tt .muted{color:#c9d0dc}
.est-texto{padding:14px 18px;margin-top:14px}
.barra .fld.buscar .sugs{position:absolute;top:calc(100% + 4px);left:0;min-width:460px;z-index:45;margin:0}
.resumen .dato .t{display:block;max-width:360px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .resumen .dato .img{margin-right:4px}

/* eventos y feriados en el gráfico de Estadísticas */
.grafico .evt{fill:var(--warn-soft)}
.grafico .fer{stroke:var(--ink-2);stroke-width:2;stroke-linecap:round}
.grafico .fer.provincial,.grafico .fer.cierre{stroke:var(--muted);stroke-dasharray:2 2}
.leyenda .sw.evt{height:10px;width:16px;background:var(--warn-soft);border-radius:2px}
.leyenda i.fer{display:inline-block;width:2px;height:11px;background:var(--ink-2);border-radius:1px}

/* ---------- compras: la tarjeta, con el molde de Transferir ---------- */
.compras{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,460px),1fr));gap:14px;margin-top:14px}
.cab-lista{display:flex;align-items:baseline;gap:10px;padding:14px 4px 0}
.cab-lista h3{font-size:18px} .cab-lista .cnt{color:var(--muted);font-size:12.5px}
.tarj.compra{padding:14px 16px 10px;margin:0}
.tarj.compra .cant{align-items:flex-end;text-align:right}
.tarj.compra .cant .n{font:700 26px var(--font-t);color:var(--brand-ink);display:block;line-height:1.05}
.tarj.compra .cant .u{font-size:12.5px;color:var(--ink-2)}
.tarj.compra.hay{border-color:var(--brand-line)}
.frase{font:600 14px var(--font-t);color:var(--ink);background:var(--brand-tint);border-radius:var(--r2);padding:8px 11px}
.frase small{display:block;font:400 12.5px var(--font);color:var(--ink-2);margin-top:2px}
.frase.no{background:var(--bg)} .frase.no small{margin:0}
.tabla.compras{grid-template-columns:56px 1fr 1.3fr 1fr .8fr}
@media (max-width:760px){.compras{grid-template-columns:1fr}.tabla.compras{grid-template-columns:44px 1fr 1fr .8fr .7fr;font-size:12px}}

/* ---------- v12: "Qué transferir" plegable, contador del resumen clicable ---------- */
.transf-gpl{margin-top:18px;margin-bottom:0;overflow:visible}
.transf-gpl>.gpl-cab{border-radius:var(--r);padding:10px 16px;gap:12px}
.transf-gpl>.gpl-cab .muted{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.transf-gpl>.gpl-cuerpo{border-top:0}
.transf-gpl>.gpl-cuerpo>.transf{margin-top:14px}
.resumen .dato.link{background:transparent;border:0;padding:0;cursor:pointer;font:inherit;color:inherit;display:inline-flex;align-items:center;border-radius:6px}
.resumen .dato.link:hover span,.resumen .dato.link:focus-visible span{color:var(--brand-ink);text-decoration:underline}

/* ---------- v13: los filtros de toda la pestaña van arriba; un 0 se muestra; una lista vacía dice por qué ---------- */
.barra .desc{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.seg button:disabled,.seg button:disabled:hover{opacity:.45;cursor:default;color:var(--muted)}
.filtros .seg .k.cero{background:var(--bg);color:var(--muted)}
.filtros > .lbl{margin-left:4px}
.vacio .btn{margin-top:12px}
.fld.buscar{min-width:300px;position:relative}
.arbol .nodo[title]{cursor:pointer}

/* ---------- Estadísticas v13: conclusión de una línea, cuadros por bloque, "Ver en palabras", tarjetas de acción ---------- */
.est-texto{padding:18px 22px}
.est-texto .h{font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.07em}
.est-concl{font:500 14.5px/1.5 var(--font);color:var(--ink);margin:6px 0 0;max-width:72ch}
.est-concl b{font-family:var(--font-t);font-weight:600}
.est-grid{display:grid;grid-template-columns:1fr;gap:0 28px;margin-top:10px}
@media (min-width:980px){.est-grid{grid-template-columns:1fr 1fr} .est-grid .bloque.epoca,.est-grid .bloque.meses,.est-grid .bloque.feriados{grid-column:1 / -1}}
.bloque{border-top:1px solid var(--line);padding:14px 0 12px;min-width:0}
.bloque .bh{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
.bloque .bh .ic{width:28px;height:28px;border-radius:50%;background:var(--brand-soft);color:var(--brand-ink);display:grid;place-items:center;flex:none}
.bloque .bh b{display:block;font:600 13.5px var(--font-t);color:var(--ink);padding-top:2px} .bloque .bh .sub{display:block;font-size:12px;color:var(--muted);max-width:72ch}
.bloque em{font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-style:normal}
.bloque .chips .chip b{font-family:var(--font-t)} .bloque .chips .chip small{color:var(--muted)}
/* Época: cuadro temporada × año, una sub-fila por sucursal */
.cuadro-wrap{overflow-x:auto;max-width:100%}
.cuadro{display:grid;grid-template-columns:minmax(150px,1.2fr) repeat(var(--anios,3),minmax(84px,1fr));gap:4px 8px;align-items:center;min-width:min-content}
.cuadro .cr{display:contents}
.cuadro .ct{display:flex;flex-direction:column;gap:1px;min-height:34px;justify-content:center;padding-right:6px}
.cuadro .ct b{font:600 13px var(--font-t);color:var(--ink)} .cuadro .ct small{font-size:11px;color:var(--muted)}
.cuadro .cr.h .ct,.cuadro .cr.h .cc{font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;text-align:center;min-height:0;padding-bottom:4px;border-bottom:1px solid var(--line)}
.cuadro .cr.h .ct{text-align:left}
.cuadro .cc{text-align:center}
.ep{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 10px;border-radius:999px;border:1px solid var(--line);background:var(--card);font:600 12.5px var(--font-t);color:var(--ink);cursor:pointer;transition:background var(--t) var(--ease),border-color var(--t) var(--ease)}
.ep .dot{width:8px;height:8px;border-radius:50%;background:var(--line-2);flex:none}
.ep.fuerte .dot{background:var(--ok)} .ep.floja .dot{background:var(--warn)}
.ep.sin{color:var(--muted);cursor:default;border-style:dashed} .ep.sin .dot{background:transparent;border:1px dashed var(--line-2)}
button.ep:hover,.ep.on{background:var(--brand-tint);border-color:var(--brand-line)} .ep.on{box-shadow:0 0 0 2px var(--brand-soft)}
.cuadro-det{margin-top:10px;padding:8px 12px;background:var(--brand-tint);border-radius:var(--r2);font-size:13px;color:var(--ink-2);max-width:72ch} .cuadro-det b{color:var(--ink)}
.leyenda-ep{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--ink-2);margin-top:10px}
.leyenda-ep span{display:inline-flex;align-items:center;gap:6px} .leyenda-ep .dot{width:8px;height:8px;border-radius:50%;background:var(--line-2)} .leyenda-ep .dot.fuerte{background:var(--ok)} .leyenda-ep .dot.floja{background:var(--warn)}
/* Meses: doce barritas por sucursal, línea punteada en 1× */
.meses-suc{display:grid;grid-template-columns:64px 1fr;gap:6px 14px;align-items:start;margin-bottom:8px} .meses-suc em{padding-top:22px} .meses-suc p{grid-column:2;margin:0;max-width:72ch}
.mbarras{--uno:.5;position:relative;display:grid;grid-template-columns:repeat(12,1fr);gap:4px;padding-bottom:16px;max-width:520px}
.mbarras::before{content:"";position:absolute;left:0;right:0;bottom:calc(16px + 56px * var(--uno));border-top:1px dashed var(--line-2);pointer-events:none}
.mb{position:relative;height:56px;display:block}
.mb i{position:absolute;left:0;right:0;bottom:0;background:var(--line-2);border-radius:3px 3px 0 0;min-height:2px}
.mb.fuerte i{background:var(--ok)} .mb.flojo i{background:var(--warn)}
.mb small{position:absolute;top:100%;left:0;right:0;text-align:center;font-size:10px;color:var(--muted);line-height:16px}
/* Raras, tendencia, stock y feriados: cifras */
.cifras{display:grid;grid-template-columns:64px repeat(3,auto);gap:4px 16px;align-items:baseline;margin-bottom:10px;font-size:12px;color:var(--muted);justify-content:start}
.cifras span b{display:block;font:600 18px var(--font-t);color:var(--ink);line-height:1.15} .cifras small{grid-column:2 / -1;font-size:12px;color:var(--ink-2)}
.tend-suc{display:grid;grid-template-columns:64px 1fr;gap:4px 14px;align-items:baseline;margin-bottom:10px} .tend-suc p{grid-column:2;margin:0;max-width:72ch}
.tend{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap} .tend > b{font:600 22px var(--font-t);color:var(--ink);line-height:1.1} .tend small{font-size:12px;color:var(--muted)}
.tend .delta{font:600 14px var(--font-t);color:var(--ink-2)} .tend .delta.ok{color:var(--ok)} .tend .delta.bad{color:var(--bad)}
.stk-cels{display:flex;gap:22px;flex-wrap:wrap}
.stk-cel{display:grid;gap:2px;min-width:120px;align-content:start} .stk-cel em{display:block} .stk-cel b{font:600 22px var(--font-t);color:var(--ink);line-height:1.1}
.stk-cel span{font-size:12.5px;color:var(--ink-2);display:inline-flex;align-items:center;gap:6px} .stk-cel small{font-size:12px;color:var(--muted);max-width:52ch}
/* Ver en palabras */
.est-palabras{border-top:1px solid var(--line);margin-top:4px;padding:10px 0 4px}
.est-palabras summary{cursor:pointer;display:inline-flex;align-items:center;gap:8px;font:600 13px var(--font-t);color:var(--brand-ink);list-style:none;min-height:32px;border-radius:6px;padding:0 4px}
.est-palabras summary::-webkit-details-marker{display:none} .est-palabras summary .muted{font:400 12px var(--font)}
.est-palabras summary:hover{background:var(--brand-tint)}
.est-palabras[open] summary{margin-bottom:6px}
/* Qué hacer: tarjetas de acción */
.est-hacer{border-top:1px solid var(--line);margin-top:8px;padding-top:14px}
.acciones-est{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:10px;margin-top:10px}
.accion{background:var(--brand-tint);border-radius:var(--r2);padding:12px 14px;display:grid;gap:6px;align-content:start;min-width:0}
.accion .ah{display:flex;align-items:center;gap:8px} .accion .ah .ic{width:26px;height:26px;border-radius:50%;background:var(--brand-soft);color:var(--brand-ink);display:grid;place-items:center} .accion .ah b{font:600 13px var(--font-t)}
.accion .cifra{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap} .accion .cifra b{font:600 26px var(--font-t);color:var(--brand-ink);line-height:1.05;display:inline-flex;align-items:center} .accion .cifra span{font-size:12.5px;color:var(--ink-2)}
.accion p{margin:0;font-size:12.5px;color:var(--ink-2);line-height:1.45} .accion p b{color:var(--ink)}
.accion .btn{justify-self:start}
.accion.nada{background:var(--bg)} .accion.nada .cifra b{color:var(--ok)}

/* ---------- v15: cómoda. Un solo lugar para los filtros (la barra pegajosa de verdad), oraciones, espinas, tarjetas compactas, "Qué hacer" en la fila ---------- */
#barra,#stk-barra{position:sticky;top:var(--top-h,92px);z-index:20;background:var(--bg)}
#barra>.barra,#stk-barra>.barra{position:static;padding:10px 0 8px}
.filtros.fila2{background:var(--card);border:1px solid var(--line);border-radius:var(--r2);padding:8px 12px;margin:0 0 8px}
.ajustes-linea{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-2);padding:2px 4px 10px;flex-wrap:wrap}
.ajustes-linea .ic{width:24px;height:24px;border-radius:50%;background:var(--brand-soft);color:var(--brand-ink);display:grid;place-items:center;flex:none}
.ajustes-linea .tx{flex:1 1 320px;min-width:0} .ajustes-linea b{font-family:var(--font-t);color:var(--ink);font-weight:600}
.ajustes-ctl{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:10px 12px;margin:-4px 0 12px;background:var(--bg);border:1px dashed var(--line-2);border-radius:var(--r2)}
.ajustes-ctl .desc{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.resumen.frases{display:flex;align-items:flex-start;gap:16px;padding:14px 18px}
.resumen.frases .txt{flex:1;min-width:0} .resumen.frases p{margin:0} .resumen.frases p+p{margin-top:4px}
.resumen.frases .f1{font-size:15px;line-height:1.5;color:var(--ink)} .resumen.frases .f2{font-size:13px;color:var(--ink-2)} .resumen.frases .f3{font-size:12.5px;color:var(--muted)}
.resumen.frases b.num{font:600 16px var(--font-t);color:var(--ink)} .resumen.frases .f2 b.num,.resumen.frases .f3 b.num{font-size:14px}
.resumen.frases .link{background:transparent;border:0;padding:0;font:inherit;color:inherit;cursor:pointer;border-radius:4px;text-decoration:underline;text-decoration-color:var(--brand-line);text-underline-offset:3px;text-align:left}
.resumen.frases .link:hover,.resumen.frases .link:focus-visible{color:var(--brand-ink);text-decoration-color:var(--brand)}
.resumen.frases .link.bad b.num{color:var(--bad)}
.resumen.frases>.btn{flex:none}
/* espinas: la cabecera de cada bloque se pega debajo de la barra y lleva al otro bloque */
.spine-gpl{overflow:visible}
.gpl-cab.spine{position:sticky;top:calc(var(--top-h,92px) + var(--bar-h,0px));z-index:15;display:flex;align-items:center;gap:8px;padding:6px 8px 6px 4px;background:var(--card);flex-wrap:wrap;cursor:default}
.gpl-cab.spine:hover{background:var(--card)}
.transf-gpl>.gpl-cab.spine{border-radius:var(--r);padding:6px 8px 6px 4px;gap:8px} .panel-gpl>.gpl-cab.spine{border-radius:var(--r) var(--r) 0 0}
.gpl.open>.gpl-cab.spine{box-shadow:0 1px 0 var(--line)}
.spine .tit{display:flex;align-items:center;gap:10px;border:0;background:transparent;text-align:left;padding:6px 8px;min-height:var(--tap-sm);font:600 14.5px var(--font-t);color:var(--ink);border-radius:8px;flex:1 1 320px;min-width:0;cursor:pointer}
.spine .tit:hover{background:var(--brand-tint)} .spine .tit .tw{color:var(--muted);transition:transform var(--t) var(--ease);flex:none;width:16px;height:16px} .gpl.open>.gpl-cab.spine .tit .tw{transform:rotate(90deg)}
.spine .tit b{white-space:nowrap}
.spine .tit .frase{font:400 13px var(--font);color:var(--ink-2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spine .tit .k{margin-left:auto;font:600 12px var(--font-t);color:var(--brand-ink);background:var(--brand-soft);border-radius:999px;padding:2px 10px;flex:none}
.spine .tit .cnt{font:400 12.5px var(--font);color:var(--muted);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spine .saltos{display:flex;gap:2px;margin-left:auto;flex:none}
.toggle.sm{font-size:12.5px} .toggle.sm .sw{width:30px;height:18px} .toggle.sm .sw::after{width:14px;height:14px} .toggle.sm input:checked+.sw::after{transform:translateX(12px)}
#transf-gpl,#panel-gpl,#trello{scroll-margin-top:calc(var(--top-h,92px) + var(--bar-h,0px) + 8px)}
.transf-gpl>.gpl-cuerpo>.transf{margin-top:12px}
.fila.cab{top:calc(var(--top-h,92px) + var(--bar-h,0px) + 46px);z-index:5}
/* la tarjeta compacta: el por qué y la tabla del grupo, plegados detrás de "Ver por qué" */
.tarj{contain-intrinsic-size:auto 300px;padding:14px 16px 10px;align-content:start}
.tarj .detalle-tarj{display:none} .tarj.why .detalle-tarj{display:grid;gap:12px}
.pie-tarj [data-why][aria-expanded="true"]{color:var(--brand-ink)}
.tarj.compra .pie-tarj{padding-top:6px}
/* la fila: "Qué hacer" */
.fila{grid-template-columns:44px minmax(190px,1.4fr) minmax(125px,.85fr) minmax(105px,.65fr) minmax(140px,.85fr) minmax(268px,1.3fr)}
.hacer .btn.sm{padding:0 9px}
.hacer{display:flex;flex-direction:column;gap:3px;align-items:flex-start;cursor:default}
.hacer .acc{display:flex;gap:6px;align-items:center;flex-wrap:wrap} .hacer small{font-size:11.5px;color:var(--muted)} .hacer small.edit-ink{color:var(--edit-ink);display:inline-flex;align-items:center;gap:4px}
.hacer .u{font-size:12.5px;color:var(--ink-2)} .hacer .u b{font-family:var(--font-t)}
.hacer.edit .stepper.mini{background:var(--edit);border-color:var(--edit-line)}
.stepper.mini button{width:32px;min-height:var(--tap-sm)} .stepper.mini input{width:48px;font-size:16px;min-height:var(--tap-sm)}
.lnk{border:0;background:transparent;padding:0;color:inherit;text-decoration:underline;text-underline-offset:2px;cursor:pointer;display:inline-flex;align-items:center;gap:3px;font:inherit}
.fila.esq{pointer-events:none;cursor:default} .esq-b{display:inline-block;height:12px;border-radius:6px;background:var(--line);animation:esq 1.2s ease-in-out infinite;width:100%} .esq-b.corta{width:55%} .esq-b.media{width:80%}
@keyframes esq{0%,100%{opacity:.55}50%{opacity:1}} @media (prefers-reduced-motion:reduce){.esq-b{animation:none}}
.seg .k{font:600 11px/16px var(--font-t);background:var(--brand-soft);color:var(--brand-ink);border-radius:8px;padding:0 6px;margin-left:2px} .seg .k.cero{background:var(--bg);color:var(--muted)}
.cab-lista .toggle.sm{margin-left:auto}

/* ---------- responsive (v13): 900 tablet · 640 móvil. Nada se saca: se reordena ---------- */
body{overflow-x:clip}
.main,.feed,.pagina{min-width:0;max-width:100%}
.feed{max-width:1180px} .pagina{max-width:920px}
@media (max-width:760px){.fila > :nth-child(n+3):not(.detalle):not(.mover-pop),.fila-stock > :nth-child(n+3):not(.detalle){grid-column:2}}
@media (max-width:900px){
  .tb{padding:10px 16px} .ctx{padding:0 16px} .ctx-det{padding:9px 16px 11px} .main{padding:0 16px 48px}
  .brand{grid-row:1;grid-column:1} .acciones{grid-row:1;grid-column:2}   /* marca y acciones en la primera fila; la nav debajo, desplazable */
  .tb > .seg{grid-row:2;grid-column:1 / -1;display:flex;justify-self:stretch;max-width:100%;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .tb > .seg::-webkit-scrollbar{display:none} .tb > .seg button{flex:none}
  .fld.buscar{min-width:0;flex:1 1 240px} .barra .fld.buscar .sugs{min-width:0;width:100%}
}
@media (max-width:640px){
  .tb{grid-template-columns:1fr auto;row-gap:8px} .tb > .seg button{padding:0 12px;font-size:13px}
  .acciones .btn{min-height:36px;padding:0 12px} .acciones .btn.primary{min-height:36px}
  .ctx{height:auto;min-height:44px;flex-wrap:wrap;padding:6px 16px;row-gap:2px} .ctx .titulo{flex-wrap:wrap;gap:2px 10px} .ctx .titulo b{white-space:normal;font-size:15px}
  .estado{max-width:100%;padding-left:4px} .estado span{overflow:hidden;text-overflow:ellipsis}
  .barra{position:static;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px 0 10px}
  .barra > .rama,.barra > .btn,.barra > .desc,.barra > .tiny,.barra > .chip,.barra > .toggle,.barra > .fld.buscar{grid-column:1 / -1}
  .barra > .seg{display:flex;grid-column:1 / -1;justify-self:stretch} .barra > .seg button{flex:1;justify-content:center;padding:0 6px}
  .barra > .fld{min-width:0} .barra .fld input[type=number]{width:52px}
  .barra > .sp{display:none}
  .rama > .btn{max-width:100%;width:100%}
  .rama .pop{left:0;right:0;width:auto;max-height:60vh}
  .resumen{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;padding:12px 14px} .resumen .sep{display:none}
  .resumen .dato{display:flex;flex-direction:column;align-items:flex-start;min-width:0} .resumen .dato span{margin-left:0} .resumen .dato .t{max-width:100%}
  .resumen .dato.link{align-items:flex-start;flex-direction:column;text-align:left}
  .col > .cab{flex-wrap:wrap} .col > .cab .dir{margin-left:0;width:100%}
  .tarj{padding:12px 12px 10px;contain-intrinsic-size:auto 520px} .tarj .cab{display:grid;grid-template-columns:56px 1fr;gap:10px}
  .tarj .cab .img{width:56px;height:56px}
  .tarj .cant{grid-column:1 / -1;margin-left:0;flex-direction:row;align-items:center;justify-content:space-between;gap:10px;text-align:left}
  .tarj .cant .stepper{flex:1} .stepper input{width:auto;flex:1;min-width:60px}
  .tarj.compra .cant{flex-direction:row;align-items:baseline;justify-content:flex-start;gap:8px}
  .tabla,.tabla.compras{grid-template-columns:40px repeat(4,1fr);gap:4px 6px;font-size:11.5px;padding:8px} .tabla .v{white-space:normal;flex-wrap:wrap;gap:2px 5px} .tabla .r.h span{font-size:9.5px;letter-spacing:.03em}
  .wl{grid-template-columns:28px 1fr;gap:2px 10px} .wl .lb{grid-column:2;padding-top:0} .wl .tx{grid-column:2;padding-top:0}
  .grupo-tabla .r{grid-template-columns:1fr 50px 50px 56px;gap:6px;padding:5px 8px}
  .fila,.fila-stock{contain-intrinsic-size:auto 170px} .fila .nombre b{white-space:normal} .detalle,.fila-stock .detalle{padding-left:0}
  .filtros{padding:10px 12px} .filtros .seg{flex-wrap:wrap} .filtros .fld{flex:1 1 100%;min-width:0}   /* un campo por fila: 'me queda para N días o menos' entero */
  .cab-panel,.cab-lista{flex-wrap:wrap}
  .compras{grid-template-columns:1fr}
  .toast{left:12px;right:12px;bottom:12px;max-width:none}
  .nov{grid-template-columns:56px 1fr} .nov .acc{grid-column:1 / -1;justify-content:flex-start;max-width:none}
  .asig .fld{min-width:0;flex:1 1 100%} .asig{width:100%}
  .form .row{grid-template-columns:1fr;gap:4px} .form .row .help{grid-column:1} .form .row .lbl{white-space:normal}
  .grp .cab input{min-width:0;width:100%} .grp .miembros{grid-template-columns:1fr}
  .kv{grid-template-columns:1fr;gap:0} .kv dt{margin-top:6px}
  .trello pre{font-size:12px}
  .est-graf{padding:12px 10px 8px} .est-graf .cab{gap:8px} .leyenda{margin-left:0;gap:8px 12px;font-size:11px}
  .est-texto{padding:14px 14px} .est-concl{font-size:14px}
  .cuadro{grid-template-columns:118px repeat(var(--anios,3),minmax(72px,1fr))} .cuadro .ct{position:sticky;left:0;background:var(--card);z-index:1}
  .cifras{grid-template-columns:1fr 1fr 1fr;gap:4px 10px} .cifras em{grid-column:1 / -1} .cifras small{grid-column:1 / -1}
  .meses-suc,.tend-suc{grid-template-columns:1fr} .meses-suc em{padding-top:0} .meses-suc p,.tend-suc p{grid-column:1}
  .acciones-est{grid-template-columns:1fr}
  .gpl-cab{flex-wrap:wrap} .transf-gpl>.gpl-cab .muted{white-space:normal}
  /* v15 */
  #barra,#stk-barra{position:static}
  .gpl-cab.spine{top:var(--top-h,92px)} .spine .tit .frase{display:none} .spine .saltos{margin-left:0;width:100%}
  .resumen.frases{flex-direction:column;align-items:stretch} .resumen.frases>.btn{align-self:flex-start}
  .ajustes-ctl .fld,.ajustes-ctl .seg,.ajustes-ctl .toggle,.ajustes-ctl .desc{flex:1 1 100%}
  .hacer .acc{width:100%} .hacer .acc .btn{flex:1;justify-content:center} .stepper.mini{flex:1} .stepper.mini input{width:auto;flex:1;min-width:40px}
  .filtros.fila2 .sp{display:none} .filtros.fila2 .btn.soft{width:100%;justify-content:center}
  #stk-estado{flex-wrap:wrap;gap:2px} #stk-estado button{flex:1 1 46%;padding:0 6px;font-size:12.5px;min-width:0} #stk-estado button+button::before{display:none}
  .tarj{contain-intrinsic-size:auto 420px}
}

/* ---------- Resumen v14 (plan v18): una fila por jueves y los quiebres de la semana ---------- */
.res-tabla{margin-top:14px;padding:14px 18px 10px} .res-tabla .cab{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:8px} .res-tabla .cab .sub{color:var(--muted);font-size:12.5px;max-width:72ch}
.tabla-semanas-wrap{overflow-x:auto;max-width:100%}
.tabla-semanas{display:grid;grid-template-columns:minmax(150px,1.2fr) 88px repeat(2,minmax(96px,1fr)) minmax(130px,1.1fr) repeat(3,minmax(78px,.8fr)) minmax(92px,.9fr) minmax(80px,.7fr);gap:0 10px;align-items:stretch;min-width:min-content;font-size:13px}
.tabla-semanas .r{display:contents}
.tabla-semanas .r>span{padding:8px 4px;border-bottom:1px solid var(--line);min-height:44px;display:flex;flex-direction:column;justify-content:center;font:600 13.5px var(--font-t);font-variant-numeric:tabular-nums}
.tabla-semanas .r>span small{font:400 11.5px var(--font);color:var(--muted)}
.tabla-semanas .r.h>span{font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;min-height:0;padding-bottom:6px;border-bottom:1px solid var(--line-2);justify-content:flex-end}
.tabla-semanas .r:not(.h)>span{cursor:pointer} .tabla-semanas .r:not(.h):hover>span{background:var(--brand-tint)} .tabla-semanas .r.on>span{background:var(--brand-soft)}
.tabla-semanas .sem-btn{border:0;background:transparent;padding:0;text-align:left;font:inherit;color:var(--ink);border-radius:6px;min-height:28px;cursor:pointer} .tabla-semanas .sem-btn b{display:block;font:600 13.5px var(--font-t)} .tabla-semanas .sem-btn small{display:block}
.tabla-semanas .cero,.tabla-semanas .gris{color:var(--muted);font-weight:500} .tabla-semanas .bad{color:var(--bad)} .tabla-semanas .warn{color:var(--warn)} .tabla-semanas .edit{color:var(--edit-ink)} .tabla-semanas .ok{color:var(--ok)} .tabla-semanas .ink2{color:var(--ink-2)}
.tabla-semanas .prov{font:500 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.res-frase{margin:0 0 12px;padding:10px 14px;background:var(--brand-tint);border-radius:8px;font:500 14px/1.5 var(--font);color:var(--ink)}
.tabla-semanas .r.g>span{font:700 11px var(--font-t);color:var(--ink-2);text-transform:none;letter-spacing:0;min-height:0;padding:0 4px 4px;border-bottom:2px solid var(--line-2);justify-content:flex-end;background:transparent!important;cursor:default}
.tabla-semanas .r.h>span{font-size:10px;line-height:1.25}
.res-leyenda{display:flex;gap:8px 16px;flex-wrap:wrap;font-size:11.5px;color:var(--ink-2);padding:10px 4px 0} .res-leyenda span{display:inline-flex;align-items:center;gap:6px} .res-leyenda .dot{width:8px;height:8px;border-radius:50%;background:var(--line-2);flex:none}
.res-det{margin-top:14px}
.fila-q{display:grid;grid-template-columns:44px minmax(220px,1.5fr) minmax(190px,1.1fr) minmax(150px,1fr) minmax(130px,.9fr);gap:4px 12px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--line);content-visibility:auto;contain-intrinsic-size:auto 110px}
.fila-q:last-child{border-bottom:0}
.fila-q .nombre .sub{flex-wrap:wrap}
.fila-q .cuando{font-size:12.5px;color:var(--ink-2)} .fila-q .cuando b{font-family:var(--font-t);color:var(--ink)} .fila-q .cuando small{display:block}
.fila-q .clase{display:flex;flex-direction:column;gap:4px;align-items:flex-start} .fila-q .venta{font:600 13px var(--font-t)} .fila-q .venta small{font:400 12px var(--font);color:var(--muted)}
.fila-q .rep{font-size:12.5px;color:var(--ink-2)} .fila-q .rep b{font-family:var(--font-t);color:var(--ink)}
.fila-q .motivo{grid-column:2 / -1;display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--ink-2);max-width:72ch} .fila-q .motivo b{color:var(--ink)}
.fila-q .motivo .ic{width:24px;height:24px;border-radius:50%;background:var(--brand-soft);color:var(--brand-ink);display:grid;place-items:center;flex:none}
.fila-q .acc{grid-column:2 / -1}
.chip.sinventa{color:var(--muted);border-style:dashed} .chip.warn{color:var(--ink-2)}
@media (max-width:640px){
  .res-tabla{padding:12px 12px 8px}
  .tabla-semanas{grid-template-columns:118px 64px repeat(8,minmax(64px,1fr));gap:0 6px;font-size:12px}
  .tabla-semanas .r>span:first-child{position:sticky;left:0;background:var(--card);z-index:1} .tabla-semanas .r.on>span:first-child{background:var(--brand-soft)}
  .fila-q{grid-template-columns:44px 1fr;contain-intrinsic-size:auto 230px} .fila-q>:nth-child(n+3){grid-column:2}
}

/* v15.6: la fila entera en amarillo cuando difiere del modelo, y la ventanita para mover a mano con vista previa
   (dueño, 2026-09-09: "apenas mueva algo que no dice el modelo se pone en amarillo" · "que me abra una ventanita y yo poner
   el número a mandar y una preview de cómo queda ese producto en stock para x días") */
.fila.edit,.fila.edit:hover,.fila.edit.abierta{background:var(--edit)}
.fila.edit .nombre b{color:var(--edit-ink)}
.mover-pop{grid-column:1 / -1;margin:6px 0 10px 56px;padding:12px 14px;background:var(--card);border:1px solid var(--edit-line);border-radius:var(--r1);cursor:default;display:flex;flex-direction:column;gap:10px}
.mover-pop .mv-cab{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.mover-pop .mv-cab b{font:700 14px var(--font-t);color:var(--ink)} .mover-pop .mv-cab .muted{font-size:12.5px}
.mover-pop .mv-cant{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mover-pop .mv-cant .u{font-size:13.5px} .mover-pop .mv-cant .u b{font-weight:700}
.mover-pop .stepper input{width:72px;font:700 17px var(--font-t);text-align:center}
.mover-pop .mv-aviso{display:inline-flex;align-items:center;gap:5px;color:var(--edit-ink);font-size:12.5px}
.tabla.mv{grid-template-columns:56px 1.1fr 1.1fr 1.2fr}
.mover-pop .mv-pie{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mover-pop .mv-pie small{flex:1 1 220px;min-width:0}
@media (max-width:760px){
  /* en el celular la fila vuelve a ser de dos columnas: la v15 dejó las 6 del escritorio y empujó los hijos a la 2.ª con
     `nth-child(n+3){grid-column:2}`, así que el contenido usaba 190 px de los 341 de la fila y un bloque a lo ancho (1/-1)
     se estiraba a los tracks invisibles (932 px) */
  .fila{grid-template-columns:44px 1fr}
  .mover-pop{margin-left:0;grid-column:1 / -1;width:auto;max-width:100%;box-sizing:border-box} .tabla.mv{grid-template-columns:44px 1fr 1fr 1fr;font-size:12px}
  .mover-pop .mv-cant{gap:8px} .mover-pop .stepper{flex:1 1 auto} .mover-pop .stepper input{flex:1 1 auto;width:auto}
  .mover-pop .mv-pie .btn{flex:1 1 auto}
}

/* v15.8: etiquetas en tres niveles (dueño, 2026-09-09: "no está tan especificado hasta que pongo el mouse por encima…
   cierta colorimetría en base a algunas cosas que hay que tener en cuenta… menos diseño inteligencia artificial").
   aviso = chip con punto de color (el mismo vocabulario que las tablas) · regla = ícono + texto · dato = solo texto.
   Ningún color nuevo: ámbar solo donde hay algo que mirar, rojo solo cuando no hay stock en ninguna de las dos. */
.etiqs{display:flex;align-items:center;gap:3px 9px;flex-wrap:wrap;margin-top:6px;font-size:11.5px;line-height:18px}
.etiq{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;min-width:0}
.etiq b{font-family:var(--font-t);font-weight:600;color:var(--ink)}
.etiq .i{width:13px;height:13px;flex:none}
/* aviso: pocos y con punto de color */
.etiq.av{border:1px solid var(--line-2);border-radius:999px;padding:0 9px;color:var(--ink);background:var(--card)}
.etiq.av .pt{width:6px;height:6px;border-radius:50%;flex:none}
.etiq.av.warn{border-color:rgba(217,138,11,.42)} .etiq.av.warn .pt{background:var(--warn)}
.etiq.av.bad{border-color:rgba(211,50,43,.38);color:var(--bad)} .etiq.av.bad .pt{background:var(--bad)}
.etiq.av.edit{background:var(--edit);border-color:var(--edit-line);color:var(--edit-ink)}
.etiq.av.edit .i{color:var(--edit-ink)}
.etiq.av.off{color:var(--muted);border-color:var(--line);border-style:dashed;background:transparent}
.etiq.av.off .i{color:var(--muted)}
/* regla: sin caja, el ícono la distingue */
.etiq.rg{color:var(--ink-2)} .etiq.rg .i{color:var(--muted)}
.etiq.rg .nm{max-width:20ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* dato: el tono es la escala */
.etiq.dt{color:var(--ink-2)}
.etiq.dt.plata.a{color:var(--ink);font-weight:600} .etiq.dt.plata.b{color:var(--ink-2)}
.etiq.dt.plata.c,.etiq.dt.plata.d{color:var(--muted)}
.etiq.dt.viaje{color:var(--muted)}
/* punto separador solo entre los silenciosos, para que no parezcan pastillas sueltas */
.etiq.q + .etiq.q::before{content:"·";color:var(--line-2);margin-right:6px}
.fila .nombre .sub .etiqs,.fila-stock .nombre .sub .etiqs{margin-top:0;display:contents}
/* en la lista la columna es angosta: las etiquetas no se achican (son la señal), el nombre de la planilla sí */
.fila .nombre .sub .etiq,.fila-stock .nombre .sub .etiq{flex:none}
.fila .nombre .sub .etiq.rg .nm,.fila-stock .nombre .sub .etiq.rg .nm{max-width:none}
@media (max-width:640px){ .etiqs{gap:2px 8px;font-size:11px} .etiq.rg .nm{max-width:14ch} }

/* v15.9: los equivalentes de un grupo en Compras, con subtotal (dueño, 2026-09-09: "me gustaría ver cuáles son los
   equivalentes… y una especie de subtotal"). Se abren desde la etiqueta, no desde el "Por qué". */
.etiq.rg.eq{background:none;border:0;padding:0;cursor:pointer;font:inherit;color:var(--ink-2);min-height:0}
.etiq.rg.eq .ver{color:var(--brand);border-bottom:1px solid var(--brand-line)}
.etiq.rg.eq:hover .ver,.etiq.rg.eq:focus-visible .ver{border-bottom-color:var(--brand)}
.equivalentes{margin:8px 0 2px;display:flex;flex-direction:column;gap:6px}
.grupo-tabla.eq .r{grid-template-columns:1fr 74px 74px 78px}
.grupo-tabla.eq .r .nm{display:flex;flex-direction:column;gap:1px;min-width:0}
.grupo-tabla.eq .r .nm > .sku{font-size:11px;color:var(--muted);font-family:var(--font)}
.grupo-tabla.eq .r .v small{font-weight:400;color:var(--muted);font-family:var(--font);margin-left:3px}
.grupo-tabla.eq .r .v.cero{color:var(--muted);font-weight:500}
.grupo-tabla.eq .r.sub{background:var(--bg);border-top:1px solid var(--line-2)}
.grupo-tabla.eq .r.sub .nm,.grupo-tabla.eq .r.compra .nm{font-family:var(--font-t);font-weight:600;color:var(--ink)}
.grupo-tabla.eq .r.compra{background:var(--brand-tint)} .grupo-tabla.eq .r.compra .v{color:var(--brand-ink)}
.equivalentes .pie{color:var(--muted);font-size:11.5px;line-height:1.45}
@media (max-width:640px){ .grupo-tabla.eq .r{grid-template-columns:1fr 54px 54px 58px;gap:6px;padding:5px 8px} }

/* v15.10: el interruptor de los pedidos en camino, a la vista en la línea de ajustes, y la lista que dictó el dueño
   (2026-09-09: "como default debe estar apagado, pero se debe mostrar; y si yo lo activo, me muestra los pedidos"). */
.camino-ctl{display:inline-flex;align-items:center;gap:8px;flex:none;padding-left:10px;border-left:1px solid var(--line)}
.camino-ctl .cnt{font-size:12px;color:var(--muted);white-space:nowrap}
.transito-pop{margin-top:8px;padding:12px 14px;background:var(--card);border:1px solid var(--line);border-radius:var(--r1);font-size:12.5px}
.transito-pop[hidden]{display:none}
.transito-pop .cab-pop{display:flex;align-items:baseline;gap:10px;margin-bottom:8px}
.transito-pop .cab-pop b{font:700 14px var(--font-t)} .transito-pop .cab-pop .muted{font-size:12px}
.transito-pop .cols,.transito-pop .r,.transito-pop .total{display:grid;grid-template-columns:1fr 70px 70px;gap:8px;align-items:baseline}
.transito-pop .cols{font:700 10.5px var(--font-t);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;padding-bottom:3px;border-bottom:1px solid var(--line)}
.transito-pop .orden{padding:6px 0;border-bottom:1px solid var(--line)}
.transito-pop .orden .cab{display:flex;align-items:baseline;gap:8px;margin-bottom:2px}
.transito-pop .orden .cab b{font:600 12.5px var(--font-t);color:var(--ink)}
.transito-pop .orden .cab .est{font-size:11.5px;color:var(--muted)}
.transito-pop .r{padding:1px 0;color:var(--ink-2)}
.transito-pop .r .nm{display:flex;align-items:baseline;gap:7px;min-width:0}
.transito-pop .r .nm .sku{font-size:11px;color:var(--muted)}
.transito-pop .r .nm .motivo{font-size:11px;color:var(--warn)}
.transito-pop .r.no{color:var(--muted)} .transito-pop .r.no .v{text-decoration:line-through}
.transito-pop .r .v,.transito-pop .total .v{text-align:right;font-family:var(--font-t);font-weight:600;font-variant-numeric:tabular-nums}
.transito-pop .total{margin-top:6px;padding-top:6px;border-top:1px solid var(--line-2)}
.transito-pop .total .nm{font-family:var(--font-t);font-weight:600;color:var(--ink)}
.transito-pop .pie{display:block;margin-top:6px;color:var(--muted);font-size:11.5px;line-height:1.45}
.transito-pop .cargando{color:var(--muted)}
@media (max-width:640px){
  .camino-ctl{padding-left:0;border-left:0;width:100%;flex-wrap:wrap}
  .transito-pop .cols,.transito-pop .r,.transito-pop .total{grid-template-columns:1fr 52px 52px;gap:6px}
}

/* v15.11: el pedido en camino, visible en la tarjeta (dueño: "diferencialo para identificarlo fácilmente"). */
.tabla .v small.cam{display:block;width:100%;color:var(--warn);font-weight:600;font-family:var(--font-t);font-size:11px}
.etiq.dt.camino-off{color:var(--muted)}

/* v15.12: la ayuda al pasar el mouse, con la tipografía y los colores de la app (dueño, 2026-09-09: "que no salga ese
   banner negro; algo más bonito, más sencillo, y tampoco cargarlo mucho"). Reemplaza al `title` del navegador. */
.ayuda{position:fixed;z-index:60;max-width:320px;padding:9px 12px;background:var(--card);border:1px solid var(--line-2);
  border-radius:10px;box-shadow:0 8px 24px rgba(20,30,50,.14);font-size:12.5px;line-height:1.5;color:var(--ink-2);
  pointer-events:none;opacity:0;transform:translateY(3px);transition:opacity .14s cubic-bezier(.22,1,.36,1),transform .14s cubic-bezier(.22,1,.36,1)}
.ayuda.on{opacity:1;transform:none}
.ayuda[hidden]{display:none}
.ayuda b{display:block;font:600 13px var(--font-t);color:var(--ink);margin-bottom:2px}
.ayuda b:last-child{margin-bottom:0}
.ayuda span{display:block}
.ayuda::after{content:"";position:absolute;left:var(--fx,50%);bottom:-5px;width:9px;height:9px;margin-left:-5px;
  background:var(--card);border-right:1px solid var(--line-2);border-bottom:1px solid var(--line-2);transform:rotate(45deg)}
.ayuda.abajo::after{bottom:auto;top:-5px;border:0;border-left:1px solid var(--line-2);border-top:1px solid var(--line-2)}
@media (prefers-reduced-motion:reduce){ .ayuda{transition:none;transform:none} }
@media (max-width:640px){ .ayuda{max-width:calc(100vw - 24px);font-size:13px} }
