/* Keep native input semantics and keyboard support, with the Blue Mint selection state. */
input:is([type="checkbox"],[type="radio"]) {
  appearance: none; -webkit-appearance: none; flex: 0 0 auto;
  width: 20px; height: 20px; min-height: 0; padding: 0;
  border: 1.5px solid #9dc9df; border-radius: 6px; background: #f5fbff;
  vertical-align: middle; cursor: pointer;
  transition: background .16s, border-color .16s, box-shadow .16s;
}
input[type="radio"] { border-radius: 50%; }
input:is([type="checkbox"],[type="radio"]):checked {
  background: var(--gradient); border-color: #30b7dd;
  box-shadow: 0 0 0 3px #30c1e124, 0 2px 7px #258cff24;
}
input[type="checkbox"]:indeterminate { background: linear-gradient(115deg,#a2d7ff,#a4ecd9); border-color: #30b7dd; }
input:is([type="checkbox"],[type="radio"]):disabled { cursor: default; opacity: .65; }
:is(.person-option,.permission-choice,.check-row,.task-filter-options label):has(input:checked) {
  color: #17698a; background: #e6f6ff; border-color: #74c8ea;
  box-shadow: 0 0 0 1px #30c1e112;
}
.check-row input:checked + span { color: #17698a; }
.consent-field:has(input:checked) > span { color: #17698a; }
@media (forced-colors: active) {
  input:is([type="checkbox"],[type="radio"]):checked { background: Highlight; border-color: Highlight; outline: 2px solid Highlight; outline-offset: 2px; }
}