:root {
    --page-body-bg: #fff;
    --page-main-bg: inherit;

    --page-header-bg-transparent: rgba(250, 250, 250, 0.95);

    --page-text-primary: #333;
    --page-text-secondary: #555;
    --page-text-header: #333;
    --page-text-title: #333;
    --page-text-title-secondary: #aaaaaa;

    --page-control-border: #aaaaaa;
    --page-control-border-hover: #7eb980;
    --page-control-border-focus: #4caf50;
    --page-field-error: #ff8983;
    --page-option-border: #EBEBEB;
    --page-option-label-bg: #EBEBEB;
    --page-option-select-bg: #fff;

    --page-button-bg: #f2f2f2;
    --page-button-disabled-bg: #e5e7eb;
    --page-button-hover-filter: brightness(0.95);
    --page-button-save-active-bg: #91c995;
    --page-button-save-hover-filter: brightness(0.95);
    --page-button-enable: #333;
    --page-button-disabled: #aaaaaa;
}

.dark {
    --page-body-bg: #282828;
    --page-main-bg: inherit;

    --page-header-bg-transparent: rgba(23, 23, 23, 0.9);

    --page-text-primary: #fff;
    --page-text-secondary: #cfd8e3;
    --page-text-header: #fff;
    --page-text-title: #fff;
    --page-text-title-secondary: #aaaaaa;

    --page-control-border: #aaaaaa;
    --page-control-border-hover: #7eb980;
    --page-control-border-focus: #4caf50;
    --page-option-border: #3e3e3e;
    --page-option-label-bg: #1f1f1f;
    --page-option-select-bg: #3e3e3e;

    --page-button-bg: #3e3e3e;
    --page-button-disabled-bg: #353535;
    --page-button-hover-filter: brightness(1.5);
    --page-button-save-active-bg: #15803d;
    --page-button-save-hover-filter: brightness(1.2);
    --page-button-enable: #fff;
    --page-button-disabled: #aaaaaa;

    --page-scrollbar-track-bg: #3e3e3e;
    --page-scrollbar-thumb-bg: #606060;
    --page-scrollbar-thumb-hover-bg: #707070;
}