/* * Matches the web app's CookieConsentBanner.vue: a bottom-fixed card, 2px * border, heavy shadow, teal primary action. The brand tokens already agree * across both properties, so these values come from the child theme's * theme.json rather than being invented here. * * NO rem UNITS ANYWHERE IN THIS FILE. The child theme redefines the root font * size to a large, viewport-dependent value (`html { font-size: var(--master-font-size) }`, * 100px falling to 80px and below — twenty-twenty-five-razor/style.css:68, :260), * and its own presets are written as fractions of it (`clamp(12px, 0.14rem, 14px)`). * So 1rem here is ~80-100px, not ~16px: `max-width: 56rem` was 4480px and read as * "no limit", and `0.8125rem` on the manage button rendered at 65px. Use px. */ :root { --rcc-teal: #007071; --rcc-ink: #3b3b3b; --rcc-surface: #ffffff; --rcc-border: #cde2e2; --rcc-radius: 12px; } .cmplz-cookiebanner { max-width: 896px; margin: 16px; border: 2px solid var(--rcc-border); border-radius: var(--rcc-radius); background: var(--rcc-surface); box-shadow: 0 25px 50px -12px rgb(0 0 0 / 25%); color: var(--rcc-ink); font-family: "Readex Pro", system-ui, sans-serif; } .cmplz-cookiebanner .cmplz-title { font-family: Raleway, system-ui, sans-serif; } .cmplz-cookiebanner .cmplz-accept { background: var(--rcc-teal); border-radius: 8px; color: #fff; } .cmplz-cookiebanner .cmplz-deny, .cmplz-cookiebanner .cmplz-save-preferences { background: transparent; border: 1px solid var(--rcc-border); border-radius: 8px; color: var(--rcc-ink); } /* * Issue #21: reopening the manager must show what was chosen and offer * withdrawal, rather than just showing "Accept" again. * * VERIFIED against the installed Complianz 7.5.0 (Task 12, Step 7): the * originally-assumed body.cmplz-status-dismissed does not exist anywhere in * Complianz. The real analogue, .cmplz-dismissed on .cmplz-cookiebanner * itself, is provably inert for this purpose: Complianz's own * cookiebanner.css hides the whole banner in that state * (".cmplz-cookiebanner.cmplz-dismissed { display: none }"), and its reopen * handler (.cmplz-manage-consent click) flips the class to cmplz-show * synchronously, before the banner repaints — identical to a first-time * visitor. Complianz has no class of its own that distinguishes "already * decided" from "never decided" while the banner is visible. * * So this keys off two classes bridge.js puts on itself (see * markRecordedState) — independent of Complianz's visibility toggle, and * independent of Complianz existing at all once it is removed: * * rcc-has-consented at least one consentable category is granted * rcc-has-declined a decision exists and refuses every one of them * * The distinction is the point. A single "a decision exists" class showed * "You have accepted cookies." to a visitor who had chosen Essential only. */ .rcc-state-notice { display: none; } body.rcc-has-consented .rcc-state-notice--accepted, body.rcc-has-declined .rcc-state-notice--declined { display: block; } /* * .cmplz-accept is never hidden. It used to be hidden whenever any decision * existed, which removed the primary route back to granting consent from the * two visitors most likely to want it: one who declined everything, and one who * granted only some categories. R3 asks the manager to reflect the current * choice and allow withdrawal — the notice above reflects it and the relabelled * deny button withdraws, so "Accept all" stays available as what it is, an * action rather than a status. * * The cmplz-deny button already performs withdrawal (Complianz's own click * handler reduces consent to essential-only), so where something has been * granted we relabel it from "Essential only" to "Withdraw consent" rather than * add a second, competing control. Two spans toggled by the same body class * keep the single cmplz-deny button and its handler untouched. Not relabelled in * the declined state: there is nothing there to withdraw. */ .rcc-deny-label--consented { display: none; } body.rcc-has-consented .cmplz-cookiebanner .rcc-deny-label--default { display: none; } body.rcc-has-consented .cmplz-cookiebanner .rcc-deny-label--consented { display: inline; } /* * R2's permanent affordance (src/Frontend/ManageConsentLink.php). Complianz's * own manage-consent tab is hidden because ours replaces it everywhere — two * buttons doing the same thing is worse than either, and only ours survives * Complianz's removal. */ #cmplz-manage-consent { display: none; } .rcc-manage-cookies { position: fixed; z-index: 9998; bottom: 0; right: 16px; margin: 0; padding: 6px 14px; border: 2px solid var(--rcc-border); border-bottom: 0; border-radius: var(--rcc-radius) var(--rcc-radius) 0 0; background: var(--rcc-surface); color: var(--rcc-ink); font-family: "Readex Pro", system-ui, sans-serif; font-size: 13px; font-weight: 400; line-height: 1.4; letter-spacing: 0; text-transform: none; cursor: pointer; } .rcc-manage-cookies:hover, .rcc-manage-cookies:focus-visible { color: var(--rcc-teal); } /* * The tab and the banner are both pinned bottom-right, so without this they sit * on top of each other for any visitor who has not decided yet. They are also * redundant together: everything the tab opens, the open banner already offers. * * Complianz does the same thing with its own button — complianz.js:1318-1321 * reveals it only as the banner is dismissed — so this follows its behaviour * rather than fighting it. * * :has() rather than a body class toggled from bridge.js. It is reactive with * no JS at all, and cmplz-show is stamped on the same element by both paths: * Complianz's own (complianz.js:1409) and the fallback banner the bridge opens * itself. A browser without :has() drops the rule and the two overlap again, * which is cosmetic — nothing stops working. * * The button carries `hidden` until bridge.js clears it with `button.hidden = * false`, an attribute rather than an inline style, so this rule still wins. */ body:has(.cmplz-cookiebanner.cmplz-show) .rcc-manage-cookies { display: none; } /* * The fallback state: bridge.js had to open a banner Complianz never * bootstrapped, so show_cookie_banner() never ran and never resolved the * {title} document links or hid the TCF-only and cookie-policy-only controls. * Left alone they render as literal "{title}" text and as links that go * nowhere, so they are hidden until Complianz itself can resolve them (which it * does from the next pageview onward, because by then a decision exists and the * adapter reports opt-in). */ body.rcc-banner-fallback .cmplz-cookiebanner .cmplz-documents, body.rcc-banner-fallback .cmplz-cookiebanner .cmplz-links, body.rcc-banner-fallback .cmplz-cookiebanner .tcf { display: none; } /* Belt and braces: Complianz's own stylesheet carries this, and in the fallback * state we cannot assume it loaded. Without it, dismissing leaves the banner up. */ .cmplz-cookiebanner.cmplz-dismissed { display: none; }