/* ==========================================================================
   HIDRO KANK — tienda.css
   ========================================================================== */

.tienda-cabecera {
  background: var(--crema-alt);
  padding-block: var(--sp-xl) var(--sp-lg);
}
.tienda-cabecera h1 { font-size: var(--fs-2xl); }
.tienda-cabecera p { color: var(--carbon-suave); margin-top: var(--sp-2xs); }

.tienda-barra {
  position: sticky;
  top: var(--header-h);
  z-index: 50;
  background: var(--crema);
  border-bottom: 1px solid var(--borde-suave);
  padding-block: var(--sp-sm);
}
.tienda-barra__fila {
  display: flex;
  align-items: center;
  gap: var(--sp-sm);
  flex-wrap: wrap;
}
.tienda-buscador {
  flex: 1;
  min-width: 220px;
  position: relative;
}
.tienda-buscador input {
  width: 100%;
  padding: 0.75rem 1rem 0.75rem 2.6rem;
  border-radius: var(--radio-pill);
  border: 1.5px solid var(--borde-suave);
  background: var(--blanco);
}
.tienda-buscador input:focus { outline: none; border-color: var(--verde-hoja); box-shadow: 0 0 0 4px rgba(111,190,68,0.16); }
.tienda-buscador svg { position: absolute; left: 0.9rem; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: var(--carbon-suave); }

.tienda-resultado-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-block: var(--sp-md);
  font-size: var(--fs-sm);
  color: var(--carbon-suave);
}

.tienda-vacio {
  text-align: center;
  padding: var(--sp-2xl) var(--sp-md);
  color: var(--carbon-suave);
}
.tienda-vacio svg { width: 72px; height: 72px; margin-inline: auto var(--sp-sm); opacity: 0.4; }