function openLayer(type) {
  document.getElementById(type + '_Layer').style.display = 'block';
}

function closeLayer(type) {
  document.getElementById(type + '_Layer').style.display = 'none';
}

function applyCheckedComponents(type) {
  const checkboxes = document.querySelectorAll(`#${type}_Layer input[type="checkbox"]:checked`);
  const listDiv = document.getElementById(`${type}_List`);

  checkboxes.forEach(cb => {
    // 중복 방지
    const exists = listDiv.querySelector(`input[type="hidden"][value="${cb.value}"]`);
    if (exists) return;

    const wrapper = document.createElement('div');
    wrapper.className = 'server_partinfo_item';

    const checkbox = document.createElement('input');
    checkbox.type = 'checkbox';
    checkbox.className = `${type}_checkbox`;

    const hiddenInput = document.createElement('input');
    hiddenInput.type = 'hidden';
    hiddenInput.name = `${type}[]`;
    hiddenInput.value = cb.value;

    const span = document.createElement('span');
    span.textContent = cb.getAttribute('data-label');

    wrapper.appendChild(checkbox);
    wrapper.appendChild(hiddenInput);
    wrapper.appendChild(span);

    listDiv.appendChild(wrapper);
  });

  closeLayer(type);
}

function removeCheckedComponents(type) {
  const checkboxes = document.querySelectorAll(`#${type}_List .${type}_checkbox:checked`);
  checkboxes.forEach(cb => cb.closest('.server_partinfo_item').remove());
}