:root {
    --cc-bg: #313131;
    --cc-primary-color: #fff;
    --cc-secondary-color: #DBDBDB;
    --cc-btn-primary-bg: #1D1D1D;
    --cc-btn-primary-color: #DBDBDB;
    --cc-btn-primary-border-color: var(--cc-btn-primary-bg);
    --cc-btn-primary-hover-bg: #292929;
    --cc-btn-primary-hover-color: var(--cc-btn-primary-color);
    --cc-btn-primary-hover-border-color: var(--cc-btn-primary-hover-bg);
    --cc-btn-secondary-bg: #292929;
    --cc-btn-secondary-color: #DBDBDB;
    --cc-btn-secondary-border-color: var(--cc-btn-secondary-bg);
    --cc-btn-secondary-hover-bg: #353535;
    --cc-btn-secondary-hover-color: var(--cc-btn-secondary-color);
    --cc-btn-secondary-hover-border-color: var(--cc-btn-secondary-hover-bg);
    --cc-separator-border-color: transparent;
    --cc-toggle-on-bg: #7B8080;
    --cc-toggle-on-knob-bg: #3d3d3d;
    --cc-toggle-off-bg: #494949;
    --cc-toggle-off-knob-bg: #313131;
    --cc-toggle-enabled-icon-color: var(--cc-bg);
    --cc-toggle-disabled-icon-color: var(--cc-bg);
    --cc-toggle-readonly-bg: #4A4C4C;
    --cc-toggle-readonly-knob-bg: #313131;
    --cc-toggle-readonly-knob-icon-color: var(--cc-toggle-readonly-bg);
    --cc-section-category-border: var(--cc-cookie-category-block-bg);
    --cc-cookie-category-block-bg: #292929;
    --cc-cookie-category-block-border: #292929;
    --cc-cookie-category-block-hover-bg: #292929;
    --cc-cookie-category-block-hover-border: #292929;
    --cc-cookie-category-expanded-block-bg: #292929;
    --cc-cookie-category-expanded-block-hover-bg: #292929;
    --cc-overlay-bg: rgba(0, 0, 0, 0.65);
    --cc-webkit-scrollbar-bg: var(--cc-section-category-border);
    --cc-webkit-scrollbar-hover-bg: var(--cc-btn-primary-hover-bg);
    --cc-footer-bg: var(--cc-btn-secondary-bg);
    --cc-footer-color: var(--cc-secondary-color);
    --cc-footer-border-color: transparent;
}

.cc--darkmode {
    --cc-bg: #313131;
    --cc-primary-color: #fff;
    --cc-secondary-color: #DBDBDB;
    --cc-btn-primary-bg: #1D1D1D;
    --cc-btn-primary-color: #DBDBDB;
    --cc-btn-primary-border-color: var(--cc-btn-primary-bg);
    --cc-btn-primary-hover-bg: #292929;
    --cc-btn-primary-hover-color: var(--cc-btn-primary-color);
    --cc-btn-primary-hover-border-color: var(--cc-btn-primary-hover-bg);
    --cc-btn-secondary-bg: #292929;
    --cc-btn-secondary-color: #DBDBDB;
    --cc-btn-secondary-border-color: var(--cc-btn-secondary-bg);
    --cc-btn-secondary-hover-bg: #353535;
    --cc-btn-secondary-hover-color: var(--cc-btn-secondary-color);
    --cc-btn-secondary-hover-border-color: var(--cc-btn-secondary-hover-bg);
    --cc-separator-border-color: transparent;
    --cc-toggle-on-bg: #7B8080;
    --cc-toggle-on-knob-bg: #3d3d3d;
    --cc-toggle-off-bg: #494949;
    --cc-toggle-off-knob-bg: #313131;
    --cc-toggle-enabled-icon-color: var(--cc-bg);
    --cc-toggle-disabled-icon-color: var(--cc-bg);
    --cc-toggle-readonly-bg: #4A4C4C;
    --cc-toggle-readonly-knob-bg: #313131;
    --cc-toggle-readonly-knob-icon-color: var(--cc-toggle-readonly-bg);
    --cc-section-category-border: var(--cc-cookie-category-block-bg);
    --cc-cookie-category-block-bg: #292929;
    --cc-cookie-category-block-border: #292929;
    --cc-cookie-category-block-hover-bg: #292929;
    --cc-cookie-category-block-hover-border: #292929;
    --cc-cookie-category-expanded-block-bg: #292929;
    --cc-cookie-category-expanded-block-hover-bg: #292929;
    --cc-overlay-bg: rgba(0, 0, 0, 0.65);
    --cc-webkit-scrollbar-bg: var(--cc-section-category-border);
    --cc-webkit-scrollbar-hover-bg: var(--cc-btn-primary-hover-bg);
    --cc-footer-bg: var(--cc-btn-secondary-bg);
    --cc-footer-color: var(--cc-secondary-color);
    --cc-footer-border-color: transparent;

    #cc-main{
        color-scheme: dark;
    }
}