:root {
  --message-paper: #f2f1df;
  --message-border: #cbd2ae;
  --message-ink: var(--brand-active);
}

.form-control,
.form-select {
  background-color: var(--message-paper);
  border-color: var(--message-border);
  color: var(--ink);
}

.form-control:focus,
.form-select:focus {
  background-color: var(--message-paper);
  border-color: var(--brand);
  box-shadow: 0 0 0 .25rem rgba(var(--brand-rgb), .2);
  color: var(--ink);
}

.form-control::placeholder {
  color: #747865;
  font-style: italic;
}

.form-control:-webkit-autofill,
.form-control:-webkit-autofill:hover,
.form-control:-webkit-autofill:active {
  -webkit-text-fill-color: var(--ink);
  -webkit-box-shadow: 0 0 0 1000px var(--message-paper) inset;
  caret-color: var(--ink);
}

.form-control:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--ink);
  -webkit-box-shadow: 0 0 0 1000px var(--message-paper) inset,
    0 0 0 .25rem rgba(var(--brand-rgb), .2);
  caret-color: var(--ink);
}

.alert {
  --bs-alert-color: var(--message-ink);
  --bs-alert-bg: var(--message-paper);
  --bs-alert-border-color: var(--message-border);
  --bs-alert-link-color: var(--brand-active);
  border-left-width: .3rem;
}

.alert-success { --bs-alert-border-color: var(--brand); }
.alert-danger { --bs-alert-color: #7f1d1d; --bs-alert-border-color: #b42318; }
.alert-warning { --bs-alert-color: #76520b; --bs-alert-border-color: #a66b00; }

.input-with-unit {
  background: var(--message-paper);
  border-color: var(--message-border);
}

.input-with-unit input {
  background: var(--message-paper);
  color: var(--ink);
}
