/**
 * CSS custom property carrying the height of the sticky mobile CTA bar.
 *
 * MobileCta publishes its measured height here while the bar is on screen, and
 * CookieConsentBanner offsets itself by it so the two never overlap. Measured
 * rather than hardcoded — the bar's label wraps differently between locales.
 *
 * The banner references this name literally in its Tailwind class, because
 * arbitrary values must be static at build time. Keep the two in sync.
 */
export const MOBILE_CTA_HEIGHT_VAR = "--mobile-cta-height";

/**
 * CSS custom property carrying the height of the cookie consent banner.
 *
 * CookieConsentBanner publishes its measured height plus OVERLAY_GAP_PX while
 * it is on screen, and globals.css reserves that much space at the bottom of
 * the page on small screens. Without it the banner sat directly on top of the
 * signup form's terms checkbox and Create Account button on a phone, so a
 * first-time visitor could not submit the form at all.
 *
 * Referenced literally in globals.css, because CSS cannot read this constant.
 * Keep the two in sync.
 */
export const COOKIE_BANNER_HEIGHT_VAR = "--cookie-banner-height";

/** Gap left above and below the banner, in px. Matches its 1rem bottom offset. */
export const OVERLAY_GAP_PX = 32;