/* Tío Bot */
.tb-lanzador{position:fixed;z-index:60;right:20px;bottom:20px;display:flex;align-items:center;gap:10px;background:none;border:0;padding:0;cursor:pointer}
.tb-lanzador .cara{width:68px;height:68px;border-radius:50%;border:3px solid var(--copa);overflow:hidden;box-shadow:4px 4px 0 var(--copa);background:var(--chicle);transition:transform .2s cubic-bezier(.2,1.6,.4,1);position:relative}
.tb-lanzador .cara img{width:100%;height:100%;object-fit:cover}
.tb-lanzador:hover .cara{transform:rotate(-8deg) scale(1.05)}
.tb-lanzador .en-linea{position:absolute;right:2px;bottom:4px;width:16px;height:16px;border-radius:50%;background:var(--gomita);border:2.5px solid var(--copa)}
.tb-lanzador .globo{background:var(--blanco);border:2.5px solid var(--copa);border-radius:18px 18px 4px 18px;padding:9px 14px;font:800 14px var(--display);color:var(--copa);box-shadow:3px 3px 0 var(--copa);white-space:nowrap;animation:tb-rebote .5s cubic-bezier(.2,1.6,.4,1)}
.tb-lanzador .globo[hidden]{display:none}
@keyframes tb-rebote{from{transform:scale(.6);opacity:0}}
body[data-pagina="pedidos"] .tb-lanzador{bottom:20px}
@media (max-width:1100px){ body[data-pagina="pedidos"] .tb-lanzador{bottom:92px} body[data-pagina="pedidos"] .tb-lanzador .globo{display:none} }
@media (max-width:860px){
  .tb-lanzador{display:none!important}
  body[data-pagina="pedidos"] .tb-lanzador{bottom:calc(158px + env(safe-area-inset-bottom))}
}

.tb{padding:0;position:fixed;z-index:80;right:20px;bottom:20px;width:min(400px,calc(100vw - 24px));height:min(640px,calc(100dvh - 40px));background:var(--papel);border:3px solid var(--copa);border-radius:28px;box-shadow:10px 10px 0 var(--copa);display:flex;flex-direction:column;overflow:hidden;transform-origin:bottom right;animation:tb-abre .28s cubic-bezier(.2,1.2,.4,1)}
.tb[hidden]{display:none}
@keyframes tb-abre{from{transform:scale(.7) translateY(20px);opacity:0}}
@media (max-width:560px){
  .tb{inset:0;width:auto;height:auto;border-radius:0;border-width:0;box-shadow:none}
  /* El panel ocupa toda la pantalla: respetar muesca y barra de gestos del teléfono */
  .tb-cab{padding-top:calc(12px + env(safe-area-inset-top))}
  .tb-aviso{padding-bottom:calc(10px + env(safe-area-inset-bottom))}
  .tb-opciones{max-height:40%}
  /* Con el chat a pantalla completa, la página de atrás se queda quieta */
  body.tb-abierto{overflow:hidden}
  body.tb-abierto .tabbar{display:none}
}

.tb-cab{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--copa);color:var(--papel)}
.tb-cab img{width:46px;height:46px;border-radius:50%;border:2.5px solid var(--chicle);object-fit:cover}
.tb-cab strong{display:block;font-size:18px;line-height:1.1}
.tb-cab small{display:flex;align-items:center;gap:6px;color:#C8C9DA;font-size:13px}
.tb-cab small::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gomita)}
.tb-cab .acc{margin-left:auto;display:flex;gap:6px}
.tb-cab button{width:40px;height:40px;border-radius:50%;border:2px solid #3A3C58;background:transparent;color:var(--papel);font-size:18px;cursor:pointer;display:grid;place-items:center}
.tb-cab button:hover{background:#2A2C45}

.tb-msgs{flex:1;overflow-y:auto;padding:16px 14px 8px;display:flex;flex-direction:column;gap:8px;background:
  radial-gradient(circle at 20px 20px, rgba(255,79,154,.07) 3px, transparent 4px) 0 0/40px 40px, var(--papel);scroll-behavior:smooth}
.tb-fila{display:flex;gap:8px;align-items:flex-end;max-width:92%}
.tb-fila.yo{align-self:flex-end;flex-direction:row-reverse}
.tb-fila .av{width:28px;height:28px;border-radius:50%;border:2px solid var(--copa);object-fit:cover;flex-shrink:0}
.tb-fila .av.oculto{visibility:hidden}
.tb-burbuja{padding:10px 14px;border-radius:18px;border:2px solid var(--copa);font-size:15.5px;line-height:1.4;background:var(--blanco);border-bottom-left-radius:6px;animation:tb-entra .25s ease}
.yo .tb-burbuja{background:var(--chicle);border-bottom-left-radius:18px;border-bottom-right-radius:6px}
@keyframes tb-entra{from{transform:translateY(8px);opacity:0}}
.tb-escribiendo{display:inline-flex;gap:4px;padding:14px 16px}
.tb-escribiendo i{width:7px;height:7px;border-radius:50%;background:var(--copa);animation:tb-punto 1s infinite ease-in-out}
.tb-escribiendo i:nth-child(2){animation-delay:.15s}.tb-escribiendo i:nth-child(3){animation-delay:.3s}
@keyframes tb-punto{0%,80%,100%{transform:translateY(0);opacity:.35}40%{transform:translateY(-5px);opacity:1}}
.tb-accion{margin:2px 0 4px 36px;align-self:flex-start}
.tb-accion .btn{padding:11px 16px;font-size:14.5px;box-shadow:3px 3px 0 var(--copa)}

.tb-opciones{display:flex;flex-wrap:wrap;gap:8px;padding:10px 14px;border-top:2px solid var(--copa);background:var(--blanco);max-height:34%;overflow-y:auto}
.tb-opciones:empty{display:none}
.tb-opciones button{border:2px solid var(--copa);background:var(--menta);border-radius:999px;padding:8px 13px;font:800 14px var(--display);cursor:pointer;transition:transform .12s}
.tb-opciones button:hover{transform:translateY(-2px);background:var(--rotulo)}
.tb-opciones button.fuerte{background:var(--rotulo)}

.tb-escribir{display:flex;gap:8px;padding:10px 12px;border-top:2px solid var(--copa);background:var(--blanco)}
.tb-escribir input{flex:1;border:2px solid var(--copa);border-radius:999px;padding:11px 16px;font-size:16px;background:var(--papel);min-width:0}
.tb-escribir input:focus{outline:none;box-shadow:3px 3px 0 var(--turquesa)}
.tb-escribir button{width:48px;height:48px;border-radius:50%;border:2.5px solid var(--copa);background:var(--rotulo);cursor:pointer;display:grid;place-items:center;flex-shrink:0}
.tb-escribir button svg{width:22px}
.tb-aviso{margin:0;padding:6px 14px 10px;font-size:11.5px;color:var(--tinta-suave);background:var(--blanco);text-align:center}