/* Frontend styles (theme-resistant) */
#dsgvo-cookie-banner, #dsgvo-cookie-banner * { box-sizing: border-box; }
#dsgvo-settings-modal, #dsgvo-settings-modal * { box-sizing: border-box; }

#dsgvo-cookie-banner {
    position: fixed;
    z-index: var(--dsgvo-z-index, 999999);
    left: 0; right: 0;
    background: var(--dsgvo-bg, #0b0f14) !important;
    color: var(--dsgvo-text, #e8eef6) !important;
    font-family: var(--dsgvo-font-family, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif) !important;
    font-size: var(--dsgvo-font-size, 14px) !important;
    line-height: 1.5;
    border-radius: var(--dsgvo-banner-radius, 14px) !important;
    box-shadow: 0 18px 60px rgba(0,0,0,0.30);
    padding: 0;
}

/* Preview mode (admin) - don't stick to viewport */
.dsgvo-preview-mode #dsgvo-cookie-banner { position: absolute !important; left: 0 !important; right: 0 !important; }

.dsgvo-position-bottom { bottom: 18px; margin: 0 18px; }
.dsgvo-position-top { top: 18px; margin: 0 18px; }
.dsgvo-position-bottom-left { bottom: 18px; left: 18px; right: auto; max-width: 480px; }
.dsgvo-position-bottom-right { bottom: 18px; right: 18px; left: auto; max-width: 480px; }
.dsgvo-position-center { top: 50%; left: 50%; right: auto; transform: translate(-50%, -50%); max-width: 560px; width: calc(100% - 36px); }

#dsgvo-cookie-banner .dsgvo-banner-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--dsgvo-padding, 18px) !important;
    gap: 18px;
}

.dsgvo-position-bottom-left .dsgvo-banner-content,
.dsgvo-position-bottom-right .dsgvo-banner-content,
.dsgvo-position-center .dsgvo-banner-content { flex-direction: column; text-align: center; }

#dsgvo-cookie-banner .dsgvo-text-section { flex: 1; min-width: 220px; }
#dsgvo-cookie-banner .dsgvo-main-text { margin: 0 0 10px 0; line-height: 1.6; color: inherit !important; }

#dsgvo-cookie-banner .dsgvo-links { display: flex; gap: 14px; font-size: 0.9em; flex-wrap: wrap; justify-content: center; }
#dsgvo-cookie-banner .dsgvo-link {
    color: var(--dsgvo-link, #7dd3fc) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: opacity 0.15s ease, color 0.15s ease;
}
#dsgvo-cookie-banner .dsgvo-link:hover { opacity: 0.92; color: var(--dsgvo-link-hover, #38bdf8) !important; }

#dsgvo-cookie-banner .dsgvo-buttons { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }

/* Button base (banner + modal) */
#dsgvo-cookie-banner button.dsgvo-btn,
#dsgvo-settings-modal button.dsgvo-btn {
    -webkit-appearance: none;
    appearance: none;
    border: 0 !important;
    outline: none;
    box-shadow: none;
    background: transparent;
    font: inherit;
}

#dsgvo-cookie-banner .dsgvo-btn,
#dsgvo-settings-modal .dsgvo-btn {
    padding: 10px 16px !important;
    border-radius: var(--dsgvo-button-radius, 12px) !important;
    cursor: pointer;
    font-weight: 600 !important;
    letter-spacing: 0.2px;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, color 0.15s ease, filter 0.15s ease;
    white-space: nowrap;
    user-select: none;
}

#dsgvo-cookie-banner .dsgvo-btn:hover,
#dsgvo-settings-modal .dsgvo-btn:hover { transform: translateY(-1px); box-shadow: 0 14px 24px rgba(0,0,0,0.24); filter: brightness(1.02); }

#dsgvo-cookie-banner .dsgvo-btn:focus-visible,
#dsgvo-settings-modal .dsgvo-btn:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--dsgvo-focus, #7dd3fc) 40%, transparent), 0 14px 24px rgba(0,0,0,0.24);
}

/* Button colors (banner + modal) */
#dsgvo-cookie-banner .dsgvo-btn-accept,
#dsgvo-settings-modal .dsgvo-btn-accept { background: var(--dsgvo-accept-bg, #22c55e) !important; color: var(--dsgvo-accept-text, #06120a) !important; }
#dsgvo-cookie-banner .dsgvo-btn-accept:hover,
#dsgvo-settings-modal .dsgvo-btn-accept:hover { background: var(--dsgvo-accept-hover-bg, #16a34a) !important; color: var(--dsgvo-accept-hover-text, #06120a) !important; }

#dsgvo-cookie-banner .dsgvo-btn-settings,
#dsgvo-settings-modal .dsgvo-btn-settings { background: var(--dsgvo-settings-bg, #3b82f6) !important; color: var(--dsgvo-settings-text, #07101f) !important; }
#dsgvo-cookie-banner .dsgvo-btn-settings:hover,
#dsgvo-settings-modal .dsgvo-btn-settings:hover { background: var(--dsgvo-settings-hover-bg, #2563eb) !important; color: var(--dsgvo-settings-hover-text, #07101f) !important; }

#dsgvo-cookie-banner .dsgvo-btn-reject,
#dsgvo-settings-modal .dsgvo-btn-reject { background: var(--dsgvo-reject-bg, #ef4444) !important; color: var(--dsgvo-reject-text, #150606) !important; }
#dsgvo-cookie-banner .dsgvo-btn-reject:hover,
#dsgvo-settings-modal .dsgvo-btn-reject:hover { background: var(--dsgvo-reject-hover-bg, #dc2626) !important; color: var(--dsgvo-reject-hover-text, #150606) !important; }

#dsgvo-settings-modal {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.62);
    z-index: calc(var(--dsgvo-z-index, 999999) + 1);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    backdrop-filter: blur(6px);
}

#dsgvo-settings-modal .dsgvo-modal-content {
    background: var(--dsgvo-bg, #0b0f14) !important;
    color: var(--dsgvo-text, #e8eef6) !important;
    border-radius: var(--dsgvo-modal-radius, 16px) !important;
    max-width: 640px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 28px 90px rgba(0,0,0,0.42);
    animation: dsgvoModalIn .2s ease;
}

@keyframes dsgvoModalIn { from { opacity: 0; transform: translateY(-14px); } to { opacity: 1; transform: translateY(0); } }

#dsgvo-settings-modal .dsgvo-modal-header {
    display:flex; justify-content:space-between; align-items:center;
    padding: 18px 18px 14px 18px;
    border-bottom: 1px solid rgba(255,255,255,0.10);
}
#dsgvo-settings-modal .dsgvo-modal-header h3 { margin: 0; font-size: 1.15em; font-weight: 600; color: inherit !important; }

#dsgvo-settings-modal .dsgvo-modal-close {
    background: rgba(255,255,255,0.08);
    border: 0 !important;
    color: var(--dsgvo-text, #e8eef6) !important;
    width: 36px; height: 36px;
    border-radius: 999px;
    font-size: 22px;
    cursor: pointer;
    display:flex; align-items:center; justify-content:center;
}
#dsgvo-settings-modal .dsgvo-modal-close:hover { background: rgba(255,255,255,0.12); }

#dsgvo-settings-modal .dsgvo-modal-body { padding: 18px; }
#dsgvo-settings-modal .dsgvo-modal-description { margin: 0 0 16px 0; opacity: .9; }

#dsgvo-settings-modal .dsgvo-cookie-option {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 14px;
    padding: 14px;
    margin-bottom: 12px;
}
#dsgvo-settings-modal .dsgvo-cookie-option-header { display:flex; align-items:center; gap: 12px; margin-bottom: 8px; }
#dsgvo-settings-modal .dsgvo-cookie-name { font-weight: 600; }
#dsgvo-settings-modal .dsgvo-required-tag {
    margin-left:auto;
    background: rgba(255,153,0,0.22);
    border: 1px solid rgba(255,153,0,0.30);
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
}
#dsgvo-settings-modal .dsgvo-cookie-description { margin: 0; opacity: .9; font-size: .95em; padding-left: 52px; }

#dsgvo-settings-modal .dsgvo-modal-footer {
    padding: 16px 18px 18px 18px;
    border-top: 1px solid rgba(255,255,255,0.10);
    display:flex; gap: 10px; justify-content:flex-end; flex-wrap:wrap;
}

/* switch */
#dsgvo-settings-modal .dsgvo-switch-large { position: relative; display: inline-block; width: 52px; height: 28px; flex-shrink: 0; }
#dsgvo-settings-modal .dsgvo-switch-large input { opacity: 0; width: 0; height: 0; }
#dsgvo-settings-modal .dsgvo-switch-large .slider {
    position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(255,255,255,0.18);
    transition: .25s;
    border-radius: 999px;
}
#dsgvo-settings-modal .dsgvo-switch-large .slider:before {
    position: absolute; content: ""; height: 22px; width: 22px; left: 3px; bottom: 3px;
    background-color: #fff;
    transition: .25s;
    border-radius: 50%;
}
#dsgvo-settings-modal .dsgvo-switch-large input:checked + .slider { background-color: rgba(34,197,94,0.70); }
#dsgvo-settings-modal .dsgvo-switch-large input:checked + .slider:before { transform: translateX(24px); }
#dsgvo-settings-modal .dsgvo-switch-large input:disabled + .slider { opacity: .5; cursor: not-allowed; }

.dsgvo-preview-hint{
    position:absolute;
    top: 8px; right: 8px;
    background: rgba(0,0,0,0.06);
    padding: 8px 10px;
    border-radius: 999px;
    font-size: 12px;
    color:#444;
}

@media (max-width: 768px) {
    #dsgvo-cookie-banner .dsgvo-banner-content { flex-direction: column; text-align: center; }
    #dsgvo-cookie-banner .dsgvo-buttons { width: 100%; }
    #dsgvo-cookie-banner .dsgvo-btn { flex: 1; min-width: 120px; }
    .dsgvo-position-bottom-left, .dsgvo-position-bottom-right { left: 18px; right: 18px; bottom: 18px; max-width: none; }
    #dsgvo-settings-modal .dsgvo-modal-content { max-height: 95vh; }
}


#dsgvo-cookie-banner .dsgvo-link-disabled { opacity: 0.65; cursor: default; text-decoration: underline; }