@value (
  var-sp-down-2,
  var-sp-down-3
) from "~@xo-union/tk-css-spacing/lib/variables.css";
@value (
  varBorderSuccess,
  varBorderError,
  varBorderDefault,
  varTextError,
  varTextSubtle
) from "~@xo-union/tk-ui-colors/lib/variables.css";
/**
Increase specificity of state classes so that they work on button with reset class
*/
.is-invalid.is-invalid {
  border-color: var(--tkww-union-fields-input-invalid-border-color, varBorderError);
}

.is-valid.is-valid {
  border-color: var(--tkww-union-fields-input-valid-border-color, varBorderSuccess);
}

.is-neutral.is-neutral {
  border-color: var(--tkww-union-fields-input-neutral-border-color, varBorderDefault);
}
.is-neutral.is-neutral:focus {
  border-color: var(--tkww-union-fields-input-focus-border-color, varBorderDefault);
}

.is-neutral ~ .next-to-input {
  color: var(--tkww-union-fields-input-neutral-subtext-color, varTextSubtle);
}

.is-invalid ~ .next-to-input {
  color: var(--tkww-union-fields-input-invalid-subtext-color, varTextError);
}

.is-valid ~ .next-to-input {
  color: var(--tkww-union-fields-input-valid-subtext-color, varTextSuccess);
}