// Export Web/SCORM — port de screens/rendering/render_overlay.py (3.4,
// overlay/modale réutilisable) : voile plein écran EN MODE JOUABLE
// uniquement (ctx._forge_play_mode), comportement de conteneur normal
// dans l'éditeur (non pertinent hors ligne, qui ne sert jamais l'éditeur,
// mais le port reste fidèle pour ne pas diverger inutilement).
function forgeRenderOverlay(el, meta, gameData, childrenMap, ctx, parentFlexDirection) {
  const isPlayMode = !!ctx?._forge_play_mode;
  const attrsRaw = el.attributes || {};
  const boxColor = attrsRaw._couleur_boite || '#1f2430';
  const radius = attrsRaw._arrondi || '12';

  const attrs = forgeVisibleAttrs(el, meta, ctx);
  let style; let
    wrapperClass;
  if (isPlayMode) {
    const baseOverlayStyle = 'position:fixed; inset:0; z-index:9999; display:flex; '
      + 'align-items:center; justify-content:center; background:rgba(0,0,0,0.6);';
    style = `${baseOverlayStyle} ${forgeStyleString(el, parentFlexDirection, el.widget)}`;
    wrapperClass = 'modal is-active';
  } else {
    style = forgeStyleString(el, parentFlexDirection, el.widget);
    wrapperClass = '';
  }

  const attrParts = [`style="${forgeHtmlEscape(style)}"`];
  Object.keys(attrs).forEach((k) => {
    const v = attrs[k];
    if (v === null || v === undefined || v === '' || v === false) return;
    attrParts.push(v === true ? forgeHtmlEscape(k) : `${forgeHtmlEscape(k)}="${forgeHtmlEscape(v)}"`);
  });

  const boxStyle = `background:${forgeHtmlEscape(String(boxColor))}; border-radius:${forgeHtmlEscape(String(radius))}px; `
    + 'color:#e8eaf0; padding:24px; width:100%; max-width:min(560px, 90%); max-height:90%; overflow:auto; box-sizing:border-box;';
  const childHtml = forgeRenderChildren(el, gameData, childrenMap, ctx);
  const wrapperClassAttr = wrapperClass ? `class="${wrapperClass}" ` : '';
  return (
    `<div ${wrapperClassAttr}${attrParts.join(' ')}>`
    + `<div class="box forgeOverlayBox" style="${forgeHtmlEscape(boxStyle)}">${childHtml}</div>`
    + '</div>'
  );
}

if (typeof module !== 'undefined' && module.exports) {
  module.exports = { forgeRenderOverlay };
  const renderMod = require('./render-element.js');
  ['forgeVisibleAttrs', 'forgeStyleString', 'forgeHtmlEscape', 'forgeRenderChildren'].forEach((name) => {
    global[name] = global[name] || renderMod[name];
  });
}