.article-toc-widget {
  margin-top: 20px;
}

.article-toc-widget .widget-title {
  font-size: 0.9rem;
}

.article-toc-panel {
  max-height: calc(100vh - 40px);
  overflow: auto;
}

.article-toc-list {
  margin: 0;
  padding-left: 0;
  list-style: none;
  line-height: 1.55;
}

.article-toc-item {
  margin: 0;
  padding: 0;
}

.article-toc-item a {
  display: block;
  padding: 4px 0;
  color: #258fb8;
  text-decoration: none;
  overflow-wrap: anywhere;
}

.article-toc-item a:hover,
.article-toc-item a.is-active {
  color: #111;
  text-decoration: none;
}

.article-toc-item a.is-active {
  font-weight: 700;
}

.article-toc-level-3 a {
  padding-left: 14px;
  font-size: 0.95em;
}

.article-toc-level-4 a {
  padding-left: 28px;
  font-size: 0.9em;
}

@media (min-width: 960px) {
  body.has-article-toc #main {
    float: right;
  }

  body.has-article-toc #sidebar {
    float: left;
  }

  body.has-article-toc #sidebar > .widget-wrap:not(.article-toc-widget) {
    display: none;
  }

  body.has-article-toc .article-toc-widget {
    position: fixed;
    top: 20px;
    left: max(20px, calc((100vw - 1220px) / 2 + 20px));
    width: min(260px, calc(100vw - 40px));
    margin-top: 0;
    z-index: 20;
  }

  body.has-article-toc .article-toc-panel {
    max-height: calc(100vh - 120px);
  }
}

@media (max-width: 959px) {
  .article-toc-widget {
    margin: 20px 0;
  }

  #sidebar .article-toc-widget {
    position: static;
  }
}
