/**
 * SPVSMA — DataTables + Bootstrap 3
 * Cargar al final de los CSS de la plantilla.
 *
 * Problema raíz: cuentascontables.css estiliza .paginate_button con borde/padding.
 * En DataTables+Bootstrap 3 esa clase va en el <li>, no en el <a>, así que cada <li>
 * muestra un “marco” aunque el <a> esté vacío → botones fantasma.
 *
 * Aquí anulamos borde/padding en el <li> y los aplicamos solo al <a>.
 */

.dataTables_wrapper .dataTables_paginate ul.pagination {
  margin: 2px 0;
}

/* Quitar el “marco” del li (origen de los fantasmas) */
.dataTables_wrapper .dataTables_paginate ul.pagination > li.paginate_button {
  padding: 0 !important;
  margin: 0 2px 0 0 !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Una sola barra / un solo ul */
.dataTables_wrapper .dataTables_paginate ~ .dataTables_paginate {
  display: none !important;
}

.dataTables_paginate > ul.pagination ~ ul.pagination {
  display: none !important;
}

/* El botón visible es el enlace (como Bootstrap 3 pagination) */
.dataTables_wrapper .dataTables_paginate ul.pagination > li.paginate_button > a {
  display: inline-block;
  padding: 0.375rem 0.75rem;
  border: 1px solid #dee2e6;
  border-radius: 0.25rem;
  color: #007bff;
  text-decoration: none;
  background-color: #fff;
  float: none;
  margin: 0;
  line-height: 1.42857143;
}

.dataTables_wrapper .dataTables_paginate ul.pagination > li.paginate_button > a:hover,
.dataTables_wrapper .dataTables_paginate ul.pagination > li.paginate_button > a:focus {
  color: #0056b3;
  background-color: #e9ecef;
  border-color: #adb5bd;
}

.dataTables_wrapper .dataTables_paginate ul.pagination > li.paginate_button.active > a,
.dataTables_wrapper .dataTables_paginate ul.pagination > li.paginate_button.active > a:hover,
.dataTables_wrapper .dataTables_paginate ul.pagination > li.paginate_button.active > a:focus {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
  cursor: default;
}

.dataTables_wrapper .dataTables_paginate ul.pagination > li.paginate_button.disabled > a,
.dataTables_wrapper .dataTables_paginate ul.pagination > li.paginate_button.disabled > a:hover {
  color: #777;
  background-color: #fff;
  border-color: #ddd;
  cursor: not-allowed;
}

/* Ocultar anclas vacías y su li (refuerzo; el JS también los borra) */
.dataTables_wrapper .dataTables_paginate ul.pagination > li > a:empty {
  display: none !important;
}

.dataTables_wrapper .dataTables_paginate ul.pagination > li:has(> a:empty) {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: none !important;
}

/* Cualquier hijo directo del paginador que no sea el ul (restos de DOM) */
.dataTables_wrapper .dataTables_paginate > *:not(ul.pagination) {
  display: none !important;
}