html,
body {
    color: var(--main-text-color);
    font-family: "Open Sans", sans-serif;
}

:root {
    --brand-color: #c63b25;
    --brand-color-rgb: 198, 59, 37;
    --brand-color-gradient: #FF5C47;
    --brand-color-gradient-rgb: 255, 92, 71;
    --brand-color-background: #f7e6e1;
    --brand-color-background-rgb: 247,230,225;
    --nolecom-brand-color: #E72566;
    --nolecom-brand-color-rgb: 231,37,102;
    --primary: #007DFFFF;
    --primary-rgb: 0, 125, 255;
    --primary-gradient: #2AFAE6FF;
    --primary-gradient-rgb: 42, 250, 230, 1;
    --secondary: #B6B2AE;
    --secondary-rgb: 182, 178, 174;
    --success: #28a745;
    --success-rgb: 40, 167, 69;
    --success-gradient: #22C399FF;
    --success-gradient-rgb: 34, 195, 153, 1;
    --info: #17B3B8FF;
    --info-rgb: 23, 179, 184;
    --info-gradient: #14C8B4FF;
    --info-gradient-rgb: 20, 200, 180, 1;
    --question: #87ADBD;
    --question-rgb: 135, 173, 189;
    --warning: #ffc107;
    --warning-rgb: 255, 193, 7;
    --warning-gradient: #FAA02AFF;
    --warning-gradient-rgb: 250, 160, 42, 1;
    --warning-bg: #ffc1074c;
    --warning-bg-rgb: rgba(255, 193, 7, 0.3);
    --orange:#ff8000;
    --orange-rgb: 255,128,0;
    --orange-bg: #ff8000b2;
    --orange-bg-rgb: rgba(255, 128, 0, 0.7);
    --red: #ff0000;
    --red-rgb: 255,0,0;
    --red-bg: #ff00007f;
    --red-bg-rgb: rgba(255,0,0,0.5);
    --danger: #933390;
    --danger-rgb: 147, 51, 144;
    --danger-gradient: #FA2A82FF;
    --danger-gradient-rgb: 250, 42, 130, 1;
    --light: #f8f9fa;
    --light-rgb: 248, 249, 250;
    --dark: #343a40;
    --dark-rgb: 52, 58, 64;
    --emergency-color: #ff0000;
    --emergency-color-rgb: 255,0,0;
    --test-mode-color: var(--warning);
    --test-mode-color-rgb: var(--warning-rgb);
    --maintenance-mode-color: var(--orange);
    --maintenance-mode-color-rgb: var(--orange-rgb);
    --available: #28A745C6;
    --available-rgb: 40, 167, 69;
    --full: #FF0000FF;
    --full-rgb: 255, 0, 0;
    --to-be-accepted: #3AE3BB;
    --to-be-accepted-rgb: 58, 227, 187;
    --rejected: #DC3535C1;
    --rejected-rgb: 220, 53, 53;
    --booked: #007BFFFF;
    --booked-rgb: 0, 123, 255;
    --entered: #FFC107FF;
    --entered-rgb: 255, 193, 7;
    --exit: #DED7D750;
    --exit-rgb: 222, 215, 215;
    --hover: #28A745FF;
    --hover-rgb: 40, 167, 69;
    --multi-selection: #007BFF;
    --multi-selection-rgb: 0, 123, 255;
    --success-totem: #8cc63f;
    --success-totem-rgb: 140,198,63;
    --danger-totem: #dc3545;
    --danger-totem-rgb: 220, 53, 69;
    --parking-chosen: #0000FF;
    --parking-chosen-rgb: 0,0,255;
    --incoming-office: #008000;
    --incoming-office-rgb: 0, 128, 0;
    --parking-free: #28a745;
    --parking-free-rgb: 40, 167, 69;
    --parking-scheduled-long-time-occupied: #e5e7f3;
    --parking-scheduled-long-time-occupied-rgb: 229, 231, 243;
    --parking-scheduled-soon-occupied: #ffc107;
    --parking-scheduled-soon-occupied-rgb: 255, 193, 7;
    --parking-scheduled-occupied: #ff8000;
    --parking-scheduled-occupied-rgb: 255, 128, 0;
    --parking-occupied: #dc3545;
    --parking-occupied-rgb: 220, 53, 69;
    --parking-not-filled: #000000;
    --parking-not-filled-rgb: 0, 0, 0;
    --forklift-driver-busy-status: #ffcc80;
    --forklift-driver-busy-status-rgb: 255, 204, 128;
    --unassigned-missions: #c8c4e0;
    --unassigned-missions-rgb: 200, 196, 224;

    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;

    --brandbar-background: rgba(184, 181, 177, 0.342);

    --navbar-background: #fcf8f4;
    --navbar-shadow: #00000021;
    --navbar-background-active-item: rgb(223, 215, 215);
    --navbar-background-hover-item: rgb(182, 182, 182);
    --navbar-icon-color: rgb(27, 27, 27);
    --navbar-link-color: rgb(27, 27, 27);

    --content-background: #fcf8f4;
    --content-shadow: #00000021;
    --content-border-color: rgb(212, 212, 212);
    --content-scrollbar-thumb: rgba(180, 180, 180, 0.267);
    --content-scrollbar-track: #eeeae4;

    --logout-background: #000;
    --logout-background-shadow: rgba(0, 0, 0, 0.322);
    --logout-text: #fff;

    --card-background: #fff;
    --card-shadow: #0000000c;

    --table-background: rgb(236, 231, 231);
    --table-pagination-bg-color: var(--content-background);

    --brandbar-menu-bg: #dfdbd7;

    --border-background: #00000018;
    --input-background: transparent;
    --input-searchbox-background: #00000018;
    --search-icon: url("../images/icons/search_black_24dp.svg") no-repeat scroll 0.6rem 0.6rem;

    --button-primary: var(--brand-color);
    --button-secondary: var(--secondary);
    --button-danger: var(--danger);
    --button-warning: var(--warning);
    --button-info: var(--info);
    --button-success: var(--success);
    --button-dark: var(--dark);

    --main-text-color: rgb(0, 0, 0);
    --main-text-color-rgb: 0, 0, 0;

    --calendar-bookingevents-background: white;

}
:root body.darkmode {
    --calendar-bookingevents-background: #363331;
    --brandbar-background: rgb(31, 30, 29);

    --navbar-background: #141313;
    --navbar-shadow: #000000;
    --navbar-background-active-item: rgb(49, 47, 47);
    --navbar-background-hover-item: rgb(58, 58, 58);
    --navbar-icon-color: rgb(233, 232, 232);
    --navbar-link-color: rgb(235, 233, 233);

    --content-background: #141313;
    --content-shadow: #000000;
    --content-border-color: rgb(65, 65, 65);
    --content-scrollbar-thumb: rgba(95, 95, 95, 0.267);
    --content-scrollbar-track: #1b1b1a;

    --logout-background: rgb(255, 255, 255);
    --logout-background-shadow: rgba(0, 0, 0, 0.651);
    --logout-text: rgb(0, 0, 0);

    --card-background: rgb(32, 32, 32);
    --card-shadow: #00000036;

    --table-background: rgb(41, 40, 40);
    --table-pagination-bg-color: rgb(32, 32, 32);

    --brandbar-menu-bg: #1f1e1d;

    --border-background: #464646;
    --input-background: #303030;
    --input-searchbox-background: #303030;
    --search-icon: url("../images/icons/search_white_24dp.svg") no-repeat scroll 0.6rem 0.6rem;

    --main-text-color: rgb(255, 255, 255);
    --main-text-color-rgb: 255, 255, 255;
}