/* Color and type tokens — the single source of truth for the app's colors.
   From the scoreTec design manual (240526_Design-Manual-scoreTec.pdf on the
   shared Google Drive): white background, Maastricht Blue text, Deep Jungle
   Green actions, Neon Green accents, Satoshi type. Light by default; the dark
   palette below applies when js/theme.js sets data-theme="dark" on <html>. */

:root {
    /* Brand palette */
    --maastricht-blue: #0a2139;
    --neon-green: #0af47d;
    --deep-jungle-green: #014549;
    --tropical-rain-forest: #027358;
    --green-munsell: #00a47d;
    --medium-turquoise: #59d3cd;

    /* Roles */
    --background: #ffffff;
    --surface: #ffffff;
    --surface-muted: #eef5f4;
    --border: #d5e1df;
    --text: var(--maastricht-blue);
    --text-muted: #4f5e6e;
    --primary: var(--deep-jungle-green);
    --primary-hover: var(--tropical-rain-forest);
    --primary-text: #ffffff;
    --accent: var(--neon-green);
    --accent-text: var(--green-munsell);
    --danger: #c93c37;
    --group-row: #e3f8ee;
    --hours-over: var(--tropical-rain-forest);
    --raised: #ffffff;          /* Things that float: the user menu and the theme pill's highlight */
    --shadow: rgba(10, 33, 57, 0.14);
    --backdrop: rgba(10, 33, 57, 0.45);
    color-scheme: light;
    --font: "Satoshi", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    /* Text sizes: body text and what is typed into boxes, and the smaller
       text of labels, hints, table headers and small buttons. */
    --font-size: 16px;
    --font-size-small: 14.5px;
}

/* Dark: a deep Maastricht Blue background, and the actions lifted to a bright
   green (with dark text on it) so they stand out against it. */
:root[data-theme="dark"] {
    --background: #07182a;
    --surface: #0c2237;
    --surface-muted: #143049;
    --border: #234461;
    --text: #e4edf3;
    --text-muted: #9db0c2;
    --primary: #3ddc97;
    --primary-hover: #6ae8b3;
    --primary-text: var(--maastricht-blue);
    --accent-text: #3ddc97;
    --danger: #ff6f69;
    --group-row: #12392f;
    --hours-over: #3ddc97;
    --raised: #1b3a57;
    --shadow: rgba(0, 0, 0, 0.45);
    --backdrop: rgba(0, 0, 0, 0.6);
    color-scheme: dark;
}
