/* Table of Contents component (migrated to pyzza.contrib.site_essentials) */
.toc {
  --toc-bg: var(--color-surface);
  --toc-border: var(--color-border);
  --toc-text: var(--color-text);
  --toc-muted: var(--color-muted);
  --toc-accent: var(--color-accent);
  --toc-shadow: var(--shadow-sm);

  background: var(--toc-bg);
  border: 1px solid var(--toc-border);
  border-radius: var(--radius-md);
  box-shadow: var(--toc-shadow);
  padding: 12px 14px;
}

.toc.is-sticky {
  position: sticky;
  top: calc(var(--nav-height, 48px) + 8px);
  z-index: 5;
}

.toc-header {
  font-weight: 600;
  font-size: 14px;
  color: var(--toc-muted);
  letter-spacing: 0.2px;
  margin-bottom: 6px;
}

.toc-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
}

.toc-item { margin: 0; }

.toc-link {
  display: block;
  padding: 8px 10px;
  border-radius: 10px;
  color: var(--toc-text);
  text-decoration: none;
  font-size: 14px;
  line-height: 1.4;
  background: transparent;
  transition: background-color 0.18s ease, color 0.18s ease;
}

.toc-link:hover {
  background: var(--surface-hover);
}

.toc-link.is-active,
.toc-link[aria-current="true"] {
  background: var(--accent-tint-10);
  color: var(--toc-accent);
}

@media (max-width: 768px) {
  .toc { padding: 10px 12px; }
  .toc-link { font-size: 13px; padding: 7px 9px; }
}