/* ═══════════════════════════════════════════════════════════════
   Array Design System — MkDocs Material Color Overrides
   Source: John Tyler's color-usage-rules.md & color-application-spec.md
   ═══════════════════════════════════════════════════════════════ */

/* ── Light Scheme: "array" ────────────────────────────────────── */

[data-md-color-scheme="array"] {

  /* Primary — header, sidebar chrome, footer */
  --md-primary-fg-color:             #100F16; /* purple-950 (brand/dark — unified dark backdrop) */
  --md-primary-fg-color--light:      #9679FF; /* purple-400 */
  --md-primary-fg-color--dark:       #100F16; /* purple-950 (brand/dark) */
  --md-primary-bg-color:             #FFFFFF;
  --md-primary-bg-color--light:      rgba(255, 255, 255, 0.7);

  /* Accent — hovers, buttons, scrollbars */
  --md-accent-fg-color:              #3462DF; /* blue-500 (live theme's interactive/action color) */
  --md-accent-fg-color--transparent: rgba(52, 98, 223, 0.1);
  --md-accent-bg-color:              #FFFFFF;
  --md-accent-bg-color--light:       rgba(255, 255, 255, 0.7);

  /* Default surface & text */
  --md-default-fg-color:             #181A1C; /* neutral-900 */
  --md-default-fg-color--light:      #5D656E; /* neutral-500 */
  --md-default-fg-color--lighter:    #7A8188; /* neutral-400 */
  --md-default-fg-color--lightest:   #B8BCC0; /* neutral-200 */
  --md-default-bg-color:             #FAFAFA; /* neutral-50 */
  --md-default-bg-color--light:      rgba(250, 250, 250, 0.7);
  --md-default-bg-color--lighter:    rgba(250, 250, 250, 0.3);
  --md-default-bg-color--lightest:   rgba(250, 250, 250, 0.07);

  /* Code blocks */
  --md-code-fg-color:                #181A1C; /* neutral-900 */
  --md-code-bg-color:                #F3F2FF; /* purple-50 */
  --md-code-hl-color:                rgba(106, 155, 255, 0.2); /* blue-300 @ 20% */
  --md-code-hl-keyword-color:        #8353FF; /* purple-500 */
  --md-code-hl-string-color:         #097151; /* green-700 (WCAG safe on light) */
  --md-code-hl-number-color:         #3462DF; /* blue-500 (WCAG safe on light) */
  --md-code-hl-comment-color:        #7A8188; /* neutral-400 */
  --md-code-hl-function-color:       #3462DF; /* blue-500 */
  --md-code-hl-special-color:        #6544C1; /* purple-600 */
  --md-code-hl-constant-color:       #3462DF; /* blue-500 */
  --md-code-hl-name-color:           #6544C1; /* purple-600 (attributes/keys) */

  /* Typeset */
  --md-typeset-color:                #181A1C; /* neutral-900 */
  --md-typeset-a-color:              #3462DF; /* blue-500 (accent/link token) */
  --md-typeset-del-color:            rgba(255, 71, 73, 0.15);  /* red-500 @ 15% */
  --md-typeset-ins-color:            rgba(32, 212, 152, 0.15);  /* green-500 @ 15% */
  --md-typeset-mark-color:           rgba(237, 178, 0, 0.25);   /* yellow-500 @ 25% */
  --md-typeset-table-color:          rgba(24, 26, 28, 0.12);    /* neutral-900 @ 12% */

  /* Footer */
  --md-footer-fg-color:              #FAFAFA; /* neutral-50 */
  --md-footer-fg-color--light:       rgba(250, 250, 250, 0.7);
  --md-footer-fg-color--lighter:     rgba(250, 250, 250, 0.3);
  --md-footer-bg-color:              #100F16; /* purple-950 (brand/dark) */
  --md-footer-bg-color--dark:        #100F16; /* purple-950 (brand/dark) */

  /* Warning bar */
  --md-warning-fg-color:             #524000; /* yellow-800 */
  --md-warning-bg-color:             #FFFBE5; /* yellow-50 */
}


/* ── Dark Scheme: "array-dark" ────────────────────────────────── */

[data-md-color-scheme="array-dark"] {

  --md-primary-fg-color:             #100F16; /* purple-950 (brand/dark — unified backdrop, same in both themes) */
  --md-primary-fg-color--light:      #9679FF; /* purple-400 */
  --md-primary-fg-color--dark:       #100F16; /* purple-950 (brand/dark) */
  --md-primary-bg-color:             #FFFFFF; /* header text/icon color — white on the dark bar */
  --md-primary-bg-color--light:      rgba(255, 255, 255, 0.7);

  --md-accent-fg-color:              #6A9BFF; /* blue-300 (accent blue) */
  --md-accent-fg-color--transparent: rgba(106, 155, 255, 0.1);
  --md-accent-bg-color:              #100F16;
  --md-accent-bg-color--light:       rgba(16, 15, 22, 0.7);

  --md-default-fg-color:             #FAFAFA; /* neutral-50 */
  --md-default-fg-color--light:      #D9DADC; /* neutral-100 */
  --md-default-fg-color--lighter:    #999EA3; /* neutral-300 */
  --md-default-fg-color--lightest:   #5D656E; /* neutral-500 */
  --md-default-bg-color:             #100F16; /* purple-950 (brand/dark) */
  --md-default-bg-color--light:      #2E2650; /* purple-800 */
  --md-default-bg-color--lighter:    #483587; /* purple-700 */
  --md-default-bg-color--lightest:   #483587; /* purple-700 */

  --md-code-fg-color:                #D9DADC; /* neutral-100 */
  --md-code-bg-color:                #2E2650; /* purple-800 */
  --md-code-hl-color:                rgba(106, 155, 255, 0.2);
  --md-code-hl-keyword-color:        #AB9AFE; /* purple-300 */
  --md-code-hl-string-color:         #20D498; /* green-500 */
  --md-code-hl-number-color:         #6A9BFF; /* blue-300 */
  --md-code-hl-comment-color:        #999EA3; /* neutral-300 */
  --md-code-hl-function-color:       #6A9BFF; /* blue-300 */
  --md-code-hl-special-color:        #AB9AFE; /* purple-300 */
  --md-code-hl-constant-color:       #6A9BFF; /* blue-300 */
  --md-code-hl-name-color:           #9679FF; /* purple-400 */

  --md-typeset-color:                #FAFAFA;
  --md-typeset-a-color:              #6A9BFF; /* blue-300 */
  --md-typeset-del-color:            rgba(255, 71, 73, 0.15);
  --md-typeset-ins-color:            rgba(32, 212, 152, 0.15);
  --md-typeset-mark-color:           rgba(237, 178, 0, 0.25);
  --md-typeset-table-color:          rgba(250, 250, 250, 0.12);

  --md-footer-fg-color:              #FAFAFA;
  --md-footer-fg-color--light:       rgba(250, 250, 250, 0.7);
  --md-footer-fg-color--lighter:     rgba(250, 250, 250, 0.3);
  --md-footer-bg-color:              #100F16;
  --md-footer-bg-color--dark:        #100F16;

  --md-warning-fg-color:             #524000;
  --md-warning-bg-color:             #FFFBE5;
}


/* ═══════════════════════════════════════════════════════════════
   Element-Level Overrides
   (Covers specifics from color-application-spec.md that go beyond
    CSS variable mapping — link states, admonitions, sidebar, etc.)
   ═══════════════════════════════════════════════════════════════ */

/* ── Links: hover, active, visited states ─────────────────────── */

[data-md-color-scheme="array"] .md-typeset a:hover {
  color: #6A9BFF; /* blue-300 */
}

[data-md-color-scheme="array"] .md-typeset a:active {
  color: #6544C1; /* purple-600 */
}

[data-md-color-scheme="array"] .md-typeset a:visited {
  color: #483587; /* purple-700 */
}

[data-md-color-scheme="array-dark"] .md-typeset a:hover {
  color: #9679FF; /* purple-400 */
}

/* ── Left sidebar nav ─────────────────────────────────────────── */

/* Default nav links */
[data-md-color-scheme="array"] .md-nav__link {
  color: #393E43; /* neutral-700 */
}

[data-md-color-scheme="array"] .md-nav__link:hover {
  color: #3462DF; /* blue-500 */
}

/* Active nav link */
[data-md-color-scheme="array"] .md-nav__link--active,
[data-md-color-scheme="array"] .md-nav__link--active:hover {
  color: #3462DF; /* blue-500 */
}

/* Sidebar active indicator */
[data-md-color-scheme="array"] .md-nav__link--active {
  border-left: 3px solid #3462DF;
  padding-left: calc(0.6rem - 3px);
}

/* Sidebar scrollbar */
[data-md-color-scheme="array"] .md-sidebar__scrollwrap::-webkit-scrollbar-thumb {
  background-color: rgba(52, 98, 223, 0.3); /* blue-500 @ 30% */
}

[data-md-color-scheme="array"] .md-sidebar__scrollwrap::-webkit-scrollbar-thumb:hover {
  background-color: #3462DF; /* blue-500 */
}

/* ── Navigation tabs — active indicator ───────────────────────── */

[data-md-color-scheme="array"] .md-tabs__link--active {
  border-bottom: 2px solid #3462DF; /* blue-500 — brand-blue underline, per live Tabs component */
}

[data-md-color-scheme="array-dark"] .md-tabs__link--active {
  border-bottom: 2px solid #6A9BFF; /* blue-300 */
}

/* ── Right sidebar TOC ────────────────────────────────────────── */

[data-md-color-scheme="array"] .md-nav__link--passed,
[data-md-color-scheme="array"] .md-sidebar--secondary .md-nav__link {
  color: #5D656E; /* neutral-500 */
}

[data-md-color-scheme="array"] .md-sidebar--secondary .md-nav__link:hover {
  color: #3462DF; /* blue-500 */
}

[data-md-color-scheme="array"] .md-sidebar--secondary .md-nav__link--active {
  color: #3462DF; /* blue-500 */
  border-left: 2px solid #3462DF;
}

/* ── Inline code ──────────────────────────────────────────────── */

[data-md-color-scheme="array"] .md-typeset code {
  background-color: #F3F2FF; /* purple-50 */
  color: #181A1C;            /* neutral-900 */
  border: 1px solid #DAD7F7; /* purple-100 */
}

[data-md-color-scheme="array-dark"] .md-typeset code {
  background-color: #2E2650; /* purple-800 */
  color: #D9DADC;            /* neutral-100 */
  border: 1px solid #483587; /* purple-700 */
}

/* ── Code block filename tab ──────────────────────────────────── */

[data-md-color-scheme="array"] .md-typeset .filename {
  background-color: #DAD7F7; /* purple-100 */
  color: #282B2F;            /* neutral-800 */
}

/* ── Tables ───────────────────────────────────────────────────── */

[data-md-color-scheme="array"] .md-typeset table:not([class]) th {
  background-color: #FAFAFA; /* neutral-50 */
  color: #393E43;            /* neutral-700 */
  border-bottom: 2px solid #999EA3; /* neutral-300 */
}

[data-md-color-scheme="array"] .md-typeset table:not([class]) td {
  border-bottom: 1px solid rgba(184, 188, 192, 0.5); /* neutral-200 @ 50% */
}

[data-md-color-scheme="array"] .md-typeset table:not([class]) tr:hover td {
  background-color: rgba(243, 242, 255, 0.4); /* purple-50 @ 40% */
}

/* ── Admonitions ──────────────────────────────────────────────── */

/* Note / Info */
[data-md-color-scheme="array"] .md-typeset .admonition.note,
[data-md-color-scheme="array"] .md-typeset details.note,
[data-md-color-scheme="array"] .md-typeset .admonition.info,
[data-md-color-scheme="array"] .md-typeset details.info {
  border-color: #6A9BFF; /* blue-300 */
  background-color: #ECF2FF; /* blue-50 */
}

[data-md-color-scheme="array"] .md-typeset .note > .admonition-title,
[data-md-color-scheme="array"] .md-typeset .note > summary,
[data-md-color-scheme="array"] .md-typeset .info > .admonition-title,
[data-md-color-scheme="array"] .md-typeset .info > summary {
  background-color: rgba(106, 155, 255, 0.15);
  border-color: #6A9BFF;
  color: #3462DF; /* blue-500 */
}

[data-md-color-scheme="array"] .md-typeset .note > .admonition-title::before,
[data-md-color-scheme="array"] .md-typeset .note > summary::before,
[data-md-color-scheme="array"] .md-typeset .info > .admonition-title::before,
[data-md-color-scheme="array"] .md-typeset .info > summary::before {
  background-color: #6A9BFF;
}

/* Tip / Success */
[data-md-color-scheme="array"] .md-typeset .admonition.tip,
[data-md-color-scheme="array"] .md-typeset details.tip,
[data-md-color-scheme="array"] .md-typeset .admonition.success,
[data-md-color-scheme="array"] .md-typeset details.success {
  border-color: #20D498; /* green-500 */
  background-color: #EAFFF6; /* green-50 */
}

[data-md-color-scheme="array"] .md-typeset .tip > .admonition-title,
[data-md-color-scheme="array"] .md-typeset .tip > summary,
[data-md-color-scheme="array"] .md-typeset .success > .admonition-title,
[data-md-color-scheme="array"] .md-typeset .success > summary {
  background-color: rgba(32, 212, 152, 0.15);
  border-color: #20D498;
  color: #097151; /* green-700 */
}

[data-md-color-scheme="array"] .md-typeset .tip > .admonition-title::before,
[data-md-color-scheme="array"] .md-typeset .tip > summary::before,
[data-md-color-scheme="array"] .md-typeset .success > .admonition-title::before,
[data-md-color-scheme="array"] .md-typeset .success > summary::before {
  background-color: #20D498;
}

/* Warning */
[data-md-color-scheme="array"] .md-typeset .admonition.warning,
[data-md-color-scheme="array"] .md-typeset details.warning {
  border-color: #EDB200; /* yellow-500 */
  background-color: #FFFBE5; /* yellow-50 */
}

[data-md-color-scheme="array"] .md-typeset .warning > .admonition-title,
[data-md-color-scheme="array"] .md-typeset .warning > summary {
  background-color: rgba(237, 178, 0, 0.15);
  border-color: #EDB200;
  color: #524000; /* yellow-800 */
}

[data-md-color-scheme="array"] .md-typeset .warning > .admonition-title::before,
[data-md-color-scheme="array"] .md-typeset .warning > summary::before {
  background-color: #EDB200;
}

/* Danger / Error */
[data-md-color-scheme="array"] .md-typeset .admonition.danger,
[data-md-color-scheme="array"] .md-typeset details.danger {
  border-color: #FF4749; /* red-500 */
  background-color: #FFF0ED; /* red-50 */
}

[data-md-color-scheme="array"] .md-typeset .danger > .admonition-title,
[data-md-color-scheme="array"] .md-typeset .danger > summary {
  background-color: rgba(255, 71, 73, 0.15);
  border-color: #FF4749;
  color: #8F2224; /* red-700 */
}

[data-md-color-scheme="array"] .md-typeset .danger > .admonition-title::before,
[data-md-color-scheme="array"] .md-typeset .danger > summary::before {
  background-color: #FF4749;
}

/* Abstract / Summary */
[data-md-color-scheme="array"] .md-typeset .admonition.abstract,
[data-md-color-scheme="array"] .md-typeset details.abstract,
[data-md-color-scheme="array"] .md-typeset .admonition.summary,
[data-md-color-scheme="array"] .md-typeset details.summary {
  border-color: #8353FF; /* purple-500 */
  background-color: #F3F2FF; /* purple-50 */
}

[data-md-color-scheme="array"] .md-typeset .abstract > .admonition-title,
[data-md-color-scheme="array"] .md-typeset .abstract > summary,
[data-md-color-scheme="array"] .md-typeset .summary > .admonition-title,
[data-md-color-scheme="array"] .md-typeset .summary > summary {
  background-color: rgba(131, 83, 255, 0.15);
  border-color: #8353FF;
  color: #483587; /* purple-700 */
}

[data-md-color-scheme="array"] .md-typeset .abstract > .admonition-title::before,
[data-md-color-scheme="array"] .md-typeset .abstract > summary::before,
[data-md-color-scheme="array"] .md-typeset .summary > .admonition-title::before,
[data-md-color-scheme="array"] .md-typeset .summary > summary::before {
  background-color: #8353FF;
}

/* Example */
[data-md-color-scheme="array"] .md-typeset .admonition.example,
[data-md-color-scheme="array"] .md-typeset details.example {
  border-color: #9679FF; /* purple-400 */
  background-color: #F3F2FF; /* purple-50 */
}

[data-md-color-scheme="array"] .md-typeset .example > .admonition-title,
[data-md-color-scheme="array"] .md-typeset .example > summary {
  background-color: rgba(150, 121, 255, 0.15);
  border-color: #9679FF;
  color: #483587; /* purple-700 */
}

[data-md-color-scheme="array"] .md-typeset .example > .admonition-title::before,
[data-md-color-scheme="array"] .md-typeset .example > summary::before {
  background-color: #9679FF;
}

/* Quote */
[data-md-color-scheme="array"] .md-typeset .admonition.quote,
[data-md-color-scheme="array"] .md-typeset details.quote {
  border-color: #7A8188; /* neutral-400 */
  background-color: #FAFAFA; /* neutral-50 */
}

[data-md-color-scheme="array"] .md-typeset .quote > .admonition-title,
[data-md-color-scheme="array"] .md-typeset .quote > summary {
  background-color: rgba(122, 129, 136, 0.1);
  border-color: #7A8188;
  color: #393E43; /* neutral-700 */
}

/* ── Search modal ─────────────────────────────────────────────── */

[data-md-color-scheme="array"] .md-search__input:focus {
  border-color: #3462DF; /* blue-500 — matches live stroke/focus token */
}

[data-md-color-scheme="array"] .md-search-result__link:hover {
  background-color: #ECF2FF; /* blue-50 */
}

/* ── Announcement bar (if enabled) ────────────────────────────── */

[data-md-color-scheme="array"] .md-banner {
  background-color: #3462DF; /* blue-500 */
  color: #FFFFFF;
}

[data-md-color-scheme="array"] .md-banner a {
  color: #FFFFFF;
  text-decoration: underline;
}

/* ── Footer link hover ────────────────────────────────────────── */

.md-footer a:hover {
  color: #6A9BFF; /* blue-300 — footer chrome is always a dark surface */
}

.md-footer .md-icon:hover {
  color: #FAFAFA;
}

/* ═══════════════════════════════════════════════════════════════
   Material Admonition CSS Variable Overrides
   (Material uses internal --md-admonition-* variables that can
    override class-based rules. Setting them explicitly ensures
    our colors win.)
   ═══════════════════════════════════════════════════════════════ */

[data-md-color-scheme="array"] {
  /* Note / Info admonition */
  --md-admonition-fg-color--note:      #181A1C;
  --md-admonition-bg-color--note:      #ECF2FF; /* blue-50 */

  --md-admonition-fg-color--info:      #181A1C;
  --md-admonition-bg-color--info:      #ECF2FF;

  /* Tip / Success */
  --md-admonition-fg-color--tip:       #181A1C;
  --md-admonition-bg-color--tip:       #EAFFF6; /* green-50 */

  --md-admonition-fg-color--success:   #181A1C;
  --md-admonition-bg-color--success:   #EAFFF6;

  /* Warning */
  --md-admonition-fg-color--warning:   #181A1C;
  --md-admonition-bg-color--warning:   #FFFBE5; /* yellow-50 */

  /* Danger */
  --md-admonition-fg-color--danger:    #181A1C;
  --md-admonition-bg-color--danger:    #FFF0ED; /* red-50 */

  /* Abstract */
  --md-admonition-fg-color--abstract:  #181A1C;
  --md-admonition-bg-color--abstract:  #F3F2FF; /* purple-50 */

  /* Example */
  --md-admonition-fg-color--example:   #181A1C;
  --md-admonition-bg-color--example:   #F3F2FF;

  /* Quote */
  --md-admonition-fg-color--quote:     #181A1C;
  --md-admonition-bg-color--quote:     #FAFAFA;
}


/* ═══════════════════════════════════════════════════════════════
   Sidebar Hover Highlight
   (David requested a more visible hover state on nav items)
   ═══════════════════════════════════════════════════════════════ */

[data-md-color-scheme="array"] .md-nav__link:hover {
  color: #3462DF; /* blue-500 */
  background-color: rgba(52, 98, 223, 0.06); /* subtle blue tint */
  border-radius: 4px;
  transition: background-color 0.15s ease, color 0.15s ease;
}

[data-md-color-scheme="array-dark"] .md-nav__link:hover {
  color: #6A9BFF; /* blue-300 */
  background-color: rgba(106, 155, 255, 0.1);
  border-radius: 4px;
  transition: background-color 0.15s ease, color 0.15s ease;
}


/* ═══════════════════════════════════════════════════════════════
   Logo Sizing
   (Ensure the SVG wordmark renders at the right size in header)
   ═══════════════════════════════════════════════════════════════ */

.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 28px;
  width: auto;
}

