@import '../../styles/colors-v2.css';
@import "../../styles/spacing.css";
@import "../../styles/typography-v2.css";

.textarea {
  border: 1px solid var(--mds-grey-12);
  border-radius: 3px;
  box-sizing: border-box;
  font: var(--mds-type-content);
  height: var(--spacing-x-large);
  margin: 0;
  padding: var(--spacing-small) var(--spacing-x-large) 0 var(--spacing-medium);
  width: 100%;
}

.textarea::placeholder {
  color: var(--mds-grey-54);
}

.textarea:read-only {
  background-color: var(--mds-grey-3);
}

.invalid-textarea {
  composes: textarea;
  border-color: var(--mds-red-100);
}