/* ============================================================
   Link docs theme — mirrors the live "Prism" design system
   (link-frontend-identity-core/app/globals.css)
   Fonts: Inter (body) + Geist Mono (code)
   Brand: PL50 #6559A5 primary, #9F89F5 accent
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap');

:root {
  --md-text-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --md-code-font: "Geist Mono", ui-monospace, Menlo, monospace;

  /* Link brand */
  --link-primary: #6559A5;
  --link-primary-light: #9F89F5;
  --link-primary-hover: #756AAF;
  --link-radius-lg: 18px;
  --link-radius-md: 12px;
}

/* ---------- Light scheme (Prism light) ---------- */
[data-md-color-scheme="default"] {
  --md-primary-fg-color: #6559A5;
  --md-primary-fg-color--light: #9F89F5;
  --md-primary-fg-color--dark: #4D4080;
  --md-primary-bg-color: #ffffff;
  --md-accent-fg-color: #4D4080;

  --md-default-bg-color: #F4F5F9;
  --md-default-fg-color: #0F172A;
  --md-default-fg-color--light: rgba(15,23,42,0.62);
  --md-default-fg-color--lighter: rgba(15,23,42,0.45);
  --md-default-fg-color--lightest: rgba(15,23,42,0.12);

  --md-typeset-a-color: #5B4FA0;
  --md-code-bg-color: #EEF0F4;
  --md-code-fg-color: #0F172A;

  --link-surface: #ffffff;
  --link-border: #E4E7EC;
  --link-shadow-card: 0 1px 2px rgba(15,23,42,0.04), 0 1px 3px rgba(15,23,42,0.05);
  --link-shadow-hover: 0 2px 4px rgba(15,23,42,0.05), 0 8px 24px -4px rgba(15,23,42,0.10);
}

/* ---------- Dark scheme (Prism dark, default) ---------- */
[data-md-color-scheme="slate"] {
  --md-hue: 265;
  --md-primary-fg-color: #6559A5;
  --md-primary-fg-color--light: #9F89F5;
  --md-primary-fg-color--dark: #4D4080;
  --md-primary-bg-color: #ECE8F5;
  --md-accent-fg-color: #9F89F5;

  --md-default-bg-color: #0A0715;
  --md-default-fg-color: #ECE8F5;
  --md-default-fg-color--light: rgba(236,232,245,0.70);
  --md-default-fg-color--lighter: rgba(236,232,245,0.45);
  --md-default-fg-color--lightest: rgba(236,232,245,0.18);

  --md-typeset-a-color: #9F89F5;
  --md-code-bg-color: #13101F;
  --md-code-fg-color: #ECE8F5;

  --md-footer-bg-color: #0D0A18;
  --md-footer-bg-color--dark: #0A0715;

  --link-surface: #16102B;
  --link-border: rgba(255,255,255,0.06);
  --link-shadow-card: inset 0 1px 0 rgba(255,255,255,0.04);
  --link-shadow-hover: inset 0 1px 0 rgba(255,255,255,0.08), 0 0 40px -10px rgba(159,137,245,0.35);
}
[data-md-color-scheme="slate"] { --md-typeset-kbd-color: #1b1530; }

/* ---------- Header / tabs use the canvas, not a purple bar ---------- */
.md-header,
.md-tabs {
  background-color: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
}
.md-header {
  box-shadow: 0 0 0 1px var(--link-border);
}
.md-header__title { font-weight: 600; }
.md-tabs__link { color: var(--md-default-fg-color); opacity: .68; }
.md-tabs__link:hover,
.md-tabs__link--active { color: var(--link-primary-light); opacity: 1; }
[data-md-color-scheme="default"] .md-tabs__link:hover,
[data-md-color-scheme="default"] .md-tabs__link--active { color: var(--link-primary); }

/* Search field tint */
.md-search__form { border-radius: 999px; }

/* ---------- Headings ---------- */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3 { font-weight: 600; letter-spacing: -0.01em; }
.md-typeset h2 {
  border-bottom: 1px solid var(--link-border);
  padding-bottom: .3em;
}

/* ---------- Code & tables: rounded, product-like ---------- */
.md-typeset pre > code,
.md-typeset .highlight > pre,
.md-typeset .highlighttable { border-radius: var(--link-radius-md); }
.md-typeset table:not([class]) {
  border-radius: var(--link-radius-md);
  overflow: hidden;
  border: 1px solid var(--link-border);
}
.md-typeset table:not([class]) th {
  font-family: var(--md-code-font);
  font-size: .74rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}

/* ---------- Admonitions: rounded + soft ---------- */
.md-typeset .admonition,
.md-typeset details {
  border-radius: var(--link-radius-md);
  border-left-width: 3px;
}

/* Custom flavors for stub / open-question callouts */
:root {
  --md-admonition-icon--post-mvp: var(--md-admonition-icon--example);
  --md-admonition-icon--open-question: var(--md-admonition-icon--question);
}
.md-typeset .admonition.post-mvp,
.md-typeset details.post-mvp { border-color: var(--link-primary-light); }
.md-typeset .post-mvp > .admonition-title,
.md-typeset .post-mvp > summary {
  background-color: rgba(159,137,245,0.12);
}
.md-typeset .post-mvp > .admonition-title::before,
.md-typeset .post-mvp > summary::before {
  background-color: var(--link-primary-light);
  -webkit-mask-image: var(--md-admonition-icon--post-mvp);
          mask-image: var(--md-admonition-icon--post-mvp);
}
.md-typeset .admonition.open-question,
.md-typeset details.open-question { border-color: #FBBF24; }
.md-typeset .open-question > .admonition-title,
.md-typeset .open-question > summary {
  background-color: rgba(251,191,36,0.12);
}
.md-typeset .open-question > .admonition-title::before,
.md-typeset .open-question > summary::before {
  background-color: #FBBF24;
  -webkit-mask-image: var(--md-admonition-icon--open-question);
          mask-image: var(--md-admonition-icon--open-question);
}

/* ---------- Grid cards (product selector + section links) ---------- */
.md-typeset .grid.cards > ul > li,
.md-typeset .grid.cards > .card {
  border: 1px solid var(--link-border);
  border-radius: var(--link-radius-lg);
  background: var(--link-surface);
  box-shadow: var(--link-shadow-card);
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.md-typeset .grid.cards > ul > li:hover,
.md-typeset .grid.cards > .card:hover {
  border-color: var(--link-primary-light);
  box-shadow: var(--link-shadow-hover);
  transform: translateY(-2px);
}
.md-typeset .grid.cards .lg.middle { color: var(--link-primary-light); }

/* ---------- Mermaid diagrams ---------- */
.md-typeset .mermaid {
  background: var(--link-surface);
  border: 1px solid var(--link-border);
  border-radius: var(--link-radius-md);
  padding: 1rem;
  margin: 1.2em 0;
}

/* ---------- Buttons (Material .md-button) ---------- */
.md-typeset .md-button {
  border-radius: 999px;
  border-width: 1px;
}
.md-typeset .md-button--primary {
  background: linear-gradient(180deg, var(--link-primary-hover), var(--link-primary));
  border-color: var(--link-primary);
  color: #fff;
}

/* ---------- Scrollbar (subtle, purple on hover) ---------- */
[data-md-color-scheme="slate"] * { scrollbar-color: var(--md-default-fg-color--lightest) transparent; }
