@import url("https://fonts.googleapis.com/css2?family=Archivo:wght@500;600;700&display=swap");

/* ------------------------------------------------------------------
   Palette — cold Nordic neutrals with a single cobalt accent.
   Semantic verb colours are deliberately separate from the accent.
   ------------------------------------------------------------------ */

[data-md-color-scheme="default"] {
  --md-primary-fg-color:        #1F5FD0;
  --md-primary-fg-color--light: #4A80DE;
  --md-primary-fg-color--dark:  #16408F;
  --md-accent-fg-color:         #16408F;

  --md-default-bg-color:        #F6F8FB;
  --md-default-fg-color:        #131A23;
  --md-default-fg-color--light: #566374;
  --md-default-fg-color--lighter: #8593A5;

  --md-typeset-a-color:         #1F5FD0;
  --md-code-bg-color:           #EDF1F7;
  --md-code-fg-color:           #1F2A36;

  --noja-surface:     #FFFFFF;
  --noja-rule:        #DDE4EC;
  --noja-wash:        #E7EEFB;
  --noja-accent-ink:  #16408F;

  --noja-get:   #1E6F49;
  --noja-post:  #1F5FD0;
  --noja-put:   #8A5A0B;
  --noja-patch: #8A5A0B;
  --noja-del:   #A82D28;

  --noja-req-bg:  #FBE9E7;
  --noja-req-ink: #A82D28;
  --noja-opt-bg:  #EAEFF5;
  --noja-opt-ink: #566374;
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color:        #629BF5;
  --md-primary-fg-color--light: #8FB8F8;
  --md-primary-fg-color--dark:  #2F63B8;
  --md-accent-fg-color:         #9CBFFA;

  --md-default-bg-color:        #0D1218;
  --md-default-fg-color:        #E3E9F1;
  --md-default-fg-color--light: #9AA7B8;
  --md-default-fg-color--lighter: #6F7D8F;

  --md-typeset-a-color:         #629BF5;
  --md-code-bg-color:           #161E28;
  --md-code-fg-color:           #D3DCE8;

  --noja-surface:     #151C25;
  --noja-rule:        #263039;
  --noja-wash:        #16243C;
  --noja-accent-ink:  #9CBFFA;

  --noja-get:   #58B489;
  --noja-post:  #629BF5;
  --noja-put:   #D2A052;
  --noja-patch: #D2A052;
  --noja-del:   #E0736D;

  --noja-req-bg:  #33201F;
  --noja-req-ink: #E0736D;
  --noja-opt-bg:  #222C36;
  --noja-opt-ink: #9AA7B8;
}

/* ------------------------------------------------------------------
   Typography — Archivo carries the headings, Plex Sans the prose.
   ------------------------------------------------------------------ */

.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-header__topic {
  font-family: Archivo, "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  letter-spacing: -0.018em;
  text-wrap: balance;
}

.md-typeset h1 {
  font-weight: 700;
  font-size: 2.1rem;
  line-height: 1.12;
  color: var(--md-default-fg-color);
  margin-bottom: 0.5em;
}

.md-typeset h2 {
  font-weight: 700;
  font-size: 1.45rem;
  line-height: 1.2;
  margin-top: 2.2em;
  padding-top: 0.6em;
  border-top: 1px solid var(--noja-rule);
}

.md-typeset h3 {
  font-weight: 600;
  font-size: 1.12rem;
  margin-top: 1.9em;
}

.md-typeset {
  font-size: 0.79rem;
  line-height: 1.68;
}

.md-typeset p,
.md-typeset li {
  max-width: 72ch;
}

/* ------------------------------------------------------------------
   Header and sidebar — a quiet neutral bar, not a saturated slab.
   The accent is spent on links and markers, not on 60px of chrome.
   ------------------------------------------------------------------ */

.md-header,
.md-tabs {
  background-color: var(--noja-surface);
  color: var(--md-default-fg-color);
  box-shadow: none;
  border-bottom: 1px solid var(--noja-rule);
}

.md-header__title,
.md-header__button,
.md-header__topic {
  color: var(--md-default-fg-color);
}

.md-header__topic:first-child {
  font-weight: 600;
  letter-spacing: -0.01em;
}

.md-search__form {
  background-color: var(--md-code-bg-color);
  border: 1px solid var(--noja-rule);
  border-radius: 5px;
  box-shadow: none;
}

.md-search__form:hover {
  background-color: var(--md-code-bg-color);
  border-color: var(--md-default-fg-color--lighter);
}

.md-search__input {
  color: var(--md-default-fg-color);
}

.md-search__input::placeholder,
.md-search__icon {
  color: var(--md-default-fg-color--lighter);
}

/* Active nav item carries the accent instead. */
.md-nav__link--active,
.md-nav__link--active code {
  color: var(--md-typeset-a-color);
  font-weight: 500;
}

.md-nav__title {
  font-family: Archivo, "IBM Plex Sans", ui-sans-serif, sans-serif;
  font-size: 0.68rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--md-default-fg-color--lighter);
}

/* ------------------------------------------------------------------
   Endpoint header — the verb-and-path line under each heading.
   ------------------------------------------------------------------ */

.endpoint {
  display: flex;
  align-items: center;
  gap: 0.7em;
  flex-wrap: wrap;
  background: var(--noja-surface);
  border: 1px solid var(--noja-rule);
  border-radius: 6px;
  padding: 0.6em 0.9em;
  margin: 0 0 1.1em;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.74rem;
}

.endpoint .verb {
  font-weight: 500;
  letter-spacing: 0.07em;
  padding: 0.15em 0.5em;
  border: 1px solid currentColor;
  border-radius: 3px;
  flex-shrink: 0;
  font-size: 0.68rem;
}

.endpoint .verb.get   { color: var(--noja-get); }
.endpoint .verb.post  { color: var(--noja-post); }
.endpoint .verb.put   { color: var(--noja-put); }
.endpoint .verb.patch { color: var(--noja-patch); }
.endpoint .verb.del   { color: var(--noja-del); }

.endpoint .path {
  font-weight: 500;
  word-break: break-all;
  color: var(--md-default-fg-color);
}

/* Ownership marker — who is allowed to write this resource. */
.endpoint .writes {
  margin-left: auto;
  flex-shrink: 0;
  font-size: 0.62rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  padding: 0.2em 0.6em;
  border-radius: 999px;
  border: 1px solid var(--noja-rule);
  color: var(--md-default-fg-color--light);
}

.endpoint .writes.partner {
  color: var(--noja-accent-ink);
  background: var(--noja-wash);
  border-color: transparent;
}

/* ------------------------------------------------------------------
   Required / optional chips inside field tables.
   ------------------------------------------------------------------ */

.req,
.opt {
  display: inline-block;
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.62rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  padding: 0.15em 0.5em;
  border-radius: 3px;
  white-space: nowrap;
}

.req { background: var(--noja-req-bg); color: var(--noja-req-ink); }
.opt { background: var(--noja-opt-bg); color: var(--noja-opt-ink); }

/* ------------------------------------------------------------------
   Tables — tighter, monospaced field names, tabular digits.
   ------------------------------------------------------------------ */

.md-typeset table:not([class]) {
  font-size: 0.72rem;
  border: 1px solid var(--noja-rule);
  border-radius: 6px;
}

.md-typeset table:not([class]) th {
  font-family: "IBM Plex Mono", ui-monospace, monospace;
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--md-default-fg-color--lighter);
  background: var(--md-code-bg-color);
}

.md-typeset table:not([class]) td:first-child code {
  white-space: nowrap;
}

.md-typeset table:not([class]) td {
  font-variant-numeric: tabular-nums;
  vertical-align: top;
}

/* ------------------------------------------------------------------
   Code blocks and inline code.
   ------------------------------------------------------------------ */

.md-typeset pre > code {
  font-size: 0.72rem;
  line-height: 1.62;
  border-radius: 6px;
}

.md-typeset code {
  border-radius: 3px;
  font-size: 0.82em;
}

/* Admonitions: square the corners off Material's default rounding a touch. */
.md-typeset .admonition,
.md-typeset details {
  border-radius: 6px;
  font-size: 0.75rem;
  border-left-width: 3px;
}

/* Landing-page lede paragraph. */
.md-typeset .lede {
  font-size: 1.02rem;
  line-height: 1.6;
  color: var(--md-default-fg-color--light);
  max-width: 64ch;
}