(function() {
  // Config
  const DELIM = '|';
  const lang = (document.documentElement.getAttribute('data-lang') || '').toLowerCase(); // "en" | "fr"
  const isFR = lang.startsWith('fr');
  const idx = isFR ? 1 : 0;
  const localeTag = isFR ? 'fr-CA' : 'en-CA';

  // Optional hard skips (add selectors as needed)
  const SKIP_SELECTORS = [];
  const shouldSkip = (sel) => sel.hasAttribute('data-bilang-skip') || SKIP_SELECTORS.some(q => sel.matches(q));

  // Pick EN/FR side from "EN|FR"
  const pickSide = (t) => {
    if (!t || t.indexOf(DELIM) === -1) return t;
    const parts = t.split(DELIM);
    return (parts[idx] ?? parts[0]).trim();
  };

  // Localize + sort one <select>
  function localizeSelect(sel) {
    // Skip if already processed for this lang
    if (shouldSkip(sel) || sel.dataset.bilangLang === lang) return;

    const options = Array.from(sel.options);
    let changed = false;

    for (const opt of options) {
      const next = pickSide(opt.text);
      if (next !== opt.text) { opt.text = next; changed = true; }
    }

    if (changed) {
      // Keep first placeholder/disabled at top; sort the rest
      const sticky = (options[0] && (!options[0].value || options[0].disabled)) ? [options[0]] : [];
      const rest = sticky.length ? options.slice(1) : options;

      const prev = sel.value;
      rest.sort((a, b) => a.text.localeCompare(b.text, localeTag, { sensitivity: 'base' }));

      sel.innerHTML = '';
      [...sticky, ...rest].forEach(o => sel.add(o));
      sel.value = prev;
    }

    // Tag with processed language (prevents redoing on the same page/lang)
    sel.dataset.bilangLang = lang;
  }

  // Apply to a subtree
  function apply(root = document) {
    root.querySelectorAll('select').forEach(localizeSelect);
  }

  // Initial run + dynamic content
  document.addEventListener('DOMContentLoaded', () => {
    apply(document);
    new MutationObserver(muts => {
      for (const m of muts) {
        m.addedNodes?.forEach(n => {
          if (n.nodeType === 1 && (n.matches?.('select') || n.querySelector?.('select'))) apply(n);
        });
      }
    }).observe(document.body, { childList: true, subtree: true });
  });

  function localizeLookup(field){
    if (shouldSkip(field)) return;
    field.dataset.bilangLang = lang;
    field.value =  pickSide(field.value);    
  }

  let lookups = document.querySelectorAll('.cell.lookup > .control > .input-group > input:first-child');
  lookups.forEach(localizeLookup);
  lookups.forEach((lookup)=>{lookup.nextSibling.addEventListener('change',(e)=>{localizeLookup(e.target.previousSibling)})});

  // Optional API
  window.BilingualLookups = { apply };
})();