/* Consent-banner theme. Loaded after /vendor/klaro.css on every page.
   The color/radius tokens are duplicated from the page CSS (Klaro is a separate stylesheet). */
:root{
  --k-cream-2:#ECE3D2; --k-card:#FFFFFF; --k-nav-dark:#14181F; --k-ink:#1A1F2E; --k-sec:#5E626C;
  --k-line:rgba(26,31,46,.08); --k-line-2:rgba(26,31,46,.12); --k-blue:#2F58A8; --k-teal:#0B7F72;
  --k-r-card:28px; --k-r-pill:999px; --k-sh-lg:0 20px 60px rgba(20,24,31,.18);
}
.klaro .cookie-notice, .klaro .cookie-modal .cm-modal{font-family:'Poppins',-apple-system,sans-serif !important; background:var(--k-card) !important; color:var(--k-ink) !important}
.klaro .cookie-notice:not(.cookie-modal-notice){left:auto !important; right:16px !important; bottom:16px !important; width:auto !important; max-width:520px !important; border:1px solid var(--k-line-2) !important; border-radius:var(--k-r-card) !important; box-shadow:var(--k-sh-lg) !important; padding:22px 24px !important}
.klaro .cookie-notice .cn-body{margin:0 !important; padding:0 !important}
.klaro .cookie-notice .cn-body p, .klaro .cookie-modal p, .klaro .cookie-modal .cm-body{color:var(--k-sec) !important; font-size:14px !important; line-height:1.55 !important}
/* klaro.css:254 paints p, strong, h1, h2, ul and li inside the notice var(--light1,#fafafa) —
   its stock banner is dark; ours is white. The line above reclaimed the paragraph and nothing
   else, so {purposes}, which klaro renders as a <strong>, sat at #fafafa on white: about
   1.04:1, invisible. Reclaim that whole selector list, not only the element in use today. */
.klaro .cookie-notice strong, .klaro .cookie-notice h1, .klaro .cookie-notice h2,
.klaro .cookie-notice ul, .klaro .cookie-notice li{color:var(--k-ink) !important}
.klaro .cookie-notice .cn-ok{padding-top:16px !important; display:flex !important; gap:12px !important; flex-wrap:wrap !important; align-items:center !important}
.klaro a, .klaro .cm-link, .klaro .cn-learn-more{color:var(--k-blue) !important; font-weight:600 !important}
.klaro .cm-btn{border-radius:var(--k-r-pill) !important; font-family:'Poppins',sans-serif !important; font-weight:600 !important; padding:11px 20px !important; font-size:14.5px !important; background:#EFEBE2 !important; color:var(--k-ink) !important}
.klaro .cm-btn.cm-btn-success,.klaro .cm-btn.cm-btn-accept-all,.klaro .cm-btn.cm-btn-accept{background:var(--k-nav-dark) !important; color:#fff !important}
.klaro .cookie-modal .cm-header h1,.klaro .cookie-modal .cm-header .title{color:var(--k-ink) !important; font-family:'Poppins',sans-serif !important}
.klaro .cookie-modal .cm-bg{background:rgba(20,24,31,.5) !important}
.klaro .cm-list-input:checked + .cm-list-label .slider{background-color:var(--k-teal) !important}
/* width:auto is not cosmetic. klaro.css:611 sets the notice position:fixed with width:100%,
   and when left, width and right are all non-auto CSS drops `right` — so a banner pinned to
   both edges is really one viewport wide starting at the left inset, hanging off the right.
   Releasing width is what lets left and right both hold. */
@media (max-width:560px){ .klaro .cookie-notice:not(.cookie-modal-notice){left:12px !important; right:12px !important; width:auto !important; max-width:none !important} }
