header {
  z-index: 999;
  position: relative;
  top: 0;
}

.showHeaderOnTop {
  box-shadow: 0px 8px 56px rgba(15, 80, 100, 0.16);
  top: 0;
  position: sticky;
}

header .navbar .navbar-nav a, .navbar-brand  {
  color: var(--text-color) !important;
}

#theme-toggle {
  background-color: var(--background-color) !important;
  color: var(--text-color) !important;
}
#theme-toggle svg {
  margin-bottom: 8px;
}

.navbar-toggler {
  border: none;
  outline: none;
  color: var(--text-color);
}
.navbar-toggler svg {
  fill: currentColor;
  color: var(--text-color);
}
.navbar-toggler:focus {
  box-shadow: 0 0 0 0.05em;
}
.navbar-text {
  font-size: 16px !important;
  opacity: 0.95;
  white-space: nowrap;
}
header .nav-link {
  transition: none !important;
}
.navbar-brand {
  opacity: 0.95;
}
.navbar-brand:hover {
  color: var(--primary-color) !important;
}
.navbar .nav-link:hover {
  color: var(--primary-color) !important;
}
.nav-link.nav-link-sep:after {
  content: '|';
  color: var(--text-color) !important;
}

li > .dropdown-toggle:focus {
  color: var(--primary-color) !important;
}

.dropdown-menu {
  overflow: auto;
  /* z-index: 100; */
  background-color: var(--background-color) !important;
  border-color: var(--text-secondary-color) !important;
}

.dropdown-item:hover {
  background-color: var(--secondary-color) !important;
}

.dropdown-item:focus,
.dropdown-item:active {
  background-color: var(--secondary-color) !important;
}

.dropdown-divider {
  border-top: 1px solid var(--lt-color-border-dark);
}

#search {
  border-radius: 1rem !important;
  background-color: var(--secondary-color);
  color: var(--text-color);
  border-color: var(--background-color) !important;
  transition: none;
}

#search:focus {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
#search-content {
  -ms-scroll-chaining: none;
  scrollbar-width: none;
  display: none;
  border-radius: 1rem;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  z-index: 9999;
  width: 10%;
  max-height: 350px;
  background-color: var(--secondary-color) !important;
  position: absolute;
  overflow: scroll;
}

#search-content::-webkit-scrollbar {
  display: none;
}

#search-results > .card {
  background-color: transparent !important;
  border: none;
  margin-bottom: 10px;
}

#search-results > .card :hover {
  border-radius: 1rem !important;
  background-color: var(--background-color) !important;
  transition: 0.2s;
}

#search-results .card a {
  opacity: 0.9;
  display: inline-block;
  text-decoration: none;
  color: var(--text-color) !important;
}

#search-results .card a:hover {
  color: var(--primary-color) !important;
}
