/* ============================================================
   lrg-portal.js — shared portal behaviors for all LRG apps
   v1.0.8 · 2026-07-26 · ship alongside lrg.css at /lrg-assets/
   (v1.0.8: fix "Sign out" — the old /outpost.goauthentik.io/sign_out link
   crashes with a 502 on this Authentik instance (server-side bug, no log
   line even emitted); point it at the real global invalidation flow
   instead, which was confirmed working.)
   (v1.0.7: "My Contacts" universal search group — live FUB lookup for
   the signed-in agent's own book via the gated /api/search/contacts
   proxy; non-linked users just get no group. Opens in a new tab.)
   (v1.0.6: permanent "Getting started" link in the account sections)
   (v1.0.5: clicking the header logo returns to the Launchpad from any
   app page; no-op on the Launchpad itself)
   (v1.0.4: env-aware app links — team-hosted apps use host-relative hrefs
   on team./team-qa. so QA stays in QA; other hosts still link prod.
   Re-engagement deep-links /webhook/reengage, valid on both envs)
   (v1.0.1: group hierarchy — admins⊃all, team-lead/recruiting⊃staff)
   (v1.0.2: `accountLink` apps (My Profile) render in the account rows of
   the apps-launcher menu, not the tile grid — see LRG.apps + buildAppsMenu)
   (v1.0.3: P2 — auto-register live Docs/Agents search providers on
   team./team-qa. hosts against the gated /api/search/* proxy endpoints)
   Provides: theme init/toggle · identity (whoami) · app registry
   · apps-launcher menu · universal search (browse-on-focus, New
   badges, grouped results) · account links.
   Usage (backslashes only escape the tag for safe inlining):
     <script>window.LRG_WHOAMI='/whoami';<\/script>  (optional override)
     <script src="/lrg-assets/lrg-portal.js"><\/script>
     <script>LRG.initHeader({currentApp:'cadence'});<\/script>
   Identity comes ONLY from the SSO-gated /whoami endpoint (Caddy
   injects X-Authentik-* — never trust client-supplied identity).
   ============================================================ */
(function () {
  "use strict";

  var LRG = (window.LRG = window.LRG || {});

  /* Team-apps base: on the team hosts (prod team. and team-qa.) links are
     host-relative so each environment stays self-contained; on any other
     host (docs., people., ...) they point at prod. */
  var TEAM = /^team(-qa)?\./.test(location.hostname) ? "" : "https://team.loyaltyrealtygroup.com";

  /* ---- registry ------------------------------------------------ */
  /* Access truth mirrors Caddy/Authentik enforcement (see
     team-portal/design-system/DEPLOY-P0-P1.md for divergences from
     the mockup registry, confirmed against the live Caddyfile). */
  LRG.apps = [
    { id: "dashboard", name: "Agent Dashboard", desc: "Your book at a glance",
      href: TEAM + "/agent-dashboard",
      groups: ["staff"], icon: ["M3 3h8v10H3zM13 3h8v6h-8zM13 11h8v10h-8zM3 15h8v6H3z"] },
    { id: "cadence", name: "Cadence", desc: "Lead follow-up audits",
      href: TEAM + "/fub-audit",
      groups: ["staff"], icon: ["M9 11l3 3 6-6", "M20 12v7a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h10"] },
    { id: "profile", name: "My Profile", desc: "Your contact & licensing",
      // Repointed into People's My Profile tab 2026-07-26 -- profile-app
      // itself is UNCHANGED and still running (Email Signature's headshot
      // lookup and the launchpad's onboarding-tour-pill check both still
      // depend on it directly; see people-app/DEPLOY.md before touching it).
      href: TEAM + "/people#my-profile",
      groups: ["staff"], isNew: true, accountLink: true,
      icon: ["M4 20c0-3.3 3.6-6 8-6s8 2.7 8 6", { t: "c", cx: 12, cy: 8, r: 4 }] },
    { id: "signature", name: "Email Signature", desc: "Build your branded signature",
      // Repointed into People's My Signature tab 2026-07-27 (D-009: the
      // signature app is now a pure render+copy tab, zero inputs -- every
      // field it used to ask for is authored in My Profile instead).
      // team-signature-confirm itself is UNTOUCHED and still running --
      // same parallel-front-door transition as My Profile/profile-app.
      href: TEAM + "/people#my-signature",
      groups: ["staff"],
      icon: [{ t: "r", x: 3, y: 5, w: 18, h: 14, rx: 2 }, "M3 7l9 6 9-6"] },
    { id: "roster", name: "Team Roster", desc: "Directory & contacts",
      href: TEAM + "/roster",
      groups: ["staff"],
      icon: [{ t: "c", cx: 9, cy: 8, r: 3.2 }, "M3 19c0-2.8 2.7-5 6-5s6 2.2 6 5", { t: "c", cx: 17.5, cy: 9, r: 2.6 }, "M21 18c0-2.2-1.8-4-4-4"] },
    { id: "reengage", name: "Client Re-engagement", desc: "Win-back worklist",
      href: TEAM + "/webhook/reengage",
      groups: ["admins"], gated: "Admins", isNew: true,
      icon: ["M3 12a9 9 0 1 0 3-6.7", "M3 4v4h4", "M12 8v4l3 2"] },
    { id: "kb", name: "Knowledge Base", desc: "Runbooks & guides (BookStack)",
      href: "https://docs.loyaltyrealtygroup.com",
      groups: ["staff"],
      icon: ["M4 5a2 2 0 0 1 2-2h8l4 4v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2z", "M8 8h6M8 12h8M8 16h5"] },
    { id: "people", name: "People", desc: "Recruiting, roster & your profile",
      href: TEAM + "/people",
      groups: ["staff"], isNew: true,
      // Design bundle's own app-people.svg is a heart shape -- inconsistent
      // with every sibling icon (profile/roster are literal person glyphs) --
      // almost certainly an asset-export mismatch. Substituted a person+plus
      // glyph in the same stroke style pending a real icon from Javi.
      icon: [{ t: "c", cx: 9, cy: 8, r: 3.3 }, "M2 20c0-3.2 3.1-5.6 7-5.6s7 2.4 7 5.6", "M18 8v6", "M15 11h6"] },
    { id: "nocodb", name: "Roster DB (raw)", desc: "Admin escape hatch — NocoDB",
      href: "https://people.loyaltyrealtygroup.com",
      groups: ["admins"], gated: "Admins",
      icon: [{ t: "r", x: 4, y: 4, w: 16, h: 16, rx: 2 }, "M4 10h16M10 10v10"] },
    { id: "launchpad-admin", name: "Launchpad Links", desc: "Manage link sections & shortcuts",
      href: TEAM + "/launchpad-admin",
      groups: ["admins"], gated: "Admins",
      icon: ["M10 14a4 4 0 0 0 6 .5l3-3a4 4 0 0 0-5.5-5.8L12 7", "M14 10a4 4 0 0 0-6-.5l-3 3a4 4 0 0 0 5.5 5.8L12 17"] },
    { id: "n8n", name: "Team n8n", desc: "Automation workflows",
      href: "https://n8n.loyaltyrealtygroup.com",
      groups: ["admins"], gated: "Admins",
      icon: [{ t: "c", cx: 6, cy: 12, r: 2.4 }, { t: "c", cx: 18, cy: 6, r: 2.4 }, { t: "c", cx: 18, cy: 18, r: 2.4 }, "M8.2 11 15.8 6.8M8.2 13l7.6 4.2"] },
    { id: "status", name: "System Status", desc: "Uptime monitor",
      href: "https://status.loyaltyrealtygroup.com",
      groups: ["admins"], gated: "Admins",
      icon: ["M3 12h4l2 6 4-14 2 8h6"] }
  ];

  /* Fallback only — the live source of truth is the "Launchpad Links" NocoDB
     table, served via /webhook/launchpad-links and fetched into LRG.linkCats
     below (LRG.linksReady). This array renders only if that fetch fails, so
     the launchpad/header search never go blank on an n8n hiccup. Manage the
     live data at /launchpad-admin (admins), not here. */
  LRG.linkCatsFallback = [
    { name: "Education", links: [
      { name: "Zillow Academy", host: "academy.zillowgroup.com", badge: "ZA", href: "https://academy.zillowgroup.com/learn/signin" },
      { name: "Ylopo Training", host: "loyaltyrealtygroup.com/tools", badge: "Y", href: "https://www.loyaltyrealtygroup.com/tools" },
      { name: "Nebraska Realty Resource", host: "realtorresource.info", badge: "NR", href: "https://realtorresource.info/dashboard" }
    ]},
    { name: "MLS", links: [
      { name: "GPRMLS (Paragon)", host: "gprmls.paragonrels.com", badge: "GP", href: "https://gprmls.paragonrels.com/" },
      { name: "Southwest Iowa MLS", host: "swi.flexmls.com", badge: "SW", href: "https://swi.flexmls.com/ticket" },
      { name: "RPR", host: "narrpr.com", badge: "RP", href: "https://www.narrpr.com/home" },
      { name: "ShowingTime", host: "showingtime.com", badge: "ST", href: "https://agent.showingtime.com/" }
    ]},
    { name: "Zillow", links: [
      { name: "Zillow", host: "zillow.com", badge: "Z", href: "https://www.zillow.com/" },
      { name: "Premier Agent", host: "zillow.com/premier-agent", badge: "PA", href: "https://www.zillow.com/premier-agent/premium-profile/" },
      { name: "Zillow Pro (ShowCase)", host: "app.zillow-workspace.com", badge: "ZP", href: "https://app.zillow-workspace.com/" }
    ]},
    { name: "Tools", links: [
      { name: "Follow Up Boss", host: "followupboss.com", badge: "FUB", href: "https://nebraskarealty3.followupboss.com/2/" },
      { name: "cal.novacat.cc", host: "scheduling", badge: "CAL", href: "https://cal.novacat.cc/" }
    ]}
  ];
  LRG.linkCats = LRG.linkCatsFallback;

  /* Live link sections, fetched from the "Launchpad Links" n8n workflow
     (backed by NocoDB, editable at /launchpad-admin). searchLocal() and the
     launchpad's own render() both read LRG.linkCats fresh on every call, so
     reassigning it here is all that's needed for the update to reach every
     portal page's header search as well as the launchpad grid — no changes
     needed to searchProviders/attachSearch. On fetch failure, LRG.linkCats
     simply keeps LRG.linkCatsFallback's value (set just above). */
  LRG.linksReady = fetch(TEAM + "/webhook/launchpad-links", { credentials: "same-origin" })
    .then(function (r) { if (!r.ok) throw new Error(r.status); return r.json(); })
    .then(function (d) { if (d && Array.isArray(d.sections)) LRG.linkCats = d.sections; })
    .catch(function () { /* keep LRG.linkCatsFallback */ });

  LRG.accountLinks = [
    { name: "Getting started", desc: "Guided portal setup — take it anytime",
      href: TEAM + "/onboarding", badge: "GO" },
    { name: "Account & security", desc: "Password, MFA, sessions (Authentik)",
      href: "https://portal.loyaltyrealtygroup.com/if/user/", badge: "AK" },
    { name: "Sign out", desc: "End your session everywhere",
      href: "https://portal.loyaltyrealtygroup.com/flows/-/default/invalidation/", badge: "→" }
  ];

  /* ---- identity ------------------------------------------------ */
  LRG.whoamiUrl = window.LRG_WHOAMI || "/whoami";

  function roleFromGroups(groups) {
    if (groups.indexOf("admins") !== -1) return "Admin";
    if (groups.indexOf("team-lead") !== -1) return "Team Lead";
    if (groups.indexOf("recruiting") !== -1 || groups.indexOf("recruiter") !== -1) return "Recruiter";
    return "Agent";
  }

  /* Group hierarchy (PORTAL-DESIGN §5): staff is the baseline every team
     member has; team-lead and recruiting are staff-plus; admins see all.
     Authentik memberships are literal (an admin need not be in `staff`),
     so expand before filtering tiles/menu/search. NOTE: forward-auth
     sessions cache group claims — Authentik group changes appear only
     after sign-out/sign-in. */
  function expandGroups(groups) {
    var g = groups.slice();
    var has = function (x) { return g.indexOf(x) !== -1; };
    if (has("admins")) ["staff", "team-lead", "recruiting", "recruiter"].forEach(function (x) { if (!has(x)) g.push(x); });
    if (has("team-lead") && !has("staff")) g.push("staff");
    if ((has("recruiting") || has("recruiter")) && !has("staff")) g.push("staff");
    // Javi split agents out of "staff" 2026-07-26 for the People app's role
    // model -- exact literal group name unconfirmed ("agent" per chat,
    // "agents" was this repo's working assumption before that), so both are
    // accepted here. Without this, that split would silently unpublish every
    // staff-gated tile (Agent Dashboard, Cadence, Email Signature, Roster,
    // People) from every agent's launchpad the moment they're moved, not just
    // People -- this keeps "staff" meaning "any team member" for tile
    // visibility, same as team-lead/recruiting above, while People's OWN
    // internal tabs still tell staff and agent apart via its finer-grained
    // role resolution.
    if ((has("agents") || has("agent")) && !has("staff")) g.push("staff");
    return g;
  }

  var idResolve;
  LRG.identity = null;
  LRG.ready = new Promise(function (res) { idResolve = res; });

  function finishIdentity(id) {
    LRG.identity = id;
    idResolve(id);
    document.dispatchEvent(new CustomEvent("lrg:identity", { detail: id }));
  }

  (function fetchIdentity() {
    // Local preview fallback: ?role=agent|team-lead|recruiter|admin
    var m = location.search.match(/[?&]role=(agent|team-lead|recruiter|admin)/);
    fetch(LRG.whoamiUrl, { credentials: "same-origin" })
      .then(function (r) { if (!r.ok) throw 0; return r.json(); })
      .then(function (j) {
        var groups = String(j.groups || "").split(/[|,]/).map(function (s) { return s.trim(); }).filter(Boolean);
        finishIdentity({
          email: j.email || "", name: j.name || j.username || "", username: j.username || "",
          groups: expandGroups(groups.length ? groups : ["staff"]),
          role: roleFromGroups(groups),
          firstName: (j.name || j.username || "there").split(" ")[0]
        });
      })
      .catch(function () {
        var previews = {
          "agent": { name: "Preview Agent", groups: ["staff"] },
          "team-lead": { name: "Preview Lead", groups: ["staff", "team-lead"] },
          "recruiter": { name: "Preview Recruiter", groups: ["staff", "recruiting"] },
          "admin": { name: "Preview Admin", groups: ["staff", "team-lead", "recruiting", "admins"] }
        };
        var p = previews[(m && m[1]) || "agent"];
        finishIdentity({ email: "", name: p.name, username: "", groups: p.groups,
          role: roleFromGroups(p.groups), firstName: p.name.split(" ")[0], preview: true });
      });
  })();

  LRG.canSee = function (app, groups) {
    return app.groups.some(function (g) { return groups.indexOf(g) !== -1; });
  };

  /* ---- theme --------------------------------------------------- */
  var THEME_KEY = "lrg-theme";
  function applyTheme(t) {
    document.documentElement.setAttribute("data-theme", t);
    var btn = document.getElementById("theme-btn");
    if (btn) btn.innerHTML = t === "dark" ? "&#9728;" : "&#9790;";
  }
  (function initTheme() {
    var saved = null;
    try { saved = localStorage.getItem(THEME_KEY); } catch (e) {}
    var sys = window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)");
    applyTheme(saved || (sys && sys.matches ? "dark" : "light"));
    if (sys && sys.addEventListener) sys.addEventListener("change", function (e) {
      var s = null; try { s = localStorage.getItem(THEME_KEY); } catch (err) {}
      if (!s) applyTheme(e.matches ? "dark" : "light"); // follow system until user chooses
    });
  })();
  /* ---- logo → launchpad ---------------------------------------- */
  (function wireLogos() {
    if (location.pathname === "/" || location.pathname === "/index.html") return; // already home
    var logos = document.querySelectorAll(".lrg-logo");
    for (var i = 0; i < logos.length; i++) (function (el) {
      el.style.cursor = "pointer";
      el.setAttribute("role", "link");
      el.setAttribute("tabindex", "0");
      el.setAttribute("aria-label", (el.getAttribute("aria-label") || "Loyalty Realty Group") + " — back to the Team Portal");
      el.title = "Back to the Team Portal";
      function go() { location.href = TEAM + "/"; }
      el.addEventListener("click", go);
      el.addEventListener("keydown", function (e) {
        if (e.key === "Enter" || e.key === " ") { e.preventDefault(); go(); }
      });
    })(logos[i]);
  })();

  LRG.toggleTheme = function () {
    var next = document.documentElement.getAttribute("data-theme") === "dark" ? "light" : "dark";
    applyTheme(next);
    try { localStorage.setItem(THEME_KEY, next); } catch (e) {}
  };

  /* ---- svg helpers --------------------------------------------- */
  function svgIcon(parts, size) {
    var s = '<svg width="' + (size || 24) + '" height="' + (size || 24) +
      '" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">';
    parts.forEach(function (p) {
      if (typeof p === "string") s += '<path d="' + p + '"/>';
      else if (p.t === "c") s += '<circle cx="' + p.cx + '" cy="' + p.cy + '" r="' + p.r + '"/>';
      else if (p.t === "r") s += '<rect x="' + p.x + '" y="' + p.y + '" width="' + p.w + '" height="' + p.h + '" rx="' + (p.rx || 0) + '"/>';
    });
    return s + "</svg>";
  }
  LRG.svgIcon = svgIcon;

  function esc(s) {
    return String(s).replace(/[&<>"']/g, function (c) {
      return { "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" }[c];
    });
  }
  LRG.esc = esc;

  /* ---- apps launcher menu -------------------------------------- */
  function buildAppsMenu(container, currentApp, groups) {
    var vis = LRG.apps.filter(function (a) { return LRG.canSee(a, groups) && !a.accountLink; });
    var acctApps = LRG.apps.filter(function (a) { return LRG.canSee(a, groups) && a.accountLink; });
    var html = '<div class="lrg-eyebrow">Your apps</div><div class="lrg-app-grid">';
    vis.forEach(function (a) {
      html += '<a class="lrg-app-tile" href="' + esc(a.href) + '"' +
        (a.id === currentApp ? ' aria-current="page"' : "") + ">" +
        svgIcon(a.icon, 22) + "<span>" + esc(a.name) + "</span></a>";
    });
    html += '</div><div style="border-top:1px solid var(--lrg-border);margin:10px -12px 0;padding:8px 6px 0"><div class="lrg-eyebrow">Account</div>';
    acctApps.forEach(function (a) {
      html += '<a class="lrg-uresult" href="' + esc(a.href) + '">' +
        '<span class="lrg-uresult__icon">' + svgIcon(a.icon, 15) + '</span>' +
        '<span class="lrg-uresult__label">' + esc(a.name) +
        (a.isNew ? ' <span class="lrg-badge lrg-badge--brand">New</span>' : "") + "</span></a>";
    });
    LRG.accountLinks.forEach(function (l) {
      html += '<a class="lrg-uresult" href="' + esc(l.href) + '">' +
        '<span class="lrg-uresult__icon">' + esc(l.badge) + '</span>' +
        '<span class="lrg-uresult__label">' + esc(l.name) + "</span></a>";
    });
    html += "</div>";
    container.innerHTML = html;
  }

  /* ---- universal search ---------------------------------------- */
  /* Providers for async groups (P2): set window.LRG.searchProviders =
     { agents: q => Promise<[{name,sub,href}]>, docs: q => Promise<[...]> } */
  LRG.searchProviders = LRG.searchProviders || {};

  /* Auto-register the live Docs/Agents/Contacts/Recruits providers on portal
     hosts. All hit gated same-origin endpoints; the server injects the
     trusted X-Authentik-Email/Groups, the client never sees a token. Docs/
     Agents/Contacts proxy Caddy -> team-n8n; Recruits proxies Caddy ->
     people-app directly (reuses people-app's own RECRUITING_TAB_ROLES
     instead of a duplicated n8n branch -- see DECISIONS.md D-010). Errors
     are swallowed by the caller (group just doesn't render). */
  if (/^team(-qa)?\.loyaltyrealtygroup\.com$/.test(location.hostname)) {
    ["docs", "agents", "contacts", "recruits"].forEach(function (key) {
      LRG.searchProviders[key] = function (q) {
        return fetch("/api/search/" + key + "?q=" + encodeURIComponent(q), { credentials: "same-origin" })
          .then(function (r) { if (!r.ok) throw 0; return r.json(); });
      };
    });
  }

  function resultRow(r) {
    return '<a class="lrg-uresult" href="' + esc(r.href) + '"' + (r.newTab ? ' target="_blank" rel="noopener"' : "") + ">" +
      '<span class="lrg-uresult__icon">' + (r.iconHtml || (r.badge ? esc(r.badge) : "")) + "</span>" +
      '<span class="lrg-uresult__label">' + esc(r.name) +
      (r.isNew ? ' <span class="lrg-badge lrg-badge--brand">New</span>' : "") +
      (r.sub ? ' <span class="lrg-uresult__sub">' + esc(r.sub) + "</span>" : "") +
      "</span></a>";
  }

  function searchLocal(q, groups) {
    q = q.toLowerCase();
    var out = { apps: [], links: [] };
    LRG.apps.forEach(function (a) {
      if (!LRG.canSee(a, groups)) return;
      if (!q || (a.name + " " + a.desc).toLowerCase().indexOf(q) !== -1)
        out.apps.push({ name: a.name, sub: a.desc, href: a.href, iconHtml: svgIcon(a.icon, 16), isNew: !!a.isNew });
    });
    LRG.linkCats.forEach(function (c) {
      c.links.forEach(function (l) {
        if (q && (l.name + " " + l.host + " " + c.name).toLowerCase().indexOf(q) === -1) return;
        out.links.push({ name: l.name, sub: c.name + " · " + l.host, href: l.href, badge: l.badge, newTab: true });
      });
    });
    return out;
  }

  function attachSearch(input, clearBtn, groups) {
    var wrap = input.parentElement;
    var panel = document.createElement("div");
    panel.className = "lrg-usearch__panel";
    panel.hidden = true;
    panel.setAttribute("role", "listbox");
    wrap.appendChild(panel);
    var timer = null, seq = 0;

    function close() { panel.hidden = true; }
    function render(q) {
      var my = ++seq;
      var local = searchLocal(q, groups);
      var html = "";
      if (local.apps.length) {
        html += '<div class="lrg-usearch__group">Apps</div>' + local.apps.map(resultRow).join("");
      }
      if (!q) { // browse-on-focus: apps only
        panel.innerHTML = html || '<div class="lrg-empty" style="padding:18px">No apps available.</div>';
        panel.hidden = false;
        return;
      }
      if (local.links.length) {
        html += '<div class="lrg-usearch__group">Links &amp; Tools</div>' + local.links.map(resultRow).join("");
      }
      panel.innerHTML = html || '<div class="lrg-empty" style="padding:18px">No matches for “' + esc(q) + '”.</div>';
      panel.hidden = false;
      // async groups (Agents, Docs, Contacts, Recruiting) — appended when providers exist (P2)
      [["agents", "Agents"], ["docs", "Docs"], ["contacts", "My Contacts"], ["recruits", "Recruiting"]].forEach(function (pair) {
        var fn = LRG.searchProviders[pair[0]];
        if (typeof fn !== "function") return;
        Promise.resolve(fn(q)).then(function (rows) {
          if (my !== seq || !rows || !rows.length) return;
          panel.innerHTML += '<div class="lrg-usearch__group">' + pair[1] + "</div>" +
            rows.map(function (r) { r.newTab = pair[0] === "docs" || pair[0] === "contacts"; return resultRow(r); }).join("");
        }).catch(function () {});
      });
    }

    input.addEventListener("focus", function () { render(input.value.trim()); });
    input.addEventListener("input", function () {
      if (clearBtn) clearBtn.hidden = !input.value;
      clearTimeout(timer);
      timer = setTimeout(function () { render(input.value.trim()); }, 140);
    });
    input.addEventListener("keydown", function (e) {
      var items = panel.querySelectorAll(".lrg-uresult");
      var idx = Array.prototype.indexOf.call(items, document.activeElement);
      if (e.key === "Escape") { close(); input.blur(); }
      else if (e.key === "ArrowDown" && items.length) { e.preventDefault(); items[0].focus(); }
      else if (e.key === "Enter" && items.length === 1) { items[0].click(); }
    });
    panel.addEventListener("keydown", function (e) {
      var items = panel.querySelectorAll(".lrg-uresult");
      var idx = Array.prototype.indexOf.call(items, document.activeElement);
      if (e.key === "ArrowDown") { e.preventDefault(); (items[idx + 1] || items[0]).focus(); }
      else if (e.key === "ArrowUp") { e.preventDefault(); (items[idx - 1] || input).focus(); }
      else if (e.key === "Escape") { close(); input.focus(); }
    });
    if (clearBtn) clearBtn.addEventListener("click", function () {
      input.value = ""; clearBtn.hidden = true; input.focus(); render("");
    });
    document.addEventListener("click", function (e) {
      if (!wrap.contains(e.target)) close();
    });
  }

  /* ---- header init --------------------------------------------- */
  LRG.initHeader = function (opts) {
    opts = opts || {};
    var themeBtn = document.getElementById("theme-btn");
    if (themeBtn) themeBtn.addEventListener("click", LRG.toggleTheme);
    applyTheme(document.documentElement.getAttribute("data-theme") || "light");

    LRG.ready.then(function (id) {
      var appsBtn = document.getElementById("apps-btn");
      if (appsBtn) {
        var holder = appsBtn.parentElement;
        var menu = document.createElement("div");
        menu.className = "lrg-menu";
        menu.hidden = true;
        holder.appendChild(menu);
        buildAppsMenu(menu, opts.currentApp, id.groups);
        appsBtn.setAttribute("aria-expanded", "false");
        appsBtn.addEventListener("click", function (e) {
          e.stopPropagation();
          menu.hidden = !menu.hidden;
          appsBtn.setAttribute("aria-expanded", String(!menu.hidden));
        });
        document.addEventListener("click", function (e) {
          if (!holder.contains(e.target)) { menu.hidden = true; appsBtn.setAttribute("aria-expanded", "false"); }
        });
        document.addEventListener("keydown", function (e) {
          if (e.key === "Escape") { menu.hidden = true; appsBtn.setAttribute("aria-expanded", "false"); }
        });
      }
      var input = document.getElementById("usearch");
      if (input) attachSearch(input, document.getElementById("usearch-clear"), id.groups);
    });
  };
})();