/* ========================================
   TOGGLE SWITCHES - GEZIELTE ÜBERSCHREIBUNG
   ======================================== */

/* Nur für die Switches: Variablen überschreiben */

.klaro .cookie-modal .cm-switch, .klaro .cookie-notice .cm-switch {
  --green1: #FFF785 !important;
  --green2: #FFF785 !important;
  --green3: #FFF785 !important;
  --blue1: #669BBD !important;
  --blue2: #669BBD !important;
  --blue3: #669BBD !important;
}

/* ALLE möglichen Slider-Selektoren für Hintergrund DEAKTIVIERT */

.klaro .cm-list-input .cm-switch .cm-list-label .slider, .klaro .cm-switch .cm-list-label .slider, .klaro .cm-list-label .slider, .klaro .slider {
  background-color: #669BBD !important;
}

/* ALLE möglichen Slider-Selektoren für Hintergrund AKTIVIERT */

.klaro .cm-list-input:checked + .cm-switch .cm-list-label .slider, .klaro .cm-switch input:checked + .cm-list-label .slider, .klaro .cm-list-input:checked ~ .cm-list-label .slider {
  background-color: #FFF785 !important;
}

/* ALLE möglichen Selektoren für den KNOPF wenn DEAKTIVIERT - WEISS */

.klaro .cm-list-input .cm-switch .cm-list-label .slider::before, .klaro .cm-switch .cm-list-label .slider::before, .klaro .cm-list-label .slider::before, .klaro .slider::before, .klaro .cm-list-input .cm-switch .cm-list-label .slider.round::before, .klaro .cm-switch .cm-list-label .slider.round::before {
  background-color: #FFFFFF !important;
}

/* ALLE möglichen Selektoren für den KNOPF wenn AKTIVIERT - DUNKELBLAU */

.klaro .cm-list-input:checked + .cm-switch .cm-list-label .slider::before, .klaro .cm-switch input:checked + .cm-list-label .slider::before, .klaro .cm-list-input:checked ~ .cm-list-label .slider::before, .klaro .cm-list-input:checked + .cm-switch .cm-list-label .slider.round::before, .klaro .cm-switch input:checked + .cm-list-label .slider.round::before {
  background-color: #0D3052 !important;
}

/* ========================================
   ALLGEMEINE STYLES
   ======================================== */

/* Schriftart */

.klaro .cookie-modal, .klaro .cookie-notice {
  font-family: 'Outfit', sans-serif !important;
}

/* Hintergrund dunkelblau */

.klaro .cookie-modal, .klaro .cookie-notice {
  background-color: #0D3052 !important;
  border: 2px solid #669BBD !important;
  color: #FFFFFF !important;
}

/* ========================================
   BUTTONS
   ======================================== */

/* Hauptbutton (Akzeptieren) - Gelb */

.klaro .cm-btn.cm-btn-success {
  background-color: #FFF785 !important;
  color: #0D3052 !important;
  border: none !important;
  font-weight: 600 !important;
}

.klaro .cm-btn.cm-btn-success:hover {
  background-color: #FFFFFF !important;
}

/* Sekundäre Buttons - Hellblau */

.klaro .cm-btn.cm-btn-info, .klaro .cm-btn.cm-btn-danger {
  background-color: #669BBD !important;
  color: #FFFFFF !important;
  border: none !important;
}

.klaro .cm-btn.cm-btn-info:hover, .klaro .cm-btn.cm-btn-danger:hover {
  background-color: #FFF785 !important;
  color: #0D3052 !important;
}

/* Close Button (X) */

.klaro .cookie-modal .cm-btn.cm-btn-close {
  color: #FFFFFF !important;
}

.klaro .cookie-modal .cm-btn.cm-btn-close:hover {
  color: #FFF785 !important;
}

/* ========================================
   MODAL/EINSTELLUNGSFENSTER
   ======================================== */

/* Modal Hintergrund */

.klaro .cookie-modal .cm-modal {
  background-color: #0D3052 !important;
  border: 2px solid #669BBD !important;
}

/* Modal Header */

.klaro .cookie-modal .cm-header {
  background-color: #0D3052 !important;
  border-bottom: 1px solid #669BBD !important;
}

/* Modal Body */

.klaro .cookie-modal .cm-body {
  background-color: #0D3052 !important;
}

/* ========================================
   TEXT & ÜBERSCHRIFTEN
   ======================================== */

/* Überschriften */

.klaro .cookie-modal .cm-modal-title, .klaro .cookie-notice .cn-title {
  color: #FFF785 !important;
  font-weight: 600 !important;
}

/* Service-Namen (z.B. "Marketing") */

.klaro .cookie-modal .cm-app-title {
  color: #FFFFFF !important;
}

/* Service-Beschreibungstext */

.klaro .cookie-modal .cm-app-description {
  color: #FFFFFF !important;
}

/* Links */

.klaro .cookie-modal a, .klaro .cookie-notice a {
  color: #FFF785 !important;
}

.klaro .cookie-modal a:hover, .klaro .cookie-notice a:hover {
  color: #FFFFFF !important;
}

/* "1 service" Link gelb */

.klaro .cookie-modal .cm-app-description a, .klaro .cookie-modal .cm-caret {
  color: #FFF785 !important;
}

/* "Realized with Klaro!" Text */

.klaro .cookie-modal .cm-powered-by {
  color: #FFF785 !important;
}

.klaro .cookie-modal .cm-powered-by a {
  color: #FFF785 !important;
}