:root {
  --ifm-color-primary: #212121;
  --ifm-color-primary-dark: #424242;
  --ifm-color-primary-darker: #616161;
  --ifm-color-primary-darkest: #757575;
  --ifm-color-primary-light: #9e9e9e;
  --ifm-color-primary-lighter: #bdbdbd;
  --ifm-color-primary-lightest: #e0e0e0;
  --ifm-color-success: #9e9e9e;

  --ifm-font-weight-semibold: 600;

  --ifm-hr-border-color: transparent;

  --ifm-code-font-size: 95%;

  --ifm-navbar-shadow: transparent;
  --ifm-navbar-background-color: #fff;
  --ifm-navbar-height: 90px;
  --ifm-navbar-padding-horizontal: 24px;
  --ifm-navbar-link-color: rgb(78, 78, 78);

  --ifm-menu-link-sublist-icon: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16px" height="16px" viewBox="0 0 24 24"><path fill="rgba(0,0,0,1)" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path></svg>');
  --ifm-toc-border-color: transparent;

  --ifm-footer-padding-vertical: 96px;
  --ifm-h1-font-size: 3em;
  --ifm-link-color: #000;
}

html {
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen,
    Ubuntu,
    Cantarell,
    "Fira Sans",
    "Droid Sans",
    "Helvetica Neue",
    sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  padding: 0;
}

html:root {
  --aa-primary-color-rgb: 0, 0, 0;
  --aa-selected-color-rgb: 176, 190, 197;
}

html body[data-theme="dark"] {
  --aa-primary-color-rgb: 255, 255, 255;
  --aa-background-color-rgb: 0, 0, 0;
  --aa-input-border-color-rgb: 255, 255, 255;
  --aa-input-border-color-alpha: 0.1;
  --aa-text-color-rgb: 255, 255, 255;
  --aa-muted-color-rgb: 255, 255, 255;
  --aa-selected-color-rgb: 80, 80, 80;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

html[data-theme="dark"] {
  --ifm-navbar-background-color: #18191a;
  --ifm-color-primary: #fff;
}

html[data-theme="dark"] .footer--dark {
  --ifm-footer-background-color: rgba(255, 255, 255, 0.05);
}

.table-of-contents li {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.markdown figure {
  text-align: center;
}

.plugin-blog .main-wrapper,
.docs-wrapper .main-wrapper {
  width: 100%;
  max-width: calc(1296 + 16px);
  padding: 0 8px;
  margin: 0 auto;
}

@media (min-width: 997px) {
  .plugin-blog .main-wrapper,
  .docs-wrapper .main-wrapper {
    max-width: calc(1296px + 48px);
    padding: 0 24px;
  }
}

svg[aria-hidden="true"] {
  display: none;
}

/* https://css-tricks.com/fixed-headers-and-jump-links-the-solution-is-scroll-margin-top/ */
.navbar--fixed-top + .main-wrapper [id] {
  scroll-margin-top: 90px; /* = navbar height */
}

.navbar__toggle svg[aria-hidden="true"] {
  display: block;
}

.theme-edit-this-page svg[aria-hidden="true"],
article svg[aria-hidden="true"] {
  display: inline;
}

.pagination-nav {
  grid-column: 1/-1;
}

.blog-wrapper .pagination-nav__item:first-child .pagination-nav__label::before {
  display: none;
}

.blog-wrapper .pagination-nav__item--next .pagination-nav__label::after {
  display: none;
}

.pagination-nav__link {
  width: 100%;
  box-shadow:
    0px 0px 0px 1px rgba(0, 0, 0, 0.12),
    0px 1px 1px -0.5px rgba(0, 0, 0, 0.12),
    0px 3px 3px -1.5px rgba(0, 0, 0, 0.12),
    0px 6px 6px -3px rgba(0, 0, 0, 0.12);
  border: 0;
  padding: 24px;
  border-radius: 8px;
}
.pagination-nav__link:hover {
  width: 100%;
  box-shadow:
    0px 0px 0px 1px rgba(0, 0, 0, 0.12),
    0px 1px 1px -0.5px rgba(0, 0, 0, 0.12),
    0px 3px 3px -1.5px rgba(0, 0, 0, 0.12),
    0px 6px 6px -3px rgba(0, 0, 0, 0.12),
    0px 8px 12px -6px rgba(0, 0, 0, 0.12),
    0px 10px 24px -12px rgba(0, 0, 0, 0.12);
}

.blog-wrapper .pagination-nav__label {
  text-wrap: balance;
}

.pill {
  background-color: #b3e5fc;
  color: #141414;
  padding: 2px 16px;
  display: inline-block;
  font-size: 16px;
  font-weight: 600;
  border-radius: 16px;
  margin-bottom: 32px;
}

@media (min-width: 997px) {
  .table-of-contents:before {
    content: "Contents";
    text-transform: uppercase;
    padding: 0px;
    font-weight: 700;
    color: rgba(0, 0, 0, 0.4);
    font-size: 0.8em;
    line-height: 2.5em;
  }
}

.table-of-contents li,
.table-of-contents ul {
  margin: 0;
  padding: 0;
}

ul .table-of-contents__link {
  padding-left: 8px;
}

ul ul .table-of-contents__link {
  padding-left: 20px;
}

ul ul ul .table-of-contents__link {
  padding-left: 32px;
}

.table-of-contents__link {
  border-left: 1px solid #e5e7eb;
  margin: 0;
  padding: 2px 8px;
  display: block;
}

.table-of-contents__link:hover {
  border-left: 1px solid #888;
}

.table-of-contents__link--active {
  color: #03a9f4;
  border-left: 1px solid #03a9f4;
  font-weight: 500;
}

.blog-post-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
}

@media (max-width: 1200px) {
  .blog-post-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 800px) {
  .blog-post-list {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
