/* Article navigation only; the shared site layout stays unchanged. */
/* The legacy body overflow rule creates a scroll container that traps sticky children. */
body:has(.falcon-article-layout) {
  overflow-x: clip !important;
  overflow-y: visible;
}

.falcon-article-layout {
  --falcon-toc-offset: 100px;
}

.falcon-post-layout {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 30px;
}

.falcon-post-main,
.falcon-post-widgets,
.falcon-toc-column {
  min-width: 0;
}

.has-toc .falcon-post-main {
  grid-column: 1;
  grid-row: 2;
}

.has-toc .falcon-post-widgets {
  grid-column: 2;
  grid-row: 1 / 3;
}

.falcon-article-layout .falcon-toc {
  margin: 0;
  padding: 24px;
  border: 1px solid #e8eceb;
  border-radius: 12px;
  background: #f7faf8;
  font-family: Inter, -apple-system, system-ui, "Helvetica Neue", Helvetica, Arial, sans-serif;
  box-shadow: 0 1px 2px rgba(24, 33, 38, .02);
}

.falcon-article-layout .falcon-toc-header {
  gap: 12px;
  margin: 0 0 16px;
}

.falcon-article-layout .falcon-toc-title {
  color: #a1aaad;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.55;
  letter-spacing: .06em;
  text-transform: uppercase;
}

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

.falcon-article-layout .falcon-toc-list {
  display: flex;
  flex-direction: column;
  gap: 10.4px;
}

.falcon-article-layout .falcon-toc-list ol {
  padding-left: 12px;
  display: flex;
  flex-direction: column;
  gap: 10.4px;
  padding-top: 10.4px;
}

.falcon-article-layout .falcon-toc-list li {
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
}

.falcon-article-layout .falcon-toc-list a {
  display: block;
  padding: 0 0 0 9.6px;
  border-left: 2px solid transparent;
  margin: 0;
  color: #697276;
  font-size: 13px;
  font-weight: 400;
  overflow-wrap: anywhere;
  text-decoration: none;
  transition: color .15s ease, background-color .15s ease;
}

.falcon-article-layout .falcon-toc-list ol a {
  font-size: 12px;
}

.falcon-article-layout .falcon-toc-list a:hover {
  color: #182126;
  border-left-color: #c3cdc7;
  text-decoration: none;
}

.falcon-article-layout .falcon-toc-list a[aria-current="location"] {
  color: #4d725e;
  border-left-color: #4d725e;
  font-weight: 600;
}

.falcon-article-layout .falcon-toc-toggle {
  flex-shrink: 0;
  font-size: 12px;
  color: #4d725e;
  line-height: 1.5;
}

.falcon-article-layout .falcon-toc-toggle[hidden],
.falcon-article-layout .falcon-toc-list[hidden] {
  display: none;
}

.falcon-article-layout .entry-content :is(h2, h3, h4, h5, h6) {
  scroll-margin-top: var(--falcon-toc-offset);
}

[data-theme="dark"] .falcon-article-layout .falcon-toc {
  background: #0f172a;
  border-color: #334155;
}

[data-theme="dark"] .falcon-article-layout .falcon-toc-title,
[data-theme="dark"] .falcon-article-layout .falcon-toc-list a {
  color: #94a3b8;
}

[data-theme="dark"] .falcon-article-layout .falcon-toc-list {
  border-color: #334155;
}

[data-theme="dark"] .falcon-article-layout .falcon-toc-list a:hover,
[data-theme="dark"] .falcon-article-layout .falcon-toc-list a[aria-current="location"] {
  color: #a9ceb8;
  border-left-color: #a9ceb8;
  background: transparent;
}

@media (min-width: 1280px) {
  .falcon-article-layout > .container.falcon-has-toc {
    max-width: 1440px;
    width: calc(100% - 48px);
  }

  .falcon-post-layout.has-toc {
    grid-template-columns: 250px minmax(0, 1fr) 280px;
    gap: 24px;
  }

  .has-toc .falcon-toc-column {
    grid-column: 1;
    grid-row: 1;
    align-self: stretch;
  }

  .has-toc .falcon-post-main {
    grid-column: 2;
    grid-row: 1;
  }

  .has-toc .falcon-post-widgets {
    grid-column: 3;
    grid-row: 1;
  }

  .falcon-article-layout .falcon-toc {
    position: sticky;
    top: var(--falcon-toc-offset);
    padding: 24px;
  }

  .falcon-article-layout .falcon-toc-list {
    max-height: calc(100vh - var(--falcon-toc-offset) - 112px);
    max-height: calc(100dvh - var(--falcon-toc-offset) - 112px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
  }
}

@media (max-width: 1279px) {
  .falcon-article-layout .falcon-toc:not(:has(.falcon-toc-list:not([hidden]))) .falcon-toc-header {
    margin-bottom: 0;
  }
}

@media (max-width: 991px) {
  .falcon-post-layout {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .falcon-article-layout .falcon-toc-list a {
    transition: none;
  }
}
