var token = "";  function atualiza() {  imageContentDiv.removeChild(loadingInitiator);  if (token=="" || token==undefined) {   erroDiv.classList.remove('prodemge-captcha-display-none');   loadingDiv.classList.add('prodemge-captcha-display-none');   conteudoDiv.classList.add('prodemge-captcha-display-none');  } else {   loadingDiv.classList.add("prodemge-captcha-display-none");   loadingDiv.classList.remove("prodemge-captcha-fade");   loadingDiv.classList.add("prodemge-captcha-hide");   conteudoDiv.classList.remove("prodemge-captcha-hide");   conteudoDiv.classList.add("prodemge-captcha-fade");  } } function novoToken(imageContentDiv,tokenMgApi) {  imageContentDiv.style.backgroundImage = ``;  imageContentDiv.appendChild(loadingInitiator);  fetch('https://apigateway.prodemge.gov.br/captcha/dinamico', {    headers: {     'Authorization': 'Bearer '+tokenMgApi,     'Content-Type': 'application/json'     }   })   .then(resposta => {    if (!resposta.ok) {     atualiza();    } else {     return resposta.json();     }   })   .then(data => {   if (data) {    const imagemBase64 = data.captchaBase64;    token = data.token;    atualiza();    imageContentDiv.style.backgroundImage = `url(data:image/png;base64,${imagemBase64})`;    return data.token;    } else {    return "";    }   })   .catch(error => {    console.error(error);   });  }                      const captchaContainer = document.getElementById('captcha-container');  const tokenMgApi = captchaContainer.getAttribute('data-prodemge-token');  const inputTokenResponse = captchaContainer.getAttribute('data-input-response-id');                const mainDiv = document.createElement('div');        mainDiv.className = 'prodemge-captcha-main';            const verificationToken = document.createElement('input');  verificationToken.type = 'hidden';  verificationToken.name = 'prodemge-captcha-verificacao';  verificationToken.id = 'prodemge-captcha-verificacao';        mainDiv.appendChild(verificationToken);                const loadingDiv = document.createElement('div');        loadingDiv.className = 'prodemge-captcha-fade prodemge-captcha-display-none';        loadingDiv.id = 'prodemge-captcha-loading';          const invalidDiv = document.createElement('div');  invalidDiv.innerText = 'Tentativa inválida. Verifique os caracteres digitados.';  invalidDiv.className = 'prodemge-captcha-invalid prodemge-captcha-display-none';  loadingDiv.appendChild(invalidDiv);          const loaderSpan = document.createElement('span');        loaderSpan.className = 'prodemge-captcha-loader';        loadingDiv.appendChild(loaderSpan);          const tryAgainDiv = document.createElement('div');  const imgReload = `data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBVcGxvYWRlZCB0bzogU1ZHIFJlcG8sIHd3dy5zdmdyZXBvLmNvbSwgR2VuZXJhdG9yOiBTVkcgUmVwbyBNaXhlciBUb29scyAtLT4NCjxzdmcgaGVpZ2h0PSI4MDBweCIgd2lkdGg9IjgwMHB4IiB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiANCgkgdmlld0JveD0iMCAwIDQ5Ni4xNjYgNDk2LjE2NiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8cGF0aCBzdHlsZT0iZmlsbDojMzJCRUE2OyIgZD0iTTAuMDA1LDI0OC4wODdDMC4wMDUsMTExLjA2MywxMTEuMDczLDAsMjQ4LjA3OSwwYzEzNy4wMTQsMCwyNDguMDgyLDExMS4wNjIsMjQ4LjA4MiwyNDguMDg3DQoJYzAsMTM3LjAwMi0xMTEuMDY4LDI0OC4wNzktMjQ4LjA4MiwyNDguMDc5QzExMS4wNzMsNDk2LjE2NiwwLjAwNSwzODUuMDg5LDAuMDA1LDI0OC4wODd6Ii8+DQo8cGF0aCBzdHlsZT0iZmlsbDojRjdGN0Y3OyIgZD0iTTQwMC44MTMsMTY5LjU4MWMtMi41MDItNC44NjUtMTQuNjk1LTE2LjAxMi0zNS4yNjItNS44OTENCgljLTIwLjU2NCwxMC4xMjItMTAuNjI1LDMyLjM1MS0xMC42MjUsMzIuMzUxYzcuNjY2LDE1LjcyMiwxMS45OCwzMy4zNzEsMTEuOTgsNTIuMDQ2YzAsNjUuNjIyLTUzLjIwMSwxMTguODI0LTExOC44MjgsMTE4LjgyNA0KCWMtNjUuNjE5LDAtMTE4LjgyLTUzLjIwMi0xMTguODItMTE4LjgyNGMwLTYxLjQyMiw0Ni42LTExMS45NDYsMTA2LjM1Ny0xMTguMTczdjMwLjc5M2MwLDAtMC4wODQsMS44MzYsMS44MjgsMi45OTkNCgljMS45MDYsMS4xNjMsMy44MTgsMCwzLjgxOCwwbDk4LjU3Ni01OC4wODNjMCwwLDIuMjExLTEuMTYyLDIuMjExLTMuNDM2YzAtMS44NzMtMi4yMTEtMy4yMDUtMi4yMTEtMy4yMDVsLTk4LjI0OC01Ny43NTQNCgljMCwwLTIuMjQtMS42MDUtNC4yMy0wLjgyNmMtMS45ODgsMC43NzMtMS43NDQsMy40ODEtMS43NDQsMy40ODF2MzIuOTkzYy04OC45OTgsNi4zOTItMTU5LjIzLDgwLjU2My0xNTkuMjMsMTcxLjIxDQoJYzAsOTQuODI0LDc2Ljg3MywxNzEuNjk2LDE3MS42OTMsMTcxLjY5NmM5NC44MjgsMCwxNzEuNzA3LTc2Ljg3MiwxNzEuNzA3LTE3MS42OTYNCglDNDE5Ljc4NiwyMTkuNzg4LDQxMi45MzMsMTkzLjEwNiw0MDAuODEzLDE2OS41ODF6Ii8+DQo8L3N2Zz4=`;  const imgCaptchaElement = document.createElement('img');        imgCaptchaElement.src = imgReload;  imgCaptchaElement.width = 50;  imgCaptchaElement.height = 50;  tryAgainDiv.appendChild(imgCaptchaElement);  tryAgainDiv.className = 'prodemge-captcha-try-again prodemge-captcha-display-none';  loadingDiv.appendChild(tryAgainDiv);                const conteudoDiv = document.createElement('div');        conteudoDiv.className = 'prodemge-captcha-fade';        conteudoDiv.id = 'prodemge-captcha-conteudo';                const formDiv = document.createElement('div');        formDiv.className = 'prodemge-captcha-form';        const strong = document.createElement('strong');        strong.innerText = 'Qual o texto ou operação da imagem?';        const input = document.createElement('input');        input.className = 'prodemge-captcha-input-text';        input.type = 'text';        const br = document.createElement('br');        const button = document.createElement('button');        button.className = 'prodemge-captcha-button';        button.innerText = 'Validar';  const imgReloadElement = document.createElement('img');        imgReloadElement.src = imgReload;        imgReloadElement.className = 'prodemge-reload-button';  imgReloadElement.addEventListener('click', function() {     novoToken(imageContentDiv,tokenMgApi);           });        formDiv.appendChild(strong);        formDiv.appendChild(input);        formDiv.appendChild(br);        formDiv.appendChild(button);        formDiv.appendChild(imgReloadElement);                const imageDiv = document.createElement('div');        imageDiv.className = 'prodemge-captcha-image';        const imageContentDiv = document.createElement('div');        imageContentDiv.style.backgroundImage = ``;        imageContentDiv.className = 'prodemge-captcha-image-content';        imageDiv.appendChild(imageContentDiv);    const loadingInitiator =  document.createElement('div');  loadingInitiator.className = 'prodemge-captcha-loader-initiator';  imageContentDiv.appendChild(loadingInitiator);        conteudoDiv.appendChild(formDiv);        conteudoDiv.appendChild(imageDiv);            const erroDiv = document.createElement('div');  erroDiv.className = 'prodemge-captcha-display-none prodemge-captcha-loading-error';        erroDiv.innerText = 'Ocorreu um erro ao tentar carregar o CAPTCHA.';            mainDiv.appendChild(loadingDiv);        mainDiv.appendChild(conteudoDiv);        mainDiv.appendChild(erroDiv);                captchaContainer.appendChild(mainDiv);     tryAgainDiv.addEventListener('click', function() {      novoToken(imageContentDiv,tokenMgApi);        });     button.onclick= function(event) {   event.preventDefault();    loadingDiv.classList.remove("prodemge-captcha-display-none");   loadingDiv.classList.remove("prodemge-captcha-hide");   conteudoDiv.classList.add("prodemge-captcha-hide");   loaderSpan.classList.remove('fail');   const url = "https://apigateway.prodemge.gov.br/captcha/verifica?token="+token+"&response="+input.value+"&";   fetch(url, {    headers: {     'Authorization': 'Bearer '+tokenMgApi,     'Content-Type': 'application/json'     }   })    .then(response => {     input.value = '';     if (!response.ok) {     } else {      return response.json();     }    })    .then(data => {     if (data.verificado != true) {      loaderSpan.classList.add('fail');      invalidDiv.classList.remove("prodemge-captcha-display-none");      tryAgainDiv.classList.remove("prodemge-captcha-display-none");     } else {      verificationToken.value = data.tokenVerificacao;      if (inputTokenResponse) {       document.getElementById(inputTokenResponse).value = data.tokenVerificacao;      }      loaderSpan.classList.add('success');            invalidDiv.classList.add("prodemge-captcha-display-none");      tryAgainDiv.classList.add("prodemge-captcha-display-none");     }    })    .catch(error => {     loaderSpan.classList.add('fail');      invalidDiv.classList.remove("prodemge-captcha-display-none");      tryAgainDiv.classList.remove("prodemge-captcha-display-none");    });   };     novoToken(imageContentDiv,tokenMgApi);         var style = document.createElement('style');style.innerHTML = `.prodemge-reload-button { widht: 22px; height: 22px; margin-left: 10px; cursor: pointer; position: absolute;}.prodemge-captcha-display-none {display: none;}.prodemge-captcha-try-again {float: right; margin-left: 220px; width: 100px; text-align: center; font-family: arial; font-size: 14px; padding-top:25px; position: absolute; z-index: 10;}.prodemge-captcha-invalid {float: left; width: 120px; text-align: center; font-family: arial; font-size: 14px; padding-top:20px; position: absolute;}.prodemge-captcha-loading-error {text-align: center; font-family: arial; font-size: 14px; padding: 15px;}.prodemge-captcha-image-content { background-position: center; width: 150px; height: 90px;}.prodemge-captcha-image {float: right; border: 1px solid #CCC; margin: 5px; border-radius: 5px;overflow: hidden;}.prodemge-captcha-button {background-color: #A0C834; border: 1px solid #8Eb428; padding: 2px 10px; color: #FFF; cursor: pointer;}.prodemge-captcha-input-text {width: 120px; padding: 8px 10px; margin: 5px 0px; border-radius: 5px; border: 1px solid #AAA; line-height: normal;}.prodemge-captcha-form {float: left; width: 150px; font-family: arial; font-size: 13px;}.prodemge-captcha-main {clear: both; width: 330px; height:100px; margin: 5px; padding: 8px; border-radius: 5px; background-color: #FFF; filter: drop-shadow(0px 0px 5px #CCC);}.prodemge-captcha-fade {  opacity: 1;  transition: opacity 0.5s ease;}.prodemge-captcha-hide {  opacity: 0;  transition: opacity 0.5s ease;}.prodemge-captcha-loader {    position: absolute;    content: '';    top: calc(50% - 2.5rem);    left: calc(50% - 2.5rem);    width: 5rem;    height: 5rem;    border: 5px solid lightBlue;    border-radius: 50%;    overflow: hidden;    transition: 0.3s;    box-shadow: 0rem 0rem 0.6rem rgba(0,0,0,0.3);    animation: spin 1s linear infinite;}.success {  background: lightGreen;  border-color: lightGreen;}.fail {  background: #ffcccb;  border-color: #ffcccb;}.prodemge-captcha-loader.success{    &::before {      height: 7px;      width: 2.5rem;      position: absolute;      top: 65%;      left: 44%;      background-color: green;      transform: rotate(-45deg);      transform-origin: 0% 50%;      border-radius: 5px;      animation: baseGrow 1s;      content: '';    }        &::after {      height: 7px;      width: 1.5rem;      position: absolute;      top: 65%;      left: 50%;      background-color: green;      transform: rotate(-135deg);      transform-origin: 0% 50%;      border-radius: 5px;      animation: tipGrow 1s;      content:'';    }  }.prodemge-captcha-loader.fail {     &::before {      width: 3rem;      height: 0.5rem;      background: darkRed;      transform-origin: 50% 50%;      top: calc(50% - 0.25rem);      left: calc(50% - 1.5rem);      transform: rotate(45deg);      position: absolute;      content: '';      border-radius: 10px;      animation: leftIn 0.3s linear;      content: '';    }        &::after {       width: 3rem;      height: 0.5rem;      background: darkRed;      transform-origin: 50% 50%;      top: calc(50% - 0.25rem);      right: calc(50% - 1.5rem);      transform: rotate(-45deg);      position: absolute;      content: '';      border-radius: 10px;      animation: rightIn 0.3s linear;      content:'';    } }.prodemge-captcha-loader.success, .prodemge-captcha-loader.fail {  animation: pop 1.2s ease-in-out;}@keyframes spin {  0% {    transform: rotate(0deg);        border-top: 5px solid blue;  }  100% {    transform: rotate(360deg);        border-top: 5px solid blue;  }}@keyframes tipGrow {  0% {    width: 0px;    left: 0;    top: 0;  }  25% {    width: 0px;    left: 0;    top: 0;   }  50% {    top: 0%;    left: 0%;    width: 0;  }  75% {    top: 0%;    left: 0%;    width: 0rem;  }  100% {    top: 65%;    left: 50%;    width: 1.5rem;  }}@keyframes baseGrow {  0% {    width: 0;  }  90% {    width: 0;  }  100% {    width: 2.5rem;  }}@keyframes pop {  0% {    transform: scale(1);  }  80% {    transform: scale(1);      }  100% {    transform: scale(1.1);  }}@keyframes leftIn {  0% {    left: 0;    top: 0;    width: 0;  }  100% {    top: calc(50% - 0.25rem);    left: calc(50% - 1.5rem);    width: 3rem;  }}@keyframes rightIn {  0% {    rigth: 0;    top: 0;    width: 0;  }  100% {    top: calc(50% - 0.25rem);    right: calc(50% - 1.5rem);    width: 3rem;  }}.prodemge-captcha-loader-initiator {margin-left: 55px;margin-top: 20px;position: absolute;  width: 30px;  padding: 8px;  aspect-ratio: 1;  border-radius: 50%;  background: #25b09b;  --_m:     conic-gradient(#0000 10%,#000),    linear-gradient(#000 0 0) content-box;  -webkit-mask: var(--_m);          mask: var(--_m);  -webkit-mask-composite: source-out;          mask-composite: subtract;  animation: l3 1s infinite linear;}@keyframes l3 {to{transform: rotate(1turn)}}`;document.body.appendChild(style);