.dark-mode:root{
  --box-fg: rgb(255, 255, 255);
  --info-bg: rgb(23, 29, 79);
  --info-accent: rgb(189, 195, 255);
  --notice-bg: rgb(78, 64, 34);
  --notice-accent: rgb(249, 232, 195);
  --warn-bg: rgb(78, 34, 50);
  --warn-accent: rgb(249, 195, 214);
}

:root {
  --main_dark_bg: #010409;
  --second_dark_bg: #0d1117;
  --darker_hover: #171b20;
  --dark_hover: #383838;
  --second_dark_hover: #484848;
  --dark_inner_text: #888888;
  --dark_header_text: silver;
  --dark_main_text: #e6edf3;
  --dark_bright_text: wheat;
  --dark_border: #ddd;
  --link: #259dff;
}
#theme-icon-container {
  position: relative;
  float: right;
  color: white;
  min-width: 50px;
  color: black;
}
#theme-icon-container i {
  cursor: pointer;
  line-height: 30px;
}
#theme-icon-container .hidden-light {
  display: none;
}
.sun-icon {
  background-image: url(/images/sun-icon.png);
  background-size: 100%;
  background-repeat: no-repeat;
  width: 27px;
  height: 27px;
  cursor: pointer;
}
#theme-icon-container .hidden-dark {
  display: block;
}
html.dark-mode #theme-icon-container .hidden-light {
  display: block;
}
html.dark-mode #theme-icon-container .hidden-dark {
  display: none;
}
html.dark-mode #theme-icon-container {
  color: var(--dark_main_text);
  background-color: var(--second_dark_bg);
}
html.dark-mode > body {
  background: var(--main_dark_bg);
  color: var(--dark_main_text);
}
html.dark-mode header {
  background-color: var(--second_dark_bg);
  color: var(--dark_main_text);
}
html.dark-mode #logo > a {
  color: var(--dark_main_text);
}
/* navbar links/drop down menu links */
html.dark-mode #navbar ul#navmenu li a,
html.dark-mode #navbar ul#navmenu li.dropit-trigger a {
  color: var(--dark_main_text);
}
/* first drop down link - some js is adding current class */
html.dark-mode #navbar ul#navmenu li a.current {
  background: transparent;
}
html.dark-mode #navbar ul#navmenu li a.current:hover {
  background: var(--dark_hover);
}
html.dark-mode .menu ul.dropit-submenu {
  background: var(--dark_bg);
}
/* drop down menu links  */
html.dark-mode #navbar .menu ul.dropit-submenu a:hover {
  background: var(--dark_hover);
}
html.dark-mode #navbar #navmenu li {
  background: var(--second_dark_bg);
}
/* search bar */
html.dark-mode #navbar > span.algolia-autocomplete > input {
  background-color: var(--second_dark_bg);
}
html.dark-mode #navbar > span.algolia-autocomplete > input,
html.dark-mode #navbar > span.algolia-autocomplete > input::placeholder {
  color: var(--dark_main_text);
}
/* search bar french */
:lang(fr) html.dark-mode #navbar ul#navmenu > span.algolia-autocomplete > input {
  background-color: var(--second_dark_bg);
  color: var(--dark_main_text);
}
/* search bar fixes uz, ru, de, fr  */
:lang(uz) span.algolia-autocomplete {
  max-width: 8em;
  min-width: auto;
}
:lang(ru) span.algolia-autocomplete,
:lang(de) span.algolia-autocomplete,
:lang(fr) span.algolia-autocomplete
 {
  max-width: 9em;
  min-width: auto;
}
:lang(uz) span.algolia-autocomplete > input,
:lang(ru) span.algolia-autocomplete > input,
:lang(de) span.algolia-autocomplete > input, 
:lang(fr) span.algolia-autocomplete > input {
  max-width: 100%;
}
html.dark-mode #navbar ul#navmenu > span.algolia-autocomplete > input::placeholder {
  color: var(--dark_main_text);
}
html.dark-mode div#overlay {
  opacity: 0.5;
}
@media (max-width: 899px) {
  #theme-icon-container {
    bottom: 35px;
  }
  /* mobile menu main links hover */
  html.dark-mode div#navbar ul#navmenu .dropit-trigger:hover {
    background: var(--dark_hover);
  }
    /* mobile menu inner links hover */
  html.dark-mode div#navbar .menu ul.dropit-submenu a:hover {
    background: var(--second_dark_hover);
    color: var(--dark_main_text) !important;
  }
}

html.dark-mode .doc-box.doc-info pre.language-javascript {
  background: var(--main_dark_bg);
}

html.dark-mode h1,
html.dark-mode h2,
html.dark-mode h3,
html.dark-mode code,
html.dark-mode em,
html.dark-mode strong  {
  color: var(--dark_main_text);
}
html.dark-mode pre {
  background: var(--second_dark_bg);
}
/* index.html */
html.dark-mode #description .express > a {
  color: var(--dark_main_text);
}
html.dark-mode #install-command {
  background: var(--main_dark_bg);
}
html.dark-mode #announcements {
  background: var(--main_dark_bg);
}
html.dark-mode #boxes div > h3 {
  color: var(--dark_main_text);
}
/* basic-routing.htlm */
html.dark-mode [class*='language-'] {
  text-shadow: 0 1px var(--second_dark_bg);
}
/* js fat arrow operator */
html.dark-mode .token.operator {
  background: inherit;
}
/* debugging.htlm */
html.dark-mode table tr:first-child th {
  background-color: var(--second_dark_bg);
  color: var(--dark_main_text);
}
/* api pages */
html.dark-mode #menu li > * {
  color: var(--dark_main_text);
}
html.dark-mode #menu li ul li > em {
  color: var(--dark_header_text);
}
html.dark-mode #menu li ul li > a {
  color: var(--dark_inner_text);
}
html.dark-mode #api-doc > h3 {
  color: var(--dark_header_text);
}
html.dark-mode #api-doc section h5 {
  color: var(--dark_header_text);
}
/* 
overriding search-bar results drop down  
*/
html.dark-mode .ds-dropdown-menu .ds-dataset-1 {
  background-color: var(--dark_bg);
}
html.dark-mode .ds-dropdown-menu .ds-dataset-1 .ds-suggestion a {
  background-color: var(--second_dark_bg);
  color: var(--dark_main_text);
}
html.dark-mode
  .ds-dropdown-menu
  .ds-dataset-1
  .ds-suggestions
  .algolia-docsearch-suggestion--category-header {
  color: var(--dark_main_text);
}
html.dark-mode
  .ds-dropdown-menu
  .ds-dataset-1
  .ds-suggestions
  .algolia-docsearch-suggestion--wrapper
  .algolia-docsearch-suggestion--subcategory-column {
  color: var(--dark_header_text);
}
html.dark-mode
  .ds-dropdown-menu
  .ds-dataset-1
  .ds-suggestions
  .algolia-docsearch-suggestion--wrapper
  .algolia-docsearch-suggestion--title {
  color: var(--dark_main_text);
}
html.dark-mode
  .ds-dropdown-menu
  .ds-dataset-1
  .ds-suggestions
  .algolia-docsearch-suggestion--wrapper
  .algolia-docsearch-suggestion--text {
  color: var(--dark_main_text);
}
html.dark-mode
  .ds-dropdown-menu
  .ds-dataset-1
  .ds-suggestions
  .algolia-docsearch-suggestion--wrapper
  .algolia-docsearch-suggestion--highlight {
  color: var(--link);
}
html.dark-mode .ds-suggestion.ds-cursor .algolia-docsearch-suggestion--title,
html.dark-mode .ds-suggestion.ds-cursor .algolia-docsearch-suggestion--content{
  background-color: var(--dark_hover);
}
html.dark-mode .blog-post{
  background-color: initial;
  border: 1px solid var(--dark_border);
  transition: 0.3s;
} 
html.dark-mode .blog-post:hover{
  background-color: var(--darker_hover);
}
html.dark-mode .blog-title > a{
  color: var(--dark_main_text);
} 
html.dark-mode .blog-excerpt{
  color: var(--dark_bright_text);
} 
html.dark-mode #blog-side-menu-container h3 a{
  color: var(--dark_header_text);
}
html.dark-mode #blog-side-menu > li > a{
  color: var(--dark_inner_text);
}