/* MEATS V4 · tokens y piezas compartidas (cliente, pedido, admin, repartidor). Colores del logo y del flyer (11-10). */
:root{
  --ink:#140405;--brasa:#2a0a0d;--vino:#5c1424;--vino2:#7a1f2b;--naranja:#f26a1b;--naranja2:#ff8a3d;--crema:#f6ead8;--oro:#e7b24c;
  --verde:#35d07f;--ambar:#f5b83d;--rojo:#e8412b;--gris:#9a8b84;
  --linea:rgba(246,234,216,.14);--linea2:rgba(246,234,216,.26);--sombra:0 22px 60px rgba(0,0,0,.5);
  --r:18px;--fuente:"Barlow",system-ui,sans-serif;--cond:"Barlow Condensed","Arial Narrow",sans-serif;--marca:"Sedgwick Ave Display",cursive;
  --ease:cubic-bezier(.2,.8,.2,1);--rebote:cubic-bezier(.2,1.5,.4,1)
}
[hidden]{display:none!important}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{background:var(--ink)}
body{background:var(--ink);color:var(--crema);font-family:var(--fuente);min-height:100dvh;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
a{color:inherit}
:focus-visible{outline:2px solid var(--naranja2);outline-offset:2px}
.cond{font-family:var(--cond);font-weight:700;text-transform:uppercase;letter-spacing:.05em}

/* botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 18px;border-radius:14px;border:1.5px solid var(--linea2);
  font-weight:600;font-size:15px;text-decoration:none;transition:transform .15s var(--ease),background .2s,border-color .2s;white-space:nowrap}
.btn:active{transform:scale(.97)}
.btn.fuego{background:linear-gradient(180deg,var(--naranja2),var(--naranja));border-color:transparent;color:#1d0703;font-family:var(--cond);font-weight:700;
  font-size:19px;letter-spacing:.06em;text-transform:uppercase;box-shadow:0 10px 30px rgba(242,106,27,.35),inset 0 1px 0 rgba(255,255,255,.35)}
.btn.vino{background:var(--vino2);border-color:var(--vino2)}
.btn.verde{background:var(--verde);border-color:var(--verde);color:#062012;font-weight:700}
.btn.fantasma{border-style:dashed}
.btn[disabled]{opacity:.38;pointer-events:none;box-shadow:none}
.btn.ancho{width:100%}

/* campos */
.campo{display:grid;gap:6px;min-width:0}
.campo>span,.campo label{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;opacity:.72}
.campo input,.campo select,.campo textarea{min-height:50px;width:100%;border-radius:14px;border:1.5px solid var(--linea);background:rgba(246,234,216,.05);padding:12px 14px;font-size:16px}
.campo textarea{min-height:86px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{outline:none;border-color:var(--naranja)}
.campo select option{background:var(--ink)}
.fila2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:360px){.fila2{grid-template-columns:1fr}}

/* estado de pedido (pastillas) */
.pill{display:inline-flex;align-items:center;gap:6px;font-family:var(--cond);font-weight:700;font-size:13.5px;letter-spacing:.07em;text-transform:uppercase;
  padding:5px 11px;border-radius:999px;background:rgba(246,234,216,.1);white-space:nowrap}
.pill i{width:8px;height:8px;border-radius:50%;background:currentColor}
.pill.gris{color:#cbbdb5}.pill.ambar{color:var(--ambar);background:rgba(245,184,61,.14)}.pill.verde{color:var(--verde);background:rgba(53,208,127,.14)}
.pill.naranja{color:var(--naranja2);background:rgba(242,106,27,.16)}.pill.rojo{color:#ff8a78;background:rgba(232,65,43,.16)}
.pill.vivo i{animation:latido 1.4s ease-in-out infinite}
@keyframes latido{50%{transform:scale(1.6);opacity:.4}}

/* ========== LETRERO ABIERTO / CERRADO (neón) ========== */
.letrero{position:relative;display:inline-grid;justify-items:center;gap:2px;padding:12px 26px 10px;border-radius:20px;isolation:isolate;
  background:linear-gradient(180deg,rgba(20,4,5,.78),rgba(42,10,13,.72));backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1.5px solid rgba(255,138,61,.35);box-shadow:0 0 0 1px rgba(0,0,0,.3),0 14px 40px rgba(0,0,0,.45),inset 0 0 26px rgba(242,106,27,.12)}
.letrero::before,.letrero::after{content:"";position:absolute;top:-9px;width:2px;height:10px;background:linear-gradient(var(--gris),transparent)}
.letrero::before{left:26%}.letrero::after{right:26%}
.letrero .tubo{display:flex;align-items:center;gap:10px;font-family:var(--marca);font-size:clamp(30px,8.5vw,44px);line-height:1;letter-spacing:.02em;color:#fff4e6;
  text-shadow:0 0 4px #fff,0 0 10px var(--naranja2),0 0 22px var(--naranja),0 0 42px var(--naranja),0 0 70px rgba(242,106,27,.7);
  animation:enciende 2.4s steps(1) 1,zumbido 5s ease-in-out 2.4s infinite}
.letrero .llama{width:.85em;height:.85em;flex:none;filter:drop-shadow(0 0 8px var(--naranja)) drop-shadow(0 0 18px rgba(242,106,27,.8));animation:flama 1.1s ease-in-out infinite alternate}
.letrero .sub{font-family:var(--cond);font-weight:600;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:rgba(246,234,216,.82)}
.letrero .halo{position:absolute;inset:-18px;z-index:-1;border-radius:32px;background:radial-gradient(closest-side,rgba(242,106,27,.35),transparent);animation:respiraH 3.2s ease-in-out infinite}
@keyframes enciende{0%{opacity:.15}8%{opacity:1}12%{opacity:.2}18%{opacity:1}22%{opacity:.35}30%,100%{opacity:1}}
@keyframes zumbido{0%,100%{opacity:1}47%{opacity:1}48%{opacity:.82}49%{opacity:1}}
@keyframes flama{from{transform:scale(1) rotate(-4deg)}to{transform:scale(1.12,1.18) rotate(4deg)}}
@keyframes respiraH{50%{opacity:.55;transform:scale(1.06)}}
.letrero.cerrado{border-color:rgba(246,234,216,.16);box-shadow:0 14px 40px rgba(0,0,0,.45)}
.letrero.cerrado .tubo{color:rgba(246,234,216,.38);text-shadow:none;animation:none}
.letrero.cerrado .llama{filter:grayscale(1) opacity(.35);animation:none}
.letrero.cerrado .halo{display:none}
.letrero.cerrado .sub{color:rgba(246,234,216,.6)}

/* aviso flotante */
.toast{position:fixed;left:50%;bottom:calc(110px + env(safe-area-inset-bottom));transform:translate(-50%,20px);z-index:90;background:var(--crema);color:var(--ink);
  padding:12px 18px;border-radius:999px;font-weight:600;opacity:0;transition:.3s var(--ease);pointer-events:none;max-width:calc(100% - 32px);text-align:center;box-shadow:var(--sombra)}
.toast.ver{opacity:1;transform:translate(-50%,0)}

/* ========== FACTURA QUE SE IMPRIME ========== */
.impresora{position:relative;max-width:400px;margin:0 auto;padding-top:26px}
.impresora .boca{position:absolute;top:0;left:-8px;right:-8px;height:34px;z-index:3;border-radius:14px 14px 10px 10px;
  background:linear-gradient(180deg,#3a3236,#1c1719 60%,#0d0a0b);box-shadow:0 10px 24px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.12)}
.impresora .boca::after{content:"";position:absolute;left:14px;right:14px;bottom:6px;height:5px;border-radius:4px;background:#050304;box-shadow:inset 0 2px 3px #000}
.impresora .led{position:absolute;right:16px;top:9px;width:7px;height:7px;border-radius:50%;background:#3a2c22;z-index:4}
.impresora.imprimiendo .led{background:var(--naranja2);box-shadow:0 0 8px var(--naranja2);animation:latido .5s infinite}
.impresora.imprimiendo .boca{animation:vibra .09s linear infinite}
@keyframes vibra{50%{transform:translateY(.6px)}}
.impresora .ventana{position:relative;overflow:hidden;padding:0 6px 22px}
.ticket{position:relative;color:#2a1a14;padding:26px 20px 26px;font-family:"IBM Plex Mono","Courier New",monospace;font-size:13px;line-height:1.5;
  background:#fffaf1 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .25 0 0 0 0 .2 0 0 0 .045 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
  box-shadow:0 18px 40px rgba(0,0,0,.45),inset 0 -40px 40px -40px rgba(120,80,40,.18);transform-origin:top center}
.ticket::after{content:"";position:absolute;left:0;right:0;bottom:-12px;height:12px;
  background:linear-gradient(-45deg,transparent 8px,#fffaf1 0) 0 0/16px 12px repeat-x,linear-gradient(45deg,transparent 8px,#fffaf1 0) 0 0/16px 12px repeat-x;filter:drop-shadow(0 4px 3px rgba(0,0,0,.25))}
.ticket .brillo{position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%);background-size:250% 100%;background-position:120% 0;mix-blend-mode:soft-light}
.ticket.listo .brillo{animation:brilla 1.6s var(--ease) .2s 1}
@keyframes brilla{to{background-position:-60% 0}}
.ticket .t-logo{display:block;width:118px;margin:0 auto 6px;filter:sepia(.3) saturate(1.3)}
.ticket .t-c{text-align:center}
.ticket .t-neg{font-weight:700;font-size:14px;letter-spacing:.04em}
.ticket .t-sep{border:0;border-top:1.5px dashed rgba(42,26,20,.45);margin:10px 0}
.ticket .t-doc{display:flex;justify-content:space-between;gap:10px;font-weight:700;font-size:15px}
.ticket .t-l{display:flex;justify-content:space-between;gap:10px}
.ticket .t-l span:first-child{min-width:0;overflow-wrap:anywhere}
.ticket .t-l span:last-child{white-space:nowrap}
.ticket .t-it{padding:2px 0}
.ticket .t-it small{display:block;opacity:.7;font-size:12px}
.ticket .t-tot{display:flex;justify-content:space-between;font-weight:700;font-size:20px;margin-top:4px;letter-spacing:.02em}
.ticket .t-mini{font-size:11.5px;opacity:.78}
.ticket .t-qr{display:flex;justify-content:center;margin-top:10px}
.ticket .t-qr canvas,.ticket .t-qr img{width:96px!important;height:96px!important;image-rendering:pixelated}
.ticket .t-linea{opacity:.08;transition:opacity .25s ease,filter .25s ease;filter:blur(.6px)}
.ticket .t-linea.tinta{opacity:1;filter:none}
.sello{position:absolute;right:16px;bottom:200px;z-index:2;padding:6px 14px;border:3px solid #1f8f53;border-radius:10px;color:#1f8f53;font-family:var(--cond);font-weight:700;
  font-size:30px;letter-spacing:.1em;transform:rotate(-14deg) scale(2.4);opacity:0;mix-blend-mode:multiply;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cfilter id='g'%3E%3CfeTurbulence baseFrequency='.6' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -2.4 1.8'/%3E%3C/filter%3E%3Crect width='80' height='80' filter='url(%23g)'/%3E%3C/svg%3E");
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cfilter id='g'%3E%3CfeTurbulence baseFrequency='.6' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -2.4 1.8'/%3E%3C/filter%3E%3Crect width='80' height='80' filter='url(%23g)'/%3E%3C/svg%3E")}
.sello.pendiente{border-color:#b26a00;color:#b26a00}
.sello.ver{animation:sella .45s var(--rebote) forwards}
@keyframes sella{60%{opacity:.95;transform:rotate(-14deg) scale(.92)}to{opacity:.88;transform:rotate(-14deg) scale(1)}}

/* ========== MAPA ========== */
.mapa{position:relative;height:320px;border-radius:var(--r);overflow:hidden;border:1px solid var(--linea);background:#1b1416}
.mapa .leaflet-container{background:#1b1416;font-family:var(--fuente)}
.teselas-meats{filter:sepia(.18) saturate(.85) contrast(1.02)}
.pin-local b,.pin-cliente b{display:grid;place-items:center}
.leaflet-control-attribution{font-size:9px!important;background:rgba(20,4,5,.6)!important;color:#cbb!important}
.leaflet-control-attribution a{color:#e9c9a8!important}
.moto{position:relative;width:54px;height:54px}
.moto .onda{position:absolute;inset:0;border-radius:50%;background:rgba(242,106,27,.35);animation:onda 1.8s ease-out infinite}
.moto .onda:nth-child(2){animation-delay:.9s}
@keyframes onda{from{transform:scale(.4);opacity:.9}to{transform:scale(1.6);opacity:0}}
.moto .cuerpo{position:absolute;inset:6px;display:grid;place-items:center;transition:transform .9s var(--ease)}
.moto svg{width:42px;height:42px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.5))}
.pin-local,.pin-cliente{display:grid;place-items:center;width:44px;height:44px}
.pin-local span,.pin-cliente span{display:grid;place-items:center;width:36px;height:36px;border-radius:50% 50% 50% 4px;transform:rotate(-45deg);box-shadow:0 6px 14px rgba(0,0,0,.5)}
.pin-local span{background:var(--vino2);border:2px solid var(--naranja)}
.pin-cliente span{background:var(--crema);border:2px solid var(--ink)}
.pin-local b,.pin-cliente b{transform:rotate(45deg);font-size:17px}
.ruta-viva{stroke-dasharray:2 12;stroke-linecap:round;animation:hormiga 1s linear infinite}
@keyframes hormiga{to{stroke-dashoffset:-14}}
.eta{position:absolute;left:12px;right:12px;bottom:12px;z-index:500;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;
  background:rgba(20,4,5,.86);backdrop-filter:blur(10px);border:1px solid var(--linea)}
.eta b{font-family:var(--cond);font-size:26px;line-height:1;color:var(--naranja2)}
.eta span{font-size:13px;opacity:.8}

@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition:none!important}}
@media print{body{background:#fff!important}.no-print{display:none!important}.impresora .boca,.impresora .led{display:none}.ticket{box-shadow:none}}