@use "../../core/settings" as *;
@use "../../core/tools" as *;
@forward "../error-message";
@forward "../hint";
@forward "../label";

////
/// Textarea component
///
/// @group components/textarea
////

@include nhsuk-exports("nhsuk/components/textarea") {
  .nhsuk-textarea {
    box-sizing: border-box;

    display: block;

    width: 100%;
    min-height: nhsuk-px-to-rem(40px);
    padding: nhsuk-px-to-rem(nhsuk-spacing(1));

    resize: vertical;

    border: $nhsuk-border-width-form-element solid $nhsuk-input-border-colour;
    border-radius: 0;

    appearance: none;

    @include nhsuk-responsive-margin(5, "bottom");
    @include nhsuk-font($size: 19);

    &:focus {
      @include nhsuk-focused-input;
    }

    &:disabled {
      opacity: 0.5;
      color: inherit;
      background-color: transparent;
      cursor: not-allowed;
    }
  }

  .nhsuk-textarea--error {
    border-color: $nhsuk-error-colour;
  }
}