/* ============================================================ COOKIE CONSENT — Complianz banner restyle (.tjw brand) ------------------------------------------------------------ Complianz v7 reads all of its colours/sizes from a set of `--cmplz_*` custom properties declared on :root. We re-declare them here on `:root:root` (specificity 0,2,0) so we always beat the plugin's own :root block AND the inline :root{} that the admin "Look & Feel" tab would emit — regardless of load order. The handful of things the variables don't cover (font-family, button hover states, the banner shadow) are written as normal rules prefixed with `html ` so they out-specify the plugin's `.cmplz-cookiebanner ...` element rules without !important. Palette (mirrors section-patterns.css): Mist Grey #f4f4f3 banner ground Light Grey #eae9e6 panels Onyx Black #161616 text + primary button Garnet #5b1f23 links + accept-hover hairline #d8d7d3 / #c9c8c4 Fonts: Cormorant Garamond (title) / Instrument Sans (body+UI). These load site-wide via the single in (see greyd_child_font_assets() in functions.php), so the banner — which can appear on any page — always has them. The former per-file @import was removed in the 2026-06 font unify. ============================================================ */ :root:root { /* shell */ --cmplz_banner_width: 600px; --cmplz_banner_background_color: #f4f4f3; /* Mist Grey */ --cmplz_banner_border_color: #d8d7d3; --cmplz_banner_border_width: 1px; --cmplz_banner_border_radius: 2px; --cmplz_banner_margin: 16px; /* text */ --cmplz_text_color: #161616; /* Onyx */ --cmplz_hyperlink_color: #5b1f23; /* Garnet links */ --cmplz_title_font_size: 22px; --cmplz_text_font_size: 13px; --cmplz_link_font_size: 12px; --cmplz_category_body_font_size: 12px; --cmplz_category_header_title_font_size: 14px; --cmplz_category_header_active_font_size: 12px; --cmplz_category_header_always_active_color: #5b1f23; /* buttons — accept (solid ink) and deny given equal visual weight per GDPR no-nudging guidance; preferences is quieter */ --cmplz_button_border_radius: 2px; --cmplz_button_font_size: 13px; --cmplz_button_accept_background_color: #161616; --cmplz_button_accept_border_color: #161616; --cmplz_button_accept_text_color: #f4f4f3; --cmplz_button_deny_background_color: transparent; --cmplz_button_deny_border_color: #161616; --cmplz_button_deny_text_color: #161616; --cmplz_button_settings_background_color: transparent; --cmplz_button_settings_border_color: #c9c8c4; --cmplz_button_settings_text_color: #4a4a48; /* preference toggles */ --cmplz_slider_active_color: #161616; --cmplz_slider_inactive_color: #c9c8c4; --cmplz_slider_bullet_color: #f4f4f3; /* local font stacks (banner sits outside the .tjw scope) */ --tjw-cc-serif: "Cormorant Garamond", Georgia, serif; --tjw-cc-sans: "Instrument Sans", "Inter", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; } /* ---- typography -------------------------------------------- */ html .cmplz-cookiebanner, html .cmplz-cookiebanner .cmplz-message, html .cmplz-cookiebanner .cmplz-categories, html .cmplz-cookiebanner .cmplz-links, html #cmplz-manage-consent .cmplz-manage-consent { font-family: var(--tjw-cc-sans); } html .cmplz-cookiebanner .cmplz-header .cmplz-title { font-family: var(--tjw-cc-serif); font-weight: 500; letter-spacing: 0; line-height: 1.15; } html .cmplz-cookiebanner .cmplz-message { line-height: 1.6; } /* ---- shell polish ------------------------------------------ */ html .cmplz-cookiebanner { box-shadow: 0 6px 28px rgba(22, 22, 22, 0.12); } /* ---- buttons ----------------------------------------------- */ html .cmplz-cookiebanner .cmplz-buttons .cmplz-btn { font-family: var(--tjw-cc-sans); font-weight: 500; letter-spacing: 0.02em; text-transform: none; transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; } /* accept: ink -> garnet on hover */ html .cmplz-cookiebanner .cmplz-btn.cmplz-accept:hover, html .cmplz-cookiebanner .cmplz-btn.cmplz-accept:focus-visible { background-color: #5b1f23; border-color: #5b1f23; color: #f4f4f3; } /* deny: outline -> filled ink on hover (equal weight to accept) */ html .cmplz-cookiebanner .cmplz-btn.cmplz-deny:hover, html .cmplz-cookiebanner .cmplz-btn.cmplz-deny:focus-visible { background-color: #161616; border-color: #161616; color: #f4f4f3; } /* preferences (view / save): quiet outline that firms up on hover */ html .cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences:hover, html .cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences:focus-visible, html .cmplz-cookiebanner .cmplz-btn.cmplz-save-preferences:hover, html .cmplz-cookiebanner .cmplz-btn.cmplz-save-preferences:focus-visible { border-color: #161616; color: #161616; } /* ---- close icon -------------------------------------------- */ html .cmplz-cookiebanner .cmplz-close { color: #161616; }