/* ============================================================
   COMPLIANZ – Cookie-Banner im Theme-Look (Audit 10/2026, Block F)
   Wird NUR geladen, wenn Complianz aktiv ist (odm_complianz_styles()).
   Dunkle Glas-Optik, Cyan-Akzent, Inter, Radius 20 px – ausschließlich
   die Design-Tokens aus :root in main.css.
   DSGVO/TTDSG: „Akzeptieren" und „Ablehnen" sind gleich groß, gleich
   gewichtet und gleich gut sichtbar; „Einstellungen" bewusst dezenter.
   Inhalte/Platzhalter der Complianz-Vorlagen werden NICHT verändert.
   ============================================================ */

.cmplz-cookiebanner {
    --cmplz_banner_background_color: var(--c-dark-2);
    --cmplz_banner_border_color: var(--hairline-strong);
    --cmplz_banner_border_radius: var(--r-lg);
    --cmplz_text_color: var(--c-gray-300);
    --cmplz_hyperlink_color: var(--c-accent);
    --cmplz_category_header_always_active_color: var(--c-accent);
    --cmplz_slider_active_color: var(--c-accent);
    --cmplz_button_border_radius: var(--r-full);
}

.cmplz-cookiebanner.cmplz-cookiebanner {
    font-family: var(--f-primary) !important;
    background: rgba(17, 24, 36, 0.92) !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border: 1px solid var(--hairline-strong) !important;
    border-radius: var(--r-lg) !important;
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.45), inset 0 1px 0 var(--hairline-strong) !important;
    color: var(--c-gray-300) !important;
}

.cmplz-cookiebanner .cmplz-title,
.cmplz-cookiebanner .cmplz-header .cmplz-title {
    font-family: var(--f-primary) !important;
    font-weight: 700 !important;
    color: var(--c-white) !important;
}

.cmplz-cookiebanner .cmplz-message,
.cmplz-cookiebanner .cmplz-message p,
.cmplz-cookiebanner .cmplz-description,
.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-description {
    font-family: var(--f-primary) !important;
    color: var(--c-gray-300) !important;
    line-height: 1.6 !important;
}

.cmplz-cookiebanner a,
.cmplz-cookiebanner .cmplz-links a,
.cmplz-cookiebanner .cmplz-documents a {
    color: var(--c-accent) !important;
    text-decoration: underline !important;
    text-underline-offset: 2px;
}

.cmplz-cookiebanner .cmplz-close {
    color: var(--c-gray-400) !important;
}

/* Kategorien (Einstellungsansicht) */
.cmplz-cookiebanner .cmplz-categories .cmplz-category {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid var(--hairline) !important;
    border-radius: var(--r-md) !important;
}
.cmplz-cookiebanner .cmplz-category .cmplz-category-title {
    color: var(--c-white) !important;
}

/* ── Buttons: gemeinsame Basis ── */
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn {
    font-family: var(--f-primary) !important;
    font-size: var(--f-size-sm) !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em;
    min-height: 48px !important;
    height: auto !important;
    padding: 0.75rem 1.5rem !important;
    border-radius: var(--r-full) !important;
    flex: 1 1 0 !important;
    width: auto !important;
    white-space: normal;
    transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast), box-shadow var(--t-fast);
}

/* „Akzeptieren" und „Ablehnen": identische Größe, Gewicht und Präsenz */
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept,
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny {
    background: var(--c-accent) !important;
    border: 2px solid var(--c-accent) !important;
    color: var(--c-black) !important;
    box-shadow: var(--shadow-accent) !important;
}
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept:hover,
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny:hover {
    background: var(--c-accent-light) !important;
    border-color: var(--c-accent-light) !important;
}

/* „Einstellungen"/„Speichern": dezenter (Outline) */
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences,
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-save-preferences {
    background: transparent !important;
    border: 2px solid var(--hairline-strong) !important;
    color: var(--c-gray-300) !important;
    font-weight: 600 !important;
    box-shadow: none !important;
}
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences:hover,
.cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-save-preferences:hover {
    border-color: var(--c-accent) !important;
    color: var(--c-accent) !important;
}

.cmplz-cookiebanner .cmplz-btn:focus-visible,
.cmplz-cookiebanner a:focus-visible,
.cmplz-manage-consent:focus-visible {
    outline: 2px solid var(--c-accent) !important;
    outline-offset: 3px !important;
}

/* Schwebender „Zustimmung verwalten"-Tab */
.cmplz-manage-consent {
    font-family: var(--f-primary) !important;
    background: var(--c-dark-2) !important;
    color: var(--c-gray-300) !important;
    border: 1px solid var(--hairline-strong) !important;
}

/* Mobil kompakt (Prompt 39, A7): ≤ 40 % Bildschirmhöhe. Text max. 3 Zeilen,
   „Akzeptieren" und „Ablehnen" nebeneinander (je 50 %, 48 px, identisch gewichtet),
   „Einstellungen" als Textlink darunter. Nur Darstellung — keine Logikänderung. */
@media (max-width: 768px) {
    .cmplz-cookiebanner.cmplz-cookiebanner {
        left: 10px !important;
        right: 10px !important;
        bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
        width: auto !important;
        max-width: none !important;
        max-height: 40vh !important;
        padding: 14px 16px !important;
        gap: 8px !important;
        overflow-y: auto !important;
    }
    .cmplz-cookiebanner .cmplz-header {
        margin: 0 !important;
    }
    .cmplz-cookiebanner .cmplz-logo,
    .cmplz-cookiebanner .cmplz-divider {
        display: none !important;
    }
    .cmplz-cookiebanner .cmplz-title {
        font-size: 0.95rem !important;
    }
    .cmplz-cookiebanner .cmplz-message,
    .cmplz-cookiebanner .cmplz-message p {
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 3 !important;
        overflow: hidden !important;
        margin: 0 !important;
        font-size: 0.85rem !important;
        line-height: 1.45 !important;
    }
    .cmplz-cookiebanner .cmplz-buttons {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
    }
    .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept,
    .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny {
        flex: 1 1 calc(50% - 4px) !important;
        width: auto !important;
        min-height: 48px !important;
        padding: 0.5rem 0.75rem !important;
    }
    .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences,
    .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-save-preferences {
        order: 3 !important;
        flex: 1 1 100% !important;
        min-height: 44px !important;
        padding: 0 !important;
        border: 0 !important;
        background: none !important;
        text-decoration: underline !important;
        text-underline-offset: 2px;
    }
    .cmplz-cookiebanner .cmplz-links {
        font-size: 0.8rem !important;
    }
}
