/* Contenedor general del paginador */
.pagination {
  display: flex;
  justify-content: center; /* Centra el paginador */
  margin: 3px 0;
}

/* Estilo para los elementos de la lista */
.pagination .page-item {
  margin: 0 3px; /* Espaciado entre botones */
}

.pagination .page-link {
  color: #007bff; /* Color del texto */
  background-color: #fff; /* Fondo blanco */
  border: 1px solid #ddd; /* Bordes grises claros */
  padding: 4px 8px; /* Espaciado interno */
  border-radius: 4px; /* Bordes redondeados */
  transition: all 0.3s ease; /* Transición suave */
  text-decoration: none;
  font-size: 17px; /* Reduce el tamaño de la fuente */
  
}

/* Botón activo */
.pagination .page-item.active .page-link {
  color: #fff; /* Texto blanco */
  background-color: #007bff; /* Fondo azul */
  border-color: #007bff; /* Borde azul */
}

/* Botón desactivado */
.pagination .page-item.disabled .page-link {
  color: #6c757d; /* Texto gris */
  background-color: #f8f9fa; /* Fondo gris claro */
  border-color: #ddd; /* Borde gris claro */
}

/* Hover y foco */
.pagination .page-link:hover,
.pagination .page-link:focus {
  color: #0056b3; /* Texto azul más oscuro */
  background-color: #e9ecef; /* Fondo gris claro */
  border-color: #ddd; /* Borde gris claro */
}

/* Botones "Anterior" y "Siguiente" */
.pagination .page-item:first-child .page-link {
  border-top-left-radius: 10px; /* Bordes más redondeados */
  border-bottom-left-radius: 10px;
}

.pagination .page-item:last-child .page-link {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}