/* The blog's colours: the app's Monochrome scheme, whatever colour the app is
 * shown in (AppTheme.colorScheme with DisplayColour.monochrome; DESIGN.md §3.2),
 * light and dark, and its high-contrast scheme when the reader's device asks
 * for more contrast. apps/mobile/test/blog_palette_test.dart fails, and prints
 * this file, when the scheme changes. */

:root {
  --md-primary: #000000;
  --md-on-primary: #e2e2e2;
  --md-primary-container: #3b3b3b;
  --md-on-primary-container: #ffffff;
  --md-secondary-container: #d4d4d4;
  --md-on-secondary-container: #1b1b1b;
  --md-tertiary: #3b3b3b;
  --md-surface: #f9f9f9;
  --md-on-surface: #1b1b1b;
  --md-on-surface-variant: #474747;
  --md-surface-container-lowest: #ffffff;
  --md-surface-container-low: #f3f3f3;
  --md-surface-container: #eeeeee;
  --md-surface-container-high: #e8e8e8;
  --md-outline: #777777;
  --md-outline-variant: #c6c6c6;
}

@media (prefers-color-scheme: dark) {
  :root {
    --md-primary: #ffffff;
    --md-on-primary: #1b1b1b;
    --md-primary-container: #d4d4d4;
    --md-on-primary-container: #000000;
    --md-secondary-container: #474747;
    --md-on-secondary-container: #e2e2e2;
    --md-tertiary: #e2e2e2;
    --md-surface: #131313;
    --md-on-surface: #e2e2e2;
    --md-on-surface-variant: #c6c6c6;
    --md-surface-container-lowest: #0e0e0e;
    --md-surface-container-low: #1b1b1b;
    --md-surface-container: #1f1f1f;
    --md-surface-container-high: #2a2a2a;
    --md-outline: #919191;
    --md-outline-variant: #474747;
  }
}

@media (prefers-contrast: more) {
  :root {
    --md-primary: #000000;
    --md-on-primary: #ffffff;
    --md-primary-container: #3b3b3b;
    --md-on-primary-container: #ffffff;
    --md-secondary-container: #494949;
    --md-on-secondary-container: #ffffff;
    --md-tertiary: #2c2c2c;
    --md-surface: #f9f9f9;
    --md-on-surface: #000000;
    --md-on-surface-variant: #000000;
    --md-surface-container-lowest: #ffffff;
    --md-surface-container-low: #f1f1f1;
    --md-surface-container: #e2e2e2;
    --md-surface-container-high: #d4d4d4;
    --md-outline: #2c2c2c;
    --md-outline-variant: #494949;
  }
}

@media (prefers-contrast: more) and (prefers-color-scheme: dark) {
  :root {
    --md-primary: #ffffff;
    --md-on-primary: #000000;
    --md-primary-container: #d4d4d4;
    --md-on-primary-container: #000000;
    --md-secondary-container: #c2c2c2;
    --md-on-secondary-container: #0b0b0b;
    --md-tertiary: #f0f0f0;
    --md-surface: #131313;
    --md-on-surface: #ffffff;
    --md-on-surface-variant: #ffffff;
    --md-surface-container-lowest: #000000;
    --md-surface-container-low: #1f1f1f;
    --md-surface-container: #303030;
    --md-surface-container-high: #3b3b3b;
    --md-outline: #f0f0f0;
    --md-outline-variant: #c2c2c2;
  }
}
