/*
 * CookieYes cookie banner + Cookie Settings dialog, styled to the Oct 26
 * 2026 legal pages handoff ("Cookie Banner and Settings" mock): a white
 * 12px card, 17px title, 14px text, Accept All and Reject Optional the same
 * size, Settings as a text button. The wording lives in CookieYes, not here.
 *
 * Loaded on every page by cookie-banner.php. Every selector carries a
 * `cky-` class. CookieYes injects the markup after load, so WP Rocket's
 * Remove Unused CSS would drop these rules; cookie-banner.php keeps this
 * file out of it (a /cky-/ safelist didn't work).
 * !important where CookieYes writes inline style attributes (its colours)
 * or its own injected <style id="cky-style">.
 */

/* ── Banner ─────────────────────────────────────────────────────────── */

.cky-consent-container {
  width: 420px !important;
  max-width: calc(100vw - 32px) !important;
}

.cky-consent-container .cky-consent-bar {
  padding: 20px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 12px 32px rgba(29, 41, 57, 0.16) !important;
  font-family: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
}

.cky-consent-container .cky-title {
  margin: 0 0 12px !important;
  font-family: inherit !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  color: #070c11 !important;
}

.cky-consent-container .cky-notice-des,
.cky-consent-container .cky-notice-des p {
  margin: 0 !important;
  font-family: inherit !important;
  font-size: 14px !important;
  line-height: 21px !important;
  color: #4a5568 !important;
}

.cky-consent-container .cky-notice-des a {
  color: #2964ae !important;
}

.cky-consent-container .cky-notice-btn-wrapper {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
}

/* ── Buttons (banner and dialog) ────────────────────────────────────── */

.cky-consent-container .cky-btn,
.cky-modal .cky-btn {
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1.5px solid #2964ae !important;
  border-radius: 6px !important;
  font-family: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 35px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  opacity: 1 !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

/* Accept All: the filled button, first. */
.cky-consent-container .cky-btn-accept,
.cky-modal .cky-btn-accept {
  order: 1 !important;
  border-color: #2964ae !important;
  background: #2964ae !important;
  color: #fff !important;
}

.cky-consent-container .cky-btn-accept:hover,
.cky-modal .cky-btn-accept:hover {
  border-color: #0068d9 !important;
  background: #0068d9 !important;
}

/* Reject Optional (and Save in the dialog): same size and weight, outlined. */
.cky-consent-container .cky-btn-reject,
.cky-modal .cky-btn-reject,
.cky-modal .cky-btn-preferences {
  order: 2 !important;
  border-color: #2964ae !important;
  background: #fff !important;
  color: #2964ae !important;
}

.cky-consent-container .cky-btn-reject:hover,
.cky-modal .cky-btn-reject:hover,
.cky-modal .cky-btn-preferences:hover {
  background: #edf2fe !important;
}

/* Settings: a text button, last. */
.cky-consent-container .cky-btn-customize {
  order: 3 !important;
  padding: 0 6px !important;
  border-color: transparent !important;
  background: transparent !important;
  color: #2964ae !important;
}

.cky-consent-container .cky-btn-customize:hover {
  text-decoration: underline !important;
}

/* US opt-out banner: "Do Not Sell or Share My Personal Information" is a
   long text link, so it must wrap rather than run past the card. */
.cky-consent-container .cky-btn-do-not-sell {
  order: 3 !important;
  height: auto !important;
  padding: 0 !important;
  border-color: transparent !important;
  background: transparent !important;
  color: #2964ae !important;
  line-height: 21px !important;
  white-space: normal !important;
  text-align: left !important;
}

.cky-consent-container .cky-btn-do-not-sell:hover {
  text-decoration: underline !important;
}

.cky-consent-container .cky-btn:focus-visible,
.cky-modal .cky-btn:focus-visible,
.cky-modal .cky-btn-close:focus-visible {
  outline: 2px solid #2964ae !important;
  outline-offset: 2px !important;
}

/* ── Cookie Settings dialog ─────────────────────────────────────────── */

.cky-modal .cky-preference-center {
  border: 0 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 12px 32px rgba(29, 41, 57, 0.16) !important;
  font-family: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !important;
  color: #1d2939 !important;
}

.cky-modal .cky-preference-header,
.cky-modal .cky-preference-content-wrapper {
  border-bottom-color: #e2e5e8 !important;
}

.cky-modal .cky-preference-title {
  font-family: inherit !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #070c11 !important;
}

.cky-modal .cky-preference-content-wrapper,
.cky-modal .cky-preference-content-wrapper p {
  font-family: inherit !important;
  font-size: 14px !important;
  line-height: 21px !important;
  color: #4a5568 !important;
}

.cky-modal .cky-show-desc-btn,
.cky-modal .cky-preference-content-wrapper a {
  color: #2964ae !important;
}

.cky-modal .cky-accordion {
  border-bottom-color: #e2e5e8 !important;
}

.cky-modal .cky-accordion-btn {
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #070c11 !important;
}

.cky-modal .cky-accordion-header-des,
.cky-modal .cky-accordion-header-des p {
  font-family: inherit !important;
  font-size: 13px !important;
  line-height: 19px !important;
  color: #4a5568 !important;
}

.cky-modal .cky-always-active {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #2964ae !important;
}

/* Category toggles: 44×24 pill, grey off, brand blue on. */
.cky-modal .cky-switch input[type="checkbox"] {
  background: #e5e7eb !important;
}

.cky-modal .cky-switch input[type="checkbox"]:checked {
  background: #2964ae !important;
}

.cky-modal .cky-footer-wrapper {
  border-top-color: #e2e5e8 !important;
}

.cky-modal .cky-prefrence-btn-wrapper,
.cky-modal .cky-opt-out-btn-wrapper {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

/* US opt-out pop-up: Save filled and first, Cancel outlined. */
.cky-modal .cky-btn-confirm {
  order: 1 !important;
  border-color: #2964ae !important;
  background: #2964ae !important;
  color: #fff !important;
}

.cky-modal .cky-btn-confirm:hover {
  border-color: #0068d9 !important;
  background: #0068d9 !important;
}

.cky-modal .cky-btn-cancel {
  order: 2 !important;
  border-color: #2964ae !important;
  background: #fff !important;
  color: #2964ae !important;
}

.cky-modal .cky-btn-cancel:hover {
  background: #edf2fe !important;
}

.cky-modal .cky-opt-out-checkbox-label {
  font-family: inherit !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #070c11 !important;
}

.cky-modal .cky-opt-out-checkbox:checked {
  border-color: #2964ae !important;
  background-color: #2964ae !important;
}

/* ── Phones (≤767px): an inset card, Accept and Reject side by side ── */

@media (max-width: 767px) {
  .cky-consent-container {
    right: 16px !important;
    bottom: 16px !important;
    left: 16px !important;
    width: auto !important;
    max-width: none !important;
  }

  .cky-consent-container .cky-consent-bar {
    border-radius: 12px !important;
  }

  /* CookieYes squeezes the message into a small scroll box on phones and
     indents the title and message 24px past the buttons. */
  .cky-consent-container .cky-notice-des {
    max-height: none !important;
    overflow: visible !important;
  }

  .cky-consent-container .cky-title,
  .cky-consent-container .cky-notice-des {
    padding: 0 !important;
  }

  .cky-consent-container .cky-btn-accept,
  .cky-consent-container .cky-btn-reject {
    flex: 1 1 0 !important;
  }

  .cky-consent-container .cky-btn-customize {
    flex: 1 1 100% !important;
  }

  /* Dialog buttons: full width and stacked, easier to tap. */
  .cky-modal .cky-prefrence-btn-wrapper .cky-btn {
    flex: 0 0 auto !important;
    width: 100% !important;
  }

  .cky-modal .cky-opt-out-btn-wrapper .cky-btn {
    flex: 1 1 0 !important;
  }
}