/* Layout: tablet-first work surface. Brand bar, a row of tabs per role, one working column; forms open as sheets over the page. */
:root{
  --bg:#F1F4F2; --surface:#FFFFFF; --surface-2:#E7ECE9; --ink:#14201C; --muted:#586861; --line:#D2DAD6;
  --accent:#1D4ED8; --accent-ink:#FFFFFF; --accent-soft:#E2E9FB;
  --good:#17794B; --good-bg:#DDF0E6; --warn:#8A5000; --warn-bg:#FAEBCF; --bad:#B42318; --bad-bg:#FBE0DC;
  --f-display:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;
  --f-body:'Public Sans','Segoe UI',system-ui,-apple-system,sans-serif;
  --r:10px;
  /* Panel: un color fijo por restaurante (validado para daltonismo); ejes y cuadrícula recesivos */
  --s-tnf:#2a78d6; --s-bowl:#eb6834; --s-cocadas:#1baf7a; --s-buffet:#eda100;
  --viz-grid:#e1e0d9; --viz-axis:#c3c2b7; --viz-muted:#898781;
  --up:#006300;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0F1514; --surface:#172120; --surface-2:#212C2A; --ink:#E7EFEC; --muted:#9BABA5; --line:#2C3835;
    --accent:#7FA3FF; --accent-ink:#0A1128; --accent-soft:#1B2745;
    --good:#5FD39A; --good-bg:#16352A; --warn:#F2B24D; --warn-bg:#3A2D14; --bad:#FF8E82; --bad-bg:#40201C;
    --s-tnf:#3987e5; --s-bowl:#d95926; --s-cocadas:#199e70; --s-buffet:#c98500;
    --viz-grid:#2c2c2a; --viz-axis:#383835; --up:#0ca30c;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0F1514; --surface:#172120; --surface-2:#212C2A; --ink:#E7EFEC; --muted:#9BABA5; --line:#2C3835;
  --accent:#7FA3FF; --accent-ink:#0A1128; --accent-soft:#1B2745;
  --good:#5FD39A; --good-bg:#16352A; --warn:#F2B24D; --warn-bg:#3A2D14; --bad:#FF8E82; --bad-bg:#40201C;
  --s-tnf:#3987e5; --s-bowl:#d95926; --s-cocadas:#199e70; --s-buffet:#c98500;
  --viz-grid:#2c2c2a; --viz-axis:#383835; --up:#0ca30c;
  color-scheme:dark;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.45;padding-inline:16px;padding-block:env(safe-area-inset-top,0px) 110px}
.wrap{max-width:1080px;margin:0 auto}
h1,h2,h3{font-family:var(--f-display);margin:0;text-wrap:balance;line-height:1.15}
p{margin:0}
button{font:inherit}
.muted{color:var(--muted)} .sm{font-size:14px}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-block:16px 12px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.mark{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--accent);color:var(--accent-ink);font-family:var(--f-display);font-weight:700;font-size:18px;letter-spacing:.02em;flex:none}
.brand h1{font-size:22px}
.brand .sub{color:var(--muted);font-size:14px}
.top-r{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.today{color:var(--muted);font-size:14px}
.tabs{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--bg);display:flex;gap:6px;overflow-x:auto;padding-block:6px 10px;border-bottom:1px solid var(--line);margin-bottom:18px}
.tab{flex:none;min-height:44px;padding:0 18px;border-radius:99px;border:1px solid transparent;background:transparent;color:var(--muted);font-weight:600;cursor:pointer}
.tab.on{background:var(--ink);color:var(--bg)}
.tab:not(.on):hover{background:var(--surface-2)}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:var(--r);border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:600;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--surface-2)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.primary:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent}
.btn.danger{color:var(--bad);border-color:var(--bad)}
.btn.sm{min-height:36px;padding:0 12px;font-size:14px}
.btn.icon{width:44px;padding:0;font-size:22px;line-height:1}
.btn[disabled]{opacity:.5;cursor:default}
input,select,textarea{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:8px;min-height:44px;padding:0 12px;width:100%}
textarea{padding:10px 12px;min-height:72px;resize:vertical}
label{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:4px;letter-spacing:.02em}
.chk{display:flex;align-items:center;gap:10px;font-size:16px;color:var(--ink);font-weight:500;letter-spacing:0;margin:0;min-height:44px}
.chk input{width:22px;min-height:22px;height:22px;flex:none}
.sec-h{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.sec-h h2{font-size:24px}
.row-actions{display:flex;gap:8px;flex-wrap:wrap}
.datenav{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.datenav input[type=date]{width:auto;min-width:170px}
.longdate{font-family:var(--f-display);font-size:20px;font-weight:600;margin-bottom:12px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:20px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;min-width:0}
.stat .k{font-size:13px;font-weight:600;color:var(--muted);letter-spacing:.03em;text-transform:uppercase}
.stat .v{font-family:var(--f-display);font-size:28px;font-weight:700;font-variant-numeric:tabular-nums;margin-top:2px}
.stat.hero{background:var(--ink);border-color:var(--ink)}
.stat.hero .k{color:var(--bg);opacity:.75} .stat.hero .v{color:var(--bg)}
.neg{color:var(--bad)} .pos{color:var(--good)}
.stat.hero .neg{color:var(--bad)}
.tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);margin-bottom:20px}
table{width:100%;border-collapse:collapse;min-width:520px}
th{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);font-weight:700;text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--surface-2)}
td{padding:10px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
tr:last-child td{border-bottom:none}
th.num,td.num{text-align:right;font-variant-numeric:tabular-nums}
td.acts{text-align:right}
td.acts .row-actions{justify-content:flex-end}
.pn{font-weight:600}
.pill{display:inline-block;padding:2px 10px;border-radius:99px;font-size:13px;font-weight:600;white-space:nowrap}
.pill.good{background:var(--good-bg);color:var(--good)} .pill.warn{background:var(--warn-bg);color:var(--warn)}
.pill.bad{background:var(--bad-bg);color:var(--bad)} .pill.info{background:var(--accent-soft);color:var(--accent)} .pill.neutral{background:var(--surface-2);color:var(--muted)}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:14px}
.chip{flex:none;min-height:38px;padding:0 14px;border-radius:99px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:500;cursor:pointer}
.chip.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);font-weight:700}
.toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.toolbar .grow{flex:1 1 220px;min-width:0}
/* acción secundaria dentro de un texto (p. ej. «Quitar» en la lista para pedir); área de toque amplia */
.linkbtn{background:none;border:0;padding:6px 2px;margin:-6px 0;font:inherit;color:var(--accent);text-decoration:underline;text-underline-offset:2px;cursor:pointer;touch-action:manipulation}
.linkbtn:disabled{opacity:.5;cursor:default}
/* tablas con muchos montos (planilla): el monto no se parte en dos líneas; la tabla se desliza de lado */
table.montos td.num{white-space:nowrap}
table.montos td:first-child{min-width:150px}
/* tarjeta «Marcar asistencia» de la pantalla principal: resaltada para que cualquiera la encuentre */
.pick.asistencia{border:2px solid var(--accent);background:var(--accent-soft)}
.pick.asistencia b{color:var(--accent)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;min-width:0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-bottom:20px}
.card h3{font-size:19px}
.card .meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.card .big{font-family:var(--f-display);font-size:24px;font-weight:700;font-variant-numeric:tabular-nums;margin-block:6px}
.card .row-actions{margin-top:12px}
.prow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-block:10px;border-top:1px solid var(--line)}
.prow .grow{flex:1 1 160px;min-width:0}
.banner{border-radius:var(--r);padding:12px 16px;margin-bottom:16px;font-weight:500}
.banner.warn{background:var(--warn-bg);color:var(--warn)} .banner.info{background:var(--accent-soft);color:var(--accent)} .banner.good{background:var(--good-bg);color:var(--good)}
.banner.bad{background:var(--bad-bg);color:var(--bad);border:2px solid var(--bad)}
/* Usuarios → PINs: el PIN actual bien legible */
.pin-ver{font-family:ui-monospace,Consolas,monospace;font-size:20px;font-weight:700;letter-spacing:.15em}
/* Personal → Asistencia del mes: ausencias e imagen de prueba */
/* cada dato en una sola línea y con aire: si no cabe, la tabla se desplaza a lo ancho */
table.asis-mes{min-width:980px}table.asis-mes th,table.asis-mes td{white-space:nowrap;padding-inline:14px}
table.asis-mes td:last-child{white-space:normal;min-width:220px}
tr.aus-no_asistio td{background:var(--bad-bg)} tr.aus-libre td{background:var(--surface-2)} tr.aus-certificado td{background:var(--accent-soft)}
.aus-foto{margin-top:10px;display:grid;gap:8px;justify-items:start}.aus-foto img{max-width:100%;max-height:260px;border-radius:8px;border:1px solid var(--line)}
.aus-foto.grande img{max-height:70vh}
/* Planilla por restaurante: el nombre del empleado con espacio */
.asis-tienda table.montos td:first-child{min-width:150px}.asis-tienda table.montos th,.asis-tienda table.montos td{padding-inline:6px;font-size:14px}.asis-tienda table.montos th{font-size:11px}
/* Ver mes: un cuadro por quincena (la que no ha empezado, más tenue) */
.asis-q{margin-bottom:14px}.asis-q .stats{margin-bottom:0}.asis-q.vacia{opacity:.6}
/* Registrar un día: las 4 opciones como botones grandes */
.dia-ops{display:grid;gap:10px}.dia-op{display:grid!important;justify-items:start;justify-content:start!important;align-content:center;gap:2px;text-align:left;min-height:62px;padding:10px 14px}
/* Personal → Asistencia: un cuadro por tienda */
.asis-tienda{margin-bottom:18px}.asis-tienda details summary{cursor:pointer;font-weight:600;color:var(--accent);padding-block:4px}
/* Resumen → historial del mes: el día de hoy resaltado */
tr.hoy td{background:var(--accent-soft)}
/* mercancía por procesar (24 h desde la recepción) */
/* Procesar mercancía: cada producto con su etiqueta (marcada, cómo se guarda y copias) */
.proc-item{border-bottom:1px solid var(--line);padding-bottom:8px}.proc-item .line{border-bottom:0;padding-bottom:4px}
.proc-et{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}.proc-et .chips{margin:0;padding:0}.proc-et .f{flex:0 0 90px;margin:0}.proc-et>.btn{align-self:flex-end;min-height:44px}
.bajo-aviso ul{margin:6px 0 4px;padding-left:20px}.bajo-aviso li{margin:4px 0}.bajo-aviso .btn{margin-left:6px}
.ped-aviso ul{margin:6px 0 0;padding-left:20px}.ped-aviso li{margin:4px 0}.ped-aviso .btn{margin-left:6px}
.proc-urgente ul{margin:6px 0 10px;padding-left:20px}.proc-urgente li{margin:2px 0}
.empty{background:var(--surface);border:1px dashed var(--line);border-radius:var(--r);padding:28px 20px;text-align:center;color:var(--muted)}
.empty strong{display:block;color:var(--ink);font-family:var(--f-display);font-size:20px;margin-bottom:6px}
td.empty-s,.empty-s{color:var(--muted);text-align:center;padding:24px 14px}
.picker{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-block:18px}
.pick{text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px;cursor:pointer;color:var(--ink);min-height:96px}
.pick:hover{border-color:var(--accent);background:var(--accent-soft)}
.pick b{display:block;font-family:var(--f-display);font-size:20px;margin-bottom:4px}
.pick span{color:var(--muted);font-size:14px}
.group-h{font-family:var(--f-display);font-size:18px;margin:18px 0 8px;color:var(--muted)}
.orow{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;margin-bottom:8px}
.orow .grow{flex:1;min-width:0}
.step{display:inline-flex;align-items:center;gap:6px;flex:none}
.step input{width:76px;text-align:center;font-variant-numeric:tabular-nums;font-weight:600}
.bar{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--surface);border-top:1px solid var(--line);padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px))}
.bar-in{max-width:1080px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.bar-in .tot{font-weight:600}
.scrim{position:fixed;inset:0;z-index:50;background:rgba(8,14,12,.55);display:flex;align-items:flex-end;justify-content:center}
.sheet{background:var(--surface);color:var(--ink);width:min(760px,100%);max-height:94%;display:flex;flex-direction:column;border-radius:16px 16px 0 0;box-shadow:0 -8px 40px rgba(0,0,0,.25)}
.sheet-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px 8px}
.sheet-h h2{font-size:22px}
.sheet-b{overflow-y:auto;padding:8px 20px 16px;min-height:0}
.sheet-f{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 20px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line)}
.sheet-f .btns{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
@media (min-width:760px){.scrim{align-items:center}.sheet{border-radius:16px;max-height:88%}}
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:14px}
.f{min-width:0}
.line{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;padding-block:10px;border-bottom:1px solid var(--line)}
.line .grow{flex:1 1 220px;min-width:0}
.line .f{flex:0 1 130px}
.sheet .tot-row{font-weight:700;font-size:18px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(92px + env(safe-area-inset-bottom,0px));z-index:70;background:var(--ink);color:var(--bg);padding:10px 18px;border-radius:99px;font-weight:600;max-width:calc(100% - 32px);text-align:center}
.nota td,.nota th{padding:8px 10px}
.hist{display:flex;flex-direction:column}
.hist-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.hist-row:last-child{border-bottom:none}
.hist-row .grow{flex:1 1 240px;min-width:0}
/* --- Panel consolidado --- */
.filtros{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:18px}
.filtros input[type=date]{width:auto;min-width:150px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:18px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;min-width:0}
.kpi .k{font-size:13px;font-weight:600;color:var(--muted);letter-spacing:.03em;text-transform:uppercase}
.kpi .v{font-size:28px;font-weight:700;margin-top:2px}
.kpi .d{font-size:13px;font-weight:600;margin-top:2px;color:var(--muted)}
.kpi .d.up{color:var(--up)} .kpi .d.down{color:var(--bad)}
.viz{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin-bottom:18px;min-width:0}
.viz h3{font-size:17px;margin-bottom:2px}
.viz .sub{color:var(--muted);font-size:13px;margin-bottom:8px}
.viz svg{display:block;width:100%;height:auto;overflow:visible}
.viz svg text{font-family:var(--f-body);fill:var(--viz-muted);font-size:12px}
.viz svg text.lbl{fill:var(--ink);font-weight:600;font-size:12px}
.viz .grid{stroke:var(--viz-grid);stroke-width:1}
.viz .base{stroke:var(--viz-axis);stroke-width:1}
.viz .cross{stroke:var(--viz-axis);stroke-width:1;visibility:hidden}
.viz .hit{fill:transparent;cursor:crosshair;outline:none}
.viz .hit:focus{fill:var(--accent-soft);opacity:.35}
.leyenda{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin-bottom:6px}
.leyenda span{display:inline-flex;align-items:center;gap:6px}
.dot{display:inline-block;width:10px;height:10px;border-radius:3px;flex:none}
.viz details{margin-top:8px;font-size:14px}
.viz details summary{cursor:pointer;color:var(--muted);font-weight:600}
.dos{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px}
/* Cuentas */
.sheet .op-h{font-size:14px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:14px 0 6px}
tr.anulado td{color:var(--muted)}
tr.anulado td.num{text-decoration:line-through}
.hbar{display:flex;align-items:center;gap:10px;margin-bottom:8px;font-size:14px}
.hbar .n{width:90px;flex:none;color:var(--ink)}
.hbar .track{flex:1;min-width:0}
.hbar .fill{height:14px;border-radius:0 4px 4px 0;background:var(--muted);min-width:2px}
.hbar .val{width:120px;flex:none;text-align:right;font-variant-numeric:tabular-nums;color:var(--ink)}
.alertas{display:grid;gap:8px}
.alerta{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line)}
.alerta .ico{flex:none;font-weight:700;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:13px}
.alerta.bad .ico{background:var(--bad-bg);color:var(--bad)} .alerta.warn .ico{background:var(--warn-bg);color:var(--warn)} .alerta.info .ico{background:var(--accent-soft);color:var(--accent)}
#viz-tip{position:fixed;z-index:90;pointer-events:none;background:var(--ink);color:var(--bg);border-radius:8px;padding:8px 10px;font-size:13px;line-height:1.4;max-width:260px;box-shadow:0 6px 20px rgba(0,0,0,.25)}
#viz-tip b{font-weight:700}
#viz-tip .row{display:flex;align-items:center;gap:6px;justify-content:space-between}
#viz-tip .row span:last-child{font-variant-numeric:tabular-nums;margin-left:12px}
@media (prefers-reduced-motion:no-preference){.sheet{animation:up .18s ease-out}@keyframes up{from{transform:translateY(16px);opacity:.6}to{transform:none;opacity:1}}}

/* Personal → Asistencia → «Ahora»: dónde está cada empleado en este momento, por tienda */
.ahora{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.ahora-col h4{margin:0 0 6px;font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.ahora-col h4 span{font-size:15px;margin-left:4px}
.ahora-col h4 .neg{color:var(--bad)}
.ahora-p{padding:6px 0;border-top:1px solid var(--line)}
.ahora-p b{display:block;font-weight:600}
/* Ver mes: avisos de las reglas de horario debajo de cada día */
tr.avisos td{border-top:0;padding-top:0}
.avisos-dia{display:flex;flex-wrap:wrap;gap:6px}
/* Personal → Asistencia: hoja del día (como en Electrónica Universal) */
.dia-nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px}
.dia-nav h2{font-size:24px;margin-right:6px}
.dia-nav input[type=date]{padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit}
.dia-stats{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))!important;margin-bottom:12px}
.toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.toolbar input[type=search]{padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit;min-width:220px}
.card.sheet-dia{padding:0;overflow:hidden}
.sheet-dia .sheet-head,.sheet-dia .prow{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1.25fr) minmax(0,1.05fr) minmax(0,1.9fr) minmax(0,1.05fr) 80px;gap:10px;align-items:center;padding:10px 14px}
.sheet-dia .sheet-head{background:var(--surface-2);font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
.sheet-dia .prow{border-top:1px solid var(--line)}
.sheet-dia .prow.rest{opacity:.6}
.sheet-dia .sheet-group{padding:9px 14px;background:var(--surface-2);border-top:2px solid var(--line);font-weight:700}
.sheet-dia .who b{display:block}.sheet-dia .who small{display:block;color:var(--muted);font-size:13px}
.sheet-dia .st select{display:block;margin-top:6px;width:100%;padding:5px 6px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink);font:inherit;font-size:14px}
.sheet-dia .punch{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-width:0}
.sheet-dia .punch input{width:112px;max-width:100%;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit}
.sheet-dia .alm{display:flex;flex-wrap:wrap;gap:8px}
.sheet-dia .lbl{display:none}
.sheet-dia .prow-avisos{grid-column:2/-1}
.emp-acts{flex-wrap:wrap!important;justify-content:flex-end;max-width:250px;margin-left:auto}
.dias-chk{display:flex;flex-wrap:wrap;gap:4px 14px}.lbl-dias{display:block;font-size:14px;font-weight:600;margin-bottom:4px}
@media (max-width:800px){
  .sheet-dia .sheet-head{display:none}
  .sheet-dia .prow{grid-template-columns:1fr 1fr}
  .sheet-dia .who,.sheet-dia .st,.sheet-dia .alm,.sheet-dia .prow-avisos{grid-column:1/-1}
  .sheet-dia .lbl{display:block;width:100%;font-size:12px;color:var(--muted)}
}
/* Personal → Planilla: una sola tabla agrupada por tienda (como en Electrónica Universal) */
.plan-acts{flex-wrap:wrap;justify-content:flex-end}
.plan-stats{margin-block:12px}
table.plan-tabla th{white-space:normal;font-size:11px;letter-spacing:.03em;line-height:1.25;vertical-align:bottom;padding:8px 6px}
table.plan-tabla td{font-size:14px;padding:8px 6px;vertical-align:top}
table.plan-tabla td:first-child{white-space:normal;min-width:130px}
table.plan-tabla .sub{display:block;font-size:12px;color:var(--muted);white-space:normal;line-height:1.3}
table.plan-tabla .money-in{width:72px;text-align:right;padding:4px 6px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink);font:inherit;font-size:14px}
table.plan-tabla tr.subtotal td{background:var(--accent-soft);font-weight:600}
/* Personal → Ver mes: casillas de hora como en Electrónica Universal */
table.asis-mes th,table.asis-mes td{padding:8px 8px;vertical-align:top}
table.asis-mes td:last-child{min-width:150px}
table.asis-mes .fcell{display:flex;flex-direction:column;gap:2px;align-items:flex-start}
table.asis-mes .fcell input{width:112px;padding:5px 7px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink);font:inherit;font-size:14px}
table.asis-mes .fcell input:disabled{opacity:.5}
table.asis-mes .fcell .meta{display:flex;gap:6px;align-items:baseline}
table.asis-mes .corr{font-size:12px;color:var(--muted)}
table.asis-mes .alm-c .pill,table.asis-mes .hrs-c .pill{display:inline-block;margin-top:4px;white-space:normal;text-align:center}
table.asis-mes .marca-c select{display:block;width:100%;padding:5px 6px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink);font:inherit;font-size:14px;margin-bottom:4px}
table.asis-mes tr.off td{background:var(--surface-2)}
table.asis-mes tr.future td{opacity:.55}/* que la tabla del mes quepa sin desplazarse en la computadora */
table.asis-mes{min-width:0}
table.asis-mes th{white-space:normal;font-size:11px;line-height:1.25;vertical-align:bottom}
table.asis-mes th,table.asis-mes td{padding:7px 6px}
table.asis-mes td{white-space:normal}
table.asis-mes td:first-child{white-space:nowrap}
table.asis-mes .fcell input{width:100px;padding:4px 5px}
table.asis-mes td:last-child{min-width:120px}/* casillas de hora en texto, con a. m. / p. m. siempre visible */
input.hora12{width:108px;padding:5px 7px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink);font:inherit;font-size:14px}
input.hora12:disabled{opacity:.5}
table.asis-mes .fcell input.hora12{width:104px}
/* Vista previa del comprobante (Planilla → Comprobante) */
.rc-vista{margin-bottom:12px}
.rc-vista .rc-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 14px;border-bottom:2px solid var(--ink);padding-bottom:8px;margin-bottom:4px}
.rc-vista .rc-top b{font-size:17px}.rc-vista small{display:block;color:var(--muted);font-size:12.5px}
.rc-vista h4{margin:12px 0 2px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.rc-vista .fila{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-top:1px solid var(--line)}
.rc-vista .fila.tot{font-weight:700;border-top:2px solid var(--ink)}
.rc-vista .rc-neto{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding:10px 14px;border:2px solid var(--ink);border-radius:10px;font-size:17px;font-weight:700}
/* Registro diario (como en Electrónica Universal) */
.reg-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:10px;margin:6px 0 12px}
.reg-head h2{margin:0}
.reg-mes select{min-height:40px;margin-left:6px}
.reg-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:var(--surface);border:1px solid var(--line);border-radius:var(--r);margin-bottom:16px}
.reg-stats>div{padding:12px 14px;border-left:1px solid var(--line);min-width:0}
.reg-stats>div:first-child{border-left:0}
.reg-stats b{display:block;font-size:20px;font-variant-numeric:tabular-nums}
.reg-stats span{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.reg-card h3{margin:18px 0 8px;font-size:18px}
.reg-card h3 small{font-size:13px;font-weight:600;color:var(--muted)}
.reg-tabla{width:100%}
.reg-tabla th,.reg-tabla td{padding:6px 10px;vertical-align:middle}
.reg-tabla td.n,.reg-tabla th.n{text-align:right;white-space:nowrap}
.reg-tabla td:nth-child(5){min-width:240px}
.reg-tabla tr.dom td{background:var(--bg)}
.reg-tabla tr.hoy td.reg-dia{color:var(--accent);font-weight:800}
.reg-tabla tfoot td{font-weight:800;background:var(--surface-2)}
.reg-dia{white-space:nowrap}
.reg-cerrado{display:block;font-size:11px;font-weight:600;color:var(--muted)}
.reg-in{width:110px;min-height:36px;padding:4px 8px;text-align:right;font-variant-numeric:tabular-nums;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit}
.reg-in.manual{border-color:var(--warn);background:var(--warn-bg)}
.reg-nota{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.reg-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.reg-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--bg);border-radius:8px;padding:3px 6px 3px 10px;font-size:13px}
.reg-x{border:0;background:none;color:var(--bad);font-size:17px;line-height:1;cursor:pointer;padding:0 4px;border-radius:5px}
.reg-x:hover{background:var(--bad-bg)}
.reg-conf{display:inline-flex;gap:6px;align-items:center;color:var(--bad);font-weight:600}
.reg-gasto{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px}
.reg-gasto input{min-height:36px;padding:4px 8px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit}
.reg-gasto input:first-child{width:100px;text-align:right}
.reg-gasto input:nth-child(2){width:190px;max-width:100%}
/* Celular: cada día es un bloque (sin deslizar de lado) */
@media (max-width:640px){
  .reg-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .reg-stats>div{border-left:0;border-top:1px solid var(--line)}
  .reg-stats>div:nth-child(-n+2){border-top:0}
  .reg-tabla thead{display:none}
  .reg-tabla,.reg-tabla tbody,.reg-tabla tfoot{display:block;min-width:0}
  .reg-tabla tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 8px;padding:10px 12px;border-bottom:1px solid var(--line)}
  .reg-tabla td{display:block;padding:0;border:0;text-align:left!important;min-width:0!important}
  .reg-tabla td.reg-dia,.reg-tabla td:nth-child(5),.reg-tabla td:nth-child(6){grid-column:1/-1}
  .reg-tabla td:nth-child(6){display:flex;justify-content:space-between;align-items:baseline}
  .reg-tabla td[data-lb]::before{content:attr(data-lb);display:block;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:2px}
  .reg-tabla td:nth-child(6)::before{display:inline}
  .reg-in{width:100%}
  .reg-gasto input:first-child,.reg-gasto input:nth-child(2){width:100%}
}