/* ── Number the headings in the main content area ── */
#content {
  counter-reset: section; /* reset at the top of each page */
}

/* H1: "Title" */
#content h1 {
  counter-increment: section;
  counter-reset: subsection; /* reset subsections */
  position: relative;
  margin-left: 0em;
}

/* H2: "1. Subtitle" */
#content h2 {
  counter-increment: subsection;
  counter-reset: subsubsection; /* reset subsubsections */
  position: relative;
  margin-left: 1em;
}
#content h2::before {
  content: counter(subsection) ".";
  display: inline-block;
  min-width: 2.5em;           /* reserve space for up to 2-digit numbers */
  margin-left: -2.5em;      /* pull into the left margin */
  text-align: right;        /* align numbers to the right edge */
}

/* H3: "1.1 Sub-subtitle" */
#content h3 {
  counter-increment: subsubsection;
  counter-reset: subsubsubsection; /* reset subsubsubsections */
  position: relative;
  margin-left: 1.75em;
}
#content h3::before {
  content: counter(subsection) "." counter(subsubsection);
  display: inline-block;
  min-width: 3em;           /* allow extra width (e.g. “10.12”) */
  margin-left: -3.5em;
  text-align: right;
}

/* H4: "1.1.1 Sub-sub-subtitle" */
#content h4 {
  counter-increment: subsubsubsection;
  counter-reset: subsubsubsubsection;
  position: relative;
  margin-left: 2.5em;
}
#content h4::before {
  content: counter(subsection) "." counter(subsubsection) "." counter(subsubsubsection);
  display: inline-block;
  min-width: 4em;           /* wider again for deeper levels */
  margin-left: -4.5em;
  text-align: right;
}

/* H5: "1.1.1.1 Sub-sub-subtitle" */
#content h5 {
  counter-increment: subsubsubsubsection;
  counter-reset: subsubsubsubsubsection;
  position: relative;
  margin-left: 3.5em;
}
#content h5::before {
  content: counter(subsection) "." counter(subsubsection) "." counter(subsubsubsection) "." counter(subsubsubsection);
  display: inline-block;
  min-width: 5em;           /* wider again for deeper levels */
  margin-left: -5.5em;
  text-align: right;
}


/* Reset counters (keep as you had) */
#right-sidebar ul            { counter-reset: l1; list-style:none; padding-left:0; margin:0; }
#right-sidebar ul ul         { counter-reset: l2; list-style:none; padding-left:0; margin:0; }
#right-sidebar ul ul ul      { counter-reset: l3; list-style:none; padding-left:0; margin:0; }
#right-sidebar ul ul ul ul   { counter-reset: l4; list-style:none; padding-left:0; margin:0; }

/* Common: two‑column grid per item; column 1 = number, column 2 = text */
#right-sidebar li {
  display: grid;
  grid-template-columns: 0 19em;   /* level 1 default; deeper levels override */
  column-gap: 1.5em;
  align-items: start;
  margin: .05em;
}

/* Make the pseudo‑element (number) live in column 1 */
#right-sidebar li::before { grid-column: 1; text-align: right; white-space: nowrap; }

/* Make the link fill column 2 and wrap nicely */
#right-sidebar li > a {
  grid-column: 2;
  display: block;
  word-break: normal;           /* don't break inside words */
  overflow-wrap: break-word;    /* break long words if needed */
  hyphens: auto;                /* optional: prettier long-word breaks */
  line-height: 1.25;
}

/* Level 1 */
#right-sidebar ul > li {
  grid-template-columns: 0.5 18.5em;   /* level 1 default; deeper levels override */
  counter-increment: l1;
}

#right-sidebar ul > li::before {
  content: counter(l1) ".";
}

/* Level 2 */
#right-sidebar ul ul > li {
  grid-template-columns: 1em 17.5em;   /* wider number column for 10.12 etc. */
  counter-increment: l2;
}
#right-sidebar ul ul > li::before {
  content: counter(l1) "." counter(l2);
}

/* Level 3 */
#right-sidebar ul ul ul > li {
  grid-template-columns: 3em 15em;
  counter-increment: l3;
}
#right-sidebar ul ul ul > li::before {
  content: counter(l1) "." counter(l2) "." counter(l3);
}

/* Level 4 */
#right-sidebar ul ul ul ul > li {
  grid-template-columns: 4em 15em;
  counter-increment: l4;
}
#right-sidebar ul ul ul ul > li::before {
  content: counter(l1) "." counter(l2) "." counter(l3) "." counter(l4);
}



/* ── Update cell styles for myst-nb ── */
/* ── Enhanced cell styles ── */
.input-cell .cell_input {
  background: #f7f7f7 !important;
  border-left: 4px solid #388E3C !important;
  border-radius: 0 !important;
  padding: 0.5em 1em !important;
  margin-bottom: 0 !important;
}

.output-cell .cell_output {
  background: #fafafa !important;
  border-left: 4px solid #1976D2 !important;
  border-radius: 0 !important;
  padding: 0.5em 1em !important;
  margin-top: 0 !important;
}

/* Style for code blocks in output */
.output-cell .cell_output div.highlight {
  background: #fafafa !important;
  border: none !important;
}

/* Remove background from input code blocks */
.input-cell .cell_input div.highlight {
  background: none !important;
  padding: 0 !important;
}

/* Folding styles */
.folded-output {
  background: #fafafa !important;
  border-left: 4px solid #1976D2 !important;
  margin-top: 0.5rem !important;
  padding: 0.5em 1em !important;
}

.folded-summary {
  cursor: pointer;
  font-weight: bold;
  color: #1976D2;
}

.folded-summary::before {
  content: "▶";
  display: inline-block;
  margin-right: 6px;
  transition: transform 0.2s;
  font-size: 0.8em;
}

details[open] > .folded-summary::before {
  transform: rotate(90deg);
}

/* Add margin between cells */
div.cell + div.cell {
  margin-top: 1.5rem !important;
}

/* Make pandas/Jupyter tables scroll instead of squish */
#content .cell_output.docutils.container table {
  display: block;          /* detach from flow so overflow works */
  overflow-x: auto;        /* horizontal scrollbar */
  width: max-content;      /* keep natural width */
  max-width: 100%;         /* but don’t exceed container */
  border-collapse: collapse;
}

/* Don’t wrap cell text; keep rows compact */
#content .cell_output.docutils.container table th,
#content .cell_output.docutils.container table td {
  white-space: nowrap;     /* critical: avoid wrapping inside cells */
  vertical-align: top;
}

/* If text outputs appear smashed: allow horizontal scroll */
#content .cell_output.docutils.container pre {
  overflow-x: auto;
  white-space: pre;        /* keep monospace alignment */
}