body {
  background-color: rgb(255, 249, 235);
  color: rgb(12, 10, 5);
  /*font-family: "Nunito", sans-serif;*/
  font-size: 1.5em;
  transition-property: background;
  font-weight: normal;
}

.container {
  text-align: center;
}

.form-check .form-check-input {
  float: none;
  box-shadow: 1px 1px 4px #1e1e1e;
}

/* DARK MODE */

@media (prefers-color-scheme: dark) {
  body {
    color: white;
    background-color: black;
  }
  /* Change the modal content background and text color */
  .modal-content {
    background-color: #1e1e1e; /* dark background */
    color: #ffffff; /* light text */
    border: 1px solid #444444;
  }

  /* Ensure modal header text (like title) is readable */
  .modal-header .modal-title {
    color: #ffffff;
  }

  /* Optional: adjust modal body and footer if needed */
  .modal-body,
  .modal-footer {
    background-color: #1e1e1e;
    color: #ffffff;
  }

  /* Invert the close button icon so it's visible on dark backgrounds */
  .btn-close {
    filter: invert(1);
  }
}