/* --------------------------------------------------------------------------
   Consent banner (Complianz 7), set up 06.11.2026. Complianz declares its
   variables on :root (uploads/complianz/css/banner-1-optin.css); declared on
   the banner itself they take the theme tokens. Position, texts and categories
   are set in Complianz, colours, type, radii and states here. Accept and deny
   look the same, so neither is pushed. Loaded after site.css by
   inc/einwilligung.php, with its own version like wp.css.
   -------------------------------------------------------------------------- */
:root body .cmplz-cookiebanner {
  --cmplz_banner_background_color: var(--tj-c-white);
  --cmplz_banner_border_color: var(--tj-line);
  --cmplz_banner_border_radius: var(--tj-r-inner);
  --cmplz_text_color: var(--tj-text-strong);
  --cmplz_hyperlink_color: var(--tj-text-strong);
  --cmplz_title_font_size: var(--tj-body);
  --cmplz_text_font_size: var(--tj-label);
  --cmplz_text_line_height: calc(var(--tj-label) * 1.5);
  --cmplz_link_font_size: var(--tj-label);
  --cmplz_category_body_font_size: var(--tj-label);
  --cmplz_category_header_title_font_size: var(--tj-label);
  --cmplz_category_header_active_font_size: var(--tj-label);
  --cmplz_category_header_always_active_color: var(--tj-text-strong);
  --cmplz_button_font_size: var(--tj-btn);
  --cmplz_button_border_radius: var(--tj-r-btn);
  --cmplz_button_accept_background_color: var(--tj-accent);
  --cmplz_button_accept_border_color: var(--tj-accent);
  --cmplz_button_accept_text_color: var(--tj-text-strong);
  --cmplz_button_deny_background_color: var(--tj-accent);
  --cmplz_button_deny_border_color: var(--tj-accent);
  --cmplz_button_deny_text_color: var(--tj-text-strong);
  --cmplz_button_settings_background_color: transparent;
  --cmplz_button_settings_border_color: var(--tj-c-gold-line);
  --cmplz_button_settings_text_color: var(--tj-text-strong);
  --cmplz_slider_active_color: var(--tj-c-ink);
  --cmplz_slider_inactive_color: var(--tj-text);
  --cmplz_slider_bullet_color: var(--tj-c-white);
  font-family: var(--tj-font);
}
/* One resting shadow; the banner is not clickable as a whole, so it does not lift on hover (Nachtrag 25 rule 1). */
:root body .cmplz-cookiebanner,
:root body .cmplz-cookiebanner.cmplz-show,
:root body .cmplz-cookiebanner.cmplz-show:hover { box-shadow: var(--tj-shadow); transition: none; }
:root body .cmplz-cookiebanner .cmplz-title { font-weight: 600; }
:root body .cmplz-cookiebanner .cmplz-message { color: var(--tj-text); }
/* ds-allow-hardcode:start - button and focus values as on .tj-btn and :focus-visible in site.css (min-height 51px,
   border 2px, outline 2px); site.css has no tokens for them. */
:root body .cmplz-cookiebanner button { font-family: inherit; }
:root body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn {
  min-height: 51px; border-width: 2px; font-weight: 600; line-height: var(--tj-btn-lh);
  transition: background-color var(--tj-t-ui) var(--tj-ease), border-color var(--tj-t-ui) var(--tj-ease),
              transform var(--tj-t-press) var(--tj-ease);
}
:root body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn:active { transform: scale(.97); }
@media (hover: hover) and (pointer: fine) {
  :root body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-accept:hover,
  :root body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-deny:hover { background-color: var(--tj-accent-hover); border-color: var(--tj-accent-hover); }
  :root body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-view-preferences:hover,
  :root body .cmplz-cookiebanner .cmplz-buttons .cmplz-btn.cmplz-save-preferences:hover { border-color: var(--tj-accent-hover); }
}
:root body .cmplz-cookiebanner .cmplz-btn:focus-visible,
:root body .cmplz-cookiebanner .cmplz-link:focus-visible,
:root body .cmplz-cookiebanner .cmplz-close:focus-visible,
:root body .cmplz-cookiebanner .cmplz-category-toggle:focus-visible { outline: 2px solid var(--tj-focus); outline-offset: 2px; }
:root body .cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox:focus + .cmplz-label::before { box-shadow: 0 0 0 2px var(--tj-focus); }
/* ds-allow-hardcode:end */
:root body .cmplz-cookiebanner .cmplz-categories .cmplz-category { background-color: var(--tj-c-paper); }
/* Cookie policy and privacy policy are the same page (wizard, 06.11.2026): the link appears once. */
:root body .cmplz-cookiebanner .cmplz-documents li:has(> .cookie-statement) { display: none; }
/* Complianz turns the box into a full-width sheet at 768 px; only its top corners stay round there. */
@media (max-width: 768px) {
  :root body .cmplz-cookiebanner { border-radius: var(--tj-r-inner) var(--tj-r-inner) 0 0; }
}

/* Complianz names its category switches with WordPress' .screen-reader-text; the theme has no such rule, so the name
   showed next to the switch and pushed it up. Visually hidden like .tj-hidden in site.css, still read out. */
:root body .cmplz-cookiebanner .screen-reader-text {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* "Cookies" in the footer (inc/fuss.php): Complianz opens its settings only from button.cmplz-manage-consent, so it
   is a button that looks and moves like the legal links next to it (site.css, footer and effect palette H3). */
:root body .site-footer__legal-links button.cmplz-manage-consent {
  padding: 0; border: 0; background: none; font: inherit; cursor: pointer;
  color: var(--tj-text-inverse-2); transition: color var(--tj-t-hover) var(--tj-ease);
}
@media (hover: hover) and (pointer: fine) {
  :root body .site-footer__legal-links button.cmplz-manage-consent:hover { color: var(--tj-accent); }
}
:root body .site-footer__legal-links button.cmplz-manage-consent:focus-visible { outline: 2px solid var(--tj-focus-inverse); outline-offset: 4px; } /* ds-allow-hardcode: focus ring as in site.css */
@media screen and (prefers-reduced-motion: no-preference) {
  :root.fx .site-footer__legal-links button.cmplz-manage-consent {
    padding-bottom: var(--tj-fx-strich-luft);
    background: linear-gradient(var(--tj-accent), var(--tj-accent)) no-repeat 0 100% / 0 var(--tj-fx-strich);
    transition: color var(--tj-t-hover) var(--tj-ease), background-size var(--tj-fx-t-zurueck) var(--tj-ease);
  }
}
@media screen and (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  :root.fx .site-footer__legal-links button.cmplz-manage-consent:is(:hover, :focus-visible) {
    background-size: 100% var(--tj-fx-strich);
    transition: color var(--tj-t-hover) var(--tj-ease), background-size var(--tj-fx-t-hin) var(--tj-ease);
  }
}
