/* Complementos que no van en style.css principal (para mantenerlo cacheable aparte) */

.checkout-steps{
  display:flex; align-items:center; gap:.6rem;
  justify-content:center; padding: 1rem 0 1.5rem;
  font-family: var(--font-heading); font-size:.85rem; color: var(--color-text-muted);
}
.checkout-steps .step.is-active{ color: var(--color-accent); font-weight:700; }
.checkout-steps .step-sep{ opacity:.5; }

/* Toast / feedback al añadir al carrito vía AJAX */
.tienda-toast{
  position: fixed; bottom: 20px; right: 20px;
  background: var(--color-primary); color:#fff;
  padding: .8rem 1.2rem; border-radius: var(--radius-sm);
  box-shadow: var(--shadow-lg); z-index: 9999;
  opacity:0; transform: translateY(12px);
  transition: opacity 250ms ease, transform 250ms ease;
}
.tienda-toast.is-visible{ opacity:1; transform: translateY(0); }

/* Skeleton loading para el grid mientras llegan resultados AJAX */
.grid-loading .product-card{ opacity:.4; pointer-events:none; }

/* Buscador visible en header */
.tienda-search-form{ position:relative; max-width: 420px; width:100%; }
.tienda-search-form input[type="search"]{
  width:100%; padding: .7rem 2.6rem .7rem 1rem;
  border: 1px solid var(--color-border); border-radius: 999px;
  font-family: var(--font-body);
}
.tienda-search-form button{
  position:absolute; right:.4rem; top:50%; transform: translateY(-50%);
  background:none; border:none; cursor:pointer; color: var(--color-text-muted);
}
