/* Table-of-contents shell, hierarchy, active item, and active parent chain. */

/* 2) TOC sidebar – neon card, no default bar */
/* Container = pure wrapper, no card */
body.dark .toc-container {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}
/* Kill any default vertical bar / pseudo ornaments */
body.dark .toc * {
  border-left: none !important;
}
body.dark .toc::before,
body.dark .toc::after,
body.dark .toc *::before,
body.dark .toc *::after {
  content: none !important;
  border: 0 !important;
  background: transparent !important;
}
/* Actual TOC box */
body.dark .toc {
  background-color: #050814 !important;
  border-radius: 10px;
  border: 1px solid rgba(96, 165, 250, 0.75);
  box-shadow:
    0 0 18px rgba(56, 189, 248, 0.45),
    0 0 32px rgba(129, 140, 248, 0.35);
  padding: 10px 14px !important;
}
/* Links */
body.dark .toc a.toc-link {
  color: #e5e7eb !important;
}
/* Active link – neon bar via inset shadow, not border-left */
body.dark .toc a.toc-link.is-active-link {
  box-shadow: inset 3px 0 0 #7dd3fc;
  padding-left: 8px;
  font-weight: 600;
  color: #7dd3fc !important;
}

/* 3) TOC sidebar – light card with neon accent */
body:not(.dark) .toc-container {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}
/* kill plugin's left border / decoration */
body:not(.dark) .toc * {
  border-left: none !important;
}
body:not(.dark) .toc::before,
body:not(.dark) .toc::after,
body:not(.dark) .toc *::before,
body:not(.dark) .toc *::after {
  content: none !important;
  border: 0 !important;
  background: transparent !important;
}
/* card itself */
body:not(.dark) .toc {
  background: #ffffff;
  border-radius: 10px;
  border: 1px solid rgba(209, 213, 219, 0.9);
  box-shadow:
    0 12px 26px rgba(15, 23, 42, 0.12),
    0 0 14px rgba(239, 68, 68, 0.35);
  padding: 10px 14px !important;
}
body:not(.dark) .toc a.toc-link {
  color: #111827 !important;
}
/* active item = red neon bar */
body:not(.dark) .toc a.toc-link.is-active-link {
  box-shadow: inset 3px 0 0 #ef4444;
  padding-left: 8px;
  font-weight: 600;
  color: #b91c1c !important;
}

/* ==============================
   TOC
============================== */

/* container */
.toc {
  font-size: 14px;
  line-height: 1.55;
}

/* spacing between items */
.toc .toc-list-item {
  margin-bottom: 0.45em;
}

/* spacing between parent → children */
.toc .toc-list .toc-list {
  margin-top: 0.35em;
}

/* links */
.toc .toc-link {
  display: flex;
  align-items: flex-start;
  gap: 0.6em;

  text-decoration: none;
  line-height: 1.2;

  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;

  opacity: 0.65;
  transition: opacity 0.15s ease, font-weight 0.15s ease;
}

/* number column */
.toc .toc-link::before {
  content: attr(data-number);
  flex-shrink: 0;

  width: 3.2em;
  text-align: right;

  font-size: 12px;
  opacity: 0.45;
  font-variant-numeric: tabular-nums;
}

/* number width by depth */
.toc .node-name--H1::before { width: 2.6em; }
.toc .node-name--H2::before { width: 3.2em; }
.toc .node-name--H3::before,
.toc .node-name--H4::before { width: 3.8em; }

/* size descent by depth */
.toc .toc-link.node-name--H1 { font-size: 1em; }
.toc .toc-link.node-name--H2 { font-size: 0.99em; }
.toc .toc-link.node-name--H3 { font-size: 0.95em; }
.toc .toc-link.node-name--H4 { font-size: 0.92em; }

/* default depth quieting */
.toc .toc-link.node-name--H3 {
  opacity: 0.7;
}

/**
 * ACTIVE ITEM
 */

/* day */
body:not(.dark) .toc .toc-link.is-active-link {
  color: #b91c1c !important;
  font-weight: 600;
  opacity: 1;
  box-shadow: inset 3px 0 0 #ef4444;
  padding-left: 8px;
}

body:not(.dark) .toc .toc-link.is-active-link::before {
  opacity: 0.85;
}

/* dark */
body.dark .toc .toc-link.is-active-link {
  color: #7dd3fc !important;
  font-weight: 600;
  opacity: 1;
  box-shadow: inset 3px 0 0 #7dd3fc;
  padding-left: 8px;
}

body.dark .toc .toc-link.is-active-link::before {
  opacity: 0.85;
}

/**
 * ACTIVE PARENT CHAIN
 */
 
/* generic parent visibility */
.toc li:has(> .toc-list .is-active-link) > .toc-link {
  opacity: 1;
  font-weight: 500;
}

/* day – muted red for parents */
body:not(.dark) .toc .toc-link.is-active-parent {
  color: rgba(185, 28, 28, 0.65) !important;
}

/* dark – muted cyan for parents */
body.dark .toc .toc-link.is-active-parent {
  color: rgba(125, 211, 252, 0.65) !important;
}

/* depth tuning for parents */
.toc li:has(> .toc-list .is-active-link) > .toc-link.node-name--H2 {
  opacity: 0.95;
}

.toc li:has(> .toc-list .is-active-link) > .toc-link.node-name--H3 {
  opacity: 0.9;
}