/* Exact semantic colours from the CanadaPath mobile assets; see docs/WEBSITE.md. */
:root {
  --canvas: #F1F4F8;
  --surface: #FFFFFF;
  --elevated-surface: #FFFFFF;
  --accent: #B30D2A;
  --action-fill: #C8102E;
  --on-accent: #FFFFFF;
  --ink: #1A1A1A;
  --secondary-ink: #49596D;
  --separator: #D3DBE5;
  --control-border: #6B7889;
  --tinted-surface: #EDF1F6;
  --complementary: #24536B;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
  --canvas: #121212;
  --surface: #1C1C1C;
  --elevated-surface: #282828;
  --accent: #FFB3BD;
  --action-fill: #C8102E;
  --on-accent: #FFFFFF;
  --ink: #F2F2F2;
  --secondary-ink: #D0D0D0;
  --separator: #525252;
  --control-border: #ABABAB;
  --tinted-surface: #242424;
  --complementary: #D6D6D6;
  color-scheme: dark;
}
}
:root[data-theme="dark"] {
  --canvas: #121212;
  --surface: #1C1C1C;
  --elevated-surface: #282828;
  --accent: #FFB3BD;
  --action-fill: #C8102E;
  --on-accent: #FFFFFF;
  --ink: #F2F2F2;
  --secondary-ink: #D0D0D0;
  --separator: #525252;
  --control-border: #ABABAB;
  --tinted-surface: #242424;
  --complementary: #D6D6D6;
  color-scheme: dark;
}
@media (prefers-contrast: more) {
:root {
  --canvas: #F7F7F7;
  --surface: #FFFFFF;
  --elevated-surface: #FFFFFF;
  --accent: #A30B25;
  --action-fill: #A30B25;
  --on-accent: #FFFFFF;
  --ink: #1A1A1A;
  --secondary-ink: #333333;
  --separator: #737373;
  --control-border: #4A4A4A;
  --tinted-surface: #F0F0F0;
  --complementary: #303030;
  color-scheme: light;
}
:root[data-theme="dark"] {
  --canvas: #111111;
  --surface: #1C1C1C;
  --elevated-surface: #262626;
  --accent: #FFB3BD;
  --action-fill: #A30B25;
  --on-accent: #FFFFFF;
  --ink: #FAFAFA;
  --secondary-ink: #E6E6E6;
  --separator: #999999;
  --control-border: #CCCCCC;
  --tinted-surface: #292929;
  --complementary: #F0F0F0;
  color-scheme: dark;
}
}
@media (prefers-color-scheme: dark) and (prefers-contrast: more) {
:root:not([data-theme="light"]) {
  --canvas: #111111;
  --surface: #1C1C1C;
  --elevated-surface: #262626;
  --accent: #FFB3BD;
  --action-fill: #A30B25;
  --on-accent: #FFFFFF;
  --ink: #FAFAFA;
  --secondary-ink: #E6E6E6;
  --separator: #999999;
  --control-border: #CCCCCC;
  --tinted-surface: #292929;
  --complementary: #F0F0F0;
  color-scheme: dark;
}
}

/* Categorical chart colours are independent of text and brand colours. */
:root {
  --chart-1:#B30D2A;
  --chart-2:#0072B2;
  --chart-3:#967000;
  --chart-4:#7251A1;
}
@media(prefers-color-scheme:dark) {
  :root:not([data-theme="light"]) {
    --chart-1:#FF899D;
    --chart-2:#56B4E9;
    --chart-3:#E6BC45;
    --chart-4:#C6A0EA;
  }
}
:root[data-theme="dark"] {
  --chart-1:#FF899D;
  --chart-2:#56B4E9;
  --chart-3:#E6BC45;
  --chart-4:#C6A0EA;
}