/* Dark mode: fixed bar and header */
html[data-theme="dark"] .topbar {
  background: linear-gradient(90deg, #030712, #08111f 45%, #0f172a) !important;
  color: #e5f3ff !important;
  box-shadow: inset 0 -1px 0 rgba(148, 163, 184, .16) !important;
}

html[data-theme="dark"] .header,
html[data-theme="dark"] header.header,
html[data-theme="dark"] body.bt-blog-page .header,
html[data-theme="dark"] body.bt-blog-page header.header,
html[data-theme="dark"] body.woocommerce .header,
html[data-theme="dark"] body.post-type-archive-product .header,
html[data-theme="dark"] body.tax-product_cat .header,
html[data-theme="dark"] body.tax-product_tag .header {
  background: rgba(5, 9, 22, .96) !important;
  color: #f8fbff !important;
  border-bottom-color: rgba(148, 163, 184, .18) !important;
  box-shadow: 0 16px 38px rgba(0, 0, 0, .34) !important;
  backdrop-filter: blur(18px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.08) !important;
}

html[data-theme="dark"] .blog-menu {
  background: rgba(5, 9, 22, .96) !important;
  border-bottom-color: rgba(148, 163, 184, .18) !important;
}

html[data-theme="dark"] .header .nav-list a,
html[data-theme="dark"] .header .nav a,
html[data-theme="dark"] .blog-menu a {
  color: #dbeafe !important;
}

html[data-theme="dark"] .header .nav-list a:hover,
html[data-theme="dark"] .header .nav-list .current-menu-item > a,
html[data-theme="dark"] .blog-menu a:hover,
html[data-theme="dark"] .blog-menu .current-menu-item > a {
  background: rgba(59, 130, 246, .14) !important;
  color: #fff !important;
}

html[data-theme="dark"] .header-search {
  background: rgba(8, 13, 31, .92) !important;
  border-color: rgba(148, 163, 184, .24) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .24) !important;
}

html[data-theme="dark"] .header-search input {
  color: #f8fbff !important;
}

html[data-theme="dark"] .header-search input::placeholder {
  color: rgba(219, 234, 254, .58) !important;
}

html[data-theme="dark"] .header-search button {
  background: rgba(148, 163, 184, .14) !important;
  color: #e5f3ff !important;
}

html[data-theme="dark"] .header .logo.has-custom-logo .logo-image,
html[data-theme="dark"] .header .mobile-nav-logo.has-custom-logo .logo-image,
html[data-theme="dark"] .mobile-nav-panel .logo-image {
  filter: brightness(0) invert(1) grayscale(1) contrast(2) !important;
}