@st-namespace 'TextArea-visual-st-css';
:import {
  -st-from: "./TextArea.deprecated.st.css";
  -st-default: TextAreaMixin;
}

.elementBelow {
  border: 1px dashed #000000;
}

.root {
  -st-mixin: TextAreaMixin(
    ErrorMessageMinHeight 40,
    ErrorColor blue
  );
}

.simple {
  -st-mixin: TextAreaMixin(
    MainBorderRadius 10,
    MainBorderWidth 4,
    ContainerWidth 200px,
    ContainerHeight 200px,
    BorderColor red,
    BackgroundColor green,
    TextColor purple,
    TextFont "{theme: 'Page-title', size: '20px', lineHeight: '26px'}",
    MainLabelFont "{theme: 'Body-L', size: '16px', lineHeight: '20px'}",
    MainLabelTextColor red,
    CharCountFont "{theme: 'Body-L', size: '18px', lineHeight: '20px'}",
    CharCountColor blue,
  );
}

.hoverOverrides {
  -st-mixin: TextAreaMixin(
    MainBorderOpacity 0.2,
    HoverBorderColor rgb(114, 71, 255),
    HoverBorderWidth 5,
    HoverBorderRadius 10,
    HoverBackgroundColor rgb(247, 165, 2),
    HoverBackgroundOpacity 0.5,
    HoverTextColor rgb(237, 36, 217),
  )
}

.placeholder {
  -st-mixin: TextAreaMixin(
    PlaceholderColor blue,
  );
}

.disabled{
  -st-mixin: TextAreaMixin(
    DisabledTextColor blue,
    DisabledBorderColor blue,
    DisabledLabelColor blue,
  );
}

.error {
  -st-mixin: TextAreaMixin(
    ErrorBorderColor green,
    ErrorColor green,
    ErrorMessageMinHeight 40,
  );
}

.success {
  -st-mixin: TextAreaMixin(
    SuccessBorderColor blue,
  );
}

.line {
  -st-mixin: TextAreaMixin(
    MainBorderWidth 5,
  );
}

/* st-namespace-reference="../../../../src/components/TextArea/TextArea.visual-deprecated.st.css" */