Light/Dark Mode - faire suivre le switch dans une iframe

Bonjour à tous.tes

Pour le prochain design de mon forum nous avons décidé de mettre en place un bouton pour switcher du dark au light mode et inversement. Le bouton fonctionne bien, mais nous avons dans le QEEL une page html intégrée en iframe, et je souhaiterais que cette iframe suive le changement de mode pour que ses couleurs s'adaptent aussi ! J'ai réalisé deux scripts pour ce faire. Problème : le changement se fait correctement quand le membre est connecté, mais pas du tout en invité

Voici mes scripts actuels :
- Le premier est installé sur toutes les pages du forum et gère le bouton de switch, et il appelle une fonction dans l'iframe censée toggle le dark/light mode.

Code:

$(function(){
  var switched = $('#mode');
  var chatBox = document.querySelector("#frame_chatbox");
  var derVal = document.querySelector(".qeel_dervals");
 
  switched.on("change", function(){
    if (switched.is(':checked')){
      $('html').removeClass('dark');
      $('html').addClass('light');
      localStorage.setItem('mode','light');
      chatBox.contentWindow.toggleTheme('light');
      derVal.contentWindow.toggleTheme('light');
    }
    else{
      $('html').removeClass('light');
      $('html').addClass('dark');
      localStorage.setItem('mode','dark');
      chatBox.contentWindow.toggleTheme('dark');
      derVal.contentWindow.toggleTheme('dark');
    }
  });
 
  var mode = localStorage.getItem('mode');
  if (mode == 'dark') {
    switched.prop( "checked", false );
    $('html').removeClass("light");
    $('html').addClass("dark");
  }
  if (mode == 'light') {
    switched.prop( "checked", true );
    $('html').removeClass("dark");
    $('html').addClass("light");
  }

});

- Le second est celui présent dans la page html, qui crée la fonction en question.

Code:

function toggleTheme(theme){
  $("html").removeClass("dark light");
  $("html").addClass(theme);
}
$(function(){
  var mode = localStorage.getItem('mode');
  if (mode == 'dark') {
    $('html').removeClass("light");
    $('html').addClass("dark");
  }
  if (mode == 'light') {
    $('html').removeClass("dark");
    $('html').addClass("light");
  }
});

A priori le code doit être un minimum fonctionnel puisqu'il fonctionne parfaitement quand on est connecté... c'est vraiment ce problème en invité qui me turlupine. Je me dis qu'il doit y avoir un conflit avec quelque chose, mais quoi ?

Je vous mets le lien de mon forum test en hide :


Vous pouvez constater le problème en regardant le QEEL, le bloc "Avis de décès" est l'iframe concernée, et quand on clique sur le bouton de changement de mode dans la barre tout en haut, le changement de couleurs se fait partout sauf sur ce bloc, du coup...


EDIT : après moult essais, j'ai compris qu'en fait c'est la partie du script qui concerne la chatbox qui m'embête, comme elle est avant dans le code, ça doit chercher la chatbox en invité et ne pas la trouver, et arrêter le code là... je pense. Du coup, j'ai juste inversé les deux lignes de code et ça fonctionne !