// theme-light.css
:root {
  --primary-bg: #f2e8d5;
  --primary-bg-shade-1: #e5d8bc;
  --primary-bg-shade-2: #e0c89b;
  --primary-bg-shade-3: #c4ab7e;
  --primary-fg: #000;
  --input-fg: #000;
  --input-bg: #fff;
  --code-bg: rgba(255,255,255,0.5);
  --standalone-link: #eb8900;
  --standalone-link-hover: #fd0;
  --button-fg: #ba2f00;
  --button-bg: white;
  --form-bg: #c75000;
  --color-bg: #ad6500;
  --inline-link: #0046d1;
  --dim-fg: #636363;
  --focus: #0044ca;
}

// theme-dark.css
:root {
  --primary-bg: #252017;
  --primary-fg: #f2e8d5;
  --primary-bg-shade-1: #2d271c;
  --primary-bg-shade-2: #382e22;
  --primary-bg-shade-3: #4e402e;
  --standalone-link: #d4943a;
  --standalone-link-hover: #fd0;
  --inline-link: #6694ff;
  --dim-fg: #8f8f8f;
  --button-fg: white;
  --button-bg: #654600;
  --input-bg: #4e402e;
  --input-fg: #fff;
  --code-bg: rgba(255,255,255,0.12);
  --supported: #0b6316;
  --supported-alt: #095714;
  --supported-stats: #319b43;
  --partial: #4d5702;
  --partial-alt: #3f4702;
  --partial-stats: #8b8d11;
  --no-support: #86261a;
  --no-support-alt: #6e1f14;
  --unknown: #464646;
  --form-bg: #833502;
  --color-bg: #654600;
  --black-img-filter: invert(1);
  --unofficial: #8a8a8a;
  --fg-white: #ffffffba;
  --firefox-bg: #613910;
  --chrome-bg: #1b4475;
  --safari-bg: #414141;
}

// main.css
body.accessible-colors {
  --supported: #a6edb2;
  --no-support: #842e98;
  --no-support-pattern: #842e98 none;
  --partial: #8090f9;
  --partial-stats: #5c6708;
  --partial-pattern: #8090f9 none;
  --unknown: #838383;
  --hover-filter: 'grayscale(0.5)';
  --supported-fg: #000;
  --partial-fg: #000;
}

// main.css
:root {
  --supported: #2a8436;
  --supported-stats: #277c32;
  --no-support: #c44230;
  --no-support-alt: #b43b2b;
  --no-support-pattern: repeating-linear-gradient(45deg, var(--no-support) 0, var(--no-support-alt) 1px, var(--no-support-alt) 0.4em, var(--no-support) calc(.25em + 1px), var(--no-support) 0.75em);
  --partial: #807301;
  --partial-alt: #746c00;
  --partial-pattern: repeating-linear-gradient(90deg, var(--partial) 0, var(--partial-alt) 1px, var(--partial-alt) 0.4em, var(--partial) calc(.25em + 1px), var(--partial) 0.75em);
  --partial-stats: #5c6708;
  --unknown: #757575;
  --fg-white: white;
  --hover-filter: 'grayscale(0.5)';
  --cta-button-fg: white;
  --cta-button-bg: #db5600;
  --supported-fg: #fff;
  --supported-stats-fg: #fff;
  --no-support-fg: #fff;
  --partial-fg: #fff;
  --partial-stats-fg: #fff;
  --unknown-fg: #fff;
  --unofficial: #757575;
  --firefox-bg: #a36223;
  --chrome-bg: #3f77bb;
  --safari-bg: #666;
}
