如何在选中复选框时更改配色方案？

<input type="checkbox" id="colorCheckbox">

.light-theme {
  --primary-color: #ffffff;
  --secondary-color: #f2f2f2;
  --text-color: #000000;
}

.dark-theme {
  --primary-color: #000000;
  --secondary-color: #333333;
  --text-color: #ffffff;
}

const checkbox = document.getElementById('colorCheckbox');

checkbox.addEventListener('change', function() {
  if (checkbox.checked) {
    document.body.classList.add('dark-theme');
    document.body.classList.remove('light-theme');
  } else {
    document.body.classList.add('light-theme');
    document.body.classList.remove('dark-theme');
  }
});

window.addEventListener('DOMContentLoaded', function() {
  if (checkbox.checked) {
    document.body.classList.add('dark-theme');
  } else {
    document.body.classList.add('light-theme');
  }
});