/* Keep Primer's typography, with a quieter site title on both page types. */
.site-title,
.home-content > h1:first-child {
  margin: 0 0 20px;
  padding: 0;
  border: 0;
  color: var(--reading-muted, #586069);
  font-size: 20px;
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
}

.site-title a {
  color: inherit;
}

#article-content {
  min-width: 0;
}

#article-content h2,
#article-content h3 {
  scroll-margin-top: 24px;
}

.article-toc {
  margin-bottom: 24px;
  color: var(--reading-muted, #586069);
  font-size: 13px;
  line-height: 1.5;
}

.toc-disclosure {
  padding: 12px 0;
  border-top: 1px solid var(--reading-border, #e1e4e8);
  border-bottom: 1px solid var(--reading-border, #e1e4e8);
}

.toc-title {
  font-size: 14px;
  font-weight: 600;
}

.toc-header {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-bottom: 6px;
}

.panel-restore,
.panel-hide,
.toc-toggle-all {
  display: grid;
  flex: 0 0 32px;
  place-items: center;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--reading-muted, #586069);
  cursor: pointer;
}

.panel-restore svg,
.panel-hide svg,
.toc-toggle-all svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.panel-restore {
  list-style: none;
  border: 1px solid var(--reading-border, #e1e4e8);
}

.panel-restore::-webkit-details-marker { display: none; }
.panel-restore::marker { content: ""; }
.toc-disclosure[open] > summary,
.reading-disclosure[open] > summary,
.toc-toggle-all[hidden],
.toc-toggle-all .toc-expand-icon,
.toc-toggle-all[data-action="expand"] .toc-collapse-icon { display: none; }
.toc-toggle-all[data-action="expand"] .toc-expand-icon { display: inline; }

.panel-restore:hover,
.panel-hide:hover,
.toc-toggle-all:hover {
  background: var(--reading-soft, #f6f8fa);
  color: var(--reading-link, #0366d6);
}

.panel-restore:focus-visible,
.panel-hide:focus-visible {
  outline: 2px solid var(--reading-focus, #9abce0);
  outline-offset: 2px;
}

.toc-disclosure:not([open]) {
  padding: 0;
  border: 0;
}

.toc-title {
  flex: 1;
  margin: 0;
  padding-left: 26px;
  color: var(--reading-muted, #6a737d);
}

.article-toc nav {
  max-height: 50vh;
  margin-top: 0;
  padding: 2px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: none;
}

.article-toc nav::-webkit-scrollbar {
  display: none;
}

.article-toc nav:focus-visible {
  outline: 1px solid var(--reading-focus, #9abce0);
  outline-offset: 4px;
  border-radius: 4px;
}

.toc-list,
.toc-list ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

.toc-list ol {
  margin: 4px 0 10px 11px;
  padding-left: 26px;
  border-left: 1px solid var(--reading-border, #eaecef);
}

.toc-list > li + li {
  margin-top: 8px;
}

.toc-list ol > li + li {
  margin-top: 2px;
}

.toc-row {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 4px;
}

.toc-list > li:not(.toc-branch) > .toc-row {
  padding-left: 24px;
}

.toc-toggle {
  display: grid;
  flex: 0 0 20px;
  place-items: center;
  width: 20px;
  height: 28px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--reading-muted, #8b949e);
  cursor: pointer;
}

.toc-toggle::before {
  content: "";
  width: 5px;
  height: 5px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(-45deg);
}

.toc-toggle[aria-expanded="true"]::before {
  transform: rotate(45deg);
}

.toc-toggle:hover {
  background: var(--reading-soft, #f3f5f7);
  color: var(--reading-text, #24292e);
}

.toc-list a {
  display: block;
  flex: 1;
  min-width: 0;
  padding: 6px 8px;
  border-radius: 4px;
  color: var(--reading-muted, #6a737d);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.toc-list > li > .toc-row > a {
  color: var(--reading-strong, #444d56);
  font-weight: 500;
}

.toc-list .toc-link:hover,
.toc-list .toc-link:focus-visible {
  color: var(--reading-link, #0366d6);
  background: var(--reading-soft, #f6f8fa);
  text-decoration: none;
}

.toc-list .toc-link[aria-current="location"] {
  color: var(--reading-link, #0366d6);
  background: var(--reading-active, #edf4fb);
}

.toc-toggle:focus-visible,
.toc-toggle-all:focus-visible,
.toc-list a:focus-visible {
  outline: 1px solid var(--reading-focus, #9abce0);
  outline-offset: -1px;
}

@media (max-width: 767px) {
  .site-title,
  .home-content > h1:first-child {
    font-size: 18px;
  }

  .panel-restore,
  .panel-hide,
  .toc-toggle-all {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }
}

/* Equal outer columns keep the article centered independently of the TOC. */
@media screen and (min-width: 1664px) {
  .site-shell.has-sidebars {
    --toc-width: clamp(248px, calc(12.5vw + 40px), 360px);
    --toc-gap: clamp(48px, calc(12.5vw - 160px), 160px);
    max-width: none;
  }

  .has-sidebars .site-header,
  .has-sidebars .footer {
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
  }

  .has-sidebars .page-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 980px) minmax(0, 1fr);
    grid-template-areas: "toc article reader";
    column-gap: var(--toc-gap);
    align-items: start;
  }

  .has-sidebars #article-content {
    grid-area: article;
  }

  .article-toc {
    grid-area: toc;
    justify-self: end;
    width: 100%;
    max-width: var(--toc-width);
    position: sticky;
    top: 32px;
    margin-bottom: 0;
    padding-top: 6px;
  }

  .toc-disclosure {
    padding: 0;
    border: 0;
  }

  .toc-disclosure > summary { margin-left: auto; }

  .article-toc nav {
    max-height: calc(100vh - 150px);
    max-height: calc(100dvh - 150px);
  }
}

@media print {
  .article-toc,
  .reading-panel {
    display: none;
  }

  .has-sidebars .page-grid {
    display: block;
  }
}
