/* Theme tokens: the one place to change colours and type.
   Brand palette from the Xavier Catholic Education Trust colour sheet.
   Purple, green and blue are sampled from the gradient in the Xavier logo
   and darkened where needed for white-text contrast; magenta is from the
   colour sheet. Swap in exact values here and everything follows. */
@font-face {
    font-family: "Montserrat";
    src: url("/fonts/montserrat.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

:root {
    --font: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

    /* Brand */
    --navy: #142146;
    --red: #c4232a;
    --yellow: #ebd166;
    --stone: #cfccbc;
    --mist: #eeeeed;
    --white: #ffffff;
    /* Approximated accents */
    --purple: #965995;
    --green: #2a7f5f;
    --blue: #2c78b3;
    --magenta: #953d76;

    /* Surfaces (light) */
    --bg: #f6f6f4;
    --surface: #ffffff;
    --surface-2: var(--mist);
    --text: var(--navy);
    --muted: #5a6280;
    --border: #d9d9d4;
    --accent: var(--yellow);
    --on-accent: var(--navy);
    --focus: #2c78b3;

    --radius: 18px;
    --radius-sm: 12px;
    --shadow: 0 1px 2px rgba(20, 33, 70, .08), 0 6px 18px rgba(20, 33, 70, .10);
    --bar-h: 60px;
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg: #0d1530;
        --surface: #172247;
        --surface-2: #1f2b57;
        --text: #f3f4f8;
        --muted: #aab1cc;
        --border: #2d3a6a;
        --focus: #8cc4f0;
        --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 6px 18px rgba(0, 0, 0, .35);
    }
}