/* The dark half of TractForge's one theme. Light needs nothing here: it is the
   palette :root already carries in each page plus the .tf-app mapping in
   tractforge-ui.css, which is exactly what shipped and was signed off.

   The values are the house dark palette — the same #1b2027 / #252c35 / #e0e6ec
   the hub and the federal workspace already use — over the semantic colours
   inherited from the retired "midnight" theme, which is the only one of the six
   named themes that was ever dark.

   TWO THINGS TO KNOW BEFORE EDITING.

   1. EVERY RULE IS INSIDE @media screen, and that is not cosmetic. The app
      prints ownership reports and runsheets from the same DOM; without the
      guard, a user in dark mode prints white text on a black page, or on
      nothing at all. tractforge-ui.css draws the same line for the same reason.

   2. TOKENS ARE DECLARED ON BOTH :root AND body. Custom properties inherit, but
      an inherited value loses to any declaration on the element itself, however
      specific the inherited one was — and tractforge-ui.css declares --paper,
      --ink, --ink-faint and friends on BODY via .tf-app. A :root-only dark block
      would therefore be silently ignored for precisely the tokens that matter
      most. The body selector's [data-theme] attribute is what outranks .tf-app.

   The unset third state — no data-theme attribute at all — is what lets the
   :not([data-theme="light"]) blocks below follow the operating system. See
   assets/tf-theme.js. */

@media screen {

  :root[data-theme="dark"],
  body[data-theme="dark"] {
    color-scheme: dark;

    /* Shared foundation tokens (tractforge-ui.css maps these into the app). */
    --tf-bg: #1b2027; --tf-surface: #252c35; --tf-ink: #e0e6ec;
    --tf-muted: #bac4cf; --tf-line: #414b57; --tf-accent: #8bb0d4;

    /* App and admin surface tokens. */
    --paper: #1b2027; --paper-raised: #252c35;
    --ink: #e0e6ec; --ink-soft: #bac4cf; --ink-faint: #8b96a3;
    --rule: #414b57; --rule-strong: #55616f;
    --own: #80bda0; --own-bg: #1c3328; --own-bg-strong: #234433;
    --burden: #d98b5c; --burden-bg: #3a2a1e; --burden-bg-strong: #4b3526;
    --lease: #8bb0d4; --lease-bg: #1d2c38; --lease-bg-strong: #243a4a;
    --warn: #d6b477; --warn-bg: #3a2f18; --warn-bg-strong: #4a3c1e;
    --danger: #e07a6e; --danger-bg: #3a2220;
    --focus: #8bb0d4;
    --shadow-soft: none;
    --grid-line: transparent;

    /* The legal pad and the marked-up scan keep their own colours; on a dark
       page they read as a lit sheet rather than a bright one. */
    --pad: #242a22; --pad-rule: rgba(226, 192, 68, 0.16);
    --pad-ink: #e2c044; --pad-acre: #80bda0;
    --mark-sheet: #2c3138; --mark-line: #5e6c7e;

    /* The wash behind row hovers, tab strips, panel heads and inherited rows.
       app.html hard-coded these as rgba(28,43,51,α) — dark ink at 2–10% over
       light paper. On a dark page that darkens an already-dark surface, so a
       hover was invisible and an inherited row read as a hole. The RGB triple
       is a token because the alphas differ at every site and must stay theirs;
       only the ink flips. Light's value lives beside the rest of the app
       palette, OUTSIDE @media screen, because these wash the printed page too. */
    --wash-rgb: 224, 230, 236;
  }

  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]),
    body:not([data-theme="light"]) {
      color-scheme: dark;

      --tf-bg: #1b2027; --tf-surface: #252c35; --tf-ink: #e0e6ec;
      --tf-muted: #bac4cf; --tf-line: #414b57; --tf-accent: #8bb0d4;

      --paper: #1b2027; --paper-raised: #252c35;
      --ink: #e0e6ec; --ink-soft: #bac4cf; --ink-faint: #8b96a3;
      --rule: #414b57; --rule-strong: #55616f;
      --own: #80bda0; --own-bg: #1c3328; --own-bg-strong: #234433;
      --burden: #d98b5c; --burden-bg: #3a2a1e; --burden-bg-strong: #4b3526;
      --lease: #8bb0d4; --lease-bg: #1d2c38; --lease-bg-strong: #243a4a;
      --warn: #d6b477; --warn-bg: #3a2f18; --warn-bg-strong: #4a3c1e;
      --danger: #e07a6e; --danger-bg: #3a2220;
      --focus: #8bb0d4;
      --shadow-soft: none;
      --grid-line: transparent;

      --pad: #242a22; --pad-rule: rgba(226, 192, 68, 0.16);
      --pad-ink: #e2c044; --pad-acre: #80bda0;
      --mark-sheet: #2c3138; --mark-line: #5e6c7e;

    /* The wash behind row hovers, tab strips, panel heads and inherited rows.
       app.html hard-coded these as rgba(28,43,51,α) — dark ink at 2–10% over
       light paper. On a dark page that darkens an already-dark surface, so a
       hover was invisible and an inherited row read as a hole. The RGB triple
       is a token because the alphas differ at every site and must stay theirs;
       only the ink flips. Light's value lives beside the rest of the app
       palette, OUTSIDE @media screen, because these wash the printed page too. */
    --wash-rgb: 224, 230, 236;
    }
  }

  /* The toggle sits in the app's account bar and the admin headers, where it
     borrows the button styling already there; all it needs of its own is for
     the icon to line up with the label. */
  .tf-theme-icon { width: 14px; height: 14px; vertical-align: -2px; margin-right: 6px; flex-shrink: 0; }
}
