/**
 * Paginación Laravel con vista vendor.pagination.bootstrap-5-es (global).
 * Texto “Mostrando … resultados” + números en una fila con scroll horizontal en móvil.
 */

.app-laravel-pagination-nav {
  width: 100%;
}

.app-laravel-pagination-scroll {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0.35rem;
  scrollbar-width: thin;
}

.app-laravel-pagination-scroll ul.pagination {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  width: max-content;
  max-width: none;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 576px) {
  .app-laravel-pagination-nav .d-flex.flex-column {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 1rem !important;
  }

  .app-laravel-pagination-nav .text-center.text-sm-start {
    flex: 0 0 auto;
  }

  .app-laravel-pagination-scroll {
    flex: 0 1 auto;
    min-width: 0;
  }

  .app-laravel-pagination-scroll ul.pagination {
    margin-left: auto;
    margin-right: 0;
  }
}

/* Pie de tarjeta con paginación: separación suave (todas las vistas que usan card-footer) */
.card-footer .app-laravel-pagination-nav {
  padding-top: 0.25rem;
}

/* Paginación simple (Anterior / Siguiente) */
.app-simple-pagination ul.pagination {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  width: max-content;
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}