/* Creative Programs fonts for Canvas (canvas.ericbaez.com), added 2026-09-30.
   Colors live in the Canvas theme (Theme Editor variables on the main account); this file only sets fonts.
   Source of truth: /root/portal/canvas-brand/ on the Proxmox host, served by Caddy (CT 103) from
   /srv/canvas-brand/ at /cp-brand/. Same font files as Nextcloud and the apps page (OFL licensed).
   No Creative Programs logo on Canvas, by decision. */

@font-face {
  font-family: "Space Grotesk";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("/cp-brand/fonts/space-grotesk-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("/cp-brand/fonts/plus-jakarta-sans-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: italic;
  font-weight: 200 800;
  font-display: swap;
  src: url("/cp-brand/fonts/plus-jakarta-sans-italic-latin.woff2") format("woff2");
}

:root {
  --cp-font-body: "Plus Jakarta Sans", "Lato Extended", "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --cp-font-display: "Space Grotesk", "Plus Jakarta Sans", "Lato Extended", "Lato", Helvetica, Arial, sans-serif;
}

/* Everything is wrapped in "no dyslexia font": a person who turns on Canvas's OpenDyslexic option gets
   style files under .../new_styles_*_dyslexic/, and then these rules do nothing.
   !important is needed because Canvas's newer menus and buttons set their font in script-generated styles.
   Icons (their own icon fonts on ::before), code, and math keep their own fonts. */
:root:not(:has(link[href*="_dyslexic/"])) body,
:root:not(:has(link[href*="_dyslexic/"])) body :where(*):not(pre, code, kbd, samp, pre *, code *,
    [class^="icon-"], [class*=" icon-"], .CodeMirror, .CodeMirror *, .cm-editor, .cm-editor *,
    .MathJax, .MathJax *, mjx-container, mjx-container *, .math_equation_latex, .math_equation_latex *) {
  font-family: var(--cp-font-body) !important;
}

:root:not(:has(link[href*="_dyslexic/"])) :where(h1, h2, h3, h4, h5, h6),
:root:not(:has(link[href*="_dyslexic/"])) :where(h1, h2, h3, h4, h5, h6) *:not([class^="icon-"], [class*=" icon-"]) {
  font-family: var(--cp-font-display) !important;
}