/* WelcomeSign skin for the Klaro consent manager.
   klaro.min.css / klaro.min.js stay vendored verbatim. Klaro only *reads* these
   custom properties (with fallbacks), so defining them on .klaro wins regardless
   of load order, including against the <style> the JS build injects at runtime.
   Served from welcomesign.com and linked cross-origin by app.welcomesign.com. */
.klaro {
  --font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --title-font-family: 'Nunito', 'DM Sans', sans-serif;
  --border-radius: 14px;
  --green1: #F26B21;   /* primary button (brand orange) */
  --green2: #D95A14;   /* primary button, hover */
  --green3: #B94A0E;
  --dark1: #1E1E2E;    /* notice + modal background (brand navy) */
  --dark2: #33334A;
  /* --dark3 is only used for service descriptions; light so it isn't navy-on-navy. */
  --dark3: #D9D2C7;
  --light1: #F6EFE6;   /* text (brand cream) */
  --light2: #EFE4D6;
  --light3: #D9D2C7;
  --blue1: #F26B21;
  --blue2: #D95A14;
  --button-text-color: #fff;
  --notice-max-width: 420px;
  --box-shadow-color: rgba(20, 20, 31, .35);
}
.klaro .cookie-notice:not(.cookie-modal-notice) { border: 1px solid rgba(255, 255, 255, .12); }
.klaro .cookie-notice .cn-ok .cm-btn,
.klaro .cookie-modal .cm-btn { font-weight: 700; border-radius: 999px; }
.klaro .cookie-notice .cm-btn.cm-btn-danger,
.klaro .cookie-modal .cm-btn.cm-btn-danger { background-color: #33334A; }
.klaro .cookie-notice .cm-btn.cm-btn-lern-more,
.klaro .cookie-notice .cm-btn.cm-btn-info { background-color: transparent; border: 1px solid rgba(255, 255, 255, .35); }
.klaro .cookie-modal .cm-powered-by,
.klaro .cookie-notice .cm-powered-by { display: none; }
.klaro .cookie-modal a,
.klaro .cookie-notice a { color: #F5A524; }
.klaro .cookie-modal .cm-modal .cm-header h1.title,
.klaro .cookie-notice h2 { font-family: var(--title-font-family); font-weight: 800; }

/* The Cathybot launcher is fixed bottom-right on both welcomesign.com and the
   app, exactly where Klaro puts its notice, and swallows clicks on Allow.
   Desktop: float the notice bottom-left. Mobile (full-width notice): keep the
   button row clear of the launcher. */
.klaro {
  --notice-left: 20px;
  --notice-right: auto;
}
@media (max-width: 1023px) {
  .klaro .cookie-notice:not(.cookie-modal-notice) .cn-ok { padding-right: 72px; }
}