%form-element-note {
  font-style: normal;
}
%form-element-label {
  font-weight: $typo-weight-semibold;
}
%form-element-text-input {
  -moz-appearance: none;
  -webkit-appearance: none;
  box-shadow: inset 0 3px 2px rgba(0, 0, 0, 0.06);
  border-radius: $decor-radius-100;
  border: $decor-border-100;
  outline: none;
}
%form-element-text-input::placeholder {
  color: $gray-400;
}
%form-element-note > code {
  border-radius: $decor-radius-100;
}
%form-element-error > input,
%form-element-error > textarea {
  border-color: $color-failure !important;
}
%form-element-text-input {
  color: $gray-500;
  border-color: $gray-300;
}
%form-element-text-input-hover {
  border-color: $gray-500;
}
%form-element-text-input-focus {
  border-color: $blue-500;
}
%form-element-label {
  color: $black;
}
%form-element-note {
  color: $gray-400;
}
%form-element-note > code {
  background-color: $gray-200;
  /* consul color but its a code looking style?*/
  color: $magenta-600;
}