/* ============================================================================
   juribooks-typography-scope-v2.css — technical interface/report typography
   separation (audit D5/D6). Presentation only; loaded last so it governs.

   Strategy (no rewrite of the 85 clean-selectors, no new broad !important
   layer): introduce namespaced SOURCE variables for interface vs report, alias
   the legacy shared variables to the INTERFACE source at :root, and re-alias
   them to the REPORT source inside an explicit `[data-typography-scope="report"]`
   container. Every existing selector that reads --font-heading / --font-body /
   --color-* keeps working and now resolves per scope automatically.

   applyAppr() (overridden in juribooks-appearance2-v2.js) writes ONLY the
   --ui-*/--report-* source vars, and no longer hijacks the global --ink.
   ========================================================================== */

/* ---- 1. Namespaced source variables (defaults track the app's base tokens) ---- */
:root{
  --ui-font-heading: var(--fsans);
  --ui-font-subheading: var(--fsans);
  --ui-font-body: var(--fsans);
  --ui-color-heading: var(--navy);
  --ui-color-subheading: var(--mute);
  --ui-color-body: var(--ink);

  --report-font-heading: var(--fsans);
  --report-font-subheading: var(--fsans);
  --report-font-body: var(--fsans);
  --report-color-heading: var(--navy);
  --report-color-subheading: var(--mute);
  --report-color-body: var(--ink);
}

/* ---- 2. Legacy aliases → INTERFACE source (kept for one release) ----
   These are the exact variables existing selectors already read. At :root they
   resolve to the interface source, so the whole app shell/sidebar/forms follow
   Interface settings. (No --ink alias here — interface body colour is a soft
   token and must NOT recolour the semantic --ink used by inputs, debit/credit,
   trust, warnings and destructive actions. That is the D6 fix.) */
:root{
  --font-heading: var(--ui-font-heading);
  --font-subheading: var(--ui-font-subheading);
  --font-body: var(--ui-font-body);
  --ui-font: var(--ui-font-heading);          /* titles route through --ui-font */
  --color-heading: var(--ui-color-heading);
  --color-subheading: var(--ui-color-subheading);
  --color-body: var(--ui-color-body);
}

/* ---- 3. REPORT scope: the SAME legacy vars re-resolve to the report source,
   through inheritance, for genuine report containers only. ---- */
[data-typography-scope="report"]{
  --font-heading: var(--report-font-heading);
  --font-subheading: var(--report-font-subheading);
  --font-body: var(--report-font-body);
  --ui-font: var(--report-font-heading);
  --color-heading: var(--report-color-heading);
  --color-subheading: var(--report-color-subheading);
  --color-body: var(--report-color-body);
  /* report body text picks up the report body family (headers/titles/amounts
     override with their own family below) */
  font-family: var(--report-font-body);
  color: var(--report-color-body);
}
/* NOTE: the report-scope override of the semantic --ink (so report cells that
   read var(--ink) take the report body colour) is injected dynamically by
   applyAppr ONLY when an explicit report body colour is chosen — into
   <style id="a2-report-ink">. Done dynamically to avoid a --ink ↔
   --report-color-body resolution cycle, and so "Auto" leaves --ink semantic. */

/* ---- 4. Amount columns: ALWAYS monospaced + tabular, in every scope, so a
   report/interface font choice can never break column alignment. For table
   cells a direct rule beats the inherited container font (declared > inherited),
   so no !important is needed there. ---- */
.amt, .num, .money, .mono,
.tb-tbl td.r, .stmt td.r, .recent-tbl td.r, .coa-tbl td.r, td.num,
.jtbl input.amt, .jtbl td.r input, input.mono{
  font-family: var(--fmono);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
}
/* DOCUMENTED !important (neutralises a pre-existing broad !important, per the
   brief's instruction to reduce/neutralise conflicts rather than only add layers):
   Selector : [data-typography-scope="report"] td.r / td.num / .num / .amt / .money
   Reason   : lib/juribooks-skin-v2.css declares `.tb-tbl td { font-family:
              var(--font-body) !important }`, which forces the report BODY font
              onto amount cells too and would break column alignment whenever a
              non-mono report typeface is chosen.
   Scope    : report-scoped amount cells only — not a broad app-wide layer.
   Why not normal specificity : the conflicting declaration is !important, and a
              non-!important rule cannot beat an !important one at any specificity,
              so this must match it. It is the minimum needed to keep amount
              columns monospaced and column-aligned. */
[data-typography-scope="report"] td.r,
[data-typography-scope="report"] td.num,
[data-typography-scope="report"] .num,
[data-typography-scope="report"] .amt,
[data-typography-scope="report"] .money{
  font-family: var(--fmono) !important;
  font-variant-numeric: tabular-nums !important;
}
/* DOCUMENTED !important (the only one added by D5/D6):
   Selector : .dkpi .v, .kpi .v   (dashboard KPI monetary values)
   Reason   : the requirement is that KPI monetary values are ALWAYS
              mono + tabular; the dashboard-skin layer sets the lead tile's
              value to the heading face with its own !important
              (#view-home .kpi-grid > .dkpi[data-jb2-lead]:first-child .v).
   Scope    : the two KPI value classes only — not a broad layer.
   Why not normal specificity : a plain rule cannot beat an existing
              !important declaration regardless of specificity, so matching
              !important AND the lead tile's higher specificity is the minimum
              needed to keep the KPI figure monospaced. */
.dkpi .v, .kpi .v,
#view-home .kpi-grid > .dkpi[data-jb2-lead]:first-child .v{
  font-family: var(--fmono) !important;
  font-variant-numeric: tabular-nums !important;
}

/* ---- 5. Fee-note isolation: #feeNote uses its OWN invoice appearance, never
   the interface or report typography. Redefining the vars locally means every
   descendant of #feeNote resolves to the invoice family/colour, so neither
   Interface nor Financial-report controls can leak in (no !important needed —
   a local var definition wins for the subtree). ---- */
#feeNote{
  --font-heading: var(--inv-font-heading, var(--fserif));
  --font-subheading: var(--inv-font-subheading, var(--fserif));
  --font-body: var(--inv-font-body, var(--fsans));
  --ui-font: var(--inv-font-heading, var(--fserif));
  --color-heading: var(--inv-color-heading, var(--navy));
  --color-subheading: var(--inv-color-subheading, var(--mute));
  --color-body: var(--inv-color-body, var(--ink));
  font-family: var(--inv-font-body, var(--fsans));
}
#feeNote .amt, #feeNote .num, #feeNote td.r{ font-family: var(--fmono); font-variant-numeric: tabular-nums; }
