/**
 * CARISCA design tokens.
 *
 * Colour values are the ones the live carisca.knust.edu.gh theme uses, with
 * each one's role taken from the selector it appears in rather than guessed.
 * Two of them fail contrast as text, so the semantic tokens below route around
 * that — see --color-accent-text.
 */

:root {
  /* --- brand, as published --------------------------------------------- */
  --carisca-blue: #0f3b8f;        /* .c-primary / .bg-primary               */
  --carisca-navy: #0a2961;        /* .button-primary:hover, a:hover         */
  --carisca-cyan: #34cbf7;        /* .c-secondary / .bg-secondary           */
  --carisca-cyan-deep: #0abaf0;   /* .button-secondary:hover                */
  --carisca-slate: #677289;       /* body copy, breadcrumbs                 */
  --carisca-mist: #b3bdd1;        /* pale rules                             */
  --carisca-rose: #e25079;        /* .page-title — reserved for danger here */

  /* --- surfaces --------------------------------------------------------- */
  --color-bg: #f4f7fc;
  --color-surface: #ffffff;
  --color-surface-sunken: #ebf0f9;
  --color-border: #d3dcec;
  --color-border-strong: var(--carisca-mist);

  /* --- text ------------------------------------------------------------- */
  --color-text: #111c36;
  --color-text-muted: #3e4a63;
  --color-text-subtle: var(--carisca-slate);
  --color-text-on-accent: #ffffff;

  /* --- accent ----------------------------------------------------------- */
  --color-accent: var(--carisca-blue);
  --color-accent-hover: var(--carisca-navy);
  --color-accent-wash: #e3eaf7;
  /**
   * Text and icons only ever use this. The cyan measures 1.9:1 on white and
   * must never carry text, however tempting it looks on a button.
   */
  --color-accent-text: var(--carisca-blue);
  --color-highlight: var(--carisca-cyan);

  /* --- semantic --------------------------------------------------------- */
  --color-success: #1c6b4b;
  --color-success-wash: #e4f2ec;
  --color-warning: #985c08;
  --color-warning-wash: #fbf0dc;
  --color-danger: #c33a5f;
  --color-danger-wash: #fce7ec;
  --color-info: var(--carisca-blue);
  --color-info-wash: var(--color-accent-wash);

  /* --- type ------------------------------------------------------------- */
  /*
    Arimo for everything, as CARISCA's own site does — it sets Arimo on
    body, inputs, buttons and headings alike. Hierarchy comes from weight and
    size rather than from a second family.
  */
  --font-heading: var(--font-arimo), Helvetica, Arial, sans-serif;
  --font-body: var(--font-arimo), -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.9375rem;
  --text-md: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-3xl: 2.25rem;
  --text-4xl: clamp(2.25rem, 5vw, 3.25rem);

  /* --- 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;
  --space-9: 6rem;

  --radius-sm: 3px;
  --radius: 5px;
  --radius-lg: 8px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgb(17 28 54 / 6%);
  --shadow: 0 2px 8px rgb(17 28 54 / 8%);
  --shadow-lg: 0 8px 28px rgb(17 28 54 / 12%);

  --shell: 1140px;
  --shell-narrow: 720px;

  --ring: 0 0 0 3px rgb(15 59 143 / 25%);

  /* --- motion -----------------------------------------------------------
   * Every transition on this site is decoration: nothing uses movement as
   * the only signal that something changed, so zeroing the duration below
   * removes the animation without removing the meaning.
   */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --dur: 180ms;
  --dur-slow: 300ms;

  /* A warmer, deeper lift than --shadow for cards that rise on hover. */
  --shadow-hover: 0 10px 30px -6px rgb(17 28 54 / 18%);
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur: 0ms; --dur-slow: 0ms; }
}

/**
 * Dark mode is not offered yet. When it is, only the surface/text/accent
 * groups above are redefined — the brand block stays fixed, and the cyan
 * finally becomes the primary accent because it reaches 10:1 on navy.
 */