/*!
 * static-ab — toggle + anti-flicker CSS
 * Extracted from brand-builder packages/renderer/src/landing-page-ab.ts (AB_TOGGLE_CSS).
 *
 * Load this in <head> ABOVE the ab-test.js <script> tag so it is in place
 * before first paint. Arm "a" is the zero-JS default: with JavaScript off (or
 * before it runs) the page shows arm A and hides every arm-B-only element.
 *
 * Selectors key on exactly two globals, both set by ab-test.js:
 *   :root[data-variant="a"|"b"]   — the resolved variant
 *   html.ab-js                    — "JavaScript ran" signal (reserved for future use)
 */

/* Rich-HTML arm A renders as a transparent wrapper (keeps block layout). */
[data-ab-a][data-ab-rich] { display: contents; }

/* Arm-B text/label span is hidden by default (arm A wins with no JS). */
[data-ab-b] { display: none !important; }

/* When variant B is active, swap which text arm shows. */
:root[data-variant="b"] [data-ab-a] { display: none !important; }
:root[data-variant="b"] [data-ab-b]:not([data-ab-rich]) { display: inline !important; }
:root[data-variant="b"] [data-ab-b][data-ab-rich] { display: contents !important; }

/* Per-arm element visibility.
 * data-ab-only="a"  → visible in arm A, hidden in arm B
 * data-ab-only="b"  → visible in arm B, hidden in arm A (and with JS off) */
:root[data-variant="b"] [data-ab-only="a"] { display: none !important; }
:root:not([data-variant="b"]) [data-ab-only="b"] { display: none !important; }
