@use "./../../variables" as *;
@use "./../../functions" as *;

select {
  padding-right: calc(var(--spacer) * 2);
  padding-inline-start: calc(var(--spacer) - 3px);

  &:not([multiple]) {
    background-image: escape-svg($form-select-indicator);
    background-repeat: no-repeat;
    background-position: right calc(var(--spacer) * 0.5) center;
    background-size: var(--spacer) auto;
  }

  &[multiple] {
    padding: 0;

    & option {
      padding: calc(var(--spacer) * 0.5) var(--spacer);
    }
  }
}