/*
 * JHMG color theme for the scoping guide.
 * Loaded after project-scoping-doc.css / bl-css.css and re-declares the BrainLeaf greens
 * (#78d192, #77d193, #34856b, #2f936e, #45b18f, #78d292, #abdbbc, #447553) with JHMG colors.
 * Selectors intentionally match the originals so the cascade stays the same.
 */
:root {
  --jhmg-blue: #0c62fb;       /* accent text + buttons (4.9:1 on white) */
  --jhmg-blue-deep: #002faf;  /* hover */
  --jhmg-navy: #000a25;
  --jhmg-cyan: #1be1f2;       /* decorative borders */
  --jhmg-cyan-pale: #c9f6fa;  /* tinted backgrounds */
  --jhmg-cyan-soft: #a3eef5;
}

/* page banner + mobile TOC drawer */
#learn-project-scoping .guide-banner { background: var(--jhmg-navy); border-bottom: 4px solid var(--jhmg-cyan); }
.off-canvas--learn-project-scoping { background: var(--jhmg-navy); }

/* headings */
h1, h2, h3, h4 { color: var(--jhmg-blue); }
h3 { color: var(--jhmg-blue); }

/* callouts */
.note-box { background: var(--jhmg-cyan-pale); }
blockquote { border-left-color: var(--jhmg-cyan); }
.protips { border-left-color: var(--jhmg-cyan); }
.simple-list li { border-left-color: var(--jhmg-cyan-soft); }
.simple-list li strong { color: var(--jhmg-blue); }

/* table of contents */
.toc-nav-list > .learning-content li a:hover { color: var(--jhmg-blue); }
.toc-nav-list > .learning-content > li::before { color: var(--jhmg-blue); }
.toc-nav-list > .learning-content > li > a strong { color: var(--jhmg-blue); }
.toc-scroll-container::-webkit-scrollbar-thumb { background-color: var(--jhmg-blue); }

/* active TOC item (dark card, so cyan reads well here) */
.toc-nav-list .learning-content li.has-active-child { background: #0f1c41; }
.toc-nav-list .learning-content li.has-active-child a.is-active { color: var(--jhmg-cyan); }
.is-active-link::before { background-color: var(--jhmg-cyan); }

/* chapter headings */
#learn-project-scoping #content-main .chapter-button { color: var(--jhmg-blue); border-bottom-color: var(--jhmg-blue); }
.chapter-button:hover { color: var(--jhmg-blue-deep); }

/* buttons: outlined pill, fills on hover (like the live JHMG buttons) */
.button { border-color: var(--jhmg-blue); color: var(--jhmg-blue); border-radius: 40px; }
button:hover, button:focus, .button:hover, .button:focus { background-color: var(--jhmg-blue); color: #fff; }
.guide-content-main a.button { color: var(--jhmg-blue); }
.guide-content-main a.button:hover, .guide-content-main a.button:focus { color: #fff; }
/* mobile "Table Of Contents" bar stays solid grey */
.toc-header .button,
.toc-header .button:hover,
.toc-header .button:focus { background-color: #474747; color: #fff; border-radius: 0; }

/* back to top */
#backtotop:hover { background: var(--jhmg-blue); }