/**
 * toc.css — Table of Contents styles
 * Site: ashrudral.com
 * Scoped entirely inside .toc and .toc-inner.
 * No resets, no globals, no conflicts with existing theme CSS.
 */

/* ─── TOC wrapper ─────────────────────────────────────────────────────────── */

.toc {
  /* nav.toc is a passive wrapper — no visual styles here.
     Sizing and scroll behaviour live on .c3-right-sidebar in your main CSS. */
  display: block;
}

/* ─── TOC list ────────────────────────────────────────────────────────────── */

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

/* ─── TOC items ───────────────────────────────────────────────────────────── */

.toc-item {
  margin: 0;
  padding: 0;
  line-height: 1.4;
}

/* ─── Indentation by heading level ───────────────────────────────────────── */
/* H1 = no indent (top-level), each level adds 12px */

.toc-level-1 { padding-left: 0; }
.toc-level-2 { padding-left: 12px; }
.toc-level-3 { padding-left: 24px; }
.toc-level-4 { padding-left: 36px; }
.toc-level-5 { padding-left: 48px; }
.toc-level-6 { padding-left: 60px; }

/* ─── TOC links ───────────────────────────────────────────────────────────── */

.toc-link {
  display: block;
  padding: 5px 8px;
  border-radius: 4px;
  font-size: 0.85rem;
  line-height: 1.45;
  color: var(--wp--preset--color--foreground, currentColor);
  text-decoration: none;
  opacity: 0.65;
  transition: opacity 0.2s ease, background-color 0.2s ease, color 0.2s ease;
  word-break: break-word;
}

.toc-link:hover {
  opacity: 1;
  background-color: var(--wp--preset--color--custom-bg-sidebar-18, rgba(0, 0, 0, 0.04));
  text-decoration: none;
}

/* ─── Active state ────────────────────────────────────────────────────────── */

.toc-item.toc-active > .toc-link {
  opacity: 1;
  font-weight: 600;
  color: var(--wp--preset--color--primary, currentColor);
  background-color: transparent;
}

/* Optional: left accent bar on active item */
.toc-item.toc-active > .toc-link {
  border-left: 2px solid var(--wp--preset--color--primary, currentColor);
  padding-left: 6px; /* compensates for border width */
}

/* ─── "On this page" label ────────────────────────────────────────────────── */

.toc-label {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.45;
  margin: 0 0 10px 0;
  padding: 0 8px;
}

/* ─── Empty state: hide nav.toc if no headings were found ────────────────── */
/* JS adds .toc-empty when the page has no headings */

.toc.toc-empty {
  display: none;
}

/* ─── Responsive: hide TOC label on mobile (sidebar is overlay, space is tight) */

@media (max-width: 879px) {
  .toc-label {
    display: none;
  }
}