/* ==========================================================================
   Design tokens — the single source of truth for colour, type and spacing.

   DO NOT EDIT THIS FILE without agreement. Every screen reads these values,
   so a change here changes all eleven pages at once.

   Use the variables. Never write a raw hex colour or a raw pixel gap in a
   page stylesheet: var(--ink) not #1A1A2E, var(--space-4) not 16px.
   ========================================================================== */

:root {
  /* --- brand ------------------------------------------------------------
     Sampled from the Obafemi Awolowo University crest. */
  --indigo:        #240C54;   /* masthead, primary framing */
  --indigo-dark:   #17073A;   /* utility bar, footer */
  --indigo-soft:   #3B2C7A;   /* hover on indigo surfaces */
  --indigo-wash:   #EEEBF6;   /* active nav item, soft tints */
  --gold:          #E4B454;   /* accent. Used sparingly, never as a fill */
  --blue:          #1D4ED8;   /* links and primary actions */
  --blue-dark:     #1739A8;   /* link and button hover */

  /* --- neutrals --------------------------------------------------------- */
  --ink:           #1A1A2E;   /* body text */
  --ink-muted:     #5B5B6B;   /* secondary text, captions */
  --rule:          #D8DAE5;   /* borders and dividers */
  --rule-strong:   #B9BDCE;   /* table header underline */
  --surface:       #FFFFFF;   /* panels */
  --wash:          #F4F5F9;   /* page background, table stripes */

  /* --- on dark ---------------------------------------------------------
     Text and rules that sit on an indigo surface. Named by their job, not
     their lightness, so a change of brand colour does not orphan them. */
  --on-dark:        #FFFFFF;   /* headings and primary text on indigo */
  --on-dark-muted:  #CFC7EA;   /* lead paragraphs on indigo */
  --on-dark-faint:  #B3A9D8;   /* captions and hints on indigo */
  --on-dark-link:   #DDD6F0;   /* links in the footer */
  --on-dark-rule:   #2F1E5C;   /* dividers inside a dark block */

  /* --- state -----------------------------------------------------------
     Colour is never the only signal. Always pair with words. */
  --ok:            #1E7A46;
  --ok-wash:       #E8F5EE;
  --ok-line:       #B7DEC8;
  --warn:          #8A5A00;
  --warn-wash:     #FDF4E3;
  --warn-line:     #E8D3A4;
  --bad:           #A32020;
  --bad-wash:      #FBEBEB;
  --bad-line:      #E5B9B9;

  /* --- type ------------------------------------------------------------- */
  --font-head: Cambria, Georgia, "Times New Roman", serif;
  --font-body: Calibri, "Segoe UI", -apple-system, Arial, sans-serif;
  --font-mono: "Courier New", ui-monospace, monospace;

  --text-xs:   0.75rem;   /* 12px — captions, table metadata */
  --text-sm:   0.875rem;  /* 14px — table cells, helper text */
  --text-base: 1rem;      /* 16px — body. Never go below this for prose */
  --text-lg:   1.125rem;  /* 18px — lead paragraphs */
  --text-xl:   1.375rem;  /* 22px — subsection heading */
  --text-2xl:  1.75rem;   /* 28px — section heading */
  --text-3xl:  2rem;      /* 32px — page title */

  /* --- spacing ---------------------------------------------------------
     An 8px scale. Pick from this list; do not invent 13px. */
  --space-1: 0.25rem;  /*  4px */
  --space-2: 0.5rem;   /*  8px */
  --space-3: 0.75rem;  /* 12px */
  --space-4: 1rem;     /* 16px */
  --space-5: 1.5rem;   /* 24px */
  --space-6: 2rem;     /* 32px */
  --space-7: 3rem;     /* 48px */

  /* --- structure -------------------------------------------------------- */
  --radius:      4px;    /* institutional, not a startup pill */
  --radius-lg:   6px;
  --header-h:    69px;   /* sticky header height; sticky offsets key off this */
  --shell:       1200px; /* max content width */
  --shell-narrow: 640px; /* sign-in, password change */
  --border:      1px solid var(--rule);
}
