/* ZAP Buscador v1.0 — la lista de resultados. Cada sitio la pinta con SUS colores definiendo estas variables
   (en :root y en su modo oscuro). Nada más se toca: el resto sale de acá.
     --zb-fondo     fondo de la lista            --zb-texto   nombre del producto
     --zb-suave     textos secundarios           --zb-acento  precio
     --zb-borde     borde y separador            --zb-hover   fila marcada / bajo el dedo
     --zb-foto      fondo detrás de la foto      --zb-radio   esquinas de la lista
     --zb-fuente    tipografía (hereda si no)    --zb-sombra  sombra de la lista */
.zb-lista {
  position: absolute; z-index: 1000; top: calc(100% + 6px); left: 0; right: 0; min-width: min(300px, calc(100vw - 32px));
  max-height: min(70vh, 520px, calc(var(--zb-alto-visible, 100vh) - 150px));
  overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  margin: 0; padding: 6px; list-style: none; text-align: left;
  font-family: var(--zb-fuente, inherit);
  background: var(--zb-fondo, #fff); color: var(--zb-texto, #111);
  border: 1px solid var(--zb-borde, rgba(0, 0, 0, .1)); border-radius: var(--zb-radio, 12px);
  box-shadow: var(--zb-sombra, 0 18px 40px rgba(0, 0, 0, .14));
}
.zb-lista[hidden] { display: none; }
.zb-lista li { margin: 0; padding: 0; list-style: none; }
.zb-op {
  display: flex; align-items: center; gap: 10px; padding: 7px 8px;
  border-radius: calc(var(--zb-radio, 12px) - 4px); color: var(--zb-texto, #111) !important; text-decoration: none !important;
  -webkit-tap-highlight-color: transparent;
}
.zb-op[aria-selected="true"], .zb-op:hover { background: var(--zb-hover, rgba(0, 0, 0, .05)); }
.zb-op img, .zb-sin-foto {
  width: 44px; height: 44px; flex: none; object-fit: contain; border-radius: 8px;
  background: var(--zb-foto, #fff);
}
.zb-op span { display: grid; min-width: 0; gap: 1px; }
.zb-op b {
  font-weight: 600; font-size: .85rem; line-height: 1.25; color: var(--zb-texto, #111);
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.zb-op small { font-size: .72rem; letter-spacing: .02em; text-transform: uppercase; color: var(--zb-suave, #666); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zb-op em { margin-left: auto; padding-left: 6px; font-style: normal; font-weight: 700; font-size: .82rem; white-space: nowrap; color: var(--zb-acento, currentColor); }
.zb-sep { padding: 10px 8px 4px; font-size: .68rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--zb-suave, #666); }
.zb-todo {
  display: block; margin-top: 4px; padding: 11px 8px; border-top: 1px solid var(--zb-borde, rgba(0, 0, 0, .1));
  font-weight: 600; font-size: .85rem; color: var(--zb-texto, #111) !important; text-decoration: none !important;
  border-radius: 0 0 calc(var(--zb-radio, 12px) - 4px) calc(var(--zb-radio, 12px) - 4px);
}
.zb-todo:hover, .zb-todo[aria-selected="true"] { background: var(--zb-hover, rgba(0, 0, 0, .05)); }
.zb-vacio { padding: 14px 10px; font-size: .85rem; line-height: 1.4; color: var(--zb-suave, #666); }

/* Teclado abierto en el celular (ZapBuscador.teclado()): la barra de navegación de abajo se va.
   Clases conocidas de las webs de ZAPSTRAL + [data-zb-barra] para cualquier otra. */
html[data-teclado] .barra-inferior,
html[data-teclado] .ama-barra,
html[data-teclado] [data-zb-barra] { transform: translateY(calc(100% + 28px)) !important; visibility: hidden !important; transition: none !important; }