/* ==========================================================================
   ABI Partner Portal — design tokens
   Spec §13.2 / §13.3. Single source of truth for type, color and metrics.
   No CSS framework. Every value below is referenced by name in app.css.
   ========================================================================== */

/* ---- Self-hosted faces (§13.3: no Google Fonts requests from the portal) --
   Both upright faces are variable; the weight ranges below are the real axis
   ranges of the shipped woff2 files, so no synthetic bolding occurs.        */

@font-face {
  font-family: 'Libre Baskerville';
  src: url('../fonts/libre-baskerville-latin.woff2') format('woff2');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Libre Baskerville';
  src: url('../fonts/libre-baskerville-latin-italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Source Sans 3';
  src: url('../fonts/source-sans-3-latin.woff2') format('woff2');
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Source Sans 3';
  src: url('../fonts/source-sans-3-latin-italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

:root {

  /* ---- Type ------------------------------------------------------------
     Serif is for display only: page titles, section heads, and figures of
     consequence (dollar amounts, totals). Everything else is the sans.    */

  --serif: 'Libre Baskerville', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
  --sans:  'Source Sans 3', 'Helvetica Neue', Helvetica, Arial, sans-serif;

  --fs-title:    27px;  /* page title, serif                */
  --fs-section:  17px;  /* section head, serif              */
  --fs-fig:      26px;  /* stat-strip figure, serif         */
  --fs-fig-lg:   31px;  /* headline figure (reserve), serif */
  --fs-body:     14px;
  --fs-meta:     13px;  /* meta lines, table body           */
  --fs-small:    12px;
  --fs-micro:    11px;  /* uppercase micro-label            */

  --lh-body: 1.5;
  --lh-tight: 1.25;
  --ls-micro: 0.08em;

  /* ---- Color -----------------------------------------------------------
     Paper/ink/muted/hairlines carry the page; the three brand colors are
     used sparingly and always for the same job.                          */

  --paper:        #fdfcf9;
  --ink:          #1d2523;
  --muted:        #5a6360;

  --rule:         #e6e2d8;  /* table row rules, section rules  */
  --rule-strong:  #d8d4c9;  /* panel borders, header underline */

  --teal-deep:    #0d3b3d;  /* header bar, serif headings, title rule */
  --teal:         #008083;  /* links and interactive accents          */
  --teal-tint:    #e7f0f0;  /* selected rows, member badge            */
  --teal-nav:     #9fc4c5;  /* inactive nav on the deep-teal bar      */

  --orange:       #d96f00;  /* active-nav rule, key figures, accents */
  --orange-cta:   #b45a00;  /* primary button surface — see note (a) */
  --orange-cta-h: #d96f00;  /* brightens on hover                    */

  --success:      #1d6b4f;
  --danger:       #a33226;
  --warn-bg:      #faf3e8;
  --warn-text:    #6b3a00;

  /* Flat status tints (§18.2 diff chips; reused for row states) */
  --added-bg:     #eaf3de;  --added-text:    #27500a;
  --removed-bg:   #fcebeb;  --removed-text:  #791f1f;
  --changed-bg:   #faf3e8;  --changed-text:  #6b3a00;

  /* Category tints — see note (b) on the Advisory-board chip */
  --cat-spon-bg:  #e7f0f0;  --cat-spon-text: #0d3b3d;
  --cat-ab-bg:    #f3ece1;  --cat-ab-text:   #6b4a1f;
  --cat-memb-bg:  #e9eff6;  --cat-memb-text: #1f4470;
  --cat-res-bg:   #eeece6;  --cat-res-text:  #4a504d;

  /* ---- Form metrics ----------------------------------------------------
     Field borders are #8f8a7c rather than the spec's #b9b4a7 — see note (c). */

  --field-border: #8f8a7c;
  --field-bg:     #ffffff;
  --field-radius: 3px;

  /* ---- Metrics ---------------------------------------------------------
     Radius is 0–3px everywhere (§13.1). Density is comfortable-dense.     */

  --radius:       3px;
  --gutter:       24px;
  --header-h:     52px;
  --cell-y:       11px;   /* table cell padding, vertical   */
  --cell-x:       14px;   /* table cell padding, horizontal */
  --page-max:     1200px;
}

/* (a) Primary-button surface. §13.2 specifies #d96f00 with white label, which
       measures 3.37:1 — below the 4.5:1 WCAG 2.1 AA threshold for 14px text.
       The button surface therefore uses the spec's own darker orange
       (#b45a00, 4.77:1) and brightens to #d96f00 on hover. Brand orange is
       unchanged everywhere it is not carrying small white text (active-nav
       rule, section accents, serif figures — all ≥3:1 as large text or
       non-text). To follow §13.2 literally, set --orange-cta: #d96f00.

   (b) §13.4 names a purple chip for Advisory board while §13.1 prohibits
       purple anywhere. §13.1 wins (it is the CI-gated rule); the chip uses a
       warm sand tint that stays distinct from the teal/blue/gray siblings.

   (c) §13.2 specifies 1px #b9b4a7 field borders, which measure 2.02:1 against
       paper — below the 3:1 WCAG 1.4.11 threshold for control boundaries.
       #8f8a7c (3.36:1) is the nearest tone that passes. Revert by setting
       --field-border: #b9b4a7. */
