html[data-theme='light'] {
  --admonition-note-c-bg: #241800;
  --admonition-info-c-bg: #000d24;
  --admonition-tip-c-bg: #00240a;
  --admonition-caution-c-bg: #240b00;
  --admonition-danger-c-bg: #240002;

  --admonition-code-note-c-bg: #3d2900;
  --admonition-code-info-c-bg: #00163d;
  --admonition-code-tip-c-bg: #003d11;
  --admonition-code-caution-c-bg: #3d1200;
  --admonition-code-danger-c-bg: #3d0003;
}

html[data-theme='dark'] {
  --admonition-note-c-bg: #241800;
  --admonition-info-c-bg: #000d242b;
  --admonition-tip-c-bg: #00240a;
  --admonition-caution-c-bg: #240b00;
  --admonition-danger-c-bg: #240002;

  --admonition-code-note-c-bg: #3d2900;
  --admonition-code-info-c-bg: #00163d;
  --admonition-code-tip-c-bg: #003d11;
  --admonition-code-caution-c-bg: #3d1200;
  --admonition-code-danger-c-bg: #3d0003;
}

:root {
  --admonition-bar-note-c-bg: var(--c-yellow-80);
  --admonition-bar-info-c-bg: var(--c-blue-80);
  --admonition-bar-tip-c-bg: var(--c-green-80);
  --admonition-bar-caution-c-bg: var(--c-orange-80);
  --admonition-bar-danger-c-bg: var(--c-red-60);

  --admonition-link-note-c: var(--c-yellow-90);
  --admonition-link-info-c: var(--c-blue-90);
  --admonition-link-tip-c: var(--c-green-90);
  --admonition-link-caution-c: var(--c-orange-90);
  --admonition-link-danger-c: var(--c-red-90);
}

.admonition {
  position: relative;
  border: none;

  --ifm-alert-color: var(--ifm-font-color-base);
  --ifm-alert-padding-horizontal: 2rem;
  --ifm-alert-padding-vertical: 1.5rem;

  .admonition-heading h5 {
    text-transform: unset;

    &:first-letter {
      text-transform: uppercase;
    }
  }

  .admonition-content {
    p {
      a {
        color: var(--admonition-link-c);
        text-decoration: underline;
      }

      code {
        background: var(--admonition-code-c-bg);
      }
    }
  }

  &-icon {
    display: none;
  }

  &-heading {
    font-size: 1rem;
    line-height: 1.6;
  }

  &::before {
    content: '';
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    bottom: 0;
    width: 5px;
    background: var(--admonition-bar-c-bg);
    border-radius: 4px 0 0 4px;
  }

  &-note {
    --ifm-alert-background-color: var(--admonition-note-c-bg);
    --admonition-bar-c-bg: var(--admonition-bar-note-c-bg);
    --admonition-code-c-bg: var(--admonition-code-note-c-bg);
    --admonition-link-c: var(--admonition-link-note-c);
  }

  &-info {
    --ifm-alert-background-color: var(--admonition-info-c-bg);
    --admonition-bar-c-bg: var(--admonition-bar-info-c-bg);
    --admonition-code-c-bg: var(--admonition-code-info-c-bg);
    --admonition-link-c: var(--admonition-link-info-c);
  }

  &-tip {
    --ifm-alert-background-color: var(--admonition-tip-c-bg);
    --admonition-bar-c-bg: var(--admonition-bar-tip-c-bg);
    --admonition-code-c-bg: var(--admonition-code-tip-c-bg);
    --admonition-link-c: var(--admonition-link-tip-c);
  }

  &-caution {
    --ifm-alert-background-color: var(--admonition-caution-c-bg);
    --admonition-bar-c-bg: var(--admonition-bar-caution-c-bg);
    --admonition-code-c-bg: var(--admonition-code-caution-c-bg);
    --admonition-link-c: var(--admonition-link-caution-c);
  }

  &-danger {
    --ifm-alert-background-color: var(--admonition-danger-c-bg);
    --admonition-bar-c-bg: var(--admonition-bar-danger-c-bg);
    --admonition-code-c-bg: var(--admonition-code-danger-c-bg);
    --admonition-link-c: var(--admonition-link-danger-c);
  }
}

.alert--secondary {
  color: var(--ifm-font-color-base);
}