apollo-elements/apollo-elements

[hidden] {
  display: none !important;
}

main { counter-reset: footnotes; }

[role="doc-noteref"]::after {
  counter-increment: footnotes;
  content: counter(footnotes);
  vertical-align: super;
  font-size: 0.8rem;
}

.visually-hidden {
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
}

#footer-badges img {
  width: 145px;
}

@media screen and (min-width: 1024px) {
  #main-header .logo-link {
    margin-right: initial;
  }

  #main-header .search {
    margin-left: auto;
  }

  #main-header .content-area > * {
    margin-right: 25px;
  }
}

table tr:nth-of-type(even) code {
  background: var(--markdown-table-row-odd-background-color);
}

table code[class*="language-"],
table pre[class*="language-"] {
  margin: 0;
  padding: 0;
  background: none;
  display: inline-block;
}

.token.interpolation {
  color: var(--markdown-syntax-color);
}

#footnotes-label {
  border: none;
  font-size: 16px;
}

.markdown-body details {
  margin-bottom: 16px;
}

.markdown-body details summary {
  padding-inline-start: 8px;
}

#main-header a,
#main-header .social-link,
#main-header rocket-search {
  order: initial !important;
}

docs-playground {
  margin-bottom: 16px;
}

.before-after pre { position: relative; }

.before-after pre::before {
  display: block;
  position: absolute;
  right: 0;
  background: var(--footer-background);
  top: 0;
  padding: 4px 12px;
  border-bottom-left-radius: 6px;
}

.before-after pre:first-child::before { content: 'Before'; }
.before-after pre:last-child::before { content: 'After'; }

figure.example {
  margin: 0;
}

.markdown-body > figure.example figcaption {
  background-color: var(--markdown-syntax-background-color);
  padding: 8px 12px;
  width: max-content;
  border-start-start-radius: 6px;
  border-start-end-radius: 6px;
}

.markdown-body > figure.example pre:first-of-type {
  border-start-start-radius: 0;
}