/* ═══════════════════════════════════════════════════
   SPHRAGIO — Design Tokens (PR-D2b, ADR-0025)

   The single source of design tokens consumed by all three surfaces:
   the upload page, the live result page, and the standalone HTML export.
   The export INLINES this file verbatim (zero external requests); the live
   surfaces LINK it from base.html. Defined once here — do not re-declare
   these custom properties elsewhere.
   ═══════════════════════════════════════════════════ */

:root {
  /* ── Brand: SPHRAGIO indigo/navy scale ── */
  --indigo-50:  #EFF1FB;
  --indigo-100: #DCE0F6;
  --indigo-300: #8E97D8;
  --indigo-500: #4A56B5;
  --indigo-700: #2A1C7A;
  --indigo-900: #1C0D5A;
  --navy:         #1C0D5A;
  --navy-light:   #295CFF;
  --navy-dark:    #0E1738;
  --accent:       #F5A524;
  --accent-light: #F8B940;
  --green:        #1DB87A;
  --green-check:  #2E8B57;
  --off-white:    #E1EBEE;
  --white:        #FFFFFF;
  --bg-blue:      #EFF7FB;
  --gray-50:      #F7F8FA;
  --gray-100:     #E8ECF1;
  --gray-200:     #D0DAE8;
  --gray-500:     #6B7A8D;
  --gray-700:     #3A4A5C;
  --gray-900:     #1A2332;

  /* ── Semantic severity colours (one source for chips/badges/cards) ── */
  --sev-critical:    #DC2626;
  --sev-critical-bg: #FEF2F2;
  --sev-major:       #EA580C;
  --sev-major-bg:    #FFF7ED;
  --sev-minor:       #CA8A04;
  --sev-minor-bg:    #FEFCE8;
  --sev-info:        #1C0D5A;
  --sev-info-bg:     #EFF1FB;
  --sev-ok:          #16A34A;
  --sev-ok-bg:       #F0FDF4;
  /* Ink variants: darker on-tint TEXT colours — ≥4.5:1 (WCAG 2.1 AA) on both
     the matching -bg tint and on white at badge/chip font sizes. The base
     --sev-* values stay for borders, fills and the donut (decorative /
     large-shape uses where 3:1 suffices). */
  --sev-critical-ink: #B91C1C;
  --sev-major-ink:    #C2410C;
  --sev-minor-ink:    #A16207;
  --sev-info-ink:     #1C0D5A;
  --sev-ok-ink:       #15803D;

  /* ── Poppins type scale ── */
  --font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
  /* Academic display face for report/assessment surfaces (headings, score
     numerals). A system serif stack — zero webfont bytes, resolves offline in
     the self-contained HTML export and stays WeasyPrint-safe. */
  --font-display: 'Charter', 'Bitstream Charter', 'Sitka Text', Cambria, Georgia, 'Times New Roman', serif;
  --text-xs:   0.75rem;   /* 12 */
  --text-sm:   0.875rem;  /* 14 */
  --text-base: 1rem;      /* 16 */
  --text-lg:   1.125rem;  /* 18 */
  --text-xl:   1.25rem;   /* 20 */
  --text-2xl:  1.5rem;    /* 24 */
  --text-3xl:  1.875rem;  /* 30 */
  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;
  --weight-extra:    800;

  /* ── Spacing scale ── */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 40px;
  --space-8: 48px;

  /* ── Radius ── */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-pill: 9999px;

  /* ── Shadow ── */
  --shadow-card:  0 4px 24px rgba(28,13,90,0.10);
  --shadow-hover: 0 8px 32px rgba(28,13,90,0.16);

  /* ── Component anatomy (chip / badge / card) ── */
  --chip-radius:   var(--radius-pill);
  --chip-pad-y:    4px;
  --chip-pad-x:    12px;
  --badge-radius:  var(--radius-sm);
  --badge-pad-y:   2px;
  --badge-pad-x:   8px;
  --card-radius:   var(--radius-md);
  --card-pad:      var(--space-6);
  --card-border:   1.5px solid var(--gray-200);
  --card-shadow:   var(--shadow-card);

  /* ── Layout ── */
  --nav-height: 80px;
}

@media (max-width: 768px) {
  :root { --nav-height: 64px; }
}
