/* ─────────────────────────────────────────────────────────────────────────────
   PSPG Framework — MetricSentinel-inspired theme
   Primary: Deep navy #050b16  ·  Cyan #00e5ff  ·  Blue #0077ff
   Font: Inter (matches MetricSentinel exactly)
───────────────────────────────────────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500&display=swap');

/* ── CSS variables ────────────────────────────────────────────────────────── */
:root {
  --ms-navy:   #050b16;
  --ms-navy2:  #06101a;
  --ms-navy3:  #0a1628;
  --ms-cyan:   #00e5ff;
  --ms-blue:   #0077ff;
  --ms-text:   #eaf4ff;
  --ms-muted:  rgba(234,244,255,0.56);
  --ms-border: rgba(0,229,255,0.12);
}

/* ── Custom primary: deep navy header ─────────────────────────────────────── */
[data-md-color-primary="custom"] {
  --md-primary-fg-color:        var(--ms-navy);
  --md-primary-fg-color--light: #07121c;
  --md-primary-fg-color--dark:  #030810;
  --md-primary-bg-color:        var(--ms-text);
  --md-primary-bg-color--light: rgba(234,244,255,0.7);
}

/* ── Custom accent: cyan ──────────────────────────────────────────────────── */
[data-md-color-accent="custom"] {
  --md-accent-fg-color:              var(--ms-cyan);
  --md-accent-fg-color--transparent: rgba(0,229,255,0.1);
  --md-accent-bg-color:              var(--ms-navy);
}

/* ── Dark scheme (MetricSentinel dark mode) ───────────────────────────────── */
[data-md-color-scheme="slate"] {
  --md-default-bg-color:           var(--ms-navy2);
  --md-default-bg-color--light:    var(--ms-navy3);
  --md-default-bg-color--lighter:  #0d1c35;
  --md-default-bg-color--lightest: #102040;

  --md-default-fg-color:           var(--ms-text);
  --md-default-fg-color--light:    rgba(234,244,255,0.82);
  --md-default-fg-color--lighter:  var(--ms-muted);
  --md-default-fg-color--lightest: rgba(234,244,255,0.12);

  --md-code-bg-color:  #030c16;
  --md-code-fg-color:  #3df2ff;
  --md-typeset-mark-color: rgba(0,229,255,0.25);

  /* Footer */
  --md-footer-bg-color:      var(--ms-navy);
  --md-footer-bg-color--dark:#03000a;
}

/* ── Header ───────────────────────────────────────────────────────────────── */
.md-header {
  background: var(--ms-navy) !important;
  border-bottom: 1px solid var(--ms-border);
  box-shadow: 0 2px 24px rgba(0,0,0,0.6);
}

.md-header__title {
  font-weight: 800;
  letter-spacing: -0.3px;
}

.md-logo img, .md-logo svg { filter: brightness(10); }

/* ── Tabs ─────────────────────────────────────────────────────────────────── */
.md-tabs {
  background: #040d18 !important;
  border-bottom: 1px solid var(--ms-border);
}

.md-tabs__link--active,
.md-tabs__link:hover { color: var(--ms-cyan) !important; }

/* ── Sidebar ──────────────────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] .md-sidebar__scrollwrap { background: var(--ms-navy2); }

[data-md-color-scheme="slate"] .md-nav__title {
  color: var(--ms-cyan);
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

[data-md-color-scheme="slate"] .md-nav__item--active > .md-nav__link {
  color: var(--ms-cyan);
  font-weight: 600;
}

[data-md-color-scheme="slate"] .md-nav__link:hover { color: var(--ms-cyan); }

/* ── Headings ─────────────────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] .md-typeset h1 {
  background: linear-gradient(135deg, var(--ms-cyan), var(--ms-blue));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 900;
  letter-spacing: -1px;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--ms-border);
}

[data-md-color-scheme="slate"] .md-typeset h2 {
  color: #00d9ff;
  font-weight: 800;
  letter-spacing: -0.4px;
  border-bottom: 1px solid rgba(0,229,255,0.08);
  padding-bottom: 0.25rem;
}

[data-md-color-scheme="slate"] .md-typeset h3 { color: #cfe9ff; font-weight: 700; }
[data-md-color-scheme="slate"] .md-typeset h4 { color: #b0d4f0; font-weight: 600; }

/* Light mode headings */
[data-md-color-scheme="default"] .md-typeset h1 {
  background: linear-gradient(135deg, #0055cc, #0077ff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 900;
  letter-spacing: -1px;
}

[data-md-color-scheme="default"] .md-typeset h2 { color: #004fa8; font-weight: 800; }

/* ── Links ────────────────────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] .md-typeset a { color: var(--ms-cyan); }
[data-md-color-scheme="slate"] .md-typeset a:hover { color: #3df2ff; }

/* ── Inline code ──────────────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] .md-typeset code {
  background: rgba(0,229,255,0.07);
  color: #3df2ff;
  border: 1px solid rgba(0,229,255,0.15);
  border-radius: 5px;
  padding: 0.1em 0.4em;
  font-size: 0.85em;
}

/* ── Code blocks ──────────────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] .md-typeset pre {
  border: 1px solid var(--ms-border);
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.4);
}

[data-md-color-scheme="slate"] .md-typeset pre > code { background: #030c16; }

/* ── Search ───────────────────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] .md-search__form {
  background: rgba(0,229,255,0.05);
  border: 1px solid rgba(0,229,255,0.15);
  border-radius: 10px;
}

/* ── Admonitions ──────────────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] .md-typeset .admonition,
[data-md-color-scheme="slate"] .md-typeset details {
  background: rgba(0,229,255,0.04);
  border-left-color: var(--ms-cyan);
  border-radius: 0 10px 10px 0;
}

[data-md-color-scheme="slate"] .md-typeset .admonition-title,
[data-md-color-scheme="slate"] .md-typeset summary {
  background: rgba(0,229,255,0.08);
  color: var(--ms-cyan);
}

/* ── Tables ───────────────────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  background: rgba(0,229,255,0.1);
  color: var(--ms-cyan);
}

[data-md-color-scheme="slate"] .md-typeset table:not([class]) {
  border: 1px solid rgba(0,229,255,0.1);
  border-radius: 10px;
  overflow: hidden;
}

/* ── Footer ───────────────────────────────────────────────────────────────── */
.md-footer {
  background: var(--ms-navy) !important;
  border-top: 1px solid var(--ms-border);
}

.md-footer-meta {
  background: #03000a !important;
}

.md-copyright {
  color: var(--ms-muted);
  font-size: 0.75rem;
}

.md-copyright a,
.md-copyright__highlight a { color: var(--ms-cyan) !important; }

.md-footer__link { opacity: 0.7; }
.md-footer__link:hover { opacity: 1; color: var(--ms-cyan) !important; }

.md-footer__title { color: var(--ms-text) !important; opacity: 0.8; }
.md-footer__direction { color: var(--ms-muted) !important; }

/* ── Scrollbar ────────────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--ms-navy2); }
::-webkit-scrollbar-thumb { background: rgba(0,229,255,0.18); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(0,229,255,0.38); }

/* ── Selection ────────────────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] ::selection {
  background: rgba(0,229,255,0.2);
  color: var(--ms-text);
}

/* ── Content area ─────────────────────────────────────────────────────────── */
[data-md-color-scheme="slate"] .md-content__inner {
  padding-top: 1.5rem;
}

/* Subtle card-style for the main content on wide screens */
@media screen and (min-width: 76.25em) {
  [data-md-color-scheme="slate"] .md-content__inner {
    border-left: 1px solid rgba(0,229,255,0.06);
    padding-left: 2rem;
  }
}