/**
 * Custom overrides for tom-select.css
 * Matches styling from ig_layout formelements.scss
 */
:root {
  --ts-pr-clear-button: 0px !important;
  --ts-pr-caret: 0px !important;
  --ts-pr-min: .75rem;
}

.ts-control {
  height: var(--base-formfields-height);
  min-height: var(--base-formfields-height);
  padding: 0 var(--base-formfields-padding-right) 0 var(--base-formfields-padding-left);
  background-color: var(--base-formfields-bg);
  border: 0;
  border-radius: 0;
  box-sizing: border-box;
  display: flex; /* Added display: flex so align-items works */
  align-items: center;

  & input[type="text"] {
    width: auto;
  }
}

.ts-control > input {
  line-height: normal;
}

.ts-wrapper.single .ts-control {
  background-color: var(--base-formfields-bg);
}