/* ==========================================================
   1. MAIN PAGE TITLE (H1)
========================================================== */
.md-typeset h1 {
  font-weight: 800; /* Makes it thick and bold */
  color: var(--md-default-fg-color); /* Removes the faded, washed-out look */
  margin-bottom: 0.5em; /* Drastically reduces the huge gap below the title */
  letter-spacing: -0.02em; /* Slightly tightens the letters for a modern, sleek look */
}

/* Add a subtle horizontal rule under the main title to separate the header from the content */
.md-typeset h1::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  background-color: var(--md-primary-fg-color);
  margin-top: 0.1em;
  opacity: 0.2; /* Keeps it dim so it doesn't compete with your H2 blocks */
}

/* ==========================================================
   2. MAJOR SECTIONS (H2 TERMINAL BLOCKS)
========================================================== */
.md-typeset h2 {
  /* Terminal Block Structure & Spacing */
  background: var(--md-code-bg-color);
  border-left: 6px solid var(--md-primary-fg-color);
  padding: 0.3em 0 0.3em 0.6em; /* top, right, bottom, left */
  margin: 0.4em 0 0.5em; /* top, horizontal, bottom */
  
  /* Typography & Color */
  font-weight: 800; 
  color: var(--md-default-fg-color); 
}

/* Pull the first H2 closer to the H1 title line */
.md-typeset h1 + h2 {
  margin-top: 0; 
}

/* If you have a small paragraph intro before the first H2, keep it tight */
.md-typeset h1 + p + h2 {
  margin-top: 1.2em; 
}

/* ==========================================================
   3. SUB-SECTIONS (H3 MONOSPACE LABELS)
========================================================== */
.md-typeset h3 {
  font-family: var(--md-code-font-family); 
  font-weight: 600;
  color: var(--md-primary-fg-color);
  letter-spacing: 0.05em; 
  text-transform: uppercase;
  font-size: 1.05em; 
  margin-top: 0.8em; 
  border-bottom: 1px dashed #64b5f6; /* <-- Crisp, blueprint light blue */
  padding-bottom: 0.2em;
}

/* ==========================================================
   4. TABLE OF CONTENTS (CLEAN HIERARCHY & SCROLL TRACKING)
========================================================== */

/* Main Sections (H2s): Make them bold and give them breathing room */
.md-sidebar--secondary .md-nav__list > .md-nav__item > .md-nav__link {
  font-weight: 700;
  margin-top: 0.6em; /* Separates major chunks in the ToC */
}

/* Sub-Sections (H3s): Smaller, indented, NO vertical bars */
.md-sidebar--secondary .md-nav__list .md-nav__list .md-nav__link {
  font-weight: 400;
  font-size: 0.85em; /* Scales down to show it's a sub-item */
  margin-left: 0.8em; /* Clean indentation */
}

/* Deeply Nested Items (H4 and below): Further indentation */
.md-sidebar--secondary .md-nav__list .md-nav__list .md-nav__list .md-nav__link {
  margin-left: 1.6em; /* Pushes it further right (font-size inherited from above) */
}

/* Restore and force the active state highlight for scroll tracking */
.md-sidebar--secondary .md-nav__link[data-md-state="active"],
.md-sidebar--secondary .md-nav__link--active {
  color: var(--md-primary-fg-color) !important;
  font-weight: 600 !important;
}

/* ==========================================================
   5. HORIZONTAL RULES (---) AND SPACING
========================================================== */

/* 1. Dramatically reduce the default margins on all horizontal lines */
.md-typeset hr {
  margin: 0.8em 0; /* Reduced from 1.5em to tighten the whole area */
  border-bottom: 1px dashed #64b5f6; /* <-- Matches the H3 light blue */
}

/* 2. Squeeze the gap when a list is right above a line */
.md-typeset ul:has(+ hr),
.md-typeset ol:has(+ hr) {
  margin-bottom: 0.2em !important; /* Kills the list's bottom margin */
}

/* 3. Squeeze the gap when an H2 is right below a line */
.md-typeset hr:has(+ h2) {
  margin-bottom: 0.2em !important; /* Kills the line's bottom margin */
}

/* 4. When a Terminal Block H2 immediately follows a line, pull it up tight */
.md-typeset hr + h2 {
  margin-top: 0.5em !important; /* Forces the H2 to tuck snugly under the line */
}

/* 5. Cover the edge case where there might be a blank paragraph between them */
.md-typeset hr + p + h2 {
  margin-top: 0.8em; 
}

/* ==========================================================
   6. LIST SPACING (UL / OL) - AGGRESSIVE TIGHTENING
========================================================== */

/* 1. Squeeze the main container of the list */
.md-typeset ul,
.md-typeset ol {
  margin-top: 0.5em;    /* Reduces the gap above the entire list */
  margin-bottom: 0.5em; /* Reduces the gap below the entire list */
}

/* 2. Squeeze the gap BETWEEN individual list items */
.md-typeset li {
  margin-top: 0.2em; /* Brings items like 1, 2, and 3 much closer together */
}

/* 3. Force tight spacing when a list IMMEDIATELY follows a heading */
.md-typeset h2 + ul,
.md-typeset h2 + ol,
.md-typeset h3 + ul,
.md-typeset h3 + ol {
  margin-top: 0.3em !important; /* The !important overrides MkDocs default overrides */
}

/* 4. Force tight spacing when a list follows a regular paragraph (Like in Section A) */

/* Target the paragraph BEFORE the list to kill its default bottom margin */
.md-typeset p:has(+ ul),
.md-typeset p:has(+ ol) {
  margin-bottom: 0.1em !important; 
}

/* Target the list AFTER the paragraph to ensure the top margin stays tight */
.md-typeset p + ul,
.md-typeset p + ol {
  margin-top: 0 !important; 
}

/* 5. Handle "loose" lists (where items contain multiple lines/code, like Section C) */
.md-typeset li > p {
  margin-top: 0.2em;
  margin-bottom: 0.2em;
}