/** * Emberloom Cookie Consent — front-end theme layer. * Sits on top of the vendored vanilla-cookieconsent stylesheet. The accent * colour is injected as inline CSS custom properties by the plugin, so this * file stays static and themable. */ /** * Floating "cookie preferences" re-open button. * * The button is appended to , so themes (Elementor, etc.) apply their * global `button` rules to it — padding, line-height, min-height, appearance. * We reset those layout-critical properties with !important and centre the * icon with flexbox (not line-height), so the icon stays centred regardless of * inherited padding. Size, icon size, colour, shape and position are driven by * CSS custom properties the plugin sets inline, so they're fully editable. */ .emberloom-cc-floating-btn { position: fixed !important; bottom: var(--eml-cc-fab-bottom, 16px); z-index: 2147483645; /* Reset theme/Elementor button box model. */ box-sizing: border-box !important; width: var(--eml-cc-fab-size, 44px) !important; height: var(--eml-cc-fab-size, 44px) !important; min-width: 0 !important; min-height: 0 !important; max-width: none !important; padding: 0 !important; margin: 0 !important; border: none !important; line-height: 1 !important; -webkit-appearance: none !important; appearance: none !important; /* Centre the icon reliably. */ display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: var(--eml-cc-fab-radius, 50%); background: var(--eml-cc-floating-bg, #a218a0); color: #fff; text-align: center; cursor: pointer; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); transition: transform 0.15s ease, box-shadow 0.15s ease; } /* The icon glyph itself — sized independently of the button. */ .emberloom-cc-floating-btn > span { display: block; font-size: var(--eml-cc-fab-icon, 18px); line-height: 1; pointer-events: none; } .emberloom-cc-floating-btn:hover, .emberloom-cc-floating-btn:focus-visible { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.32); outline: none; } /* Respect the "disable animations" setting. */ .eml-cc-no-anim #cc-main *, .eml-cc-no-anim .emberloom-cc-floating-btn { transition: none !important; animation: none !important; } @media (prefers-reduced-motion: reduce) { .emberloom-cc-floating-btn { transition: none; } }