/* theme-roles.css — the dark mapping of every theme ROLE, ONE place (apps/core/theme.py).

   Linked by templates/_theme_head.html, so it reaches every page document of the ERP —
   the staff shell AND the standalone ones (sign-in, 2FA, password, error, legal gate) that
   never load app.css. The light theme defines NO role: every component writes
   var(--role,<its light colour>), so light renders exactly as designed and dark renders
   this map. `body.dark` is set before the first paint by the same partial.

   Only the map, the light-island reset and browser-chrome fixes belong here; a component's
   own dark rule lives with the component. Guard: tools/guards.sh -> theme colours are tokens.
*/
/* The dark mapping of every role declared in :root. `--dark`/`--plum` are the brand's
   dark used as INK by older rules (a heading, a section row), so in dark mode they read
   as ink; a rule that wants the brand's dark as a FILL uses --brand-night. */
body.dark{--bg:#16181d;--panel:#212429;--ink:#e8e9ec;--muted:#9aa0ab;--line:#31353d;
  --dark:#e8e9ec;--plum:#e8e9ec;
  --surface-app:#16181d;--surface-1:#212429;--text:#e8e9ec;--text-muted:#9aa0ab;--border:#31353d;--input-text:#e8e9ec;
  --surface-2:#1b1e23;--surface-3:#2a2e35;--surface-hover:#2a2e35;--surface-selected:rgba(2,196,196,.16);
  --text-2:#c2c7d0;--text-disabled:#6b717c;
  --border-strong:#454a54;
  --input-bg:#1b1e23;--input-border:#3a3f48;--input-placeholder:#858c98;
  --overlay:rgba(0,0,0,.62);--shadow-elev:0 14px 36px rgba(0,0,0,.55);--focus-ring:0 0 0 3px rgba(2,196,196,.45);
  --st-draft-bg:#2a2e35;              --st-draft-fg:#c2c7d0;
  --st-sent-bg:rgba(59,130,246,.18);  --st-sent-fg:#9dbfff;
  --st-won-bg:rgba(34,197,94,.16);    --st-won-fg:#7ddba6;
  --st-lost-bg:rgba(239,68,68,.18);   --st-lost-fg:#ff9c94;
  --st-cancel-bg:rgba(168,148,120,.2);--st-cancel-fg:#d3c2a6;
  --st-warn-bg:rgba(245,158,11,.18);  --st-warn-fg:#f5c56e;
  --chart-grid:#31353d;--chart-axis:#9aa0ab;--chart-text:#e8e9ec;
  /* ink on a brand-teal fill (buttons, active tabs, badges): the best-contrast ink for the
     configured primary colour — the light theme keeps white unless Settings says otherwise */
  --on-accent-fill:var(--on-accent);
  --accent-text:#5fd6d6;
  /* status tints: translucent fills read as the colour on any dark surface; the text is a
     light shade of the same hue so it clears 4.5:1 on its own tint and on a plain card */
  --tint-danger-bg:rgba(239,68,68,.16);  --tint-danger-fg:#ff9c94;  --tint-danger-line:rgba(239,68,68,.42);
  --tint-warning-bg:rgba(245,158,11,.16);--tint-warning-fg:#f5c56e; --tint-warning-line:rgba(245,158,11,.42);
  --tint-success-bg:rgba(34,197,94,.14); --tint-success-fg:#7ddba6; --tint-success-line:rgba(34,197,94,.4);
  --tint-accent-bg:rgba(2,196,196,.14);  --tint-accent-fg:#5fd6d6;  --tint-accent-line:rgba(2,196,196,.42);
  --tint-info-bg:rgba(59,130,246,.16);   --tint-info-fg:#9dbfff;    --tint-info-line:rgba(59,130,246,.42);
  --tint-violet-bg:rgba(139,92,246,.18); --tint-violet-fg:#c4b1ff;  --tint-violet-line:rgba(139,92,246,.42);
  background:#16181d;color:var(--ink);color-scheme:dark}
/* A region that must stay LIGHT inside a dark page — a document preview, a customer's logo
   tile, and the HP module, which is brand-faithful white by decision. `initial` makes a
   role guaranteed-invalid, so every var(--role,<light>) inside falls back to its light value. */
body.dark [data-theme-keep],body.dark .hp-app{color-scheme:light;--surface-app:initial;--surface-1:initial;--surface-2:initial;--surface-3:initial;--surface-hover:initial;--surface-selected:initial;--text:initial;--text-2:initial;--text-muted:initial;--text-disabled:initial;--border:initial;--border-strong:initial;--input-bg:initial;--input-border:initial;--input-text:initial;--input-placeholder:initial;--tint-danger-bg:initial;--tint-danger-fg:initial;--tint-danger-line:initial;--tint-warning-bg:initial;--tint-warning-fg:initial;--tint-warning-line:initial;--tint-success-bg:initial;--tint-success-fg:initial;--tint-success-line:initial;--tint-accent-bg:initial;--tint-accent-fg:initial;--tint-accent-line:initial;--tint-info-bg:initial;--tint-info-fg:initial;--tint-info-line:initial;--tint-violet-bg:initial;--tint-violet-fg:initial;--tint-violet-line:initial;--accent-text:initial}
/* Browser autofill paints its own pale-yellow/white box over a field; in dark mode that
   is a white slab with light text on it. Repaint it with the field's own colours. */
body.dark input:-webkit-autofill,body.dark input:-webkit-autofill:hover,body.dark input:-webkit-autofill:focus,
body.dark textarea:-webkit-autofill,body.dark select:-webkit-autofill{
  -webkit-text-fill-color:var(--input-text);caret-color:var(--input-text);
  -webkit-box-shadow:0 0 0 1000px var(--input-bg) inset;box-shadow:0 0 0 1000px var(--input-bg) inset;
  transition:background-color 99999s}
body.dark option,body.dark optgroup{background:var(--surface-3);color:var(--text)}
body.dark ::placeholder{color:var(--input-placeholder,#6b7280)}
/* Every form field and table header takes the theme — the catch-alls that lived in
   dark-fixes.css, here in roles. A light island keeps its light controls. */
body.dark :is(input:not([type=checkbox],[type=radio],[type=range],[type=color],[type=file]),select,textarea):not([data-theme-keep] *){
  background:var(--input-bg);color:var(--input-text);border-color:var(--input-border)}
body.dark :is(input[type=date],input[type=time],input[type=datetime-local]):not([data-theme-keep] *){color-scheme:dark}
body.dark table th:not([data-theme-keep] *){background:var(--surface-2);color:var(--text-muted);border-color:var(--border)}
body.dark table td:not([data-theme-keep] *){border-color:var(--border)}
body.dark{scrollbar-color:#454a54 transparent}
