.vl-input-field {
  &:hover {
    box-shadow: none;
    border-color: $vl-primary-blue;
    outline: 1px solid $vl-primary-blue;
  }

  // Input field block modifier
  &--block {
    display: block;
    width: 100%;
  }

  // Input field small modifier
  &--small {
    max-width: 6rem;
    padding: 0 0.8rem;
  }

  &.invalid.validated,
  &--error {
    background-color: transparent;
  }
}