/* OMR Scanner — shared colour tokens.
   Light (blue & white) is the primary theme; dark is a separate, explicit
   mode reached via the toggle in theme-switch.css/theme.js. No component
   rule below this file should know which theme is active — it only ever
   reads a var(). */

:root {
  --bg:           #ffffff;
  --bg-raised:    #f5f8fc;
  --surface:      #ffffff;
  --surface-alt:  #eef3fb;
  --line:         #dce5f0;
  --line-2:       #c3d3e6;

  --fg:           #0f1b2d;
  --muted:        #4b5c75;
  --dim:          #6b7b94;

  --accent:       #1d4ed8;
  --accent-hover: #1e40af;
  --accent-soft:  rgba(29, 78, 216, .10);
  --accent-ink:   #ffffff;   /* text colour placed ON TOP of --accent */

  --err:          #c0173c;
  --radius:       10px;
  /* Named step for the small-control radius that already repeats across
     the app (buttons, chips) — same pixel value as before, just shared
     instead of typed out as a literal everywhere. */
  --radius-tight: 8px;
  --nav-bg:       rgba(255, 255, 255, .82);

  --display: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --body: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  color-scheme: light;
}

:root[data-theme="dark"] {
  --bg:           #0a1120;
  --bg-raised:    #0f1a2e;
  --surface:      #121f37;
  --surface-alt:  #17263f;
  --line:         #223050;
  --line-2:       #2d4066;

  --fg:           #eef3fb;
  --muted:        #a9b8d0;
  --dim:          #7e8fac;

  --accent:       #5b9dff;
  --accent-hover: #7fb3ff;
  --accent-soft:  rgba(91, 157, 255, .16);
  --accent-ink:   #061225;

  --err:          #ff7a7a;
  --nav-bg:       rgba(10, 17, 32, .82);

  color-scheme: dark;
}