/* ============================================
   Klaro Consent Manager – Anpassung an
   Jahnke & Schneider Corporate Design
   Grün: #1f903b  Orange: #f07a25
   ============================================ */

.klaro .cookie-notice,
.klaro .cookie-modal {
    font-family: Arial, sans-serif !important;
    font-size: 14px !important;
}

/* ── Desktop: bottom-center – passend für schmales Zentriert-Layout ── */
.klaro .cookie-notice {
    position:      fixed !important;
    bottom:        16px !important;
    left:          50% !important;
    right:         auto !important;
    transform:     translateX(-50%) !important;
    max-width:     420px !important;
    width:         420px !important;
    z-index:       9999 !important;
    border-top:    3px solid #1f903b !important;
    border-radius: 4px !important;
    box-shadow:    0 4px 16px rgba(0,0,0,0.18) !important;
}

/* ── Akzeptieren-Button: grün, prominent ── */
.klaro .cookie-notice .cn-ok .cm-btn-success,
.klaro .cookie-modal .cm-btn-success {
    background-color: #1f903b !important;
    color:            #fff !important;
    font-weight:      bold !important;
    padding:          10px 18px !important;
    min-height:       44px !important;
    border-radius:    3px !important;
}
.klaro .cookie-notice .cn-ok .cm-btn-success:hover,
.klaro .cookie-modal .cm-btn-success:hover {
    background-color: #f07a25 !important;
}

/* ── Ablehnen-Button: sichtbar, aber weniger prominent – legal in DE ── */
.klaro .cookie-notice .cn-ok .cm-btn-danger,
.klaro .cookie-modal .cm-btn-danger {
    background-color: transparent !important;
    color:            #555 !important;
    border:           1px solid #aaa !important;
    padding:          10px 14px !important;
    min-height:       44px !important;
    border-radius:    3px !important;
}
.klaro .cookie-notice .cn-ok .cm-btn-danger:hover {
    border-color: #555 !important;
    color:        #333 !important;
}

/* ── Einstellungen: als dezenter Link ── */
.klaro .cookie-notice .cn-ok .cm-btn-info,
.klaro .cookie-modal .cm-btn-info {
    background-color: transparent !important;
    color:            #666 !important;
    text-decoration:  underline !important;
    padding:          10px 8px !important;
    font-size:        13px !important;
    border:           none !important;
}

/* ── Toggle: aktiv = grün ── */
.klaro .cookie-modal .cm-list-input:checked + .cm-list-label .slider {
    background-color: #1f903b !important;
}

/* ── Links ── */
.klaro a { color: #1f903b !important; }
.klaro a:hover { color: #f07a25 !important; }

/* ── Mobile: volle Breite, kompakter ── */
@media (max-width: 480px) {
    .klaro .cookie-notice {
        bottom:    0 !important;
        right:     0 !important;
        left:      0 !important;
        max-width: 100% !important;
        width:     100% !important;
        border-radius: 0 !important;
        border-top: 3px solid #1f903b !important;
        box-shadow: 0 -2px 12px rgba(0,0,0,0.15) !important;
    }
    /* Buttons nebeneinander, groß genug für Touch (min 44px) */
    .klaro .cookie-notice .cn-ok {
        display:         flex !important;
        flex-direction:  row !important;
        gap:             8px !important;
        flex-wrap:       nowrap !important;
    }
    .klaro .cookie-notice .cn-ok .cm-btn-success {
        flex:       1 !important;
        text-align: center !important;
    }
    .klaro .cookie-notice .cn-ok .cm-btn-danger {
        flex:       0 0 auto !important;
        min-width:  90px !important;
    }
}