/* =========================================================================
   The Hardware OS — mdBook custom theme
   Source of truth: web/mdbook-assets/hwos.css in stembl/hw_os
   Applied via additional-css after the default mdBook theme.
   When changing tokens, update ops/legal.md and design/tokens.css too.

   SCALE NOTE: mdBook sets :root { font-size: 62.5% } so 1rem = 10px.
   Always express font sizes in this scale: 1.4rem = 14px, 1.6rem = 16px.
   Sub-1rem values are sub-10px and will be illegible.
   ========================================================================= */

/* -- Typography ---------------------------------------------------------- */
html {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.content p,
.content ol,
.content ul {
  font-size: 1.7rem;
  line-height: 1.7em;
}

/* -- Color tokens: light ------------------------------------------------- */
.light,
html:not(.js) {
  --bg:             #FAFAFA;   /* zinc-50 */
  --fg:             #09090B;   /* zinc-950 */
  --sidebar-bg:     #F4F4F5;   /* zinc-100 — recessed from body */
  --sidebar-fg:     #71717A;   /* zinc-500 */
  --sidebar-active: #B45309;   /* amber-700 */
  --sidebar-spacer: #E4E4E7;   /* zinc-200 */
  --links:          #B45309;   /* amber-700 — 5.8:1 on zinc-50, WCAG AA */
}

/* -- Color tokens: dark -------------------------------------------------- */
.coal,
.navy {
  --bg:             #18181B;   /* zinc-900 — no halation */
  --fg:             #D4D4D8;   /* zinc-300 — ~11:1 on zinc-900 */
  --sidebar-bg:     #27272A;   /* zinc-800 — recessed from body */
  --sidebar-fg:     #A1A1AA;   /* zinc-400 */
  --sidebar-active: #F59E0B;   /* amber-400 */
  --sidebar-spacer: #3F3F46;   /* zinc-700 */
  --links:          #F59E0B;   /* amber-400 */
}

/* -- Sidebar border ------------------------------------------------------ */
#sidebar {
  border-right: 1px solid var(--sidebar-spacer);
}

/* -- Part title labels (injected by hwos.js) ----------------------------- */
.chapter li.part-title {
  font-size: 1.1rem;  /* 11px — small uppercase label, clearly secondary */
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--sidebar-active);
  margin: 1.4em 0 0.2em;
  padding-left: 10px;
  opacity: 0.85;
}

/* -- Sidebar brand link (injected by hwos.js) ---------------------------- */
.hwos-sidebar-brand {
  padding: 2px 10px 12px;
  border-bottom: 1px solid var(--sidebar-spacer);
  margin-bottom: 8px;
}
.hwos-brand-link {
  font-size: 1.3rem;  /* 13px */
  color: var(--sidebar-active);
  text-decoration: none;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.8;
}
.hwos-brand-link:hover { opacity: 1; text-decoration: none; }

/* -- Page footer: outside the prose column, clearly site chrome ---------- */
.hwos-page-footer {
  width: 100%;
  padding: 1rem 1.5rem;
  margin-top: 2rem;
  border-top: 1px solid var(--sidebar-spacer);
  background-color: var(--sidebar-bg);
  font-size: 1.4rem;  /* 14px */
  color: var(--fg);
  opacity: 0.65;
  box-sizing: border-box;
  text-align: center;
}
.hwos-page-footer a {
  color: var(--links);
  text-decoration: none;
}
.hwos-page-footer a:hover { text-decoration: underline; }
