/* Ajustes do dropdown pesquisavel (Tom Select) para casar com o Bootstrap 5
 * e com o tema claro/escuro do projeto (atributo data-bs-theme).
 *
 * O tema base vem de tom-select.bootstrap5.min.css (CDN). Aqui ficam apenas
 * os ajustes finos: altura/raio iguais aos .form-select e cores no modo escuro.
 */

/* Alinha o controle a aparencia dos .form-select padrao. */
.ts-wrapper.form-select {
  padding: 0;
  height: auto;
}

.ts-wrapper .ts-control {
  border-radius: var(--bs-border-radius, .375rem);
  min-height: calc(1.5em + .75rem + 2px);
}

/* Mensagem de "sem resultados". */
.ts-dropdown .no-results {
  padding: .5rem .75rem;
  color: var(--bs-secondary-color, #6c757d);
  font-style: italic;
}

/* ---- Tema escuro ---- */
[data-bs-theme="dark"] .ts-control,
[data-bs-theme="dark"] .ts-dropdown {
  background-color: var(--bs-body-bg);
  color: var(--bs-body-color);
  border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .ts-dropdown .option,
[data-bs-theme="dark"] .ts-control input {
  color: var(--bs-body-color);
}

[data-bs-theme="dark"] .ts-dropdown .active {
  background-color: var(--bs-primary-bg-subtle, #031633);
  color: var(--bs-emphasis-color, #fff);
}

[data-bs-theme="dark"] .ts-control .item {
  color: var(--bs-body-color);
}