:root {
    --black : rgb(0, 0, 0);
    --white : #c0c0c0;
    --red : #8d342e;
    --blue: #366686;
    --lightblue: rgb(0, 141, 253);
    --green: #507239;
    --purple: rgb(97, 11, 131);
    --yellow: #d5ad20;
    --orange: #a25b27;
    --gray: rgb(87, 87, 87);

    --itemblack : rgb(36, 32, 32);
    --itemwhite : #8D8D8D;
    --itemred : #53231F;
    --itemitemblue: #2D4452;
    --itemlightblue: rgb(0, 141, 253);
    --itemgreen: #334127;
    --itempurple: rgb(91, 0, 126);
    --itemyellow: #8C7734;
    --itemorange: #7D4C28;
    --itemgray: rgb(32, 32, 32);


    --alert-opacity: rgba(0, 0, 0, 0.9);
    --bg-text: #949494;
    --hover: #2d2d2d;
    --lightgray: rgb(104, 104, 104);

}

body[data-theme='light-mode'] {
/*    --page-logo: url(/image/pageLogo_light.png);*/
    --page-logo: url(/image/pageLogo_dark.png);
    --logo: url(/image/logo_dark.png);

    --main-color: rgb(255, 255, 255);
    --main-color-a: rgba(255, 255, 255, 0.75);
    --main-hover-color: rgb(175, 175, 175);
    
    --sub-color: rgb(56, 56, 56);
    --sub-color-a: rgba(208, 208, 208, 0.2);
    --textarea-color : rgba(51, 51, 51, 0.973);

    --table-tr-color: #FFF;
    --table-tr-odd-color: rgb(225 225 225);
    --table-th-color: #2d2d2d;
    --table-th-text-color: #ffffff;
    --table-th-sub-text-color: #737373;
    --table-main-text-color: #000000;
    --table-sub-text-color: #333333;
    --table-hover : rgb(159 159 159);
    --table-border : #EDEEF1;
    --input-color: #141414;
    --input-placeholder: #a5a5a5;
    --input-background: #e7e7e7;

    --li-hover: rgb(255 255 255);

    --info : #004cff;
    --info-2: #35c408;

    --btn-hover: #fd9f2891;
    --btn-bg : #FD9F28;
    --border: #ffffff;
    --border-a: rgba(255, 255, 255, 0.3);

    --border-bottom : #EDEEF1;
    --basic-font : #eee;

    --shadow: rgba(56, 56, 56);
    --board-under-color: rgb(37 37 37 / 90%);

    --input-text-color: rgba(220, 220, 220, 0.5);
    --background-2: rgb(79 79 79 / 74%);
}
body[data-theme='dark-mode'] {
    --page-logo: url(/image/pageLogo_dark.png);
    --logo: url(/image/logo_dark.png);

    --main-color: rgb(30, 30, 30);
    --main-color-a: rgba(30, 30, 30, 0.75);
    --main-hover-color: rgb(81, 81, 81);
    

    --sub-color: rgb(208, 208, 208);
    --sub-color-a: rgba(56, 56, 56, 0.4);
    --textarea-color : rgba(51, 51, 51, 0.973);

    --table-tr-color: rgb(20 20 20);
    --table-tr-odd-color: rgb(28 28 28);
    --table-th-color: #2d2d2d;
    --table-th-text-color: #dcdcdc;
    --table-th-sub-text-color: #737373;
    --table-main-text-color: #dcdcdc;
    --table-sub-text-color: #929292;
    --table-hover : #2d2d2d;
    --table-border : #353736;
    --li-hover: #2d2d2d;
    --input-color: #e3e3e3;
    --input-placeholder: #7f7f7f;
    --input-background: #292929;

    --info : #FD9F28;
    --info-2: #35c408;

    --btn-hover: #fd9f2891;
    --btn-bg : rgba(30, 30, 30, 0.75);
    --border : #612809;
    --border-a : rgba(97, 40, 9, 0.4);

    --border-bottom : rgba(238, 238, 238, 0.2);
    --basic-font : #eee;

    --shadow: rgba(0, 0, 0);
    --board-under-color: rgb(37 37 37 / 90%);

    --input-text-color: rgba(0, 0, 0, 0.2);
    --background-2: rgb(43 43 43 / 88%);
}