{"id":1183,"date":"2020-06-22T14:48:50","date_gmt":"2020-06-22T19:48:50","guid":{"rendered":"https:\/\/asey.gob.mx\/web\/?page_id=1183"},"modified":"2026-09-14T13:45:36","modified_gmt":"2026-09-14T19:45:36","slug":"buzon-ciudadano","status":"publish","type":"page","link":"https:\/\/asey.gob.mx\/web\/buzon-ciudadano\/","title":{"rendered":"Buz\u00f3n Ciudadano"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1183\" class=\"elementor elementor-1183\">\n\t\t\t\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-d113d0e elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"d113d0e\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-fbb469b\" data-id=\"fbb469b\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-8a01c9d elementor-widget elementor-widget-html\" data-id=\"8a01c9d\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<div class=\"ev-white-wrapper\">\r\n  <form id=\"buzonAseyForm\">\r\n    \r\n    <div style=\"display:none !important;\" aria-hidden=\"true\">\r\n      <input type=\"text\" name=\"antispam_hidden_check\" tabindex=\"-1\" autocomplete=\"off\">\r\n    <\/div>\r\n    <input type=\"hidden\" name=\"form_start_time\" id=\"buzonTime\">\r\n    <input type=\"hidden\" name=\"math_hash\" id=\"bMathHash\">\r\n\r\n    \r\n    <div class=\"f-group\">\r\n      <label class=\"f-title\">Escribe tu correo <span class=\"f-req\">*<\/span><\/label>\r\n      <div class=\"f-row\">\r\n        <div class=\"f-col\">\r\n          <input \r\n            type=\"email\" \r\n            name=\"email\" \r\n            id=\"bEmail\" \r\n            placeholder=\"E-mail de contacto\" \r\n            required \r\n            autocomplete=\"off\"\r\n            onpaste=\"return false;\"\r\n            ondrop=\"return false;\">\r\n          <span class=\"f-subtext\">Correo electr\u00f3nico<\/span>\r\n        <\/div>\r\n        <div class=\"f-col\">\r\n          <input \r\n            type=\"email\" \r\n            name=\"email_confirm\" \r\n            id=\"bEmailConfirm\" \r\n            placeholder=\"Confirma tu correo\" \r\n            required \r\n            autocomplete=\"off\"\r\n            onpaste=\"return false;\"\r\n            ondrop=\"return false;\">\r\n          <span class=\"f-subtext\">Confirmar el correo electr\u00f3nico<\/span>\r\n          <span id=\"bEmailMatchWarning\" class=\"f-error-subtext\"><\/span>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"f-confidential\">\r\n      [Estos datos son de car\u00e1cter confidencial y \u00fanicamente podr\u00e1n ser utilizados para el fin espec\u00edfico]\r\n    <\/div>\r\n\r\n    \r\n    <div class=\"f-group\" style=\"margin-top: 15px;\">\r\n      <label class=\"f-title\">D\u00e9janos tu comentario: <span class=\"f-req\">*<\/span><\/label>\r\n      <textarea name=\"comentario\" id=\"bComment\" maxlength=\"800\" placeholder=\"D\u00e9janos tu comentario:\" required><\/textarea>\r\n      <div class=\"f-counter\">\r\n        <span id=\"bCharCounter\">0<\/span> de 800 caracteres m\u00e1ximos.\r\n        <span id=\"bMinHint\" style=\"color: #c62828; font-weight: 600; margin-left: 8px;\">(M\u00ednimo 50 caracteres)<\/span>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    \r\n    <div class=\"f-security-box\">\r\n      <span class=\"f-security-title\">Verifica que eres humano:<\/span>\r\n      <div class=\"f-math-inline\">\r\n        <span class=\"f-math-label\">\u00bfCu\u00e1nto es <strong id=\"bMathQuestion\">...<\/strong><\/span>\r\n        <div class=\"f-math-input-wrapper\">\r\n          <input \r\n            type=\"number\" \r\n            name=\"math_answer\" \r\n            id=\"bMathAnswer\" \r\n            placeholder=\"\" \r\n            required \r\n            autocomplete=\"off\">\r\n          <span id=\"bMathStatus\" class=\"f-math-status\"><\/span>\r\n        <\/div>\r\n        <button type=\"button\" id=\"bRefreshMathBtn\" title=\"Cambiar operaci\u00f3n\" aria-label=\"Cambiar operaci\u00f3n\">\r\n          <svg class=\"f-refresh-icon\" viewBox=\"0 0 24 24\" width=\"15\" height=\"15\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n            <polyline points=\"23 4 23 10 17 10\"><\/polyline>\r\n            <polyline points=\"1 20 1 14 7 14\"><\/polyline>\r\n            <path d=\"M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15\"><\/path>\r\n          <\/svg>\r\n        <\/button>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    \r\n    <div class=\"f-btn-row\">\r\n      <button type=\"submit\" id=\"bSubmitBtn\" disabled>Enviar<\/button>\r\n    <\/div>\r\n\r\n    <div id=\"bNotice\" class=\"f-notice\"><\/div>\r\n  <\/form>\r\n<\/div>\r\n\r\n<style>\r\n.ev-white-wrapper { width: 100%; box-sizing: border-box; font-family: inherit; }\r\n.ev-white-wrapper * { box-sizing: border-box; }\r\n.f-title { display: block; font-size: 14px; font-weight: 700; color: #1a1a1a; margin-bottom: 6px; }\r\n.f-req { color: #d32f2f; font-weight: bold; }\r\n.f-row { display: flex; gap: 16px; }\r\n.f-col { flex: 1; }\r\n.f-col input[type=\"email\"], .ev-white-wrapper textarea {\r\n  width: 100%; background: #ffffff; border: 1px solid #dcdcdc;\r\n  box-shadow: inset 0 1px 2px rgba(0,0,0,0.06); border-radius: 3px;\r\n  padding: 8px 12px; font-size: 13.5px; color: #2b2b2b; outline: none;\r\n}\r\n.f-col input[type=\"email\"] { height: 38px; }\r\n.f-col input[type=\"email\"]:focus, .ev-white-wrapper textarea:focus {\r\n  border-color: #d32f2f; box-shadow: 0 0 0 1px #d32f2f;\r\n}\r\n.input-mismatch { border-color: #c62828 !important; background-color: #fff9f9 !important; }\r\n.f-subtext { display: block; font-size: 11px; color: #666666; margin-top: 4px; }\r\n.f-error-subtext { display: block; font-size: 11px; color: #c62828; font-weight: 600; margin-top: 3px; }\r\n.f-confidential { font-size: 12.5px; line-height: 1.4; color: #222222; margin-top: 10px; font-weight: 500; }\r\n.ev-white-wrapper textarea { height: 110px; resize: vertical; }\r\n.f-counter { font-size: 12px; color: #444444; margin-top: 6px; }\r\n\r\n\/* Caja de Seguridad Alineada *\/\r\n.f-security-box {\r\n  margin-top: 15px;\r\n  background: #fdfdfd;\r\n  border: 1px solid #e2e8f0;\r\n  border-left: 3px solid #b71c1c;\r\n  padding: 12px 14px;\r\n  border-radius: 3px;\r\n}\r\n.f-security-title {\r\n  display: block;\r\n  font-size: 12.5px;\r\n  font-weight: 700;\r\n  color: #333333;\r\n  margin-bottom: 10px;\r\n}\r\n.f-math-inline {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n}\r\n.f-math-label {\r\n  font-size: 13px;\r\n  color: #444444;\r\n  white-space: nowrap;\r\n}\r\n.f-math-label strong {\r\n  font-size: 14.5px;\r\n  color: #b71c1c;\r\n  font-weight: 700;\r\n}\r\n.f-math-input-wrapper {\r\n  position: relative;\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n#bMathAnswer {\r\n  width: 90px;\r\n  height: 36px;\r\n  background: #ffffff;\r\n  border: 1px solid #cccccc;\r\n  border-radius: 3px;\r\n  padding: 4px 24px 4px 8px;\r\n  font-size: 14px;\r\n  font-weight: 700;\r\n  color: #222222;\r\n  text-align: center;\r\n  outline: none;\r\n  transition: border-color 0.2s, box-shadow 0.2s;\r\n}\r\n#bMathAnswer:focus {\r\n  border-color: #b71c1c;\r\n}\r\n#bMathAnswer.math-correct {\r\n  border-color: #2e7d32;\r\n  background-color: #f1f8f3;\r\n  color: #2e7d32;\r\n}\r\n#bMathAnswer.math-incorrect {\r\n  border-color: #c62828;\r\n  background-color: #fff8f8;\r\n  color: #c62828;\r\n}\r\n.f-math-status {\r\n  position: absolute;\r\n  right: 7px;\r\n  font-size: 12px;\r\n  font-weight: bold;\r\n}\r\n\r\n\/* Bot\u00f3n de refresco sin fondo rojo y perfectamente centrado *\/\r\n#bRefreshMathBtn {\r\n  background: #ffffff !important;\r\n  border: 1px solid #cccccc !important;\r\n  box-shadow: none !important;\r\n  border-radius: 3px;\r\n  height: 36px !important;\r\n  width: 36px !important;\r\n  min-width: 36px !important;\r\n  min-height: 36px !important;\r\n  cursor: pointer;\r\n  display: inline-flex !important;\r\n  align-items: center !important;\r\n  justify-content: center !important;\r\n  padding: 0 !important;\r\n  margin: 0 !important;\r\n  color: #555555 !important;\r\n  vertical-align: middle;\r\n  line-height: 1 !important;\r\n  transition: all 0.2s ease;\r\n}\r\n#bRefreshMathBtn:hover {\r\n  background: #f1f3f5 !important;\r\n  color: #b71c1c !important;\r\n  border-color: #b71c1c !important;\r\n}\r\n.f-refresh-icon {\r\n  display: block;\r\n  transition: transform 0.35s ease;\r\n}\r\n.f-rotating {\r\n  transform: rotate(360deg);\r\n}\r\n\r\n.f-btn-row { margin-top: 14px; }\r\n#bSubmitBtn {\r\n  background-color: #cf2027; color: #ffffff; border: 1px solid #b71c1c;\r\n  border-radius: 3px; padding: 9px 28px; font-size: 13px; font-weight: 700;\r\n  cursor: pointer; transition: background-color 0.2s, opacity 0.2s;\r\n}\r\n#bSubmitBtn:hover:not(:disabled) { background-color: #ab171d; }\r\n#bSubmitBtn:disabled {\r\n  background-color: #cccccc !important; border-color: #bbbbbb !important;\r\n  color: #777777 !important; cursor: not-allowed !important; opacity: 0.75;\r\n}\r\n.f-notice { margin-top: 10px; font-size: 13px; font-weight: 600; }\r\n@media (max-width: 600px) { \r\n  .f-row { flex-direction: column; gap: 8px; }\r\n  .f-math-inline { flex-wrap: wrap; }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function() {\r\n  function initBuzonSeguro() {\r\n    const form = document.getElementById('buzonAseyForm');\r\n    if (!form) return;\r\n\r\n    const email = document.getElementById('bEmail');\r\n    const emailConfirm = document.getElementById('bEmailConfirm');\r\n    const mismatchWarn = document.getElementById('bEmailMatchWarning');\r\n    const comment = document.getElementById('bComment');\r\n    const counter = document.getElementById('bCharCounter');\r\n    const minHint = document.getElementById('bMinHint');\r\n    const mathQuestion = document.getElementById('bMathQuestion');\r\n    const mathAnswer = document.getElementById('bMathAnswer');\r\n    const mathHash = document.getElementById('bMathHash');\r\n    const mathStatus = document.getElementById('bMathStatus');\r\n    const refreshBtn = document.getElementById('bRefreshMathBtn');\r\n    const refreshIcon = refreshBtn.querySelector('.f-refresh-icon');\r\n    const btn = document.getElementById('bSubmitBtn');\r\n    const notice = document.getElementById('bNotice');\r\n    const time = document.getElementById('buzonTime');\r\n\r\n    const MIN_CHARS = 50;\r\n    const MAX_CHARS = 800;\r\n    let expectedSolution = null;\r\n\r\n    time.value = Math.floor(Date.now() \/ 1000);\r\n\r\n    \/\/ Consulta de la suma aleatoria al backend\r\n    function pedirNuevoReto() {\r\n      mathQuestion.textContent = '...';\r\n      mathAnswer.value = '';\r\n      mathHash.value = '';\r\n      expectedSolution = null;\r\n      mathStatus.textContent = '';\r\n      mathAnswer.className = '';\r\n      if (refreshIcon) refreshIcon.classList.add('f-rotating');\r\n      verificarFormulario();\r\n\r\n      fetch('\/wp-admin\/admin-ajax.php?action=obtener_reto_matematico')\r\n        .then(res => res.json())\r\n        .then(res => {\r\n          if (res.success) {\r\n            mathQuestion.textContent = res.data.pregunta;\r\n            mathHash.value = res.data.hash;\r\n            try {\r\n              \/\/ Desempaquetar la soluci\u00f3n esperada para validar en vivo\r\n              const decoded = atob(res.data.token).split('|');\r\n              expectedSolution = parseInt(decoded[0], 10) \/ 73;\r\n            } catch(e) {\r\n              expectedSolution = null;\r\n            }\r\n          } else {\r\n            mathQuestion.textContent = 'Error';\r\n          }\r\n          verificarFormulario();\r\n        })\r\n        .catch(() => {\r\n          mathQuestion.textContent = 'Error';\r\n        })\r\n        .finally(() => {\r\n          setTimeout(() => {\r\n            if (refreshIcon) refreshIcon.classList.remove('f-rotating');\r\n          }, 350);\r\n        });\r\n    }\r\n\r\n    refreshBtn.addEventListener('click', pedirNuevoReto);\r\n\r\n    \/\/ Bloquear pegado en los correos\r\n    [email, emailConfirm].forEach(input => {\r\n      input.addEventListener('keydown', e => {\r\n        if ((e.ctrlKey || e.metaKey) && (e.key === 'v' || e.key === 'V')) e.preventDefault();\r\n      });\r\n      input.addEventListener('paste', e => e.preventDefault());\r\n      input.addEventListener('drop', e => e.preventDefault());\r\n    });\r\n\r\n    function validarEmail(v) {\r\n      return \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/.test(v);\r\n    }\r\n\r\n    function verificarFormulario() {\r\n      const vEmail = email.value.trim();\r\n      const vConfirm = emailConfirm.value.trim();\r\n      const vComment = comment.value.trim();\r\n      const vAnswer = parseInt(mathAnswer.value.trim(), 10);\r\n\r\n      \/\/ Revisi\u00f3n de correos\r\n      if (vConfirm.length > 0) {\r\n        if (vEmail !== vConfirm) {\r\n          emailConfirm.classList.add('input-mismatch');\r\n          mismatchWarn.textContent = 'Los correos electr\u00f3nicos no coinciden.';\r\n        } else {\r\n          emailConfirm.classList.remove('input-mismatch');\r\n          mismatchWarn.textContent = '';\r\n        }\r\n      } else {\r\n        emailConfirm.classList.remove('input-mismatch');\r\n        mismatchWarn.textContent = '';\r\n      }\r\n\r\n      const emailsOk = (vEmail === vConfirm) && validarEmail(vEmail);\r\n      const commentOk = vComment.length >= MIN_CHARS && vComment.length <= MAX_CHARS;\r\n      \r\n      \/\/ Validaci\u00f3n matem\u00e1tica en vivo: \u00bfCoincide el resultado exacto?\r\n      let mathCorrecto = false;\r\n      if (mathAnswer.value.trim() !== '' && expectedSolution !== null) {\r\n        if (vAnswer === expectedSolution) {\r\n          mathCorrecto = true;\r\n          mathAnswer.classList.remove('math-incorrect');\r\n          mathAnswer.classList.add('math-correct');\r\n          mathStatus.textContent = '\u2713';\r\n          mathStatus.style.color = '#2e7d32';\r\n        } else {\r\n          mathCorrecto = false;\r\n          mathAnswer.classList.remove('math-correct');\r\n          mathAnswer.classList.add('math-incorrect');\r\n          mathStatus.textContent = '\u2715';\r\n          mathStatus.style.color = '#c62828';\r\n        }\r\n      } else {\r\n        mathAnswer.className = '';\r\n        mathStatus.textContent = '';\r\n      }\r\n\r\n      \/\/ Gu\u00eda del m\u00ednimo de 50 caracteres\r\n      const commentLen = vComment.length;\r\n      if (commentLen === 0) {\r\n        minHint.textContent = '(M\u00ednimo 50 caracteres)';\r\n        minHint.style.color = '#c62828';\r\n      } else if (commentLen < MIN_CHARS) {\r\n        minHint.textContent = `(Faltan ${MIN_CHARS - commentLen} caracteres)`;\r\n        minHint.style.color = '#c62828';\r\n      } else {\r\n        minHint.textContent = '\u2713';\r\n        minHint.style.color = '#2e7d32';\r\n      }\r\n\r\n      \/\/ El bot\u00f3n solo se activa si los correos son id\u00e9nticos, comentario >= 50 y la suma es correcta\r\n      btn.disabled = !(emailsOk && commentOk && mathCorrecto);\r\n    }\r\n\r\n    comment.addEventListener('input', function() {\r\n      if (this.value.length > MAX_CHARS) {\r\n        this.value = this.value.substring(0, MAX_CHARS);\r\n      }\r\n      counter.textContent = this.value.length;\r\n      verificarFormulario();\r\n    });\r\n\r\n    email.addEventListener('input', verificarFormulario);\r\n    emailConfirm.addEventListener('input', verificarFormulario);\r\n    mathAnswer.addEventListener('input', verificarFormulario);\r\n\r\n    \/\/ Cargar la primera suma\r\n    pedirNuevoReto();\r\n\r\n    \/\/ Env\u00edo por AJAX\r\n    form.addEventListener('submit', function(e) {\r\n      e.preventDefault();\r\n\r\n      btn.disabled = true;\r\n      btn.textContent = 'Enviando...';\r\n      notice.textContent = '';\r\n\r\n      const formData = new FormData(form);\r\n      formData.append('action', 'enviar_formulario_contacto');\r\n\r\n      fetch('\/wp-admin\/admin-ajax.php', {\r\n        method: 'POST',\r\n        body: formData\r\n      })\r\n      .then(res => res.json())\r\n      .then(data => {\r\n        if (data.success) {\r\n          notice.style.color = '#2e7d32';\r\n          notice.textContent = data.data.mensaje;\r\n          form.reset();\r\n          counter.textContent = '0';\r\n          time.value = Math.floor(Date.now() \/ 1000);\r\n          pedirNuevoReto();\r\n        } else {\r\n          notice.style.color = '#c62828';\r\n          notice.textContent = data.data.mensaje;\r\n          btn.disabled = false;\r\n        }\r\n      })\r\n      .catch(() => {\r\n        notice.style.color = '#c62828';\r\n        notice.textContent = 'Error de conexi\u00f3n al procesar el mensaje.';\r\n        btn.disabled = false;\r\n      })\r\n      .finally(() => {\r\n        btn.textContent = 'Enviar';\r\n      });\r\n    });\r\n  }\r\n\r\n  if (document.readyState === 'loading') {\r\n    document.addEventListener('DOMContentLoaded', initBuzonSeguro);\r\n  } else {\r\n    initBuzonSeguro();\r\n  }\r\n})();\r\n<\/script>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Escribe tu correo * Correo electr\u00f3nico Confirmar el correo electr\u00f3nico [Estos datos son de car\u00e1cter confidencial y \u00fanicamente podr\u00e1n ser utilizados para el fin espec\u00edfico] D\u00e9janos tu comentario: * 0 de 800 caracteres m\u00e1ximos. (M\u00ednimo 50 caracteres) Verifica que eres humano: \u00bfCu\u00e1nto es &#8230; Enviar<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/asey.gob.mx\/web\/wp-json\/wp\/v2\/pages\/1183"}],"collection":[{"href":"https:\/\/asey.gob.mx\/web\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/asey.gob.mx\/web\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/asey.gob.mx\/web\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/asey.gob.mx\/web\/wp-json\/wp\/v2\/comments?post=1183"}],"version-history":[{"count":43,"href":"https:\/\/asey.gob.mx\/web\/wp-json\/wp\/v2\/pages\/1183\/revisions"}],"predecessor-version":[{"id":8697,"href":"https:\/\/asey.gob.mx\/web\/wp-json\/wp\/v2\/pages\/1183\/revisions\/8697"}],"wp:attachment":[{"href":"https:\/\/asey.gob.mx\/web\/wp-json\/wp\/v2\/media?parent=1183"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}