css-sandbox/form/style.css

@import 'button.css';
@import 'form.css';
@import 'field.css';
@import 'select.css';
@import 'radio.css';

:root {
  --color-form: rgb(203, 222, 228);
  --color-field: rgba(255, 0, 0, 0.123);
  --color-label: rgba(0, 255, 42, 0.123);
  --color-input: rgba(0, 4, 255, 0.123);
}

/* Add nodebug class to any parent field (e.g. body) to turn off coloring */
.nodebug { --color-form: transparent; --color-field: transparent; --color-label: transparent; --color-input: transparent; }

html {
  box-sizing: border-box;
}

*, *::before, *::after {
  box-sizing: inherit;
}

body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.body--centered {
  align-items: center;
}

.badge {
  padding: 0.5em; 
  background-color: darkblue; 
  color: white;
}