.btn--toggle {
  --btn-background: var(--color-bg);
}

.btn--toggle [type="checkbox"] {
  position: absolute; clip: rect(0, 0, 0, 0);
}

.btn--toggle:has(:checked) {
  --btn-background: var(--color-border-light);
}

.btn--toggle:has(:focus-visible) {
  outline: var(--border-2) solid var(--color-selected-dark);
}

.card--toggle:has(:checked) {
  background-color: rgb(from var(--color-border-light) r g b / .5);
  border-color: var(--color-border-dark);
}