{"id":2950,"date":"2026-08-21T18:33:22","date_gmt":"2026-08-21T18:33:22","guid":{"rendered":"https:\/\/muslimcongress.org\/new\/?page_id=2950"},"modified":"2026-08-21T19:15:16","modified_gmt":"2026-08-21T19:15:16","slug":"islamic-beliefs-reclaiming-the-narrative","status":"publish","type":"page","link":"https:\/\/muslimcongress.org\/new\/islamic-beliefs-reclaiming-the-narrative\/","title":{"rendered":"Islamic Beliefs: Reclaiming the Narrative"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2950\" class=\"elementor elementor-2950\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-25ef1f7 e-flex e-con-boxed e-con e-parent\" data-id=\"25ef1f7\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-dbe8648 e-con e-atomic-element e-flexbox-base e-dbe8648-331890f \" data-id=\"dbe8648\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"dbe8648\" data-e-type=\"e-flexbox\" data-id=\"dbe8648\">\n    \t\t<div class=\"elementor-element elementor-element-677a33a elementor-widget__width-initial elementor-widget elementor-widget-heading\" data-id=\"677a33a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\"><a href=\"https:\/\/muslimcongress.org\/new\/course\/islamic-beliefs-reclaiming-the-narrative\/\">Course DETAILS<\/a><\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d8034bf elementor-widget elementor-widget-heading\" data-id=\"d8034bf\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">\/<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7d911ed elementor-widget elementor-widget-heading\" data-id=\"7d911ed\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">COURSE REGISTRATIOn<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t\t<h2 data-interaction-id=\"585117b\" class=\"e-585117b-031e306 e-heading-base\" data-e-type=\"widget\" data-id=\"585117b\">Islamic Beliefs: Reclaiming the Narrative<\/h2>\n\t\t<div class=\"elementor-element elementor-element-ad42f4e e-con e-atomic-element e-flexbox-base e-ad42f4e-3917991 \" data-id=\"ad42f4e\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"ad42f4e\" data-e-type=\"e-flexbox\" data-id=\"ad42f4e\">\n    \t\t\t<p class=\"e-da0fac0-0f2f896 e-paragraph-base\" data-interaction-id=\"da0fac0\" data-e-type=\"widget\" data-id=\"da0fac0\">Begins September 13, 2026<\/p>\n\t\t\t\t\t<p class=\"e-9df3667-f1845a0 e-paragraph-base\" data-interaction-id=\"9df3667\" data-e-type=\"widget\" data-id=\"9df3667\">\u2022<\/p>\n\t\t\t\t\t<p class=\"e-79242db-a1deb77 e-paragraph-base\" data-interaction-id=\"79242db\" data-e-type=\"widget\" data-id=\"79242db\">16 sessions<\/p>\n\t\t\t\t\t<p class=\"e-a753797-900c10b e-paragraph-base\" data-interaction-id=\"a753797\" data-e-type=\"widget\" data-id=\"a753797\">\u2022<\/p>\n\t\t\t\t\t<p class=\"e-025c662-9f52d95 e-paragraph-base\" data-interaction-id=\"025c662\" data-e-type=\"widget\" data-id=\"025c662\">1x\/week<\/p>\n\t\t\n<\/div>\n\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c45d123 e-flex e-con-boxed e-con e-parent\" data-id=\"c45d123\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-6b87fcd e-con e-atomic-element e-flexbox-base e-6b87fcd-c7b08c5 \" data-id=\"6b87fcd\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"6b87fcd\" data-e-type=\"e-flexbox\" data-id=\"6b87fcd\">\n    \t\t<div class=\"elementor-element elementor-element-782e65f elementor-widget elementor-widget-html\" data-id=\"782e65f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"utf-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n<title>As-Sadiq Academy \u2014 Islamic Beliefs Registration<\/title>\n<link rel=\"stylesheet\" href=\"https:\/\/cdn.jsdelivr.net\/npm\/@tabler\/icons-webfont@2\/tabler-icons.min.css\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\"><link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Source+Serif+Pro:wght@600&display=swap\" rel=\"stylesheet\">\n<style>\n  \/* ============================================================\n     AS-SADIQ ACADEMY \u2014 COURSE REGISTRATION FORM (REUSABLE)\n     Visual system matched to the Muslim Congress conference\n     registration form: step-nav bubbles, panel cards, field-grids,\n     badges, banners, ticket-row summary, consent waiver.\n\n     TO LAUNCH A NEW COURSE:\n       Scroll to the \"COURSE_CONFIG\" block near the top of the\n       <script> at the bottom of this file and edit those 5 lines.\n       Nothing else in this file needs to change.\n     ============================================================ *\/\n  .sadiq-registration {\n    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\n    --color-background-primary: white;\n    --color-background-secondary: #F6F5F1;\n    --color-text-primary: #20262E;\n    --color-text-secondary: #6b6b6b;\n    --color-border-primary: #d9d9d6;\n    --color-border-secondary: #d9d9d6;\n    --color-border-tertiary: #e5e5e2;\n    --border-radius-md: 4px;\n    --border-radius-lg: 12px;\n  }\n  :root { --green: #153A2C; --green-light: #EAF2ED; --gold: #C9A227; --amber: #BA7517; --amber-light: #FAEEDA; --coral: #D85A30; --coral-light: #FAECE7; --success: #0F6E56; }\n  * { box-sizing: border-box; margin: 0; padding: 0; }\n  body { font-family: var(--font-sans, sans-serif); background: none; }\n  .sadiq-registration { background: none; }\n  .shell { padding: 0px; max-width: 100%; margin: 0 auto; }\n\n  .step-nav { display: flex; align-items: center; gap: 0; margin-bottom: 2rem; overflow-x: auto; padding-bottom: 4px; }\n  .step-item { display: flex; align-items: center; flex-shrink: 0; }\n  .step-bubble { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 500; border: 1.5px solid var(--color-border-tertiary); background: var(--color-background-primary); color: var(--color-text-secondary); cursor: pointer; transition: all 0.15s; }\n  .step-bubble.active { background: var(--green); border-color: var(--green); color: #fff; }\n  .step-bubble.done { background: var(--green-light); border-color: var(--green); color: var(--green); }\n  .step-label { font-size: 11px; color: var(--color-text-secondary); margin-top: 4px; text-align: center; max-width: 70px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n  .step-label.active { color: var(--green); font-weight: 500; }\n  .step-col { display: flex; flex-direction: column; align-items: center; gap: 0; }\n  .step-connector { height: 1.5px; width: 28px; background: var(--color-border-tertiary); flex-shrink: 0; margin-bottom: 18px; }\n  .step-connector.done { background: var(--green); }\n\n  .panel { background: var(--color-background-primary); border: 0.5px solid var(--color-border-tertiary); border-radius: var(--border-radius-lg); padding: 1.5rem; margin-bottom: 1.5rem; }\n  .panel-title { font-family: 'Source Serif Pro', serif; font-size: 17px; font-weight: 600; color: var(--color-text-primary); margin-bottom: 4px; display: inline-block; align-items: center; gap: 0px; }\n  .panel-sub { font-size: 13px; color: var(--color-text-secondary); margin-bottom: 1.25rem; }\n  .field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }\n  .field-grid.single { grid-template-columns: 1fr; }\n  .field-grid.triple { grid-template-columns: 1fr 1fr 1fr; }\n  .field { display: flex; flex-direction: column; gap: 8px; }\n  .field.span2 { grid-column: span 2; }\n  label { font-size: 12px; color: var(--color-text-secondary); font-weight: 500; letter-spacing: 0.02em; display: flex; align-items: center; gap: 4px; }\n  .req { color: var(--coral); font-size: 12px; }\n  input, select, textarea { border-radius: var(--border-radius-md); border: 0.5px solid var(--color-border-secondary); background: var(--color-background-secondary); color: var(--color-text-primary); padding: 10px 10px; font-size: 13px; width: 100%; font-family: inherit; }\n  input:focus, select:focus, textarea:focus { outline: 2px solid var(--green); outline-offset: 1px; border-color: var(--green); }\n  input.invalid, select.invalid { border-color: var(--coral); background: var(--coral-light); }\n  .field-error { font-size: 11px; color: #993C1D; display: none; }\n  .field-error.show { display: block; }\n\n  .badge { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; padding: 3px 8px; border-radius: var(--border-radius-md); font-weight: 500; }\n  .badge-required { background: var(--coral-light); color: #993C1D; }\n  .badge-optional { background: var(--color-background-secondary); color: var(--color-text-secondary); }\n\n  .note { font-size: 12px; color: var(--color-text-secondary); background: var(--color-background-secondary); border-left: 2px solid var(--green); padding: 8px 10px; border-radius: 0 var(--border-radius-md) var(--border-radius-md) 0; margin-top: 8px; }\n\n  .member-card { border: 0.5px solid var(--color-border-tertiary); border-radius: var(--border-radius-md); padding: 1rem; margin-bottom: 10px; background: var(--color-background-secondary); }\n  .member-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }\n  .member-title { font-size: 13px; font-weight: 500; color: var(--color-text-primary); display: flex; align-items: center; gap: 6px; }\n  .remove-member { background: none; border: none; color: var(--color-text-secondary); cursor: pointer; font-size: 12px; display: flex; align-items: center; gap: 4px; width: auto; }\n  .remove-member:hover { color: var(--coral); }\n  .add-btn { display: flex; align-items: center; gap: 6px; border: 1px dashed var(--color-border-secondary); border-radius: var(--border-radius-md); padding: 8px 14px; font-size: 13px; color: var(--green); background: transparent; cursor: pointer; width: 100%; justify-content: center; margin-top: 4px; }\n  .add-btn:hover { background: var(--color-background-secondary); border-color: var(--green); }\n  .add-btn:disabled { opacity: 0.45; cursor: not-allowed; }\n\n  .ticket-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 0.5px solid var(--color-border-tertiary); gap: 12px; }\n  .ticket-row:last-child { border-bottom: none; }\n  .ticket-label { font-size: 13px; color: var(--color-text-primary); }\n  .ticket-sub { font-size: 11px; color: var(--color-text-secondary); margin-top: 2px; }\n  .ticket-price { font-size: 14px; font-weight: 500; color: var(--color-text-primary); white-space: nowrap; }\n  .total-row { display: flex; justify-content: space-between; padding-top: 12px; font-size: 15px; font-weight: 500; color: var(--color-text-primary); }\n\n  .chip-row { display: flex; flex-wrap: wrap; gap: 8px; }\n  .chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 400; letter-spacing: normal; color: var(--color-text-primary); border: 0.5px solid var(--color-border-tertiary); background: var(--color-background-primary); border-radius: 100px; padding: 8px 16px; cursor: pointer; }\n  .chip.selected { border-color: var(--green); background: var(--green-light); color: var(--green); font-weight: 500; }\n\n  .discount-strip { display: flex; gap: 8px; margin-top: 4px; flex-wrap: wrap; }\n  .discount-msg { font-size: 12px; margin-top: 8px; display: none; }\n  .discount-msg.ok { color: var(--success); display: block; }\n  .discount-msg.err { color: #993C1D; display: block; }\n\n  .nav-row { display: flex; justify-content: space-between; align-items: center; margin-top: 1rem; gap: 10px; }\n  .btn-back { background: transparent; border: 0.5px solid var(--color-border-secondary); color: var(--color-text-secondary); padding: 9px 20px; border-radius: var(--border-radius-md); font-size: 13px; cursor: pointer; display: flex; align-items: center; gap: 6px; }\n  .btn-next { background: var(--gold); border: none; color: #FFFFFF; padding: 9px 24px; border-radius: var(--border-radius-md); font-size: 13px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; cursor: pointer; display: flex; align-items: center; gap: 6px; }\n  .btn-next:hover { background: #DDBB4E; }\n  .btn-next:disabled { opacity: 0.6; cursor: wait; }\n  .divider { height: 0.5px; background: var(--color-border-tertiary); margin: 1rem 0; }\n\n  .waiver-box { border: 0.5px solid var(--color-border-tertiary); border-radius: var(--border-radius-md); padding: 10px 12px; font-size: 12px; color: var(--color-text-secondary); max-height: 90px; overflow-y: auto; line-height: 1.6; background: var(--color-background-secondary); }\n  .confirmation-icon { width: 56px; height: 56px; border-radius: 50%; background: var(--green-light); display: flex; align-items: center; justify-content: center; margin: 0 auto 12px; }\n\n  .step-section { display: none; }\n  .step-section.visible { display: block; }\n  .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }\n\n  .banner { display: none; border-radius: var(--border-radius-md); padding: 10px 12px; font-size: 13px; margin-bottom: 1rem; line-height: 1.5; }\n  .banner.show { display: block; }\n  .banner-error { background: var(--coral-light); color: #993C1D; border-left: 2px solid var(--coral); }\n  .banner-warn { background: var(--amber-light); color: #633806; border-left: 2px solid var(--amber); }\n  .banner ul { margin: 4px 0 0 18px; }\n\n  @keyframes sadiqspin { to { transform: rotate(360deg); } }\n  #sadiqLoadingOverlay { position: fixed; inset: 0; background: rgba(0,0,0,0.8); z-index: 99999; display: none; align-items: center; justify-content: center; flex-direction: column; gap: 16px; }\n  #sadiqLoadingOverlay.show { display: flex; }\n  #sadiqLoadingOverlay .spinner { width: 40px; height: 40px; border: 3px solid rgba(255,255,255,0.25); border-top-color: #fff; border-radius: 50%; animation: sadiqspin 0.8s linear infinite; }\n  #sadiqLoadingOverlay .overlay-msg { color: #fff; font-size: 14px; font-family: var(--font-sans, sans-serif); }\n\n  @media (max-width: 640px) {\n    .field-grid, .field-grid.triple { grid-template-columns: 1fr; }\n    .field.span2 { grid-column: span 1; }\n    .panel { padding: 1.25rem 1rem; }\n    .step-label { font-size: 10px; max-width: 54px; }\n    .btn-next, .btn-back { padding: 8px 16px; }\n    .nav-row { flex-wrap: wrap; }\n  }\n<\/style>\n<\/head>\n<body>\n<div class=\"sadiq-registration\" id=\"sadiqRegistration\">\n<div class=\"shell\">\n  <h2 class=\"sr-only\">As-Sadiq Academy course registration<\/h2>\n\n  <div class=\"step-nav\" id=\"stepNav\">\n    <div class=\"step-col\"><div class=\"step-bubble active\" id=\"b0\" onclick=\"goTo(0)\">1<\/div><div class=\"step-label active\" id=\"l0\">Registrants<\/div><\/div>\n    <div class=\"step-connector\" id=\"c0\"><\/div>\n    <div class=\"step-col\"><div class=\"step-bubble\" id=\"b1\" onclick=\"goTo(1)\">2<\/div><div class=\"step-label\" id=\"l1\">Donation<\/div><\/div>\n    <div class=\"step-connector\" id=\"c1\"><\/div>\n    <div class=\"step-col\"><div class=\"step-bubble\" id=\"b2\" onclick=\"goTo(2)\">3<\/div><div class=\"step-label\" id=\"l2\">Payment<\/div><\/div>\n  <\/div>\n\n  <!-- Step 0 \u2014 Registrants (contact + attendees combined) -->\n  <div class=\"step-section visible\" id=\"step0\">\n    <div class=\"banner banner-error\" id=\"err0\"><\/div>\n    <div class=\"panel\">\n      <div class=\"panel-title\">Register for <span class=\"course-title-inline\"><\/span><\/div>\n      <div class=\"panel-sub\">Add everyone you're registering. Each person gets their own confirmation email, and the course fee (<span class=\"course-fee-inline\"><\/span>) applies per registrant.<\/div>\n\n      <div class=\"member-card\">\n        <div class=\"member-header\">\n          <div class=\"member-title\"><i class=\"ti ti-user-circle\" aria-hidden=\"true\"><\/i><span>Registrant 1<\/span><\/div>\n        <\/div>\n        <div class=\"field-grid\">\n          <div class=\"field\"><label>First name <span class=\"req\">*<\/span><\/label><input id=\"p-first\" type=\"text\" placeholder=\"First name\"><\/div>\n          <div class=\"field\"><label>Last name <span class=\"req\">*<\/span><\/label><input id=\"p-last\" type=\"text\" placeholder=\"Last name\"><\/div>\n          <div class=\"field\"><label>Email address <span class=\"req\">*<\/span><\/label><input id=\"p-email\" type=\"email\" placeholder=\"Email address\"><\/div>\n          <div class=\"field\"><label>Phone number <span class=\"req\">*<\/span><\/label><input id=\"p-phone\" type=\"tel\" inputmode=\"numeric\" maxlength=\"14\" placeholder=\"(123) 456-7890\"><\/div>\n        <\/div>\n      <\/div>\n\n      <div id=\"membersContainer\"><\/div>\n\n      <button type=\"button\" class=\"add-btn\" id=\"addRegistrantBtn\" onclick=\"addMember()\"><i class=\"ti ti-plus\" aria-hidden=\"true\"><\/i>Add another registrant<\/button>\n      <div class=\"note\" id=\"maxNote\" style=\"display:none;\"><i class=\"ti ti-info-circle\" aria-hidden=\"true\"><\/i>Maximum of <span class=\"max-registrants-inline\"><\/span> registrants per submission.<\/div>\n      <div class=\"note\"><i class=\"ti ti-mail\" aria-hidden=\"true\"><\/i>A confirmation email is sent to each registrant individually \u2014 not just the person filling out this form.<\/div>\n    <\/div>\n    <div class=\"nav-row\">\n      <div><\/div>\n      <button class=\"btn-next\" onclick=\"goTo(1)\">Donation <i class=\"ti ti-arrow-right\" aria-hidden=\"true\"><\/i><\/button>\n    <\/div>\n  <\/div>\n\n  <!-- Step 1 \u2014 Donation -->\n  <div class=\"step-section\" id=\"step1\">\n    <div class=\"panel\">\n      <div class=\"panel-title\">Add a donation? <span class=\"badge badge-optional\">optional<\/span><\/div>\n      <div class=\"panel-sub\">Support Muslim Congress beyond your course fee. This applies once to your whole registration, not per registrant.<\/div>\n      <div class=\"chip-row\" id=\"donateChips\">\n        <label class=\"chip selected\" data-amount=\"0\"><input type=\"radio\" name=\"donateAmt\" value=\"0\" checked style=\"display:none;\">No thanks<\/label>\n        <label class=\"chip\" data-amount=\"10\"><input type=\"radio\" name=\"donateAmt\" value=\"10\" style=\"display:none;\">$10<\/label>\n        <label class=\"chip\" data-amount=\"25\"><input type=\"radio\" name=\"donateAmt\" value=\"25\" style=\"display:none;\">$25<\/label>\n        <label class=\"chip\" data-amount=\"50\"><input type=\"radio\" name=\"donateAmt\" value=\"50\" style=\"display:none;\">$50<\/label>\n      <\/div>\n      <div class=\"field\" style=\"max-width:200px;margin-top:16px;\">\n        <label>Custom amount<\/label>\n        <input id=\"donationCustom\" type=\"number\" min=\"0\" step=\"1\" placeholder=\"$0\">\n      <\/div>\n    <\/div>\n    <div class=\"nav-row\">\n      <button class=\"btn-back\" onclick=\"goTo(0)\"><i class=\"ti ti-arrow-left\" aria-hidden=\"true\"><\/i>Back<\/button>\n      <button class=\"btn-next\" onclick=\"goTo(2)\">Payment <i class=\"ti ti-arrow-right\" aria-hidden=\"true\"><\/i><\/button>\n    <\/div>\n  <\/div>\n\n  <!-- Step 2 \u2014 Payment \/ Review -->\n  <div class=\"step-section\" id=\"step2\">\n    <div class=\"banner banner-warn\" id=\"canceledBanner\">Your payment was cancelled, so nothing was charged. Your details are still here \u2014 press <strong>Register &amp; Pay<\/strong> when you're ready to try again.<\/div>\n    <div class=\"banner banner-error\" id=\"err2\"><\/div>\n\n    <div class=\"panel\">\n      <div class=\"panel-title\">Order summary<\/div>\n      <div id=\"orderItems\"><\/div>\n      <div class=\"divider\"><\/div>\n      <div class=\"total-row\"><span>Total due<\/span><span id=\"sumTotal\">$0<\/span><\/div>\n    <\/div>\n\n    <div class=\"panel\">\n      <div class=\"panel-title\">Discount code <span class=\"badge badge-optional\">optional<\/span><\/div>\n      <div class=\"panel-sub\">Have a promo or scholarship code? Enter it below.<\/div>\n      <div class=\"discount-strip\">\n        <input id=\"discountCode\" type=\"text\" placeholder=\"Enter code\" style=\"flex:1; max-width:220px;\">\n        <button type=\"button\" onclick=\"applyDiscount()\" style=\"border: 0.5px solid var(--color-border-secondary); background: var(--color-background-secondary); color: var(--color-text-primary); padding: 10px 18px; border-radius: var(--border-radius-md); font-size:13px; cursor:pointer;\">Apply<\/button>\n      <\/div>\n      <div class=\"discount-msg\" id=\"discountMsg\"><\/div>\n    <\/div>\n\n    <div class=\"panel\">\n      <div class=\"panel-title\">Payment<\/div>\n      <div class=\"panel-sub\">You'll be taken to our secure payment page to pay by card. Registration is confirmed the moment payment goes through, and every registrant listed above will receive their own confirmation email.<\/div>\n      <div class=\"note\"><i class=\"ti ti-lock\" aria-hidden=\"true\"><\/i>Card details are entered on Stripe's page and never touch this site. The course fee is non-refundable after the first two sessions.<\/div>\n    <\/div>\n\n    <div class=\"panel\">\n      <div class=\"panel-title\">Consent<\/div>\n      <div class=\"waiver-box\">By registering, I confirm that all information provided is accurate. I understand the course fee is non-refundable after the first two sessions, and that registration is confirmed only upon receipt of full payment.<\/div>\n      <div style=\"display:flex; align-items:center; gap:8px; margin-top:16px;\">\n        <input type=\"checkbox\" id=\"consent\" style=\"width:16px; height:16px; accent-color:var(--green); flex-shrink:0;\">\n        <label for=\"consent\" style=\"font-size:13px; color:var(--color-text-primary); cursor:pointer;\">I have read and agree to the above terms <span class=\"req\">*<\/span><\/label>\n      <\/div>\n      <div id=\"consentError\" class=\"field-error\" style=\"margin-top:10px;\">Please agree to the terms to continue.<\/div>\n    <\/div>\n\n    <div class=\"nav-row\">\n      <button class=\"btn-back\" onclick=\"goTo(1)\"><i class=\"ti ti-arrow-left\" aria-hidden=\"true\"><\/i>Back<\/button>\n      <button id=\"completeBtn\" class=\"btn-next\" onclick=\"complete()\">Register &amp; Pay <i class=\"ti ti-arrow-right\" aria-hidden=\"true\"><\/i><\/button>\n    <\/div>\n  <\/div>\n\n  <!-- Step 3 \u2014 Confirmation -->\n  <div class=\"step-section\" id=\"step3\">\n    <div class=\"panel\" style=\"text-align:center; padding:2.5rem 1.5rem;\">\n      <div class=\"confirmation-icon\"><i class=\"ti ti-circle-check\" style=\"font-size:28px; color:var(--green);\" aria-hidden=\"true\"><\/i><\/div>\n      <div style=\"font-size:18px; font-weight:500; color:var(--color-text-primary); margin-bottom:6px;\">Registration confirmed<\/div>\n      <div style=\"font-size:13px; color:var(--color-text-secondary); margin-bottom:1.5rem;\">Payment received. Each registrant will receive their own confirmation email.<\/div>\n      <div style=\"background:var(--color-background-secondary); border-radius:var(--border-radius-md); padding:1rem; text-align:left; font-size:13px; color:var(--color-text-secondary); line-height:2;\">\n        <div><strong style=\"color:var(--color-text-primary);\">Course<\/strong> &nbsp;<span class=\"course-title-inline\"><\/span><\/div>\n        <div><strong style=\"color:var(--color-text-primary);\">Registrants<\/strong> &nbsp;<span id=\"confRegistrants\">\u2014<\/span><\/div>\n        <div><strong style=\"color:var(--color-text-primary);\">Amount paid<\/strong> &nbsp;<span id=\"confTotal\">\u2014<\/span><\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<div id=\"sadiqLoadingOverlay\" role=\"alertdialog\" aria-label=\"Confirming payment\" aria-hidden=\"true\">\n  <div class=\"spinner\"><\/div>\n  <div class=\"overlay-msg\">Confirming your payment\u2026<\/div>\n<\/div>\n<\/div>\n\n<script>\n(function(){\n\n  \/* ============================================================\n     COURSE_CONFIG \u2014 edit these 5 lines for each new course.\n     Nothing else in this file needs to change.\n     ============================================================ *\/\n  var COURSE_CONFIG = {\n    courseId:        'principles-of-belief',\n    courseTitle:     'Islamic Beliefs: Reclaiming the Narrative',\n    courseFee:       100,                              \/\/ NOT explicitly confirmed by Wali \u2014 verify before launch\n    maxRegistrants:  8,\n    appsScriptUrl:   'https:\/\/script.google.com\/macros\/s\/AKfycbwAuhBOJp93IQ6129KxuI8JwDHNz1XNjABJphACSkf_k3qwmkd8cUYpuntXuEJUXNr6kw\/exec'\n  };\n  \/* ============================================================\n     End of COURSE_CONFIG \u2014 everything below is shared logic and\n     should not need to change per course.\n     ============================================================ *\/\n\n  var root = document.getElementById('sadiqRegistration');\n  var courseId = COURSE_CONFIG.courseId;\n  var courseTitle = COURSE_CONFIG.courseTitle;\n  var fee = Number(COURSE_CONFIG.courseFee);\n  var maxRegistrants = Number(COURSE_CONFIG.maxRegistrants) || 8;\n  var endpoint = COURSE_CONFIG.appsScriptUrl;\n\n  document.querySelectorAll('.course-title-inline').forEach(function(el){ el.textContent = courseTitle; });\n  document.querySelectorAll('.course-fee-inline').forEach(function(el){ el.textContent = '$' + fee; });\n  document.querySelectorAll('.max-registrants-inline').forEach(function(el){ el.textContent = maxRegistrants; });\n\n  function $(sel){ return root.querySelector(sel); }\n  function val(sel){ var el = $(sel); return el ? el.value.trim() : ''; }\n  function money(n){ return '$' + n.toFixed(0); }\n  function escapeHtml(s){ return (s||'').replace(\/[&<>\"']\/g, function(c){ return ({'&':'&amp;','<':'&lt;','>':'&gt;','\"':'&quot;',\"'\":'&#39;'}[c]); }); }\n\n  \/* ---------- Phone formatting ---------- *\/\n  function formatPhoneNumber(value){\n    var numbers = (value || '').replace(\/\\D\/g, '').slice(0, 10);\n    if(numbers.length <= 3){ return numbers; }\n    if(numbers.length <= 6){ return '(' + numbers.slice(0, 3) + ') ' + numbers.slice(3); }\n    return '(' + numbers.slice(0, 3) + ') ' + numbers.slice(3, 6) + '-' + numbers.slice(6);\n  }\n  root.querySelectorAll('input[type=\"tel\"]').forEach(function(input){\n    input.addEventListener('input', function(){ this.value = formatPhoneNumber(this.value); });\n  });\n\n  \/* ---------- Loading overlay ---------- *\/\n  function showOverlay(){ var o = document.getElementById('sadiqLoadingOverlay'); if(o){ o.classList.add('show'); } }\n  function hideOverlay(){ var o = document.getElementById('sadiqLoadingOverlay'); if(o){ o.classList.remove('show'); } }\n\n  \/* ---------- Additional registrant cards ---------- *\/\n  var membersContainer = $('#membersContainer');\n  var addBtn = $('#addRegistrantBtn');\n  var registrantCount = 0; \/\/ additional registrants beyond registrant 1\n\n  function memberCardHTML(index){\n    return ''+\n    '<div class=\"member-card\" data-member>'+\n      '<div class=\"member-header\">'+\n        '<div class=\"member-title\"><i class=\"ti ti-user-circle\" aria-hidden=\"true\"><\/i><span class=\"member-num\">Registrant '+ (index + 1) +'<\/span><\/div>'+\n        '<button type=\"button\" class=\"remove-member\" onclick=\"removeMember(this)\">Remove <i class=\"ti ti-x\" aria-hidden=\"true\"><\/i><\/button>'+\n      '<\/div>'+\n      '<div class=\"field-grid triple\">'+\n        '<div class=\"field\"><label>First name <span class=\"req\">*<\/span><\/label><input class=\"m-first\" type=\"text\" placeholder=\"First name\"><\/div>'+\n        '<div class=\"field\"><label>Last name <span class=\"req\">*<\/span><\/label><input class=\"m-last\" type=\"text\" placeholder=\"Last name\"><\/div>'+\n        '<div class=\"field\"><label>Email <span class=\"req\">*<\/span><\/label><input class=\"m-email\" type=\"email\" placeholder=\"Email\"><\/div>'+\n      '<\/div>'+\n    '<\/div>';\n  }\n  window.addMember = function(){\n    if(registrantCount >= maxRegistrants - 1) return; \/\/ registrant 1 counts as one slot\n    registrantCount++;\n    membersContainer.insertAdjacentHTML('beforeend', memberCardHTML(registrantCount));\n    updateAddState();\n  };\n  window.removeMember = function(btn){\n    var card = btn.closest('[data-member]');\n    if(card) card.remove();\n    registrantCount--;\n    renumberMembers();\n    updateAddState();\n  };\n  function renumberMembers(){\n    membersContainer.querySelectorAll('[data-member]').forEach(function(c, i){\n      c.querySelector('.member-num').textContent = 'Registrant ' + (i + 2);\n    });\n  }\n  function updateAddState(){\n    var atMax = registrantCount >= maxRegistrants - 1;\n    addBtn.disabled = atMax;\n    $('#maxNote').style.display = atMax ? 'block' : 'none';\n  }\n\n  \/* ---------- Donation chips ---------- *\/\n  var donationAmount = 0;\n  root.querySelectorAll('#donateChips .chip').forEach(function(chip){\n    chip.addEventListener('click', function(){\n      root.querySelectorAll('#donateChips .chip').forEach(function(c){ c.classList.remove('selected'); });\n      chip.classList.add('selected');\n      chip.querySelector('input').checked = true;\n      donationAmount = Number(chip.dataset.amount);\n      $('#donationCustom').value = '';\n    });\n  });\n  $('#donationCustom').addEventListener('input', function(){\n    if(this.value){\n      root.querySelectorAll('#donateChips .chip').forEach(function(c){ c.classList.remove('selected'); });\n      donationAmount = Number(this.value);\n    }\n  });\n\n  \/* ---------- Discount code ---------- *\/\n  var discountType = '', discountValue = 0, discountName = '';\n  window.applyDiscount = function(){\n    var code = $('#discountCode').value.trim().toUpperCase();\n    var msg = $('#discountMsg');\n    if(!code){\n      discountType = ''; discountValue = 0; discountName = '';\n      msg.className = 'discount-msg'; msg.textContent = '';\n      buildSummary();\n      return;\n    }\n    msg.className = 'discount-msg ok';\n    msg.textContent = 'Checking\u2026';\n    fetch(endpoint + '?action=discount&code=' + encodeURIComponent(code))\n      .then(function(r){ return r.json(); })\n      .then(function(d){\n        if(d.valid){\n          discountType = d.type; discountName = d.code;\n          discountValue = (d.type === 'amount') ? Number(d.value) : Number(d.value);\n          msg.className = 'discount-msg ok';\n          msg.textContent = 'Code applied \u2014 ' + (d.type === 'amount' ? ('$' + d.value + ' off') : (Math.round(d.value * 100) + '% off'));\n        } else {\n          discountType = ''; discountValue = 0; discountName = '';\n          msg.className = 'discount-msg err';\n          msg.textContent = 'That code was not recognized.';\n        }\n        buildSummary();\n      })\n      .catch(function(){\n        msg.className = 'discount-msg err';\n        msg.textContent = 'Couldn\\'t check that code right now. Try again in a moment.';\n      });\n  };\n\n  \/* ---------- Validation ---------- *\/\n  function mark(el, bad){ if(el) el.classList.toggle('invalid', !!bad); }\n  function showErrors(step, list){\n    var banner = $('#err' + step);\n    if(!banner) return;\n    if(!list.length){ banner.classList.remove('show'); banner.innerHTML = ''; return; }\n    banner.innerHTML = 'Please fix the following before continuing:<ul>' +\n      list.map(function(m){ return '<li>' + escapeHtml(m) + '<\/li>'; }).join('') + '<\/ul>';\n    banner.classList.add('show');\n    banner.scrollIntoView({ behavior: 'smooth', block: 'center' });\n  }\n\n  function validateStep0(){\n    var errs = [];\n    var email = val('#p-email');\n    var emailOk = \/^[^@\\s]+@[^@\\s]+\\.[^@\\s]+$\/.test(email);\n    var phoneDigits = val('#p-phone').replace(\/\\D\/g, '');\n\n    mark($('#p-first'), !val('#p-first'));\n    mark($('#p-last'), !val('#p-last'));\n    mark($('#p-email'), !emailOk);\n    mark($('#p-phone'), phoneDigits.length !== 10);\n\n    if(!val('#p-first') || !val('#p-last')) errs.push('Registrant 1 needs a first and last name.');\n    if(!emailOk) errs.push('Registrant 1 needs a valid email address.');\n    if(phoneDigits.length !== 10) errs.push('Enter a 10-digit phone number for Registrant 1.');\n\n    membersContainer.querySelectorAll('[data-member]').forEach(function(card, i){\n      var first = card.querySelector('.m-first'), last = card.querySelector('.m-last'), memberEmail = card.querySelector('.m-email');\n      var memberEmailOk = \/^[^@\\s]+@[^@\\s]+\\.[^@\\s]+$\/.test(memberEmail.value.trim());\n      var label = 'Registrant ' + (i + 2);\n      mark(first, !first.value.trim());\n      mark(last, !last.value.trim());\n      mark(memberEmail, !memberEmailOk);\n      if(!first.value.trim() || !last.value.trim()) errs.push(label + ' needs a first and last name.');\n      if(!memberEmailOk) errs.push(label + ' needs a valid email.');\n    });\n\n    showErrors(0, errs);\n    return errs.length === 0;\n  }\n\n  \/* ---------- Collect registrants ---------- *\/\n  function collectRegistrants(){\n    var registrants = [{\n      name: (val('#p-first') + ' ' + val('#p-last')).trim(),\n      email: val('#p-email'),\n      phone: val('#p-phone')\n    }];\n    membersContainer.querySelectorAll('[data-member]').forEach(function(card){\n      registrants.push({\n        name: (card.querySelector('.m-first').value.trim() + ' ' + card.querySelector('.m-last').value.trim()).trim(),\n        email: card.querySelector('.m-email').value.trim(),\n        phone: ''\n      });\n    });\n    return registrants;\n  }\n\n  \/* ---------- Order summary ---------- *\/\n  function buildSummary(){\n    var registrants = collectRegistrants();\n    var container = $('#orderItems');\n    container.innerHTML = '';\n    var courseSubtotal = fee * registrants.length;\n\n    registrants.forEach(function(r, i){\n      container.insertAdjacentHTML('beforeend',\n        '<div class=\"ticket-row\">'+\n          '<div><div class=\"ticket-label\">'+ escapeHtml(r.name || ('Registrant ' + (i+1))) +'<\/div>'+\n          '<div class=\"ticket-sub\">'+ escapeHtml(courseTitle) +'<\/div><\/div>'+\n          '<div class=\"ticket-price\">'+ money(fee) +'<\/div>'+\n        '<\/div>');\n    });\n\n    var discountAmt = 0;\n    if(discountType === 'amount'){ discountAmt = Math.min(discountValue, courseSubtotal); }\n    else if(discountType === 'percent'){ discountAmt = Math.round(courseSubtotal * discountValue); }\n\n    if(discountAmt > 0){\n      container.insertAdjacentHTML('beforeend',\n        '<div class=\"ticket-row\">'+\n          '<div><div class=\"ticket-label\" style=\"color:var(--success);\">Discount ('+ escapeHtml(discountName) +')<\/div><\/div>'+\n          '<div class=\"ticket-price\" style=\"color:var(--success);\">\u2212'+ money(discountAmt) +'<\/div>'+\n        '<\/div>');\n    }\n\n    if(donationAmount > 0){\n      container.insertAdjacentHTML('beforeend',\n        '<div class=\"ticket-row\">'+\n          '<div><div class=\"ticket-label\">Donation to Muslim Congress<\/div><\/div>'+\n          '<div class=\"ticket-price\">'+ money(donationAmount) +'<\/div>'+\n        '<\/div>');\n    }\n    $('#sumTotal').textContent = money(courseSubtotal - discountAmt + donationAmount);\n  }\n\n  \/* ---------- Step navigation ---------- *\/\n  var currentStep = 0;\n  window.goTo = function(n){\n    if(currentStep === 3) return;\n    if(n > 0 && currentStep === 0 && !validateStep0()) return;\n    document.getElementById('step' + currentStep).classList.remove('visible');\n    document.getElementById('step' + n).classList.add('visible');\n    for(var i = 0; i < 3; i++){\n      var b = document.getElementById('b' + i), l = document.getElementById('l' + i);\n      b.classList.remove('active', 'done'); l.classList.remove('active');\n      if(i < n){ b.classList.add('done'); }\n      else if(i === n){ b.classList.add('active'); l.classList.add('active'); }\n      if(i < 2){ document.getElementById('c' + i).classList.toggle('done', i < n); }\n    }\n    currentStep = n;\n    if(n === 2) buildSummary();\n    window.scrollTo({ top: 0, behavior: 'smooth' });\n  };\n\n  \/* ---------- Submit ---------- *\/\n  window.complete = function(){\n    if(!validateStep0()){ goTo(0); return; }\n    if(!$('#consent').checked){\n      $('#consentError').classList.add('show');\n      $('#consent').scrollIntoView({ behavior: 'smooth', block: 'center' });\n      return;\n    }\n    $('#consentError').classList.remove('show');\n    showErrors(2, []);\n\n    var btn = $('#completeBtn');\n    btn.disabled = true;\n    btn.innerHTML = '<i class=\"ti ti-loader-2\" aria-hidden=\"true\"><\/i>Redirecting to payment\u2026';\n\n    var payload = { courseId: courseId, registrants: collectRegistrants(), donationAmount: donationAmount, discountCode: discountName };\n\n    fetch(endpoint + '?action=createCheckout', { method: 'POST', body: JSON.stringify(payload) })\n      .then(function(r){ return r.json(); })\n      .then(function(data){\n        if(data.checkoutUrl){ window.location.href = data.checkoutUrl; return; }\n        throw new Error(data.error || 'Something went wrong. Please try again.');\n      })\n      .catch(function(err){\n        showErrors(2, [err.message]);\n        btn.disabled = false;\n        btn.innerHTML = 'Register &amp; Pay <i class=\"ti ti-arrow-right\" aria-hidden=\"true\"><\/i>';\n      });\n  };\n\n  $('#consent').addEventListener('change', function(){\n    if(this.checked) $('#consentError').classList.remove('show');\n  });\n\n  \/* ---------- Return from Stripe ---------- *\/\n  (function handleReturnFromStripe(){\n    var params = new URLSearchParams(window.location.search);\n    var rid = params.get('rid');\n    if(!rid) return;\n    if(params.get('canceled')){ $('#canceledBanner').classList.add('show'); goTo(2); return; }\n\n    showOverlay();\n    var attempts = 0;\n    (function poll(){\n      attempts++;\n      fetch(endpoint + '?action=status&rid=' + encodeURIComponent(rid))\n        .then(function(r){ return r.json(); })\n        .then(function(data){\n          if(data.ok && data.status === 'paid'){\n            hideOverlay();\n            $('#confRegistrants').textContent = (data.registrants || []).join(', ') || '\u2014';\n            $('#confTotal').textContent = money(data.amountPaid || 0);\n            document.getElementById('step' + currentStep).classList.remove('visible');\n            document.getElementById('step3').classList.add('visible');\n            currentStep = 3;\n            history.replaceState({}, '', window.location.pathname);\n            return;\n          }\n          if(data.ok === false && attempts >= 2){\n            hideOverlay();\n            showErrors(2, ['We couldn\\'t confirm your payment automatically: ' + (data.error || 'unknown error') + '. Your registration ID is ' + rid + ' \u2014 please save it and contact us if you were charged.']);\n            goTo(2);\n            return;\n          }\n          if(attempts < 8){ setTimeout(poll, 1500); return; }\n          hideOverlay();\n          showErrors(2, ['Your payment went through, but we\\'re still confirming it. Your registration ID is ' + rid + ' \u2014 save it, and check your email in a few minutes.']);\n          goTo(2);\n        })\n        .catch(function(){\n          if(attempts < 8){ setTimeout(poll, 1500); return; }\n          hideOverlay();\n          goTo(2);\n        });\n    })();\n  })();\n})();\n<\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Course DETAILS \/ COURSE REGISTRATIOn Begins September 13, 2026 \u2022 16 sessions \u2022 1x\/week As-Sadiq Academy \u2014 Islamic Beliefs Registration \/* ============================================================ AS-SADIQ ACADEMY \u2014 COURSE REGISTRATION FORM (REUSABLE) Visual system matched to the Muslim Congress conference registration form: step-nav bubbles, panel cards, field-grids, badges, banners, ticket-row summary, consent waiver. TO LAUNCH A NEW COURSE: [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"_angie_page":false,"footnotes":""},"class_list":["post-2950","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/muslimcongress.org\/new\/wp-json\/wp\/v2\/pages\/2950","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/muslimcongress.org\/new\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/muslimcongress.org\/new\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/muslimcongress.org\/new\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/muslimcongress.org\/new\/wp-json\/wp\/v2\/comments?post=2950"}],"version-history":[{"count":5,"href":"https:\/\/muslimcongress.org\/new\/wp-json\/wp\/v2\/pages\/2950\/revisions"}],"predecessor-version":[{"id":2976,"href":"https:\/\/muslimcongress.org\/new\/wp-json\/wp\/v2\/pages\/2950\/revisions\/2976"}],"wp:attachment":[{"href":"https:\/\/muslimcongress.org\/new\/wp-json\/wp\/v2\/media?parent=2950"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}