/// ----------------------------------------------------------------------

/// Textarea

/// ----------------------------------------------------------------------

@use '@lavalogic/scss-lib' as lib;
@use 'spacing';
@use 'corners';
@use 'borders';
@use 'colours';
@use 'typography';
@use 'transitions';
@use 'states';

/// -------------------
/// Textarea config
/// -------------------

$padding-x: spacing.$sm !default;

/// -------------------
/// Textarea selectors
/// -------------------

.textarea {
  @include lib.resets-style;
  @include lib.components-flow($border-width: 1px);
  background: #fff;
  width: 100%;
  min-height: 80px;
  padding-left: $padding-x;
  padding-right: $padding-x;
  border: borders.$ui-three;
  border-radius: corners.$base;
  font-family: typography.$font-family;
  font-weight: typography.$font-regular;
  color: colours.$ui-five;
  transition: border-color transitions.$ease;
  resize: none;

  &:focus {
    @include states.focus;
  }

  &--disabled,
  &:disabled {
    @include states.disabled;
  }
}
