let criarFormulario = (e) => {
  if (
    !location.pathname === "/certificado/e-cpf" ||
    !location.pathname === "/certificado/e-cpnj" ||
    !location.pathname === "/certificado/e-juridico" ||
    !location.pathname === "/certificado/e-saude" ||
    !location.pathname === "/certificado/nf-e" ||
    !location.pathname === "/certificado/e-cpnj-empreendedor"
  ) {
    return false;
  }
  var url_string = window.location.href;
  var url = new URL(url_string);

  let tipoInputCert = url.searchParams.get("tipo");
  if (tipoInputCert) {
    document.getElementById("tipo_cert_ref").value = tipoInputCert;
  }

  const produto_inicial_ecpf = {
    cod_produto: "C01RPFA1SO12",
    validade: "12",
    preco: "146",
    tipo_cert_id: "1",
    tipo_cert_name: "A1 Arquivo",
    categoria_cert: "CPF",
    categoria_cert_id: "1",
  };
  const produto_inicial_ecnpj = {
    cod_produto: "C01RPJA1SO12",
    validade: "12",
    preco: "222",
    tipo_cert_id: "1",
    tipo_cert_name: "A1 Arquivo",
    categoria_cert: "CNPJ",
    categoria_cert_id: "2",
    anuidade: "false",
  };

  const produto_inicial_nfe = {
    cod_produto: "C01MPJA1SO12",
    validade: "12",
    preco: "348",
    tipo_cert_id: "1",
    tipo_cert_name: "A1 Arquivo",
    categoria_cert: "NF-e",
    categoria_cert_id: "3",
    anuidade: "false",
  };
  const produto_inicial_mei = {
    cod_produto: "C91RPJA3SE18",
    validade: "18",
    preco: "189",
    tipo_cert_id: "2",
    tipo_cert_name: "A3 Certificado Sem Mídia",
    categoria_cert: "ME, EPP e MEI",
    categoria_cert_id: "4",
    anuidade: "false",
  };
  const produto_inicial_sau = {
    cod_produto: "C01RPFA1SOSAU12",
    validade: "12",
    preco: "100",
    tipo_cert_id: "1",
    tipo_cert_name: "A1 Arquivo",
    categoria_cert: "E-CPF Saúde",
    categoria_cert_id: "6",
    anuidade: "false",
  };
  const produto_inicial_jur = {
    cod_produto: "C01RPFA1SOOAB12",
    validade: "12",
    preco: "100",
    tipo_cert_id: "1",
    tipo_cert_name: "A1 Arquivo",
    categoria_cert: "E-CPF Jurídico",
    categoria_cert_id: "5",
    anuidade: "false",
  };

  //start
  let container = document.createElement("div");
  let div_start = document.getElementById("start");
  div_start.append(container);

  let tipo_cert_ref = document.getElementById("tipo_cert_ref").value;
  let produto_inicial_tipo;
  if (tipo_cert_ref == 1) produto_inicial_tipo = produto_inicial_ecpf;
  if (tipo_cert_ref == 2) produto_inicial_tipo = produto_inicial_ecnpj;
  if (tipo_cert_ref == 3) produto_inicial_tipo = produto_inicial_nfe;
  if (tipo_cert_ref == 4) produto_inicial_tipo = produto_inicial_mei;
  if (tipo_cert_ref == 5) produto_inicial_tipo = produto_inicial_jur;
  if (tipo_cert_ref == 6) produto_inicial_tipo = produto_inicial_sau;
  let codprodInicial = produto_inicial_tipo.cod_produto;
  console.log("codprodinicial", codprodInicial);
  let promocode_padrao = "153GHJEK";

  var url_string = window.location.href;
  var url = new URL(url_string);
  var c = url.searchParams.get("promocode");
  if (c) {
    promocode_padrao = c;
  }

  let div_card = document.createElement("div");
  let div_card_body = document.createElement("div");
  let div_input_radio = document.createElement("div");

  let input_radio_mes = document.createElement("input");
  let label_radio_mes = document.createElement("label");
  let p_radio_mes = document.createElement("p");
  container.className = "container-fluid mx-auto pt-5 pb-5";
  let row0 = document.createElement("div");
  let row = document.createElement("div");
  row.className = "row";
  row0.className = "row mt-5";

  let h1 = document.createElement("span");
  let span_muted = document.createElement("p");
  h1.textContent = "Comprar";
  h1.className = " comprar text-dark";
  span_muted.textContent =
    "Selecione abaixo os meses que deseja para o uso do dispositivo";
  span_muted.className = "sub-comprar";
  let col_3 = document.createElement("div");
  let col_9 = document.createElement("div");
  let span_d_inline = document.createElement("span");
  let div_img_tipo_cert = document.createElement("div");
  let img_tipo_cert = document.createElement("img");
  let text_tipo_cert = document.createElement("span");
  let span_h4 = document.createElement("span");

  span_muted.className = "text-muted";
  col_9.className = " tipo-meses text-dark";
  col_3.className = "col-3 mr-5";
  span_d_inline.className = "col-12 d-inline-flex div-info-cert";
  div_img_tipo_cert.className = "img-tipo-cert";
  img_tipo_cert.className = "w-100 h-100";
  text_tipo_cert.className = "ml-3 my-auto text-tipo-cert";
  span_h4.className = "h4";

  div_card.className = "card card-opcao mr-3";
  div_card_body.className = "card-body";
  div_input_radio.className = "col-12";
  div_input_radio.id = "div";
  input_radio_mes.className = "form-check-input mr-5 mt-3 input-radio";
  input_radio_mes.type = "radio";
  input_radio_mes.name = "radio";
  label_radio_mes.className = "h2 ml-2";
  let indisponivel = document.createElement("p");
  indisponivel.innerHTML = "Indisponível Neste Modelo";

  //A1 img
  let span_d_inline0 = span_d_inline.cloneNode(true);
  let div_img_tipo_cert0 = div_img_tipo_cert.cloneNode(true);
  let img_tipo_cert0 = img_tipo_cert.cloneNode(true);
  let span_h40 = span_h4.cloneNode(true);
  span_h40.innerHTML = "A1";
  span_d_inline0.id = "A1";
  let text_tipo_cert0 = text_tipo_cert.cloneNode(true);
  text_tipo_cert0.innerHTML = ' <p class="title-tipo-cert">A1</p> Arquivo';
  img_tipo_cert0.src +=
    "https://app.pjfit.com.br/certificados/images/laptop_01.svg";
  span_d_inline0.append(div_img_tipo_cert0);
  div_img_tipo_cert0.append(img_tipo_cert0);
  span_d_inline0.append(text_tipo_cert0);

  //A3 sem midia img
  let span_d_inline1 = span_d_inline.cloneNode(true);
  let div_img_tipo_cert1 = div_img_tipo_cert.cloneNode(true);
  let img_tipo_cert1 = img_tipo_cert.cloneNode(true);
  let span_h41 = span_h4.cloneNode(true);
  let text_tipo_cert1 = text_tipo_cert.cloneNode(true);
  span_d_inline1.className += " mt-3";
  text_tipo_cert1.innerHTML =
    '<p class="title-tipo-cert">A3</p>Certificado sem mídia';
  img_tipo_cert1.src =
    "https://app.pjfit.com.br/certificados/images/certificado_02.svg";
  span_d_inline1.id = "A32";
  span_d_inline1.append(div_img_tipo_cert1);
  div_img_tipo_cert1.append(img_tipo_cert1);
  span_d_inline1.append(text_tipo_cert1);

  //A3 Certificado e Leitor
  let span_d_inline2 = span_d_inline.cloneNode(true);
  let div_img_tipo_cert2 = div_img_tipo_cert.cloneNode(true);
  let img_tipo_cert2 = img_tipo_cert.cloneNode(true);
  let text_tipo_cert2 = text_tipo_cert.cloneNode(true);
  span_d_inline2.className += " mt-2";
  text_tipo_cert2.innerHTML =
    '<p class="title-tipo-cert">A3</p> <b>Certificado e Leitor</b>';
  img_tipo_cert2.src =
    "https://app.pjfit.com.br/certificados/images/certificado_leitor_03.svg";
  span_d_inline2.id = "A33";
  span_d_inline2.append(div_img_tipo_cert2);
  div_img_tipo_cert2.append(img_tipo_cert2);
  span_d_inline2.append(text_tipo_cert2);

  //A3 Cartão
  let span_d_inline3 = span_d_inline.cloneNode(true);
  let div_img_tipo_cert3 = div_img_tipo_cert.cloneNode(true);
  let img_tipo_cert3 = img_tipo_cert.cloneNode(true);
  let text_tipo_cert3 = text_tipo_cert.cloneNode(true);
  span_d_inline3.id = "A34";
  span_d_inline3.className += " mt-2";
  text_tipo_cert3.innerHTML =
    '<p class="title-tipo-cert">A3</p> <b>Cartão</b> ';
  img_tipo_cert3.src =
    "https://app.pjfit.com.br/certificados/images/cartão_04.svg";
  span_d_inline3.append(div_img_tipo_cert3);
  div_img_tipo_cert3.append(img_tipo_cert3);
  span_d_inline3.append(text_tipo_cert3);

  //A3 Cartão e Leitor
  let span_d_inline4 = span_d_inline.cloneNode(true);
  let div_img_tipo_cert4 = div_img_tipo_cert.cloneNode(true);
  let img_tipo_cert4 = img_tipo_cert.cloneNode(true);
  let text_tipo_cert4 = text_tipo_cert.cloneNode(true);
  span_d_inline4.id = "A35";
  span_d_inline4.className += " mt-2";
  text_tipo_cert4.innerHTML =
    '<p class="title-tipo-cert">A3</p> <b>Cartão&nbsp;&nbsp; e Leitor</b>';
  img_tipo_cert4.src =
    "https://app.pjfit.com.br/certificados/images/cartão_leitor_05.svg";
  span_d_inline4.append(div_img_tipo_cert4);
  div_img_tipo_cert4.append(img_tipo_cert4);
  span_d_inline4.append(text_tipo_cert4);

  //A3 Token
  let span_d_inline5 = span_d_inline.cloneNode(true);
  let div_img_tipo_cert5 = div_img_tipo_cert.cloneNode(true);
  let img_tipo_cert5 = img_tipo_cert.cloneNode(true);
  let text_tipo_cert5 = text_tipo_cert.cloneNode(true);
  span_d_inline5.id = "A36";
  span_d_inline5.className += " mt-2";
  text_tipo_cert5.innerHTML = '<p class="title-tipo-cert">A3</p> <b>Token</b>';
  img_tipo_cert5.src =
    "https://app.pjfit.com.br/certificados/images/token_06.svg";
  span_d_inline5.append(div_img_tipo_cert5);
  div_img_tipo_cert5.append(img_tipo_cert5);
  span_d_inline5.append(text_tipo_cert5);

  // A1 ROW

  let array_A1 = data.filter(
    (d) => d.tipo_cert_id == 1 && d.categoria_cert_id == tipo_cert_ref
  );
  let countA1 = array_A1.length;
  let rowA1 = row.cloneNode(true);
  rowA1.className += " mt-1";

  if (!countA1) {
    span_d_inline0.className = " d-none";
    rowA1.className += " d-none";
  } else if (countA1) {
    for (i = 0; i < countA1; i++) {
      let div_cardA1 = div_card.cloneNode(true);
      let div_card_bodyA1 = div_card_body.cloneNode(true);
      let div_input_radioA1 = div_input_radio.cloneNode(true);
      let input_radio_mesA1 = input_radio_mes.cloneNode(true);
      let label_radio_mesA1 = label_radio_mes.cloneNode(true);
      let p_radio_mesA1 = p_radio_mes.cloneNode(true);
      let objA1 = array_A1[i];
      input_radio_mesA1.id += objA1.cod_produto;
      label_radio_mesA1.textContent += objA1.validade + " meses";
      if (objA1.cod_produto == "C01RPFA1SO03") {
        p_radio_mesA1.textContent += "R$ " + objA1.preco;
      } else {
        p_radio_mesA1.textContent += "R$ " + objA1.preco + ",00";
      }

      rowA1.appendChild(div_cardA1);
      div_cardA1.append(div_card_bodyA1);
      div_card_bodyA1.append(div_input_radioA1);
      div_input_radioA1.append(input_radio_mesA1);
      div_input_radioA1.append(label_radio_mesA1);
      div_input_radioA1.append(p_radio_mesA1);
    }
  }

  // A3 Certificado sem midia ROW

  let array_A3_2 = data.filter(
    (d) => d.tipo_cert_id == 2 && d.categoria_cert_id == tipo_cert_ref
  );
  let countA3_2 = array_A3_2.length;
  let rowA3_2 = row.cloneNode(true);
  rowA3_2.className += " mt-3";

  if (!countA3_2) {
    span_d_inline1.className = " d-none";
    rowA3_2.className += " d-none";
  } else if (countA3_2) {
    for (i = 0; i < countA3_2; i++) {
      let div_cardA1 = div_card.cloneNode(true);
      let div_card_bodyA1 = div_card_body.cloneNode(true);
      let div_input_radioA1 = div_input_radio.cloneNode(true);
      let input_radio_mesA1 = input_radio_mes.cloneNode(true);
      let label_radio_mesA1 = label_radio_mes.cloneNode(true);
      let p_radio_mesA1 = p_radio_mes.cloneNode(true);
      let objA1 = array_A3_2[i];
      input_radio_mesA1.id += objA1.cod_produto;
      label_radio_mesA1.textContent += objA1.validade + " meses";
      if (objA1.cod_produto == "C01RPFA1SO03") {
        p_radio_mesA1.textContent += "R$ " + objA1.preco;
      } else {
        p_radio_mesA1.textContent += "R$ " + objA1.preco + ",00";
      }

      rowA3_2.appendChild(div_cardA1);
      div_cardA1.append(div_card_bodyA1);
      div_card_bodyA1.append(div_input_radioA1);
      div_input_radioA1.append(input_radio_mesA1);
      div_input_radioA1.append(label_radio_mesA1);
      div_input_radioA1.append(p_radio_mesA1);
    }
  }

  // A3 Certificado + Leitor ROW

  let array_A3_3 = data.filter(
    (d) => d.tipo_cert_id == 3 && d.categoria_cert_id == tipo_cert_ref
  );
  let countA3_3 = array_A3_3.length;
  let rowA3_3 = row.cloneNode(true);
  rowA3_3.className += " mt-3 saa";

  if (!countA3_3) {
    let $A3_3 = document.getElementById("A32");
    span_d_inline2.className = " d-none";
    rowA3_3.className += " d-none";
  } else if (countA3_3) {
    for (i = 0; i < countA3_3; i++) {
      let div_cardA1 = div_card.cloneNode(true);
      let div_card_bodyA1 = div_card_body.cloneNode(true);
      let div_input_radioA1 = div_input_radio.cloneNode(true);
      let input_radio_mesA1 = input_radio_mes.cloneNode(true);
      let label_radio_mesA1 = label_radio_mes.cloneNode(true);
      let p_radio_mesA1 = p_radio_mes.cloneNode(true);
      let objA1 = array_A3_3[i];
      input_radio_mesA1.id += objA1.cod_produto;
      label_radio_mesA1.textContent += objA1.validade + " meses";
      if (objA1.cod_produto == "C01RPFA1SO03") {
        p_radio_mesA1.textContent += "R$ " + objA1.preco;
      } else {
        p_radio_mesA1.textContent += "R$ " + objA1.preco + ",00";
      }

      rowA3_3.appendChild(div_cardA1);
      div_cardA1.append(div_card_bodyA1);
      div_card_bodyA1.append(div_input_radioA1);
      div_input_radioA1.append(input_radio_mesA1);
      div_input_radioA1.append(label_radio_mesA1);
      div_input_radioA1.append(p_radio_mesA1);
    }
  }
  // A3 Certificado sem midia ROW

  let array_A3_4 = data.filter(
    (d) => d.tipo_cert_id == 4 && d.categoria_cert_id == tipo_cert_ref
  );
  let countA3_4 = array_A3_4.length;
  let rowA3_4 = row.cloneNode(true);
  rowA3_4.className += " mt-3";

  if (!countA3_4) {
    span_d_inline3.className = " d-none";
    rowA3_4.className += " d-none";
  } else if (countA3_4) {
    for (i = 0; i < countA3_4; i++) {
      let div_cardA1 = div_card.cloneNode(true);
      let div_card_bodyA1 = div_card_body.cloneNode(true);
      let div_input_radioA1 = div_input_radio.cloneNode(true);
      let input_radio_mesA1 = input_radio_mes.cloneNode(true);
      let label_radio_mesA1 = label_radio_mes.cloneNode(true);
      let p_radio_mesA1 = p_radio_mes.cloneNode(true);
      let objA1 = array_A3_4[i];

      input_radio_mesA1.id += objA1.cod_produto;
      label_radio_mesA1.textContent += objA1.validade + " meses";

      if (objA1.cod_produto == "C01RPFA1SO03") {
        p_radio_mesA1.textContent += "R$ " + objA1.preco;
      } else {
        p_radio_mesA1.textContent += "R$ " + objA1.preco + ",00";
      }

      rowA3_4.appendChild(div_cardA1);
      div_cardA1.append(div_card_bodyA1);
      div_card_bodyA1.append(div_input_radioA1);
      div_input_radioA1.append(input_radio_mesA1);
      div_input_radioA1.append(label_radio_mesA1);
      div_input_radioA1.append(p_radio_mesA1);
    }
  }
  // A3 Certificado sem midia ROW

  let array_A3_5 = data.filter(
    (d) => d.tipo_cert_id == 5 && d.categoria_cert_id == tipo_cert_ref
  );
  let countA3_5 = array_A3_5.length;
  let rowA3_5 = row.cloneNode(true);
  rowA3_5.className += " mt-3";

  if (!countA3_5) {
    span_d_inline4.className = " d-none";
    rowA3_5.className += " d-none";
  } else if (countA3_5) {
    for (i = 0; i < countA3_5; i++) {
      let div_cardA1 = div_card.cloneNode(true);
      let div_card_bodyA1 = div_card_body.cloneNode(true);
      let div_input_radioA1 = div_input_radio.cloneNode(true);
      let input_radio_mesA1 = input_radio_mes.cloneNode(true);
      let label_radio_mesA1 = label_radio_mes.cloneNode(true);
      let p_radio_mesA1 = p_radio_mes.cloneNode(true);
      let objA1 = array_A3_5[i];
      input_radio_mesA1.id += objA1.cod_produto;
      label_radio_mesA1.textContent += objA1.validade + " meses";
      if (objA1.cod_produto == "C01RPFA1SO03") {
        p_radio_mesA1.textContent += "R$ " + objA1.preco;
      } else {
        p_radio_mesA1.textContent += "R$ " + objA1.preco + ",00";
      }

      rowA3_5.appendChild(div_cardA1);
      div_cardA1.append(div_card_bodyA1);
      div_card_bodyA1.append(div_input_radioA1);
      div_input_radioA1.append(input_radio_mesA1);
      div_input_radioA1.append(label_radio_mesA1);
      div_input_radioA1.append(p_radio_mesA1);
    }
  }
  // A3 Certificado sem midia ROW

  let array_A3_6 = data.filter(
    (d) => d.tipo_cert_id == 6 && d.categoria_cert_id == tipo_cert_ref
  );
  let countA3_6 = array_A3_6.length;
  let rowA3_6 = row.cloneNode(true);
  rowA3_6.className += " mt-3";

  if (!countA3_6) {
    span_d_inline5.className = " d-none";
    rowA3_6.className += " d-none";
  } else if (countA3_6) {
    for (i = 0; i < countA3_6; i++) {
      let div_cardA1 = div_card.cloneNode(true);
      let div_card_bodyA1 = div_card_body.cloneNode(true);
      let div_input_radioA1 = div_input_radio.cloneNode(true);
      let input_radio_mesA1 = input_radio_mes.cloneNode(true);
      let label_radio_mesA1 = label_radio_mes.cloneNode(true);
      let p_radio_mesA1 = p_radio_mes.cloneNode(true);
      let objA1 = array_A3_6[i];
      input_radio_mesA1.id += objA1.cod_produto;
      label_radio_mesA1.textContent += objA1.validade + " meses";
      if (objA1.cod_produto == "C01RPFA1SO03") {
        p_radio_mesA1.textContent += "R$ " + objA1.preco;
      } else {
        p_radio_mesA1.textContent += "R$ " + objA1.preco + ",00";
      }

      rowA3_6.appendChild(div_cardA1);
      div_cardA1.append(div_card_bodyA1);
      div_card_bodyA1.append(div_input_radioA1);
      div_input_radioA1.append(input_radio_mesA1);
      div_input_radioA1.append(label_radio_mesA1);
      div_input_radioA1.append(p_radio_mesA1);
    }
  }

  let div_input_group = document.createElement("div");
  let div_input_prepend = document.createElement("div");
  let row_bottom = document.createElement("div");
  let input_cupom = document.createElement("input");
  let btn_cupom = document.createElement("button");
  div_input_group.className = "input-group cupom-div  mb-3 mt-4 ";
  div_input_prepend.className = "input-group-prepend";
  input_cupom.className = "form-control input-cupom ";
  input_cupom.id = "cupom";
  input_cupom.placeholder = "CUPOM DE DESCONTO";
  input_cupom.value = promocode_padrao;
  btn_cupom.className = "btn btn btn-cupom-cert  mb-auto ";
  btn_cupom.innerHTML = " Aplicar";
  btn_cupom.disabled = true;
  btn_cupom.id = "btn-cupom";
  let div_feedback = document.createElement("div");
  div_feedback.className = "invalid-feedback";
  div_feedback.textContent = "Você deve informar algum código";
  div_feedback.id = "feedback_cupom";
  let div_info_cupom = document.createElement("div");
  div_info_cupom.className = "info-cupom text-muted";
  div_info_cupom.textContent =
    "Você está recebendo um desconto de um cupom já aplicado!";

  row_bottom.className = "row col-lg-12";

  div_input_group.append(input_cupom);
  div_input_prepend.append(btn_cupom);
  div_input_group.appendChild(div_input_prepend);
  div_input_group.append(div_feedback);
  div_input_group.append(div_info_cupom);
  let cupom_res = document.createElement("input");
  cupom_res.id = "idres";
  cupom_res.value = "";
  cupom_res.hidden;

  // Card de Compra
  let div_card_compra = document.createElement("div");
  let div = document.createElement("div");
  let div2 = document.createElement("div");
  let h5 = document.createElement("h1");
  let div_img_card = document.createElement("div");
  let p_tipo_cert = document.createElement("p");
  let h4_nome_tipo = document.createElement("h3");
  let span_validade = document.createElement("span");
  let span_d_inline_card = span_d_inline.cloneNode(true);
  let preco_cheio = document.createElement("h2");
  let preco_desconto = document.createElement("h5");
  let parcela = document.createElement("p");
  preco_desconto.id = "preco-desconto";
  preco_cheio.innerHTML = "<b>R$ " + produto_inicial_tipo.preco + ",00</b>";
  preco_cheio.id = "preco-cheio";
  let x = Math.round(produto_inicial_tipo.preco / 20);
  let z = produto_inicial_tipo.preco / x;
  parcela.innerHTML =
    "apenas " + x + "x de R$ " + parseFloat(z.toFixed(2)) + "";
  parcela.id = "parcela";
  parcela.className = "parcela-cliente";
  h4_nome_tipo.innerHTML = "<b>" + produto_inicial_tipo.tipo_cert_name + "</b>";
  p_tipo_cert.innerHTML = "<b>" + produto_inicial_tipo.categoria_cert + "</b>";
  span_validade.innerHTML =
    " Validade: <b> " + produto_inicial_tipo.validade + " meses</b>";
  div.className = "div01-card";
  div_card_compra.className = "mt-3 pt-3 pl-5 pb-5 card  card-compra ";
  h5.innerHTML = "Certificado Selecionado:";
  h5.className = "elementor-heading-title elementor-size-default";
  div_img_card.className = "mt-5";
  p_tipo_cert.className = "strong";
  p_tipo_cert.id = "tipo-cert-cat";
  h4_nome_tipo.id = "tipo-cert-selec";
  span_validade.id = "validade";
  div2.id = "areaform";
  div2.className = "row ";
  div_card_compra.append(span_d_inline_card);
  span_d_inline_card.append(div);
  div.append(h5);
  div.append(div_img_card);
  div_img_card.append(p_tipo_cert);
  div_img_card.append(h4_nome_tipo);
  div_img_card.append(span_validade);
  div2.className = "div02-card d-block pt-5";

  div2.appendChild(preco_cheio);
  div2.appendChild(parcela);
  div2.append(div_input_group);
  span_d_inline_card.append(div2);
  row_bottom.appendChild(div_card_compra);

//MODAL MENSAGEM A3 SEM MIDIA
  let divModalBodyA3 = document.createElement("div");
  let divModalA3 = document.createElement("div");
  let divModalDialogA3 = document.createElement("div");
  let divModalContentA3 = document.createElement("div");
  let divModalHeaderA3 = document.createElement("div");
  let modalTitleA3 = document.createElement("h4");
  let close_modal_btnA3 = document.createElement("button");
  let span_XA3 = document.createElement("span");
  let body_row = document.createElement("div");
  let p_A3_body = document.createElement("p");
  divModalA3.className = "modal fade";
  divModalA3.id = "modalA3";
  divModalA3.setAttribute("role", "dialog");
  divModalA3.setAttribute("tabindex", "-1");
  divModalA3.setAttribute("aria-hidden", "true");

  divModalDialogA3.className = "modal-dialog  modal-md";
  divModalDialogA3.setAttribute("role", "document");

  divModalContentA3.className = "modal-content modal-md modal-form-compra";

  divModalBodyA3.className = "modal-body";
  divModalHeaderA3.className = "modal-header modal-header-compra";

  let tituloA3 = document.createElement("h3");
  tituloA3.innerHTML = "AVISO";
  tituloA3.style = "text-align: center;color: darkgoldenrod;";
  divModalBodyA3.append(tituloA3);

  let paragrafoA3 = document.createElement("p");
  paragrafoA3.innerHTML = "Na compra de um Certificado Mídia somente certificado, verifique dispositivos compatíveis Com estas informações:<br> Atenção! Dispositivos compatíveis com a emissão de um certificado (Somente Certificado)";
  paragrafoA3.style = "text-align: center;"
  divModalBodyA3.append(paragrafoA3);

  let listaA3 = document.createElement("ul");
  listaA3.style = "text-align: center;list-style-type: none;font-size: 15px;"
  listaA3.innerHTML = `<li>Cartões Smartcard SafeSign</li>
<li>Tokens: Gemalto / G&amp;D / Morpho</li>
<li>Além do dispositivo estar na lista mencionada acima, o solicitante deverá ter o PIN<br> e o PUK do dispositivo e estas senhas não encontrarem-se bloqueadas.
</li>`;
  divModalBodyA3.append(listaA3);

  let divButtonFecharA3 = document.createElement("div")
  divButtonFecharA3.style = "text-align: center";
  let buttonFecharA3 = document.createElement("div");
  buttonFecharA3.className = "btn btn-success mb-3";
  buttonFecharA3.innerHTML = "CONTINUAR";
  buttonFecharA3.setAttribute("data-dismiss", "modal");
  divButtonFecharA3.append(buttonFecharA3);
  divModalBodyA3.append(divButtonFecharA3);

  //modal header
  modalTitleA3.className = "modal-title";
  modalTitleA3.style.color = "white";
  modalTitleA3.innerText = "Aplicação de A3";
  close_modal_btnA3.className = "close btn-lg";
  close_modal_btnA3.setAttribute("data-dismiss", "modal");
  close_modal_btnA3.setAttribute("aria-label", "Fechar");
  span_XA3.setAttribute("aria-hidden", "true");
  span_XA3.innerHTML = "&times";
  span_XA3.className = "text-white";

  container.append(h1);
  container.append(span_muted);
  container.append(row0);
  row0.append(col_3);
  row0.append(col_9);
  divModalA3.appendChild(divModalDialogA3);
  divModalDialogA3.appendChild(divModalContentA3);
  divModalBodyA3.appendChild(body_row);
  body_row.append(p_A3_body);
  divModalContentA3.append(divModalHeaderA3);
  //Modal header

  divModalHeaderA3.append(modalTitleA3);
  close_modal_btnA3.append(span_XA3);
  divModalHeaderA3.append(close_modal_btnA3);
  divModalContentA3.append(divModalBodyA3);
  // let input_checked=document.getElementById(codprodInicial)
  // console.log(input_checked)
  // input_checked.checked=true;
  row0.append(divModalA3);
  
  //MODAL CADASTRO DE CUPOM
  let divModalBodyCupom = document.createElement("div");
  let divModalCupom = document.createElement("div");
  let divModalDialogCupom = document.createElement("div");
  let divModalContentCupom = document.createElement("div");
  let divModalHeaderCupom = document.createElement("div");
  let modalTitleCupom = document.createElement("h4");
  let close_modal_btnCupom = document.createElement("button");
  let span_XCupom = document.createElement("span");
  let p_cupom_body = document.createElement("p");
  divModalCupom.className = "modal fade";
  divModalCupom.id = "modalCupom";
  divModalCupom.setAttribute("role", "dialog");
  divModalCupom.setAttribute("tabindex", "-1");
  divModalCupom.setAttribute("aria-hidden", "true");

  divModalDialogCupom.className = "modal-dialog  modal-xl";
  divModalDialogCupom.setAttribute("role", "document");

  divModalContentCupom.className = "modal-content modal-xl modal-form-compra";

  divModalBodyCupom.className = "modal-body";
  divModalHeaderCupom.className = "modal-header modal-header-compra";

  //modal header
  modalTitleCupom.className = "modal-title";
  modalTitleCupom.innerText = "Aplicação de Cupom";
  close_modal_btnCupom.className = "close btn-lg";
  close_modal_btnCupom.setAttribute("data-dismiss", "modal");
  close_modal_btnCupom.setAttribute("aria-label", "Fechar");
  span_XCupom.setAttribute("aria-hidden", "true");
  span_XCupom.innerHTML = "&times";
  span_XCupom.className = "text-white";

  container.append(h1);
  container.append(span_muted);
  container.append(row0);
  row0.append(col_3);
  row0.append(col_9);
  divModalCupom.appendChild(divModalDialogCupom);
  divModalDialogCupom.appendChild(divModalContentCupom);
  divModalBodyCupom.appendChild(body_row);
  body_row.append(p_cupom_body);
  divModalContentCupom.append(divModalHeaderCupom);
  //Modal header

  divModalHeaderCupom.append(modalTitleCupom);
  close_modal_btnCupom.append(span_XCupom);
  divModalHeaderCupom.append(close_modal_btnCupom);
  divModalContentCupom.append(divModalBodyCupom);
  // let input_checked=document.getElementById(codprodInicial)
  // console.log(input_checked)
  // input_checked.checked=true;
  row0.append(divModalCupom);
  row0.append(row_bottom);
  col_3.append(span_d_inline0);
  col_3.append(span_d_inline1);
  col_3.append(span_d_inline2);
  col_3.append(span_d_inline3);
  col_3.append(span_d_inline4);
  col_3.append(span_d_inline5);
  col_9.append(rowA1);
  col_9.append(rowA3_2);
  col_9.append(rowA3_3);
  col_9.append(rowA3_4);
  col_9.append(rowA3_5);
  col_9.append(rowA3_6);

  $(document).ready(function () {
    var promocode = document.getElementById("promocode");
    let codProduto = document.getElementById("cod_prod_form");

    let promocode_padrao = "153GHJEK";
    var url_string = window.location.href;
    var url = new URL(url_string);

    let tipoInputCert = url.searchParams.get("tipo");
    if (tipoInputCert) {
      document.getElementById("tipo_cert_ref").value = tipoInputCert;
    }
    var c = url.searchParams.get("promocode");
    if (c) {
      promocode_padrao = c;
    }

    $("#btn-cupom").on("click", function () {
      $this = $("#btn-cupom");

      var btn_cupom_enviando = document.getElementById("btn-cupom");
      $this.prop("disabled", true);
      btn_cupom_enviando.innerHTML = "Enviando...";

      var validade = document.getElementById("validade");
      var parcela = document.getElementById("parcela");
      var parcela_form_ = $("#parcela_form");
      var inputCupom = $("#cupom");
      var val_leng_cupom = inputCupom.val().length;
      if (val_leng_cupom < 4) {
        inputCupom.addClass("required");
        btn_cupom_enviando.innerHTML = "Aplicar";
        div_feedback.style = "display:block;";

        div_info_cupom.style = "display:none";
        $this.prop("disabled", false);
        return;
      } else {
        btn_cupom_enviando.innerHTML = "Aplicar";
        $this.prop("disabled", false);
        div_feedback.style = "display:none;";
        inputCupom.removeClass("required");

        $.ajax({
          url: "https://app.pjfit.com.br/api/cert/v1/consultatablePrice",
          type: "GET",
          data: {
            promocode: inputCupom.val(),
            cod_produto: codProduto.value,
          },
          success: function (response) {
            // you can see the result from the console
            // tab of the developer tools
            //	 var arr= JSON.parse(response)
            console.log(response);
            var obj = response;
            var preco_cheio = document.getElementById("preco-cheio");
            var antigo_preco = preco_cheio.innerHTML;
            var preco_novo = obj.valor_produto;
            if (obj.erro) {
              var Mensagem = obj.erro.mensagem;
              p_cupom_body.innerText = Mensagem;
              preco_cheio.innerHTML = "<b>" + antigo_preco + "</b>";
            }
            if (!obj.erro) {
              var Mensagem = obj.message;
              preco_cheio.innerHTML = "<b>R$ " + preco_novo + "</b>";
              p_cupom_body.innerHTML =
                "O cupom foi cadastrado com <b>" +
                Mensagem +
                " </b> <br>  <div class='d-inline-flex'><div> Preço Antigo:  " +
                antigo_preco +
                "</div> <div class='ml-5'> Preço Novo: <b>R$ " +
                preco_novo +
                "</b></div></div> ";
              if ($("#parcela").length != 0) {
                parcela_form_.empty();
              }

              let produto = data.filter(
                (d) => d.cod_produto === codProduto.value
              );
              let produtoObj = produto[0];
              var tipo_cert_selec = document.getElementById("tipo-cert-selec");
              var tipo_cert_cat = document.getElementById("tipo-cert-cat");
              var validade = document.getElementById("validade");
              var preco_cheio = document.getElementById("preco-cheio");
              var parcela = document.getElementById("parcela");
              preco_produto = preco_novo;
              if (produtoObj.cod_produto == "C01RPFA1SO03")
                preco_produto = "59.90";
              var numparcela = preco_produto / 20;
              cod_prod = produtoObj.cod_produto;
              if (numparcela > 12) {
                numparcela = 12;
              }

              var precoparcela = preco_produto / Math.trunc(numparcela);
              var numparcelaRound = Math.trunc(numparcela);

              $("#cod_prod_form").val(cod_prod);
              $("#valor_form").val(preco_produto);
              let valorForm = $("#valor_form").val();
              tipo_cert_selec.innerHTML =
                "<b>" + produtoObj.tipo_cert_name + "</b>";
              tipo_cert_cat.innerHTML =
                "<b>" + produtoObj.categoria_cert + "</b>";
              validade.innerHTML =
                " Validade: <b>" + produtoObj.validade + " meses</b>";
              parcela.innerHTML =
                " apenas " +
                numparcelaRound +
                "x de R$ " +
                parseFloat(precoparcela.toFixed(2));
              preco_cheio.innerHTML = "<b>R$ " + preco_produto + "</b>";
              //limpa as parcelas antes de criar outra
              if ($("#parcela").length != 0) {
                parcela_form_.empty();
              }
              for (i = 0; i < numparcelaRound; i++) {
                let parcela_option = document.createElement("option");
                parcela_option.id = "parcela";
                if (produtoObj.cod_produto == "C01RPFA1SO03")
                  preco_produto = "59.90";
                let preco_parcela_form = preco_produto / (i + 1);

                parcela_option.innerHTML =
                  i +
                  1 +
                  "x de R$ " +
                  parseFloat(preco_parcela_form.toFixed(2)) +
                  "&nbsp;";
                if (i == 0) {
                  parcela_option.selected;
                }
                parcela_option.value = i + 1;

                parcela_form_.append(parcela_option);
              }
            }
            $("#promocode").val(inputCupom.val());
            console.log(obj.erro);
            $this.innerHTML = $("#btn-cupom");
            $("#modalCupom").modal("show");
          },
          error: function (response) {
            $("#modalCupom").modal("show");
            p_cupom_body.innerText = "Error";
            console.log(response);
          },
        });
      }
    });

    $(".input-radio").change(function () {
      if (promocode.length == 0 || !promocode) {
        promocode = promocode_padrao;
        console.log(promocode);
      }

      if($(this).attr("id").match(/(A3SE\d)\w+/g)){
        $('#modalA3').modal('show')
      }


      var $this = $(this);
      var $id_prod = $(this).attr("id");
      // Only remove the class in the specific `box` that contains the radio
      $this
        .closest(".tipo-meses")
        .find("div.highlight")
        .removeClass("highlight");
      $this.closest(".card").addClass("highlight");
      let produto = data.filter((d) => d.cod_produto === $id_prod);
      let produtoObj = produto[0];
      var tipo_cert_selec = document.getElementById("tipo-cert-selec");
      var tipo_cert_cat = document.getElementById("tipo-cert-cat");
      var validade = document.getElementById("validade");
      var preco_cheio = document.getElementById("preco-cheio");
      var parcela = document.getElementById("parcela");
      var parcela_form_ = $("#parcela_form");
      var preco_desconto = document.getElementById("preco-desconto");
      preco_produto = produtoObj.preco;
      let promocode_value = promocode.value;
      cod_prod = produtoObj.cod_produto;
      $.ajax({
        url: "https://app.pjfit.com.br/api/cert/v1/consultatablePrice",
        type: "GET",
        data: {
          promocode: promocode_value,
          cod_produto: cod_prod,
        },
        success: function (response) {
          // you can see the result from the console
          // tab of the developer tools
          //	 var arr= JSON.parse(response)
          console.log(response);
          var obj = response;
          var preco_cheio = document.getElementById("preco-cheio");
          var antigo_preco = preco_cheio.innerHTML;
          var preco_novo = obj.valor_produto;
          if (obj.erro) {
            var Mensagem = obj.erro.mensagem;
            promocode.value = promocode_padrao;
            preco_produto.value = produtoObj.preco;
            console.log("erro");
          }
          if (!obj.erro) {
            preco_produto = preco_novo;
            if (produtoObj.cod_produto == "C01RPFA1SO03")
              preco_produto = "59.90";
            var numparcela = preco_produto / 20;

            if (numparcela > 12) {
              numparcela = 12;
            }

            var precoparcela = preco_produto / Math.trunc(numparcela);
            var numparcelaRound = Math.trunc(numparcela);

            $("#cod_prod_form").val(cod_prod);
            $("#valor_form").val(preco_produto);
            let valorForm = $("#valor_form").val();
            tipo_cert_selec.innerHTML =
              "<b>" + produtoObj.tipo_cert_name + "</b>";
            tipo_cert_cat.innerHTML =
              "<b>" + produtoObj.categoria_cert + "</b>";
            validade.innerHTML =
              " Validade: <b>" + produtoObj.validade + " meses</b>";
            parcela.innerHTML =
              " apenas " +
              numparcelaRound +
              "x de R$ " +
              parseFloat(precoparcela.toFixed(2));
            preco_cheio.innerHTML = "<b>R$ " + preco_produto + "</b>";
            //limpa as parcelas antes de criar outra
            if ($("#parcela").length != 0) {
              parcela_form_.empty();
            }
            for (i = 0; i < numparcelaRound; i++) {
              let parcela_option = document.createElement("option");
              parcela_option.id = "parcela";
              if (produtoObj.cod_produto == "C01RPFA1SO03")
                preco_produto = "59.90";
              let preco_parcela_form = preco_produto / (i + 1);

              parcela_option.innerHTML =
                i +
                1 +
                "x de R$ " +
                parseFloat(preco_parcela_form.toFixed(2)) +
                "&nbsp;";
              if (i == 0) {
                parcela_option.selected;
              }
              parcela_option.value = i + 1;

              parcela_form_.append(parcela_option);
            }
          }
          preco_cheio.innerHTML = "<b>R$ " + preco_novo + "</b>";
        },
        error: function (response) {
          console.log(response);
        },
      });

      console.log("saida do ajax preco", preco_produto);
    });
  });

  let link_css = document.createElement("link");
  link_css.href =
    "https://app.pjfit.com.br/api/cert/v1/integracao/css_integracao";
  link_css.rel = "stylesheet";
  link_css.type = "text/css";
  document.body.appendChild(link_css);

  let divForm = document.getElementById("areaform");
  let form = document.createElement("form");
  let input_name = document.createElement("input");
  let div01 = document.createElement("div");
  let button = document.createElement("button");
  //Modal
  let divModal = document.createElement("div");
  let divModalDialog = document.createElement("div");
  let divModalContent = document.createElement("div");
  let divModalBody = document.createElement("div");
  let divModalHeader = document.createElement("div");
  //modal Header
  let h5_modalTittle = document.createElement("h5");
  let close_modal_btn = document.createElement("button");
  let span_X = document.createElement("span");
  let modalTitle = document.createElement("span");
  let tipoCert = document.createElement("input");
  let div_step1 = document.createElement("div");
  let div_step2 = document.createElement("div");
  let div_step3 = document.createElement("div");
  let div_step4 = document.createElement("div");
  let h5_identificacao = document.createElement("h5");
  let hr = document.createElement("hr");
  //CONSULTA
  let div_row = document.createElement("div");
  let div_cpf = document.createElement("div");
  let label_cpf = document.createElement("label");
  let input_cpf = document.createElement("input");
  let div_birthday = document.createElement("div");
  let label_birthday = document.createElement("label");
  let input_birthday = document.createElement("input");
  let div_consulta_btn = document.createElement("div");
  let consulta_btn = document.createElement("button");
  let h3_Consulta_CPF = document.createElement("h3");
  //IDENTIFICAÇÃO
  let div_row_id = document.createElement("div");
  let div_nome = document.createElement("div");
  let label_nome = document.createElement("label");
  let input_nome = document.createElement("input");
  let div_nome_emp = document.createElement("div");
  let label_nome_emp = document.createElement("label");
  let input_nome_emp = document.createElement("input");
  let div_nome_rep = document.createElement("div");
  let label_nome_rep = document.createElement("label");
  let input_nome_rep = document.createElement("input");
  let div_email = document.createElement("div");
  let label_email = document.createElement("label");
  let input_email = document.createElement("input");
  let div_email2 = document.createElement("div");
  let label_email2 = document.createElement("label");
  let input_email2 = document.createElement("input");
  let div_tipo_doc = document.createElement("div");
  let label_tipo_doc = document.createElement("label");
  let select_tipo_doc = document.createElement("select");
  let div_num_doc = document.createElement("div");
  let label_num_doc = document.createElement("label");
  let input_num_doc = document.createElement("input");
  let div_telefone = document.createElement("div");
  let label_telefone = document.createElement("label");
  let input_telefone_area = document.createElement("input");
  let input_telefone = document.createElement("input");
  let div_senha = document.createElement("div");
  let label_senha = document.createElement("label");
  let input_senha = document.createElement("input");
  let div_senha2 = document.createElement("div");
  let label_senha2 = document.createElement("label");
  let input_senha2 = document.createElement("input");
  let div_nota_senha = document.createElement("div");
  //step 3
  let h5_endereco = document.createElement("h5");
  let div_row_end = document.createElement("div");
  let div_cep = document.createElement("div");
  let label_cep = document.createElement("label");
  let input_cep = document.createElement("input");
  let div_uf = document.createElement("div");
  let label_uf = document.createElement("label");
  let input_uf = document.createElement("input");
  let div_municipio = document.createElement("div");
  let label_municipio = document.createElement("label");
  let input_municipio = document.createElement("input");
  let div_mun_ibge = document.createElement("div");
  let label_mun_ibge = document.createElement("label");
  let input_mun_ibge = document.createElement("input");
  let div_endereco = document.createElement("div");
  let label_endereco = document.createElement("label");
  let input_endereco = document.createElement("input");
  let div_bairro = document.createElement("div");
  let label_bairro = document.createElement("label");
  let input_bairro = document.createElement("input");
  let div_numero = document.createElement("div");
  let label_numero = document.createElement("label");
  let input_numero = document.createElement("input");
  let div_complemento = document.createElement("div");
  let label_complemento = document.createElement("label");
  let input_complemento = document.createElement("input");

  //Step 4
  let div_row_pag = document.createElement("div");
  let h5_forma_pag = document.createElement("h5");
  let div_boleto = document.createElement("div");
  let div_boleto_radio = document.createElement("div");
  let input_boleto = document.createElement("input");
  let label_boleto = document.createElement("label");
  let div_cartao = document.createElement("div");
  let div_cartao_radio = document.createElement("div");
  let label_cartao = document.createElement("label");
  let input_cartao = document.createElement("input");

  let div_row_cartao = document.createElement("div");
  let div_col_cartao = document.createElement("div");
  let div_num_cartao = document.createElement("div");
  let label_cartao_num = document.createElement("label");
  let input_num_cartao = document.createElement("input");
  let div_tit = document.createElement("div");
  let label_tit = document.createElement("label");
  let input_tit = document.createElement("input");
  let div_val_mes = document.createElement("div");
  let label_val_mes = document.createElement("label");
  let input_val_mes = document.createElement("input");
  let div_val_ano = document.createElement("div");
  let label_val_ano = document.createElement("label");
  let input_val_ano = document.createElement("input");
  let div_cod_seg = document.createElement("div");
  let label_cod_seg = document.createElement("label");
  let input_cod_seg = document.createElement("input");
  let div_parcela = document.createElement("div");
  let label_parcela = document.createElement("label");
  let select_parcela = document.createElement("select");
  let h5_pagamento = document.createElement("h5");
  let div_pag_col = document.createElement("div");
  let div_row_btns = document.createElement("div");
  let div_col_collapse = document.createElement("div");
  let cod_prod_form = document.createElement("input");
  let promocode_form = document.createElement("input");
  let valor_form = document.createElement("input");
  let cnpj_form = document.createElement("input");
  let div_step5 = document.createElement("div");
  //botões abaixo
  let next_btn = document.createElement("button");
  let previous_btn = document.createElement("button");
  let div_prev_next = document.createElement("div");

  promocode_form.hidden = "true";
  promocode_form.id = "promocode";
  promocode_form.name = "promocode";
  promocode_form.value = promocode_padrao;
  cod_prod_form.hidden = "true";
  cod_prod_form.id = "cod_prod_form";
  cod_prod_form.name = "cod_prod_form";
  cod_prod_form.value = produto_inicial_tipo.cod_produto;
  valor_form.hidden = "true";
  valor_form.id = "valor_form";
  valor_form.name = "valor_form";
  valor_form.value = produto_inicial_tipo.preco;
  divModal.className = "modal fade";
  divModal.id = "modalExemplo";
  divModal.setAttribute("role", "dialog");
  divModal.setAttribute("tabindex", "-1");
  divModal.setAttribute("aria-hidden", "true");

  divModalDialog.className = "modal-dialog modal-dialog-compra modal-xl";
  divModalDialog.setAttribute("role", "document");

  divModalContent.className = "modal-content modal-xl modal-form-compra";

  divModalBody.className = "modal-body";
  divModalHeader.className = "modal-header modal-header-compra";

  div_prev_next.className = "row text-center d-inline mb-5";
  next_btn.className = "btn btn-compra-cert ml-3";
  next_btn.id = "next";
  next_btn.innerHTML = "Próximo";
  previous_btn.className = "btn btn-outline-dark";
  previous_btn.id = "prev";
  previous_btn.innerHTML = "Anterior";

  div_prev_next.append(previous_btn);
  div_prev_next.append(next_btn);
  //modal header
  modalTitle.className = "modal-title title-form";
  modalTitle.innerText = "Compra de Certificado";
  close_modal_btn.className = "close btn-lg";
  close_modal_btn.setAttribute("data-dismiss", "modal");
  close_modal_btn.setAttribute("aria-label", "Fechar");
  span_X.setAttribute("aria-hidden", "true");
  span_X.innerHTML = "&times";
  span_X.className = "text-white";
  div01.className = "row no-gutters";
  form.id = "formCert";
  cnpj_form.id = "cnpj";
  cnpj_form.name = "cnpj";
  cnpj_form.hidden = true;
  cnpj_form.value = "";
  tipoCert.hidden = true;
  tipoCert.id = "tipo_cert_form";
  tipoCert.name = "tipoCert";
  if (tipo_cert_ref == 1 || tipo_cert_ref == 5 || tipo_cert_ref == 6)
    tipoCert.value = 1;
  else tipoCert.value = 2;
  let categoria_cert_form = document.createElement("input");
  categoria_cert_form.hidden = true;
  categoria_cert_form.id = "categoria_cert_form";
  categoria_cert_form.name = "categoria_cert_form";
  categoria_cert_form.value = tipo_cert_ref;
  form.appendChild(categoria_cert_form);
  form.append(tipoCert);
  form.append(valor_form);
  form.appendChild(promocode_form);

  if (tipoCert.value == "1") {
    div_step1.className = "step mt-5";
    div_step1.id = "step_1";
    h5_identificacao.innerHTML = "Identificacão";
    h3_Consulta_CPF.innerHTML = "Consulta CPF na Receita federal";

    div_row.className = "row p-5";

    div_cpf.className = "col";
    label_cpf.innerHTML = "CPF:";
    input_cpf.className = " form-control";
    input_cpf.type = "text";
    input_cpf.placeholder = "CPF";
    input_cpf.name = "cpf";
    input_cpf.id = "cpf";
    input_cpf.required = "true";

    //div  data nascimento
    div_birthday.className = "col";
    label_birthday.innerHTML = "Data de Nascimento:";
    input_birthday.className = "form-control ";
    input_birthday.type = "text";
    input_birthday.name = "data_nascimento";
    input_birthday.id = "data_nascimento";
    input_birthday.required = "true";
    input_birthday.placeholder = "Data de Nascimento";
    //div botão de consulta
    let div_alert_ = document.createElement("div");
    div_alert_.id = "div_alert_";

    div_consulta_btn.className = "text-center mb-5";
    div_consulta_btn.id = "div_consulta_btn";
    consulta_btn.className = "btn btn-lg btn-consultar";
    consulta_btn.id = "submitConsulta";
    consulta_btn.innerHTML = " Consultar";

    div_step2.className = "step";
    div_step2.id = "step_2";
    div_row_id.className = "row px-5";
    div_nome.className = "col-6 form-group";
    label_nome.innerHTML = "Nome Completo:";
    input_nome.className = "form-control";
    input_nome.id = "nome_completo";
    input_nome.name = "nome_completo";
    input_nome.readOnly = true;
    input_nome.required;
    input_nome.placeholder = "Nome Completo";
    input_nome.type = "text";
    //Email
    div_email.className = "col-6 form-group";
    label_email.innerHTML = "Email:";
    input_email.className = "form-control";
    input_email.id = "email1";
    input_email.name = "email";
    input_email.required;
    input_email.placeholder = "Email";
    input_email.type = "text";
    //Email2
    div_email2.className = "col-6 form-group";
    label_email2.innerHTML = "Confirmação de Email:";
    input_email2.className = "form-control";
    input_email2.id = "email2";
    input_email2.name = "email2";
    input_email2.required;
    input_email2.placeholder = "Confirmação de Email";
    input_email2.type = "text";
    //Tipo Documento
    div_tipo_doc.className = "col-6 form-group";
    label_tipo_doc.innerHTML = "Documento de Identificação com foto:";
    select_tipo_doc.className = "col-12";
    select_tipo_doc.id = "tipoDoc";
    select_tipo_doc.name = "tipoDoc";
    select_tipo_doc.required;
    let option_doc1 = document.createElement("option");
    option_doc1.selected;
    option_doc1.disabled;
    option_doc1.innerText = "Selecione um tipo de documento...";
    let option_doc2 = document.createElement("option");
    option_doc2.value = "CNH";
    option_doc2.innerText = "Carteira Nacional de Habilitação";
    let option_doc3 = document.createElement("option");
    option_doc3.value = "RG";
    option_doc3.innerText = "Identidade(Registro Geral)";
    let option_doc4 = document.createElement("option");
    option_doc4.value = "CTPS";
    option_doc4.innerText = "Carteira de Trabalho e Previdência Social";
    let option_doc5 = document.createElement("option");
    option_doc5.value = "CRM";
    option_doc5.innerText = "Conselho Regional de Medicina";
    let option_doc6 = document.createElement("option");
    option_doc6.value = "";
    option_doc6.innerText = "Outro";
    select_tipo_doc.append(option_doc1);
    select_tipo_doc.append(option_doc2);
    select_tipo_doc.append(option_doc3);
    select_tipo_doc.append(option_doc4);
    select_tipo_doc.append(option_doc5);
    select_tipo_doc.append(option_doc6);
    //num Documento
    div_num_doc.className = "col-6 form-group";
    label_num_doc.innerHTML = "N° Documento de Indentificação:";
    input_num_doc.className = "form-control";
    input_num_doc.id = "documento_identificacao";
    input_num_doc.name = "documento_identificacao";
    input_num_doc.required;
    input_num_doc.placeholder = "Número de Documento de Identificação";
    input_num_doc.type = "text";
    //Telefone
    div_telefone.className = "row form-group col-6 ml-1";
    label_telefone.innerHTML = "Telefone:";
    label_telefone.className = "col-12";
    input_telefone_area.className = "form-control col-2 mr-2";
    input_telefone_area.setAttribute("maxlength", "3");
    input_telefone_area.id = "telefone_area";
    input_telefone_area.name = "telefone_area";
    input_telefone_area.required;
    input_telefone_area.placeholder = "DDD";
    input_telefone_area.type = "text";
    input_telefone.className = "form-control col-6";
    input_telefone.id = "telefone";
    input_telefone.name = "telefone";
    input_telefone.required;
    input_telefone.placeholder = "Telefone";
    input_telefone.type = "text";
    //senha gerenciamento
    div_senha.className = "col-6 form-group";
    label_senha.innerHTML = "Senha de Gerenciamento:";
    input_senha.className = "form-control";
    input_senha.name = "passhphrase";
    input_senha.id = "passhphrase";
    input_senha.required;
    input_senha.setAttribute("maxlength", "10");
    input_senha.setAttribute("minlength", "6");
    input_senha.type = "text";
    input_senha.placeholder = "Senha de Gerenciamento";
    //confirmacao senha
    div_senha2.className = "col-6 form-group";
    label_senha2.innerHTML = "Confirmação de Senha Gerenciamento:";
    input_senha2.className = "form-control";
    input_senha2.id = "password2";
    input_senha2.required;
    input_senha2.setAttribute("maxlength", "10");
    input_senha2.setAttribute("minlength", "5");
    input_senha2.type = "text";
    input_senha2.placeholder = "Confirmação Senha de Gerenciamento";
    //Nota
    div_nota_senha.className = "alert alert-info mt-2 mb-2";
    div_nota_senha.setAttribute("role", "alert");
    div_nota_senha.innerHTML =
      "<b>Nota :</b> Esta senha é usada para a gestão do certificado (emissão, revogação, etc...), deve ser diferente da senha de acesso ao site. Por favor guarde-a com você pois vai ser necessária no futuro. A senha deve conter apenas letras ou números entre 6 e 10 caracteres.";

    // step 3
    div_step3.className = "step";
    div_step3.id = "step_3";
    h5_endereco.innerHTML = "Endereço";
    div_row_end.className = "row p-5";
    div_cep.className = "col-5  form-group";
    label_cep.innerHTML = "Cep:";
    input_cep.className = "form-control";
    input_cep.required;
    input_cep.name = "cep";
    input_cep.id = "cep";
    input_cep.setAttribute("maxlength", "9");
    input_cep.placeholder = "CEP";
    input_cep.type = "text";

    div_uf.className = "form-group col-2";
    label_uf.innerHTML = "Estado:";
    input_uf.readOnly = true;
    input_uf.className = "form-control";
    input_uf.required;
    input_uf.name = "uf";
    input_uf.id = "uf";
    input_uf.setAttribute("maxlength", "2");
    input_uf.placeholder = "SP";
    input_uf.type = "text";

    div_municipio.className = "form-group col-5";
    label_municipio.innerHTML = "Município:";
    input_municipio.className = "form-control";
    input_municipio.required;
    input_municipio.name = "cidade";
    input_municipio.id = "cidade";
    input_municipio.readOnly = true;
    input_municipio.placeholder = "São Paulo";
    input_municipio.type = "text";

    div_mun_ibge.className = "form-group";
    label_mun_ibge.innerHTML = "Município IBGE:";
    input_mun_ibge.className = "form-control";
    input_mun_ibge.required;
    input_mun_ibge.name = "ibge";
    input_mun_ibge.id = "ibge";
    input_mun_ibge.hidden = "true";
    input_mun_ibge.type = "text";

    div_endereco.className = "form-group col-5";
    label_endereco.innerHTML = "Endereço:";
    input_endereco.className = "form-control";
    input_endereco.required;
    input_endereco.name = "rua";
    input_endereco.id = "rua";
    input_endereco.placeholder = "Endereço";
    input_endereco.readOnly = true;
    input_endereco.type = "text";

    div_bairro.className = "form-group col-5";
    label_bairro.innerHTML = "Bairro:";
    input_bairro.className = "form-control";
    input_bairro.required;
    input_bairro.name = "bairro";
    input_bairro.id = "bairro";
    input_bairro.placeholder = "Bairro";
    input_bairro.readOnly = true;
    input_bairro.type = "text";

    div_numero.className = "form-group col-2";
    label_numero.innerHTML = "Número:";
    input_numero.className = "form-control";
    input_numero.required;
    input_numero.name = "numero";
    input_numero.id = "numero";
    input_numero.placeholder = "Número";
    input_numero.type = "text";

    div_complemento.className = "form-group col-12";
    label_complemento.innerHTML = "Complemento:";
    input_complemento.className = "form-control";
    input_complemento.required;
    input_complemento.name = "complemento";
    input_complemento.id = "complemento";
    input_complemento.placeholder = "Complemento";
    input_complemento.type = "text";

    //Step 4

    div_step4.className = "step";
    div_step4.id = "step_4";
    div_pag_col.className = "col-12 form-group";
    div_row_btns.className = "row";
    div_row_pag.className = "row p-5";
    div_boleto.className = "row";
    div_cartao.className = "row  collapse";
    div_cartao.id = "collapseCartao";
    div_col_collapse.className = " col";
    let div_metodos_pag = document.createElement("div");
    div_metodos_pag.className = "d-inline-flex";
    let div_boleto_side = document.createElement("div");
    let div_cartao_side = document.createElement("div");
    div_boleto_side.className = "col";
    div_boleto_side.name = "divboletoside";
    div_cartao_side.className = "col";
    div_cartao_side.name = "divcartaoside";
    div_boleto_radio.className = "form-group col-sm-6";
    div_cartao_radio.className = "form-group col-sm-6";
    label_boleto.className = "ml-3 form-check-label";
    label_boleto.innerHTML = "Boleto";
    input_boleto.className = "";
    input_boleto.setAttribute("data-toggle", "collapse");
    input_boleto.setAttribute("data-target", "#collapseExample");
    input_boleto.setAttribute("aria-expanded", "false");
    input_boleto.setAttribute("aria-controls", "collapseExample");
    input_boleto.value = "";
    input_boleto.name = "metodopagamento";
    input_boleto.id = "boleto";
    input_boleto.type = "radio";
    input_boleto.value = "boleto";
    input_cartao.className = " ";
    input_cartao.type = "radio";
    input_cartao.setAttribute("data-toggle", "collapse");
    input_cartao.setAttribute("data-target", "#collapseCartao");
    input_cartao.value = "credito";
    input_cartao.name = "metodopagamento";
    input_cartao.id = "credito";
    label_cartao.className = "ml-3 form-check-label";
    label_cartao.innerHTML = "Cartão de Crédito";

    div_num_cartao.className = "col-12 form-group";
    label_cartao_num.innerHTML = "Número do Cartão";
    input_num_cartao.className = "form-control";
    input_num_cartao.name = "numerocartao";
    input_num_cartao.id = "numerocartao";
    input_num_cartao.placeholder = "Número";
    input_num_cartao.type = "text";

    div_tit.className = "col-12 form-group";
    label_tit.innerHTML = "Titular do Cartão";
    input_tit.className = "form-control";
    input_tit.name = "titularCartao";
    input_tit.id = "titularCartao";
    input_tit.placeholder = "Titular";
    input_tit.type = "text";

    div_val_mes.className = "row form-group div_val_mes";
    label_val_mes.innerHTML = "Validade Mês";
    input_val_mes.className = "form-control col mr-3";
    input_val_mes.name = "valMes";
    input_val_mes.id = "valMes";
    input_val_mes.placeholder = "Validade Mês";
    input_val_mes.setAttribute("maxlength", "2");
    input_val_mes.type = "text";

    div_val_ano.className = "col form-group";
    label_val_ano.innerHTML = "Validade Ano";
    input_val_ano.className = "form-control col mr-3";
    input_val_ano.name = "valAno";
    input_val_ano.id = "valAno";
    input_val_ano.placeholder = "Validade Ano";
    input_val_ano.setAttribute("maxlength", "2");
    input_val_ano.type = "text";

    div_cod_seg.className = "col-6 form-group";
    label_cod_seg.innerHTML = "Código de Segurança";
    input_cod_seg.className = "form-control col mr-3";
    input_cod_seg.name = "cvv";
    input_cod_seg.id = "cvv";
    input_cod_seg.placeholder = "CVV";
    input_cod_seg.setAttribute("maxlength", "3");
    input_cod_seg.type = "text";

    div_parcela.className = "col-12 form-group";
    label_parcela.innerHTML = "Parcelas";
    select_parcela.className = "col-12";
    select_parcela.name = "parcela";
    select_parcela.id = "parcela_form";
    select_parcela.placeholder = "Parcelas";
    let option_parcela_padrao = document.createElement("option");
    // option_parcela_padrao.selected;option_parcela_padrao.value='';option_parcela_padrao.innerHTML='Escolha ...'
    // option_parcela_padrao.disabled;
    //   select_parcela.append(option_parcela_padrao)
    let div_enviar = document.createElement("div");
    div_enviar.className = "col-12 text-center";
    div_enviar.id = "divenviar";

    let enviarForm = document.createElement("button");
    enviarForm.id = "CreateCert";
    enviarForm.innerHTML =
      'Finalizar Solicitação <i class="fas ml-3 fa-check"></i>';
    enviarForm.className = "btn-primary btn btn-lg col-4";
    enviarForm.hidden = true;

    div_enviar.append(enviarForm);
    button.className =
      "btn btn-compra-cert col btn-lg ml-auto mr-3 mt-auto mb-3";
    button.innerHTML = "Comprar Certificado";
    button.id = "comprar-certificado";
    button.setAttribute("data-toggle", "modal");
    button.setAttribute("data-target", "#modalExemplo");
    input_name.className = "form-control col-6";
    input_name.id = "name";

    //step 5 finalização do pedido
    let div_step5 = document.createElement("div");
    let div_fim = document.createElement("div");
    let text_fim = document.createElement("span");
    let input_orderid = document.createElement("input");
    let input_cpf_fim = document.createElement("input");
    let div_btn_order = document.createElement("div");
    let btn_getOrder = document.createElement("a");

    div_step5.className = " mt-5";
    div_step5.id = "step_5";
    div_step5.style = "display:none;";
    div_fim.className = " text-center";
    input_cpf_fim.className = "form-control col";
    input_orderid.id = "input_orderid";
    input_cpf_fim.id = "cpf_fim";
    input_orderid.className = "form-control col";
    div_btn_order.className = "row text-center";
    text_fim.id = "text-fim";
    text_fim.innerHTML = "";
    btn_getOrder.className = "btn btn-success btn-agendar mx-auto col-4";
    btn_getOrder.innerHTML =
      'Agendar Verificação <i class="fas fa-calendar-alt"></i>';
    btn_getOrder.href = "https://wa.me/message/5QFZ5UD5EFY3O1";
    div_fim.append(text_fim);
    div_btn_order.append(btn_getOrder);
    div_step5.append(div_fim);
    div_step5.append(div_btn_order);

    divModal.appendChild(divModalDialog);
    divModalDialog.appendChild(divModalContent);
    divModalContent.append(divModalHeader);

    //Modal header
    form.append(cod_prod_form);
    divModalHeader.append(modalTitle);
    close_modal_btn.append(span_X);
    divModalHeader.append(close_modal_btn);
    divModalContent.append(form);
    form.appendChild(divModalBody);
    divModalBody.append(div_step1);
    divModalBody.append(div_step2);
    divModalBody.append(div_step3);
    divModalBody.append(div_step4);
    divModalBody.append(div_step5);
    divModalContent.append(div_prev_next);
    //step 1
    div_step1.append();
    div_step1.append(div_row);
    div_row.append(div_cpf);
    div_row.append(div_birthday);
    div_step1.append(div_alert_);
    div_step1.append(div_consulta_btn);
    div_cpf.append(label_cpf);
    div_cpf.append(input_cpf);
    div_birthday.append(label_birthday);
    div_birthday.append(input_birthday);
    div_consulta_btn.append(consulta_btn);
    //step 2
    div_step2.append(h5_identificacao);
    div_step2.append(div_row_id);
    div_row_id.append(div_nome);
    div_row_id.append(div_telefone);
    div_row_id.append(div_email);
    div_row_id.append(div_email2);
    div_row_id.append(div_tipo_doc);
    div_row_id.append(div_num_doc);
    div_row_id.append(div_senha);
    div_row_id.append(div_senha2);
    div_nome.appendChild(label_nome);
    div_nome.append(input_nome);
    div_email.append(label_email);
    div_email.append(input_email);
    div_email2.append(label_email2);
    div_email2.append(input_email2);
    div_tipo_doc.append(label_tipo_doc);
    div_tipo_doc.append(select_tipo_doc);
    div_num_doc.append(label_num_doc);
    div_num_doc.append(input_num_doc);
    div_telefone.append(label_telefone);
    div_telefone.append(input_telefone_area);
    div_telefone.append(input_telefone);
    div_senha.append(label_senha);
    div_senha.append(input_senha);
    div_senha2.append(label_senha2);
    div_senha2.append(input_senha2);
    div_row_id.append(div_nota_senha);
    // step 3

    div_step3.append(h5_endereco);
    div_step3.append(div_row_end);
    div_row_end.append(input_mun_ibge);
    div_row_end.append(div_cep);
    div_cep.append(label_cep);
    div_cep.append(input_cep);
    div_row_end.append(div_uf);
    div_uf.append(label_uf);
    div_uf.append(input_uf);
    div_row_end.append(div_municipio);
    div_municipio.append(label_municipio);
    div_municipio.append(input_municipio);
    div_row_end.append(div_endereco);
    div_endereco.append(label_endereco);
    div_endereco.append(input_endereco);
    div_row_end.append(div_bairro);
    div_bairro.append(label_bairro);
    div_bairro.append(input_bairro);
    div_row_end.append(div_numero);
    div_numero.append(label_numero);
    div_numero.append(input_numero);
    div_row_end.append(div_complemento);
    div_complemento.append(label_complemento);
    div_complemento.append(input_complemento);

    //step 4
    div_step4.append(div_row_pag);
    div_row_pag.append(h5_pagamento);
    div_row_pag.append(div_pag_col);
    div_row_pag.append(div_metodos_pag);
    div_metodos_pag.append(div_boleto_side);
    div_metodos_pag.append(div_cartao_side);
    div_pag_col.append(div_row_btns);
    div_row_btns.append(div_boleto_radio);
    div_row_btns.append(div_cartao_radio);
    //  div_boleto.append(div_boleto_radio)

    div_boleto_radio.append(input_boleto);
    div_boleto_radio.append(label_boleto);
    div_cartao_radio.append(input_cartao);
    div_cartao_radio.append(label_cartao);
    div_row_pag.appendChild(div_boleto_side);
    div_row_pag.append(div_cartao_side);
    div_cartao_side.appendChild(div_cartao);
    div_cartao.append(div_col_collapse);
    div_col_collapse.append(div_num_cartao);
    div_num_cartao.append(label_cartao_num);
    div_num_cartao.append(input_num_cartao);
    div_col_collapse.append(div_tit);
    div_tit.append(label_tit);
    div_tit.append(input_tit);
    div_col_collapse.append(div_val_mes);
    //div_val_mes.append(label_val_mes)
    div_val_mes.append(input_val_mes);
    //div_val_mes.append(label_val_ano)
    div_val_mes.append(input_val_ano);
    //div_val_mes.append(label_cod_seg)
    div_val_mes.append(input_cod_seg);
    div_col_collapse.append(div_parcela);
    div_parcela.append(label_parcela);
    div_parcela.append(select_parcela);
    div_row_pag.append(div_enviar);

    div01.appendChild(button);
    divForm.append(button);
    divForm.append(divModal);
  }

  if (tipoCert.value == "2") {
    //Primeiro passo da compra com CPF e DATA NASCIMENTO para consultaRFB
    div_step1.className = "step mt-5";
    div_step1.id = "step_1";
    h5_identificacao.innerHTML =
      "<h3>Dados da Empresa Titular do Certificado </h3> <hr>";
    h5_identificacao.className = "col-12 mt-3 ml-3 p-0";
    h3_Consulta_CPF.innerHTML = "Consulta na Receita federal";

    div_row.className = "row p-5";

    div_cpf.className = "col";
    label_cpf.innerHTML = "CPF:";
    input_cpf.className = " form-control";
    input_cpf.type = "text";
    input_cpf.placeholder = "CPF";
    input_cpf.name = "cpf";
    input_cpf.id = "cpf";
    input_cpf.required = "true";

    //div  data nascimento
    div_birthday.className = "col";
    label_birthday.innerHTML = "Data de Nascimento:";
    input_birthday.className = "form-control ";
    input_birthday.type = "text";
    input_birthday.name = "data_nascimento";
    input_birthday.id = "data_nascimento";
    input_birthday.required = "true";
    input_birthday.placeholder = "Data de Nascimento";
    //CNPJ
    let label_cnpj = label_birthday.cloneNode(true);
    let div_cnpj = document.createElement("div");
    div_cnpj.className = "col-12 mt-3 ";

    label_cnpj.innerHTML = "CNPJ:";

    cnpj_form.hidden = false;
    cnpj_form.className = "col-6 form-control";
    cnpj_form.placeholder = "CNPJ";
    cnpj_form.type = "text";
    div_cnpj.append(label_cnpj);
    div_cnpj.append(cnpj_form);
    //div botão de consulta
    let div_alert_ = document.createElement("div");
    div_alert_.id = "div_alert_";
    div_consulta_btn.className = "text-center mb-5";
    div_consulta_btn.id = "div_consulta_btn";
    consulta_btn.className = "btn btn-lg btn-consultar";
    consulta_btn.id = "submitConsulta";
    consulta_btn.innerHTML = " Consultar";

    div_step2.className = "step";
    div_step2.id = "step_2";
    div_row_id.className = "row px-5";
    div_nome.className = "col-12 form-group";
    label_nome.innerHTML = "Nome Completo:";
    input_nome.className = "form-control";
    input_nome.id = "nome_completo";
    input_nome.name = "nome_completo";
    input_nome.readOnly = true;
    input_nome.required;
    input_nome.placeholder = "Nome Completo";
    input_nome.type = "text";

    div_step1.append(div_row);
    div_row.append(div_cpf);
    div_row.append(div_birthday);
    div_step1.append(div_alert_);
    div_step1.append(div_consulta_btn);
    div_cpf.append(label_cpf);
    div_cpf.append(input_cpf);
    div_birthday.append(label_birthday);
    div_birthday.append(input_birthday);
    div_row.append(div_cnpj);
    div_consulta_btn.append(consulta_btn);

    //Step 2 cnpj
    div_step2.className = "step";
    div_step2.id = "step_2";
    div_row_id.className = "row px-5";
    let div_row_id1 = div_row_id.cloneNode(true);
    div_nome_emp.className = "col-12 form-group";
    label_nome_emp.innerHTML = "Nome da Empresa :";
    input_nome_emp.className = "form-control";
    input_nome_emp.id = "nome_completo";
    input_nome_emp.name = "nome_emp";
    input_nome_emp.readOnly = true;
    input_nome_emp.required;
    input_nome_emp.placeholder = "Nome da Empresa";
    input_nome_emp.type = "text";
    //Email
    div_email.className = "col-6 form-group";
    label_email.innerHTML = "Email:";
    input_email.className = "form-control";
    input_email.id = "email1";
    input_email.name = "email";
    input_email.required;
    input_email.placeholder = "Email";
    input_email.type = "text";
    //Email2
    div_email2.className = "col-6 form-group";
    label_email2.innerHTML = "Confirmação de Email:";
    input_email2.className = "form-control";
    input_email2.id = "email2";
    input_email2.name = "email2";
    input_email2.required;
    input_email2.placeholder = "Confirmação de Email";
    input_email2.type = "text";
    let uf_empresa = input_email.cloneNode(true);
    let cidade_empresa = input_email.cloneNode(true);
    let area_fone_empresa = document.createElement("input");
    let fone_empresa = input_email.cloneNode(true);

    // step 3
    let div_row_id2 = div_row_id.cloneNode(true);
    div_step3.className = "step";
    div_step3.id = "step_3";
    let title_representante = document.createElement("span");
    title_representante.innerHTML = "<h3>Dados do Representante:</h3><hr>";
    title_representante.className = "mt-3 col-12 p-0 ml-3";
    div_nome_rep.className = "col-6 form-group";
    label_nome_rep.innerHTML = "Nome Completo do Representante:";
    input_nome_rep.className = "form-control";
    input_nome_rep.id = "nome_rep";
    input_nome_rep.name = "nome_rep";
    input_nome_rep.readOnly = true;
    input_nome_rep.required;
    input_nome_rep.placeholder = "Nome Representante:";
    input_nome_rep.type = "text";
    //Tipo Documento
    div_tipo_doc.className = "col-6 form-group";
    label_tipo_doc.innerHTML = "Documento de Identificação com foto:";
    label_tipo_doc.className = "col-12";
    select_tipo_doc.className = "col-12";
    select_tipo_doc.id = "tipoDoc";
    select_tipo_doc.name = "tipoDoc";
    select_tipo_doc.required;
    let option_doc1 = document.createElement("option");
    option_doc1.selected;
    option_doc1.disabled;
    option_doc1.innerText = "Selecione um tipo de documento...";
    let option_doc2 = document.createElement("option");
    option_doc2.value = "CNH";
    option_doc2.innerText = "Carteira Nacional de Habilitação";
    let option_doc3 = document.createElement("option");
    option_doc3.value = "RG";
    option_doc3.innerText = "Identidade(Registro Geral)";
    let option_doc4 = document.createElement("option");
    option_doc4.value = "CTPS";
    option_doc4.innerText = "Carteira de Trabalho e Previdência Social";
    let option_doc5 = document.createElement("option");
    option_doc5.value = "CRM";
    option_doc5.innerText = "Conselho Regional de Medicina";
    let option_doc6 = document.createElement("option");
    option_doc6.value = "";
    option_doc6.innerText = "Outro";
    select_tipo_doc.append(option_doc1);
    select_tipo_doc.append(option_doc2);
    select_tipo_doc.append(option_doc3);
    select_tipo_doc.append(option_doc4);
    select_tipo_doc.append(option_doc5);
    select_tipo_doc.append(option_doc6);
    //num Documento
    div_num_doc.className = "col-6 form-group";
    label_num_doc.innerHTML = "N° Documento de Indentificação:";
    input_num_doc.className = "form-control";
    input_num_doc.id = "documento_identificacao";
    input_num_doc.name = "documento_identificacao";
    input_num_doc.required;
    input_num_doc.placeholder = "Número de Documento de Identificação";
    input_num_doc.type = "text";
    //Telefone
    div_telefone.className = "row form-group col ml-1";
    label_telefone.innerHTML = "Telefone do Representante:";
    label_telefone.className = "col-12 p-0";
    input_telefone_area.className = "form-control col-2 mr-2";
    input_telefone_area.setAttribute("maxlength", "3");
    input_telefone_area.id = "telefone_area";
    input_telefone_area.name = "telefone_area";
    input_telefone_area.required;
    input_telefone_area.placeholder = "DDD";
    input_telefone_area.type = "text";
    input_telefone.className = "form-control col-6";
    input_telefone.id = "telefone";
    input_telefone.name = "telefone";
    input_telefone.required;
    input_telefone.placeholder = "Telefone";
    input_telefone.type = "text";
    //senha gerenciamento
    div_senha.className = "col-6 form-group";
    label_senha.innerHTML = "Senha de Gerenciamento:";
    input_senha.className = "form-control";
    input_senha.name = "passhphrase";
    input_senha.id = "passhphrase";
    input_senha.required;
    input_senha.setAttribute("maxlength", "10");
    input_senha.setAttribute("minlength", "5");
    input_senha.type = "text";
    input_senha.placeholder = "Senha de Gerenciamento";
    //confirmacao senha
    div_senha2.className = "col-6 form-group";
    label_senha2.innerHTML = "Confirmação de Senha Gerenciamento:";
    input_senha2.className = "form-control";
    input_senha2.id = "password2";
    input_senha2.required;
    input_senha2.setAttribute("maxlength", "10");
    input_senha2.setAttribute("minlength", "5");
    input_senha2.type = "text";
    input_senha2.placeholder = "Confirmação Senha de Gerenciamento";
    //Nota
    div_nota_senha.className = "alert alert-info mt-2 mb-2";
    div_nota_senha.setAttribute("role", "alert");
    div_nota_senha.innerHTML =
      "<b>Nota :</b> Esta senha é usada para a gestão do certificado (emissão, revogação, etc...), deve ser diferente da senha de acesso ao site. Por favor guarde-a com você pois vai ser necessária no futuro. A senha deve conter apenas letras ou números entre 6 e 10 caracteres.";

    //step 4 cnpj
    div_step4.className = "step";
    div_step4.id = "step_4";
    h5_endereco.className = "mt-3 ml-3";
    h5_endereco.innerHTML = "<h3>Endereço da Empresa: </h3><hr> ";
    div_row_end.className = "row px-5";
    div_cep.className = "col-5  form-group";
    label_cep.innerHTML = "Cep:";
    input_cep.className = "form-control";
    input_cep.required;
    input_cep.name = "cep";
    input_cep.id = "cep";
    input_cep.setAttribute("maxlength", "9");
    input_cep.placeholder = "CEP";
    input_cep.type = "text";

    div_uf.className = "form-group col-2";
    label_uf.innerHTML = "Estado:";
    input_uf.className = "form-control";
    input_uf.required;
    input_uf.name = "uf";
    input_uf.id = "uf";
    input_uf.setAttribute("maxlength", "2");
    input_uf.placeholder = "SP";
    input_uf.readOnly = true;
    input_uf.type = "text";

    div_municipio.className = "form-group col-5";
    label_municipio.innerHTML = "Município:";
    input_municipio.className = "form-control";
    input_municipio.required;
    input_municipio.name = "cidade";
    input_municipio.id = "cidade";
    input_municipio.placeholder = "São Paulo";
    input_municipio.readOnly = true;
    input_municipio.type = "text";

    div_mun_ibge.className = "form-group";
    label_mun_ibge.innerHTML = "Município IBGE:";
    input_mun_ibge.className = "form-control";
    input_mun_ibge.required;
    input_mun_ibge.name = "ibge";
    input_mun_ibge.id = "ibge";
    input_mun_ibge.hidden = "true";
    input_mun_ibge.type = "text";

    div_endereco.className = "form-group col-5";
    label_endereco.innerHTML = "Endereço:";
    input_endereco.className = "form-control";
    input_endereco.required;
    input_endereco.name = "rua";
    input_endereco.id = "rua";
    input_endereco.placeholder = "Endereço";
    input_endereco.readOnly = true;
    input_endereco.type = "text";

    div_bairro.className = "form-group col-5";
    label_bairro.innerHTML = "Bairro:";
    input_bairro.className = "form-control";
    input_bairro.required;
    input_bairro.name = "bairro";
    input_bairro.id = "bairro";
    input_bairro.placeholder = "Bairro";
    input_bairro.readOnly = true;
    input_bairro.type = "text";

    div_numero.className = "form-group col-2";
    label_numero.innerHTML = "Número:";
    input_numero.className = "form-control";
    input_numero.required;
    input_numero.name = "numero";
    input_numero.id = "numero";
    input_numero.placeholder = "Número";
    input_numero.type = "text";

    div_complemento.className = "form-group col-12";
    label_complemento.innerHTML = "Complemento:";
    input_complemento.className = "form-control";
    input_complemento.required;
    input_complemento.name = "complemento";
    input_complemento.id = "complemento";
    input_complemento.placeholder = "Complemento";
    input_complemento.type = "text";

    div_step5.className = "step";
    div_step5.id = "step_5";
    let div_row_padrao = document.createElement("div");
    div_row_padrao.className = "row";
    let div_empresa_contato = div_row_padrao.cloneNode(true);
    let label_tel_company = label_telefone.cloneNode(true);
    label_tel_company.innerHTML = "Telefone da Empresa";
    let telefone_company_area = input_telefone_area.cloneNode(true);
    telefone_company_area.id = "telefone_area_emp";
    telefone_company_area.name = "telefone_area_emp";
    telefone_company_area.placeholder = "DDD";
    let telefone_company = input_telefone.cloneNode(true);
    telefone_company.id = "telefone_emp";
    telefone_company.name = "telefone_emp";
    telefone_company.placeholder = "Telefone Empresa";
    let email_order = input_email.cloneNode(true);
    div_empresa_contato.className = "row form-group ml-2";
    div_empresa_contato.appendChild(label_tel_company);
    div_empresa_contato.appendChild(telefone_company_area);
    div_empresa_contato.appendChild(telefone_company);

    div_step5.className = "step";
    div_step5.id = "step_6";
    div_pag_col.className = "col-12 form-group";
    div_row_btns.className = "row";
    div_row_pag.className = "row p-5";
    div_boleto.className = "row";
    div_cartao.className = "row  collapse";
    div_cartao.id = "collapseCartao";
    div_col_collapse.className = " col";
    let div_metodos_pag = document.createElement("div");
    div_metodos_pag.className = "d-inline-flex";
    let div_boleto_side = document.createElement("div");
    let div_cartao_side = document.createElement("div");
    div_boleto_side.className = "col";
    div_boleto_side.name = "divboletoside";
    div_cartao_side.className = "col";
    div_cartao_side.name = "divcartaoside";
    div_boleto_radio.className = "form-group col-sm-6";
    div_cartao_radio.className = "form-group col-sm-6";
    label_boleto.className = "ml-3 form-check-label";
    label_boleto.innerHTML = "Boleto";
    input_boleto.className = "";
    input_boleto.setAttribute("data-toggle", "collapse");
    input_boleto.setAttribute("data-target", "#collapseExample");
    input_boleto.setAttribute("aria-expanded", "false");
    input_boleto.setAttribute("aria-controls", "collapseExample");
    input_boleto.value = "";
    input_boleto.name = "metodopagamento";
    input_boleto.id = "boleto";
    input_boleto.type = "radio";
    input_boleto.value = "boleto";
    input_cartao.className = " form-";
    input_cartao.type = "radio";
    input_cartao.setAttribute("data-toggle", "collapse");
    input_cartao.setAttribute("data-target", "#collapseCartao");
    input_cartao.value = "credito";
    input_cartao.name = "metodopagamento";
    input_cartao.id = "credito";
    label_cartao.className = "ml-3 form-check-label";
    label_cartao.innerHTML = "Cartão de Crédito";

    div_num_cartao.className = "col-12 form-group";
    label_cartao_num.innerHTML = "Número do Cartão";
    input_num_cartao.className = "form-control";
    input_num_cartao.name = "numerocartao";
    input_num_cartao.id = "numerocartao";
    input_num_cartao.placeholder = "Número";
    input_num_cartao.type = "text";

    div_tit.className = "col-12 form-group";
    label_tit.innerHTML = "Titular do Cartão";
    input_tit.className = "form-control";
    input_tit.name = "titularCartao";
    input_tit.id = "titularCartao";
    input_tit.placeholder = "Titular";
    input_tit.type = "text";

    div_val_mes.className = "row form-group div_val_mes";
    label_val_mes.innerHTML = "Validade Mês";
    input_val_mes.className = "form-control col mr-3";
    input_val_mes.name = "valMes";
    input_val_mes.id = "valMes";
    input_val_mes.placeholder = "Validade Mês";
    input_val_mes.setAttribute("maxlength", "2");
    input_val_mes.type = "text";

    div_val_ano.className = "col form-group";
    label_val_ano.innerHTML = "Validade Ano";
    input_val_ano.className = "form-control col mr-3";
    input_val_ano.name = "valAno";
    input_val_ano.id = "valAno";
    input_val_ano.placeholder = "Validade Ano";
    input_val_ano.setAttribute("maxlength", "2");
    input_val_ano.type = "text";

    div_cod_seg.className = "col-6 form-group";
    label_cod_seg.innerHTML = "Código de Segurança";
    input_cod_seg.className = "form-control col mr-3";
    input_cod_seg.name = "cvv";
    input_cod_seg.id = "cvv";
    input_cod_seg.placeholder = "CVV";
    input_cod_seg.setAttribute("maxlength", "3");
    input_cod_seg.type = "text";
    div_parcela.className = "col-12 form-group";
    label_parcela.innerHTML = "Parcelas";
    select_parcela.className = "col-12";
    select_parcela.name = "parcela";
    select_parcela.id = "parcela_form";
    select_parcela.placeholder = "Parcelas";
    let option_parcela_padrao = document.createElement("option");
    // option_parcela_padrao.selected;option_parcela_padrao.value='';option_parcela_padrao.innerHTML='Escolha ...'
    // option_parcela_padrao.disabled;
    //   select_parcela.append(option_parcela_padrao)
    let div_enviar = document.createElement("div");
    div_enviar.className = "col-12 text-center";
    div_enviar.id = "divenviar";

    let enviarForm = document.createElement("button");
    enviarForm.id = "CreateCert";
    enviarForm.innerHTML =
      'Finalizar Solicitação <i class="fas ml-3 fa-check"></i>';
    enviarForm.className = "btn-primary btn btn-lg col-4";
    enviarForm.hidden = true;

    div_enviar.append(enviarForm);
    button.className =
      "btn btn-compra-cert btn-lg col ml-auto mr-3 mt-auto mb-3";
    button.innerHTML = "Comprar Certificado";
    button.id = "comprar-certificado";
    button.setAttribute("data-toggle", "modal");
    button.setAttribute("data-target", "#modalExemplo");
    input_name.className = "form-control col-6";
    input_name.id = "name";

    //step 5 finalização do pedido

    let div_step6 = document.createElement("div");
    let div_fim = document.createElement("div");
    let text_fim = document.createElement("span");
    let input_orderid = document.createElement("input");
    let input_cpf_fim = document.createElement("input");
    let div_btn_order = document.createElement("div");
    let btn_getOrder = document.createElement("button");
    div_step5.className = " step mt-5";
    div_step5.id = "step_5";

    div_step6.className = " mt-5";
    div_step6.id = "step_6";
    div_step6.style = "display:none;";
    div_fim.className = " text-center";
    input_cpf_fim.className = "form-control col";
    input_orderid.id = "input_orderid";
    input_cpf_fim.id = "cpf_fim";
    input_orderid.className = "form-control col";
    div_btn_order.className = "row text-center";
    text_fim.id = "text-fim";
    text_fim.innerHTML = "";
    btn_getOrder.className = "btn btn-primary btn-agendamento mx-auto col-4";
    btn_getOrder.innerHTML =
      'Agendar Verificação <i class="fas fa-calendar-alt"></i>';
    div_fim.append(text_fim);
    div_btn_order.append(btn_getOrder);
    div_step6.append(div_fim);
    div_step6.append(div_btn_order);

    divModal.appendChild(divModalDialog);
    divModalDialog.appendChild(divModalContent);
    divModalContent.append(divModalHeader);

    //Modal header
    form.append(cod_prod_form);
    divModalHeader.append(modalTitle);
    close_modal_btn.append(span_X);
    divModalHeader.append(close_modal_btn);
    divModalContent.append(form);
    form.appendChild(divModalBody);
    divModalBody.append(div_step1);
    divModalBody.append(div_step2);
    divModalBody.append(div_step3);
    divModalBody.append(div_step4);
    divModalBody.append(div_step5);
    divModalBody.append(div_step6);
    divModalContent.append(div_prev_next);

    //step 2

    div_step2.append(h5_identificacao);
    div_step2.append(div_row_id1);
    div_row_id1.append(div_nome_emp);
    div_nome_emp.appendChild(label_nome_emp);
    div_nome_emp.append(input_nome_emp);
    div_row_id1.append(div_email);
    div_row_id1.append(div_email2);
    div_row_id1.appendChild(div_empresa_contato);
    div_email.append(label_email);
    div_email.append(input_email);
    div_email2.append(label_email2);
    div_email2.append(input_email2);

    //  step 3

    div_step3.append(h5_endereco);
    div_step3.append(div_row_id2);
    div_row_id2.appendChild(title_representante);
    div_row_id2.appendChild(div_nome_rep);
    div_row_id2.append(div_telefone);
    div_row_id2.append(div_tipo_doc);
    div_row_id2.append(div_num_doc);
    div_row_id2.append(div_senha);
    div_row_id2.append(div_senha2);
    div_nome_rep.appendChild(label_nome_rep);
    div_nome_rep.append(input_nome_rep);
    div_tipo_doc.append(label_tipo_doc);
    div_tipo_doc.append(select_tipo_doc);
    div_num_doc.append(label_num_doc);
    div_num_doc.append(input_num_doc);
    div_telefone.appendChild(label_telefone);
    div_telefone.append(input_telefone_area);
    div_telefone.append(input_telefone);
    div_senha.append(label_senha);
    div_senha.append(input_senha);
    div_senha2.append(label_senha2);
    div_senha2.append(input_senha2);
    div_row_id2.append(div_nota_senha);

    //step 4
    div_step4.append(h5_endereco);
    div_step4.append(div_row_end);
    div_row_end.append(input_mun_ibge);
    div_row_end.append(div_cep);
    div_cep.append(label_cep);
    div_cep.append(input_cep);
    div_row_end.append(div_uf);
    div_uf.append(label_uf);
    div_uf.append(input_uf);
    div_row_end.append(div_municipio);
    div_municipio.append(label_municipio);
    div_municipio.append(input_municipio);
    div_row_end.append(div_endereco);
    div_endereco.append(label_endereco);
    div_endereco.append(input_endereco);
    div_row_end.append(div_bairro);
    div_bairro.append(label_bairro);
    div_bairro.append(input_bairro);
    div_row_end.append(div_numero);
    div_numero.append(label_numero);
    div_numero.append(input_numero);
    div_row_end.append(div_complemento);
    div_complemento.append(label_complemento);
    div_complemento.append(input_complemento);

    div_step5.append(div_row_pag);
    div_row_pag.append(h5_pagamento);
    div_row_pag.append(div_pag_col);
    div_row_pag.append(div_metodos_pag);
    div_metodos_pag.append(div_boleto_side);
    div_metodos_pag.append(div_cartao_side);
    div_pag_col.append(div_row_btns);
    div_row_btns.append(div_boleto_radio);
    div_row_btns.append(div_cartao_radio);
    div_boleto_radio.append(input_boleto);
    div_boleto_radio.append(label_boleto);
    div_cartao_radio.append(input_cartao);
    div_cartao_radio.append(label_cartao);
    div_row_pag.appendChild(div_boleto_side);
    div_row_pag.append(div_cartao_side);
    div_cartao_side.appendChild(div_cartao);
    div_cartao.append(div_col_collapse);
    div_col_collapse.append(div_num_cartao);
    div_num_cartao.append(label_cartao_num);
    div_num_cartao.append(input_num_cartao);
    div_col_collapse.append(div_tit);
    div_tit.append(label_tit);
    div_tit.append(input_tit);
    div_col_collapse.append(div_val_mes);
    div_val_mes.append(input_val_mes);
    div_val_mes.append(input_val_ano);
    div_val_mes.append(input_cod_seg);
    div_col_collapse.append(div_parcela);
    div_parcela.append(label_parcela);
    div_parcela.append(select_parcela);
    div_row_pag.append(div_enviar);

    div01.appendChild(button);
    divForm.append(button);
    divForm.append(divModal);
  }

  prod_inicial_da_pag = document.getElementById(codprodInicial);
  cod_id = "#" + codprodInicial;
  $(cod_id).prop("checked", true);
  $(cod_id).closest(".card").addClass("highlight");

  $(document).ready(function () {
    let produto = data.filter((d) => d.cod_produto === codprodInicial);
    let produtoObj = produto[0];
    var tipo_cert_selec = document.getElementById("tipo-cert-selec");
    var tipo_cert_cat = document.getElementById("tipo-cert-cat");
    var validade = document.getElementById("validade");
    var preco_cheio = document.getElementById("preco-cheio");
    var parcela = document.getElementById("parcela");
    var parcela_form_ = $("#parcela_form");
    var preco_desconto = document.getElementById("preco-desconto");
    preco_produto = produtoObj.preco;
    let promocode_value = promocode.value;
    cod_prod = produtoObj.cod_produto;
    console.log("valor do promocode", promocode.value);
    $.ajax({
      url: "https://app.pjfit.com.br/api/cert/v1/consultatablePrice",
      type: "GET",
      data: {
        promocode: promocode_value,
        cod_produto: cod_prod,
      },
      success: function (response) {
        // you can see the result from the console
        // tab of the developer tools
        //	 var arr= JSON.parse(response)
        console.log(response);
        var obj = response;
        var preco_cheio = document.getElementById("preco-cheio");
        var antigo_preco = preco_cheio.innerHTML;
        var preco_novo = obj.valor_produto;
        if (obj.erro) {
          var Mensagem = obj.erro.mensagem;
          promocode.value = promocode_padrao;
          preco_produto.value = produtoObj.preco;
          console.log("erro");
        }
        if (!obj.erro) {
          preco_produto = preco_novo;
          if (produtoObj.cod_produto == "C01RPFA1SO03") preco_produto = "59.90";
          var numparcela = preco_produto / 20;

          if (numparcela > 12) {
            numparcela = 12;
          }

          var precoparcela = preco_produto / Math.trunc(numparcela);
          var numparcelaRound = Math.trunc(numparcela);

          $("#cod_prod_form").val(cod_prod);
          $("#valor_form").val(preco_produto);
          let valorForm = $("#valor_form").val();
          console.log("valor form", valorForm);
          tipo_cert_selec.innerHTML =
            "<b>" + produtoObj.tipo_cert_name + "</b>";
          tipo_cert_cat.innerHTML = "<b>" + produtoObj.categoria_cert + "</b>";
          validade.innerHTML =
            " Validade: <b>" + produtoObj.validade + " meses</b>";
          parcela.innerHTML =
            " apenas " +
            numparcelaRound +
            "x de R$ " +
            parseFloat(precoparcela.toFixed(2));
          preco_cheio.innerHTML = "<b>R$ " + preco_produto + "</b>";
          //limpa as parcelas antes de criar outra
          if ($("#parcela").length != 0) {
            parcela_form_.empty();
          }
          for (i = 0; i < numparcelaRound; i++) {
            console.log("preco produto parcela", preco_produto);
            let parcela_option = document.createElement("option");
            parcela_option.id = "parcela";
            if (produtoObj.cod_produto == "C01RPFA1SO03")
              preco_produto = "59.90";
            let preco_parcela_form = preco_produto / (i + 1);

            parcela_option.innerHTML =
              i +
              1 +
              "x de R$ " +
              parseFloat(preco_parcela_form.toFixed(2)) +
              "&nbsp;";
            if (i == 0) {
              parcela_option.selected;
            }
            parcela_option.value = i + 1;

            parcela_form_.append(parcela_option);
          }
        }
        preco_cheio.innerHTML = "<b>R$ " + preco_novo + "</b>";
      },
      error: function (response) {
        console.log(response);
      },
    });
  });

  $(document).ready(function () {
    function limpa_formulário_cep() {
      // Limpa valores do formulário de cep.
      $("#rua").val("");
      $("#bairro").val("");
      $("#cidade").val("");
      $("#uf").val("");
      $("#ibge").val("");
    }

    //Quando o campo cep perde o foco.
    $("#cep").blur(function () {
      //Nova variável "cep" somente com dígitos.
      var cep = $(this).val().replace(/\D/g, "");

      //Verifica se campo cep possui valor informado.
      if (cep != "") {
        //Expressão regular para validar o CEP.
        var validacep = /^[0-9]{8}$/;

        //Valida o formato do CEP.
        if (validacep.test(cep)) {
          //Preenche os campos com "..." enquanto consulta webservice.
          $("#rua").val("...");
          $("#bairro").val("...");
          $("#cidade").val("...");
          $("#uf").val("...");
          $("#ibge").val("...");

          //Consulta o webservice viacep.com.br/
          $.getJSON(
            "https://viacep.com.br/ws/" + cep + "/json/?callback=?",
            function (dados) {
              if (!("erro" in dados)) {
                //Atualiza os campos com os valores da consulta.
                $("#rua").val(dados.logradouro);
                $("#bairro").val(dados.bairro);
                $("#cidade").val(dados.localidade);
                $("#uf").val(dados.uf);
                $("#ibge").val(dados.ibge);
                if (dados.logradouro.length < 2) {
                  $("#rua").prop("readonly", false);
                  $("#bairro").prop("readonly", false);
                } else {
                  $("#rua").prop("readonly", true);
                  $("#bairro").prop("readonly", true);
                }
              } //end if.
              else {
                //CEP pesquisado não foi encontrado.
                limpa_formulário_cep();
                alert("CEP não encontrado.");
              }
            }
          );
        } //end if.
        else {
          //cep é inválido.
          limpa_formulário_cep();
          alert("Formato de CEP inválido.");
        }
      } //end if.
      else {
        //cep sem valor, limpa formulário.
        limpa_formulário_cep();
      }
    });
  });
};

criarFormulario();

$(document).ready(function () {
  //Esconde todos os passos e exibe o primeiro ao carregar a página
  $(".step").hide();
  $(".step").first().show();

  //Exibe no topo em qual passo estamos pela ordem da div que esta visivel
  var index = parseInt($(".step:visible").index());
  var passoexibido = function () {
    var index = parseInt($(".step:visible").index());
    console.log("INDEX STEP", index);
    if (index == -1) index = 0;
    if (index == 0) {
      //Se for o primeiro passo desabilita o botão de voltar
      $("#prev").prop("disabled", true);
      $("#next").prop("disabled", true);
    } else if (index == parseInt($(".step").length) - 1) {
      //Se for o ultimo passo desabilita o botão de avançar
      $("#next").prop("disabled", true);
      $("#CreateCert").prop("hidden", false);
    } else {
      //Em outras situações os dois serão habilitados
      $("#next").prop("disabled", false);
      $("#prev").prop("disabled", false);
    }
    $("#passo").html(index + 1);
  };

  //Executa a função ao carregar a página
  passoexibido();

  $("#next").click(function () {
    var index = parseInt($(".step:visible").index());
    if (index == 0 || index == -1) {
      if ($("#tipo_cert_form").val() == 1) {
        if (!$("#cpf").val() || !$("#data_nascimento").val()) {
          $("#cpf").addClass("obrigatorio");
          $("#data_nascimento").addClass("obrigatorio");
          $("#next").prop("disabled", true);
          return;
        } else {
          $("#cpf").removeClass("obrigatorio");
          $("#cpf").is(":invalid");
          $("#data_nascimento").removeClass("obrigatorio");
          $("#next").prop("disabled", false);
        }
      }
      if ($("#tipo_cert_form").val() == 2) {
        if (
          !$("#cpf").val() ||
          !$("#data_nascimento").val() ||
          !$("#cnpj").val()
        ) {
          $("#cpf").addClass("obrigatorio");
          $("#data_nascimento").addClass("obrigatorio");
          $("#cnpj").addClass("obrigatorio");
          $("#next").prop("disabled", true);
          // alert('Para realizar a consulta é necessário informar os dados!')
          return;
        } else {
          $("#cpf").removeClass("obrigatorio");
          $("#cnpj").removeClass("obrigatorio");
          $("#data_nascimento").removeClass("obrigatorio");
          $("#next").prop("disabled", false);
        }
      }
    }
    if (index == 1) {
      if ($("#tipo_cert_form").val() == 1) {
        if (
          !$("#email1").val() ||
          !$("#email2").val() ||
          !$("#telefone_area").val() ||
          !$("#telefone").val() ||
          !$("#documento_identificacao").val() ||
          !$("#tipoDoc").val() ||
          !$("#passhphrase").val() ||
          !$("#password2").val()
        ) {
          if ($("#tipoDoc").val().length < 2) {
            $("#tipoDoc").addClass("obrigatorio");
            return alert("Selecione um tipo de documento.");
          }
          $("#email1").addClass("obrigatorio");
          $("#email2").addClass("obrigatorio");
          $("#telefone_area_emp").addClass("obrigatorio");
          $("#telefone_emp").addClass("obrigatorio");
          $("#documento_identificacao").addClass("obrigatorio");
          $("#tipoDoc").addClass("obrigatorio");
          $("#telefone_area").addClass("obrigatorio");
          $("#telefone").addClass("obrigatorio");
          $("#passhphrase").addClass("obrigatorio");
          $("#password2").addClass("obrigatorio");
          alert("Verifique se algum dado está errado.");
          return;
        } else if ($("#email1").val() != $("#email2").val()) {
          $("#email1").addClass("obrigatorio");
          $("#email2").addClass("obrigatorio");
          alert("O email de confirmação precisa ser igual!");
          alert($("#email2").val());
          return;
        } else if ($("#passhphrase").val() != $("#password2").val()) {
          $("#passhphrase").addClass("obrigatorio");
          $("#password2").addClass("obrigatorio");
          alert("As senhas precisam ser iguais!");
          return;
        }
        if ($("#passhphrase").val().length < 6) {
          $("#passhphrase").addClass("obrigatorio");
          alert("As senhas precisam ser maiores que 6 caracteres!");
          return;
        } else {
          $("#next").prop("disabled", false);
          $("#email1").removeClass("obrigatorio");
          $("#email2").removeClass("obrigatorio");
          $("#documento_identificacao").removeClass("obrigatorio");
          $("#tipoDoc").removeClass("obrigatorio");
          $("#telefone_area").removeClass("obrigatorio");
          $("#telefone").removeClass("obrigatorio");
          $("#passhphrase").removeClass("obrigatorio");
          $("#password2").removeClass("obrigatorio");
        }
      }
      if ($("#tipo_cert_form").val() == 2) {
        if (
          !$("#email1").val() ||
          !$("#email2").val() ||
          !$("#telefone_area_emp").val() ||
          !$("#telefone_emp").val()
        ) {
          $("#email1").addClass("obrigatorio");
          $("#email2").addClass("obrigatorio");
          $("#telefone_area_emp").addClass("obrigatorio");
          $("#telefone_emp").addClass("obrigatorio");
          alert("Verifique se algum dado está errado.");
          return;
        } else if ($("#email1").val() != $("#email2").val()) {
          $("#email1").addClass("obrigatorio");
          $("#email2").addClass("obrigatorio");
          alert("O email de confirmação precisa ser igual!");
          return;
        } else {
          $("#next").prop("disabled", false);
          $("#email1").removeClass("obrigatorio");
          $("#email2").removeClass("obrigatorio");
          $("#telefone_area_emp").removeClass("obrigatorio");
          $("#telefone_emp").removeClass("obrigatorio");
        }
      }
    }
    if (index == 2) {
      if ($("#tipo_cert_form").val() == 1) {
        if (
          !$("#cep").val() ||
          !$("#uf").val() ||
          !$("#ibge").val() ||
          !$("#rua").val() ||
          !$("#bairro").val() ||
          !$("#numero").val()
        ) {
          $("#cep").addClass("obrigatorio");
          $("#numero").addClass("obrigatorio");
          alert("Verifique se algum dado está errado.");
          return;
        } else {
          $("#next").prop("disabled", false);
          $("#cep").removeClass("obrigatorio");
          $("#numero").removeClass("obrigatorio");
        }
      }
      if ($("#tipo_cert_form").val() == 2) {
        if (
          !$("#documento_identificacao").val() ||
          !$("#tipoDoc").val() ||
          !$("#telefone_area").val() ||
          !$("#telefone").val() ||
          !$("#passhphrase").val() ||
          !$("#password2").val()
        ) {
          if ($("#tipoDoc").val().length < 2) {
            $("#tipoDoc").addClass("obrigatorio");
            return alert("Selecione um tipo de documento.");
          }
          $("#documento_identificacao").addClass("obrigatorio");
          $("#tipoDoc").addClass("obrigatorio");
          $("#telefone_area").addClass("obrigatorio");
          $("#telefone").addClass("obrigatorio");
          $("#passhphrase").addClass("obrigatorio");
          $("#password2").addClass("obrigatorio");
          alert("Verifique se algum dado está errado.");
          return;
        } else if ($("#passhphrase").val() != $("#password2").val()) {
          $("#passhphrase").addClass("obrigatorio");
          $("#password2").addClass("obrigatorio");
          alert("As senhas precisam ser iguais!");

          return;
        }
        if ($("#passhphrase").val().length < 6) {
          $("#passhphrase").addClass("obrigatorio");
          alert("As senhas precisam ser maiores que 6 caracteres!");
          return;
        } else {
          $("#next").prop("disabled", false);
          $("#documento_identificacao").removeClass("obrigatorio");
          $("#tipoDoc").removeClass("obrigatorio");
          $("#telefone_area").removeClass("obrigatorio");
          $("#telefone").removeClass("obrigatorio");
          $("#passhphrase").removeClass("obrigatorio");
          $("#password2").removeClass("obrigatorio");
        }
      }
    }
    if (index == 3) {
      if ($("#tipo_cert_form").val() == 1) {
      }
      if ($("#tipo_cert_form").val() == 2) {
        if (
          !$("#cep").val() ||
          !$("#uf").val() ||
          !$("#ibge").val() ||
          !$("#rua").val() ||
          !$("#bairro").val() ||
          !$("#numero").val()
        ) {
          $("#cep").addClass("obrigatorio");
          $("#numero").addClass("obrigatorio");
          alert("Verifique se algum dado está errado.");
          return;
        } else {
          $("#next").prop("disabled", false);
          $("#cep").removeClass("obrigatorio");
          $("#numero").removeClass("obrigatorio");
        }
      }
    }
    if (index == 4) {
      if ($("#tipo_cert_form").val() == 1) {
      }
      if ($("#tipo_cert_form").val() == 2) {
        if (!$("#boleto").is(":checked") && !$("#credito").is(":checked")) {
          alert("Por Favor Selecione um Metodo de Pagamento!");

          return;
        } else if ($("#credito").is(":checked")) {
          if (
            !$("#valAno").val() ||
            !$("#numerocartao").val() ||
            !$("#valMes").val() ||
            !$("#cvv").val() ||
            !$("#titularCartao").val()
          ) {
            $("#valAno").addClass("obrigatorio");
            $("#numerocartao").addClass("obrigatorio");
            $("#valMes").addClass("obrigatorio");
            $("#cvv").addClass("obrigatorio");
            $("#titularCartao").addClass("obrigatorio");
          }
        } else {
          $("#valAno").removeClass("obrigatorio");
          $("#numerocartao").removeClass("obrigatorio");
          $("#valMes").removeClass("obrigatorio");
          $("#cvv").removeClass("obrigatorio");
          $("#titularCartao").removeClass("obrigatorio");
        }
      }
    }

    $(".step:visible").hide().next().show();
    passoexibido();
  });

  //retrocede para o passo anterior
  $("#prev").click(function () {
    $(".step:visible").hide().prev().show();
    passoexibido();
  });

  $("#cpf").inputmask("mask", {
    mask: ["999.999.999-99", "99.999.999"],
  });

  $("#cep").inputmask("mask", {
    mask: ["99999-999", "99.999.999"],
  });
  $("#data_nascimento").inputmask("mask", {
    mask: ["99-99-9999", "99.99.9999"],
  });

  $("#cupom").on("change", function (e) {
    $("#btn-cupom").prop("disabled", false);
  });

  // click on button submit
  $("#submitConsulta").on("click", function (e) {
    e.preventDefault();
    var cpf = $("#cpf");
    var data_nascimento = $("#data_nascimento");
    var tipoCert = $("#tipo_cert_form");
    var btn_consulta_enviando = document.getElementById("submitConsulta");
    btn_consulta_enviando.innerHTML = "Enviando...";
    $("#submitConsulta").prop("disabled", true);
    if (cpf.val().length < 11) {
      alert("CPF INVALIDO PARA CONSULTA");
      btn_consulta_enviando.innerHTML = "Consultar";
      $("#submitConsulta").prop("disabled", false);
      return "";
    }
    if (data_nascimento.val().length < 8) {
      alert("DATA DE NASCIMENTO INVALIDO PARA CONSULTA");
      btn_consulta_enviando.innerHTML = "Consultar";
      $("#submitConsulta").prop("disabled", false);
      return "";
    }

    var cnpj = "";
    if (tipoCert.val() == "2") cnpj = $("#cnpj").val();

    $.ajax({
      url: "https://app.pjfit.com.br/api/cert/v1/consultaRFB",
      type: "GET",
      data: {
        cpf: cpf.val(),
        data_nascimento: data_nascimento.val(),
        tipoCert: tipoCert.val(),
        cnpj: cnpj,
      },
      success: function (response) {
        // you can see the result from the console
        // tab of the developer tools
        var arr = response;
        console.log(arr);

        if (arr.resultado == "Sucesso") {
          btn_consulta_enviando.innerHTML = "Consultar Novamente";
          console.log("Sucesso na consulta RFB ", arr);
          $("#alertSuccessCons").toggleClass("d-block");
          $("#next").prop("disabled", false);
          btn_consulta_enviando.innerHTML = "Consultar";
          $("#submitConsulta").prop("disabled", false);

          alert("Consulta realizada com sucesso! ");

          if (tipoCert.val() == "1") {
            $("#nome_completo").val(arr.resultConsulta);
            if (!$("#nome_completo").val()) {
              btn_consulta_enviando.innerHTML = "Consultar";
              $("#submitConsulta").prop("disabled", false);
              alert(
                "Erro no formulário, por favor entre em contato com nosso suporte!"
              );
            }
          }

          if (tipoCert.val() == "2") {
            $("#nome_completo").val(arr.nome_emp);
            $("#nome_rep").val(arr.resultConsulta);

            if (!$("#nome_completo").val() || !$("#nome_rep").val()) {
              btn_consulta_enviando.innerHTML = "Consultar";
              alert(
                "Erro no formulário, por favor entre em contato com nosso suporte!"
              );
            }
          }
          // DIV PARA O CADASTRO BIOMETRICO E VALIDAÇÃO POR VIDEOCONFERENCIA INFO
          let div_alert = document.createElement("div");
          let resposta;
          if (arr.cadastroBio.resultado == "Sucesso") {
            resposta = "SIM";
          } else {
            resposta = "NÃO";
          }
          div_alert.className = "alert alert-info";
          div_alert.id = "div-alert";
          div_alert.innerHTML =
            '<div class="resumoConsulta"><div class="resumoLabel"><label><i class="far fa-id-card"></i> Validação do titular:</label> </div> <input class="resumoInput" disabled value="Verificado" > </div> <div class="resumoConsulta"><div class="resumoLabel"><label><i class="far fa-hand-point-up"></i> Cadastro Biométrico:</label> </div> <input class="resumoInput" disabled value="' +
            resposta +
            '" > </div> <div class="resumoConsulta"><div class="resumoLabel"><label> <i class="fas fa-video"></i> / <i class="fas fa-user"></i> Tipo de Renovação:</label> </div> <input class="resumoInput" disabled value="Possibilidade Videoconferência" > </div> ';
          let div_alert__ = document.getElementById("div_alert_");
          $("#div_alert_").empty();
          div_alert__.append(div_alert);
        } else if (arr.resultado == "Erro") {
          btn_consulta_enviando.innerHTML = "Consultar";
          $("#next").prop("disabled", false);
          let div_alert__ = document.getElementById("div_alert_");
          $("#div_alert_").empty();
          $("#submitConsulta").prop("disabled", false);
          console.log(arr);
          alert("Erro ao realizar a consulta!");
          alert(arr.erro.mensagem);
          return;
        }
        if (arr.cliente == "false") {
        } else {
        }
      },
      error: function (xmr) {
        $("#alertErroCons").toggleClass("d-block");
      },
    });
  });

  // click on button submit
  $("#CreateCert").on("click", function (e) {
    botao_finalizacao = document.getElementById("CreateCert");
    botao_finalizacao.innerHTML = "Carregando...";
    $("#CreateCert").prop("disabled", true);

    e.preventDefault();
    var tipo_cert_enviado = $("#tipo_cert_form").val();
    var $valid = true;
    var email1 = $("#email1");
    var email2 = $("#email2");
    var passhphrase = $("#passhphrase");
    var password2 = $("#password2");
    var tipoDoc = $("#tipoDoc option:selected");
    var numDoc = $("#documento_identificacao");
    var documentoId = tipoDoc.val() + " " + numDoc.val();

    var frm = $("#formCert");
    if (email1.val() != email2.val()) {
      $valid = false;
      passhphrase.addClass("no-compativel");
      password2.addClass("no-compativel");
    } else {
      $valid = true;
      password2.removeClass("no-compativel");
      passhphrase.removeClass("no-compativel");
    }
    if (passhphrase != password2) $valid = false;

    if (!$("#boleto").is(":checked") && !$("#credito").is(":checked")) {
      alert("Por Favor Selecione um Metodo de Pagamento!");

      return;
    } else if ($("#credito").is(":checked")) {
      if (
        !$("#valAno").val() ||
        !$("#numerocartao").val() ||
        !$("#valMes").val() ||
        !$("#cvv").val() ||
        !$("#titularCartao").val()
      ) {
        $("#valAno").addClass("obrigatorio");
        $("#numerocartao").addClass("obrigatorio");
        $("#valMes").addClass("obrigatorio");
        $("#cvv").addClass("obrigatorio");
        $("#titularCartao").addClass("obrigatorio");
        return;
      }
    } else {
      $("#valAno").removeClass("obrigatorio");
      $("#numerocartao").removeClass("obrigatorio");
      $("#valMes").removeClass("obrigatorio");
      $("#cvv").removeClass("obrigatorio");
      $("#titularCartao").removeClass("obrigatorio");
    }
    var domain = window.location.protocol + '//' + window.location.hostname;


    if(domain == 'https://pjfit.com.br'){
      var url = "https://app.pjfit.com.br/api/cert/v1/createCert";
    }else{
        var url = "/api/cert/v1/createCert";
    }
    $.ajax({
      url: url,
      type: "POST",
      data: frm.serialize(),
      success: function (response) {
        // you can see the result from the console
        // tab of the developer tools
        //	 var arr= JSON.parse(response)
        console.log(response);
        var r = response;

        if (r.resultado == "Erro") {
          botao_finalizacao.innerHTML = "Enviar Novamente";
          $("#CreateCert").prop("disabled", false);
          return alert("Erro, verifique os dados");
        }
        if (r.resultado != "Sucesso") {
          if (r.erroPag) {
            botao_finalizacao.innerHTML = "Enviar Novamente";
            $("#CreateCert").prop("disabled", false);
            return alert(
              "Erro no pagamento, por favor tente novamente! Se este erro persistir tenha cuidado e contate o nosso suporte."
            );
          }

          botao_finalizacao.innerHTML = "Enviar Novamente";
          $("#CreateCert").prop("disabled", false);

          alert("Erro, verifique os dados");

          return alert(r.mensagem);
        } else {
          tipoPagamento = document.getElementsByName("metodopagamento");
          console.log(tipoPagamento);

          if ($("#boleto").is(":checked")) {
            alert("Sucesso");
            var text_fim_ = document.getElementById("text-fim");
            text_fim_.innerHTML =
              "<p class='text-success'><i class='ml-1 fa-6x far fa-check-circle'></i></p> <h4 class='text-success pedido-sucess'> O seu pedido foi realizado com sucesso </h4> <div class=''><p class='col-6 mt-4 mx-auto'>Para continuar com a sua emissão de Certificado Anote o seu número de encomenda abaixo e verifique seu email, após isso, clique em agendar online para ser direcionado a um atendimento com um de nossos agentes!</p> <span>Número de encomenda é: <b>" +
              r.orderid +
              " </b> </span> </div> <p>Status de pagamento é: <b> Aguardando Pagamento de Boleto </b></p><p>Por favor olhe sua caixa de <b>email</b> <i class='ml-1 far fa-envelope'></i> ou fale com um de nossos agentes no agendamento para mais instruções! </p> <br> <div class='col-4 row mx-auto'> <label class=' col-12'>Faça o download do boleto aqui: </label> <a href=" +
              r.link_boleto +
              " class='btn btn-primary btn-download-boleto mx-auto mb-5'>Download Boleto <i class='fas fa-barcode'></i> </a> </div>";
          } else {
            alert("Sucesso");
            var text_fim_ = document.getElementById("text-fim");
            text_fim_.innerHTML =
              "<p class='text-success'><i class='ml-1 fa-6x far fa-check-circle'></i></p> <h4 class='text-success pedido-sucess'> O seu pedido foi realizado com sucesso </h4> <div class=''><p class='col-6 mt-4 mx-auto'>Para continuar com a sua emissão de Certificado Anote o seu número de encomenda abaixo e verifique seu email, após isso, clique em agendar online para ser direcionado a um atendimento com um de nossos agentes!</p> <span>Número de encomenda é: <b>" +
              r.orderid +
              " </b> </span> </div> <p>Status de pagamento é: <b> " +
              r.StatusOrder.statusPayment +
              " </b></p><p>Por favor olhe sua caixa de <b>email</b> <i class='ml-1 far fa-envelope'></i> ou fale com um de nossos agentes no agendamento para mais instruções! </p>";
          }
          botao_finalizacao.innerHTML = "Concluido";
          $(".step:visible").hide().next().show();

          //$(".step:visible").hide();
          // $("#input_orderid").val();
          // $("#cpf_fim").val();
          //$("#step_5").show();
        }
      },
      error: function () {
        alert(
          "Erro na compra, por favor chame o nosso suporte! Código de erro 400"
        );
        botao_finalizacao.innerHTML = "Enviar Novamente";
        $("#CreateCert").prop("disabled", false);
      },
    });
  });
});
