.error {
  #{$all-text-inputs},
  select,
  .multiselect > .multiselect__tags {
    @include thin-border(var(--r-400));
  }

  .message {
    color: var(--r-400);
    display: block;
    font-size: var(--font-size-small);
    font-weight: $font-weight-normal;
    margin-bottom: $space-one;
    margin-top: -$space-normal;
    width: 100%;
  }
}

.button,
textarea,
input {
  &:focus {
    outline: none;
  }
}

.input-wrap {
  color: $color-heading;
  font-size: $font-size-small;
  font-weight: $font-weight-medium;
}

.help-text {
  font-weight: $font-weight-normal;
}

.input-group.small {
  input {
    font-size: var(--font-size-small);
    height: var(--space-large);
  }

  .error {
    border-color: var(--r-400);
  }
}
