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

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

.root {
  -st-mixin: TextFieldMixin(
    MainBorderRadius 4,
    MainBorderWidth 2,
    MainBorderColor #444546,
    MainBackgroundColor #eee,
    MainTextColor #343536,
    MainTextFont "{theme: 'Body-M', size: '15px'}",
    MainLabelFont "{theme: 'Body-M', size: '13px'}",
    MainLabelTextColor purple,
    CharCountFont "{theme: 'Body-S'}",
    CharCountColor grey,
    DisabledLabelColor #778899,
    PrefixColor pink,
    ErrorMessageMinHeight 40,
    ErrorColor hotpink,
    HelperTextColor #c86432,
    HelperTextFont "{theme: 'Body-S', size: '10px'}"
  );
}

.largeText {
  -st-mixin: TextFieldMixin(
    MainTextFont "{theme: 'Body-M', size: '32px'}"
  );
}

.hugeText {
  -st-mixin: TextFieldMixin(
    MainTextFont "{theme: 'Body-M', size: '48px'}"
  );
}

.hoverOverrides {
  -st-mixin: TextFieldMixin(
    MainBorderRadius 4,
    MainBorderWidth 2,
    MainBorderColor #444546,
    MainBackgroundColor #eee,
    MainTextColor #343536,
    MainTextFont "{theme: 'Body-M', size: '15px'}",
    MainLabelFont "{theme: 'Body-M', size: '13px'}",
    MainLabelTextColor purple,
    CharCountFont "{theme: 'Body-S'}",
    CharCountColor grey,
    DisabledLabelColor #778899,
    PrefixColor pink,
    ErrorMessageMinHeight 40,
    ErrorColor hotpink,
    HoverBorderColor red,
    HoverBorderWidth 5,
    HoverBorderRadius 10,
    HoverBackgroundColor black,
    HoverTextColor white,
    MainBorderOpacity 1
  );
}

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