html.dark-mode body, body.dark-mode {
    background: #18181c;
    color: #f3f3f3;
}
html.dark-mode body .bg-white,
body.dark-mode .bg-white {
  background: #23232a !important;
}
html.dark-mode body .bg-light-2,
body.dark-mode .bg-light-2 {
  background: #29293a !important;
  border: 1px solid #2e2e3a !important;
}
html.dark-mode body .bg-light-1,
body.dark-mode .bg-light-1 {
  background: #24242e !important;
}
html.dark-mode body .bg-light-3,
body.dark-mode .bg-light-3 {
    background: #23232a !important;
}
html.dark-mode body .text-dark,
html.dark-mode body .text-dark-2,
html.dark-mode body .text-dark-3,
body.dark-mode .text-dark,
body.dark-mode .text-dark-2,
body.dark-mode .text-dark-3 {
    color: #e0e0e0 !important;
}
html.dark-mode body .shadow-md,
html.dark-mode body .shadow-lg,
body.dark-mode .shadow-md,
body.dark-mode .shadow-lg {
    box-shadow: 0 2px 12px 0 rgba(0,0,0,0.7) !important;
}
html.dark-mode body input,
html.dark-mode body select,
html.dark-mode body textarea,
body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea {
    background: #23232a !important;
    color: #e0e0e0 !important;
    border-color: #333 !important;
}
html.dark-mode body .border-light-1,
body.dark-mode .border-light-1 {
    border-color: #333 !important;
}
html.dark-mode body .bg-white\/10,
html.dark-mode body .bg-white\/20,
body.dark-mode .bg-white\/10,
body.dark-mode .bg-white\/20 {
    background: rgba(35,35,42,0.1) !important;
}
html.dark-mode body .bg-primary\/10,
body.dark-mode .bg-primary\/10 {
    background: rgba(22,93,255,0.08) !important;
}
html.dark-mode body .bg-secondary\/10,
body.dark-mode .bg-secondary\/10 {
    background: rgba(15,198,194,0.08) !important;
}
html.dark-mode body .bg-warning\/10,
body.dark-mode .bg-warning\/10 {
    background: rgba(255,125,0,0.08) !important;
}
html.dark-mode body .bg-success\/10,
body.dark-mode .bg-success\/10 {
    background: rgba(0,180,42,0.08) !important;
}
html.dark-mode body .bg-danger\/10,
body.dark-mode .bg-danger\/10 {
    background: rgba(245,63,63,0.08) !important;
}
html.dark-mode body .text-primary,
body.dark-mode .text-primary {
    color: #6ca0ff !important;
}
html.dark-mode body .text-secondary,
body.dark-mode .text-secondary {
    color: #0fc6c2 !important;
}
html.dark-mode body .text-warning,
body.dark-mode .text-warning {
    color: #ffb366 !important;
}
html.dark-mode body .text-success,
body.dark-mode .text-success {
    color: #00b42a !important;
}
html.dark-mode body .text-danger,
body.dark-mode .text-danger {
    color: #f53f3f !important;
}
#clear-history-btn:hover {
  background: #f53f3f !important;
  color: #fff !important;
  border-color: #f53f3f !important;
}
html.dark-mode body #clear-history-btn:hover,
body.dark-mode #clear-history-btn:hover {
  background: #f53f3f !important;
  color: #fff !important;
  border-color: #f53f3f !important;
} 
html.dark-mode body #encrypt-button,
body.dark-mode #encrypt-button {
  background: #244a7b !important;
  color: #fff !important;
  border: none;
  box-shadow: 0 2px 8px 0 rgba(0,0,0,0.5) !important;
  transition: background 0.2s, color 0.2s;
}
html.dark-mode body #encrypt-button:hover,
body.dark-mode #encrypt-button:hover {
  background: #165DFF !important;
  color: #fff !important;
}
html.dark-mode body #encrypt-button:disabled,
body.dark-mode #encrypt-button[disabled],
body.dark-mode #encrypt-button.cursor-not-allowed,
html.dark-mode body #encrypt-button.cursor-not-allowed {
  background: #444a5a !important;
  color: #888 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
}