:root body.blue {
    --color-primary: #007bff;
    --color-primary-light: rgba(0, 123, 255, 0.2);
    /* red colors */
}
:root body.blue,
:root body.blue.dark .override-light {
    /* light colors */
    --color-background: rgba(255, 255, 255, 1);
    --color-font: rgba(55, 65, 81, 1);
    --color-links: rgba(0, 123, 255, 1);
    --color-border: rgb(89, 89, 89, 0.1);
    --color-code: rgba(0, 0, 0, 0.1);
    --color-header-background: #fff;
    --color-header-text: rgba(55, 65, 81, 1);
}
:root body.blue.dark,
:root body.blue .override-dark {
    /* dark colors */
    --color-background: rgba(17, 24, 39, 1);
    --color-font: rgba(229, 231, 235, 1);
    --color-links: #56a8ff;
    --color-border: rgba(229, 231, 235, 0.1);
    --color-code: rgba(0, 0, 0, 0.3);
    --color-header-background: #fff;
    --color-header-text: rgba(55, 65, 81, 1);
}
  
:root body.red {
    --color-primary: #cb0000;
    --color-primary-light: #cb0000;
}
:root body.red,
:root body.red.dark .override-light {
    /* red colors */
    --color-background: rgba(255, 245, 245, 1);
    --color-font: rgba(55, 65, 81, 1);
    --color-links: rgba(255, 0, 0, 1);
    --color-border: rgb(89, 89, 89, 0.1);
    --color-code: rgba(0, 0, 0, 0.1);
    --color-header-background: #fff;
    --color-header-text: rgba(55, 65, 81, 1);
  }
:root body.red.dark,
:root body.red .override-dark {
    /* dark colors */
    --color-background: #0a0a0a;
    --color-font: rgba(229, 231, 235, 1);
    --color-links: #fff;
    --color-border: rgba(229, 231, 235, 0.1);
    --color-code: rgba(0, 0, 0, 0.3);
    --color-header-background: #212121;
    --color-header-text: #fff;
}

:root body.custom-color,
:root body.custom-color.dark .override-light {
    --color-background: rgba(245, 245, 245, 1);
    --color-font: rgb(66, 66, 66);
    --color-links: rgb(66, 66, 66);
    --color-border: rgb(89, 89, 89, 0.1);
    --color-code: rgba(0, 0, 0, 0.1);
    --color-header-background: #fff;
    --color-header-text: rgb(66, 66, 66);
  }
:root body.custom-color.dark,
:root body.custom-color .override-dark {
    --color-background: #0a0a0a;
    --color-font: rgb(230, 230, 230);
    --color-links: rgb(230, 230, 230);
    --color-border: rgba(235, 235, 235, 0.1);
    --color-code: rgba(0, 0, 0, 0.3);
    --color-header-background: #212121;
    --color-header-text: #fff;
}