.ds-input {
  position: relative;
  display: flex;
  align-items: center;
  min-width: 0;
}

.ds-input__icon {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ds-color-text-subtle);
  pointer-events: none;
}

.ds-input__icon > svg {
  display: block;
  width: 16px;
  height: 16px;
}

.ds-input__icon--start {
  left: var(--ds-space-sm);
}

.ds-input__icon--end {
  right: var(--ds-space-sm);
}

.ds-input--has-start .ds-control {
  padding-left: var(--ds-space-xl);
}

.ds-input--has-end .ds-control {
  padding-right: var(--ds-space-xl);
}