/*  ************************************************************ De styling van "De Schakelaar Licht/Donker"   ***********************************************************    */

/* Voor het handmatig aanpassen/de schakelaar  */
body.donker {
  background-color: #1a1f2e;
  color: #ffffff;
}

body.donker .btn-group .btn {
  background-color: #2f3445;
  border-color: #444;
  color: #ddd;
}

body.donker .unit-result {
  background-color: #2a2f3e;
  border: 1px solid #444;
  color: #fff;
}

body.donker .btn-primary {
  background-color: #007acc;
  border-color: #007acc;
}

body.donker .btn-outline-secondary {
  color: #c0c0c0;
  border-color: #555;
}

body.donker .btn-outline-secondary:hover {
  background-color: #007acc;
  color: #fff;
}

body.donker .card {
  background-color: #2a2f3e;
  border-color: #444;
}

body.donker .card-title {
  color: #fff;
}

/* Het bi bi-info-circle icon heeft de class info-icon. Zo kan de kleur van de info icon wordem gewijzigd in de schakelaar dark en de dark modus */
body.donker .info-icon {
  color: orange;
  /* of iets lichter grijs voor beter contrast */
}

body.donker .modal-content {
  background-color: #1a1f2e;
  color: lightblue;
}

/*          Waarchuwings tekst onder strijdwagen bij omrekenen Romeinse getallen     */
body.donker .hinttekst {
  color: lightseagreen;
}

/* Helemaal onderaan de pagina, de voorbeelden  */

body.donker .container_info {
  background-color: #2b2f38;
  /* zachtblauw/wit */
}

body.donker .conversie-heading {
  color: dodgerblue;
  font-size: 1.4rem;
  font-weight: 500;
  opacity: 0.7;
  /* 0 = volledig transparant, 1 = volledig zichtbaar */
}

body.donker .list-unstyled {
  color: lightseagreen;
  opacity: 0.7;
  /* 0 = volledig transparant, 1 = volledig zichtbaar */
}

/* *************** Tot hier *****************  */