/**
 * 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: #2e8555;
  --ifm-color-primary-dark: #29784c;
  --ifm-color-primary-darker: #277148;
  --ifm-color-primary-darkest: #205d3b;
  --ifm-color-primary-light: #33925d;
  --ifm-color-primary-lighter: #359962;
  --ifm-color-primary-lightest: #3cad6e;
  --ifm-color-important-contrast-background: #e7d7ff;
  --ifm-color-important-highlight: #b94be8;
  --ifm-code-font-size: 95%;
  --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
}

/* For readability concerns, you should choose a lighter palette in dark mode. */
[data-theme='dark'] {
  --ifm-color-primary: #25c2a0;
  --ifm-color-primary-dark: #21af90;
  --ifm-color-primary-darker: #1fa588;
  --ifm-color-primary-darkest: #1a8870;
  --ifm-color-primary-light: #29d5b0;
  --ifm-color-primary-lighter: #32d8b4;
  --ifm-color-primary-lightest: #4fddbf;
  --ifm-color-important-contrast-background: #5a3795;
  --ifm-color-important-highlight: #e09cfd;
  --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
}

/* https://github.com/facebook/docusaurus/discussions/5749 */
details[class^='details_'].alert--info {
  --ifm-alert-border-color: var(--ifm-color-emphasis-400);
  /* --ifm-alert-background-color: transparent; */
  --ifm-code-background: #{palette.$background};
  --ifm-alert-padding-vertical: calc(var(--ifm-spacing-vertical) * 0.8);

  margin-bottom: var(--ifm-paragraph-margin-bottom);

  &:not(.alert--warning,.alert--success,.alert--secondary,.alert--danger,.alert--important) {
    --ifm-alert-background-color: transparent;

    > summary {
      min-height: 1.3rem;
      display: inline-block;
      width: 100%;
    }
    > summary::before {
      top: 0.15rem;
    }
  }

  &.alert--success {
    --ifm-alert-background-color: var(--ifm-color-success-contrast-background);
    --ifm-alert-foreground-color: var(--ifm-color-info-contrast-foreground);
  }
  &.alert--secondary {
    --ifm-alert-background-color: var(--ifm-color-secondary-contrast-background);
    --ifm-alert-foreground-color: var(--ifm-color-secondary-contrast-foreground);
  }
  &.alert--important {
    --ifm-alert-background-color: var(--ifm-color-important-contrast-background);
    --ifm-alert-foreground-color: var(--ifm-color-secondary-contrast-foreground);
  }

  > summary {
    --docusaurus-details-decoration-color: currentColor;
    font: var(--ifm-heading-font-weight) var(--ifm-h5-font-size) / var(--ifm-heading-line-height) var(--ifm-heading-font-family);

    &::before {
      top: 0.40rem;
    }

    .admoIcon {
      display: inline-block;
      vertical-align: middle;
      margin-right: 0.4em;

      > svg { 
        display: inline-block;
        height: 1.6em;
        width: 1.6em;
        fill: var(--ifm-alert-foreground-color);
      }
    }
  }
  > div > div[class^='collapsibleContent_'] {
    margin-top: var(--ifm-alert-padding-vertical);
  }


  dl {
    --ifm-spacing-vertical: 0.5rem;
  }

}

.alert--info.theme-admonition-important {
    --ifm-alert-background-color: var(--ifm-color-important-contrast-background);
    --ifm-alert-foreground-color: var(--ifm-color-secondary-contrast-foreground);
    --ifm-alert-border-color: var(--ifm-color-important-highlight);
}

/** https://stackoverflow.com/a/79808430/1469797 */
img.image-center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}