:root {
  /* Primary color (banner, nav items): 6a040f */
  --md-primary-fg-color:        #6a040f;
  --md-primary-fg-color--light: #9d0617;
  --md-primary-fg-color--dark:  #3d0208;

  /* Secondary/Accent color (links): 003049 */
  --md-accent-fg-color:         #003049;
  --md-accent-fg-color--transparent: rgba(0, 48, 73, 0.1);
}

[data-md-color-scheme="slate"] {
  /* In dark mode, 003049 is much too dark for text/links.
     Providing a lightened blue variation for readability */
  --md-accent-fg-color:         #47a3d3;
  --md-accent-fg-color--transparent: rgba(71, 163, 211, 0.1);

  /* The primary red (6a040f) is lightened for dark mode left navigation readability */
  --md-primary-fg-color:        #d62828;
}

/* Make the logo/icon about 40% larger */
.md-header__button.md-logo img, .md-header__button.md-logo svg {
  transform: scale(1.4);
}

/* Web Build specific Mermaid styling matching our theme but similar structure to print output */
:root {
  /* Match "primaryColor", "mainBkg" */
  --md-mermaid-node-bg-color: #ffffff;
  
  /* Match "primaryBorderColor", "nodeBorder" */
  --md-mermaid-node-border-color: #6a040f; 

  /* Match "primaryTextColor" */
  --md-mermaid-node-fg-color: #6a040f;
  
  /* Match "lineColor", "edgeColor" */
  --md-mermaid-edge-color: #003049;

  /* Match "noteBkgColor" */
  --md-mermaid-label-bg-color: #ffffff;

  /* Match "noteTextColor" */
  --md-mermaid-label-fg-color: #003049;
}

[data-md-color-scheme="slate"] {
  /* Dark mode overrides (since print config only handles light/print) */
  --md-mermaid-node-bg-color: #2b2b2b;
  --md-mermaid-node-border-color: #d62828;
  --md-mermaid-node-fg-color: #e0e0e0;
  --md-mermaid-edge-color: #47a3d3;
  --md-mermaid-label-bg-color: #2b2b2b;
  --md-mermaid-label-fg-color: #47a3d3;
}

/* Mimic "themeCSS" overrides applied specifically to web mermaid SVGs */
/* Invincible Node Overrides */
.mermaid [class*="section-"] rect,
.mermaid [class*="section-"] path,
.mermaid [class*="section-"] circle,
.mermaid [class*="section-"] polygon,
.mermaid .node path,
.mermaid .node rect,
.mermaid .node circle,
.mermaid .node polygon {
  fill: var(--md-mermaid-node-bg-color) !important;
  stroke: var(--md-mermaid-node-border-color) !important;
  stroke-width: 2px !important;
}

/* Ensure arrows or other markers on edges don't get the node background color */
.mermaid path[class*="section-edge"] {
  fill: none !important;
}

/* Invincible Text Overrides */
.mermaid [class*="section-"] text,
.mermaid [class*="section-"] span,
.mermaid .node text,
.mermaid .node span,
.mermaid .nodeLabel,
.mermaid .nodeLabel span,
.mermaid .nodeLabel div,
.mermaid .markdown-node-label,
.mermaid .markdown-node-label span,
.mermaid .markdown-node-label div {
  color: var(--md-mermaid-node-fg-color) !important;
  fill: var(--md-mermaid-node-fg-color) !important;
  stroke: none !important;
}

/* Invincible Edge Overrides */
.mermaid .edgePaths path,
.mermaid .edgePath path,
.mermaid path[class*="edge"],
.mermaid path[class*="section-edge"],
.mermaid path[data-edge="true"],
.mermaid g[class*="edge"] path {
  stroke: var(--md-mermaid-edge-color) !important;
  stroke-width: 3px !important;
}

/* Image Figure overrides for closer captions */
figure.bot-figure {
  margin-top: 1.2rem; /* Gap before image (same as typical paragraph margin) */
  margin-bottom: 0.4rem; /* Small gap below the caption */
  display: flex;
  flex-direction: column;
  align-items: center;
}

figure.bot-figure img {
  margin: 0 !important; /* Removes MkDocs default bottom margin on images */
}

figure.bot-figure figcaption {
  margin-top: 0.4rem; /* Small gap between the image and the caption */
  margin-bottom: 0;
  font-size: 0.9em;
  font-style: italic;
  color: var(--md-default-fg-color--light, #666);
  text-align: center;
}
