/* StudyCenter.ph design tokens — SPEC section 10.2 / 10.3 */

:root {
  /* Palette */
  --paper: #F7F9FF;
  --ink: #1B2559;
  --notebook-blue: #2F6BFF;
  --highlighter: #FFD23F;
  --mint: #22C59A;
  --pencil: #FF7A1A;
  --line: #D6DEF5;

  /* Derived neutrals, kept in the same cool family as --paper */
  --paper-raised: #FFFFFF;
  --ink-soft: #4A5891;   /* 6.44:1 on --paper */
  --ink-faint: #5E6A9C;  /* 4.97:1 on --paper; #6B78A8 was 4.09 and failed AA */

  /* --notebook-blue is the brand blue and stays exactly as specified. It
     reaches 4.27:1 on --paper: fine for borders, focus rings and icons
     (AA non-text needs 3:1) but short of the 4.5:1 body-text threshold,
     so link and button *text* uses this slightly darker step instead. */
  --link: #2A60E8;       /* 5.07:1 on --paper; white on it is 5.33:1 */

  /* Course colours (chips, card spines, course landing headers).
     Contrast of text placed ON each, so Phase 2 picks the right foreground
     without re-deriving it:
       Law         white 8.54  ink 1.69  -> white
       Medicine    white 4.54  ink 3.18  -> white
       Nursing     white 3.16  ink 4.56  -> ink
       Accountancy white 5.21  ink 2.77  -> white
       Criminology white 5.39  ink 2.68  -> white
       Education   white 2.97  ink 4.86  -> ink
       Civil Eng.  white 5.09  ink 2.84  -> white   (added 2026-09-27;
                   olive, hue 92, furthest from every other course colour;
                   4.83:1 on --paper for spines and chip borders)
     Medicine is #D93A40, not the specified #E5484D: the original reached AA
     with neither white (3.91) nor ink (3.69), so it could not carry text.
     Darkened on approval to the nearest value that clears AA for white. */
  --course-law: #8E2437;
  --course-medicine: #D93A40;
  --course-nursing: #14A38B;
  --course-accountancy: #3E63DD;
  --course-criminology: #6E56CF;
  --course-education: #F76B15;
  --course-civil-engineering: #4D7A26;

  /* State */
  --danger: #C62A3B;
  --danger-bg: #FDEFF1;
  --mint-bg: #E6F9F3;
  --focus: var(--notebook-blue);

  /* Type */
  --font-heading: "Bricolage Grotesque", system-ui, sans-serif;
  --font-body: "Figtree", system-ui, sans-serif;
  --text-base: 1.0625rem; /* 17px */
  --measure: 68ch;        /* keeps line length under 75 characters */

  /* Space */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;

  /* Shape */
  --radius: 10px;
  --radius-lg: 16px;
  --border: 1px solid var(--line);
  --sticker-shadow: 3px 3px 0 var(--ink);
}