(function ($) {
  'use strict';

  var $overlay = $('#substitution-overlay');
  var $modal   = $('#substitution-modal');
  var labels   = {
    call_replace: 'Позвонить и заменить',
    no_replace:   'Не заменять',
    auto_replace: 'Не спрашивать и заменить'
  };

  /* ── Open / Close ───────────────────────────────────── */
  function openModal()  {
    $overlay.addClass('open');
    // Small delay so CSS transition fires after display:block
    requestAnimationFrame(function () {
      $modal.addClass('open');
    });
    $('body').css('overflow', 'hidden');
  }

  function closeModal() {
    $modal.removeClass('open');
    $overlay.removeClass('open');
    $('body').css('overflow', '');
  }

  $(document).on('click', '#btn-substitution-modal', function (e) {
    e.preventDefault();
    openModal();
  });

  $(document).on('click', '#substitution-modal-close, #substitution-overlay', function () {
    closeModal();
  });

  // Close on Escape
  $(document).on('keydown', function (e) {
    if (e.key === 'Escape' && $modal.hasClass('open')) {
      closeModal();
    }
  });

  /* ── Radio selection ────────────────────────────────── */
  $(document).on('change', 'input[name="substitution_type"]', function () {
    var $group = $(this).closest('.substitution-radio-group');
    $group.find('.substitution-radio-item').removeClass('active');
    $(this).closest('.substitution-radio-item').addClass('active');
  });

  /* ── Checkbox (bag options) toggle ──────────────────── */
  $(document).on('change', '.substitution-bag-item input[type="checkbox"]', function () {
    $(this).closest('.substitution-bag-item').toggleClass('active', this.checked);
  });

  /* ── Done button — save via AJAX, close ─────────────── */
  $(document).on('click', '#substitution-modal-done', function () {
    var data = {
      action:       'matreshka_save_substitution',
      security:     matreshka_ajax.nonce,
      substitution: $('input[name="substitution_type"]:checked').val() || 'call_replace',
      comment:      $('#substitution-comment').val(),
      less_bags:    $('input[name="less_bags"]').is(':checked') ? 1 : 0,
      vegs_in_bags: $('input[name="vegs_in_bags"]').is(':checked') ? 1 : 0
    };

    // Update label on the trigger button immediately
    $('#substitution-current-label').text(labels[data.substitution] || labels.call_replace);

    $.post(matreshka_ajax.ajax_url, data);
    closeModal();
  });

  /* ── Re-bind after WC AJAX cart refresh ─────────────── */
  $(document.body).on('updated_cart_totals', function () {
    $overlay = $('#substitution-overlay');
    $modal   = $('#substitution-modal');
  });

})(jQuery);