/* App-wide design tokens -- the base palette every page paints with.
   Source of truth: mockup-style-spec.md section 1, copied verbatim; the blocks below moved here
   byte for byte from search.css section 1 (item 2835, WSH-12 / SD-3080 ruling 6). Custom properties
   are inert until something assigns them to a real CSS property, so declaring them at :root styles
   nothing by itself: search.css (the search screen) and shell.css (the shell chrome and the sign-in
   pages) are where they are used.

   App.razor links this file first among the app's own stylesheets -- after the DevExpress themes and
   the Google Fonts link, immediately before search.css -- on its single host page, so the palette
   applies on every page, PublicLayout's sign-in and launch pages included. shell.css owns only its
   five --nav-* tokens on top of this palette.

   Three blocks, the contract appearance.js keys off: bare :root (light); the dark media query guarded
   as :root:not([data-theme="light"]) (dark by the OS unless Light was chosen); :root[data-theme="dark"]
   (an explicit Dark choice, whatever the OS). */

:root {
  --bg: #EEEFF1; --pane: #FFFFFF; --rail: #F7F8F9; --ink: #16181C; --ink2: #5A6069; --ink3: #8B9199;
  --line: #D7DAE0; --line2: #E8EAEE;
  --accent: #1B4D8F; --accent-bg: #E7EDF6; --accent-line: #A9C0DE;
  --ok: #1D6B3F;   --ok-bg: #E1F0E7;
  --warn: #8A5A0B; --warn-bg: #F8EEDA;
  --stop: #9C2C22; --stop-bg: #F8E4E1;
  --cool: #4A4F8C; --cool-bg: #E9EAF5;
  --row: #FBFCFD;
  /* SD-60 decision 5: the registration-status palette. The line that decides reuse vs.
     a new token is NOT collision-freedom -- it is whether the hue was the product owner's to
     specify or this file's to pick. Registered (blue), Pending (purple), Cancelled (red) and
     Transferred (green) are the four hues SD-60 decision 5 names explicitly, so
     --accent/--cool/--stop/--ok are reused because the spec already chose them, regardless of
     what else uses the same token. Applied honestly, that reuse DOES overlap
     .member-type-status, in the same grid row whenever association management and an event are
     both in scope: --stop is also Terminated, --ok is also Current, --cool is also Pending
     (the one case that is not really an overlap at all -- purple means "pending" in both
     columns, which is agreement, not ambiguity, and is not something to "fix"). Accepted rather
     than avoided, because colour is supplementary here (SD-13) -- every span renders its own
     word beside it, in both columns -- and because the hue itself was fixed by decision 5, not
     free to spend on avoiding a semantic token's other uses.
     Qualified and Waiting carry no such mandate -- decision 5 accepted both with no hue
     specified, so the choice was this file's to make, and it went to avoiding a collision that
     the four spec'd hues above were not free to avoid. --reg-qualified is new because reusing
     any token above would borrow a meaning nothing forced it to borrow. --reg-waiting is new
     rather than reusing --warn specifically: --member-type-status--suspended already renders
     "amber = suspended" two columns to the left in the same row, and Waiting is a different fact
     (queued, not denied) -- a second amber there would read as Suspended restated, and nothing
     but this file's own free choice would have caused it. */
  --reg-registered: var(--accent); --reg-pending: var(--cool); --reg-cancelled: var(--stop);
  --reg-transferred: var(--ok); --reg-qualified: #0F7A6E; --reg-waiting: #B8860B;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0E0F11; --pane: #17191C; --rail: #131518; --ink: #E6E8EC; --ink2: #9BA1AA; --ink3: #6E747C;
    --line: #2A2D33; --line2: #212429;
    --accent: #7FA8DC; --accent-bg: #151C27; --accent-line: #2E425C;
    --ok: #77C295; --ok-bg: #122019; --warn: #D8A94F; --warn-bg: #231C0F;
    --stop: #E08878; --stop-bg: #251411; --cool: #9CA1DC; --cool-bg: #181A26;
    --row: #1B1E22;
    --reg-registered: var(--accent); --reg-pending: var(--cool); --reg-cancelled: var(--stop);
    --reg-transferred: var(--ok); --reg-qualified: #4FBDAE; --reg-waiting: #E0B34C;
  }
}
:root[data-theme="dark"] {
  /* Same dark values again, so an explicit choice wins over the OS setting either way. */
  --bg: #0E0F11; --pane: #17191C; --rail: #131518; --ink: #E6E8EC; --ink2: #9BA1AA; --ink3: #6E747C;
  --line: #2A2D33; --line2: #212429;
  --accent: #7FA8DC; --accent-bg: #151C27; --accent-line: #2E425C;
  --ok: #77C295; --ok-bg: #122019; --warn: #D8A94F; --warn-bg: #231C0F;
  --stop: #E08878; --stop-bg: #251411; --cool: #9CA1DC; --cool-bg: #181A26;
  --row: #1B1E22;
  --reg-registered: var(--accent); --reg-pending: var(--cool); --reg-cancelled: var(--stop);
  --reg-transferred: var(--ok); --reg-qualified: #4FBDAE; --reg-waiting: #E0B34C;
}