.hj-cc {
    color-scheme: dark;

    --cc-font-family: var(--font-sans);

    --cc-bg: transparent;
    --cc-primary-color: white;
    --cc-secondary-color: white;
    --cc-btn-border-radius:0;
    --cc-modal-border-radius:0;
    --cc-separator-border-color:transparent;

    --cc-btn-primary-bg: #ffffff;
    --cc-btn-primary-color: #000;
    --cc-btn-primary-hover-bg: rgba(255, 255, 255, 0.8);
    --cc-btn-primary-hover-color: #000;
    --cc-btn-primary-border-color: white;
    --cc-btn-primary-hover-border-color: white;

    --cc-btn-secondary-bg: transparent;
    --cc-btn-secondary-color: var(--cc-primary-color);
    --cc-btn-secondary-border-color: white;
    --cc-btn-secondary-hover-bg: rgba(0, 0, 0, 0.2);
    --cc-btn-secondary-hover-color: white;
    --cc-btn-secondary-hover-border-color: white;

    --cc-cookie-category-block-bg: #000;
    --cc-cookie-category-block-border: #000;
    --cc-cookie-category-block-hover-bg: #000;
    --cc-cookie-category-block-hover-border: #000;
    --cc-cookie-category-expanded-block-hover-bg: #000;
    --cc-cookie-category-expanded-block-bg: #000;

    --cc-toggle-on-bg: var(--cc-btn-primary-bg);
    --cc-toggle-off-bg: #5f5f5f;
    --cc-toggle-on-knob-bg: var(--cc-btn-primary-color);
    --cc-toggle-off-knob-bg: var(--cc-btn-primary-color);

    --cc-toggle-enabled-icon-color: var(--cc-btn-primary-color);
    --cc-toggle-disabled-icon-color: var(--cc-btn-primary-color);

    --cc-toggle-readonly-bg: #444444;
    --cc-toggle-readonly-knob-bg: #6d6d6d;
    --cc-toggle-readonly-knob-icon-color: var(--cc-toggle-readonly-bg);

    --cc-overlay-bg: rgba(0, 0, 0, 0.5)!important;
}

.hj-cc #cc-main .cm {
    box-shadow: none;
}
.hj-cc #cc-main .cm__title + .cm__desc {
    margin-top: 0.5em;
}
.hj-cc #cc-main .cm--bar.cm--inline .cm__body {
    max-width: none;
}
.hj-cc #cc-main .cm--bar.cm--inline .cm__btns {
    max-width: none;
}
.hj-cc #cc-main .pm {
    box-shadow: none;
    background-color: black;    
}

@media screen and (min-width: 1200px) {
    .hj-cc #cc-main .cm--bar.cm--inline .cm__btns {
        flex-direction: row-reverse;
        gap: 10px;
    }
    .hj-cc #cc-main .cm--bar.cm--inline .cm__btns .cm__btn-group {
        gap:10px;
    }
    .hj-cc #cc-main .cm__btn-group + .cm__btn-group {
        margin-top:0;
    }
    .hj-cc #cc-main .cm--inline .cm__btn + .cm__btn {
        margin-left:0;
    }
    .hj-cc #cc-main .cm--bar .cm__btn {
        min-width:15vw;
    }
    .hj-cc #cc-main .cm__btn-group {
        place-self: end;
    }
}

@media screen and (max-width: 640px) {
    .hj-cc #cc-main .cm__btn {
        padding-block:0.4em;
        min-height: 35px;
    }
    .hj-cc #cc-main #cm__desc {
        padding-bottom: 0;
    }
    .hj-cc #cc-main #cm__title,
    .hj-cc #cc-main #cm__desc {
        font-size: .82em;
    }
}