/* Klaro-Anpassungen im Head-of-Fernweh-Design */
.klaro {
  --consent-sand: #fdf8f4;
  --consent-turquoise: #cad1c7;
  --consent-floral: #ea885a;
  --consent-ink: #171817;
  --consent-white: #ffffff;
}

.klaro .cookie-notice,
.klaro .cookie-modal .cm-modal {
  background: var(--consent-white);
  color: var(--consent-ink);
  border: 1px solid rgba(23, 24, 23, 0.16);
  border-radius: 1.25rem;
  box-shadow: 0 1.25rem 4rem rgba(23, 24, 23, 0.2);
  font-family: "DM Sans", Arial, sans-serif;
}

.klaro .cookie-modal .cm-modal,
.klaro .cookie-modal .cm-modal .cm-header,
.klaro .cookie-modal .cm-modal .cm-body,
.klaro .cookie-modal .cm-modal .cm-footer,
.klaro .cookie-modal .cm-modal .cm-list,
.klaro .cookie-modal .cm-modal .cm-purpose,
.klaro .cookie-modal .cm-modal .cm-service {
  background: var(--consent-white);
  color: var(--consent-ink);
}

.klaro .cookie-modal .cm-modal strong,
.klaro .cookie-modal .cm-modal span,
.klaro .cookie-modal .cm-modal label {
  color: var(--consent-ink);
}

.klaro .cookie-notice:not(.cookie-modal-notice) {
  background: var(--consent-white);
  border: 0;
  border-top: 1px solid rgba(23, 24, 23, 0.18);
  border-radius: 0;
  bottom: 0;
  box-sizing: border-box;
  color: var(--consent-ink);
  left: 0;
  margin: 0;
  max-width: none;
  right: 0;
  width: 100%;
}

.klaro .cookie-notice:not(.cookie-modal-notice) .cn-body {
  box-sizing: border-box;
  margin: 0 auto;
  max-width: 1440px;
  padding: 1.25rem clamp(1.25rem, 4vw, 4rem);
  width: 100%;
}

.klaro .cookie-notice:not(.cookie-modal-notice) h1,
.klaro .cookie-notice:not(.cookie-modal-notice) p,
.klaro .cookie-notice:not(.cookie-modal-notice) a,
.klaro .cookie-notice:not(.cookie-modal-notice) .cm-link {
  color: var(--consent-ink);
}

.klaro .cookie-notice .cn-body,
.klaro .cookie-modal .cm-body,
.klaro .cookie-modal .cm-footer {
  background: transparent;
}

.klaro .cookie-notice h1,
.klaro .cookie-modal h1,
.klaro .cookie-modal h2,
.klaro .cookie-modal .cm-purpose,
.klaro .cookie-modal .cm-service {
  color: var(--consent-ink);
}

.klaro .cookie-notice p,
.klaro .cookie-modal p,
.klaro .cookie-modal .cm-list-description {
  color: rgba(23, 24, 23, 0.78);
}

.klaro a,
.klaro .cm-link {
  color: var(--consent-ink);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.klaro .cm-btn {
  border: 1px solid var(--consent-ink);
  border-radius: 999px;
  box-shadow: none;
  font-weight: 700;
  transition:
    background-color 180ms ease,
    color 180ms ease,
    transform 180ms ease;
}

.klaro .cm-btn:hover,
.klaro .cm-btn:focus-visible {
  transform: translateY(-1px);
}

.klaro .cm-btn.cm-btn-success,
.klaro .cm-btn.cm-btn-info {
  background: var(--consent-ink);
  color: var(--consent-white);
}

.klaro .cm-btn.cm-btn-danger,
.klaro .cm-btn.cm-btn-decline {
  background: var(--consent-white);
  color: var(--consent-ink);
}

.klaro .cm-btn.cm-btn-success-var {
  background: var(--consent-floral);
  color: var(--consent-ink);
}

.klaro .cookie-modal .cm-list-input:checked + .cm-list-label .slider {
  background-color: var(--consent-floral);
}

.klaro .cookie-modal .cm-list-label .slider {
  background-color: var(--consent-turquoise);
}

.klaro .cookie-modal .cm-modal .cm-header,
.klaro .cookie-modal .cm-modal .cm-footer {
  border-color: rgba(23, 24, 23, 0.14);
}

.klaro .cookie-modal {
  z-index: 10000;
}

.footer-consent-link {
  appearance: none;
  background: none;
  border: 0;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-size: var(--text-sm);
  margin: 0;
  padding: 0;
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 0.2em;
}

.footer-consent-link:hover,
.footer-consent-link:focus-visible {
  text-decoration-color: currentColor;
}

@media (max-width: 480px) {
  .klaro .cookie-notice:not(.cookie-modal-notice) .cn-body {
    padding: 1rem 1.25rem;
  }
}