/**
 * Klaro Cookie Consent – Custom CSS für kreativitaetstechnik.com
 * Farbwelt: Papier (#fbf7f1) · Terrakotta (#a8452a) · Ocker (#b8862a) · Tinte (#2a211b)
 *
 * Hinweis: Der "Ablehnen"-Button bleibt bewusst sichtbar und gleichwertig
 * gestaltet – Ablehnen muss so einfach sein wie Zustimmen.
 */

.klaro .cookie-notice,
.klaro .cookie-modal {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* Banner */
.klaro .cookie-notice {
  --border-radius: 14px;
}
.klaro .cookie-notice .cn-body {
  background: #2a211b;
  border-radius: 14px;
}

/* Primär-Button (Akzeptieren) */
.klaro .cookie-notice .cn-body .cn-buttons .cm-btn.cm-btn-success,
.klaro .cookie-modal .cm-footer .cm-btn.cm-btn-success {
  background-color: #a8452a;
  border-color: #a8452a;
  border-radius: 100px;
  font-weight: 600;
}
.klaro .cookie-notice .cn-body .cn-buttons .cm-btn.cm-btn-success:hover,
.klaro .cookie-modal .cm-footer .cm-btn.cm-btn-success:hover {
  background-color: #8a3721;
  border-color: #8a3721;
}

/* Ablehnen – gleichwertig, nur ohne Füllfarbe */
.klaro .cookie-notice .cn-body .cn-buttons .cm-btn.cm-btn-danger,
.klaro .cookie-modal .cm-footer .cm-btn.cm-btn-danger {
  background-color: transparent;
  border: 1px solid rgba(255, 255, 255, .45);
  color: #fff;
  border-radius: 100px;
  font-weight: 600;
}
.klaro .cookie-notice .cn-body .cn-buttons .cm-btn.cm-btn-danger:hover,
.klaro .cookie-modal .cm-footer .cm-btn.cm-btn-danger:hover {
  background-color: rgba(255, 255, 255, .12);
}

/* Sekundär (Einstellungen) */
.klaro .cookie-notice .cn-body .cn-buttons .cm-btn.cm-btn-info,
.klaro .cookie-modal .cm-footer .cm-btn.cm-btn-info {
  background-color: transparent;
  border: 1px solid rgba(255, 255, 255, .45);
  color: #fff;
  border-radius: 100px;
  font-weight: 600;
}

/* Toggle-Schalter */
.klaro .cookie-modal .cm-list-input:checked + .cm-list-label .slider {
  background-color: #b8862a;
}

/* Wortmarke im Banner */
.klaro .cookie-notice .cn-body::before {
  content: 'Kreativitätstechnik.com';
  display: block;
  font-family: 'Newsreader', Georgia, serif;
  font-weight: 650;
  font-size: 1.05rem;
  color: #ffffff;
  margin-bottom: .4rem;
  letter-spacing: -0.015em;
}
.klaro .cookie-modal .cm-modal .cm-header::before {
  content: 'Kreativitätstechnik.com';
  display: block;
  font-family: 'Newsreader', Georgia, serif;
  font-weight: 650;
  font-size: 1.05rem;
  color: rgba(255, 255, 255, .55);
  letter-spacing: -0.015em;
  margin-bottom: .25rem;
}

/* "Realisiert mit Klaro!" ausblenden (BSD-Lizenz, keine Attribution nötig) */
.klaro .cookie-modal .cm-footer .cm-powered-by { display: none !important; }

.klaro .cookie-notice a,
.klaro .cookie-modal a { color: #e9b98f; }
.klaro .cookie-notice a:hover,
.klaro .cookie-modal a:hover { color: #ffd6b5; }

/* Mobil: Buttons untereinander, volle Breite, große Tap-Ziele */
@media (max-width: 480px) {
  .klaro .cookie-notice .cn-body .cn-buttons { display: flex; flex-direction: column; gap: .5rem; }
  .klaro .cookie-notice .cn-body .cn-buttons .cm-btn { width: 100%; margin: 0; min-height: 46px; }
}