/*
   The cookie banner (Complianz free, drawn by us; inc/consent.php). It
   replaces Complianz's generated stylesheet, so the show/hide rules its
   script relies on live here too.

   From 810 a white card, square, one hairline all round, centred over the
   page, behind it the panel overlay, which also takes the clicks: the page
   waits for a choice (user, 2026-10-23). On a phone a sheet across the foot
   of the screen, a hairline along its top, no overlay: the page stays usable
   (user, 2026-11-11). Type comes from the role classes the filter adds;
   Accept all the one primary button, the full width, Cookie settings a small
   underline link under it; with the settings open, Save my choice
   (secondary) beside Accept all and Decline the link (user, 2026-11-11).
*/

.cmplz-cookiebanner {
  position: fixed;
  z-index: 150;                          /* over the header (100), under <dialog>s (top layer) */
  inset: 0;
  box-sizing: border-box;
  display: grid;
  width: min(480px, calc(100% - 2 * var(--vv-gap-20)));
  height: fit-content;
  max-height: calc(100% - 2 * var(--vv-gap-20));
  margin: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: var(--vv-gap-40);
  border: 1px solid var(--vv-color-line);
  border-radius: 0;
  background: var(--vv-color-background-highlight);
  opacity: 1;
  transition: opacity var(--vv-motion-fade-duration) var(--vv-motion-fade-easing);
}
@starting-style {
  .cmplz-cookiebanner { opacity: 0; }
}
.cmplz-cookiebanner.cmplz-dismissed { display: none; }

/* The overlay, from 810: shown with the banner, gone once a choice is made. */
@media (min-width: 810px) {
  body:has(.cmplz-cookiebanner.cmplz-show:not(.cmplz-hidden))::after {
    content: "";
    position: fixed;
    z-index: 149;
    inset: 0;
    background-color: var(--vv-color-overlay-panel);
  }
}

/* The phone sheet: full width at the foot of the screen, at most 80% of its
   height (the settings scroll inside it). */
@media (max-width: 809.98px) {
  .cmplz-cookiebanner {
    inset: auto 0 0;
    width: 100%;
    max-height: 80dvh;
    margin: 0;
    padding: var(--vv-gap-20);
    border-width: 1px 0 0;
  }
}

/* What we don't show: the logo, the close cross (a choice is required),
   the dividers, the legal and vendor links (no generated documents yet),
   the TCF button, and the floating "Manage consent" tab. */
.cmplz-cookiebanner :is(.cmplz-logo, .cmplz-close, .cmplz-divider, .cmplz-links, .cmplz-documents),
.cmplz-cookiebanner .cmplz-btn.cmplz-manage-options,
.cmplz-cookiebanner .cmplz-save-preferences,
#cmplz-manage-consent {
  display: none;
}

.cmplz-cookiebanner .cmplz-header { display: block; margin-block-end: var(--vv-gap-10); }
.cmplz-cookiebanner .cmplz-title { margin: 0; color: var(--vv-color-text-emphasised); }
.cmplz-cookiebanner .cmplz-body { display: grid; gap: var(--vv-gap-10); }
.cmplz-cookiebanner .cmplz-message p { margin: 0; }
/* The Privacy Policy and Terms links inside the message: the message's own
   type, a thin underline that takes the accent on hover, as Cookie settings
   (user, 2026-11-11). */
.cmplz-cookiebanner .cmplz-message a,
.cmplz-cookiebanner .cmplz-message a:visited {
  color: var(--vv-color-text-default);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: currentColor;
  transition: text-decoration-color var(--vv-motion-hover-duration) var(--vv-motion-hover-easing);
}
.cmplz-cookiebanner .cmplz-message a:hover { text-decoration-color: var(--vv-color-element-highlight); }
.cmplz-cookiebanner .cmplz-message a:focus-visible { outline: 2px solid var(--vv-color-focus); outline-offset: 3px; }

/* Categories: hidden until "View preferences" (the script adds .cmplz-fade-in). */
.cmplz-cookiebanner .cmplz-categories { display: none; }
.cmplz-cookiebanner .cmplz-categories.cmplz-fade-in { display: block; }
.cmplz-cookiebanner .cmplz-category { border-block-end: 1px solid var(--vv-color-line); }
/* Essential is the first row shown. */
.cmplz-cookiebanner .cmplz-category.cmplz-functional { border-block-start: 1px solid var(--vv-color-line); }
.cmplz-cookiebanner .cmplz-category-header {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: var(--vv-gap-10);
  min-height: 44px;
}
.cmplz-cookiebanner .cmplz-always-active { display: flex; align-items: center; color: var(--vv-color-text-dim); }
.cmplz-cookiebanner .cmplz-always-active .cmplz-banner-checkbox,
.cmplz-cookiebanner .cmplz-always-active label { display: none; }
.cmplz-cookiebanner .cmplz-banner-checkbox { display: flex; align-items: center; }
.cmplz-cookiebanner .cmplz-consent-checkbox {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--vv-cta-primary-bg);
  cursor: pointer;
}
.cmplz-cookiebanner .cmplz-consent-checkbox:focus-visible,
.cmplz-cookiebanner .cmplz-category-toggle:focus-visible {
  outline: 2px solid var(--vv-color-focus);
  outline-offset: 3px;
}
.cmplz-cookiebanner .cmplz-category-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--vv-color-text-default);
  cursor: pointer;
}
.cmplz-cookiebanner .cmplz-category-toggle svg {
  width: 14px;
  height: 14px;
  fill: currentColor;
  transition: transform var(--vv-motion-toggle-duration) var(--vv-motion-toggle-easing);
}
.cmplz-cookiebanner .cmplz-category-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.cmplz-cookiebanner .cmplz-description { padding-block-end: var(--vv-gap-10); }
.cmplz-cookiebanner .cmplz-description-statistics-anonymous { display: none; }
.cmplz-cookiebanner .screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* The choices: Accept all alone across the row, Cookie settings centred
   under it. Complianz's script swaps Cookie settings for Save my choice with
   an inline display when the settings open (and marks the banner
   .cmplz-categories-visible): Save my choice and Accept all then share the
   row equally, Decline centred under them. Centring keeps each link, and its
   line, to the width of its words (user, 2026-11-11). */
.cmplz-cookiebanner .cmplz-buttons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--vv-gap-10);
  margin-block-start: var(--vv-gap-25);
}
.cmplz-cookiebanner .cmplz-buttons .vv-button { width: 100%; text-align: center; }
.cmplz-cookiebanner:not(.cmplz-categories-visible) .cmplz-buttons .cmplz-deny { display: none; }
.cmplz-cookiebanner:not(.cmplz-categories-visible) .cmplz-buttons .cmplz-accept { grid-column: 1 / -1; }
.cmplz-cookiebanner .cmplz-buttons :is(.cmplz-deny, .cmplz-view-preferences) { grid-column: 1 / -1; justify-self: center; margin-block-start: var(--vv-gap-5); }

/* Cookie settings and Decline: small body text with a thin underline, the
   least emphasis on the card (user, 2026-11-11); the underline takes the
   accent on hover. 44 tall for the finger. */
.cmplz-cookiebanner button.vv-consent-link,
.cmplz-cookiebanner button.vv-consent-link:hover,
.cmplz-cookiebanner button.vv-consent-link:focus {
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--vv-color-text-default);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: currentColor;
  cursor: pointer;
  transition: text-decoration-color var(--vv-motion-hover-duration) var(--vv-motion-hover-easing);
}
.cmplz-cookiebanner button.vv-consent-link:hover { text-decoration-color: var(--vv-color-element-highlight); }
.cmplz-cookiebanner button.vv-consent-link:focus-visible { outline: 2px solid var(--vv-color-focus); outline-offset: 3px; }

/* No preference cookies on the site, so no Preferences row. */
.cmplz-cookiebanner .cmplz-category.cmplz-preferences { display: none; }