.vl-textarea {
  &:hover {
    border-color: $vl-primary-blue;
    outline: 1px solid $vl-primary-blue;
  }

  &:focus,
  &--focus {
    border-color: $vl-secondary-blue;
    box-shadow: inset 0 0 0 0.1rem $vl-secondary-blue;
  }

  // Textarea block modifier
  &--block {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }

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