.uni-textarea {
  margin-bottom: 46px;
  position: relative;

  textarea {
    @include textarea();
    width: 100%;
    resize: none;
  }

  &--error {
    textarea {
      border-color: color('feedback', 'error');
    }
  }

  .uni-tooltip {
    @media (max-width: 767px) {
      left: 0;
      top: calc(100% + 8px);
      min-width: 60%;
      max-width: 80%;
      width: auto;

      .uni-tooltip__text {
        width: auto;
        left: 0;
        box-shadow: 0 8px 10px 0 rgba(31, 36, 50, 0.45);

        &:before {
          top: -10px;
          transform: rotate(90deg);
          left: 5px;
        }
      }
    }
  }

  &-counter {
    @include body();
    color: color('text', 'subheader');
    max-width: 388px;
    text-align: right;
    margin-top: 6px;
  }
}
