:root,
:root .DocSearch,
html,
html .DocSearch,
html[data-theme=light],
html[data-theme=light] .DocSearch,
html[data-theme=dark],
html[data-theme=dark] .DocSearch {
  --docsearch-primary-color: var(--link-color);
  --docsearch-text-color: var(--text-color);
  --docsearch-highlight-color: var(--docsearch-primary-color);
  --docsearch-muted-color: var(--text-color-50);
  --docsearch-container-background: var(--black-20);
  --docsearch-logo-color: var(--link-color);
  --docsearch-modal-background: var(--bg-color-dark);
  --docsearch-modal-shadow: 0 0 0 1px var(--text-color-10), 0 10px 30px 0 var(--link-color-10);
  --docsearch-searchbox-background: var(--text-color-10);
  --docsearch-searchbox-focus-background: var(--bg-color);
  --docsearch-hit-color: var(--text-color);
  --docsearch-hit-active-color: var(--bg-color);
  --docsearch-hit-background: var(--bg-color);
  --docsearch-hit-shadow: 0 1px 3px 0 var(--bg-color-darker);
  --docsearch-key-gradient: linear-gradient(-225deg, var(--text-color-10), var(--text-color-0));
  --docsearch-key-shadow: inset 0 -2px 0 0 var(--text-color-10), inset 0 0 0 1px var(--text-color-20), 0 1px 2px 0 var(--text-color-10);
  --docsearch-footer-background: var(--bg-color);
  --docsearch-footer-shadow: 0 -1px 0 0 var(--text-color-10),0 -3px 6px 0 var(--text-color-5);
}

/* Algolia search item auto height */
.DocSearch .DocSearch-Hit-Container {
  height: auto;
  padding: 0.5rem var(--docsearch-spacing) 0.5rem 0;
}

.DocSearch .DocSearch-Hit-content-wrapper {
  white-space: inherit;
}

.DocSearch-Logo > a {
  display: none !important;
}

.DocSearch-Hit a::after {
  display: none !important;
}

:root .DocSearch-Button {
  height: auto;
  padding: 5px 8px;
  color: var(--text-color);
  background-color: var(--text-color-5);
  border-radius: 0.3em;
  backdrop-filter: blur(4px);
}
:root .DocSearch-Button:active, :root .DocSearch-Button:focus, :root .DocSearch-Button:hover {
  background-color: var(--text-color-10);
  --docsearch-searchbox-shadow: none;
}
:root .DocSearch-Button:active .DocSearch-Button-Key, :root .DocSearch-Button:focus .DocSearch-Button-Key, :root .DocSearch-Button:hover .DocSearch-Button-Key {
  color: var(--text-color);
  background: var(--bg-color-80);
}
:root .DocSearch-Button-Placeholder {
  padding-right: 8px;
}
:root .DocSearch-Button-Key {
  font-size: 13.5px;
  color: var(--text-color-40);
  background: var(--bg-color-20);
  box-shadow: 0 0 0 1px var(--text-color-10);
  top: 0;
  padding: 0;
  transition: 0.2s all ease;
}