(function () {
  var doc = document;

  var wrap      = doc.querySelector('#cbt-loc, .cbt-locwrap');
  if (!wrap) {
    console.warn('[CBT LABEL TEST] No #cbt-loc / .cbt-locwrap found.');
    return;
  }

  var pill      = wrap.querySelector('.cbt-locpill');
  var labelSpan = wrap.querySelector('.cbt-loc-label');
  var lineSpan  = labelSpan ? labelSpan.querySelector('.cbt-locline') : null;
  var inlineLink = lineSpan ? lineSpan.querySelector('#cbtLocCity') : null; // the inline link
  var caretSpan  = lineSpan ? lineSpan.querySelector('.cbt-loccarat') : null;
  var cityChip   = wrap.querySelector('.cbt-loc-city.cbt-city-label');      // breadcrumb chip
  var menu       = doc.querySelector('#cbt-locmenu, .cbt-locmenu');
  var input      = doc.querySelector('#cbtLocInput, .pac-target-input');

  console.log('[CBT LABEL TEST] Elements:', {
    wrap: wrap, pill: pill, labelSpan: labelSpan, lineSpan: lineSpan,
    inlineLink: inlineLink, caretSpan: caretSpan, cityChip: cityChip,
    menu: menu, input: input
  });

  if (!pill || !labelSpan || !lineSpan || !menu || !input) {
    console.warn('[CBT LABEL TEST] Missing a required element – aborting.');
    return;
  }

  // ----- Work out the city name (Dallas, TX, etc.) -----
  var routeCity =
    wrap.getAttribute('data-city-label') ||
    (cityChip && cityChip.textContent && cityChip.textContent.trim()) ||
    (inlineLink && inlineLink.textContent && inlineLink.textContent.trim()) ||
    '';

  routeCity = routeCity.replace(/\s+/g, ' ').trim();

  // ----- Fix the label text so it is "Dallas, TX ›" on load -----

  // Ensure there is exactly ONE text node at the start: "Dallas, TX "
  var firstText = labelSpan.firstChild;
  if (!firstText || firstText.nodeType !== Node.TEXT_NODE) {
    firstText = labelSpan.insertBefore(doc.createTextNode(''), labelSpan.firstChild);
  }
  firstText.nodeValue = routeCity + ' ';

  // Remove any extra text nodes (like stray ">" etc.) after that
  var n = firstText.nextSibling;
  while (n) {
    var next = n.nextSibling;
    if (n.nodeType === Node.TEXT_NODE) {
      labelSpan.removeChild(n);
    }
    n = next;
  }

  // Make sure caret exists and is first in the line span
  if (caretSpan) {
    if (!caretSpan.textContent || !caretSpan.textContent.trim()) {
      caretSpan.textContent = '›';
    }
    if (lineSpan.firstElementChild !== caretSpan) {
      lineSpan.insertBefore(caretSpan, lineSpan.firstElementChild);
    }
  }

  // Inline link is our "Type a city" label — hide it initially
  if (inlineLink) {
    inlineLink.textContent = 'Type a city';
    inlineLink.setAttribute('aria-label', 'Type a city');
    inlineLink.style.display = 'none'; // will be shown only when dropdown is open
  }

  // Input placeholder should say "Type a city"
  input.setAttribute('placeholder', 'Type a city');

  // Hide the extra breadcrumb chip so the city only appears once
  if (cityChip) {
    cityChip.style.display = 'none';
  }

  // ----- Helpers to open/close menu and toggle "Type a city" -----

  function showInlineLabel() {
    if (inlineLink) {
      inlineLink.style.display = '';
    }
  }

  function hideInlineLabel() {
    if (inlineLink) {
      inlineLink.style.display = 'none';
    }
  }

  function positionMenu() {
    try {
      var r = pill.getBoundingClientRect();
      var minW = Math.max(320, r.width + 40);
      var left = Math.max(12, Math.min(r.left, window.innerWidth - minW - 12));
      var top  = Math.round(r.bottom + 8);

      Object.assign(menu.style, {
        position: 'fixed',
        left: left + 'px',
        top:  top  + 'px',
        minWidth: minW + 'px'
      });
    } catch (e) {
      console.warn('[CBT LABEL TEST] positionMenu failed:', e);
    }
  }

  function openMenu() {
    showInlineLabel();

    menu.hidden = false;
    menu.removeAttribute('hidden');
    menu.setAttribute('aria-hidden', 'false');
    menu.style.display   = 'block';
    menu.style.visibility = 'visible';
    menu.style.opacity    = '1';
    menu.style.zIndex     = '2147483647';

    positionMenu();

    try {
      input.focus();
      if (input.select) input.select();
    } catch (e) {}

    try {
      doc.body.setAttribute('data-cbt-loc-open', '1');
    } catch (e) {}
  }

  function closeMenu() {
    menu.style.display = 'none';
    menu.setAttribute('aria-hidden', 'true');
    hideInlineLabel();

    try {
      doc.body.removeAttribute('data-cbt-loc-open');
    } catch (e) {}

    console.log('[CBT LABEL TEST] closeMenu() called.');
  }

  // ----- Click wiring: pill, city text, caret all open dropdown -----

  function wireClick(el, name) {
    if (!el) return;
    el.addEventListener(
      'click',
      function (evt) {
        console.log('[CBT LABEL TEST]', name, 'click -> openMenu (no geo)');
        evt.preventDefault();
        evt.stopPropagation();
        evt.stopImmediatePropagation(); // block old geo handler
        openMenu();
      },
      true // capture so we run first
    );
  }

  // Clicking *anywhere* on this label row should work:
  wireClick(pill, 'pill');
  wireClick(labelSpan, 'labelSpan');
  wireClick(inlineLink, 'inlineLink');

  // Close when clicking outside pill/label/dropdown
  doc.addEventListener(
    'click',
    function (evt) {
      if (!menu || menu.style.display === 'none') return;

      if (wrap.contains(evt.target)) return; // clicks in pill/label
      if (menu.contains(evt.target)) return; // clicks in dropdown

      closeMenu();
    },
    true
  );

  // Keep dropdown positioned under the pill if the user scrolls / resizes
  window.addEventListener(
    'scroll',
    function () {
      if (menu && menu.style.display === 'block') {
        positionMenu();
      }
    },
    { passive: true }
  );
  window.addEventListener(
    'resize',
    function () {
      if (menu && menu.style.display === 'block') {
        positionMenu();
      }
    },
    { passive: true }
  );

  console.log(
    '[CBT LABEL TEST] Ready. Initial label should be "' +
      routeCity +
      ' ›"; clicking city/pill shows dropdown + reveals "Type a city".'
  );
})();