body{padding-top:0;background:var(--bg)}
.ptop{position:sticky;top:0;z-index:20;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:10px 16px;background:var(--brand-dark);color:var(--bg)}
.ptop h1{font-family:var(--display);font-size:1.2rem;color:var(--bg)}
.ptop small{display:block;opacity:.8;font-weight:600}
.ptop .acts{display:flex;gap:8px;flex-wrap:wrap}
.ptop .btn{min-height:44px;padding:0 16px;font-size:.9rem}
.ptop .btn-ghost{color:var(--bg);border-color:var(--bg)}
.pwrap{width:min(900px,100% - 24px);margin:0 auto;padding:16px 0 80px;display:grid;gap:22px}
.demo-banner{background:var(--warm);border-radius:12px;padding:8px 12px;font-weight:600;font-size:.82rem;line-height:1.4;color:var(--brand-dark);display:flex;gap:10px;align-items:flex-start;justify-content:space-between}
.demo-banner .cerrar{flex:none;width:32px;height:32px;display:grid;place-items:center;border:0;background:transparent;color:var(--brand-dark);border-radius:8px;cursor:pointer;margin:-4px -6px -4px 0}@media (hover:hover) and (pointer:fine){.demo-banner .cerrar:hover{background:rgba(19,36,73,.1)}}
.demo-banner .cerrar svg{width:18px;height:18px}
.sec h2{font-size:1.15rem;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.sec h2::after{display:none}
.count{background:var(--accent);color:var(--brand-dark);border-radius:999px;padding:2px 10px;font-size:.85rem}
.empty{color:var(--muted);font-weight:600;padding:12px 0}
.ord{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px;display:grid;gap:10px;margin-bottom:12px}
.ord.late{border:2px solid #b00020}
.ord .hd{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-weight:800}
.ord .hd .ago{color:var(--muted);font-weight:700}
.ord.late .hd .ago{color:#b00020}
.ord ul{list-style:none;padding:0;display:grid;gap:4px}
.ord li small{display:block;color:var(--muted);font-weight:600}
.ord .kv{display:block;line-height:1.55;font-size:.92rem}
.ord .kv>span:not(.tag2){display:block}
.ord .kv b{color:var(--brand-dark)}
.tag2{display:inline-block;border-radius:999px;padding:2px 10px;font-size:.8rem;font-weight:800;background:var(--warm);color:var(--brand-dark)}
.tag2.ok{background:var(--brand-dark);color:var(--bg)}
.row2{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.row2 .lbl{font-weight:800;font-size:.85rem;width:100%}
.pbtn{min-height:48px;padding:0 18px;border-radius:12px;border:2px solid var(--brand-dark);background:var(--surface);font:800 1rem var(--font);color:var(--brand-dark);cursor:pointer}@media (hover:hover) and (pointer:fine){.pbtn:hover{background:var(--warm)}}
.pbtn.go{background:var(--accent);border-color:var(--accent)}
.pbtn.sel{background:var(--brand-dark);color:var(--bg)}
.pbtn.sug{border-color:var(--accent);box-shadow:0 0 0 3px rgba(242,106,28,.35)}
.pbtn.bad{border-color:#b00020;color:#b00020}
.pbtn.dark{background:var(--brand-dark);color:var(--bg)}
.thumb{max-width:160px;border-radius:10px;border:1px solid var(--line)}
.nowrap{white-space:nowrap}

/* Cuenta regresiva de preparación */
.countdown{display:grid;gap:6px}
.cd-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-weight:700;font-size:.9rem;color:var(--muted)}
.cd-time{font:600 1.8rem var(--display);color:var(--brand-dark);font-variant-numeric:tabular-nums}
.bar{height:16px;background:var(--line);border-radius:999px;overflow:hidden}
.bar i{display:block;height:100%;width:100%;background:var(--brand-dark);border-radius:999px;transition:width 1s linear,background .3s}
.countdown.warn .bar i{background:var(--accent)} .countdown.warn .cd-time{color:var(--brand)}
.countdown.late .bar i{background:#b00020} .countdown.late .cd-time{color:#b00020}

[hidden]{display:none !important}

.paylocal{display:grid;gap:8px;border:1.5px dashed var(--line2);border-radius:12px;padding:10px 12px;background:#F8FAFC}
.acceso{position:fixed;inset:0;z-index:50;background:var(--bg);display:grid;place-items:center;padding:16px;overflow:auto}
.acceso .ord{width:min(420px,100%)}
.acceso input{font:600 1rem var(--font);padding:12px;border:2px solid var(--line-strong);border-radius:12px;width:100%}
.acceso .aviso{color:#b00020;font-weight:700;min-height:1.2em}
.salir{position:fixed;right:12px;bottom:12px;z-index:30;font:700 .8rem var(--font);padding:8px 12px;border-radius:999px;border:1px solid var(--line-strong);background:var(--surface);color:var(--ink)}

/* Panel de control */
.tabs{position:sticky;top:var(--ptop-h,60px);z-index:15;display:flex;gap:6px;overflow-x:auto;padding:8px 12px;background:var(--surface);border-bottom:1px solid var(--line)}
.tabs button{flex:none;min-height:40px;padding:0 14px;border-radius:999px;border:1.5px solid var(--line-strong);background:var(--bg);font:800 .9rem var(--font);color:var(--brand-dark);cursor:pointer}
.tabs button[aria-selected=true]{background:var(--brand-dark);color:var(--bg);border-color:var(--brand-dark)}
.ctl{display:grid;gap:16px}
.ctl .tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ctl input,.ctl select,.ctl textarea{font:600 .95rem var(--font);padding:9px 10px;border:1.5px solid var(--line-strong);border-radius:10px;background:var(--surface);color:var(--ink);max-width:100%}
.ctl textarea{width:100%;min-height:90px}
.ctl .grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px}
.kpi small{display:block;color:var(--muted);font-weight:700}.kpi b{font:600 1.35rem var(--display);color:var(--brand-dark)}
.kpi.bad b{color:#b00020}
.tbl{width:100%;border-collapse:collapse;font-size:.88rem;background:var(--surface);border-radius:12px;overflow:hidden}
.tbl th,.tbl td{padding:7px 9px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.tbl th{background:var(--warm);font-weight:800;white-space:nowrap}.tbl td.n,.tbl th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tblwrap{overflow-x:auto}
.bar2{height:10px;border-radius:999px;background:var(--accent);min-width:2px}
.hgrid{display:grid;grid-template-columns:60px repeat(4,minmax(54px,1fr));gap:4px;align-items:center}
.hgrid select{padding:6px 2px;text-align:center}
.hgrid .dn{font-weight:800}.hgrid .wk{color:var(--brand)}
.ctl .tools select,.ctl .tools input,.ctl .tools button{width:auto;flex:0 1 auto}
.ctl form.ord input,.ctl form.ord select{width:100%}
.ctl form .grid2 input,.ctl form .grid2 select{width:100%}
details.ord summary{cursor:pointer;line-height:1.6}
details.ord[open] summary{margin-bottom:8px}

/* Cabecera compacta: ícono + etiqueta en escritorio; en el celular una sola línea con solo íconos */
.ptop .btn svg{width:22px;height:22px;flex:none}
@media (max-width:640px){
  .ptop{flex-wrap:nowrap;padding:8px 12px;gap:8px}
  .ptop>div:first-child{min-width:0;flex:1}
  .ptop h1{font-size:1.05rem;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .ptop small{display:none}
  .ptop .acts{flex-wrap:nowrap;gap:6px;flex:none}
  .ptop .acts .btn{width:44px;min-width:44px;min-height:44px;padding:0;border-radius:12px}
  .ptop .acts .btn .lbl{display:none}
  .ptop .acts #turno{width:auto;padding:0 12px}@media (hover:hover) and (pointer:fine){.ptop .acts .btn:hover{transform:none;box-shadow:none}}
}

/* Auditoría 2026-10-26: toque sin retardo, barra de pestañas con objetivo de 44 px en el celular y botón flotante sobre el área segura de iOS */
button,select,input,textarea,summary{touch-action:manipulation}
.salir{bottom:calc(12px + env(safe-area-inset-bottom))}
@media (max-width:640px){.tabs button{min-height:44px}}

/* Formularios con etiqueta visible y error en línea */
.cmp{display:grid;gap:4px;align-content:start}
.cl{font-weight:800;font-size:.8rem;color:var(--brand-dark)}
.ca{color:var(--muted);font-size:.75rem;font-weight:600}
.ce{color:#b00020;font-weight:700;font-size:.8rem}
.cmp.mal input,.cmp.mal select{border-color:#b00020;box-shadow:0 0 0 3px rgba(176,0,32,.10)}
.ctl input,.ctl select{min-height:44px}
/* Tablas como tarjetas en el celular: cada fila es una tarjeta y cada celda lleva su encabezado */
@media (max-width:640px){
  table[data-cards]{display:block;background:none}
  table[data-cards] thead{display:none}
  table[data-cards] tbody{display:grid;gap:10px}
  table[data-cards] tr{display:grid;gap:2px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:10px 12px}
  table[data-cards] td{display:flex;justify-content:space-between;gap:12px;border:0;padding:3px 0;text-align:right;white-space:normal}
  table[data-cards] td::before{content:attr(data-l);font-weight:800;font-size:.78rem;color:var(--muted);text-align:left;flex:none}
  table[data-cards] td[colspan]::before,table[data-cards] td:not([data-l])::before{content:none}
  table[data-cards] td.sec{display:none}
  .tblwrap{overflow:visible}
}

/* Retoque de escritorio (v15) */
/* D1: los botones de cabecera son neutros; el naranja queda para la acción principal y para el estado «En turno» */
.ptop .acts .btn-call:not(#turno){background:transparent;color:var(--bg);border:1.5px solid rgba(251,245,233,.55)}@media (hover:hover) and (pointer:fine){.ptop .acts .btn-call:not(#turno):hover{background:rgba(251,245,233,.12)}}
.ptop .acts .btn[disabled]{opacity:.7}
/* D2: el panel de control y el restaurante aprovechan pantallas anchas; listas y formularios siguen angostos */
body[data-ancho=amplio] .pwrap{width:min(1500px,100% - 32px)}
.ctl article.ord,.ctl form.ord{max-width:900px}
.tbl.corta{max-width:720px}
/* D3: tablero en dos columnas (atención | en curso) con franja de cifras */
.tab2,.tab3{display:grid;gap:22px;align-items:start}
.kpis{display:flex;flex-wrap:wrap;gap:10px}
.kpi{flex:1 1 160px}
@media (min-width:1100px){.tab2{grid-template-columns:1fr 1fr}.tab3{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* D4: tablero de tres columnas para la tablet de la cocina, con letra y botones más grandes */
@media (min-width:1100px){.tab3 .ord{font-size:1.05rem}.tab3 .ord li{font-size:1.1rem}.tab3 .pbtn{min-height:56px}}
/* D5/D6: reportes en dos columnas y barra de filtros del registro */
.rejilla{display:grid;gap:16px;grid-template-columns:1fr}
@media (min-width:1100px){.rejilla{grid-template-columns:1fr 1fr}}
.barra{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.barra .per{display:contents}
.barra [data-q]{flex:1 1 220px;min-width:0}
.barra [data-csv]{margin-left:auto}
.ctl .barra select,.ctl .barra input,.ctl .barra button{width:auto;flex:0 1 auto}
.ctl .barra [data-q]{flex:1 1 220px}

/* Auditoría completa: casillas de tamaño normal, horario compacto */
.ctl input[type=checkbox],.ctl input[type=radio]{min-height:0;width:22px;height:22px;accent-color:var(--brand-dark);flex:none}
.ctl label:has(>input[type=checkbox]){display:inline-flex;align-items:center;gap:8px;font-weight:700}
.hgrid{max-width:620px}
.hgrid select{min-height:38px;padding:4px 2px}

#app{display:grid;gap:22px}
.ptop .acts [hidden]{display:none}

/* Navegación en dos niveles: cinco secciones y, debajo, las pestañas de la sección elegida */
.navs{position:sticky;top:var(--ptop-h,60px);z-index:15;background:var(--surface);border-bottom:1px solid var(--line)}
.navs .tabs{position:static;border-bottom:0}
.tabs button{display:inline-flex;align-items:center;justify-content:center}
.tabs .cuenta{margin-left:6px;background:#b00020;color:#fff;border-radius:999px;min-width:20px;height:20px;padding:0 6px;display:inline-grid;place-items:center;font:800 .75rem var(--font)}
.subtabs{display:flex;gap:6px;overflow-x:auto;padding:0 12px 8px}
.subtabs button{flex:none;min-height:36px;padding:0 14px;border-radius:10px;border:0;background:transparent;font:800 .85rem var(--font);color:var(--muted);cursor:pointer;touch-action:manipulation}@media (hover:hover) and (pointer:fine){.subtabs button:hover{background:var(--warm)}}
.subtabs button[aria-selected=true]{background:var(--warm);color:var(--brand-dark);box-shadow:inset 0 -3px 0 var(--accent)}
@media (max-width:640px){
  .navs .tabs button{flex:1 1 0;padding:0 4px;font-size:.8rem}
  .navs .tabs{gap:4px;padding:8px}
  .subtabs button{min-height:44px}
}

/* Usuarios (estilo Panel de Ventas) y Horario en matriz */
.badge{display:inline-block;border-radius:999px;padding:2px 10px;font-size:.78rem;font-weight:800;background:var(--warm);color:var(--brand-dark)}
.badge.ok{background:#e1f4e6;color:#157a3c}.badge.mal{background:#fde8e8;color:#b00020}
.sec .sub{font:600 .9rem var(--font);color:var(--muted)}
.tbl.usr{table-layout:fixed;width:100%}
.tbl.usr th:nth-child(1){width:19%}.tbl.usr th:nth-child(2){width:11%}.tbl.usr th:nth-child(3){width:11%}.tbl.usr th:nth-child(4){width:12%}.tbl.usr th:nth-child(5){width:13%}
.tbl.usr .acc{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.tbl.usr .acc .pbtn{min-height:40px;padding:0 12px;font-size:.85rem}
.tbl.usr td{vertical-align:middle}
details.sec>summary{cursor:pointer;margin-bottom:8px}
.hzwrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
table.hz{border-collapse:separate;border-spacing:0;font-size:.85rem}
table.hz th,table.hz td{border-bottom:1px solid var(--line);padding:0;text-align:center;min-width:34px;height:42px}
table.hz thead th{background:var(--warm)}
table.hz th.nom{position:sticky;left:0;z-index:2;background:var(--surface);text-align:left;min-width:150px;padding:0 10px;white-space:nowrap;border-right:1px solid var(--line)}
table.hz thead th.nom{background:var(--warm)}
.hd2 span{display:block;font-weight:800;line-height:1.1}.hd2 small{display:block;color:var(--muted);font-weight:700;font-size:.65rem}
table.hz .fin{background:rgba(242,106,28,.08)}
table.hz .hoy{background:rgba(19,36,73,.10)}
button.dia{width:100%;height:100%;min-height:42px;border:0;background:transparent;cursor:pointer;font:800 1rem var(--font);color:var(--bg)}@media (hover:hover) and (pointer:fine){button.dia:hover:not(.on){background:var(--warm)}}
button.dia.on{background:var(--brand-dark)}
table.hz td.tot,table.hz th.tot{position:sticky;right:0;background:var(--surface);min-width:56px;font-weight:800;border-left:1px solid var(--line)}
table.hz thead th.tot{background:var(--warm)}

/* Menú de la cuenta en la cabecera */
.avatar-wrap{position:relative}
.avatar{width:44px;height:44px;border-radius:50%;border:1.5px solid rgba(251,245,233,.7);background:transparent;color:var(--bg);font:800 .85rem var(--font);cursor:pointer;touch-action:manipulation}
.avatar[aria-expanded=true]{background:rgba(251,245,233,.14)}@media (hover:hover) and (pointer:fine){.avatar:hover{background:rgba(251,245,233,.14)}}
.menu-usuario{position:absolute;right:0;top:calc(100% + 8px);min-width:230px;background:var(--surface);color:var(--ink);border-radius:14px;box-shadow:0 12px 40px rgba(19,36,73,.3);padding:8px;z-index:70;display:grid;gap:2px}
.menu-usuario[hidden]{display:none}
.mu-nom{padding:8px 10px 10px;border-bottom:1px solid var(--line);margin-bottom:4px;display:grid}
.mu-nom small{color:var(--muted);font-weight:700}
.menu-usuario button{min-height:44px;text-align:left;padding:0 10px;border:0;border-radius:10px;background:transparent;font:700 .95rem var(--font);color:var(--ink);cursor:pointer}
#mx-alerta{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--st-mal-bg);color:var(--st-mal-fg);font-weight:800;padding:10px 16px;border-bottom:3px solid var(--st-mal-fg)}
#mx-alerta[hidden]{display:none}
#locs .row2{margin:8px 0;align-items:center}
#mx-alerta .btn{min-height:44px}
@keyframes mx-alarma{50%{background:var(--accent)}}
body.alarma .ptop{animation:mx-alarma 1s step-end infinite}
@media (prefers-reduced-motion:reduce){body.alarma .ptop{animation:none;box-shadow:inset 0 -6px 0 var(--accent)}}@media (hover:hover) and (pointer:fine){.menu-usuario button:hover,.menu-usuario .mu-ayuda:hover{background:var(--warm)}}
.menu-usuario .mu-ayuda{display:flex;align-items:center;min-height:44px;padding:0 10px;border-radius:10px;font:700 .95rem var(--font);color:var(--ink);text-decoration:none}
.mu-ver{display:block;color:var(--muted);font-size:.8rem;padding:6px 10px 2px}
/* en celular la cuenta vive en el menú del círculo: la sección Ajustes del repartidor solo se ve con la barra lateral */
@media (max-width:899px){#sec-ajustes{display:none}}
@media (max-width:640px){.ptop .acts .avatar{width:44px}}

/* Tablero en dos mitades: izquierda acciones y pendientes, derecha chips de datos y tiquetes */
.tablero .kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
@media (min-width:1100px){.tablero .kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
.tablero .col{display:flex;flex-direction:column;gap:14px;min-width:0}

/* Filas de productos con columnas de ancho fijo: todo cae en el mismo lugar en todas las categorías */
.fp{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.6fr) 292px;gap:6px 12px;align-items:center;padding:8px 6px;border-bottom:1px solid var(--line)}
.fp.p4{grid-template-columns:minmax(0,1.4fr) 120px 170px 300px}
.fp.cab{font:800 .85rem var(--font);color:var(--muted);border-bottom:2px solid var(--line-strong);padding-block:4px}
.fp .acc{display:flex;flex-wrap:wrap;gap:6px}
.fp .pbtn{min-height:40px;padding:0 10px;font-size:.95rem}
.cat-cab{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin:18px 0 4px}
.cat-cab h3{margin:0}.cat-cab .acc{display:flex;flex-wrap:wrap;gap:6px}.cat-cab .pbtn{min-height:40px;padding:0 12px}
@media (max-width:760px){.fp,.fp.p4{grid-template-columns:1fr}.fp.cab{display:none}}
details.sec>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;min-height:48px}
details.sec>summary::-webkit-details-marker{display:none}
details.sec>summary h2{margin:0}
details.sec>summary::after{content:'▾';margin-left:auto;font-size:1.2rem;transition:transform .15s}
details.sec[open]>summary::after{transform:rotate(180deg)}

.mes-nav{display:inline-flex;align-items:center;gap:6px}
.mes-nav output{min-width:11.5rem;text-align:center;font:800 1.1rem var(--font)}.mes-nav output::first-letter{text-transform:uppercase}
.mes-nav .pbtn{min-width:48px;padding:0 12px}.mes-nav .pbtn:disabled{opacity:.35;cursor:default}
.donde{margin:0 0 8px;font:800 1.3rem var(--font)}

.foto-dlg{border:0;border-radius:16px;padding:12px;max-width:94vw;background:var(--surface)}
.foto-dlg::backdrop{background:rgba(19,36,73,.6)}
.foto-dlg img{display:block;max-width:100%;max-height:78vh;margin:0 auto 10px;border-radius:10px}
.sin-foto{color:#b00020;font-weight:800}

/* Nómina: boleta por empleado en tres columnas y acciones en la tabla */
.bols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:10px}
.bol{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.bol h3{margin:0 0 8px;font:800 1rem var(--font);background:var(--warm);border-radius:8px;padding:6px 10px}
.bl{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:5px 0;border-bottom:1px dashed var(--line)}
.bl input{width:9rem;min-height:40px;text-align:right;border:1.5px solid var(--line-strong);border-radius:8px;padding:0 8px;font:inherit}
.bl.tot{border-bottom:0;margin-top:6px;background:var(--warm);border-radius:8px;padding:8px 10px;font-weight:800}
.enlace{background:none;border:0;padding:0;font:inherit;font-weight:800;color:var(--brand-dark);text-decoration:underline;cursor:pointer}
.pct input{width:6rem;min-height:40px;text-align:right;border:1.5px solid var(--line-strong);border-radius:8px;padding:0 8px;font:inherit}
.seg{display:inline-flex;gap:6px;flex-wrap:wrap}
@media (max-width:900px){.bols{grid-template-columns:1fr}}

/* Horario: feriados marcados arriba de cada día */
.hz .fer-row th{padding:2px 0;background:transparent;font-weight:400}
.hz button.fer{width:100%;min-height:34px;border:1.5px solid var(--line-strong);border-radius:8px;background:var(--surface);color:var(--brand-dark);font:inherit;cursor:pointer}
.hz button.fer[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--brand-dark)}      /* texto oscuro: el blanco sobre el naranja no llega al contraste mínimo */
.hz th.feriado,.hz td.feriado{background:#ffe9d6}
.hz th.hd2 small{font-size:.68rem}

/* v33 · accesibilidad y reflow */
.tools{flex-wrap:wrap}.tools.rango{max-width:100%}.mes-nav output{min-width:0;flex:1 1 auto}
@media (max-width:420px){.tools.rango .seg{width:100%}.tools.rango .seg .pbtn{flex:1 1 auto;padding:0 10px}.mes-nav{width:100%}.mes-nav output{min-width:0}}
.cat-h{font:800 1.1rem var(--font);color:var(--brand-dark);margin:14px 0 6px;text-align:left}.cat-h::after{display:none}
@media (pointer:coarse),(max-width:640px){                    /* 44 px solo en pantallas táctiles; en escritorio quedan compactos */
  .tabs button,.fp .pbtn,.cat-cab .pbtn,.tbl.usr .acc .pbtn,.pbtn{min-height:44px}
  table.hz th,table.hz td{height:44px;min-width:44px}.hz button.dia,.hz button.fer{min-height:44px;min-width:44px}
  .ord .pbtn,.ord button{min-height:44px}
}

/* v33 · chips: estado con color por fase (siempre con texto y símbolo), datos neutros, edad */
:root{--st-esp-bg:#fff0c2;--st-esp-fg:#5e4200;--st-ace-bg:#dbe9ff;--st-ace-fg:#0f3a73;--st-pre-bg:#d6dcf0;--st-pre-fg:#132449;--st-cam-bg:#dcf3e2;--st-cam-fg:#0f5a2a;--st-fin-bg:#e6e8ec;--st-fin-fg:#3d4455;--st-mal-bg:#fde8e8;--st-mal-fg:#9b1c1c;--dato-bg:#eef0f4;--dato-fg:#2c3447}
.chip{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:2px 10px;font-size:.8rem;font-weight:800;line-height:1.4;background:var(--dato-bg);color:var(--dato-fg);max-width:100%}
.chip.st-esp{background:var(--st-esp-bg);color:var(--st-esp-fg)}.chip.st-ace{background:var(--st-ace-bg);color:var(--st-ace-fg)}.chip.st-pre{background:var(--st-pre-bg);color:var(--st-pre-fg)}
.chip.st-cam{background:var(--st-cam-bg);color:var(--st-cam-fg)}.chip.st-fin{background:var(--st-fin-bg);color:var(--st-fin-fg)}.chip.st-mal{background:var(--st-mal-bg);color:var(--st-mal-fg)}
.chip.edad{background:transparent;color:var(--muted);border:1px solid var(--line-strong)}.ord.late .chip.edad{background:var(--st-mal-bg);color:var(--st-mal-fg);border-color:transparent}
.ord .hd{align-items:center;gap:8px;flex-wrap:wrap}.ord .hd .chips{display:inline-flex;flex-wrap:wrap;gap:6px}
.row2 .chip{margin:0}

.ptop .ptt{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.ptop .ptt small[data-modo]{display:inline-block;opacity:1;background:rgba(251,245,233,.16);color:var(--bg);border-radius:999px;padding:2px 10px;font-size:.78rem;font-weight:800}
@media (max-width:640px){.ptop .ptt small[data-modo]{display:none}}
.ayuda{margin:0 0 10px;font-size:.88rem}.ayuda summary{cursor:pointer;font-weight:800;color:var(--brand-dark);min-height:44px;display:flex;align-items:center}.ayuda p{margin:0 0 8px;color:var(--muted);line-height:1.45}
.demo-banner .cerrar{width:44px;height:44px;margin:-10px -12px -10px 0}

/* v33.1 · tablero por urgencia */
.grupo-t{font:800 .8rem var(--font);letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin:6px 0 -4px;border-bottom:2px solid var(--line);padding-bottom:4px}
.grupo-t::after{display:none}
#p-tablero>.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));margin-bottom:16px}
#hoy-det>summary{cursor:pointer;min-height:44px;display:flex;align-items:center}
@media (min-width:1100px){#p-tablero>.kpis{grid-template-columns:repeat(6,minmax(0,1fr))}.tab2.tablero{grid-template-columns:1.5fr 1fr}}

/* v34.1 · chip de feriado (naranja oscuro con texto blanco al marcarlo: 5,2 : 1), campos alineados, selector de archivo propio */
.hz button.fer{border-radius:999px;font-size:.68rem;font-weight:800;padding:0;min-width:0;width:calc(100% - 4px);margin:0 2px}
.hz button.fer[aria-pressed=true]{background:#c2410c;border-color:#c2410c;color:#fff}
.hz button.fer{white-space:nowrap}.hz button.fer[aria-pressed=true]::before{content:'✓'}
.grid2 .cl{min-height:3.2em;display:flex;align-items:flex-end}
input[type=file]{font:inherit;color:var(--muted);max-width:100%}
input[type=file]::file-selector-button{margin-right:10px;min-height:40px;padding:0 16px;border:0;border-radius:10px;background:var(--brand-dark);color:var(--bg);font:800 .9rem var(--font);cursor:pointer}@media (hover:hover) and (pointer:fine){input[type=file]:hover::file-selector-button{background:#1d3566}}
.ctl input[type=file]{padding:6px 8px;display:flex;align-items:center}
input[type=file]{font-size:.78rem;overflow:hidden}input[type=file]::file-selector-button{padding:0 12px;margin-right:8px;font-size:.85rem}

/* v39 · menú lateral (≥ 900 px) y pantallas nuevas del restaurante */
.rail{display:none}
@media (min-width:900px){
  body.con-rail{padding-left:92px}
  body.con-rail .tabs#tabs{display:none}
  .rail{display:flex;flex-direction:column;align-items:center;gap:6px;position:fixed;left:0;top:0;bottom:0;width:92px;padding:12px 6px;background:var(--brand-dark);z-index:40;overflow-y:auto}
  .rail-logo{border-radius:50%;margin:2px 0 10px}
  .rail-b{width:100%;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;border:0;border-radius:14px;background:transparent;color:rgba(251,245,233,.78);font:700 .7rem/1.15 var(--font);cursor:pointer;min-height:64px;text-align:center}
  .rail-b svg{width:26px;height:26px}@media (hover:hover) and (pointer:fine){.rail-b:hover{background:rgba(251,245,233,.1);color:var(--bg)}}
  .rail-b.on{background:var(--accent);color:var(--brand-dark)}
  .rail-b{position:relative}
  .rail-b[aria-expanded]::after{content:'';position:absolute;top:9px;right:7px;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);opacity:.7;transition:transform .24s var(--ease-out)}
  .rail-b[aria-expanded=true]::after{transform:rotate(-135deg) translate(-1px,-1px)}
  .rail-b:focus-visible{outline:3px solid var(--bg);outline-offset:-3px}
  .rail-pie{margin-top:auto;color:rgba(251,245,233,.85);font:700 .68rem/1.25 var(--font);text-align:center;padding:6px 2px;word-break:break-word}
  .rail-pie b{display:block;color:var(--bg)}
}
.estado-neg{display:inline-flex;align-items:center;gap:8px}
.estado-neg i{width:10px;height:10px;border-radius:50%;background:#2fbf71;display:inline-block}.estado-neg.cerrado i{background:#e5484d}
.tab4{display:grid;gap:22px;align-items:start}
@media (min-width:700px){.tab4{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1100px){.tab4{grid-template-columns:repeat(4,minmax(0,1fr))}.tab4 .ord{font-size:1.02rem}.tab4 .pbtn{min-height:56px}}
.chips-f{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px}.chips-f button{min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--line-strong);background:var(--surface);font:800 .9rem var(--font);color:var(--brand-dark);cursor:pointer}.chips-f button[aria-pressed=true]{background:var(--brand-dark);color:var(--bg);border-color:var(--brand-dark)}
.prod-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid var(--line)}.prod-row .pn{display:grid;gap:2px;min-width:0}.prod-row small{color:var(--muted)}
.prod-row select{min-height:44px;border-radius:999px;border:1.5px solid var(--line-strong);background:var(--surface);font:800 .9rem var(--font);color:var(--brand-dark);padding:0 14px}.prod-row select.ag{background:var(--st-mal-bg);color:var(--st-mal-fg);border-color:transparent}.prod-row select.pa{background:var(--st-esp-bg);color:var(--st-esp-fg);border-color:transparent}
.cfg-lista{display:grid;background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;max-width:760px}
.cfg-fila{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left;font:inherit;color:inherit;cursor:pointer;min-height:64px;text-decoration:none}.cfg-fila:last-child{border-bottom:0}@media (hover:hover) and (pointer:fine){.cfg-fila:hover{background:var(--warm)}}
.cfg-fila span:first-child{display:grid;gap:2px}.cfg-fila small{color:var(--muted)}.cfg-fila .ch{font-size:1.4rem;color:var(--muted)}
.cfg-salir{margin-top:14px;min-height:48px;padding:0 6px;border:0;background:transparent;color:#b00020;font:800 1rem var(--font);cursor:pointer}
.cfg-ver{color:var(--muted);font-size:.85rem;margin-top:18px}

.sec{scroll-margin-top:84px}
.ptop .acts #estado{width:auto;padding:0 12px}.ptop .acts #estado .lbl{display:inline}
@media (max-width:640px){.ptop .acts #estado .lbl{max-width:7.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/* v40 · barra más angosta, pie con Avisos y persona, subsecciones en lista, cabecera con el título de la sección */
.ptit{display:none}
@media (min-width:900px){
  body.con-rail{padding-left:76px}
  .rail{width:76px;padding:10px 4px;gap:4px}
  .rail-logo{width:40px;height:40px;margin:2px 0 8px}
  .rail-items{display:flex;flex-direction:column;gap:3px;width:100%}
  .rail-b{min-height:58px;padding:8px 2px;font-size:.66rem;gap:3px}.rail-b svg{width:24px;height:24px}
  .rail-b span{display:block;max-width:100%;overflow-wrap:anywhere}
  .rail-subs{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;width:100%;transition:grid-template-rows .24s var(--ease-out),opacity .18s var(--ease-out),visibility 0s .24s}
  .rail-subs.abierto{grid-template-rows:1fr;opacity:1;visibility:visible;transition:grid-template-rows .24s var(--ease-out),opacity .18s var(--ease-out),visibility 0s}
  .rail-subs-in{overflow:hidden;min-height:0;display:flex;flex-direction:column;gap:2px;position:relative;margin:3px 0 8px;padding:3px;border-radius:12px;background:rgba(0,0,0,.22)}
  .rail-subs-in::before{content:'';position:absolute;left:1px;top:9px;bottom:9px;width:2px;border-radius:2px;background:rgba(251,245,233,.28);pointer-events:none}      /* línea guía de la jerarquía: no ocupa ancho ni tapa texto */
  .rail-s{width:100%;padding:8px 0;border:0;border-radius:8px;background:transparent;color:rgba(251,245,233,.8);font:700 .6rem/1.2 var(--font);letter-spacing:-.02em;overflow-wrap:break-word;text-align:center;cursor:pointer;min-height:44px}@media (hover:hover) and (pointer:fine){.rail-s:hover{background:rgba(251,245,233,.16)}}.rail-s.on{background:var(--bg);color:var(--brand-dark)}.rail-s:focus-visible{outline:3px solid var(--bg);outline-offset:-3px}
  .rail-foot{margin-top:auto;width:100%;display:flex;flex-direction:column;gap:6px;position:relative}
  .rail-foot [hidden]{display:none}
  .rail-dot{width:10px;height:10px;border-radius:50%;background:#e5a23c;display:block}.rail-b.on-av .rail-dot{background:#2fbf71}
  .rail-quien{position:relative}
  .rail-user{width:100%;display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 2px;border:0;border-radius:14px;background:transparent;color:var(--bg);cursor:pointer;font:700 .64rem/1.2 var(--font)}@media (hover:hover) and (pointer:fine){.rail-user:hover:not(:disabled){background:rgba(251,245,233,.1)}}.rail-user:disabled{cursor:default}
  .rail-ini{width:38px;height:38px;border-radius:50%;border:2px solid rgba(251,245,233,.7);display:grid;place-items:center;font:800 .85rem var(--font)}
  .rail-nom{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-align:center;max-width:100%;overflow-wrap:anywhere}
  .rail-pop{position:fixed;left:84px;bottom:12px;min-width:220px;background:var(--surface);color:var(--ink);border-radius:14px;box-shadow:0 12px 40px rgba(19,36,73,.35);padding:8px;z-index:60}
  .rail-pop[hidden]{display:none}.rail-pop .mu-nom{padding:8px 10px;border-bottom:1px solid var(--line);margin-bottom:4px;display:grid;gap:2px}.rail-pop .mu-nom small{color:var(--muted)}
  .rail-pop button{display:block;width:100%;text-align:left;border:0;background:transparent;font:800 .95rem var(--font);color:var(--brand-dark);padding:12px 10px;border-radius:10px;cursor:pointer;min-height:44px}@media (hover:hover) and (pointer:fine){.rail-pop button:hover{background:var(--warm)}}
  /* cabecera: título de la sección y solo las acciones de la pantalla */
  body.con-rail .ptop h1,body.con-rail .ptop small:not([data-modo]){display:none}
  body.con-rail .ptit{display:block;margin:0;font:700 1.35rem var(--display);color:var(--bg)}
  body.con-rail .ptop .ptt,body.con-rail .ptop>div:first-child{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
  body.con-rail .ptop{min-height:64px}
  body.con-rail .ptop .acts #push,body.con-rail .ptop .acts .avatar-wrap{display:none}
}
.prod-row .pn{flex:1;min-width:0}.prod-row select{flex:none;width:230px;max-width:46%}
@media (max-width:560px){.prod-row select{width:170px}}
@media (min-width:900px){body.con-rail .subtabs#subtabs{display:none}}   /* las subsecciones viven en la barra lateral: se ahorra la segunda fila de botones */

/* ===== Pulido (v50): tarjetas con relieve suave, filas de ajustes y menús con movimiento. Borrar este bloque lo deja como v49. ===== */
.ord .hd .chips{margin:0;justify-content:flex-start;gap:6px}      /* .chips de la web pública traía 1.4 rem de margen: separaba el título de sus etiquetas */
.ord{border-color:rgba(19,36,73,.08);box-shadow:0 1px 2px rgba(19,36,73,.05),0 10px 22px -14px rgba(19,36,73,.18)}
.ord.late{border-color:#b00020}
.tbl,.cfg-lista{box-shadow:0 1px 2px rgba(19,36,73,.05),0 10px 22px -16px rgba(19,36,73,.16)}
.count,.sec .sub{font-variant-numeric:tabular-nums}
.cfg-fila .ch{transition:transform .2s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.cfg-fila{transition:background-color .15s ease}.cfg-fila:hover{background:var(--warm)}.cfg-fila:hover .ch{transform:translateX(3px)}}
details.sec>summary::after{transition:transform .22s var(--ease-out)}
.rail-pop:not([hidden]){animation:mx-pop .16s var(--ease-out);transform-origin:bottom left}
.menu-usuario:not([hidden]){animation:mx-pop .16s var(--ease-out);transform-origin:top right}
@keyframes mx-pop{from{opacity:0;transform:scale(.96)}}
@media (prefers-reduced-motion:reduce){.rail-subs,.rail-b::after{transition-duration:.01ms !important}.rail-pop,.menu-usuario{animation:none !important}}
.pbtn:disabled{opacity:.45;cursor:not-allowed}      /* un botón deshabilitado se ve apagado (antes se veía igual que uno activo) */

/* ===== v52: aviso de versión nueva (autoactualización, comun.js) ===== */
.mx-nueva{position:fixed;left:50%;translate:-50% 0;bottom:calc(16px + env(safe-area-inset-bottom));z-index:70;display:flex;align-items:center;gap:12px;max-width:calc(100% - 24px);padding:8px 8px 8px 16px;border-radius:14px;background:var(--brand-dark);color:var(--bg);font:700 .95rem var(--font);box-shadow:0 10px 28px rgba(19,36,73,.32);animation:mx-pop .18s var(--ease-out);transform-origin:bottom center}
.mx-nueva .pbtn{min-height:40px;padding:0 14px}

/* v55 · horario en celular: columna de nombre y total más angostas (caben más días) y barras sin fijar con el teclado abierto */
@media (max-width:640px){
  table.hz th.nom{min-width:88px;max-width:88px;overflow:hidden;text-overflow:ellipsis;padding:0 8px;font-size:.82rem}
  table.hz td.tot,table.hz th.tot{min-width:44px;padding:0 4px;font-size:.82rem;position:static}
  table.hz th,table.hz td{min-width:40px}.hz button.dia,.hz button.fer{min-width:40px}
  .hzwrap{margin:0 -4px}
}
.kb .ptop,.kb .tabs,.kb .navs{position:static}.kb #mx-alerta{display:none}
#mx-nueva{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 16px;background:#e8f2ff;color:#0f3a73;border-bottom:1px solid #b9d3f5;font-weight:700}#mx-nueva span{flex:1 1 200px}