/* Dark mode: hand-written fixes for the older pages (after the generated theme-dark.css).
   Screen only, and only when <html data-theme="dark"> (see /js/theme.js). */
@media screen {
  /* My Attendance / kiosk / phone scan: role accent tokens */
  html[data-theme="dark"] body {
    --att-accent-fg: color-mix(in srgb, var(--att-accent, #1e3c72) 50%, #ffffff);
    --att-accent-50: color-mix(in srgb, var(--att-accent, #1e3c72) 22%, #171c22);
    --att-line: #29313a;
    --att-shadow: 0 1px 3px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.3);
  }

  /* Application QR scan page (its own colour variables) */
  html[data-theme="dark"] {
    --ink: #e5e8ec; --muted: #a7b0ba; --line: #343c46; --bg: #0f1419; --brand-fg: #9fb4f0;
  }

  /* Leave card / CTO card document: shown as a white sheet of paper in dark mode. */
  html[data-theme="dark"] .official-document,
  html[data-theme="dark"] .force-light {
    background: #ffffff;
    color: #212121;
    border-radius: 8px;
  }
}