.ccb-modal[data-theme="dark"],
body[data-theme="dark"] .ccb-modal,
.ccb-preferences-widget-wrap[data-theme="dark"],
.ccb-preferences-widget[data-theme="dark"] {
    --ccb-overlay: rgba(24, 24, 27, 0.48);
    --ccb-surface: #18181b;
    --ccb-surface-translucent: rgba(24, 24, 27, 0.95);
    --ccb-surface-soft: #27272a;
    --ccb-surface-hover: #27272a;
    --ccb-border: #27272a;
    --ccb-border-soft: #27272a;
    --ccb-text: #f4f4f5;
    --ccb-muted: #a1a1aa;
    --ccb-muted-strong: #d4d4d8;
    --ccb-primary: #ffffff;
    --ccb-primary-hover: #e4e4e7;
    --ccb-primary-text: #18181b;
    --ccb-shadow: 0 24px 80px rgba(0, 0, 0, 0.46);
    --ccb-banner-shadow: 0 12px 40px rgba(0, 0, 0, 0.34);
    --ccb-focus: 0 0 0 3px rgba(244, 244, 245, 0.18);
}

.ccb-modal[data-theme="dark"] .ccb-switch-track,
body[data-theme="dark"] .ccb-modal .ccb-switch-track {
    background: #3f3f46;
}

.ccb-modal[data-theme="dark"] .ccb-switch-thumb,
body[data-theme="dark"] .ccb-modal .ccb-switch-thumb {
    background: #f4f4f5;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
}

.ccb-modal[data-theme="dark"] .ccb-switch input:checked + .ccb-switch-track,
body[data-theme="dark"] .ccb-modal .ccb-switch input:checked + .ccb-switch-track {
    background: #71717a;
}