/* Consent Guard - Banner-Styles (v1.1.0) */
.cg-root {
    --cg-accent: #2563eb;
    --cg-bg: #ffffff;
    --cg-fg: #1f2937;
    --cg-muted: #6b7280;
    --cg-border: #e5e7eb;
    --cg-ghost-bg: #f3f4f6;
    --cg-radius: 14px;
    --cg-max-width: 920px;
    --cg-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.cg-root.cg-dark {
    --cg-bg: #1f2937; --cg-fg: #f3f4f6; --cg-muted: #9ca3af; --cg-border: #374151; --cg-ghost-bg: #374151;
}
.cg-root[hidden] { display: none !important; }

.cg-root { position: fixed; inset: 0; z-index: 99999; font-family: var(--cg-font); }
.cg-root.cg-bottom { display: flex; align-items: flex-end; justify-content: center; pointer-events: none; }
.cg-root.cg-center { display: flex; align-items: center; justify-content: center; }
.cg-root.cg-corner-left, .cg-root.cg-corner-right { display: block; pointer-events: none; }

.cg-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
.cg-root .cg-overlay { display: none; }
.cg-root.cg-has-overlay .cg-overlay { display: block; }

.cg-box {
    position: relative; pointer-events: auto;
    background: var(--cg-bg); color: var(--cg-fg);
    width: 100%; max-width: var(--cg-max-width); margin: 16px;
    border: 1px solid var(--cg-border); border-radius: var(--cg-radius);
    box-shadow: 0 10px 40px rgba(0,0,0,.18);
    padding: 22px 24px;
}
.cg-root.cg-center .cg-box { max-width: min(520px, var(--cg-max-width)); }
.cg-root.cg-corner-left .cg-box,
.cg-root.cg-corner-right .cg-box {
    position: absolute; bottom: 0; width: auto; max-width: min(420px, calc(100vw - 32px));
}
.cg-root.cg-corner-left .cg-box { left: 0; }
.cg-root.cg-corner-right .cg-box { right: 0; }

.cg-logo { max-height: 40px; width: auto; margin-bottom: 12px; display: block; }
.cg-title { margin: 0 0 8px; font-size: 18px; line-height: 1.3; }
.cg-text { margin: 0 0 12px; font-size: 14px; line-height: 1.6; }
.cg-links { margin: 0 0 14px; font-size: 13px; }
.cg-links a { color: var(--cg-accent); text-decoration: none; }
.cg-links a:hover { text-decoration: underline; }

.cg-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }
.cg-btn {
    appearance: none; cursor: pointer; border: 1px solid transparent;
    border-radius: 9px; padding: 10px 18px; font-size: 14px; font-weight: 600;
    line-height: 1; transition: opacity .15s ease, background .15s ease;
}
.cg-bs-pill .cg-btn { border-radius: 999px; }
.cg-bs-square .cg-btn { border-radius: 0; }
.cg-btn-primary { background: var(--cg-accent); color: #fff; }
.cg-btn-primary:hover { opacity: .9; }
.cg-btn-ghost { background: var(--cg-ghost-bg); color: var(--cg-fg); border-color: var(--cg-border); }
.cg-btn-ghost:hover { opacity: .85; }

.cg-category { padding: 12px 0; border-top: 1px solid var(--cg-border); }
.cg-category:first-of-type { border-top: none; }
.cg-category-head { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.cg-category p { margin: 0; font-size: 13px; color: var(--cg-muted); }

.cg-switch { position: relative; display: inline-block; width: 42px; height: 24px; flex: 0 0 auto; }
.cg-switch input { opacity: 0; width: 0; height: 0; }
.cg-slider { position: absolute; inset: 0; background: #cbd5e1; border-radius: 999px; transition: .2s; }
.cg-slider:before { content: ""; position: absolute; height: 18px; width: 18px; left: 3px; top: 3px; background: #fff; border-radius: 50%; transition: .2s; }
.cg-switch input:checked + .cg-slider { background: var(--cg-accent); }
.cg-switch input:checked + .cg-slider:before { transform: translateX(18px); }
.cg-switch input:disabled + .cg-slider { opacity: .6; }

.cg-embed-block {
    display: flex; align-items: center; justify-content: center;
    min-height: 220px; background: #f3f4f6; color: #1f2937;
    border: 1px dashed #cbd5e1; border-radius: 12px; padding: 24px; text-align: center;
}
.cg-embed-inner { max-width: 420px; }
.cg-embed-title { font-weight: 700; margin: 0 0 6px; }
.cg-embed-desc { font-size: 13px; color: #6b7280; margin: 0 0 14px; line-height: 1.5; }

@media (max-width: 540px) {
    .cg-actions { justify-content: stretch; }
    .cg-btn { flex: 1 1 auto; text-align: center; }
    .cg-root.cg-corner-left .cg-box, .cg-root.cg-corner-right .cg-box { max-width: calc(100vw - 32px); }
}
