function updateVersionOptions() {
  const languageSelect = document.getElementById("bibldare_language_select");
  const versionSelect = document.getElementById("bibldare_version_select");
  const backgroundSelect = document.querySelector('select[name="background"]');
  const timezoneSelect = document.getElementById("bibldare_timezone_select");
  const shortcodeInput = document.getElementById("bibldareShortcodeInput");

  const customBgColorInput = document.querySelector('input[name="custom_background_color"]');
  const textColorInput = document.querySelector('input[name="text_color"]');

  if (!languageSelect || !versionSelect || !shortcodeInput || !timezoneSelect || !customBgColorInput || !textColorInput)
    return;

  const language = languageSelect.value;
  const lastLang = languageSelect.dataset.lastLang;
  const background = backgroundSelect ? backgroundSelect.value : "white";
  const customBgColor = customBgColorInput.value;
  const textColor = textColorInput.value;

  if (language !== lastLang) {
    versionSelect.innerHTML = "";
    if (language === "geo") {
      versionSelect.innerHTML = `
        <option value="ახალი გადამუშავებული გამოცემა 2015">ახალი გადამუშავებული გამოცემა 2015</option>
        <option value="სბს–სტოკჰოლმი 2001">სბს–სტოკჰოლმი 2001</option>
      `;
    } else {
      versionSelect.innerHTML = `
        <option value="NASB New American Standard Bible">NASB New American Standard Bible</option>
        <option value="NIV New International Version">NIV New International Version</option>
        <option value="KJV King James Version">KJV King James Version</option>
      `;
    }
    languageSelect.dataset.lastLang = language;
  }

  const timezone = timezoneSelect.value;

  let shortcode = `[bibldare_bible_reading_plan`;
  if (language) {
    shortcode += ` lang="${language}"`;
  }
  if (versionSelect.value) {
    shortcode += ` version="${versionSelect.value}"`;
  }
  if (background) {
    shortcode += ` background="${background}"`;
  }
  if (customBgColor) {
    shortcode += ` custom_background_color="${customBgColor}"`;
  }
  if (textColor) {
    shortcode += ` text_color="${textColor}"`;
  }
  if (timezone) {
    shortcode += ` timezone="${timezone}"`;
  }
  shortcode += `]`;

  shortcodeInput.value = shortcode;

  return {
    language: language,
    version: versionSelect.value,
    background: background,
    timezone: timezone,
    custom_background_color: customBgColor,
    text_color: textColor,
  };
}

document.addEventListener("DOMContentLoaded", () => {
  const languageSelect = document.getElementById("bibldare_language_select");
  const versionSelect = document.getElementById("bibldare_version_select");
  const backgroundSelect = document.querySelector('select[name="background"]');
  const timezoneSelect = document.getElementById("bibldare_timezone_select");
  const cacheCheckbox = document.querySelector('input[name="cache_enabled"]');
  const cacheBtn = document.querySelector("button.button-primary");
  const customBgColorInput = document.querySelector('input[name="custom_background_color"]');
  const textColorInput = document.querySelector('input[name="text_color"]');

  const saveSettingsInstantly = (e) => {
    if (e && e.type === "click") {
      e.preventDefault();
    }

    const settings = updateVersionOptions();

    const data = {
      action: "bibldare_save_settings_instant",
      language: settings.language,
      version: settings.version,
      background: settings.background,
      timezone: settings.timezone,
      cache_enabled: cacheCheckbox ? cacheCheckbox.checked : false,
    };
    if (settings.custom_background_color) {
      data.custom_background_color = settings.custom_background_color;
    }
    if (settings.text_color) {
      data.text_color = settings.text_color;
    }

    jQuery.post(ajaxurl, data);
  };

  languageSelect.addEventListener("change", updateVersionOptions);
  versionSelect.addEventListener("change", updateVersionOptions);
  if (backgroundSelect) {
    backgroundSelect.addEventListener("change", updateVersionOptions);
  }
  if (timezoneSelect) {
    timezoneSelect.addEventListener("change", updateVersionOptions);
  }
  if (customBgColorInput) {
    jQuery(customBgColorInput).wpColorPicker({ change: updateVersionOptions, clear: updateVersionOptions });
  }
  if (textColorInput) {
    jQuery(textColorInput).wpColorPicker({ change: updateVersionOptions, clear: updateVersionOptions });
  }

  if (cacheBtn) {
    cacheBtn.addEventListener("click", saveSettingsInstantly);
  }

  updateVersionOptions();
});
