(function(){
  function qs(s,r){ return (r||document).querySelector(s); }
  function qsa(s,r){ return Array.from((r||document).querySelectorAll(s)); }

  function mount(){
    const sb = qs('#uaSb3');
    if(!sb) return;
    const isRTL = (document.documentElement.getAttribute('dir') || 'rtl').toLowerCase() !== 'ltr';
    let host = null, activeBtn = null;

    function ensureHost(){
      if(host) return host;
      host = document.createElement('div');
      host.className = 'ua-sb3-flyout-host';
      document.body.appendChild(host);
      return host;
    }
    function close(){
      if(host){ host.remove(); host = null; }
      if(activeBtn){ activeBtn.setAttribute('aria-expanded','false'); activeBtn.classList.remove('is-open'); activeBtn = null; }
      sb.classList.remove('is-open-mode');
      document.body.classList.remove('ua-mobile-sb-open');
    }
    function position(btn){
      if(!host || !btn) return;
      const br = btn.getBoundingClientRect();
      const sr = sb.getBoundingClientRect();
      const w  = host.offsetWidth || 260;
      const gap = 8;
      let left = isRTL ? (sr.left - w - gap) : (sr.right + gap);
      let top = Math.max(10, Math.min(br.top, window.innerHeight - host.offsetHeight - 10));
      if(left + w > window.innerWidth - 10) left = window.innerWidth - w - 10;
      if(left < 10) left = 10;
      host.style.left = left + 'px'; host.style.top = top + 'px';
    }

    const burger = qs('[data-ua-mobile-menu]');
    if(burger){ burger.addEventListener('click', function(e){ if(window.innerWidth <= 992){ e.preventDefault(); document.body.classList.toggle('ua-mobile-sb-open'); } }); }
    const bd = qs('.ua-sb-backdrop');
    if(bd){ bd.addEventListener('click', close); }

    // Close the mobile overlay as soon as a navigation link is selected.
    document.addEventListener('click', function(e){
      if(e.target.closest('.ua-sb3-link, .ua-sb3-item[href]')){
        setTimeout(close, 0);
      }
    }, true);

    sb.addEventListener('click', function(ev){
      const btn = ev.target.closest('[data-sb3-group]');
      if(!btn) return;
      ev.preventDefault(); ev.stopPropagation();
      const gid = btn.getAttribute('data-sb3-group');
      const tpl = document.getElementById('sb3_tpl_' + gid);
      if(!tpl) return;
      if(window.innerWidth <= 992){ document.body.classList.add('ua-mobile-sb-open'); }
      if(activeBtn === btn){ close(); return; }
      close();
      const h = ensureHost(); h.innerHTML = ''; h.appendChild(tpl.content.cloneNode(true));
      activeBtn = btn; sb.classList.add('is-open-mode'); btn.classList.add('is-open'); btn.setAttribute('aria-expanded','true');
      position(btn);
    });
    document.addEventListener('click', function(e){
      if(e.target.closest('[data-ua-mobile-menu]') || e.target.closest('#uaSb3')) return;
      close();
    });
    document.addEventListener('keydown', (e)=>{ if(e.key === 'Escape') close(); });
    window.addEventListener('resize', ()=>{ if(window.innerWidth > 992) document.body.classList.remove('ua-mobile-sb-open'); if(activeBtn) position(activeBtn); });
    window.addEventListener('scroll', ()=>{ if(activeBtn) position(activeBtn); }, {passive:true});
  }
  if(document.readyState === 'loading') document.addEventListener('DOMContentLoaded', mount);
  else mount();
})();
