/*
 * Brand colors for the NEM demo instance.
 *
 * Pinned explicitly rather than relying on the image's built-in defaults: those defaults were
 * NEM's own colors only because the madm fork renamed the tokens without ever replacing the
 * values. Now that the image ships generic defaults, THIS file is what keeps the demo looking
 * like NEM. Served no-cache, so edits here are live on the next page load — no rebuild, no
 * restart. The logo/emblem/email-logo beside it are pinned for the same reason.
 */
:root {
  --color-brand-primary: #5b0b0b;
  --color-brand-ink: #3a3b3e;
  --color-brand-surface: #faf7f4;
  /* The header bar and footer: their own token since v0.10 (2026-08-29), which the image
     defaults to blue rather than to the brand colour, so it is pinned here too. */
  --color-header: #5b0b0b;
}

/* Dark mode too: the app swaps to a neutral dark header there, with selectors more specific than
   :root above, so the header and footer are pinned in the app's own two dark-mode rules (the
   computer's setting, and the theme switch). Two reds there, because one colour cannot do both jobs on
   a dark page: FILLS (the page heroes, filled buttons, selected chips; --color-primary) are a deep red a
   step lighter than the header (#7a1a1a) under WHITE text (10.6:1); TEXT and outlines in the brand
   colour (links, focus rings; --color-brand-primary) are a muted light red (#c78a8a, 5.2:1 on the dark
   cards), as the app's own dark palette uses a light blue (#7ab3e0) for links. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-header: #5b0b0b; --color-brand-primary: #c78a8a;
    --color-primary: #7a1a1a; --color-on-primary: #ffffff;
  }
}
[data-theme="dark"] {
  --color-header: #5b0b0b; --color-brand-primary: #c78a8a;
  --color-primary: #7a1a1a; --color-on-primary: #ffffff;
}
