/* Restyles the Superset / infocompliance cookieconsent banner (injected at
   runtime via GTM from fe.sitedataprocessing.com) to match the Finsweet
   cookie modal this site used on Webflow.

   The vendor stylesheet loads async from their CDN and may land after this
   file, so the overrides below are !important by necessity. Selectors track
   the vendor's markup:
     .cc-window > span.cc-message (+ a.cc-link) + div.cc-compliance > a.cc-deny, a.cc-allow
   The vendor swaps .cc-banner for .cc-floating at narrow widths, so these
   selectors deliberately key off .cc-window alone and cover both.
   If the vendor changes that structure this file stops applying and the
   banner reverts to their default yellow bar. It fails visible, not broken.

   BUG FIXED HERE: the first version of this file made .cc-window a
   full-width bar pinned to bottom:24px with z-index:2147483647. The footer
   is the last thing on every page, so a user scrolled to the bottom - which
   is exactly where the footer's Terms/Privacy/GDPR/CDPA/Opt-Out links and
   social icons live - had this banner sitting directly on top of them,
   eating every click, on every page, for any visitor who hadn't yet
   accepted/declined. Confirmed with elementFromPoint at the real coordinates
   of each footer link on dev.humantic.ai: all five legal links and two of
   three social icons resolved to .cc-window instead of the link underneath.

   Fix: stop spanning the width of the page. Anchor a compact card in the
   bottom-right corner instead, with enough clearance above the viewport
   floor that it never reaches the footer's last row even when the user is
   scrolled to the true bottom of the page (position:fixed is viewport-
   relative, and the footer's last row - shared across every page - sits in
   a roughly constant band near the bottom of the viewport once you can't
   scroll further). Verified empirically post-fix, not just reasoned about:
   see the verification note in the PR/commit this change ships in. */

.cc-window {
  /* card: compact corner toast, not a full-width bar */
  position: fixed !important;
  left: auto !important;
  right: 20px !important;
  bottom: 20px !important;
  transform: none !important;
  width: 380px !important;
  max-width: calc(100% - 40px) !important;
  box-sizing: border-box !important;
  background: #fff !important;
  color: #000 !important;
  border: 1px solid rgba(17, 10, 51, .08) !important;
  border-radius: 12px !important;
  box-shadow: 0 18px 48px rgba(17, 10, 51, .16) !important;
  padding: 20px !important;
  font-family: Manrope, Arial, sans-serif !important;
  /* layout: stacked, not a row - a 380px card can't fit message + two
     buttons on one line */
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 16px !important;
  flex-wrap: nowrap !important;
  z-index: 999999 !important;
}

/* message column, with the "Cookie settings" title the vendor markup lacks */
.cc-window .cc-message {
  flex: 1 1 auto !important;
  margin: 0 !important;
  font-size: 15px !important;
  line-height: 21px !important;
  color: #000 !important;
  font-family: Manrope, Arial, sans-serif !important;
}

.cc-window .cc-message::before {
  content: "Cookie settings";
  display: block;
  margin-bottom: 6px;
  padding-left: 32px;
  min-height: 24px;
  line-height: 24px;
  font-size: 20px;
  font-weight: 600;
  color: #000;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='%23E8A33D' stroke-width='1.6' d='M21.5 12a9.5 9.5 0 1 1-9.9-9.49 3.5 3.5 0 0 0 4.2 4.2 3.5 3.5 0 0 0 3.4 3.4c.7.4 1.6.9 2.3 1.89Z'/%3E%3Ccircle cx='9' cy='10' r='1.2' fill='%23E8A33D'/%3E%3Ccircle cx='14' cy='15' r='1.2' fill='%23E8A33D'/%3E%3Ccircle cx='8.5' cy='15.5' r='1' fill='%23E8A33D'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 24px 24px;
}

.cc-window .cc-link,
.cc-window .cc-link:hover {
  color: #110a33 !important;
  opacity: 1 !important;
  text-decoration: underline !important;
  padding: 0 !important;
  font-weight: 600 !important;
}

/* buttons */
.cc-window .cc-compliance {
  flex: 0 0 auto !important;
  display: flex !important;
  flex-direction: row-reverse !important; /* Allow (primary) sits left of Decline */
  align-items: center !important;
  gap: 12px !important;
}

.cc-window .cc-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  padding: 12px 22px !important;
  border-radius: 100px !important;
  font-family: Manrope, Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: background-color .18s ease, color .18s ease !important;
  flex: 0 0 auto !important;
  max-width: none !important;
  min-width: 0 !important;
  border: 1px solid transparent !important;
}

.cc-window .cc-btn.cc-allow {
  background: #ffc61e !important;
  color: #040e19 !important;
  border-color: transparent !important;
}
.cc-window .cc-btn.cc-allow:hover { background: #f0b400 !important; }

.cc-window .cc-btn.cc-deny {
  background: transparent !important;
  color: #110a33 !important;
  border: 1px solid #110a33 !important;
}
.cc-window .cc-btn.cc-deny:hover {
  background: #110a33 !important;
  color: #fff !important;
}

@media (max-width: 860px) {
  /* A bottom-anchored sheet was tried here first and rejected: on mobile the
     footer's legal-links row stacks vertically and occupies far more of the
     viewport height than on desktop, so ANY bottom-anchored card tall enough
     to be legible re-creates the same click-blocking bug on that row -
     verified with elementFromPoint, not assumed. Terms/Privacy/GDPR/CDPA all
     resolved to .cc-window instead of the link underneath.

     Fix: anchor to the TOP instead. The navbar (.navbar.w-nav) is
     position:fixed at 90px tall on every page (shared header partial,
     confirmed on both a migrated and a legacy page) and never moves with
     scroll. The footer only enters the viewport when scrolled to the very
     bottom of the page, at which point the TOP of the viewport shows
     mid-page content, never the footer - so a top-anchored card can never
     collide with it, at any scroll position, without needing to reason
     about footer height per page. */
  .cc-window {
    top: 106px !important;
    bottom: auto !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: none !important;
    align-items: stretch !important;
    gap: 14px !important;
    padding: 18px !important;
  }
  .cc-window .cc-compliance { width: 100% !important; }
  .cc-window .cc-btn { flex: 1 1 0 !important; }
}

/* revoke handle ("Cookie Policy" tab) the vendor pins bottom-left once a
   choice has been made */
.cc-revoke {
  background: #fff !important;
  color: #110a33 !important;
  border: 1px solid rgba(17, 10, 51, .12) !important;
  border-bottom: none !important;
  border-radius: 8px 8px 0 0 !important;
  box-shadow: 0 -4px 16px rgba(17, 10, 51, .1) !important;
  font-family: Manrope, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 8px 16px !important;
  text-decoration: none !important;
}
.cc-revoke:hover { background: #f7f5ff !important; text-decoration: none !important; }

/* -------------------------------------------------------------------
   Klaro (cdn.kiprotect.com) - a THIRD cookie consent widget, injected
   by GTM on a subset of legacy pages (about, library, resources, new,
   comparison/* at minimum - GTM path-based triggers, not tied to any
   page template in this repo, so the exact set can change without a
   code change here). Independent of the Finsweet banner removed
   earlier and the Superset banner restyled above; this file did not
   originally touch it because it never appeared on the pages that
   prompted this file (home, miia).

   Found via a full-site crawl after the Superset banner turned out to
   be blocking every footer link: #klaro-cookie-notice is a real,
   visible, fixed bottom-left card (400x393 unstyled) that reproduces
   the identical bug - at true page-scroll-bottom its box overlaps the
   footer's Terms of Service link and the social icons. Confirmed with
   elementFromPoint hit-testing on /about, /library, /resources,
   /comparison/crystal-knows-alternative, /comparison/ibm-watson-alternative.

   Same fix as Superset: shrink into a compact corner card, positioned
   clear of the footer, restyled to match rather than left as the
   vendor default so the two banners don't look like they belong to
   different sites. */

#klaro-cookie-notice {
  position: fixed !important;
  left: auto !important;
  right: 20px !important;
  bottom: 20px !important;
  top: auto !important;
  width: 360px !important;
  max-width: calc(100% - 40px) !important;
  box-sizing: border-box !important;
  background: #fff !important;
  border: 1px solid rgba(17, 10, 51, .08) !important;
  border-radius: 12px !important;
  box-shadow: 0 18px 48px rgba(17, 10, 51, .16) !important;
  padding: 20px !important;
  font-family: Manrope, Arial, sans-serif !important;
  color: #000 !important;
  z-index: 999999 !important;
}

#klaro-cookie-notice .cn-body { position: relative !important; }

#klaro-cookie-notice h2 {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: #000 !important;
  margin: 0 0 10px !important;
  padding-right: 28px !important;
  line-height: 1.3 !important;
}

#klaro-cookie-notice p {
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: rgba(0, 0, 0, .65) !important;
  margin: 0 0 14px !important;
}

#klaro-cookie-notice .cb-policy {
  color: #110a33 !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}

#klaro-cookie-notice .consent-banner-close {
  position: absolute !important;
  top: -2px !important;
  right: 0 !important;
  background: none !important;
  border: none !important;
  color: rgba(0, 0, 0, .45) !important;
  cursor: pointer !important;
  padding: 4px !important;
}

#klaro-cookie-notice .cn-buttons {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
}

#klaro-cookie-notice .cm-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  padding: 12px 20px !important;
  border-radius: 100px !important;
  font-family: Manrope, Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  border: 1px solid transparent !important;
  cursor: pointer !important;
  order: 1 !important;
}

#klaro-cookie-notice .cm-btn-success {
  background: #ffc61e !important;
  color: #040e19 !important;
}
#klaro-cookie-notice .cm-btn-success:hover { background: #f0b400 !important; }

#klaro-cookie-notice .cm-btn-danger {
  background: transparent !important;
  color: #110a33 !important;
  border-color: #110a33 !important;
  order: 2 !important;
}
#klaro-cookie-notice .cm-btn-danger:hover {
  background: #110a33 !important;
  color: #fff !important;
}

#klaro-cookie-notice .cm-customize-link {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: rgba(0, 0, 0, .55) !important;
  text-decoration: underline !important;
  order: 3 !important;
  flex-basis: 100% !important;
}

@media (max-width: 860px) {
  /* Same reasoning as the Superset mobile fix directly above: a
     bottom-anchored card tall enough to be legible collides with the
     footer's stacked legal links on mobile, so anchor to the top below
     the fixed navbar instead. */
  #klaro-cookie-notice {
    top: 106px !important;
    bottom: auto !important;
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: none !important;
  }
  #klaro-cookie-notice .cm-btn { flex: 1 1 0 !important; }
}
