@layer base {

    :root {
        --crb-new-bg: rgba(255, 255, 255, 0.95);
        --crb-new-border: rgba(255, 255, 255, 0.2);

        --crb-bg: #f5f6fa;

        --crb-blue-color: rgb(44, 123, 229);
        --crb-blue-light-color: rgb(230, 239, 252);
        --crb-blue-dark-color: rgb(25, 72, 134);

        --crb-green-color: theme('colors.emerald.400');
        --crb-green-light-color: theme('colors.emerald.50');
        --crb-green-dark-color: theme('colors.emerald.900');

        --crb-orange-color: rgb(245, 128, 62);
        --crb-orange-light-color: rgb(254, 240, 232);
        --crb-orange-dark-color: rgb(171, 89, 43);

        --crb-red-color: rgb(230, 55, 87);
        --crb-red-light-color: rgb(252, 231, 235);
        --crb-red-dark-color: rgb(171, 42, 65);

        --crb-purple-color: #727cf5;
        --crb-purple-light-color: rgb(221, 223, 247);
        --crb-purple-dark-color: #4d54a3;

        --crb-thistle-color: #D8BFD8;
        --crb-thistle-light-color: rgb(255, 255, 255);
        --crb-thistle-dark-color: #D8BFD8;

        --crb-turquoise-color: rgb(39, 188, 253);
        --crb-turquoise-light-color: rgb(229, 247, 255);
        --crb-turquoise-dark-color: rgb(29, 144, 195);

        --crb-yellow-color: #f1c40f;
        --crb-yellow-light-color: #fcf6e0;
        --crb-yellow-dark-color: #c6a20d;

        --crb-black-color: #1e2124;
        --crb-dark-color: #292929;
        --crb-grey-color: #aaaaaa;
        --crb-grey-light-color: #e7e7e7;
        --crb-grey-superlight-color: #f8f8f8;
        --crb-white-color: white;

        --crb-shadow-left-color: rgba(65, 69, 88, 0.1);
        --crb-shadow-bottom-color: rgba(0, 0, 0, 0.07);

        --crb-left-menu-background: #1e2124;
        --crb-left-menu-background-hover: rgba(79, 84, 92, .6);
        --crb-left-menu-font: #e7e7e7;
        --crb-left-menu-font-hover: white;
        --crb-top-menu-font: #1e2124;

        /*SYNTHESIS*/
        --old-ok: #5CB85C;
        --ok: var(--crb-green-color);
        --old-ko: #D9534F;
        --ko: var(--crb-red-color);
        --old-fa: #F0AD4E;
        --fa: var(--crb-orange-color);
        --old-pe: #3498DB;
        --pe: var(--crb-blue-color);
        --old-na: #F1C40F;
        --na: var(--crb-yellow-color);
        --old-ne: #aaa;
        --ne: var(--crb-grey-color);
        --old-qu: #BF00BF;
        --qu: var(--old-qu);
        --old-qe: #5C025C;
        --qe: var(--old-qe);
        --old-we: #34495E;
        --we: var(--crb-dark-color);
        --old-ca: #F0AD4E;
        --ca: var(--crb-yellow-dark-color);
        --qu: var(--crb-thistle-color);

    }

    :root.dark {

        --ok: theme('colors.emerald.400');

        --crb-new-bg: rgba(30, 41, 59, 0.95);
        /*rgba(19, 30, 48, 0.95);*/
        --crb-new-border: rgba(71, 85, 105, 0.3);

        --crb-bg: #1e222a;

        --crb-blue-color: rgb(44, 123, 229);
        --crb-blue-light-color: rgb(38, 60, 94);
        --crb-blue-dark-color: rgb(153, 190, 241);

        --crb-green-color: rgb(0, 210, 122);
        --crb-green-light-color: rgb(22, 60, 48);
        --crb-green-dark-color: rgb(145, 235, 196);

        --crb-orange-color: rgb(245, 128, 62);
        --crb-orange-light-color: rgb(66, 41, 28);
        --crb-orange-dark-color: rgb(247, 189, 157);

        --crb-red-color: rgb(230, 55, 87);
        --crb-red-light-color: rgb(70, 34, 42);
        --crb-red-dark-color: rgb(245, 165, 178);

        --crb-purple-color: #727cf5;
        --crb-purple-light-color: #2d305a;
        --crb-purple-dark-color: #a3a7f9;

        --crb-thistle-color: #D8BFD8;
        --crb-thistle-light-color: rgb(80, 70, 80);
        --crb-thistle-dark-color: #EBD9EB;

        --crb-turquoise-color: rgb(39, 188, 253);
        --crb-turquoise-light-color: rgb(27, 54, 65);
        --crb-turquoise-dark-color: rgb(171, 228, 255);

        --crb-yellow-color: #f1c40f;
        --crb-yellow-light-color: rgb(72, 65, 33);
        --crb-yellow-dark-color: #f8e68c;

        --crb-black-color: #f5f5f5;
        --crb-dark-color: #dddddd;
        --crb-grey-color: #bbbbbb;
        --crb-grey-light-color: #3a3a3a;
        --crb-grey-superlight-color: #252525;
        --crb-white-color: #111111;

        --crb-left-menu-background: #1e2124;
        --crb-left-menu-background-hover: rgba(79, 84, 92, .6);
        --crb-left-menu-font: #e7e7e7;
        --crb-left-menu-font-hover: white;
        --crb-top-menu-font: #f5f5f5;

        --crb-shadow-left-color: rgba(255, 255, 255, 0.06);
        --crb-shadow-bottom-color: rgba(255, 255, 255, 0.17);
    }
}