{"id":21,"date":"2026-08-14T17:15:50","date_gmt":"2026-08-14T17:15:50","guid":{"rendered":"https:\/\/vitalis.beauty\/?page_id=21"},"modified":"2026-08-14T17:15:50","modified_gmt":"2026-08-14T17:15:50","slug":"check-out-medica","status":"publish","type":"page","link":"https:\/\/vitalis.beauty\/?page_id=21","title":{"rendered":"Check-out (medica)"},"content":{"rendered":"\n<style>\n  :root {\n    --bg: #FAF9F6; --text: #1F1F1F; --muted: #6B6B6B; --accent: #A68A64;\n    --white: #FFFFFF; --border: #E5E5E5; --success: #2C5F2D; --error: #8B2E2E;\n  }\n  * { margin: 0; padding: 0; box-sizing: border-box; }\n  body { font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif; background: var(--bg); color: var(--text); }\n  .vitalis-container { max-width: 720px; margin: 0 auto; padding: 0 24px; }\n  .vitalis-nav { display: flex; justify-content: space-between; align-items: center; padding: 32px 0; border-bottom: 1px solid var(--border); }\n  .vitalis-logo { font-size: 24px; font-weight: 300; letter-spacing: 4px; text-transform: uppercase; color: var(--text); text-decoration: none; }\n  .vitalis-step { padding: 60px 0; }\n  .vitalis-step-number { font-size: 12px; text-transform: uppercase; letter-spacing: 2px; color: var(--accent); margin-bottom: 12px; }\n  .vitalis-step h2 { font-size: 24px; font-weight: 400; margin-bottom: 32px; }\n  .vitalis-order { background: var(--white); border: 1px solid var(--border); padding: 24px; margin-bottom: 40px; border-radius: 4px; }\n  .vitalis-order-item { display: flex; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid var(--border); font-size: 15px; }\n  .vitalis-order-total { display: flex; justify-content: space-between; padding-top: 16px; font-weight: 600; font-size: 18px; }\n  .vitalis-qr-box { background: var(--white); border: 1px solid var(--border); padding: 40px; text-align: center; border-radius: 4px; display: none; }\n  .vitalis-qr-box.active { display: block; }\n  #qrcode { margin: 24px auto; width: 200px; height: 200px; }\n  .vitalis-status { font-size: 14px; color: var(--muted); margin-top: 16px; }\n  .vitalis-status.approved { color: var(--success); font-weight: 600; }\n  .vitalis-btn { display: block; width: 100%; padding: 18px; background: var(--text); color: var(--white); text-decoration: none; font-size: 13px; letter-spacing: 2px; text-transform: uppercase; border: none; cursor: pointer; transition: all 0.3s; text-align: center; margin-top: 24px; }\n  .vitalis-btn:hover:not(:disabled) { background: var(--accent); }\n  .vitalis-btn:disabled { background: var(--border); color: var(--muted); cursor: not-allowed; }\n  .vitalis-hidden { display: none; }\n  .vitalis-footer { border-top: 1px solid var(--border); padding: 40px 0; text-align: center; font-size: 13px; color: var(--muted); margin-top: 60px; }\n<\/style>\n\n<div class=\"vitalis-container\">\n  <nav class=\"vitalis-nav\">\n    <a href=\"\/\" class=\"vitalis-logo\">Vitalis<\/a>\n    <span style=\"font-size:13px; color:var(--muted);\">Checkout seguro<\/span>\n  <\/nav>\n\n  <div class=\"vitalis-step\">\n    <div class=\"vitalis-step-number\">Paso 1 de 2<\/div>\n    <h2>Resumen de tu orden<\/h2>\n    \n    <div class=\"vitalis-order\">\n      <div class=\"vitalis-order-item\">\n        <span>Resveratrol Vitalis 500mg (x1)<\/span>\n        <span>$45.00<\/span>\n      <\/div>\n      <div class=\"vitalis-order-item\">\n        <span>Env\u00edo est\u00e1ndar<\/span>\n        <span>$0.00<\/span>\n      <\/div>\n      <div class=\"vitalis-order-total\">\n        <span>Total<\/span>\n        <span>$45.00 USD<\/span>\n      <\/div>\n    <\/div>\n\n    <div class=\"vitalis-step-number\">Paso 2 de 2<\/div>\n    <h2>Validaci\u00f3n m\u00e9dica interna<\/h2>\n    <p style=\"color:var(--muted); font-size:15px; margin-bottom:24px; font-weight:300;\">\n      Nuestro laboratorio proveedor exige autorizaci\u00f3n m\u00e9dica. Escane\u00e1 el QR con tu dispositivo m\u00e9dico o presentalo al profesional.\n    <\/p>\n\n    <div id=\"qr-module\" class=\"vitalis-qr-box\">\n      <div id=\"qrcode\"><\/div>\n      <div id=\"qr-status\" class=\"vitalis-status\">Generando c\u00f3digo de autorizaci\u00f3n&#8230;<\/div>\n    <\/div>\n\n    <div id=\"payment-zone\" class=\"vitalis-hidden\">\n      <div class=\"vitalis-status approved\" style=\"text-align:center; margin-bottom:24px;\">\u2705 Orden autorizada por el equipo m\u00e9dico.<\/div>\n      <button id=\"btn-pay\" class=\"vitalis-btn\" onclick=\"payNow()\">Pagar con Mercado Pago<\/button>\n    <\/div>\n  <\/div>\n<\/div>\n\n<div class=\"vitalis-footer\">\n  <div class=\"vitalis-container\">\n    \u00a9 2026 Vitalis Beauty. Todos los derechos reservados.\n  <\/div>\n<\/div>\n\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/qrcodejs\/1.0.0\/qrcode.min.js\"><\/script>\n<script>\n  \/\/ Simulaci\u00f3n de Order ID (en WordPress\/WooCommerce reemplazar por el real via PHP)\n  const ORDER_ID = 1001;\n  const API_BASE = '\/wp-json\/vitalis\/v1';\n  let pollInterval;\n\n  async function initMedicalCheck() {\n    try {\n      const res = await fetch(`${API_BASE}\/generate-token`, {\n        method: 'POST',\n        headers: {'Content-Type': 'application\/json'},\n        body: JSON.stringify({ order_id: ORDER_ID })\n      });\n      const data = await res.json();\n      \n      document.getElementById('qr-module').classList.add('active');\n      new QRCode(document.getElementById(\"qrcode\"), {\n        text: data.url,\n        width: 200,\n        height: 200,\n        colorDark : \"#1F1F1F\",\n        colorLight : \"#FFFFFF\",\n        correctLevel : QRCode.CorrectLevel.H\n      });\n      \n      document.getElementById('qr-status').innerText = \"Esperando autorizaci\u00f3n del equipo m\u00e9dico...\";\n      pollInterval = setInterval(checkApproval, 3000);\n    } catch (e) {\n      document.getElementById('qr-status').innerText = \"Error al generar QR. Recarg\u00e1 la p\u00e1gina.\";\n      document.getElementById('qr-status').style.color = \"var(--error)\";\n    }\n  }\n\n  async function checkApproval() {\n    try {\n      const res = await fetch(`${API_BASE}\/check-status\/${ORDER_ID}`);\n      const data = await res.json();\n      if (data.approved) {\n        clearInterval(pollInterval);\n        document.getElementById('qr-status').innerHTML = \"\u2705 Autorizado\";\n        document.getElementById('qr-status').classList.add('approved');\n        document.getElementById('qrcode').style.opacity = '0.3';\n        document.getElementById('payment-zone').classList.remove('vitalis-hidden');\n      }\n    } catch (e) { console.error(\"Polling error\", e); }\n  }\n\n  function payNow() {\n    \/\/ Redirecci\u00f3n a Mercado Pago (implementar endpoint real)\n    alert(\"Redireccionando a Mercado Pago... (Integrar con endpoint \/create-payment-preference)\");\n  }\n\n  initMedicalCheck();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Vitalis Checkout seguro Paso 1 de 2 Resumen de tu orden Resveratrol Vitalis 500mg (x1) $45.00 Env\u00edo est\u00e1ndar $0.00 Total $45.00 USD Paso 2 de 2 Validaci\u00f3n m\u00e9dica interna Nuestro laboratorio proveedor exige autorizaci\u00f3n m\u00e9dica. Escane\u00e1 el QR con tu dispositivo m\u00e9dico o presentalo al profesional. Generando c\u00f3digo de autorizaci\u00f3n&#8230; \u2705 Orden autorizada por el [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-21","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/vitalis.beauty\/index.php?rest_route=\/wp\/v2\/pages\/21","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vitalis.beauty\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/vitalis.beauty\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/vitalis.beauty\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/vitalis.beauty\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=21"}],"version-history":[{"count":1,"href":"https:\/\/vitalis.beauty\/index.php?rest_route=\/wp\/v2\/pages\/21\/revisions"}],"predecessor-version":[{"id":22,"href":"https:\/\/vitalis.beauty\/index.php?rest_route=\/wp\/v2\/pages\/21\/revisions\/22"}],"wp:attachment":[{"href":"https:\/\/vitalis.beauty\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=21"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}