/* REFRENCE: https://codepen.io/sosuke/pen/Pjoqqp */
.darkmode #light-icon{
  transform: rotate(120deg);
  opacity: 1;
}
.darkmode #dark-icon{
  transform: rotate(0deg);
  opacity: 1;
}
.darkmode #superdark-icon{
  transform: rotate(-120deg);
  opacity: 0;
}
.darkmode #logo-word{
  filter: brightness(0) invert(1);
}
.darkmode .header-page-icon, .darkmode #toggle-header img{
  filter: brightness(0) invert(1) !important;
}
.darkmode .show #nav .active .header-page-icon{
  filter: brightness(75%) !important;
}
.darkmode .header-page-icon.pfp{
  filter: none !important;
}
.darkmode #logo:hover #logo-light{
  opacity: 1 !important;
}
.darkmode .CodeMirror-line, .darkmode .CodeMirror-linenumber, .darkmode .CodeMirror-gutters, .darkmode .CodeMirror-selected, .darkmode .CodeMirror-cursor {
  filter: invert(0.805);
}
.darkmode .problem-logo {
  > img {
    &.problem-logo-dark {
      display: unset;
    }

    &.problem-logo-light {
      display: none;
    }
  }
}