/* Klaro consent UI restyled to match DreiAI's design tokens (sand/petrol/coral, DM Sans / Plus Jakarta Sans).
   Klaro reads its palette from CSS custom properties (var(--green1, #hex) etc.) — overriding the
   variables beats fighting the library's own injected <style> tag on load order/specificity.
   Accept and decline stay the same size/weight/radius (only fill vs. outline differs) — required by
   the Austrian DSB's equal-prominence rule for consent banners. */

:root {
  --dark1: #2B2B2B;   /* headings/body text */
  --dark2: #6C6A63;   /* secondary text */
  --dark3: #6C6A63;
  --light1: #FAF7F0;  /* notice/modal background */
  --light2: #D9D2C0;  /* borders */
  --light3: #D9D2C0;
  --white2: #E7E1D3;  /* toggle-off track */
  --white3: #E7E1D3;
  --green1: #0F3D4A;  /* accept button / toggle-on */
  --green2: #16505F;
  --green3: #0F3D4A;
  --blue1: #B0512F;   /* links ("learn more") */
  --blue2: #E07A5F;
  --font-family: 'DM Sans', 'Helvetica Neue', Arial, sans-serif;
}

.cookie-notice, .cm-modal.cm-klaro {
  font-family: 'DM Sans', 'Helvetica Neue', Arial, sans-serif !important;
}

.cookie-notice {
  border-top: 1px solid #D9D2C0 !important;
  box-shadow: 0 -8px 28px rgba(43,43,43,.10) !important;
}
.cookie-notice .cn-body { font-size: 14.5px !important; line-height: 1.55 !important; }

/* .cn-ok is a WRAPPER (link + .cn-buttons), not a button — reset it, don't paint it. */
.cookie-notice .cn-ok {
  background: transparent !important;
  color: inherit !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
}
.cookie-notice .cn-buttons { display: flex !important; gap: 10px !important; }

/* Buttons: identical padding/radius/weight for accept and decline — visual weight must match. */
.cookie-notice .cn-decline,
.cookie-notice .cm-btn-success,
.cm-modal .cm-btn {
  font-family: 'Plus Jakarta Sans', 'Avenir Next', 'Segoe UI', sans-serif !important;
  font-weight: 700 !important;
  font-size: 14.5px !important;
  border-radius: 999px !important;
  padding: 12px 22px !important;
  border: 1.5px solid #0F3D4A !important;
  min-height: 44px !important;
  box-shadow: none !important;
}
.cookie-notice .cm-btn-success {
  background: #0F3D4A !important;
  color: #F4F0E5 !important;
}
.cookie-notice .cn-decline {
  background: transparent !important;
  color: #0F3D4A !important;
}

.cm-modal.cm-klaro { border-radius: 20px !important; border: 1px solid #D9D2C0 !important; }
.cm-modal .cm-btn-success { background: #0F3D4A !important; color: #F4F0E5 !important; border-color: #0F3D4A !important; }
.cm-modal .cm-btn-success-var,
.cm-modal .cm-btn-danger,
.cm-modal .cm-btn.cn-decline { background: transparent !important; color: #0F3D4A !important; border-color: #0F3D4A !important; }
.cm-modal .cm-powered-by { display: none !important; }