/* ==========================================================================
   Klaro! Cookie Banner - Schlosserei Theme (Schwarz/Gelb)
   ========================================================================== */

/* 1. Die kleine Leiste am unteren Bildschirmrand */
.klaro .cookie-notice {
    background-color: #1d1d1b !important; /* Dunkles Schwarz-Grau aus dem HTML-Head */
    color: #dadada !important; /* Weiße Schrift */
    border-top: 3px solid #ffcc00 !important; /* Gelber Rand oben zur Abgrenzung */
}

/* Die Buttons in der Leiste */
.klaro .cookie-notice .cm-btn {
    background-color: #333333 !important; /* Dunkelgrau für sekundäre Buttons */
    color: #dadada !important;
    border: 1px solid #ffcc00 !important;
    border-radius: 3px !important;
}

/* Der primäre "Alle Akzeptieren" Button */
.klaro .cookie-notice .cm-btn.cm-btn-success,
.klaro .cookie-notice .cm-btn.cm-btn-primary {
    background-color: #ffcc00 !important; /* Schlosserei Gelb */
    color: #000000 !important; /* Schwarze Schrift für Kontrast */
    font-weight: bold !important;
    border: none !important;
}

/* Hover-Effekt für den gelben Button */
.klaro .cookie-notice .cm-btn.cm-btn-success:hover,
.klaro .cookie-notice .cm-btn.cm-btn-primary:hover {
    background-color: #e6b800 !important;
}

/* 2. Das Detail-Fenster (Modal), wenn man auf "Optionen" klickt */
.klaro .cookie-modal {
    background-color: #1d1d1b !important;
    color: #dadada !important;
    border: 1px solid #ffcc00 !important;
}

/* Header des Modals */
.klaro .cookie-modal .cm-modal-header {
    border-bottom: 1px solid #333333 !important;
}

/* Die Buttons im Modal */
.klaro .cookie-modal .cm-btn-success {
    background-color: #ffcc00 !important;
    color: #000000 !important;
    font-weight: bold !important;
}

/* 3. Die Schalter (Toggles) für die einzelnen Dienste */
.klaro .cookie-modal .cm-switch-background {
    background-color: #555555 !important; /* Grau, wenn deaktiviert */
}

/* Schalter, wenn er aktiviert ist */
.klaro .cookie-modal input:checked + .cm-switch-background {
    background-color: #ffcc00 !important; /* Gelb, wenn aktiviert */
}