/* Hoshi · servicio en mesa: pedido a cocina, estado, camarero, cuenta, reseña y pantalla de cocina */
.mesa-chip{display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 11px;border-radius:99px;background:var(--tinta);color:var(--papel);font-size:12.5px;white-space:nowrap}
.mesa-chip b{font-weight:600;color:#F3B8A8}
@media (max-width:430px){.marca__s{display:none}.cab__der{gap:6px}.idioma button{padding:5px 8px}}
.buscador{display:flex;align-items:center;gap:10px;margin-top:18px;padding:0 14px;height:48px;border-radius:14px;background:var(--blanco);border:1px solid var(--linea);box-shadow:var(--sombra);color:var(--tenue);max-width:420px;cursor:text}
.buscador input{flex:1;min-width:0;border:0;outline:0;background:none;font:inherit;font-size:15px;color:var(--tinta)}
.buscador:focus-within{border-color:var(--tinta)}
.sin-res{padding:40px 0;text-align:center;color:var(--tenue)}
[hidden]{display:none!important}

/* Lo más pedido */
.top{max-width:1080px;margin:8px auto 0;padding:0 0 6px}
.top__t{font:22px/1.2 Fraunces,serif;letter-spacing:-.01em;padding:0 16px;margin-bottom:12px}
.top__fila{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 16px 14px;scrollbar-width:none}
.top__fila::-webkit-scrollbar{display:none}
.top__p{position:relative;flex:none;width:200px;scroll-snap-align:start;border-radius:20px;overflow:hidden;background:var(--gris-foto);box-shadow:var(--sombra);text-align:left;transition:transform .3s var(--curva)}
.top__p:active{transform:scale(.97)}
.top__p img{width:100%;aspect-ratio:1/1;object-fit:cover}
.top__n{position:absolute;left:12px;top:6px;z-index:1;font:46px/1 Fraunces,serif;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.35)}
.top__info{position:absolute;left:8px;right:8px;bottom:8px;display:flex;flex-direction:column;padding:8px 10px;border-radius:12px;background:rgba(251,250,247,.86);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.top__info b{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top__info span{display:flex;align-items:center;gap:3px;font-size:12.5px;color:var(--suave)}

/* Agotado y «suele pedirse con» */
.agotado{display:inline-flex;align-items:center;height:30px;padding:0 10px;border-radius:99px;background:var(--papel-2);color:var(--tenue);font-size:12px;font-weight:600;white-space:nowrap}
.agotado--g{height:44px;padding:0 18px;font-size:14px}
.es-agotado .plato__foto img,.es-agotado .fila__n{filter:grayscale(1);opacity:.6}
.con{display:grid;gap:8px}
.con__p{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:14px;background:var(--blanco);border:1px solid var(--linea)}
.con__p span:first-child{display:flex;flex-direction:column}
.con__p b{font-weight:600;font-size:14px}
.con__p small{color:var(--suave);font-size:12.5px}

/* Muelle inferior: estado del pedido + barra */
.muelle{position:fixed;z-index:25;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(calc(100% - 32px),440px);display:flex;flex-direction:column;gap:8px;pointer-events:none}
.muelle>*{pointer-events:auto}
.muelle .barra-sel{position:static;left:auto;bottom:auto;width:100%;transform:none;display:none}
.muelle .barra-sel.ver{display:flex;animation:subeB .45s cubic-bezier(.34,1.3,.5,1)}
.muelle .barra-sel.late{animation:late2 .45s var(--curva)}
@keyframes subeB{from{transform:translateY(120%);opacity:0}}
@keyframes late2{40%{transform:scale(1.04)}}
.estado-pill{display:none;align-items:center;gap:10px;padding:11px 16px;border-radius:16px;background:rgba(251,250,247,.94);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--linea);box-shadow:0 10px 26px -12px rgba(0,0,0,.35);font-size:13.5px;color:var(--suave)}
.estado-pill.ver{display:flex;animation:subeB .45s var(--curva)}
.estado-pill span{flex:1;text-align:left}
.estado-pill b{color:var(--tinta);font-weight:600}
.pulso{flex:none;width:10px;height:10px;border-radius:50%;background:#E0A030;animation:pulsa 1.6s infinite}
.pulso.k1{background:var(--bermellon)}
.pulso.k2,.pulso.k3{background:var(--verde)}
@keyframes pulsa{0%{box-shadow:0 0 0 0 rgba(200,64,42,.45)}70%,100%{box-shadow:0 0 0 9px rgba(200,64,42,0)}}
#toasts{position:fixed;z-index:60;top:76px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;width:min(calc(100% - 32px),420px);pointer-events:none}
.toast{display:flex;align-items:center;gap:10px;padding:13px 16px;border-radius:14px;background:var(--tinta);color:var(--papel);box-shadow:0 14px 30px -10px rgba(0,0,0,.45);font-weight:500;animation:abre .35s var(--curva);transition:opacity .4s,transform .4s}
.toast svg{color:#F3B8A8;flex:none}
.toast.fuera{opacity:0;transform:translateY(-8px)}
.vuela{position:fixed;z-index:70;border-radius:14px;object-fit:cover;pointer-events:none;box-shadow:0 10px 30px rgba(0,0,0,.3)}

/* Pedido */
.sel li{flex-direction:column;align-items:stretch;gap:8px}
.sel__l{display:flex;align-items:center;justify-content:space-between;gap:12px}
.sel__f{display:flex;flex-direction:column}
.sel__nota{width:100%;height:38px;padding:0 12px;border-radius:10px;border:1px dashed rgba(27,24,21,.22);background:transparent;font:inherit;font-size:13.5px;color:var(--tinta)}
.sel__nota:focus{outline:0;border-style:solid;border-color:var(--tinta);background:var(--blanco)}
.sel__nota-t{color:var(--suave);font-size:15px;margin:6px 0 18px}
.fila-op{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--linea);font-weight:500}
.paso--n{background:var(--tinta)}
.nota-g{width:100%;margin-top:14px;padding:12px;border-radius:12px;border:1px solid var(--linea);background:var(--blanco);font:inherit;font-size:14px;resize:vertical;color:var(--tinta)}
.nota-g:focus{outline:0;border-color:var(--tinta)}
.btn{background:var(--blanco);border:1px solid var(--linea)}
.btn--pri{background:var(--tinta);border-color:var(--tinta)}
.btn--txt{background:none;border:0}
.btn--ancho{width:100%;margin-top:14px}
.btn--s{padding:8px 12px;font-size:13px;border-radius:10px}

/* Impresora y ticket térmico */
.hoja--impresion .hoja__txt{padding-top:26px}
.impresora{position:relative;margin:0 auto;width:min(310px,88%);padding-top:34px}
.impresora::before{content:"";position:absolute;left:-14px;right:-14px;top:0;height:46px;border-radius:16px 16px 10px 10px;background:linear-gradient(180deg,#3B3733,#1F1C19);box-shadow:0 10px 20px -8px rgba(0,0,0,.5);z-index:2}
.impresora__luz{position:absolute;z-index:3;top:16px;right:8px;width:8px;height:8px;border-radius:50%;background:#55D27A;box-shadow:0 0 8px #55D27A}
.imprimiendo .impresora__luz{animation:parpadea .25s steps(2) infinite}
@keyframes parpadea{50%{opacity:.25}}
.impresora__boca{position:absolute;z-index:3;top:36px;left:6px;right:6px;height:4px;border-radius:2px;background:#0d0c0b}
.papel{position:relative;z-index:1;overflow:hidden;padding-bottom:8px}
.imprimiendo .papel .tk{animation:imprime 2.4s steps(26,end) both}
@keyframes imprime{from{transform:translateY(-100%)}}
.impr-t{text-align:center;color:var(--suave);margin:16px 0 6px;font-weight:500}
.impr-ok{text-align:center;padding:18px 0 4px}
.impr-ok__i{width:48px;height:48px;border-radius:50%;margin:0 auto 10px;display:grid;place-items:center;background:var(--verde);color:#fff;animation:abre .45s cubic-bezier(.34,1.5,.6,1)}
.impr-ok .hoja__h{margin:0 0 6px;padding:0}
.impr-ok p{color:var(--suave);margin:0 0 4px}
.tk{position:relative;background:#FFFEFA;color:#1d1b19;font:13px/1.45 "Courier New",ui-monospace,monospace;padding:16px 16px 22px;box-shadow:0 8px 22px -12px rgba(0,0,0,.35);margin:6px 0 10px}
.tk__c{text-align:center;font-weight:700;letter-spacing:.08em}
.tk__g{text-align:center;font-size:28px;font-weight:700;margin:4px 0}
.tk__r{display:flex;justify-content:space-between;font-size:12px}
.tk__s{border-top:1.5px dashed #9b958c;margin:9px 0}
.tk__l{display:grid;grid-template-columns:30px 1fr auto;gap:6px;align-items:start}
.tk__l em{display:block;font-style:normal;font-size:12px;color:#5a5650}
.tk__nota{font-weight:700}
.tk__pie{text-align:center;font-size:11.5px;letter-spacing:.04em}
.tk__t{font-weight:700;font-size:15px;margin-top:4px}
.tk__d{font-size:12px;color:#5a5650}
.tk__corte{position:absolute;left:0;right:0;bottom:-6px;height:12px;background:radial-gradient(circle at 6px 12px,transparent 6px,#FFFEFA 6.5px) 0 0/12px 12px repeat-x}

/* Estado en directo */
.pasos-e{position:relative;display:grid;grid-template-columns:repeat(4,1fr);margin:6px 0 10px}
.pasos-e__pista{position:absolute;left:12.5%;right:12.5%;top:12px;height:2px;background:var(--linea);z-index:0}
.pasos-e__pista i{display:block;height:100%;background:var(--verde);transition:width .8s var(--curva)}
.pe{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:12px;color:var(--tenue)}
.pe b{font-weight:600}
.pe__n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--papel);border:2px solid #D3CEC5;color:#fff}
.pe.ok .pe__n{background:var(--verde);border-color:var(--verde)}
.pe.ok,.pe.actual{color:var(--tinta)}
.pe.actual .pe__n{border-color:var(--bermellon);animation:pulsa 1.6s infinite}
.pe.actual:nth-child(4) .pe__n{background:var(--verde);border-color:var(--verde);animation:none}
.estado-t{text-align:center;color:var(--suave);margin:4px 0 14px;font-size:14.5px}
.acciones{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
.acciones .btn--pri{grid-column:1/-1}
.enlace{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:14px;padding:10px;color:var(--bermellon);font-weight:600;font-size:14px}

/* Camarero */
.opciones{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.opcion{padding:18px 14px;border-radius:16px;background:var(--blanco);border:1px solid var(--linea);font-weight:500;text-align:left;min-height:76px;transition:border-color .2s,transform .2s}
.opcion:active{transform:scale(.97);border-color:var(--tinta)}

/* Cuenta, pago y reseña */
.segmentos{display:flex;padding:3px;border-radius:12px;background:var(--papel-2)}
.segmentos button{padding:7px 12px;border-radius:9px;font-weight:600;font-size:13.5px;color:var(--suave)}
.segmentos button.on{background:var(--blanco);color:var(--tinta);box-shadow:0 1px 3px rgba(0,0,0,.1)}
.por-persona{margin-top:12px;padding:12px 14px;border-radius:14px;background:var(--papel-2);color:var(--suave)}
.por-persona b{font:24px/1 Fraunces,serif;font-weight:400;color:var(--tinta);margin-right:4px}
.pagos{display:grid;gap:8px;margin-top:16px}
.procesando{display:flex;flex-direction:column;align-items:center;gap:14px;padding:50px 0;color:var(--suave)}
.spinner{width:40px;height:40px;border-radius:50%;border:3px solid var(--papel-2);border-top-color:var(--tinta);animation:gira .8s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
.estrellas{display:flex;justify-content:center;gap:6px;margin:4px 0 8px}
.estrellas button{color:#CFC8BC;transition:transform .2s,color .2s}
.estrellas button.on{color:#E0A030}
.estrellas button.on svg{fill:currentColor}
.estrellas button:active{transform:scale(1.2)}
.resena-t{text-align:center;color:var(--suave);margin:6px 0}
.demo-n{display:block;text-align:center;color:var(--tenue);margin-top:6px}

/* Pantalla de cocina */
#capa .hoja--kds{background:#141210;color:#EDE8DF}
.hoja--kds .hoja__x{background:#2A2622;border-color:#3A3530;color:#EDE8DF}
.kds{padding:18px 18px 10px}
.kds__cab{display:flex;justify-content:space-between;align-items:center;padding-right:52px;font:600 13px/1 Schibsted,sans-serif;letter-spacing:.08em;color:#F3B8A8}
.kds__cab span{display:flex;align-items:center;gap:8px}
.kds__t{font-size:13.5px;color:rgba(237,232,223,.66);margin:12px 0 16px}
#kds{display:grid;gap:14px}
@media (min-width:760px){#kds{grid-template-columns:1fr 1fr}}
.kds__p{padding:12px;border-radius:16px;background:#1F1C19;border:1px solid #2F2A25}
.kds__e{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:13px}
.kds__e b{padding:4px 10px;border-radius:99px;background:#E0A030;color:#1d1b19}
.kds__p.k1 .kds__e b{background:var(--bermellon-2);color:#fff}
.kds__p.k2 .kds__e b,.kds__p.k3 .kds__e b{background:#5FA65A;color:#fff}
.kds__e span{font-variant-numeric:tabular-nums;color:rgba(237,232,223,.7)}
.kds__p .btn{background:#2A2622;border-color:#3A3530;color:#EDE8DF;margin-top:4px}
.kds__vacio{padding:30px 0;text-align:center;color:rgba(237,232,223,.55)}
.pie__cocina{display:flex;align-items:center;gap:10px;width:100%;max-width:420px;margin-bottom:26px;padding:14px 16px;border-radius:16px;background:rgba(200,64,42,.14);border:1px solid rgba(224,86,62,.4);color:#F7CFC4;font-weight:600;text-align:left}

/* Impresión real de la comanda en una impresora térmica de 80 mm */
#zona-impresion{display:none}
@media print{
  @page{size:80mm auto;margin:3mm}
  body>*:not(#zona-impresion){display:none!important}
  #zona-impresion{display:block}
  #zona-impresion .tk{box-shadow:none;padding:0;font-size:12px}
  #zona-impresion .tk__corte{display:none}
}