.c121{padding:16px 16px calc(96px + var(--pisoseg));max-width:640px;margin:auto}
.c121 h3{font-size:20px;margin:24px 0 12px}.c121 p{color:var(--gray)}
.c121-card{border:1px solid var(--line);border-radius:20px;background:var(--surface);padding:16px;margin:12px 0}
.c121-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;overflow-wrap:anywhere}
.c121-row+ .c121-row{border-top:1px solid var(--line)}
.c121-row small{display:block;color:var(--gray);margin-top:4px}.c121 button,.c121 a{font:inherit}
.c121-link{border:0;background:var(--soft);color:var(--ink);border-radius:24px;padding:12px 16px;min-height:44px;text-decoration:none;cursor:pointer}
.c121-wide{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--ink);padding:16px 0;min-height:48px;cursor:pointer}
.c121-fixed{position:fixed;bottom:0;left:0;right:0;padding:16px 16px calc(16px + var(--pisoseg));background:var(--surface);z-index:110;text-align:center}
.c121-fixed button{max-width:608px;width:100%}.c121-featured{display:flex;gap:12px;overflow:auto}.c121-featured button{min-width:160px;text-align:left}
.c121-map{position:relative;height:200px;border-radius:20px;overflow:hidden;background:var(--soft);border:1px solid var(--line)}
.c121-map iframe{border:0;width:100%;height:100%}.c121-bubble{position:absolute;left:16px;top:16px;background:var(--surface);color:var(--ink);padding:12px 16px;border-radius:16px;box-shadow:0 4px 16px #0002;z-index:2;pointer-events:none}
.c121-map-note{padding:80px 16px 16px;color:var(--gray);font-size:12px}.c121-total{font-weight:800;font-size:20px}
.c121-sheet{position:fixed;inset:0;z-index:100001;background:#0008;display:flex;align-items:flex-end;justify-content:center}.c121-sheet-card{width:100%;max-width:640px;max-height:90dvh;overflow:auto;background:var(--surface);color:var(--ink);border-radius:24px 24px 0 0;padding:16px 20px calc(20px + var(--pisoseg))}
.c121-grip{width:40px;height:4px;border-radius:4px;background:var(--line);margin:0 auto 16px}.c121-sheet iframe{width:100%;height:64dvh;border:0}.c121-sheet label{display:block;margin:12px 0 4px}.c121-sheet input{width:100%;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--soft);color:var(--ink);font:inherit}.c121-actions{display:flex;gap:12px;margin-top:20px}.c121-actions>*{flex:1}
.foto121{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:linear-gradient(160deg,var(--soft),var(--surface));color:var(--gray);text-align:center;overflow:hidden}
.foto121 img{width:48px;height:48px;object-fit:contain}.foto121 small{font-size:12px;line-height:1.5;padding:0 4px}.det-img.sin-foto.foto121{height:72px;flex-direction:row;gap:8px}.det-img.foto121 img{width:40px;height:40px}.det-img.foto121 small{font-size:12px}
.det-img.foto121 img{position:static;inset:auto}.c121-featured small{display:block;margin-top:4px;color:var(--gray)}
.c121-card.c121-row{padding:16px}
#v-direcciones121 .back,#v-pedido121 .back{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);cursor:pointer}
.mit-foto.foto121{height:128px;justify-content:flex-start;padding:8px 4px 36px}.mit-foto.foto121 img{width:40px;height:40px}
.tb-inner{gap:12px}.empty{padding-left:12px}.empty .e{margin-bottom:20px}
#ck-pago-fila{padding-top:12px}.ck-h,.ck-chips{margin-bottom:8px}
#v-detalle .det-body{padding-top:20px}#v-detalle .det-tit{gap:12px;margin-top:8px}#v-detalle .det-desc{margin-top:8px}#v-detalle .det-precio{margin-top:12px}#v-detalle .det-lbl{margin-bottom:8px}#v-detalle .det-body textarea{padding:12px 16px}#v-detalle .det-bar{padding-top:12px;gap:12px}#v-detalle .det-add{padding-left:16px}
#cal-ov .cal-card{padding:24px 20px calc(24px + var(--pisoseg))}#cal-ov .cal-lbl{margin-top:16px;margin-bottom:4px}#cal-ov .cal-txt{padding:12px;font-size:16px}#cal-ov .cal-acts{gap:12px;margin-top:20px}#cal-ov .cal-cancel,#cal-ov .cal-send{padding:12px}
#v-checkout .ck-h,#v-checkout .ck-chips{margin-bottom:8px!important}.empty{padding-left:12px!important}

/* ===== Botones redondos finos (22-oct-2026) · crítica de Gean: «súper bastos» =====
   Volver, siguiente (tiras), favorito, cerrar y «+» son una sola familia:
   círculo blanco de 36 px dibujado con ::before dentro de un botón de 44 px
   (el dedo sigue teniendo 44), sin borde duro, sombra difusa, trazo de 2 px.
   Solo presentación: ninguna función cambia. */
:root{--bf-d:36px;--bf-ring:0 0 0 1px rgba(26,26,29,.05);--bf-sombra:0 1px 2px rgba(26,26,29,.08),0 4px 14px rgba(26,26,29,.13)}
:where(.back,.fav-btn){position:relative}
.back,.rhead-back,.rhead-fav,.det-cerrar,.fav-btn,.tira-f{
  width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:0;border-radius:50%;
  background:transparent;box-shadow:none;color:var(--ink);
  -webkit-tap-highlight-color:transparent;transition:none}
.back::before,.rhead-back::before,.rhead-fav::before,.det-cerrar::before,.fav-btn::before,.tira-f::before{
  content:"";position:absolute;left:50%;top:50%;width:var(--bf-d);height:var(--bf-d);margin:calc(var(--bf-d) / -2) 0 0 calc(var(--bf-d) / -2);
  border-radius:50%;background:rgba(255,255,255,.96);box-shadow:var(--bf-ring),var(--bf-sombra);
  transition:transform .12s ease,background .15s ease,box-shadow .15s ease;pointer-events:none}
.back>*,.rhead-back>*,.rhead-fav>*,.det-cerrar>*,.fav-btn>*,.tira-f>*{position:relative}
.back svg,.rhead-back svg,.rhead-fav svg,.det-cerrar svg,.fav-btn svg,.tira-f svg,
.back [data-lucide],.rhead-back [data-lucide],.rhead-fav [data-lucide],.det-cerrar [data-lucide],.tira-f [data-lucide]{
  width:18px;height:18px;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fav-btn.fav-btn-lg::before{background:var(--soft);box-shadow:none}
.back{margin-left:-4px;flex:none}
.rhead-back{left:11px}.rhead-fav,.det-cerrar{right:11px}
.fav-btn-lg svg{width:19px;height:19px}
/* La esquina de la tarjeta compensa los 4 px de aire interior para que el círculo siga a 8 px del borde. */
.home-card .fav-btn{right:4px;top:4px}
/* Corazón: contorno hasta que se marca; el rojo solo en la acción. */
.fav-btn svg{stroke:var(--ink);fill:none;transition:transform .15s,fill .15s,stroke .15s}
.fav-btn.on svg,.rhead-fav.on svg{stroke:var(--r);fill:var(--r)}
.rhead-fav svg{fill:none}
.fav-btn:active svg{transform:none}
/* Estados: apretar = 0.94; foco de teclado = anillo claro de la marca. */
.back:active::before,.rhead-back:active::before,.rhead-fav:active::before,.det-cerrar:active::before,.fav-btn:active::before,.tira-f:active::before{transform:scale(.94)}
.back:active,.rhead-back:active,.rhead-fav:active,.det-cerrar:active,.fav-btn:active,.tira-f:active{transform:none}
.back:focus-visible,.rhead-back:focus-visible,.rhead-fav:focus-visible,.det-cerrar:focus-visible,.fav-btn:focus-visible,.tira-f:focus-visible{outline:0}
.back:focus-visible::before,.rhead-back:focus-visible::before,.rhead-fav:focus-visible::before,.det-cerrar:focus-visible::before,.fav-btn:focus-visible::before,.tira-f:focus-visible::before{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--r)}
/* Sobre la portada (un solo botón de cada) vidrio suave; con fallback sólido y sin blur en las tarjetas de la lista. */
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .rhead-back::before,.rhead-fav::before,.det-cerrar::before{background:rgba(255,255,255,.80);-webkit-backdrop-filter:blur(10px) saturate(1.4);backdrop-filter:blur(10px) saturate(1.4)}
}
@media (prefers-reduced-transparency:reduce){
  .rhead-back::before,.rhead-fav::before,.det-cerrar::before{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}
}
/* Siguiente / anterior de las tiras: misma pieza, un poco más sobria. */
.tira-f{margin-top:-22px}
.tira-f.izq{left:2px}.tira-f.der{right:2px}
/* «+» de la carta: misma sombra y mismo apretón. */
.mit-add .addb::before{box-shadow:var(--bf-ring),var(--bf-sombra)}
.mit-add .addb svg{stroke-width:2.2}
.mit-add .addb:active::before{transform:scale(.94)}
.mit-add .addb.on::before{box-shadow:0 1px 2px rgba(216,52,41,.2),0 4px 12px rgba(216,52,41,.3)}
/* QA161: enlaces legibles y accionables con dedo en registro y escritorio. */
.reg-legal a{display:inline-block;min-height:44px;padding-block:12px;box-sizing:border-box}
.dtb-logo{min-height:44px;display:inline-flex;align-items:center}
#pq-si,#pq-no{min-width:44px}
.fld{margin-bottom:16px}
.fld>label{margin-bottom:8px}
.fld input:not([type=checkbox]):not([type=radio]),.fld textarea{padding:16px;font-size:16px}
#btn-guardar-dir{padding-block:12px;gap:8px}
#ck-map-sat{padding:8px 12px;gap:8px}
#ck-legal{padding:12px;margin-bottom:12px;gap:12px}
#ck-legal a{display:inline-block;min-height:44px;padding-block:12px}
#ck-datos,#ck-factura{font-size:16px}
#ld-normal{padding-inline:24px}
.loading-dots,.loading-row{gap:8px}
/* QA161: el aviso no invade el carrito durante su transición de entrada. */
.toast{bottom:max(160px,calc(112px + var(--pisoseg)))!important}