/* ===========================================================================
   Intelligent Actuaries brand palette
   Warm cream / charcoal neutrals (never pure white or black), forest-green
   primary ("shipped"), clay/amber warn ("in progress"). Blue/violet accents
   used sparingly. See ICONOGRAPHY.md + the brand token table.
   =========================================================================== */

/* ---- Light theme — warm cream (default) ---- */
[data-md-color-scheme="default"] {
  --ia-bg:        #E8E4D8;  /* page field, warm greige cream */
  --ia-bg-1:      #F2EEE2;  /* lighter cream, inset panels */
  --ia-bg-2:      #DAD5C6;  /* deeper cream, hover / footer */
  --ia-border:    #CDC7B8;  /* warm tan hairline */
  --ia-fg:        #181715;  /* warm near-black, primary ink */
  --ia-fg-mute:   #5E5A52;  /* warm muted text */
  --ia-fg-dim:    #8C8476;  /* warm dim text */
  --ia-primary:   #30915F;  /* forest green — "shipped" */
  --ia-warn:      #C87D32;  /* clay-orange — "in progress" */
  --ia-error:     #B73A3A;
  --ia-accent2:   #3760CC;  /* blue */
  --ia-accent3:   #7649C7;  /* violet */
  --ia-link-hover:#277A4F;

  --md-default-bg-color:             var(--ia-bg);
  --md-default-fg-color:             var(--ia-fg);
  --md-default-fg-color--light:      var(--ia-fg-mute);
  --md-default-fg-color--lighter:    var(--ia-fg-dim);
  --md-default-fg-color--lightest:   var(--ia-border);

  --md-primary-fg-color:             var(--ia-fg);     /* masthead = ink */
  --md-primary-fg-color--light:      #2C2721;
  --md-primary-fg-color--dark:       #0F0E0D;
  --md-primary-bg-color:             var(--ia-bg-1);   /* header text = cream */
  --md-primary-bg-color--light:      var(--ia-bg-2);

  --md-accent-fg-color:              var(--ia-link-hover);
  --md-accent-fg-color--transparent: rgba(48, 145, 95, 0.1);

  --md-typeset-color:                var(--ia-fg);
  --md-typeset-a-color:              var(--ia-primary);
  --md-typeset-mark-color:           rgba(200, 125, 50, 0.28);

  --md-code-bg-color:                var(--ia-bg-1);
  --md-code-fg-color:                var(--ia-fg);

  --md-footer-bg-color:              var(--ia-bg-2);
  --md-footer-bg-color--dark:        var(--ia-bg-2);
  --md-footer-fg-color:              var(--ia-fg);
  --md-footer-fg-color--light:       var(--ia-fg-mute);
  --md-footer-fg-color--lighter:     var(--ia-fg-dim);
}

/* ---- Dark theme — warm charcoal ---- */
[data-md-color-scheme="slate"] {
  --ia-bg:        #1B1815;  /* warm charcoal page */
  --ia-bg-1:      #221E1A;  /* inset panels */
  --ia-bg-2:      #2C2721;  /* hover / footer */
  --ia-border:    #423A31;  /* hairline */
  --ia-fg:        #F1ECDF;  /* warm off-white ink */
  --ia-fg-brand:  #FAF6EA;  /* brighter brand ink */
  --ia-fg-mute:   #AAA294;  /* muted text */
  --ia-fg-dim:    #746C60;  /* dim text */
  --ia-primary:   #82D7AF;  /* vibrant forest green */
  --ia-warn:      #EBB46E;  /* amber */
  --ia-error:     #E66E6E;
  --ia-accent2:   #82A0E6;  /* blue */
  --ia-accent3:   #B48CE6;  /* violet */
  --ia-link-hover:#A6E6C6;

  --md-default-bg-color:             var(--ia-bg);
  --md-default-fg-color:             var(--ia-fg);
  --md-default-fg-color--light:      var(--ia-fg-mute);
  --md-default-fg-color--lighter:    var(--ia-fg-dim);
  --md-default-fg-color--lightest:   var(--ia-border);

  --md-primary-fg-color:             var(--ia-bg-1);   /* masthead panel */
  --md-primary-fg-color--light:      var(--ia-bg-2);
  --md-primary-fg-color--dark:       var(--ia-bg);
  --md-primary-bg-color:             var(--ia-fg-brand);
  --md-primary-bg-color--light:      var(--ia-fg-mute);

  --md-accent-fg-color:              var(--ia-link-hover);
  --md-accent-fg-color--transparent: rgba(130, 215, 175, 0.12);

  --md-typeset-color:                var(--ia-fg);
  --md-typeset-a-color:              var(--ia-primary);
  --md-typeset-mark-color:           rgba(235, 180, 110, 0.28);

  --md-code-bg-color:                var(--ia-bg-1);
  --md-code-fg-color:                var(--ia-fg);

  --md-footer-bg-color:              var(--ia-bg-2);
  --md-footer-bg-color--dark:        var(--ia-bg);
  --md-footer-fg-color:              var(--ia-fg);
  --md-footer-fg-color--light:       var(--ia-fg-mute);
  --md-footer-fg-color--lighter:     var(--ia-fg-dim);
}

/* Warm-tint a few surfaces Material leaves on its own defaults */
[data-md-color-scheme] .md-header,
[data-md-color-scheme] .md-tabs {
  background-color: var(--md-primary-fg-color);
  color: var(--md-primary-bg-color);
}

/* Admonition / note accents in the brand palette */
[data-md-color-scheme] .md-typeset .admonition.note,
[data-md-color-scheme] .md-typeset details.note { border-color: var(--ia-primary); }
[data-md-color-scheme] .md-typeset .note > .admonition-title,
[data-md-color-scheme] .md-typeset .note > summary { background-color: var(--md-accent-fg-color--transparent); }

[data-md-color-scheme] .md-typeset .admonition.tip,
[data-md-color-scheme] .md-typeset details.tip { border-color: var(--ia-primary); }

[data-md-color-scheme] .md-typeset .admonition.warning,
[data-md-color-scheme] .md-typeset details.warning,
[data-md-color-scheme] .md-typeset .admonition.danger,
[data-md-color-scheme] .md-typeset details.danger { border-color: var(--ia-warn); }

/* Inline code chips: warm panel, not a clashing pink */
[data-md-color-scheme] .md-typeset code {
  background-color: var(--ia-bg-2);
  color: var(--ia-fg);
}

/* Screenshots: rounded corners, subtle border + shadow, full-width */
.md-typeset img.shadow {
  width: 100%;
  border-radius: 10px;
  border: 1px solid var(--md-default-fg-color--lightest);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
  margin: 0.8rem 0 1.2rem;
}

[data-md-color-scheme="slate"] .md-typeset img.shadow {
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.5);
}

/* ---------------------------------------------------------------------------
   IA schematic diagrams — inline SVG in the website iconography language:
   single-stroke, monochrome, currentColor, rounded. See ICONOGRAPHY.md §10.
   --------------------------------------------------------------------------- */
.md-typeset figure.ia-diagram {
  /* override Material's `display: table` so the figure fills the column
     instead of shrinking to its content */
  display: block;
  width: 100%;
  margin: 1.4rem auto 1.8rem;
  text-align: center;
  /* a touch lighter than body text — the docs equivalent of text-fg-mute */
  color: var(--md-default-fg-color--light);
}

.md-typeset figure.ia-diagram svg {
  display: inline-block;
  width: 100%;
  height: auto;
  max-width: 760px;
}

/* uppercase tag labels inside diagrams */
.md-typeset figure.ia-diagram .ia-tag {
  font-family: var(--md-code-font-family, "JetBrains Mono", monospace);
  font-size: 8px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.md-typeset figure.ia-diagram .ia-title {
  font-family: var(--md-text-font-family, "Inter", system-ui, sans-serif);
  font-weight: 600;
}

.md-typeset figure.ia-diagram .ia-sub {
  font-family: var(--md-text-font-family, "Inter", system-ui, sans-serif);
  fill-opacity: 0.7;
}

.md-typeset figure.ia-diagram figcaption {
  margin-top: 0.5rem;
  font-size: 0.74rem;
  color: var(--md-default-fg-color--lighter);
}
