.formwerk {
  display: inline-block;
}
.formwerk--input {
  display: flex;
  gap: 0.25em;
}
.formwerk--input .form-control {
  flex: 1 1 10em;
}
.formwerk .form-label,
.formwerk .form-text {
  font-size: 0.8em;
  display: blocK;
}
.formwerk .form-label {
  margin-block-end: 0.5em;
}
.formwerk legend.form-label {
  float: inline-start;
  width: 100%;
}
.formwerk .form-text {
  display: block;
  margin-block-start: 0.5em;
  opacity: 0.66; /* Accessibility */
}
.formwerk output {
  min-width: 2em;
  text-align: end;
}

/* Checkboxes / radio buttons */
.formwerk .form-check {
  display: block;
}
.formwerk .form-check-label {
  display: inline-block;
  margin-inline-start: 0.25em;
}

/* States */
.formwerk.is-required .form-label:after {
  content: "*";
}
.formwerk.is-disabled .formwerk--outer > * {
  opacity: 0.55; /* Accessibility */
}
.formwerk.is-readonly .formwerk--outer {
  background: rgba(0, 0, 0, 0.1);
}
.formwerk.is-invalid .formwerk--outer {
  border-color: rgba(255, 0, 0, 0.5);
  background-color: rgba(255, 0, 0, 0.2);
}