/**
 * Any CSS included here will be global. The classic template
 * bundles Infima by default. Infima is a CSS framework designed to
 * work well for content-centric websites.
 */

/* You can override the default Infima variables here. */
:root {
  --ifm-color-primary: #2e7de9;
  --ifm-color-primary-dark: #186ee3;
  --ifm-color-primary-darker: #1768d7;
  --ifm-color-primary-darkest: #1355b1;
  --ifm-color-primary-light: #478dec;
  --ifm-color-primary-lighter: #5495ed;
  --ifm-color-primary-lightest: #7aacf1;
  --ifm-code-font-size: 95%;
  --docusaurus-highlighted-code-line-bg: #2f334d;
}

/* For readability concerns, you should choose a lighter palette in dark mode. */
[data-theme="dark"] {
  --ifm-color-primary: #82aaff;
  --ifm-color-primary-dark: #5b90ff;
  --ifm-color-primary-darker: #4883ff;
  --ifm-color-primary-darkest: #0f5bff;
  --ifm-color-primary-light: #a8c4ff;
  --ifm-color-primary-lighter: #bcd1ff;
  --ifm-color-primary-lightest: #f5f9ff;
  --ifm-background-color: #222436;
  --ifm-background-color: #1e2030;
  --ifm-heading-color: #bcd1ff;
  --ifm-navbar-search-input-background-color: #2f334d;
}

html[data-theme="dark"] {
  --primary-bg: #222436;
  --ifm-background-color: #1e2030;
  --ifm-background-surface-color: #222436;
}

.social {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0;
}

.social path {
  fill: var(--ifm-navbar-link-color);
}

.social:hover path {
  fill: var(--ifm-color-primary);
}

.theme-doc-version-badge {
  margin-bottom: 16px;
}

@media screen and (max-width: 996px) {
  .theme-doc-version-badge {
    margin-bottom: revert;
  }

  .social {
    margin: 48px 16px;
    display: inline-block;
  }
}
