/**
 * H5P Agamotto — Inline style override
 * Παρακολουθεί τις inline styles που βάλλει το H5P dynamically
 * και τις αφαιρεί αμέσως, ανεξάρτητα από το timing.
 *
 * Τοποθετήστε το script ΟΠΟΥΔΗΠΟΤΕ στην σελίδα —
 * το MutationObserver θα ξεκινήσει αυτόματα μόλις το DOM είναι έτοιμο.
 */
(function () {
  function fixAgamotto(root) {
    // ── images-container: αφαιρώ το hardcoded height ──
    root.querySelectorAll('.h5p-agamotto-images-container').forEach(function (el) {
      el.style.height = '';
    });

    // ── slider-track: αφαιρώ το hardcoded width ──
    root.querySelectorAll('.h5p-agamotto-slider-track').forEach(function (el) {
      el.style.width = '';
    });

    // ── slider-container: αφαιρώ το hardcoded width ──
    root.querySelectorAll('.h5p-agamotto-slider-container').forEach(function (el) {
      el.style.width = '';
    });
  }

  function init() {
    // Πρώτη εφαρμογή — αν το H5P έχει ήδη κινηθεί
    fixAgamotto(document);

    // MutationObserver — παρακολουθεί κάθε style change στο DOM
    var observer = new MutationObserver(function (mutations) {
      mutations.forEach(function (mutation) {
        if (mutation.type === 'attributes' && mutation.attributeName === 'style') {
          var target = mutation.target;
          if (
            target.classList.contains('h5p-agamotto-images-container') ||
            target.classList.contains('h5p-agamotto-slider-track') ||
            target.classList.contains('h5p-agamotto-slider-container')
          ) {
            fixAgamotto(target.closest('.h5p-agamotto') || document);
          }
        }
      });
    });

    observer.observe(document.body, {
      attributes: true,
      subtree: true,
      attributeFilter: ['style']
    });
  }

  // Αν το DOM είναι έτοιμο, τρέχουμε αμέσως — αλλιώς περιμένουμε
  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', init);
  } else {
    init();
  }
})();
