@media (prefers-color-scheme: light) {
    :root {
        /* bootstrap overwrites */
        --blue-rgb: 26, 115, 232;
        --blue: rgba(var(--blue-rgb)) !important;
        --blue-2: #135cbc;
        --indigo: #6610f2 !important;
        --purple: #6f42c1 !important;
        --pink: #e83e8c !important;
        --red-rgb: 220, 53, 69;
        --red: rgba(var(--red-rgb)) !important;
        --red-2: #db2d3e !important;
        --orange: #fd7e14 !important;
        --yellow-rgb: 255, 193, 7;
        --yellow: rgba(var(--yellow-rgb)) !important;
        --green-rgb: 76, 175, 80;
        --green: rgba(var(--green-rgb)) !important;
        --green-2: #46a149 !important;
        --teal: #20c997 !important;
        --cyan: #17a2b8 !important;
        --cyan-2: #16a4b8 !important;
        --white: #fff !important;
        --gray-light: #e6e6e6;
        --gray: #6c757d !important;
        --gray-2: #646c75 !important;
        --gray-dark: #343a40 !important;
        --black: #212529;
        --primary: var(--blue) !important;
        --secondary: var(--gray) !important;
        --secondary-text: #5f6368 !important;
        --secondary-hover: #eceff0 !important;
        --success: var(--green) !important;
        --info: var(--cyan) !important;
        --warning: var(--yellow) !important;
        --danger: var(--red) !important;
        --light: #f8f9fa !important;
        --dark: var(--gray-dark) !important;
        --breakpoint-xs: 0 !important;
        --breakpoint-sm: 576px !important;
        --breakpoint-md: 768px !important;
        --breakpoint-lg: 992px !important;
        --breakpoint-xl: 1200px !important;
        --font-family-sans-serif: roboto, robotodraft, helvetica, arial, sans-serif !important;
        --font-family-menu: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        --font-family-monospace: sfmono-regular, menlo, monaco, consolas, "liberation mono", "courier new", monospace !important;
        /* general */
        --font-size-base: .875rem !important;
        --body-bg-login: rgba(255, 255, 255, .75);
        --body-bg: #fff;
        --backdrop-bg: #fff;
        --label-color: #757575;
        --body-color: #757575;
        --border-bottom-color: rgb(222, 226, 230);
        --light-bg: transparent;
        --desktop-icon-bg: rgba(53, 54, 58, 0.07);
        /* nav */
        --nav-bg: #fff;
        --nav-color: #606060;
        --nav-brand-color: #767676;
        --nav-border: #dee2e6;
        --nav-link: #606060;
        --nav-link-icon: rgba(96, 100, 105, 1);
        --nav-link-hover: #2a2a2a;
        --nav-link-bg-hover: var(--gray-light);
        /* inputs */
        --input: #202124;
        --input-bg: #f1f3f4;
        --input-bg-readonly: #e9ecef;
        --input-bg-hover: #f8f9f9;
        --input-bg-focus: #fff;
        --input-hover-shadow: #b9bcbd;
        --input-border: transparent;
        --input-hover-border: transparent;
        --input-focus-border: transparent;
        --input-placeholder: #6f6f70;
        --checkbox-symbol: #fff;
        --checkbox-border: #a7a7a7;
        --required: #ff0000;
        --input-shadow-x: 0;
        --input-shadow-y: 1px;
        --input-shadow-blur: 4px;
        --input-shadow-12: rgba(0, 0, 0, .12);
        --input-shadow-14: rgba(0, 0, 0, .14);
        --input-shadow-20: rgba(0, 0, 0, .20);
        --input-placeholder-font-weight: 300;
        --invalid-bg: rgba(220, 53, 69, .05);
        /* grids */
        --grid-header-bg: #fff;
        --grid-content: #202124;
        --grid-content-bg: #f5f7f7;
        --grid-content-bg-hover: #f9fbfb;
        --grid-hdr-text-bg: #fff;
        --grid-hdr-text: rgba(0, 0, 0, .54);
        --grid-row-border: #dee2e6;
        --grid-row-border-hover: #d6dcde;
        --grid-row-border-hover-2: #bcbebf;
        --grid-row-bg-selected: #c2dbff;
        --grid-row-bg-selected-hover: #cee1ff;
        --grid-pagination-btn: #212529;
        --grid-pagination-btn-bg: var(--grid-header-bg);
        --grid-pagination-btn-bg-active: var(--grid-header-bg);
        --grid-pagination-btn-bg-hover: #f9fafb;
        --grid-pagination-btn-shadow-active: #ccc;
        --grid-pagination-btn-hover: rgba(18, 18, 18, .1);
        --grid-selector-hover-bg: rgba(0, 0, 0, .075);
        --grid-selector-hover: #040404;
        --grid-content-selector: #cfd0d0;
        --grid-content-selector-selected: #5a6576;
        --grid-content-selector-hover: #767676;
        --grid-cell-curr-bg: var(--grid-content-bg-hover);
        /* dropdown */
        --dropdown: var(--body-color);
        --dropdown-bg: #fff;
        --dropdown-current: #000;
        --dropdown-current-bg: #000;
        --dropdown-shadow: rgba(0, 0, 0, .5);
        /* modals */
        --modal-content-bg: #fff;
        --modal-title-color: #000;
        --modal-shadow: rgba(0, 0, 0, .5);
        /* pills */
        --pill-bg: rgba(255, 255, 255, 0);
        --pill-bg-hover: rgba(0, 0, 0, .05);
        --pill-active-bg: rgba(255, 255, 255, 0);
        --pill-hover: #000;
        /* buttons */
        --btn-light-foreground: var(--body-color);
        --btn-light-bg: rgba(248, 249, 250, .5);
        --btn-light-bg-hover: rgba(226, 230, 234, .5);
        --btn-outline-shadow: rgba(108, 117, 125, .5);
        --btn-shadow-12: rgba(0, 0, 0, .12);
        --btn-shadow-14: rgba(0, 0, 0, .14);
        --btn-shadow-20: rgba(0, 0, 0, .20);
        /* alerts */
        --alert-danger-bg: rgba(220, 53, 69, .1);
        --alert-danger: #721c24;
        --alert-warning-bg: rgba(255, 193, 7, .1);
        --alert-warning: #856404;
        --alert-info-bg: rgba(23, 162, 184, .1);
        --alert-info: #0c5460;
        --alert-success-bg: rgba(40, 167, 69, .1);
        --alert-success: #155724;
        --alert-secondary-bg: rgba(108, 117, 125, .1);
        --alert-secondary: #383d41;
        --alert-subtitle-grid-bg: var(--alert-secondary-bg);
        --alert-subtitle-bg: rgba(0, 0, 0, .75);
        /* tags */
        --tag-splitter: peru;
        /* wizard */
        --wz-bg: #fff;
        --wz-fail-bg: rgba(220, 53, 69, .5);
        /* tooltips */
        --tooltip-bg: #fff;
        --tooltip: #5d5d5d;
        --tooltip-border: #bebebe;
        --tooltip-shadow: rgba(0, 0, 0, .5);
        /* typography */
        --media-bg: rgba(0, 0, 0, .7);
        --media-bg-strong: rgba(0, 0, 0, .5);
        --link-disabled: rgba(0, 0, 0, .5);
        --diff-ins: #cfc;
        --diff-del: #999;
        --diff-del-bg: #fec8c8;
        /* badges */
        --badge-bg: #cc0000;
        --badge: #f7d5d5;
        /* sticky */
        --sticky-bg: rgba(108, 117, 125, .50);
        --sticky-bg-light: rgba(255, 255, 255, .80);
        /* Calendar */
        --cal-dark-1: #495057;
        --cal-dark-2: rgba(0, 0, 0, 0.05);
        --cal-light-1: #dee2e6;
        --cal-highlight-1: #1a73e83f;
        --cal-orange-1: rgba(255, 186, 94, 0.05);
        --cal-orange-2: rgba(255, 186, 94, 0.5);
        --cal-red-1: rgba(220, 53, 69, 0.05);
        --cal-red-2: rgba(220, 53, 69, 0.5);
        --cal-blue-1: rgba(49, 180, 223, 0.05);
        --cal-blue-2: rgba(49, 180, 223, 0.5);
        /* Ajax-controls */
        --voffice-btn-hover: rgba(0, 0, 0, .05);
        --voffice-btn-focus: rgba(0, 0, 0, .20);
    }
}

@media (prefers-color-scheme: dark) {
    :root {
        /* bootstrap overwrites */
        --blue-rgb: 0, 122, 204;
        --blue: rgba(var(--blue-rgb)) !important;
        --blue-2: #099cff;
        --indigo: #6610f2 !important;
        --purple: #6f42c1 !important;
        --pink: #e83e8c !important;
        --red-rgb: 193, 48, 17;
        --red: rgba(var(--red-rgb)) !important;
        --red-2: #eb3914 !important;
        --orange: #d7ac6a !important;
        --yellow-rgb: 252, 203, 89;
        --yellow: rgba(var(--yellow-rgb)) !important;
        --green-rgb: 87, 166, 74;
        --green: rgba(var(--green-rgb)) !important;
        --green-2: #7dc072 !important;
        --teal: #20c997 !important;
        --cyan: #4ec9b0 !important;
        --cyan-2: #87dac9 !important;
        --white: #f1f1f1 !important;
        --gray-light: #333333;
        --gray: #dcdcdc !important;
        --gray-2: #646c75 !important;
        --gray-dark: #f1f1f1 !important;
        --black: #212529;
        --primary: var(--blue) !important;
        --secondary: #afafb6 !important;
        --secondary-text: #999999 !important;
        --secondary-hover: #d0d0d0 !important;
        --success: var(--green) !important;
        --info: var(--cyan) !important;
        --warning: var(--yellow) !important;
        --danger: var(--red) !important;
        --light: #1e1e1e !important;
        --dark: var(--gray-dark) !important;
        --breakpoint-xs: 0 !important;
        --breakpoint-sm: 576px !important;
        --breakpoint-md: 768px !important;
        --breakpoint-lg: 992px !important;
        --breakpoint-xl: 1200px !important;
        --font-family-sans-serif: roboto, robotodraft, helvetica, arial, sans-serif !important;
        --font-family-menu: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
        --font-family-monospace: sfmono-regular, menlo, monaco, consolas, "liberation mono", "courier new", monospace !important;
        /* general */
        --font-size-base: .875rem !important;
        --body-bg-login: rgba(35, 35, 35, 0.75);
        --body-bg: #1e1e1e;
        --backdrop-bg: rgb(187, 187, 187);
        --label-color: rgb(187, 187, 187);
        --body-color: #dcdcdc;
        --border-bottom-color: #3f3f46;
        --light-bg: transparent;
        --desktop-icon-bg: rgba(239, 243, 247, 0.07);
        /* nav */
        --nav-bg: #2d2d30;
        --nav-color: #f1f1f1;
        --nav-brand-color: #f1f1f1;
        --nav-border: #3f3f46;
        --nav-link: #fff;
        --nav-link-icon: #c7c7c7;
        --nav-link-hover: #c7c7c7;
        --nav-link-bg-hover: #3e3e40;
        /* inputs */
        --input: var(--body-color);
        --input-bg: #23272b;
        --input-bg-readonly: #2a2a2c;
        --input-bg-hover: #23272b;
        --input-bg-focus: #23272b;
        --input-hover-shadow: #b9bcbd;
        --input-border: #3f3f46;
        --input-hover-border: #3f3f46;
        --input-focus-border: #007acc;
        --input-placeholder: #999999;
        --checkbox-symbol: #fff;
        --checkbox-border: #a7a7a7;
        --required: #ff0000;
        --input-shadow-x: 0;
        --input-shadow-y: 0;
        --input-shadow-blur: 0;
        --input-shadow-12: transparent;
        --input-shadow-14: transparent;
        --input-shadow-20: transparent;
        --input-placeholder-font-weight: normal;
        --invalid-bg: rgba(220, 53, 69, .05);
        /* grids */
        --grid-header-bg: #2a2a2c;
        --grid-content: #f1f1f1;
        --grid-content-bg: #343438;
        --grid-content-bg-hover: #3e3e42;
        --grid-hdr-text-bg: #2a2a2c;
        --grid-hdr-text: #c8c8c8;
        --grid-row-border: #2a2a2c;
        --grid-row-border-hover: #1f1f21;
        --grid-row-border-hover-2: #151517;
        --grid-row-bg-selected: #264f78;
        --grid-row-bg-selected-hover: #356fa8;
        --grid-pagination-btn: #f1f1f1;
        --grid-pagination-btn-bg: transparent;
        --grid-pagination-btn-bg-active: #1c97ea;
        --grid-pagination-btn-bg-hover: #55555b;
        --grid-pagination-btn-shadow-active: #ccc;
        --grid-pagination-btn-hover: rgba(120, 120, 120, .1);
        --grid-selector-hover-bg: rgba(150, 150, 150, .075);
        --grid-selector-hover: #fff;
        --grid-content-selector: #5d5d5d;
        --grid-content-selector-selected: #b3b3b3;
        --grid-content-selector-hover: #b3b3b3;
        --grid-cell-curr-bg: #3f3f46;
        /* dropdown */
        --dropdown: var(--body-color);
        --dropdown-bg: #23272b;
        --dropdown-current: #f1f1f1;
        --dropdown-current-bg: #f1f1f1;
        --dropdown-shadow: rgba(0, 0, 0, .5);
        /* modals */
        --modal-content-bg: #1b1b1c;
        --modal-title-color: #fff;
        --modal-shadow: rgba(0, 0, 0, .5);
        /* pills */
        --pill-bg: #1e1e1e;
        --pill-bg-hover: #2d2d30;
        --pill-active-bg: #2d2d30;
        --pill-hover: #fff;
        /* buttons */
        --btn-light-foreground: var(--body-color);
        --btn-light-bg: rgba(39, 39, 39, .5);
        --btn-light-bg-hover: rgba(120, 120, 120, .5);
        --btn-outline-shadow: rgba(108, 117, 125, .5);
        --btn-shadow-12: transparent;
        --btn-shadow-14: transparent;
        --btn-shadow-20: transparent;
        /* alerts */
        --alert-danger-bg: rgba(220, 53, 69, .1);
        --alert-danger: #e39199;
        --alert-warning-bg: rgba(255, 193, 7, .1);
        --alert-warning: #f9c528;
        --alert-info-bg: rgba(23, 162, 184, .1);
        --alert-info: #1ab5d0;
        --alert-success-bg: rgba(40, 167, 69, .1);
        --alert-success: #2ebe4f;
        --alert-secondary-bg: rgba(108, 117, 125, .1);
        --alert-secondary: #b6bcc0;
        --alert-subtitle-grid-bg: var(--alert-secondary-bg);
        --alert-subtitle-bg: rgba(200, 200, 200, .75);
        /* tags */
        --tag-splitter: peru;
        /* wizard */
        --wz-bg: #fff;
        --wz-fail-bg: rgba(220, 53, 69, .5);
        /* tooltips */
        --tooltip-bg: #f1f1f1;
        --tooltip: #333337;
        --tooltip-border: #000;
        --tooltip-shadow: transparent;
        /* typography */
        --media-bg: #c8c8c8;
        --media-bg-strong: #fff;
        --link-disabled: #4e4e50;
        --diff-ins: #265e4d;
        --diff-del: #c8c8c8;
        --diff-del-bg: #3c0000;
        /* badges */
        --badge-bg: #cc0000;
        --badge: #f7d5d5;
        /* sticky */
        --sticky-bg: rgba(108, 117, 125, .50);
        --sticky-bg-light: rgba(255, 255, 255, .80);
        /* Calendar */
        --cal-dark-1: #c8c8c8;
        --cal-dark-2: rgba(255, 255, 255, 0.05);
        --cal-light-1: #3f3f46;
        --cal-highlight-1: #007acc3f;
        --cal-orange-1: rgba(159, 91, 0, 0.2);
        --cal-orange-2: rgba(255, 186, 94, 0.3);
        --cal-red-1: rgba(220, 53, 69, 0.2);
        --cal-red-2: rgba(220, 53, 69, 0.3);
        --cal-blue-1: rgba(49, 180, 223, 0.2);
        --cal-blue-2: rgba(49, 180, 223, 0.3);
        /* Ajax-controls */
        --voffice-btn-hover: rgba(220, 220, 220, .10);
        --voffice-btn-focus: rgba(220, 220, 220, .20);
    }

    .navigation-menu-desktop .menu-item-desktop icon::before {
        filter: brightness(.25);
    }

    .navigation-menu-desktop .menu-item-desktop icon {
        filter: brightness(.8);
    }

    .navbar-light .navbar-toggler {
        color: var(--gray) !important;
        border-color: var(--gray) !important;
    }

    .navbar-light .navbar-toggler > .navbar-toggler-icon {
        filter: invert(1);
    }
}