/* Correcciones sobre el bundle original. No se recompila nada: esta hoja se
   carga después de la del build y solo sobreescribe lo necesario. */

/* ProductCatalog.jsx pinta un botón por página (línea ~790) y .pagination es
   un flex sin flex-wrap. Con 5 páginas cabía; con 36 se sale de la pantalla. */
.pagination {
  flex-wrap: wrap;
  row-gap: 0.5rem;
  max-width: 100%;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* En móvil, botones más compactos para que quepan más por fila. */
@media (max-width: 640px) {
  .pagination-page,
  .pagination-btn {
    min-width: 2.25rem;
    height: 2.25rem;
    padding: 0 0.6rem;
    font-size: 0.8125rem;
    border-radius: 0.5rem;
  }
  .pagination { gap: 0.35rem; }
}