(function () {
  'use strict';

  const container = document.getElementById('filterContainer');
  if (!container) return;
  const bankAccount = container.dataset.bankAccount || '';

  const modal     = document.getElementById('qrModal');
  const titleEl   = document.getElementById('qrTitle');
  const imgEl     = document.getElementById('qrImg');
  const accountEl = document.getElementById('qrAccount');
  const amountEl  = document.getElementById('qrAmount');
  const messageEl = document.getElementById('qrMessage');
  if (!modal || !titleEl || !imgEl || !accountEl || !amountEl || !messageEl) return;

  // Convert "YYYY-MM" → "MM/YYYY"; "+"-joined ranges converted piece-wise.
  // Mirrors templates/adults.html showPayQR logic.
  function toCzechMonth(rawMonth) {
    return rawMonth.split('+')
      .map(function (p) { return p.replace(/^(\d{4})-(\d{2})$/, '$2/$1'); })
      .join('+');
  }

  function showQR(name, amount, month, rawMonth) {
    var numericMonth = toCzechMonth(rawMonth);
    var message = name + ': ' + numericMonth;

    titleEl.innerText   = 'Payment for ' + month;
    accountEl.innerText = bankAccount;
    amountEl.innerText  = amount;
    messageEl.innerText = message;

    imgEl.src = '/qr?'
      + 'account=' + encodeURIComponent(bankAccount)
      + '&amount=' + encodeURIComponent(amount)
      + '&message=' + encodeURIComponent(message);

    modal.classList.add('active');
  }

  function closeQR() {
    modal.classList.remove('active');
  }

  document.addEventListener('click', function (ev) {
    var btn = ev.target.closest('.pay-btn');
    if (!btn) return;
    ev.preventDefault();
    showQR(
      btn.dataset.name,
      btn.dataset.amount,
      btn.dataset.month,
      btn.dataset.rawMonth
    );
  });

  document.addEventListener('keydown', function (e) {
    if (e.key === 'Escape' && modal.classList.contains('active')) closeQR();
  });
}());