/* ============================================================
   CMBD – Cookis Management by Delomiddm – Public Styles v1.1
   ============================================================ */

#cmbd-notice *, #cmbd-notice *::before, #cmbd-notice *::after,
#cmbd-bubble, #cmbd-bubble * { box-sizing: border-box; margin: 0; padding: 0; }

/* --- Overlay --- */
.cmbd-overlay { display: none; position: fixed; inset: 0; background: var(--cmbd-overlay, rgba(0,0,0,0.45)); z-index: 999998; }
.cmbd-overlay.cmbd-visible { display: block; }

/* --- Notice base (hidden) --- */
.cmbd-notice {
    display: none; position: fixed; z-index: 999999;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 14px; line-height: 1.55;
    color: var(--cmbd-text, #111111);
    background: var(--cmbd-bg, #ffffff);
}
.cmbd-notice.cmbd-visible { display: flex; }

/* ======================= BANNER ======================= */
.cmbd-type-banner {
    left: 0; right: 0;
    flex-direction: row;
    align-items: center;
    gap: 20px; padding: 16px 28px; flex-wrap: wrap;
}
.cmbd-type-banner.cmbd-pos-bottom {
    bottom: 0;
    border-top: 1px solid var(--cmbd-border, #e0e0e0);
    box-shadow: 0 -4px 24px rgba(0,0,0,.10);
}
.cmbd-type-banner.cmbd-pos-top {
    top: 0;
    border-bottom: 1px solid var(--cmbd-border, #e0e0e0);
    box-shadow: 0 4px 24px rgba(0,0,0,.10);
}
.cmbd-type-banner .cmbd-icon { width: 36px; height: 36px; flex-shrink: 0; color: var(--cmbd-btn-accept-bg, #2e7d32); }
.cmbd-type-banner .cmbd-body { flex: 1; min-width: 200px; }
.cmbd-type-banner .cmbd-title { font-size: 15px; font-weight: 700; color: var(--cmbd-text, #111); margin-bottom: 3px; }
.cmbd-type-banner .cmbd-desc { font-size: 13px; color: var(--cmbd-text, #111); opacity: .68; }
.cmbd-type-banner .cmbd-actions-main { display: flex; align-items: center; gap: 8px; flex-shrink: 0; flex-wrap: wrap; }
.cmbd-type-banner .cmbd-prefs-panel { flex: 0 0 100%; }
.cmbd-type-banner .cmbd-btn { padding: 8px 14px; font-size: 13px; }
.cmbd-type-banner .cmbd-close-btn { display: none; }

/* ======================= BOX ========================= */
.cmbd-type-box {
    flex-direction: column;
    width: 340px;
    border-radius: 14px;
    border: 1px solid var(--cmbd-border, #e0e0e0);
    box-shadow: 0 8px 36px rgba(0,0,0,.15);
    padding: 20px 22px;
}
.cmbd-type-box.cmbd-pos-bottom { bottom: 20px; }
.cmbd-type-box.cmbd-pos-top    { top: 20px; }
.cmbd-type-box.cmbd-pos-left   { left: 20px; }
.cmbd-type-box.cmbd-pos-right  { right: 20px; }
.cmbd-type-box:not(.cmbd-pos-left):not(.cmbd-pos-right) { left: 20px; }

.cmbd-type-box .cmbd-box-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.cmbd-type-box .cmbd-logo-wrap { display: flex; align-items: center; gap: 8px; }
.cmbd-type-box .cmbd-icon { width: 30px; height: 30px; color: var(--cmbd-btn-accept-bg, #1565c0); }
.cmbd-type-box .cmbd-title { font-size: 15px; font-weight: 700; color: var(--cmbd-text, #111); margin-bottom: 7px; }
.cmbd-type-box .cmbd-desc { font-size: 13px; color: var(--cmbd-text, #111); opacity: .68; margin-bottom: 16px; line-height: 1.55; }
.cmbd-type-box .cmbd-actions-main { display: flex; flex-direction: column; gap: 8px; }
.cmbd-type-box .cmbd-actions-main .cmbd-btn { width: 100%; }
.cmbd-type-box .cmbd-btn-row { display: flex; gap: 8px; }
.cmbd-type-box .cmbd-btn-row .cmbd-btn { flex: 1; }

/* ======================= POPUP ======================== */
.cmbd-type-popup {
    flex-direction: column;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: var(--cmbd-popup-width, 460px);
    max-width: calc(100vw - 32px);
    max-height: 90vh; overflow-y: auto;
    border-radius: 16px;
    box-shadow: 0 16px 64px rgba(0,0,0,.22);
    padding: 28px 28px 24px;
}
.cmbd-type-popup .cmbd-popup-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 14px; }
.cmbd-type-popup .cmbd-logo-wrap { display: flex; align-items: center; gap: 10px; }
.cmbd-type-popup .cmbd-icon { width: 32px; height: 32px; color: var(--cmbd-btn-accept-bg, #1565c0); }
.cmbd-type-popup .cmbd-title { font-size: 18px; font-weight: 700; color: var(--cmbd-text, #111); margin-bottom: 8px; }
.cmbd-type-popup .cmbd-desc { font-size: 13.5px; color: var(--cmbd-text, #111); opacity: .72; margin-bottom: 20px; line-height: 1.6; }
.cmbd-type-popup .cmbd-actions-main { display: flex; gap: 10px; flex-wrap: wrap; }

/* ======================= SHARED ======================= */
.cmbd-badge {
    font-size: 10.5px; font-weight: 700; letter-spacing: .04em;
    background: rgba(21,101,192,.1); color: var(--cmbd-btn-custom-bg, #1565c0);
    border-radius: 99px; padding: 2px 9px; white-space: nowrap;
}
.cmbd-close-btn {
    background: none; border: none; cursor: pointer;
    font-size: 18px; color: var(--cmbd-text, #111); opacity: .38;
    padding: 4px 7px; border-radius: 6px;
    transition: opacity .2s, background .2s; flex-shrink: 0;
}
.cmbd-close-btn:hover { opacity: .82; background: rgba(0,0,0,.06); }
.cmbd-privacy-link {
    display: inline-block; margin-top: 6px;
    font-size: 12px; font-weight: 600;
    color: var(--cmbd-btn-custom-bg, #1565c0);
    text-decoration: none; opacity: .85; transition: opacity .2s;
}
.cmbd-privacy-link:hover { opacity: 1; }

/* ======================= BUTTONS ====================== */
.cmbd-btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 10px 18px;
    border: none; border-radius: 8px;
    font-size: 13.5px; font-weight: 600; cursor: pointer;
    transition: filter .15s, transform .12s; white-space: nowrap;
}
.cmbd-btn:hover  { filter: brightness(1.08); }
.cmbd-btn:active { transform: scale(.97); }
.cmbd-btn-accept { background: var(--cmbd-btn-accept-bg, #2e7d32); color: var(--cmbd-btn-accept-text, #ffffff); }
.cmbd-btn-reject { background: var(--cmbd-btn-reject-bg, #c62828); color: var(--cmbd-btn-reject-text, #ffffff); }
.cmbd-btn-custom { background: rgba(0,0,0,.06); color: var(--cmbd-text, #111); border: 1px solid var(--cmbd-border, #d0d0d0); }
.cmbd-btn-save   { background: var(--cmbd-btn-save-bg, #1565c0); color: var(--cmbd-btn-save-text, #ffffff); width: 100%; }

/* =================== PREFERENCES PANEL ================ */
.cmbd-prefs-panel { display: none; margin-top: 16px; border-top: 1px solid var(--cmbd-border, #e8e8e8); padding-top: 16px; }
.cmbd-prefs-panel.cmbd-open { display: block; }
.cmbd-prefs-title { font-size: 14px; font-weight: 700; color: var(--cmbd-text, #111); margin-bottom: 12px; }

.cmbd-cat-item { display: flex; flex-direction: column; padding: 11px 0; border-bottom: 1px solid var(--cmbd-border, #f0f0f0); }
.cmbd-cat-item:last-of-type { border-bottom: none; }
.cmbd-cat-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 5px; }
.cmbd-cat-info { display: flex; align-items: center; gap: 8px; }
.cmbd-cat-title { font-size: 13.5px; font-weight: 700; color: var(--cmbd-text, #111); }
.cmbd-always-badge { font-size: 10px; font-weight: 700; background: var(--cmbd-toggle-active, #2e7d32); color: #fff; border-radius: 99px; padding: 1px 8px; white-space: nowrap; }
.cmbd-cat-desc { font-size: 12.5px; color: var(--cmbd-text, #111); opacity: .6; line-height: 1.55; }

/* Toggle */
.cmbd-toggle { position: relative; width: 42px; height: 24px; flex-shrink: 0; }
.cmbd-toggle input { opacity: 0; width: 0; height: 0; position: absolute; }
.cmbd-toggle label { position: absolute; inset: 0; background: rgba(0,0,0,.18); border-radius: 99px; cursor: pointer; transition: background .22s; }
.cmbd-toggle label::after { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.22); transition: transform .22s; }
.cmbd-toggle input:checked + label { background: var(--cmbd-toggle-active, #2e7d32); }
.cmbd-toggle input:checked + label::after { transform: translateX(18px); }
.cmbd-toggle--locked label { opacity: .55; cursor: not-allowed; }
.cmbd-actions-prefs { margin-top: 16px; }

/* ======================= BUBBLE ======================= */
.cmbd-bubble {
    position: fixed; z-index: 999997;
    width: var(--cmbd-bubble-size, 52px); height: var(--cmbd-bubble-size, 52px);
    border-radius: 50%;
    background: var(--cmbd-bubble-bg, #1565c0);
    color: var(--cmbd-bubble-icon, #ffffff);
    border: none; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 18px rgba(0,0,0,.22);
    transition: transform .2s, box-shadow .2s;
}
.cmbd-bubble svg { width: 52%; height: 52%; }
.cmbd-bubble:hover  { transform: scale(1.1); box-shadow: 0 6px 28px rgba(0,0,0,.28); }
.cmbd-bubble:active { transform: scale(.95); }
.cmbd-bubble-bottom-left  { bottom: 20px; left: 20px; }
.cmbd-bubble-bottom-right { bottom: 20px; right: 20px; }
.cmbd-bubble-top-left     { top: 20px;    left: 20px; }
.cmbd-bubble-top-right    { top: 20px;    right: 20px; }

/* ==================== RESPONSIVE ====================== */
@media (max-width: 640px) {
    .cmbd-type-banner { flex-direction: column; align-items: flex-start; gap: 14px; padding: 16px 18px; }
    .cmbd-type-banner .cmbd-actions-main { width: 100%; }
    .cmbd-type-banner .cmbd-btn { flex: 1; min-width: 0; }
    .cmbd-type-box { width: calc(100vw - 24px); left: 12px !important; right: 12px !important; }
    .cmbd-type-popup { padding: 22px 18px 20px; }
}