(function($bs) {
		const CLASS_NAME = 'has-child-dropdown-show';
			$bs.Dropdown.prototype.toggle = function(_orginal) {
				return function() {
					document.querySelectorAll('.' + CLASS_NAME).forEach(function(e) {
						e.classList.remove(CLASS_NAME);
					});
					let dd = this._element.closest('.dropdown').parentNode.closest('.dropdown');
					for (; dd && dd !== document; dd = dd.parentNode.closest('.dropdown')) {
						dd.classList.add(CLASS_NAME);
					}
					return _orginal.call(this);
				}
			}($bs.Dropdown.prototype.toggle);

			document.querySelectorAll('.dropdown').forEach(function(dd) {
				dd.addEventListener('hide.bs.dropdown', function(e) {
					if (this.classList.contains(CLASS_NAME)) {
						this.classList.remove(CLASS_NAME);
						e.preventDefault();
					}
					if(e.clickEvent && e.clickEvent.composedPath().some(el=>el.classList && el.classList.contains('dropdown-toggle'))){
						e.preventDefault();
					}
					e.stopPropagation(); // do not need pop in multi level mode
				});
			});

			// for hover
			function getDropdown(element) {
				return $bs.Dropdown.getInstance(element) || new $bs.Dropdown(element);
			}

			document.querySelectorAll('.dropdown-hover, .dropdown-hover-all .dropdown').forEach(function(dd) {
				dd.addEventListener('mouseenter', function(e) {
					let toggle = e.target.querySelector(':scope>[data-bs-toggle="dropdown"]');
					if (!toggle.classList.contains('show')) {
						getDropdown(toggle).toggle();
					}
				});
				dd.addEventListener('mouseleave', function(e) {
					let toggle = e.target.querySelector(':scope>[data-bs-toggle="dropdown"]');
					if (toggle.classList.contains('show')) {
						getDropdown(toggle).toggle();
					}
				});
			});
		})(bootstrap);


		const phoneInputField = document.querySelector("#phone1");
    const phoneInput = window.intlTelInput(phoneInputField, {
      utilsScript:
        "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/js/utils.js",
    });

    const info = document.querySelector(".alert-info");
    const error = document.querySelector(".alert-error");

    function process(event) {
      event.preventDefault();

      const phoneNumber = phoneInput.getNumber();

      info.style.display = "";
      info.innerHTML = `Phone number in E.164 format: <strong>${phoneNumber}</strong>`;
    }
 
$(function(){
  $("#header").load("header.html"); 
  $("#footer").load("footer.html"); 
});