@import 'proto-ui.vusion/src/u-textarea.vue/module.css';

.root {
    max-width: 100%;
    width: 160px;
    height: 80px;
    line-height: inherit;
    min-height: $height-base;
    padding: 5px 10px;
    color: #666;
    border-color: $brand-secondary;
    border-radius: 3px;
    transition: border-color $transition-duration;
}

.input::placeholder {
    /* Removes placeholder transparency in Firefox. */
    opacity: 1;
    color: #999;
}

.root[focus] {
    border-color: #8ebee9;
}

.root[disabled] {
    background-color: $brand-disabled;
}

.root[color="error"] {
    border-color: #ff867f;
}

.root[size$="normal"] { width: 160px; }
.root[size^="normal"] { height: 80px; }

.root[size$="medium"] { width: 280px; }
.root[size^="medium"] { height: 100px; }

.root[size$="large"] { width: 440px; }
.root[size^="large"] { height: 120px; }

.root[size$="huge"] { width: 580px; }
.root[size^="huge"] { height: 200px; }

.root[size$="full"] { width: 100%; }
.root[size^="full"] { height: 100%; }