:root {
    --cc-font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
    --cc-modal-border-radius: 1.25rem;
    --cc-btn-border-radius: 9999px;

    --cc-bg: rgba(255, 255, 255, 0.96);
    --cc-primary-color: #1c1917;
    --cc-secondary-color: #57534e;
    --cc-separator-border-color: #e7e5e4;

    --cc-btn-primary-bg: #036BCC;
    --cc-btn-primary-color: #ffffff;
    --cc-btn-primary-border-color: #036BCC;
    --cc-btn-primary-hover-bg: #0259ad;
    --cc-btn-primary-hover-color: #ffffff;
    --cc-btn-primary-hover-border-color: #0259ad;

    --cc-btn-secondary-bg: #f5f5f4;
    --cc-btn-secondary-color: #292524;
    --cc-btn-secondary-border-color: #f5f5f4;
    --cc-btn-secondary-hover-bg: #e7e5e4;
    --cc-btn-secondary-hover-color: #1c1917;
    --cc-btn-secondary-hover-border-color: #e7e5e4;

    --cc-toggle-on-bg: #036BCC;
    --cc-toggle-readonly-bg: #d6d3d1;
    --cc-cookie-category-block-bg: #f8fafc;
    --cc-cookie-category-block-border: #e7e5e4;
    --cc-cookie-category-block-hover-bg: #f1f5f9;
    --cc-cookie-category-block-hover-border: #e2e8f0;
    --cc-footer-bg: #f5f5f4;
    --cc-footer-color: #57534e;
    --cc-footer-border-color: #e7e5e4;
}

#cc-main .cm,
#cc-main .pm {
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.18);
}

#cc-main .cm--cloud .cm__body {
    backdrop-filter: blur(8px);
}

#cc-main .cm__title,
#cc-main .pm__title {
    color: #036BCC;
    font-weight: 800;
    letter-spacing: -0.02em;
}

#cc-main .cm__desc,
#cc-main .pm__section-desc-wrapper,
#cc-main .pm__body {
    color: #57534e;
}

#cc-main .cm__btn,
#cc-main .pm__btn,
#cc-main .pm__close-btn {
    font-weight: 700;
}

#cc-main .pm__btn--primary,
#cc-main .pm__btn[data-role='save'] {
    background-color: #26A05D;
    border-color: #26A05D;
    color: #ffffff;
}

#cc-main .pm__btn--primary:hover,
#cc-main .pm__btn[data-role='save']:hover {
    background-color: #208a50;
    border-color: #208a50;
}

/* Preferences dropdown blocks should be rounded-square, not pill */
#cc-main .pm__section--toggle,
#cc-main .pm__section--toggle .pm__section-title,
#cc-main .pm__section--toggle .pm__section-desc-wrapper {
    border-radius: 0.9rem;
}

#cc-main .pm__section--toggle.is-expanded .pm__section-title {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

#cc-main .pm__section--toggle.is-expanded .pm__section-desc-wrapper {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
