body {
    --app-background: #000;
    --main-background: #fff;
    --content-text-color: #000;
    --current-date-time-text-color: #fff;

    --primary-color: #2675f5;
    --primary-hover: #2563eb;
    --primary-text-color: #fff;

    --danger-color: #dc3545;
    --danger-hover: #c82333;
    --danger-text-color: #fff;

    --secondary-color: rgba(255, 255, 255, 0.1);
    --secondary-hover: rgba(255, 255, 255, 0.2);
    --secondary-text-color: #1e1e1e;

    --button-border-color: rgba(255, 255, 255, 0.3);
    --button-box-shadow: rgba(0, 0, 0, 0.2);

    --modal-background-color: rgba(255, 255, 255, 0.5);
    --modal-text-color: #000;
    --modal-border-color: #ccc;
    --modal-shadow-color: rgba(0, 0, 0, 0.5);
    --modal-low-priority-text-color: rgba(0, 0, 0, 0.8);
    --modal-header-background-color: var(--content-box-background-color);
    --modal-header-text-color: var(--content-box-text-color);

    --content-box-background-color: #ececec;
    --content-box-text-color: #000;

    --navbar-button-background-default: #fff;
    --navbar-button-background-default-hover: #ccc;
    --navbar-button-background-image-active: linear-gradient(#fff, rgba(255, 255, 255, 0));

    --menue-button-background-active: #fff;
    --menue-button-hover-background-color: #fff;
    --menue-button-background-image: linear-gradient(to left, rgba(255, 255, 255, 0), #fff);
    --menue-button-text-color: #000;
    --menue-button-text-color-active: #000;

    --sidebar-margin-bottom-between-widgets: 12px;
    --sidebar-width: 167px;

    --hour-slot-border-bottom-color: #ddd;
    --calendar-stronger-border-color: #ccc;

    --background-color-current-day-header: rgba(241, 241, 241, 1);
    --background-color-current-day: rgba(241, 241, 241, 1);
    --background-color-holiday-header: #900;
    --text-color-holiday-header: #fff;
    --text-color-current-day-header: #^000;

    --placeholder-background-color: rgba(0, 123, 255, 0.3);
    --placeholder-border-color: 1px dashed #007bff;

    --sidebar-calendarwidget-background-color: rgba(0, 0, 0, 0.15);
    --background-is-current-week: #fff;
}

.dark {
    --app-background: #000;
    --main-background: #292929;
    --content-text-color: #c5c5c5;
    --current-date-time-text-color: #292929;

    --primary-color: #2b62bc;
    --primary-hover: #316bc7;
    --primary-text-color: #fff;

    --danger-color: #c82333;
    --danger-hover: #dc3545;
    --danger-text-color: #fff;

    --secondary-color: rgba(255, 255, 255, 0.2);
    --secondary-hover: rgba(255, 255, 255, 0.3);
    --secondary-text-color: #c5c5c5;

    --button-border-color: rgba(255, 255, 255, 0.3);
    --button-box-shadow: rgba(255, 255, 255, 0.2);
    --modal-background-color: rgba(31, 41, 55, 0.7);
    --modal-text-color: #c5c5c5;
    --modal-border-color: #4b5563;
    --modal-shadow-color: rgba(255, 255, 255, 0.4);
    --modal-low-priority-text-color: rgba(255, 255, 255, 0.8);
    --modal-header-background-color: var(--content-box-background-color);
    --modal-header-text-color: var(--content-box-text-color);

    --content-box-background-color: #374151;
    --content-box-text-color: #c5c5c5;

    --navbar-button-background-default: #292929;
    --navbar-button-background-default-hover: #434343;
    --navbar-button-background-image-active: linear-gradient(#373737, rgba(255, 255, 255, 0));

    --menue-button-background-active: #292929;
    --menue-button-hover-background-color: #292929;
    --menue-button-background-image: linear-gradient(to left, rgba(255, 255, 255, 0), #373737);
    --menue-button-text-color: #c5c5c5;
    --menue-button-text-color-active: #fff;

    --hour-slot-border-bottom-color: #555555;
    --calendar-stronger-border-color: #6c6c6c;

    --background-color-current-day-header: rgba(53, 53, 53, 1);
    --background-color-current-day: rgba(53, 53, 53, 1);
    --background-color-holiday-header: #ad0000;

    --text-color-holiday-header: #c5c5c5;
    --text-color-current-day-header: #c5c5c5;

    --placeholder-background-color: rgba(255, 255, 255, 0.7);
    --placeholder-border-color: 1px dashed #00b7ff;

    --sidebar-calendarwidget-background-color: rgba(255, 255, 255, 0.15);
    --background-is-current-week: #cbcbcb;
}

body,
.color-template-1 {
    --background-color: #a0b2a6;
    --text-color: #000;
}

.color-template-2 {
    --background-color: #a4bdfc;
    --text-color: #000;
}

.color-template-3 {
    --background-color: #44cfd4;
    --text-color: #000;
}

.color-template-4 {
    --background-color: #76e0b9;
    --text-color: #000;
}

.color-template-5 {
    --background-color: #71bb6c;
    --text-color: #000;
}

.color-template-6 {
    --background-color: #e6ce7c;
    --text-color: #000;
}

.color-template-7 {
    --background-color: #f7b274;
    --text-color: #000;
}

.color-template-8 {
    --background-color: #ff887c;
    --text-color: #000;
}

.color-template-9 {
    --background-color: #d4a8f7;
    --text-color: #000;
}



.dark .color-template-1,
.dark.color-template-1 {
    --background-color: #5e6b62;
    --text-color: #fff;
}

.dark .color-template-2,
.dark.color-template-2 {
    --background-color: #4a74d4;
    --text-color: #fff;
}

.dark .color-template-3,
.dark.color-template-3 {
    --background-color: #229ca0;
    --text-color: #fff;
}

.dark .color-template-4,
.dark.color-template-4 {
    --background-color: #3eaa89;
    --text-color: #fff;
}

.dark .color-template-5,
.dark.color-template-5 {
    --background-color: #417b3c;
    --text-color: #fff;
}

.dark .color-template-6,
.dark.color-template-6 {
    --background-color: #c6a93e;
    --text-color: #fff;
}

.dark .color-template-7,
.dark.color-template-7 {
    --background-color: #cc8040;
    --text-color: #fff;
}

.dark .color-template-8,
.dark.color-template-8 {
    --background-color: #cc5c52;
    --text-color: #fff;
}

.dark .color-template-9,
.dark.color-template-9 {
    --background-color: #9461c8;
    --text-color: #fff;
}