/* textarea */

.cn-textarea-auto-size {
    /* easy way to plop the elements on top of each other and have them both sized based on the tallest one's height */
    display: inline-grid !important;
}
.cn-textarea-auto-size::after {
    /* Note the weird space! Needed to preventy jumpy behavior */
    content: attr(data-replicated-value) " ";

    /* This is how textarea text behaves */
    white-space: pre-wrap;

    /* Hidden from view, clicks, and screen readers */
    visibility: hidden;
}
.cn-textarea-auto-size > textarea {
    /* You could leave this, but after a user resizes, then it ruins the auto sizing */
    resize: none;

    /* Firefox shows scrollbar on growth, you can hide like this. */
    overflow: hidden;
}
.cn-textarea-auto-size > textarea,
.cn-textarea-auto-size::after {
    /* Identical styling required!! */
    font: inherit;
    /* Place on top of each other */
    grid-area: 1 / 1 / 2 / 2;
}