div.header {
  background-color: transparent;
  border: 0;
}

#doc-content {
  position: relative;
}

#doc-content::before {
  content: "";
  position: fixed;
  top: 24px;
  left: 24px;
  width: 100%;
  height: 100%;
  background-image: url("./lucid-banner.png");
  background-repeat: no-repeat;
  background-size: cover;
  z-index: -1;
}

html.light-mode #doc-content::before {
  filter: invert(1);
}

h2.groupheader {
  box-shadow: none;
}

table.memberdecls .memSeparator {
  background-color: transparent;
}

div.memdoc {
  padding: 6px 10px 2px 10px;
}

/** TABS **/

/* button wrapper */
.tabs-overview {
  border-bottom: 0px !important;
  font-weight: 500 !important;
}

/* button */
.tab-button {
  padding: 0 !important;
}

/* button content */
.tab-title {
  box-shadow: none !important;
  border-radius: var(--border-radius-small) !important;
  color: var(
    --deprecated-color-darker
  ); /*or --page-secondary-foreground-color*/
}

/* button content (not-active) (hover) */
.tab-button:hover:not(.active) .tab-title {
  border-radius: var(--border-radius-small) !important;
  color: inherit !important;
}

/* button content (active) */
.tab-button.active .tab-title {
  box-shadow: none !important;
  color: var(--primary-color) !important;
  font-weight: 600;
  background: var(--page-background-color) !important;
  border-radius: var(--border-radius-small) var(--border-radius-small) 0 0 !important;
  border: 1px solid var(--separator-color) !important;
  border-bottom: 1px solid transparent !important;
}

/* button content underline */
.tab-button.active::after {
  display: none !important;
}

/* content */
.tabbed > ul {
  border: 1px solid var(--separator-color);
  padding: 0 13px !important;
  margin-top: -1px !important;
}

/** Plotly **/
html div[data-plot] {
}
@media (prefers-color-scheme: dark) {
  html:not(.light-mode) div[data-plot] {
    filter: invert(100%) hue-rotate(180deg);
  }
}
html.dark-mode div[data-plot] {
  filter: invert(100%) hue-rotate(180deg);
}
