{"id":3703,"date":"2026-07-27T22:50:14","date_gmt":"2026-07-27T22:50:14","guid":{"rendered":"https:\/\/aiosretail.com\/?page_id=3703"},"modified":"2026-07-27T22:52:28","modified_gmt":"2026-07-27T22:52:28","slug":"get-started","status":"publish","type":"page","link":"https:\/\/aioshop.io\/vi\/get-started\/","title":{"rendered":"Get Started"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"3703\" class=\"elementor elementor-3703\" data-elementor-post-type=\"page\">\r\n\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-b4d6006 e-flex e-con-boxed e-con\" data-id=\"b4d6006\" data-element_type=\"container\" data-settings=\"{&quot;content_width&quot;:&quot;boxed&quot;}\">\r\n\t\t\t\t\t<div class=\"e-con-inner\">\r\n\t\t\t\t<div class=\"elementor-element elementor-element-1c01c49 elementor-widget elementor-widget-html\" data-id=\"1c01c49\" data-element_type=\"widget\" data-widget_type=\"html.default\">\r\n\t\t\t\t<div class=\"elementor-widget-container\">\r\n\t\t\t<!-- AIOS Retail Merchant Onboarding Form - WordPress Custom HTML Block -->\n<!-- Paste this entire file into a single WordPress Custom HTML block. -->\n<!-- Look for \"CONNECT YOUR FORM SUBMISSION ENDPOINT\" in the <script> below -->\n<!-- before publishing \u2014 no submission endpoint is configured by default. -->\n\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\" \/>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin \/>\n<link\n  href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@500;600;700;800;900&display=swap\"\n  rel=\"stylesheet\"\n\/>\n\n<style>\n\/* ==========================================================================\n   AIOS Retail Merchant Onboarding Form\n   Design tokens below are copied from the live AIOS Retail landing page\n   (index-wordpress.html, class prefix .ar-landing-page) so this form\n   matches the site's existing colors, type scale, radius, and spacing.\n   All rules are scoped under .ar-onboard-page so nothing here can leak\n   into the rest of the WordPress site.\n   ========================================================================== *\/\n\n.ar-onboard-page {\n  \/* AIOS Retail brand tokens (matches index-wordpress.html) *\/\n  --ar-teal-primary: #0a97ad;\n  --ar-teal: #08788b;\n  --ar-teal-dark: #066273;\n  --ar-teal-pressed: #054e5c;\n  --ar-cyan-soft: #9ad5e2;\n  --ar-cyan-pale: #e8f7fa;\n  --ar-text: #202a30;\n  --ar-muted: #5d6970;\n  --ar-bg-white: #ffffff;\n  --ar-bg-soft: #f4f8fa;\n  --ar-border: #dde8ec;\n  --ar-card-shadow: 0 6px 20px rgba(8, 120, 139, 0.08);\n\n  \/* Form-specific tokens (new, derived from the same scale) *\/\n  --ar-error: #d92d20;\n  --ar-error-bg: #fef3f2;\n  --ar-error-border: #fda29b;\n  --ar-radius-sm: 10px;\n  --ar-radius-md: 14px;\n  --ar-radius-lg: 18px;\n  --ar-field-height: 48px;\n}\n\n.ar-onboard-page,\n.ar-onboard-page * {\n  box-sizing: border-box;\n  font-family:\n    \"Inter\",\n    system-ui,\n    -apple-system,\n    BlinkMacSystemFont,\n    \"Segoe UI\",\n    sans-serif;\n}\n\n.ar-onboard-page {\n  color: var(--ar-text);\n  background: var(--ar-bg-soft);\n  overflow-x: clip;\n  -webkit-font-smoothing: antialiased;\n  padding: 56px 0 72px;\n}\n\n.ar-onboard-page img {\n  max-width: 100%;\n}\n\n.ar-onboard-page a:focus-visible,\n.ar-onboard-page button:focus-visible,\n.ar-onboard-page input:focus-visible,\n.ar-onboard-page select:focus-visible,\n.ar-onboard-page textarea:focus-visible {\n  outline: 3px solid var(--ar-teal);\n  outline-offset: 2px;\n}\n\n.ar-onboard-container {\n  width: 100%;\n  max-width: 800px;\n  margin: 0 auto;\n  padding: 0 20px;\n}\n\n\/* ---------- Intro \/ header ---------- *\/\n.ar-onboard-eyebrow {\n  color: var(--ar-teal);\n  font-size: 14px;\n  font-weight: 800;\n  text-transform: uppercase;\n  letter-spacing: 1px;\n  margin: 0 0 16px;\n  text-align: center;\n}\n\n.ar-onboard-page h1 {\n  font-size: clamp(30px, 5vw, 42px);\n  line-height: 1.15;\n  font-weight: 900;\n  color: var(--ar-text);\n  margin: 0 0 14px;\n  text-align: center;\n}\n\n.ar-onboard-lead {\n  font-size: clamp(16px, 2.2vw, 18px);\n  color: var(--ar-muted);\n  line-height: 1.6;\n  margin: 0 auto 8px;\n  text-align: center;\n  max-width: 620px;\n}\n\n.ar-onboard-processor-note {\n  font-size: 14px;\n  color: var(--ar-muted);\n  line-height: 1.55;\n  text-align: center;\n  max-width: 620px;\n  margin: 0 auto 40px;\n}\n\n.ar-onboard-processor-note strong {\n  color: var(--ar-text);\n  font-weight: 700;\n}\n\n\/* ---------- Form card ---------- *\/\n.ar-onboard-card {\n  background: #fff;\n  border: 1px solid var(--ar-border);\n  border-radius: var(--ar-radius-lg);\n  box-shadow: var(--ar-card-shadow);\n  padding: 36px 32px;\n}\n\n.ar-onboard-fieldset {\n  border: none;\n  margin: 0 0 36px;\n  padding: 0;\n}\n\n.ar-onboard-fieldset:last-of-type {\n  margin-bottom: 0;\n}\n\n.ar-onboard-legend {\n  width: 100%;\n  font-size: 19px;\n  font-weight: 800;\n  color: var(--ar-text);\n  padding: 0 0 8px;\n  margin: 0 0 20px;\n  border-bottom: 1px solid var(--ar-border);\n}\n\n.ar-onboard-section-hint {\n  font-size: 14px;\n  color: var(--ar-muted);\n  margin: -12px 0 20px;\n}\n\n\/* ---------- Grid layout: two columns desktop, one column mobile ---------- *\/\n.ar-onboard-grid {\n  display: grid;\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n  gap: 18px 20px;\n  margin-bottom: 4px;\n}\n\n.ar-onboard-grid > .ar-onboard-field-full {\n  grid-column: 1 \/ -1;\n}\n\n\/* ---------- Fields ---------- *\/\n.ar-onboard-field {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.ar-onboard-field label,\n.ar-onboard-field-group > .ar-onboard-group-label {\n  font-size: 14px;\n  font-weight: 700;\n  color: var(--ar-text);\n  margin-bottom: 7px;\n}\n\n.ar-onboard-required {\n  color: var(--ar-error);\n  margin-left: 2px;\n}\n\n.ar-onboard-hint {\n  font-size: 12.5px;\n  color: var(--ar-muted);\n  margin-top: 5px;\n}\n\n.ar-onboard-page input[type=\"text\"],\n.ar-onboard-page input[type=\"email\"],\n.ar-onboard-page input[type=\"tel\"],\n.ar-onboard-page input[type=\"number\"],\n.ar-onboard-page input[type=\"date\"],\n.ar-onboard-page input[type=\"url\"],\n.ar-onboard-page select,\n.ar-onboard-page textarea {\n  width: 100%;\n  min-height: var(--ar-field-height);\n  padding: 10px 14px;\n  font-size: 15px;\n  color: var(--ar-text);\n  background: #fff;\n  border: 1.5px solid var(--ar-border);\n  border-radius: var(--ar-radius-sm);\n  transition:\n    border-color 0.15s ease,\n    box-shadow 0.15s ease;\n  appearance: none;\n  -webkit-appearance: none;\n}\n\n.ar-onboard-page textarea {\n  min-height: 110px;\n  padding-top: 12px;\n  resize: vertical;\n}\n\n.ar-onboard-page input::placeholder,\n.ar-onboard-page textarea::placeholder {\n  color: #9aa3ae;\n}\n\n.ar-onboard-page input:hover,\n.ar-onboard-page select:hover,\n.ar-onboard-page textarea:hover {\n  border-color: #c3cdd8;\n}\n\n.ar-onboard-page input:focus,\n.ar-onboard-page select:focus,\n.ar-onboard-page textarea:focus {\n  border-color: var(--ar-teal);\n  box-shadow: 0 0 0 3px rgba(24, 182, 106, 0.15);\n  outline: none;\n}\n\n.ar-onboard-page select {\n  background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23667085' stroke-width='1.6' fill='none' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round'\/%3E%3C\/svg%3E\");\n  background-repeat: no-repeat;\n  background-position: right 14px center;\n  padding-right: 38px;\n}\n\n\/* Invalid state *\/\n.ar-onboard-field.has-error input,\n.ar-onboard-field.has-error select,\n.ar-onboard-field.has-error textarea {\n  border-color: var(--ar-error-border);\n  background: var(--ar-error-bg);\n}\n\n.ar-onboard-field-error {\n  display: none;\n  font-size: 13px;\n  color: var(--ar-error);\n  font-weight: 600;\n  margin-top: 6px;\n}\n\n.ar-onboard-field.has-error .ar-onboard-field-error {\n  display: block;\n}\n\n\/* ---------- Radio \/ checkbox \"pill card\" controls ---------- *\/\n.ar-onboard-choice-row {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 10px;\n}\n\n.ar-onboard-choice-card {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 18px;\n  border: 1.5px solid var(--ar-border);\n  border-radius: 999px;\n  font-size: 14px;\n  font-weight: 700;\n  color: var(--ar-text);\n  cursor: pointer;\n  background: #fff;\n  transition:\n    border-color 0.15s ease,\n    background 0.15s ease,\n    color 0.15s ease;\n}\n\n.ar-onboard-choice-card input {\n  position: absolute;\n  opacity: 0;\n  width: 1px;\n  height: 1px;\n  pointer-events: none;\n}\n\n.ar-onboard-choice-card:hover {\n  border-color: var(--ar-teal);\n}\n\n.ar-onboard-choice-card:has(input:focus-visible) {\n  outline: 3px solid var(--ar-teal);\n  outline-offset: 2px;\n}\n\n.ar-onboard-choice-card:has(input:checked),\n.ar-onboard-choice-card.is-checked {\n  border-color: var(--ar-teal);\n  background: var(--ar-cyan-pale);\n  color: var(--ar-teal-pressed);\n}\n\n\/* ---------- Equipment grid (checkbox cards) ---------- *\/\n.ar-onboard-equipment-grid {\n  display: grid;\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n  gap: 12px;\n}\n\n.ar-onboard-equipment-card {\n  position: relative;\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n  padding: 14px 16px;\n  border: 1.5px solid var(--ar-border);\n  border-radius: var(--ar-radius-md);\n  background: #fff;\n  cursor: pointer;\n  transition:\n    border-color 0.15s ease,\n    background 0.15s ease;\n}\n\n.ar-onboard-equipment-card input {\n  margin-top: 2px;\n  width: 18px;\n  height: 18px;\n  accent-color: var(--ar-teal);\n  flex-shrink: 0;\n  cursor: pointer;\n}\n\n.ar-onboard-equipment-card span {\n  font-size: 14.5px;\n  font-weight: 600;\n  color: var(--ar-text);\n  line-height: 1.4;\n}\n\n.ar-onboard-equipment-card:hover {\n  border-color: var(--ar-teal);\n}\n\n.ar-onboard-equipment-card:has(input:focus-visible) {\n  outline: 3px solid var(--ar-teal);\n  outline-offset: 2px;\n}\n\n.ar-onboard-equipment-card:has(input:checked),\n.ar-onboard-equipment-card.is-checked {\n  border-color: var(--ar-teal);\n  background: var(--ar-cyan-pale);\n}\n\n\/* ---------- Consent checkbox ---------- *\/\n.ar-onboard-consent {\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n  padding: 16px;\n  background: var(--ar-bg-soft);\n  border: 1px solid var(--ar-border);\n  border-radius: var(--ar-radius-md);\n}\n\n.ar-onboard-consent input {\n  margin-top: 3px;\n  width: 18px;\n  height: 18px;\n  accent-color: var(--ar-teal);\n  flex-shrink: 0;\n  cursor: pointer;\n}\n\n.ar-onboard-consent label {\n  font-size: 14px;\n  line-height: 1.55;\n  color: var(--ar-text);\n  cursor: pointer;\n}\n\n.ar-onboard-consent.has-error {\n  border-color: var(--ar-error-border);\n  background: var(--ar-error-bg);\n}\n\n\/* ---------- Buttons ---------- *\/\n.ar-onboard-actions {\n  margin-top: 32px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 14px;\n}\n\n.ar-onboard-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n  text-align: center;\n  min-height: 50px;\n  width: 100%;\n  max-width: 320px;\n  padding: 14px 24px;\n  border-radius: 10px;\n  border: none;\n  font-size: 16px;\n  font-weight: 800;\n  font-family: inherit;\n  text-decoration: none;\n  cursor: pointer;\n  transition: 0.2s ease;\n}\n\n.ar-onboard-btn-primary {\n  background: var(--ar-teal);\n  color: #fff;\n}\n\n.ar-onboard-btn-primary:hover:not(:disabled) {\n  background: var(--ar-teal-dark);\n}\n\n.ar-onboard-btn-primary:active:not(:disabled) {\n  background: var(--ar-teal-pressed);\n}\n\n.ar-onboard-btn-primary:disabled {\n  background: var(--ar-cyan-soft);\n  cursor: not-allowed;\n}\n\n.ar-onboard-spinner {\n  width: 18px;\n  height: 18px;\n  border: 2.5px solid rgba(255, 255, 255, 0.5);\n  border-top-color: #fff;\n  border-radius: 50%;\n  display: none;\n  animation: ar-onboard-spin 0.7s linear infinite;\n}\n\n.ar-onboard-btn-primary.is-loading .ar-onboard-spinner {\n  display: inline-block;\n}\n\n@keyframes ar-onboard-spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n.ar-onboard-fine-print {\n  font-size: 12.5px;\n  color: var(--ar-muted);\n  text-align: center;\n  max-width: 420px;\n  line-height: 1.5;\n}\n\n\/* ---------- Form-level messages ---------- *\/\n.ar-onboard-alert {\n  display: none;\n  align-items: flex-start;\n  gap: 10px;\n  padding: 14px 16px;\n  border-radius: var(--ar-radius-md);\n  font-size: 14.5px;\n  font-weight: 600;\n  line-height: 1.5;\n  margin-bottom: 24px;\n}\n\n.ar-onboard-alert.is-visible {\n  display: flex;\n}\n\n.ar-onboard-alert-error {\n  background: var(--ar-error-bg);\n  border: 1px solid var(--ar-error-border);\n  color: var(--ar-error);\n}\n\n.ar-onboard-alert-network {\n  background: var(--ar-error-bg);\n  border: 1px solid var(--ar-error-border);\n  color: var(--ar-error);\n}\n\n\/* ---------- Success state ---------- *\/\n.ar-onboard-success {\n  display: none;\n  text-align: center;\n  padding: 20px 4px 4px;\n}\n\n.ar-onboard-success.is-visible {\n  display: block;\n}\n\n.ar-onboard-success-icon {\n  width: 60px;\n  height: 60px;\n  margin: 0 auto 20px;\n  border-radius: 50%;\n  background: var(--ar-cyan-pale);\n  color: var(--ar-teal);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 30px;\n  font-weight: 900;\n}\n\n.ar-onboard-success h2 {\n  font-size: 24px;\n  font-weight: 800;\n  color: var(--ar-text);\n  margin: 0 0 10px;\n}\n\n.ar-onboard-success p {\n  font-size: 16px;\n  color: var(--ar-muted);\n  line-height: 1.6;\n  max-width: 440px;\n  margin: 0 auto;\n}\n\n.ar-onboard-form.is-submitted {\n  display: none;\n}\n\n\/* ---------- Tablet ---------- *\/\n@media (max-width: 992px) {\n  .ar-onboard-card {\n    padding: 30px 24px;\n  }\n}\n\n\/* ---------- Mobile ---------- *\/\n@media (max-width: 640px) {\n  .ar-onboard-page {\n    padding: 40px 0 56px;\n  }\n\n  .ar-onboard-container {\n    padding: 0 16px;\n  }\n\n  .ar-onboard-card {\n    padding: 24px 18px;\n    border-radius: var(--ar-radius-md);\n  }\n\n  .ar-onboard-grid,\n  .ar-onboard-equipment-grid {\n    grid-template-columns: minmax(0, 1fr);\n  }\n\n  .ar-onboard-legend {\n    font-size: 18px;\n  }\n\n  .ar-onboard-choice-row {\n    flex-direction: column;\n    align-items: stretch;\n  }\n\n  .ar-onboard-choice-card {\n    justify-content: flex-start;\n  }\n\n  .ar-onboard-btn {\n    max-width: 100%;\n  }\n}\n\n<\/style>\n\n<div class=\"ar-onboard-page\">\n  <div class=\"ar-onboard-container\">\n    <p class=\"ar-onboard-eyebrow\">Merchant Onboarding<\/p>\n    <h1>Let's Get Your Business Set Up<\/h1>\n    <p class=\"ar-onboard-lead\">\n      Tell us a bit about your business and we'll start your onboarding with AIOS Retail.\n    <\/p>\n    <p class=\"ar-onboard-processor-note\">\n      AIOS Retail merchants are processed through <strong>GOAT Payments<\/strong>. This form only\n      collects basic contact and business details \u2014 a GOAT Payments specialist will\n      follow up separately to securely collect any documents needed for your payment\n      processing application.\n    <\/p>\n\n    <div class=\"ar-onboard-card\">\n      <!-- Validation summary (shown by JS when required fields are missing) -->\n      <div class=\"ar-onboard-alert ar-onboard-alert-error\" id=\"ar-onboard-error-summary\" role=\"alert\">\n        <span>\u26a0<\/span>\n        <span>Please complete the required fields highlighted below before submitting.<\/span>\n      <\/div>\n\n      <!-- Network \/ submission error (shown by JS if the fetch to your endpoint fails) -->\n      <div class=\"ar-onboard-alert ar-onboard-alert-network\" id=\"ar-onboard-network-error\" role=\"alert\">\n        <span>\u26a0<\/span>\n        <span>\n          We couldn't submit your request. Please check your connection and try again, or\n          contact us directly at\n          <a href=\"mailto:support@aiosretail.com\">support@aiosretail.com<\/a>.\n        <\/span>\n      <\/div>\n\n      <!-- ===================================================================\n           FORM SUBMISSION ENDPOINT: connect this in ar-onboarding-form.js\n           (look for AR_ONBOARDING_ENDPOINT near the top of the file).\n           This <form> intentionally has no working `action` \u2014 submission is\n           handled entirely by JavaScript so it can be pointed at a WordPress\n           AJAX handler, REST route, Gravity Forms \/ WPForms endpoint, or any\n           other backend without changing this markup.\n           =================================================================== -->\n      <form class=\"ar-onboard-form\" id=\"ar-onboard-form\" novalidate>\n        <!-- 1. Contact Information -->\n        <fieldset class=\"ar-onboard-fieldset\">\n          <legend class=\"ar-onboard-legend\">1. Contact Information<\/legend>\n\n          <div class=\"ar-onboard-grid\">\n            <div class=\"ar-onboard-field\" data-field=\"contactName\">\n              <label for=\"ar-contact-name\">Contact name <span class=\"ar-onboard-required\">*<\/span><\/label>\n              <input type=\"text\" id=\"ar-contact-name\" name=\"contactName\" autocomplete=\"name\" required \/>\n              <p class=\"ar-onboard-field-error\">Please enter your name.<\/p>\n            <\/div>\n\n            <div class=\"ar-onboard-field\" data-field=\"email\">\n              <label for=\"ar-email\">Email address <span class=\"ar-onboard-required\">*<\/span><\/label>\n              <input type=\"email\" id=\"ar-email\" name=\"email\" autocomplete=\"email\" inputmode=\"email\" required \/>\n              <p class=\"ar-onboard-field-error\">Please enter a valid email address.<\/p>\n            <\/div>\n\n            <div class=\"ar-onboard-field\" data-field=\"phone\">\n              <label for=\"ar-phone\">Phone number <span class=\"ar-onboard-required\">*<\/span><\/label>\n              <input type=\"tel\" id=\"ar-phone\" name=\"phone\" autocomplete=\"tel\" inputmode=\"tel\" placeholder=\"(555) 555-5555\" required \/>\n              <p class=\"ar-onboard-field-error\">Please enter a valid phone number.<\/p>\n            <\/div>\n\n            <div class=\"ar-onboard-field ar-onboard-field-full\" data-field=\"preferredContact\">\n              <span class=\"ar-onboard-group-label\">Preferred contact method <span class=\"ar-onboard-required\">*<\/span><\/span>\n              <div class=\"ar-onboard-choice-row\" role=\"radiogroup\" aria-label=\"Preferred contact method\">\n                <label class=\"ar-onboard-choice-card\">\n                  <input type=\"radio\" name=\"preferredContact\" value=\"Phone\" required \/>\n                  <span>Phone<\/span>\n                <\/label>\n                <label class=\"ar-onboard-choice-card\">\n                  <input type=\"radio\" name=\"preferredContact\" value=\"Email\" required \/>\n                  <span>Email<\/span>\n                <\/label>\n                <label class=\"ar-onboard-choice-card\">\n                  <input type=\"radio\" name=\"preferredContact\" value=\"Text\" required \/>\n                  <span>Text<\/span>\n                <\/label>\n              <\/div>\n              <p class=\"ar-onboard-field-error\">Please choose a preferred contact method.<\/p>\n            <\/div>\n          <\/div>\n        <\/fieldset>\n\n        <!-- 2. Business Information -->\n        <fieldset class=\"ar-onboard-fieldset\">\n          <legend class=\"ar-onboard-legend\">2. Business Information<\/legend>\n\n          <div class=\"ar-onboard-grid\">\n            <div class=\"ar-onboard-field\" data-field=\"legalName\">\n              <label for=\"ar-legal-name\">Legal business name <span class=\"ar-onboard-required\">*<\/span><\/label>\n              <input type=\"text\" id=\"ar-legal-name\" name=\"legalName\" autocomplete=\"organization\" required \/>\n              <p class=\"ar-onboard-field-error\">Please enter your legal business name.<\/p>\n            <\/div>\n\n            <div class=\"ar-onboard-field\">\n              <label for=\"ar-dba\">DBA or store name<\/label>\n              <input type=\"text\" id=\"ar-dba\" name=\"dba\" \/>\n              <p class=\"ar-onboard-hint\">If different from your legal business name.<\/p>\n            <\/div>\n\n            <div class=\"ar-onboard-field ar-onboard-field-full\" data-field=\"address\">\n              <label for=\"ar-address\">Business address <span class=\"ar-onboard-required\">*<\/span><\/label>\n              <input type=\"text\" id=\"ar-address\" name=\"address\" autocomplete=\"street-address\" required \/>\n              <p class=\"ar-onboard-field-error\">Please enter your business address.<\/p>\n            <\/div>\n\n            <div class=\"ar-onboard-field\" data-field=\"city\">\n              <label for=\"ar-city\">City <span class=\"ar-onboard-required\">*<\/span><\/label>\n              <input type=\"text\" id=\"ar-city\" name=\"city\" autocomplete=\"address-level2\" required \/>\n              <p class=\"ar-onboard-field-error\">Please enter your city.<\/p>\n            <\/div>\n\n            <div class=\"ar-onboard-field\" data-field=\"state\">\n              <label for=\"ar-state\">State <span class=\"ar-onboard-required\">*<\/span><\/label>\n              <input type=\"text\" id=\"ar-state\" name=\"state\" autocomplete=\"address-level1\" placeholder=\"e.g. TX\" required \/>\n              <p class=\"ar-onboard-field-error\">Please enter your state.<\/p>\n            <\/div>\n\n            <div class=\"ar-onboard-field\" data-field=\"zip\">\n              <label for=\"ar-zip\">ZIP code <span class=\"ar-onboard-required\">*<\/span><\/label>\n              <input type=\"text\" id=\"ar-zip\" name=\"zip\" autocomplete=\"postal-code\" inputmode=\"numeric\" placeholder=\"76021\" required \/>\n              <p class=\"ar-onboard-field-error\">Please enter a valid ZIP code.<\/p>\n            <\/div>\n\n            <div class=\"ar-onboard-field\">\n              <label for=\"ar-website\">Business website<\/label>\n              <input type=\"url\" id=\"ar-website\" name=\"website\" autocomplete=\"url\" placeholder=\"https:\/\/\" \/>\n            <\/div>\n\n            <div class=\"ar-onboard-field\" data-field=\"businessType\">\n              <label for=\"ar-business-type\">Business type <span class=\"ar-onboard-required\">*<\/span><\/label>\n              <select id=\"ar-business-type\" name=\"businessType\" required>\n                <option value=\"\" disabled selected>Select one<\/option>\n                <option value=\"Retail Store\">Retail store<\/option>\n                <option value=\"Specialty Retail\">Specialty retail<\/option>\n                <option value=\"Convenience Store\">Convenience store<\/option>\n                <option value=\"Restaurant \/ Food Service\">Restaurant \/ food service<\/option>\n                <option value=\"Salon \/ Spa\">Salon \/ spa<\/option>\n                <option value=\"E-commerce \/ Online Only\">E-commerce \/ online only<\/option>\n                <option value=\"Other\">Other<\/option>\n              <\/select>\n              <p class=\"ar-onboard-field-error\">Please select a business type.<\/p>\n            <\/div>\n\n            <div class=\"ar-onboard-field\">\n              <label for=\"ar-locations\">Number of locations<\/label>\n              <input type=\"number\" id=\"ar-locations\" name=\"locations\" min=\"1\" step=\"1\" placeholder=\"1\" \/>\n            <\/div>\n          <\/div>\n        <\/fieldset>\n\n        <!-- 3. Processing Information -->\n        <fieldset class=\"ar-onboard-fieldset\">\n          <legend class=\"ar-onboard-legend\">3. Processing Information<\/legend>\n          <p class=\"ar-onboard-section-hint\">\n            This helps us prepare your GOAT Payments application \u2014 no sensitive banking or\n            identity documents are collected here.\n          <\/p>\n\n          <div class=\"ar-onboard-grid\">\n            <div class=\"ar-onboard-field\">\n              <label for=\"ar-current-processor\">Current payment processor<\/label>\n              <input type=\"text\" id=\"ar-current-processor\" name=\"currentProcessor\" placeholder=\"e.g. Square, Stripe, none\" \/>\n            <\/div>\n\n            <div class=\"ar-onboard-field\">\n              <label for=\"ar-monthly-volume\">Estimated monthly card volume<\/label>\n              <select id=\"ar-monthly-volume\" name=\"monthlyVolume\">\n                <option value=\"\" disabled selected>Select a range<\/option>\n                <option value=\"Under $10,000\">Under $10,000<\/option>\n                <option value=\"$10,000\u2013$25,000\">$10,000\u2013$25,000<\/option>\n                <option value=\"$25,000\u2013$50,000\">$25,000\u2013$50,000<\/option>\n                <option value=\"$50,000\u2013$100,000\">$50,000\u2013$100,000<\/option>\n                <option value=\"$100,000\u2013$250,000\">$100,000\u2013$250,000<\/option>\n                <option value=\"$250,000+\">$250,000+<\/option>\n                <option value=\"Not sure yet\">Not sure yet<\/option>\n              <\/select>\n            <\/div>\n\n            <div class=\"ar-onboard-field\">\n              <label for=\"ar-avg-transaction\">Average transaction amount<\/label>\n              <input type=\"text\" id=\"ar-avg-transaction\" name=\"avgTransaction\" inputmode=\"decimal\" placeholder=\"$25.00\" \/>\n            <\/div>\n\n            <div class=\"ar-onboard-field\">\n              <label for=\"ar-current-pos\">Current POS system<\/label>\n              <input type=\"text\" id=\"ar-current-pos\" name=\"currentPos\" placeholder=\"e.g. Clover, none\" \/>\n            <\/div>\n\n            <div class=\"ar-onboard-field ar-onboard-field-full\">\n              <label for=\"ar-start-date\">Desired start date<\/label>\n              <input type=\"date\" id=\"ar-start-date\" name=\"startDate\" \/>\n            <\/div>\n          <\/div>\n        <\/fieldset>\n\n        <!-- 4. Equipment -->\n        <fieldset class=\"ar-onboard-fieldset\">\n          <legend class=\"ar-onboard-legend\">4. Equipment<\/legend>\n          <p class=\"ar-onboard-section-hint\">Select all that apply.<\/p>\n\n          <div class=\"ar-onboard-equipment-grid\" role=\"group\" aria-label=\"Equipment needed\">\n            <label class=\"ar-onboard-equipment-card\">\n              <input type=\"checkbox\" name=\"equipment\" value=\"Countertop POS\" \/>\n              <span>Countertop POS<\/span>\n            <\/label>\n            <label class=\"ar-onboard-equipment-card\">\n              <input type=\"checkbox\" name=\"equipment\" value=\"Customer-facing display\" \/>\n              <span>Customer-facing display<\/span>\n            <\/label>\n            <label class=\"ar-onboard-equipment-card\">\n              <input type=\"checkbox\" name=\"equipment\" value=\"Receipt printer\" \/>\n              <span>Receipt printer<\/span>\n            <\/label>\n            <label class=\"ar-onboard-equipment-card\">\n              <input type=\"checkbox\" name=\"equipment\" value=\"Cash drawer\" \/>\n              <span>Cash drawer<\/span>\n            <\/label>\n            <label class=\"ar-onboard-equipment-card\">\n              <input type=\"checkbox\" name=\"equipment\" value=\"Barcode scanner\" \/>\n              <span>Barcode scanner<\/span>\n            <\/label>\n            <label class=\"ar-onboard-equipment-card\">\n              <input type=\"checkbox\" name=\"equipment\" value=\"Card terminal\" \/>\n              <span>Card terminal<\/span>\n            <\/label>\n            <label class=\"ar-onboard-equipment-card\">\n              <input type=\"checkbox\" name=\"equipment\" value=\"Tablet or mobile POS\" \/>\n              <span>Tablet or mobile POS<\/span>\n            <\/label>\n            <label class=\"ar-onboard-equipment-card\">\n              <input type=\"checkbox\" name=\"equipment\" value=\"Not sure\" \/>\n              <span>Not sure \u2014 need a recommendation<\/span>\n            <\/label>\n          <\/div>\n        <\/fieldset>\n\n        <!-- 5. Additional Information -->\n        <fieldset class=\"ar-onboard-fieldset\">\n          <legend class=\"ar-onboard-legend\">5. Additional Information<\/legend>\n\n          <div class=\"ar-onboard-grid\">\n            <div class=\"ar-onboard-field ar-onboard-field-full\">\n              <label for=\"ar-notes\">Notes or special requirements<\/label>\n              <textarea id=\"ar-notes\" name=\"notes\" rows=\"4\" placeholder=\"Anything else we should know?\"><\/textarea>\n            <\/div>\n\n            <div class=\"ar-onboard-field-full\" data-field=\"consent\">\n              <div class=\"ar-onboard-consent\">\n                <input type=\"checkbox\" id=\"ar-consent\" name=\"consent\" required \/>\n                <label for=\"ar-consent\">\n                  I agree that the information above may be used to contact me about onboarding\n                  with AIOS Retail. <span class=\"ar-onboard-required\">*<\/span>\n                <\/label>\n              <\/div>\n              <p class=\"ar-onboard-field-error\">Please confirm consent to continue.<\/p>\n            <\/div>\n          <\/div>\n        <\/fieldset>\n\n        <div class=\"ar-onboard-actions\">\n          <button type=\"submit\" class=\"ar-onboard-btn ar-onboard-btn-primary\" id=\"ar-onboard-submit\">\n            <span class=\"ar-onboard-spinner\" aria-hidden=\"true\"><\/span>\n            <span class=\"ar-onboard-btn-label\">Submit Onboarding Request<\/span>\n          <\/button>\n          <p class=\"ar-onboard-fine-print\">\n            We'll never ask for your SSN, bank details, or ID on this form.\n          <\/p>\n        <\/div>\n      <\/form>\n\n      <!-- Success state (shown by JS after a valid submission) -->\n      <div class=\"ar-onboard-success\" id=\"ar-onboard-success\">\n        <div class=\"ar-onboard-success-icon\" aria-hidden=\"true\">\u2713<\/div>\n        <h2>Request received<\/h2>\n        <p>\n          Thank you. Your onboarding request has been received. An AIOS Retail representative will\n          contact you within one business day.\n        <\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n\n<script>\n\/* ==========================================================================\n   AIOS Retail Merchant Onboarding Form \u2014 validation + submission handling\n   No external libraries. Safe to paste into a WordPress Custom HTML block.\n   ========================================================================== *\/\n(function () {\n  \"use strict\";\n\n  \/* ========================================================================\n     \ud83d\udd0c CONNECT YOUR FORM SUBMISSION ENDPOINT HERE\n     ------------------------------------------------------------------------\n     Set AR_ONBOARDING_ENDPOINT to the URL that should receive the form\n     data \u2014 e.g. a WordPress REST route, a Gravity Forms \/ WPForms AJAX\n     endpoint, or a third-party form service (Formspree, Basin, etc.).\n\n     While this is left blank (\"\") the form will validate normally but will\n     NOT send data anywhere \u2014 it will just show the success message so you\n     can preview the experience locally. This is intentional: no fake\n     backend is included. Set the endpoint before this goes live.\n     ======================================================================== *\/\n  var AR_ONBOARDING_ENDPOINT = \"\"; \/\/ e.g. \"https:\/\/aiosretail.com\/wp-json\/ar\/v1\/onboarding\"\n\n  var form = document.getElementById(\"ar-onboard-form\");\n  if (!form) return;\n\n  var submitBtn = document.getElementById(\"ar-onboard-submit\");\n  var btnLabel = submitBtn.querySelector(\".ar-onboard-btn-label\");\n  var errorSummary = document.getElementById(\"ar-onboard-error-summary\");\n  var networkError = document.getElementById(\"ar-onboard-network-error\");\n  var successPanel = document.getElementById(\"ar-onboard-success\");\n\n  var EMAIL_RE = \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/;\n  var ZIP_RE = \/^\\d{5}(-\\d{4})?$\/;\n  var PHONE_RE = \/^[\\d\\s()+.-]{7,}$\/;\n\n  \/* ---------- visual \"checked\" state for pill \/ card controls ----------\n     :has() covers modern browsers; this listener is a safe fallback for\n     any browser\/environment where :has() isn't supported. *\/\n  form.querySelectorAll(\".ar-onboard-choice-card, .ar-onboard-equipment-card\").forEach(function (card) {\n    var input = card.querySelector(\"input\");\n    if (!input) return;\n    var sync = function () {\n      if (input.type === \"radio\") {\n        var name = input.name;\n        form.querySelectorAll('input[name=\"' + name + '\"]').forEach(function (radio) {\n          radio.closest(\".ar-onboard-choice-card\").classList.toggle(\"is-checked\", radio.checked);\n        });\n      } else {\n        card.classList.toggle(\"is-checked\", input.checked);\n      }\n    };\n    input.addEventListener(\"change\", sync);\n    sync();\n  });\n\n  \/* ---------- field-level validators ---------- *\/\n  function fieldWrap(name) {\n    return form.querySelector('[data-field=\"' + name + '\"]');\n  }\n\n  function setError(name, hasError) {\n    var wrap = fieldWrap(name);\n    if (wrap) wrap.classList.toggle(\"has-error\", hasError);\n    return hasError;\n  }\n\n  function validate() {\n    var invalid = false;\n\n    invalid = setError(\"contactName\", !form.contactName.value.trim()) || invalid;\n    invalid = setError(\"email\", !EMAIL_RE.test(form.email.value.trim())) || invalid;\n    invalid = setError(\"phone\", !PHONE_RE.test(form.phone.value.trim())) || invalid;\n    invalid =\n      setError(\"preferredContact\", !form.querySelector('input[name=\"preferredContact\"]:checked')) || invalid;\n\n    invalid = setError(\"legalName\", !form.legalName.value.trim()) || invalid;\n    invalid = setError(\"address\", !form.address.value.trim()) || invalid;\n    invalid = setError(\"city\", !form.city.value.trim()) || invalid;\n    invalid = setError(\"state\", !form.state.value.trim()) || invalid;\n    invalid = setError(\"zip\", !ZIP_RE.test(form.zip.value.trim())) || invalid;\n    invalid = setError(\"businessType\", !form.businessType.value) || invalid;\n\n    var consentWrap = fieldWrap(\"consent\");\n    var consentBad = !form.consent.checked;\n    if (consentWrap) {\n      consentWrap.classList.toggle(\"has-error\", consentBad);\n      var consentBox = consentWrap.querySelector(\".ar-onboard-consent\");\n      if (consentBox) consentBox.classList.toggle(\"has-error\", consentBad);\n    }\n    invalid = consentBad || invalid;\n\n    return !invalid;\n  }\n\n  \/* Clear a field's error state as soon as the merchant fixes it *\/\n  form.addEventListener(\"input\", function (e) {\n    var wrap = e.target.closest(\"[data-field]\");\n    if (wrap) wrap.classList.remove(\"has-error\");\n  });\n  form.addEventListener(\"change\", function (e) {\n    var wrap = e.target.closest(\"[data-field]\");\n    if (wrap) wrap.classList.remove(\"has-error\");\n  });\n\n  function collectFormData() {\n    var data = new FormData(form);\n    var equipment = data.getAll(\"equipment\");\n    var payload = {};\n    data.forEach(function (value, key) {\n      if (key === \"equipment\") return;\n      payload[key] = value;\n    });\n    payload.equipment = equipment;\n    return payload;\n  }\n\n  function setLoading(isLoading) {\n    submitBtn.disabled = isLoading;\n    submitBtn.classList.toggle(\"is-loading\", isLoading);\n    btnLabel.textContent = isLoading ? \"Submitting\u2026\" : \"Submit Onboarding Request\";\n  }\n\n  function showSuccess() {\n    form.classList.add(\"is-submitted\");\n    successPanel.classList.add(\"is-visible\");\n    successPanel.setAttribute(\"tabindex\", \"-1\");\n    successPanel.focus();\n  }\n\n  form.addEventListener(\"submit\", function (e) {\n    e.preventDefault();\n\n    errorSummary.classList.remove(\"is-visible\");\n    networkError.classList.remove(\"is-visible\");\n\n    var isValid = validate();\n    if (!isValid) {\n      errorSummary.classList.add(\"is-visible\");\n      var firstError = form.querySelector(\".has-error input, .has-error select, .has-error textarea\");\n      if (firstError) {\n        firstError.focus();\n        firstError.scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n      }\n      return;\n    }\n\n    var payload = collectFormData();\n    setLoading(true);\n\n    if (!AR_ONBOARDING_ENDPOINT) {\n      \/\/ No endpoint configured \u2014 local\/demo preview only, per project spec\n      \/\/ (\"do not create a fake backend\"). Swap this block out once\n      \/\/ AR_ONBOARDING_ENDPOINT above is set to a real submission URL.\n      console.warn(\n        \"AIOS Retail onboarding form: no AR_ONBOARDING_ENDPOINT configured. \" +\n          \"Showing the success state for preview purposes only \u2014 no data was sent. \" +\n          \"Form data was:\",\n        payload\n      );\n      window.setTimeout(function () {\n        setLoading(false);\n        showSuccess();\n      }, 600);\n      return;\n    }\n\n    fetch(AR_ONBOARDING_ENDPOINT, {\n      method: \"POST\",\n      headers: { \"Content-Type\": \"application\/json\" },\n      body: JSON.stringify(payload),\n    })\n      .then(function (response) {\n        if (!response.ok) throw new Error(\"Request failed with status \" + response.status);\n        setLoading(false);\n        showSuccess();\n      })\n      .catch(function (err) {\n        console.error(\"AIOS Retail onboarding form submission failed:\", err);\n        setLoading(false);\n        networkError.classList.add(\"is-visible\");\n      });\n  });\n})();\n\n<\/script>\t\t<\/div>\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t<\/div>\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"inline_featured_image":false,"footnotes":""},"class_list":["post-3703","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/aioshop.io\/vi\/wp-json\/wp\/v2\/pages\/3703","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aioshop.io\/vi\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/aioshop.io\/vi\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/aioshop.io\/vi\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aioshop.io\/vi\/wp-json\/wp\/v2\/comments?post=3703"}],"version-history":[{"count":4,"href":"https:\/\/aioshop.io\/vi\/wp-json\/wp\/v2\/pages\/3703\/revisions"}],"predecessor-version":[{"id":3707,"href":"https:\/\/aioshop.io\/vi\/wp-json\/wp\/v2\/pages\/3703\/revisions\/3707"}],"wp:attachment":[{"href":"https:\/\/aioshop.io\/vi\/wp-json\/wp\/v2\/media?parent=3703"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}