.ClientPage {

    --color-page-bg: white;
    --color-page-bg-soft: #f6f7f8;
    --color-page-bg-contrast: #cccccc;
    --color-page-text: black;
    --color-page-text-soft: #b3b3b3;
    --color-page-text-barely: #e2e2e2;
    --color-page-link:#007bac;
    --color-page-link-hover: #22b872;
    --color-page-hover-bg: #d1e4de;
    --color-page-hover-bg-faint: #f4f8f7;
    --color-page-hairline: #e2e2e2;
    --color-page-shadow: #00000033;
    --color-page-shadow-soft: #00000022;
    --color-page-scrollbar-fg: #969696;
    --color-page-scrollbar-bg: white;
    --color-page-scrollbar-hover-fg: #cccccc;

    --color-contrast-block-bg:#2b477c;
    --color-contrast-block-text: white;
    --color-contrast-block-hover-bg: #3579b8;
    --color-contrast-block-disabled-bg: #949494;
    --color-contrast-block-zing: #dd5757;

    --color-control-title: #666666;
    --color-control-bg: white;
    --color-control-text: black;
    --color-control-rim: #e2e2e2;
    --color-control-focus-rim: blue;

    --color-sentiment-positive-solid-bg: #00a000;
    --color-sentiment-positive-solid-text: white;
    --color-sentiment-positive-soft-bg: #83cc83;
    --color-sentiment-positive-soft-text: #cef0ce;

    --color-sentiment-warning-solid-bg: #ff6600;
    --color-sentiment-warning-solid-text: white;
    --color-sentiment-warning-soft-bg: #e7b28e;
    --color-sentiment-warning-soft-text: #fffce6;

    --color-sentiment-negative-solid-bg: #b42a2a;
    --color-sentiment-negative-solid-text: white;
    --color-sentiment-negative-soft-bg: #d89797;
    --color-sentiment-negative-soft-text: #f8f1f1;

    /*--------------------------------------------------------------------------------*/
    @media (prefers-color-scheme: dark) {

        --color-page-bg: black;
        --color-page-bg-soft: #181c27;
        --color-page-bg-contrast: #333333;
        --color-page-text: white;
        --color-page-text-soft: #97a2ad;
        --color-page-text-barely: #333333;
        --color-page-link: #ffffcc;
        --color-page-link-hover: #ffcc99;
        --color-page-hover-bg: #222222;
        --color-page-hover-bg-faint: #111111;
        --color-page-hairline: #424242;
        --color-page-shadow: #ffffff33;
        --color-page-shadow-soft: #ffffff22;
        --color-page-scrollbar-fg: #465e91;
        --color-page-scrollbar-bg: #000510;
        --color-page-scrollbar-hover-fg: #cccccc;

        --color-contrast-block-bg:#dfe4c0;
        --color-contrast-block-text: black;
        --color-contrast-block-hover-bg: #d6be75;
        --color-contrast-block-disabled-bg: #333333;
        --color-contrast-block-zing: #ff9595;

        --color-control-title: #a9b5bd;
        --color-control-bg: #000719;
        --color-control-text: white;
        --color-control-rim: #333333;
        --color-control-focus-rim: #773d1c;

        --color-sentiment-positive-solid-bg: #00a000;
        --color-sentiment-positive-solid-text: white;
        --color-sentiment-positive-soft-bg:#062206;
        --color-sentiment-positive-soft-text: #75cc75;

        --color-sentiment-warning-solid-bg: #f57723;
        --color-sentiment-warning-solid-text: white;
        --color-sentiment-warning-soft-bg: #3d1e00;
        --color-sentiment-warning-soft-text: #df7f40;

        --color-sentiment-negative-solid-bg: #bb1717;
        --color-sentiment-negative-solid-text: white;
        --color-sentiment-negative-soft-bg: #612828;
        --color-sentiment-negative-soft-text: #f0dee0;

    }
}