.bg-light-1 {
  background-color: #e9e9e9;
  color: #000;
}

.bg-light-2 {
  background-color: #1F2739;
  color: #fff;
}

.bg-light-3 {
  background-color: #fff;
  color: #000;
}

.bg-light-4 {
  background-color: #e9e9e9;
  color: #000;
}

.dark-mode .bg-light-1 {
  background-color: #323232;
  color: #fff;
}

.bg-light-1 .rich_text_area {
  background-color: #fff;
  color: #000;
}

.dark-mode .bg-light-1 .rich_text_area {
  background-color: #292929;
  color: #fff;
}

.dark-mode .bg-light-2 {
  background-color: #292929;
  color: #fff;
}

.dark-mode .bg-light-3 {
  background-color: #292929;
  color: #fff;
}

.dark-mode .bg-light-4{
  background-color: #292929;
  color: #fff;
}

.dark-mode .bg-light-4 p{
  color: #fff;
}

.dark-mode .card {
  background-color: #292929;
  color: #fff;
}

.simple_form input,
.simple_form textarea,
.simple_form select {
  background-color: #fff;
  color: #000;
  border: 1px solid #ccc;
}

.dark-mode .simple_form input,
.dark-mode .simple_form textarea,
.dark-mode .simple_form select {
  background-color: #424242;
  color: #fff;
  border: 1px solid #616161;
}

.dark-mode .form-check-input {
  background-color: #424242;
  border: 1px solid #616161;
}

.dark-mode .form-check-input:checked {
  background-color: #616161;
}

.dark-mode .form-check-label {
  color: #fff;
}

#themeToggleBtn {
  background: none;
  border: none;
  cursor: pointer;
}

.theme-icon {
  width: 24px;
  height: 24px;
}

.dark-mode .trix-button--icon {
  background-color: #ffffff36;
}

.trix-button--icon.trix-active {
  border-color: #007bff;
}

.dark-mode .trix-button--icon.trix-active {
  border-color: #3399ff;
}
