/* Dark-mode corrections for classes that are light by definition.
 *
 * Bootstrap 5.3 adapts body, cards, forms and tables to data-bs-theme on
 * its own; these utilities do not, and the templates use them for
 * "subtle grey" (table-light headers, bg-light badges/boxes). In dark
 * mode they become the tertiary background instead of a white block.
 */
[data-bs-theme="dark"] .table-light {
  --bs-table-color: var(--bs-body-color);
  --bs-table-bg: var(--bs-tertiary-bg);
  --bs-table-border-color: var(--bs-border-color);
  --bs-table-striped-bg: var(--bs-secondary-bg);
  --bs-table-hover-bg: var(--bs-secondary-bg);
  color: var(--bs-body-color);
  border-color: var(--bs-border-color);
}
[data-bs-theme="dark"] .bg-light,
[data-bs-theme="dark"] .bg-white {
  background-color: var(--bs-tertiary-bg) !important;
}
/* "bg-light text-dark" badges/boxes: dark text on the now-dark box. */
[data-bs-theme="dark"] .bg-light.text-dark,
[data-bs-theme="dark"] .bg-white.text-dark,
[data-bs-theme="dark"] .bg-light .text-dark {
  color: var(--bs-body-color) !important;
}
/* select2's bootstrap-5 theme hard-codes white. */
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection,
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-dropdown,
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-search__field {
  background-color: var(--bs-body-bg);
  color: var(--bs-body-color);
  border-color: var(--bs-border-color);
}
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection__rendered {
  color: var(--bs-body-color);
}
[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-results__option--highlighted {
  background-color: var(--bs-secondary-bg);
  color: var(--bs-body-color);
}