html {
    --secondary-color-dark-3: #242424;
    --secondary-color-dark-2: #424242;
    --secondary-color-dark-1: #616161;
    --secondary-color: #707070;
    --secondary-color-light-1: #bdbdbd;
    --secondary-color-light-2: #ebebeb;
    --secondary-color-light-3: #f5f5f5;
    --surface-color__rgb: 255,255,255;

    --background-color: #f5f5f5;
    --surface-color: #ffffff;
}

html.default-theme {
    --primary-color-dark-3: #083C6A;
    --primary-color-dark-2: #0B528F;
    --primary-color-dark-1: #0E61AA;
    --primary-color: #0F6CBD;
    --primary-color-light-1: #AACDEB;
    --primary-color-light-2: #D0E4F4;
    --primary-color-light-3: #F3F8FC;
}

html.red-theme {
    --primary-color-dark-3: #3f1011;
    --primary-color-dark-2: #751d1f;
    --primary-color-dark-1: #aa2a2d;
    --primary-color: #bc2f32;
    --primary-color-light-1: #e37d80;
    --primary-color-light-2: #f1bbbc;
    --primary-color-light-3: #fdf6f6;
}

html.dark-theme {
    --ms-fluent__primary: #479ef5;
    --ms-fluent__primary-hover: #62abf5;

    --primary-color-dark-3: #0A0A0A;
    --primary-color-dark-2: #141414;
    --primary-color-dark-1: #2e2e2e;
    --primary-color: #0A0A0A;
    --primary-color-light-1: #4b4b4b;
    --primary-color-light-2: #676767;
    --primary-color-light-3: #292929;
    --secondary-color-dark-3: #ffffff;
    --secondary-color-dark-2: #d6d6d6;
    --secondary-color-dark-1: #adadad;
    --secondary-color: #999999;
    --secondary-color-light-1: #5c5c5c;
    --secondary-color-light-2: #383838;
    --secondary-color-light-3: #141414;
    --navbar__focus: #0A0A0A;
    --navbar__search__background-color: #292929;
    --surface-color__rgb: 41,41,41;
    --admin-navigation-background: #0A0A0A;
    --admin-navigation-submenu-background: #141414;
    --admin-detail-section-title: #999999;
    --shimmer-color: #4b4b4b;
    --shimmer-secondary-color: #383838;
    --form-element-border: #4b4b4b;
    --suggestionbox-selection: #4b4b4b;
    --suggestionbox-arrow: #adadad;
    --primary-button-color: var(--ms-fluent__primary);
    --primary-button-color__hover: var(--ms-fluent__primary-hover);
    --separator-color: #4b4b4b;
    --border-color: #4b4b4b;
    --element-hover: #4b4b4b;
    --element-selected: #676767;
    --small-icon-button-color: #adadad;
    --table-header-text-color: #adadad;
    --minor-element-color: #adadad;
    --tree-line-color: #676767;
    --disabled-gray-color: #999999;
    --color-scheme: dark;
    --text-color: #eaeaea;
    --link-color: var(--ms-fluent__primary);
    --link-color__hover: var(--ms-fluent__primary-hover);
    --layout-border-color: #383838;
    --form-element-border__focused: #858585;
    --primary-color__reversed-for-dark: #fefefe;
    --primary-color__blue-for-dark: var(--ms-fluent__primary);
    --shadow-color: #0000004d;
    --cell-red: rgb(216 99 68 / 50%);
    --navigation-bar-color: #0A0A0A;
    --ms-shadow: 0 0 2px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.14);

    --background-color: #141414;
    --surface-color: #292929;
}