in layout/theme.liquid ─────────────────────────────────────────────────────────────────── */
(function() { function patchDialog(dialog) {
// Bug 1 — rename dialog from "POPUP Form" to actual heading text
var h1 = dialog.querySelector('h1, [role="heading"]'); if (h1) { h1.id = 'kl-dialog-title'; dialog.setAttribute('aria-labelledby', 'kl-dialog-title'); dialog.removeAttribute('aria-label'); }
// Bug 2 — move focus to heading so user hears the offer first if (h1)
{ h1.setAttribute('tabindex', '-1'); setTimeout(function() { h1.focus(); }, 50); }
// Bug 3 — close button has aria-hidden="true", remove it
var closeBtn = dialog.querySelector('.klaviyo-close-form'); if (closeBtn) closeBtn.removeAttribute('aria-hidden');
// Bug 4 — visually hidden "Please note" span is read before heading
dialog.querySelectorAll('span').forEach(function(span) { if (!span.children.length && span.textContent.includes('Please note')) { span.setAttribute('aria-hidden', 'true'); } });
// Bonus — return focus to trigger element when popup closes
var trigger = document.activeElement; if (closeBtn) { closeBtn.addEventListener('click', function() { setTimeout(function() { if (trigger) trigger.focus(); }, 100); }, { once: true }); } }
// Watch for Klaviyo injecting the dialog into the DOM
var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType !== 1) return;
// Klaviyo dialog is the added node itself or inside it
var dialog = node.getAttribute('role') === 'dialog' && node.classList.contains('kl-private-reset-css-Xuajs1') ? node : node.querySelector && node.querySelector( '[role="dialog"].kl-private-reset-css-Xuajs1' ); if (dialog) patchDialog(dialog); }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })();
