env = {
  API_URL: "https://rdds.ar/admin-rfs",
  ADMIN_APP_URL: "https://rdds.ar/admin-app",
  INVERSORES_APP_URL: "https://rdds.ar/inversores-app",
  INSTITUCIONES_APP_URL: "https://rdds.ar/instituciones-app"
};

document.addEventListener("DOMContentLoaded", function () {
  const investorLoginLink = document.getElementById("investor-login-link");
  if (investorLoginLink && env.INVERSORES_APP_URL) {
    investorLoginLink.href = env.INVERSORES_APP_URL;
  }

  const institucionesLoginLink = document.getElementById("instituciones-login-link");
  if (institucionesLoginLink && env.INSTITUCIONES_APP_URL) {
    institucionesLoginLink.href = env.INSTITUCIONES_APP_URL;
  }
});


function fetchTranslations(pageCode) {
  const storedLanguageId = localStorage.getItem("languageId") || "es-AR";

  fetch(
    env.API_URL + "/i18n/texts/cache?languageId=" + storedLanguageId + "&pageCode=" + pageCode,
    {
      headers: {
        "Content-Type": "application/json",
      },
    }
  )
    .then((response) => {
      if (!response.ok) {
        throw new Error("Traslations request failed");
      }
      return response.json();
    })
    .then((data) => {
      let translations = {};
      data.map((i) => {
        translations[i.code] = i.value;
      });

      i18next
        .init({
          lng: languageId,
          resources: {
            "en-US": {
              translation: translations,
            },
            "pt-BR": {
              translation: translations,
            },
            "es-AR": {
              translation: translations,
            },
          },
        })
        .then(function () {
          var elements = document.querySelectorAll("[data-i18n]");
          elements.forEach(function (element) {
            var key = element.getAttribute("data-i18n");
            // element.innerText = i18next.t(key).replaceAll('<br>','\n');
            element.innerHTML = DOMPurify.sanitize(i18next.t(key), {
              ALLOWED_TAGS: ["br", "strong", "span", "em", "i", "a"],
            });
          });

          document.body.style.display = "block";
          
          // 🔧 Aca va la solución: inicializar FlexSlider después de que todo esté visible
          $('.flexslider').flexslider({
            animation: "slide",
            animationLoop: false,
            itemWidth: '100%',
            itemMargin: 5,
            pausePlay: true,
            start: function(slider){
              $('body').removeClass('loading');
            }
          });
        });
    })
    .catch((error) => {
      console.error(error);
      document.body.style.display = "block";
    });
}