document.getElementById("run-code").addEventListener("click", () => {
  const htmlCode = document.getElementById("html-code").value;
  const cssCode = `<style>${document.getElementById("css-code").value}</style>`;
  const jsCode = `<script>${
    document.getElementById("js-code").value
  }<\/script>`;

  const iframe = document.getElementById("output");
  const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;

  iframeDoc.open();
  iframeDoc.write(htmlCode + cssCode + jsCode);
  iframeDoc.close();
});

document.getElementById("dark-mode-toggle").addEventListener("click", () => {
  document.body.classList.toggle("dark-mode");
  document.querySelector(".container").classList.toggle("dark-mode");
  document
    .querySelectorAll(".editor")
    .forEach((el) => el.classList.toggle("dark-mode"));

  const isDarkMode = document.body.classList.contains("dark-mode");
  document.getElementById("dark-mode-toggle").textContent = isDarkMode
    ? "Switch to Light Mode"
    : "Switch to Dark Mode";
});