/* Small overrides to make Tom Select visually match the Bootstrap theme used by the app.
   Keep this deliberately minimal; the project already includes tom-select.2.5.1.bootstrap5.
   These rules tweak badge appearance for selected items, dropdown item paddings and active
   states, and input/control sizing so tom-select blends with our theme.
*/

/* Use Bootstrap color variables so the item badges adapt to light/dark themes.
   tom-select's default compiled CSS hardcodes light-mode colors (e.g. #efefef) which
   become unreadable in dark mode. Use the theme variables so items remain visible
   when [data-bs-theme="dark"] or html.dark is active.
*/

.ts-dropdown .option,
.ts-dropdown .option.dropdown-item,
.ts-dropdown .optgroup-header,
.ts-dropdown .no-results,
.ts-dropdown .create {
  /* Ensure dropdown items inherit readable body color in both light/dark themes */
  color: var(--bs-body-color);
  background: transparent;
}

/* Navbar selection: constrain width and apply sm sizing */
.ts-wrapper.navbar-selection {
  width: auto;
  min-width: 20rem;
  max-width: 60rem;
}

/* Make it a little smaller — explicit height matches Bootstrap form-control exactly */
.ts-wrapper.form-select .ts-control.form-control {
  font-size: 0.90rem;
  height: calc(1.5rem + 0.75rem + 2px);
  box-sizing: border-box;
}

/* Multi-selects grow with their content instead of clipping at one line */
.ts-wrapper.form-select.multi .ts-control.form-control {
  height: auto;
  min-height: calc(1.5rem + 0.75rem + 2px);
}

.ts-wrapper.form-select-sm .ts-control.form-control {
  font-size: 0.75rem;
  height: calc(1.3125rem + 0.5rem + 2px);
}

.ts-wrapper.form-select-sm.multi .ts-control.form-control {
  height: auto;
  min-height: calc(1.3125rem + 0.5rem + 2px);
}

/* Make the multi-select clear button more visible */
.ts-wrapper.plugin-clear_button .clear-button {
  color: #fff !important;
  opacity: 0.85;
}

.ts-wrapper.plugin-clear_button .clear-button:hover,
.ts-wrapper.plugin-clear_button .clear-button:focus {
  color: #fff !important;
  opacity: 1;
}