/* =============================================================================
   BUAMS AI new-ui — DESIGN TOKENS
   Spec: /frontend_design.md  §B (colour) §C (typography) §D (spacing)

   THE single source of truth for every colour, size, space, radius, shadow and
   duration in the new-ui system. No component or page file may declare a raw
   hex value, pixel font-size, or arbitrary spacing — use a token or add one
   here with a documented purpose.

   Namespace `--bui-*` so these can never collide with EHR2's `--ehr2-*` /
   `--color-*` tokens, even if both stylesheets are loaded on one page by
   mistake. new-ui and ehr2 must never share a page (see spec §0).
   ============================================================================= */

:root {
  /* ── Brand ramp (spec §B.1) ───────────────────────────────────────────────
     #015B3A is the BUAMS identity green and appears in the logo. */
  --bui-primary-900: #012B1C;
  --bui-primary-800: #013E28;
  --bui-primary-700: #015B3A;  /* brand primary */
  --bui-primary-600: #0A7049;
  --bui-primary-500: #158A5C;
  --bui-primary-200: #BFDDD0;
  --bui-primary-100: #E6F2EC;
  --bui-primary-50:  #F2F9F6;

  /* rgb triplet for rgba() focus rings without a second hex literal */
  --bui-primary-rgb: 1, 91, 58;

  /* ── Accent (spec §B.2) — AI + informational affordances ONLY ──────────── */
  --bui-accent-700: #0E7490;
  --bui-accent-100: #E0F2F7;

  /* ── Semantic (spec §B.3) — kept separate from brand so status meaning
        survives a tenant re-theme. Success is deliberately a different
        lightness from primary so "brand" and "it worked" never read alike. */
  --bui-success:    #157F4F;
  --bui-success-bg: #E7F5EE;
  --bui-warning:    #A16207;
  --bui-warning-bg: #FEF6E7;
  --bui-danger:     #B42318;
  --bui-danger-bg:  #FEECEA;
  --bui-info:       #175CD3;
  --bui-info-bg:    #EAF1FE;

  /* ── Neutrals (spec §B.4) — faintly green-tinted so they sit with the
        brand rather than fighting it. */
  --bui-ink-900:     #0F1A15;  /* primary text, headings         16.9:1 AAA */
  --bui-ink-700:     #33403A;  /* body on tinted surfaces                   */
  --bui-ink-500:     #667A70;  /* secondary text, help            4.9:1 AA  */
  --bui-ink-300:     #A3B0A9;  /* placeholder/disabled ONLY — 2.4:1, fails
                                  AA by design; never real content          */
  --bui-line:        #DFE5E1;
  --bui-line-strong: #C3CDC7;
  --bui-canvas:      #F5F8F6;
  --bui-surface:     #FFFFFF;
  --bui-surface-2:   #FAFCFB;
  --bui-disabled-bg: #EFF2F0;

  /* ── Typography (spec §C) ─────────────────────────────────────────────────
     System stack, no webfont. This is a clinical app on hospital networks and
     field tablets: a blocking font request costs legibility exactly when it
     matters, and FOIT on a login form reads as a broken page. */
  --bui-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
              'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
  --bui-font-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas,
                   'Liberation Mono', monospace;

  --bui-text-display:  2rem;      /* 32px — auth brand headline only */
  --bui-text-h1:       1.5rem;    /* 24px */
  --bui-text-h2:       1.1875rem; /* 19px */
  --bui-text-h3:       1.0625rem; /* 17px */
  --bui-text-body:     0.9375rem; /* 15px — floor for body copy */
  --bui-text-sm:       0.875rem;  /* 14px */
  --bui-text-xs:       0.8125rem; /* 13px — support text only */
  --bui-text-label:    0.8125rem; /* 13px */
  --bui-text-btn:      0.9375rem; /* 15px */
  --bui-text-overline: 0.6875rem; /* 11px */

  --bui-lh-tight:  1.2;
  --bui-lh-snug:   1.35;
  --bui-lh-normal: 1.55;

  --bui-fw-regular:  400;
  --bui-fw-medium:   500;
  --bui-fw-semibold: 600;
  --bui-fw-bold:     650;
  --bui-fw-heavy:    700;

  /* ── Spacing — 4px base scale (spec §D) ─────────────────────────────────── */
  --bui-space-1:  4px;
  --bui-space-2:  8px;
  --bui-space-3:  12px;
  --bui-space-4:  16px;
  --bui-space-5:  20px;
  --bui-space-6:  24px;
  --bui-space-8:  32px;
  --bui-space-10: 40px;
  --bui-space-12: 48px;
  --bui-space-16: 64px;

  /* ── Radii (spec §D.2) ────────────────────────────────────────────────────── */
  --bui-radius-sm:   6px;
  --bui-radius-md:   10px;
  --bui-radius-lg:   14px;
  --bui-radius-xl:   20px;
  --bui-radius-pill: 999px;

  /* ── Elevation ──────────────────────────────────────────────────────────── */
  --bui-shadow-xs: 0 1px 2px rgba(15, 26, 21, .05);
  --bui-shadow-sm: 0 2px 8px rgba(15, 26, 21, .06);
  --bui-shadow-md: 0 8px 24px rgba(15, 26, 21, .08);
  --bui-shadow-lg: 0 20px 48px rgba(15, 26, 21, .12);

  /* ── Motion — collapsed globally under prefers-reduced-motion (reset.css) */
  --bui-transition:      .16s ease;
  --bui-transition-slow: .24s ease;

  /* ── Focus ring — one definition, used by every interactive element ─────── */
  --bui-focus-ring: 0 0 0 3px rgba(1, 91, 58, .15);

  /* ── Control sizing ─────────────────────────────────────────────────────── */
  --bui-control-h:    42px;
  --bui-control-h-sm: 32px;
  --bui-control-h-lg: 48px;
  --bui-touch-min:    44px;  /* WCAG touch target floor (spec §H.2) */

  /* ── Layout ─────────────────────────────────────────────────────────────── */
  --bui-auth-brand-w:  48%;
  --bui-auth-brand-max: 620px;
  --bui-auth-form-max:  460px;
  --bui-z-modal:   1055;
  --bui-z-toast:   1090;
  --bui-z-skiplink: 1100;
}