/* Shared, reusable components and responsive helpers */

/* Ensure Select2 takes full width of its parent */
.select2-container { width: 100% !important; }
.btn {
    font-size: 0.9em;
}
/* Responsive stacked tables for mobile (< md) using data-label attributes */
@media (max-width: 767.98px) {
  table.responsive-stack thead { display: none; }
  table.responsive-stack tbody tr { display: block; margin-bottom: .75rem; border: 1px solid var(--bs-border-color); border-radius: .5rem; }
  table.responsive-stack tbody tr td[data-label] { display: grid; grid-template-columns: 9rem auto; gap: .5rem; align-items: start; word-break: break-word; }
  table.responsive-stack tbody tr td::before { content: attr(data-label); font-weight: 600; color: var(--bs-secondary-color); }
  table.responsive-stack tbody tr td[data-label=""]::before { content: ""; }
  table.responsive-stack tbody tr td .btn { width: 100%; } /* stack actions */
  table.responsive-stack tbody tr td .btn + .btn { margin-top: .5rem; }
  /* Ensure student name and badges lay out nicely on mobile */
  table.responsive-stack tbody tr td .style-badge { display: inline-block; }
  table.responsive-stack tbody tr td .student-name { display: block; width: 100%; }
}

/* Offcanvas filters spacing for mobile: add separation between fields and the Filtrar button */
.offcanvas-filters .filter-row { padding-bottom: .25rem; }
.offcanvas-filters .filter-row > [class^="col-"],
.offcanvas-filters .filter-row > [class*=" col-"] { margin-bottom: .75rem; }
.offcanvas-filters #filter_button { margin-top: .25rem; }

/* Pagination responsiveness: wrap and center on tablet and mobile to avoid horizontal scroll */
@media (max-width: 991.98px) {
  /* Make pagination container flex and centered */
  #pagination { display: flex; justify-content: center; }
  /* Wrap and center the UL; ensure it can take full width and wrap to next line(s) */
  #pagination .pagination { flex-wrap: wrap; justify-content: left; width: 100%; }
  #pagination .page-item { margin: 2px 1px; }
  /* Neutralize Bootstrap row gutters on pagination row to avoid horizontal scroll when UL is a direct child */
  #pagination.row { --bs-gutter-x: 0; }
}

/* Tablet (sm/md) filter-row enhancements */
@media (min-width: 576px) and (max-width: 991.98px) {
  .filter-row #filter_button { min-width: 140px; }
}
