{"id":16,"date":"2026-08-02T19:38:53","date_gmt":"2026-08-02T19:38:53","guid":{"rendered":"https:\/\/shop.dngpharmacyandmart.com\/?page_id=16"},"modified":"2026-08-02T23:47:23","modified_gmt":"2026-08-02T23:47:23","slug":"checkout","status":"publish","type":"page","link":"https:\/\/shop.dngpharmacyandmart.com\/?page_id=16","title":{"rendered":"Checkout"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"16\" class=\"elementor elementor-16\">\n\t\t\t\t<div class=\"elementor-element elementor-element-18e1a9e e-con-full e-flex e-con e-parent\" data-id=\"18e1a9e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3eb6c63 elementor-widget elementor-widget-html\" data-id=\"3eb6c63\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ===================================================================\r\n     DNG PHARMACY & MART \u2014 CHECKOUT\r\n     Brand: #004141 teal \u00b7 #f58634 orange \u00b7 #ffede0 peach\r\n     Type: Fraunces (display) \u00b7 Inter (body) \u00b7 IBM Plex Mono (data)\r\n     Paste into an Elementor HTML widget on a full-width section.\r\n     =================================================================== -->\r\n\r\n<style>\r\n\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,400;1,9..144,500&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');\r\n\r\n#dng-checkout *, #dng-checkout *::before, #dng-checkout *::after {\r\n  margin: 0 !important; padding: 0 !important; box-sizing: border-box !important;\r\n}\r\n\r\n#dng-checkout {\r\n  \/* Brand *\/\r\n  --ink: #002B2B;\r\n  --teal: #004141;\r\n  --teal-2: #0A5A5A;\r\n  --teal-3: #16706B;\r\n  --orange: #F58634;\r\n  --orange-2: #D96D1A;\r\n  --orange-3: #FFA866;\r\n  --peach: #FFEDE0;\r\n  --peach-2: #FFE0CC;\r\n\r\n  \/* Neutrals (warm, tuned to peach) *\/\r\n  --paper: #FFFDF9;\r\n  --paper-2: #FFF8F0;\r\n  --line: #EADCCB;\r\n  --line-2: #F2E7DA;\r\n  --body: #4A5654;\r\n  --muted: #8B9694;\r\n\r\n  \/* Semantic *\/\r\n  --ok: #1A8A4A;\r\n  --ok-bg: #E6F5EC;\r\n  --warn: #B45309;\r\n  --danger: #C0392B;\r\n  --danger-bg: #FDEDEA;\r\n\r\n  \/* Type *\/\r\n  --display: 'Fraunces', Georgia, serif;\r\n  --sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\r\n  --mono: 'IBM Plex Mono', ui-monospace, monospace;\r\n\r\n  \/* Space + shape *\/\r\n  --r-sm: 8px; --r: 14px; --r-lg: 20px; --r-xl: 28px;\r\n  --shadow: 0 1px 2px rgba(0,43,43,.04), 0 8px 24px rgba(0,43,43,.06);\r\n  --shadow-lg: 0 24px 60px rgba(0,43,43,.16);\r\n\r\n  font-family: var(--sans) !important;\r\n  color: var(--ink) !important;\r\n  line-height: 1.6 !important;\r\n  background: var(--paper-2) !important;\r\n  width: 100% !important;\r\n  overflow-x: clip !important;\r\n  -webkit-font-smoothing: antialiased !important;\r\n  position: relative !important;\r\n}\r\n\r\n#dng-checkout img { max-width: 100% !important; height: auto !important; display: block !important; }\r\n#dng-checkout a { text-decoration: none !important; color: inherit !important; }\r\n#dng-checkout ul, #dng-checkout ol { list-style: none !important; }\r\n#dng-checkout button { font-family: inherit !important; border: none !important; background: none !important; cursor: pointer !important; color: inherit !important; }\r\n#dng-checkout input, #dng-checkout select, #dng-checkout textarea { font-family: inherit !important; font-size: inherit !important; }\r\n\r\n#dng-checkout :focus-visible {\r\n  outline: 2px solid var(--orange) !important;\r\n  outline-offset: 2px !important;\r\n  border-radius: 4px !important;\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  #dng-checkout *, #dng-checkout *::before, #dng-checkout *::after {\r\n    animation-duration: .01ms !important;\r\n    animation-iteration-count: 1 !important;\r\n    transition-duration: .01ms !important;\r\n    scroll-behavior: auto !important;\r\n  }\r\n}\r\n\r\n#dng-checkout .wrap { max-width: 1240px !important; margin: 0 auto !important; padding: 0 20px !important; width: 100% !important; }\r\n#dng-checkout .wrap-tight { max-width: 900px !important; margin: 0 auto !important; padding: 0 20px !important; width: 100% !important; }\r\n\r\n\/* ---------- Type primitives ---------- *\/\r\n#dng-checkout .h-xl { font-family: var(--display) !important; font-optical-sizing: auto !important; font-size: clamp(30px, 4vw, 46px) !important; font-weight: 500 !important; line-height: 1.08 !important; letter-spacing: -.03em !important; color: var(--teal) !important; }\r\n#dng-checkout .h-lg { font-family: var(--display) !important; font-size: clamp(24px, 3vw, 34px) !important; font-weight: 500 !important; line-height: 1.12 !important; letter-spacing: -.025em !important; color: var(--teal) !important; }\r\n#dng-checkout .h-md { font-family: var(--display) !important; font-size: 21px !important; font-weight: 600 !important; line-height: 1.2 !important; letter-spacing: -.015em !important; color: var(--teal) !important; }\r\n#dng-checkout .h-sm { font-family: var(--display) !important; font-size: 16px !important; font-weight: 600 !important; line-height: 1.3 !important; color: var(--teal) !important; }\r\n#dng-checkout em, #dng-checkout .accent { font-style: italic !important; color: var(--orange) !important; font-weight: 400 !important; }\r\n#dng-checkout .lede { font-size: 16px !important; color: var(--body) !important; line-height: 1.65 !important; }\r\n\r\n#dng-checkout .eyebrow {\r\n  display: inline-flex !important; align-items: center !important; gap: 8px !important;\r\n  font-family: var(--mono) !important; font-size: 11px !important; font-weight: 500 !important;\r\n  letter-spacing: .14em !important; text-transform: uppercase !important; color: var(--orange-2) !important;\r\n}\r\n#dng-checkout .eyebrow::before { content: \"\" !important; width: 18px !important; height: 1px !important; background: var(--orange) !important; }\r\n\r\n\/* ---------- SIGNATURE: dispensing label ---------- *\/\r\n#dng-checkout .label-strip {\r\n  display: flex !important; align-items: stretch !important;\r\n  border-top: 1px solid var(--line) !important;\r\n  font-family: var(--mono) !important; font-size: 10.5px !important;\r\n  letter-spacing: .02em !important; color: var(--body) !important;\r\n  background: var(--paper-2) !important;\r\n}\r\n#dng-checkout .label-strip span {\r\n  padding: 7px 10px !important; flex: 1 !important;\r\n  border-right: 1px dashed var(--line) !important;\r\n  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;\r\n}\r\n#dng-checkout .label-strip span:last-child { border-right: none !important; }\r\n#dng-checkout .label-strip b { color: var(--teal) !important; font-weight: 600 !important; }\r\n\r\n\/* ---------- Buttons ---------- *\/\r\n#dng-checkout .btn {\r\n  display: inline-flex !important; align-items: center !important; justify-content: center !important;\r\n  gap: 9px !important; padding: 14px 26px !important; border-radius: 100px !important;\r\n  font-size: 14.5px !important; font-weight: 600 !important; letter-spacing: .01em !important;\r\n  transition: transform .2s cubic-bezier(.4,0,.2,1), background-color .2s, box-shadow .2s, color .2s !important;\r\n  white-space: nowrap !important; cursor: pointer !important;\r\n}\r\n#dng-checkout .btn svg { flex-shrink: 0 !important; transition: transform .25s !important; }\r\n#dng-checkout .btn:hover svg.arw { transform: translateX(3px) !important; }\r\n\r\n#dng-checkout .btn-primary { background: var(--orange) !important; color: #fff !important; box-shadow: 0 6px 18px rgba(245,134,52,.28) !important; }\r\n#dng-checkout .btn-primary:hover { background: var(--orange-2) !important; color: #fff !important; transform: translateY(-1px) !important; box-shadow: 0 10px 26px rgba(245,134,52,.38) !important; }\r\n\r\n#dng-checkout .btn-teal { background: var(--teal) !important; color: #fff !important; }\r\n#dng-checkout .btn-teal:hover { background: var(--teal-2) !important; color: #fff !important; transform: translateY(-1px) !important; }\r\n\r\n#dng-checkout .btn-ghost { background: transparent !important; color: var(--teal) !important; border: 1.5px solid var(--line) !important; }\r\n#dng-checkout .btn-ghost:hover { border-color: var(--teal) !important; background: var(--peach) !important; color: var(--teal) !important; }\r\n\r\n#dng-checkout .btn-wa { background: #25D366 !important; color: #fff !important; }\r\n#dng-checkout .btn-wa:hover { background: #1EA952 !important; color: #fff !important; transform: translateY(-1px) !important; }\r\n\r\n#dng-checkout .btn:disabled, #dng-checkout .btn[aria-disabled=\"true\"] { opacity: .45 !important; cursor: not-allowed !important; transform: none !important; box-shadow: none !important; }\r\n#dng-checkout .btn-block { width: 100% !important; }\r\n\r\n\/* ---------- Chips \/ pills ---------- *\/\r\n#dng-checkout .chip {\r\n  display: inline-flex !important; align-items: center !important; gap: 5px !important;\r\n  padding: 4px 10px !important; border-radius: 6px !important;\r\n  font-family: var(--mono) !important; font-size: 10px !important; font-weight: 600 !important;\r\n  letter-spacing: .08em !important; text-transform: uppercase !important;\r\n}\r\n#dng-checkout .chip-rx { background: var(--orange) !important; color: #fff !important; }\r\n#dng-checkout .chip-otc { background: var(--peach-2) !important; color: var(--teal) !important; }\r\n#dng-checkout .chip-new { background: var(--teal) !important; color: #fff !important; }\r\n#dng-checkout .chip-sale { background: var(--danger) !important; color: #fff !important; }\r\n#dng-checkout .chip-stock { background: var(--ok-bg) !important; color: var(--ok) !important; }\r\n#dng-checkout .chip-out { background: #F0EEEA !important; color: var(--muted) !important; }\r\n\r\n\/* ---------- Field primitives ---------- *\/\r\n#dng-checkout .field { display: block !important; }\r\n#dng-checkout .field + .field { margin-top: 16px !important; }\r\n#dng-checkout .field label, #dng-checkout .lbl {\r\n  display: block !important; font-size: 12.5px !important; font-weight: 600 !important;\r\n  color: var(--teal) !important; margin-bottom: 6px !important; letter-spacing: .01em !important;\r\n}\r\n#dng-checkout .field .hint { font-size: 12px !important; color: var(--muted) !important; margin-top: 5px !important; }\r\n#dng-checkout .inp {\r\n  width: 100% !important; padding: 13px 15px !important;\r\n  border: 1.5px solid var(--line) !important; border-radius: var(--r-sm) !important;\r\n  background: var(--paper) !important; font-size: 15px !important; color: var(--ink) !important;\r\n  outline: none !important; transition: border-color .2s, box-shadow .2s, background-color .2s !important;\r\n}\r\n#dng-checkout .inp::placeholder { color: var(--muted) !important; }\r\n#dng-checkout .inp:focus { border-color: var(--teal) !important; background: #fff !important; box-shadow: 0 0 0 3px rgba(0,65,65,.09) !important; }\r\n#dng-checkout .inp.err { border-color: var(--danger) !important; background: var(--danger-bg) !important; }\r\n#dng-checkout textarea.inp { min-height: 96px !important; resize: vertical !important; }\r\n#dng-checkout select.inp {\r\n  appearance: none !important; -webkit-appearance: none !important; padding-right: 42px !important;\r\n  background-image: url(\"data:image\/svg+xml;charset=UTF-8,%3csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 24 24' fill='none' stroke='%23004141' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'\/%3e%3c\/svg%3e\") !important;\r\n  background-repeat: no-repeat !important; background-position: right 14px center !important; background-size: 16px !important;\r\n  cursor: pointer !important;\r\n}\r\n#dng-checkout .field-err { font-size: 12px !important; color: var(--danger) !important; margin-top: 5px !important; display: none !important; }\r\n#dng-checkout .field-err.on { display: block !important; }\r\n\r\n\/* ---------- Image placeholder ---------- *\/\r\n#dng-checkout .ph {\r\n  background: repeating-linear-gradient(45deg, var(--peach) 0 10px, var(--peach-2) 10px 20px) !important;\r\n  display: flex !important; flex-direction: column !important;\r\n  align-items: center !important; justify-content: center !important;\r\n  color: var(--teal) !important; text-align: center !important; gap: 6px !important;\r\n}\r\n#dng-checkout .ph small { font-family: var(--mono) !important; font-size: 9.5px !important; letter-spacing: .08em !important; text-transform: uppercase !important; opacity: .75 !important; }\r\n\r\n\/* ---------- HEADER ---------- *\/\r\n#dng-checkout .hdr {\r\n  background: rgba(255,253,249,.92) !important;\r\n  backdrop-filter: saturate(180%) blur(12px) !important;\r\n  -webkit-backdrop-filter: saturate(180%) blur(12px) !important;\r\n  border-bottom: 1px solid var(--line) !important;\r\n  position: sticky !important; top: 0 !important; z-index: 90 !important;\r\n}\r\n#dng-checkout .hdr-in {\r\n  display: flex !important; align-items: center !important; gap: 20px !important;\r\n  padding: 12px 0 !important;\r\n}\r\n#dng-checkout .logo { flex-shrink: 0 !important; display: block !important; }\r\n#dng-checkout .logo img { height: 46px !important; width: auto !important; object-fit: contain !important; }\r\n\r\n#dng-checkout .hdr-search { flex: 1 !important; max-width: 460px !important; position: relative !important; }\r\n#dng-checkout .hdr-search .inp { padding-left: 42px !important; border-radius: 100px !important; background: var(--paper-2) !important; }\r\n#dng-checkout .hdr-search .s-ico { position: absolute !important; left: 15px !important; top: 50% !important; transform: translateY(-50%) !important; color: var(--muted) !important; pointer-events: none !important; }\r\n\r\n#dng-checkout .nav { display: flex !important; align-items: center !important; gap: 26px !important; margin-left: auto !important; }\r\n#dng-checkout .nav a { font-size: 14.5px !important; font-weight: 500 !important; color: var(--ink) !important; position: relative !important; padding: 4px 0 !important; transition: color .2s !important; }\r\n#dng-checkout .nav a:hover { color: var(--teal) !important; }\r\n#dng-checkout .nav a.on { color: var(--teal) !important; font-weight: 600 !important; }\r\n#dng-checkout .nav a.on::after { content: \"\" !important; position: absolute !important; left: 0 !important; right: 0 !important; bottom: -2px !important; height: 2px !important; background: var(--orange) !important; border-radius: 2px !important; }\r\n\r\n#dng-checkout .hdr-cart {\r\n  position: relative !important; width: 42px !important; height: 42px !important;\r\n  border-radius: 50% !important; background: var(--peach) !important; color: var(--teal) !important;\r\n  display: flex !important; align-items: center !important; justify-content: center !important;\r\n  transition: background-color .2s, transform .2s !important; flex-shrink: 0 !important;\r\n}\r\n#dng-checkout .hdr-cart:hover { background: var(--orange) !important; color: #fff !important; transform: translateY(-1px) !important; }\r\n#dng-checkout .hdr-cart .n {\r\n  position: absolute !important; top: -3px !important; right: -3px !important;\r\n  min-width: 20px !important; height: 20px !important; padding: 0 5px !important;\r\n  background: var(--orange) !important; color: #fff !important; border: 2px solid var(--paper) !important;\r\n  border-radius: 100px !important; font-family: var(--mono) !important; font-size: 10px !important;\r\n  font-weight: 600 !important; display: flex !important; align-items: center !important; justify-content: center !important;\r\n}\r\n#dng-checkout .hdr-cart:hover .n { background: var(--teal) !important; }\r\n\r\n#dng-checkout .burger {\r\n  display: none !important; width: 42px !important; height: 42px !important; border-radius: var(--r-sm) !important;\r\n  background: var(--peach) !important; color: var(--teal) !important;\r\n  align-items: center !important; justify-content: center !important; flex-shrink: 0 !important;\r\n}\r\n\r\n#dng-checkout .m-nav { display: none !important; flex-direction: column !important; padding: 8px 20px 20px !important; border-top: 1px solid var(--line) !important; background: var(--paper) !important; gap: 2px !important; }\r\n#dng-checkout .m-nav.on { display: flex !important; }\r\n#dng-checkout .m-nav a { padding: 13px 0 !important; font-size: 15px !important; font-weight: 500 !important; border-bottom: 1px solid var(--line-2) !important; color: var(--ink) !important; }\r\n#dng-checkout .m-nav a.on { color: var(--teal) !important; font-weight: 600 !important; }\r\n#dng-checkout .m-search { padding: 12px 20px !important; border-top: 1px solid var(--line) !important; display: none !important; background: var(--paper) !important; position: relative !important; }\r\n\r\n\/* ---------- FLOATING ACTION STACK ---------- *\/\r\n#dng-checkout .fab-stack {\r\n  position: fixed !important; right: 18px !important; bottom: 18px !important;\r\n  z-index: 80 !important; display: flex !important; flex-direction: column !important; gap: 12px !important;\r\n}\r\n#dng-checkout .fab {\r\n  width: 56px !important; height: 56px !important; border-radius: 50% !important;\r\n  display: flex !important; align-items: center !important; justify-content: center !important;\r\n  position: relative !important; transition: transform .22s cubic-bezier(.34,1.4,.64,1), box-shadow .22s !important;\r\n}\r\n#dng-checkout .fab:hover { transform: scale(1.07) !important; }\r\n#dng-checkout .fab-wa { background: #25D366 !important; color: #fff !important; box-shadow: 0 8px 22px rgba(37,211,102,.4) !important; }\r\n#dng-checkout .fab-cart { background: var(--orange) !important; color: #fff !important; box-shadow: 0 8px 22px rgba(245,134,52,.42) !important; }\r\n#dng-checkout .fab-cart .n {\r\n  position: absolute !important; top: -2px !important; right: -2px !important;\r\n  min-width: 22px !important; height: 22px !important; padding: 0 6px !important;\r\n  background: var(--teal) !important; color: #fff !important; border: 2px solid var(--paper-2) !important;\r\n  border-radius: 100px !important; font-family: var(--mono) !important; font-size: 10.5px !important;\r\n  font-weight: 600 !important; display: flex !important; align-items: center !important; justify-content: center !important;\r\n}\r\n#dng-checkout .fab-tip {\r\n  position: absolute !important; right: calc(100% + 10px) !important; top: 50% !important;\r\n  transform: translateY(-50%) translateX(6px) !important;\r\n  background: var(--ink) !important; color: #fff !important; padding: 6px 11px !important;\r\n  border-radius: 6px !important; font-size: 12px !important; font-weight: 500 !important;\r\n  white-space: nowrap !important; opacity: 0 !important; pointer-events: none !important;\r\n  transition: opacity .2s, transform .2s !important;\r\n}\r\n#dng-checkout .fab:hover .fab-tip { opacity: 1 !important; transform: translateY(-50%) translateX(0) !important; }\r\n\r\n\/* ---------- CART DRAWER ---------- *\/\r\n#dng-checkout .scrim {\r\n  position: fixed !important; inset: 0 !important; background: rgba(0,43,43,.42) !important;\r\n  backdrop-filter: blur(3px) !important; -webkit-backdrop-filter: blur(3px) !important;\r\n  z-index: 190 !important; opacity: 0 !important; pointer-events: none !important; transition: opacity .3s !important;\r\n}\r\n#dng-checkout .scrim.on { opacity: 1 !important; pointer-events: auto !important; }\r\n\r\n#dng-checkout .drawer {\r\n  position: fixed !important; top: 0 !important; right: 0 !important; bottom: 0 !important;\r\n  width: 420px !important; max-width: 100vw !important; background: var(--paper) !important;\r\n  z-index: 191 !important; transform: translateX(100%) !important;\r\n  transition: transform .34s cubic-bezier(.4,0,.2,1) !important;\r\n  display: flex !important; flex-direction: column !important;\r\n  box-shadow: var(--shadow-lg) !important;\r\n}\r\n#dng-checkout .drawer.on { transform: translateX(0) !important; }\r\n\r\n#dng-checkout .dr-hd {\r\n  padding: 18px 20px !important; border-bottom: 1px solid var(--line) !important;\r\n  display: flex !important; align-items: center !important; justify-content: space-between !important;\r\n  background: var(--peach) !important; flex-shrink: 0 !important;\r\n}\r\n#dng-checkout .dr-hd-t { display: flex !important; align-items: baseline !important; gap: 9px !important; }\r\n#dng-checkout .dr-hd-n { font-family: var(--mono) !important; font-size: 12px !important; color: var(--orange-2) !important; }\r\n#dng-checkout .dr-x {\r\n  width: 34px !important; height: 34px !important; border-radius: 50% !important;\r\n  background: var(--paper) !important; color: var(--teal) !important; border: 1px solid var(--line) !important;\r\n  display: flex !important; align-items: center !important; justify-content: center !important; transition: all .2s !important;\r\n}\r\n#dng-checkout .dr-x:hover { background: var(--orange) !important; color: #fff !important; border-color: var(--orange) !important; }\r\n\r\n#dng-checkout .dr-bd { flex: 1 !important; overflow-y: auto !important; overscroll-behavior: contain !important; padding: 6px 20px !important; }\r\n\r\n#dng-checkout .dr-empty { text-align: center !important; padding: 56px 16px !important; }\r\n#dng-checkout .dr-empty-ico { width: 64px !important; height: 64px !important; margin: 0 auto 14px !important; border-radius: 50% !important; background: var(--peach) !important; color: var(--teal) !important; display: flex !important; align-items: center !important; justify-content: center !important; }\r\n#dng-checkout .dr-empty p { font-size: 13.5px !important; color: var(--body) !important; margin: 6px 0 18px !important; }\r\n\r\n#dng-checkout .ln {\r\n  display: grid !important; grid-template-columns: 64px 1fr !important; gap: 12px !important;\r\n  padding: 14px 0 !important; border-bottom: 1px dashed var(--line) !important;\r\n}\r\n#dng-checkout .ln:last-child { border-bottom: none !important; }\r\n#dng-checkout .ln-img { width: 64px !important; height: 64px !important; border-radius: 10px !important; overflow: hidden !important; border: 1px solid var(--line) !important; }\r\n#dng-checkout .ln-img img { width: 100% !important; height: 100% !important; object-fit: cover !important; }\r\n#dng-checkout .ln-top { display: flex !important; justify-content: space-between !important; gap: 10px !important; align-items: start !important; }\r\n#dng-checkout .ln-name { font-family: var(--display) !important; font-size: 14px !important; font-weight: 600 !important; color: var(--teal) !important; line-height: 1.3 !important; }\r\n#dng-checkout .ln-meta { font-family: var(--mono) !important; font-size: 10.5px !important; color: var(--muted) !important; margin-top: 3px !important; }\r\n#dng-checkout .ln-amt { font-size: 14px !important; font-weight: 600 !important; font-variant-numeric: tabular-nums !important; color: var(--teal) !important; white-space: nowrap !important; }\r\n#dng-checkout .ln-bot { display: flex !important; align-items: center !important; justify-content: space-between !important; margin-top: 9px !important; }\r\n#dng-checkout .stp { display: inline-flex !important; align-items: center !important; background: var(--peach) !important; border-radius: 8px !important; padding: 2px !important; }\r\n#dng-checkout .stp button { width: 26px !important; height: 26px !important; border-radius: 6px !important; color: var(--teal) !important; font-size: 15px !important; font-weight: 600 !important; display: flex !important; align-items: center !important; justify-content: center !important; transition: background-color .15s !important; }\r\n#dng-checkout .stp button:hover { background: var(--paper) !important; }\r\n#dng-checkout .stp b { min-width: 28px !important; text-align: center !important; font-family: var(--mono) !important; font-size: 12.5px !important; font-weight: 600 !important; color: var(--teal) !important; }\r\n#dng-checkout .ln-del { font-size: 11.5px !important; color: var(--muted) !important; transition: color .2s !important; }\r\n#dng-checkout .ln-del:hover { color: var(--danger) !important; }\r\n#dng-checkout .ln-rx { display: inline-flex !important; align-items: center !important; gap: 4px !important; font-family: var(--mono) !important; font-size: 9.5px !important; letter-spacing: .06em !important; text-transform: uppercase !important; color: var(--ok) !important; margin-top: 6px !important; }\r\n\r\n#dng-checkout .dr-ft { padding: 16px 20px 18px !important; border-top: 1px solid var(--line) !important; background: var(--paper-2) !important; flex-shrink: 0 !important; }\r\n#dng-checkout .sum-r { display: flex !important; justify-content: space-between !important; padding: 5px 0 !important; font-size: 13.5px !important; color: var(--body) !important; }\r\n#dng-checkout .sum-r b, #dng-checkout .sum-r span:last-child { font-weight: 600 !important; font-variant-numeric: tabular-nums !important; color: var(--ink) !important; }\r\n#dng-checkout .sum-tot { margin-top: 8px !important; padding-top: 12px !important; border-top: 1px solid var(--line) !important; display: flex !important; justify-content: space-between !important; align-items: baseline !important; }\r\n#dng-checkout .sum-tot span { font-size: 14px !important; font-weight: 600 !important; color: var(--teal) !important; }\r\n#dng-checkout .sum-tot b { font-size: 22px !important; font-weight: 700 !important; font-variant-numeric: tabular-nums !important; letter-spacing: -.02em !important; color: var(--orange-2) !important; }\r\n#dng-checkout .dr-note { font-size: 11.5px !important; color: var(--muted) !important; text-align: center !important; margin-top: 10px !important; line-height: 1.5 !important; }\r\n\r\n\/* ---------- TOAST ---------- *\/\r\n#dng-checkout .toast {\r\n  position: fixed !important; left: 50% !important; bottom: 24px !important;\r\n  transform: translateX(-50%) translateY(16px) !important;\r\n  background: var(--ink) !important; color: #fff !important;\r\n  padding: 12px 18px !important; border-radius: 100px !important;\r\n  display: flex !important; align-items: center !important; gap: 9px !important;\r\n  font-size: 13.5px !important; font-weight: 500 !important;\r\n  box-shadow: var(--shadow-lg) !important; z-index: 300 !important;\r\n  opacity: 0 !important; pointer-events: none !important; transition: opacity .25s, transform .25s !important;\r\n  max-width: calc(100vw - 32px) !important;\r\n}\r\n#dng-checkout .toast.on { opacity: 1 !important; transform: translateX(-50%) translateY(0) !important; }\r\n#dng-checkout .toast i { width: 20px !important; height: 20px !important; border-radius: 50% !important; background: var(--ok) !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; }\r\n\r\n\/* ---------- FOOTER ---------- *\/\r\n#dng-checkout .ftr { background: var(--teal) !important; color: rgba(255,255,255,.74) !important; padding: 60px 0 0 !important; margin-top: auto !important; }\r\n#dng-checkout .ftr-grid { display: grid !important; grid-template-columns: 1.6fr 1fr 1fr 1.3fr !important; gap: 40px !important; padding-bottom: 44px !important; border-bottom: 1px solid rgba(255,255,255,.13) !important; }\r\n#dng-checkout .ftr-logo { background: var(--paper) !important; padding: 12px 16px !important; border-radius: var(--r) !important; display: inline-block !important; margin-bottom: 16px !important; }\r\n#dng-checkout .ftr-logo img { height: 42px !important; width: auto !important; }\r\n#dng-checkout .ftr-about { font-size: 14px !important; line-height: 1.65 !important; margin-bottom: 18px !important; max-width: 300px !important; }\r\n#dng-checkout .ftr-about b { color: #fff !important; font-weight: 600 !important; }\r\n#dng-checkout .socials { display: flex !important; gap: 8px !important; }\r\n#dng-checkout .soc { width: 36px !important; height: 36px !important; border-radius: 50% !important; background: rgba(255,255,255,.09) !important; border: 1px solid rgba(245,134,52,.25) !important; color: var(--orange-3) !important; display: flex !important; align-items: center !important; justify-content: center !important; transition: all .25s !important; }\r\n#dng-checkout .soc:hover { background: var(--orange) !important; color: #fff !important; border-color: var(--orange) !important; transform: translateY(-2px) !important; }\r\n#dng-checkout .ftr h4 { font-family: var(--display) !important; font-size: 16px !important; font-weight: 600 !important; color: #fff !important; margin-bottom: 16px !important; }\r\n#dng-checkout .ftr-links { display: flex !important; flex-direction: column !important; gap: 9px !important; }\r\n#dng-checkout .ftr-links a { font-size: 13.5px !important; color: rgba(255,255,255,.74) !important; transition: color .2s, padding-left .2s !important; }\r\n#dng-checkout .ftr-links a:hover { color: var(--orange-3) !important; padding-left: 3px !important; }\r\n#dng-checkout .ftr-hours li { display: flex !important; justify-content: space-between !important; gap: 12px !important; padding: 7px 0 !important; border-bottom: 1px dashed rgba(255,255,255,.1) !important; font-size: 13px !important; }\r\n#dng-checkout .ftr-hours li span { color: rgba(255,255,255,.85) !important; }\r\n#dng-checkout .ftr-hours li b { font-family: var(--mono) !important; font-size: 11.5px !important; color: var(--orange-3) !important; font-weight: 500 !important; }\r\n#dng-checkout .ftr-contact { margin-top: 16px !important; background: rgba(255,255,255,.05) !important; border: 1px solid rgba(245,134,52,.2) !important; border-radius: var(--r) !important; padding: 16px !important; }\r\n#dng-checkout .ftr-ci { display: flex !important; gap: 9px !important; align-items: start !important; font-size: 12.5px !important; line-height: 1.5 !important; margin-bottom: 10px !important; }\r\n#dng-checkout .ftr-ci:last-child { margin-bottom: 0 !important; }\r\n#dng-checkout .ftr-ci i { color: var(--orange) !important; flex-shrink: 0 !important; margin-top: 1px !important; }\r\n#dng-checkout .ftr-bot { display: flex !important; justify-content: space-between !important; align-items: center !important; padding: 20px 0 !important; gap: 14px !important; flex-wrap: wrap !important; }\r\n#dng-checkout .ftr-bot p { font-family: var(--mono) !important; font-size: 11.5px !important; color: rgba(255,255,255,.5) !important; }\r\n#dng-checkout .ftr-bot div { display: flex !important; gap: 20px !important; }\r\n#dng-checkout .ftr-bot a { font-size: 12.5px !important; color: rgba(255,255,255,.6) !important; }\r\n#dng-checkout .ftr-bot a:hover { color: var(--orange-3) !important; }\r\n\r\n\/* ---------- RESPONSIVE (shared) ---------- *\/\r\n@media (max-width: 980px) {\r\n  #dng-checkout .nav, #dng-checkout .hdr-search { display: none !important; }\r\n  #dng-checkout .burger { display: flex !important; }\r\n  #dng-checkout .m-search { display: block !important; }\r\n  #dng-checkout .hdr-in { gap: 12px !important; }\r\n  #dng-checkout .hdr-cart { margin-left: auto !important; }\r\n  #dng-checkout .ftr-grid { grid-template-columns: 1fr 1fr !important; gap: 32px !important; }\r\n}\r\n@media (max-width: 620px) {\r\n  #dng-checkout .logo img { height: 38px !important; }\r\n  #dng-checkout .ftr-grid { grid-template-columns: 1fr !important; gap: 28px !important; }\r\n  #dng-checkout .ftr-bot { flex-direction: column !important; text-align: center !important; }\r\n  #dng-checkout .drawer { width: 100% !important; }\r\n  #dng-checkout .fab { width: 52px !important; height: 52px !important; }\r\n  #dng-checkout .fab-stack { right: 14px !important; bottom: 14px !important; gap: 10px !important; }\r\n}\r\n\r\n\r\n#dng-checkout .band { background: var(--teal) !important; color: #fff !important; padding: 28px 0 !important; }\r\n#dng-checkout .band h1 { font-family: var(--display) !important; font-size: clamp(24px, 3vw, 32px) !important; font-weight: 500 !important; letter-spacing: -.03em !important; color: #fff !important; margin-bottom: 5px !important; }\r\n#dng-checkout .band p { font-size: 13.5px !important; color: rgba(255,255,255,.74) !important; }\r\n#dng-checkout .steps { display: flex !important; align-items: center !important; gap: 8px !important; margin-top: 16px !important; flex-wrap: wrap !important; }\r\n#dng-checkout .step { display: flex !important; align-items: center !important; gap: 7px !important; font-family: var(--mono) !important; font-size: 11px !important; letter-spacing: .06em !important; text-transform: uppercase !important; color: rgba(255,255,255,.55) !important; }\r\n#dng-checkout .step.on { color: var(--orange-3) !important; }\r\n#dng-checkout .step i { width: 20px !important; height: 20px !important; border-radius: 50% !important; border: 1.5px solid currentColor !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 10px !important; font-weight: 600 !important; }\r\n#dng-checkout .step.on i { background: var(--orange) !important; border-color: var(--orange) !important; color: #fff !important; }\r\n#dng-checkout .step-line { width: 22px !important; height: 1px !important; background: rgba(255,255,255,.24) !important; }\r\n\r\n#dng-checkout .shell { padding: 32px 0 90px !important; }\r\n#dng-checkout .cols { display: grid !important; grid-template-columns: 1fr 372px !important; gap: 32px !important; align-items: start !important; }\r\n\r\n#dng-checkout .card { background: var(--paper) !important; border: 1px solid var(--line) !important; border-radius: var(--r-lg) !important; padding: 26px 26px !important; margin-bottom: 18px !important; }\r\n#dng-checkout .card-hd { display: flex !important; align-items: center !important; gap: 12px !important; margin-bottom: 20px !important; }\r\n#dng-checkout .card-n { width: 30px !important; height: 30px !important; border-radius: 50% !important; background: var(--peach) !important; color: var(--teal) !important; display: flex !important; align-items: center !important; justify-content: center !important; font-family: var(--mono) !important; font-size: 12px !important; font-weight: 600 !important; flex-shrink: 0 !important; }\r\n#dng-checkout .card-hd h2 { font-family: var(--display) !important; font-size: 19px !important; font-weight: 600 !important; color: var(--teal) !important; letter-spacing: -.015em !important; }\r\n#dng-checkout .card-hd p { font-size: 12.5px !important; color: var(--muted) !important; margin-top: 1px !important; }\r\n\r\n#dng-checkout .g2 { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 14px !important; }\r\n#dng-checkout .g2 .field + .field { margin-top: 0 !important; }\r\n#dng-checkout .g2 > .field { margin-top: 0 !important; }\r\n#dng-checkout .row + .row { margin-top: 14px !important; }\r\n\r\n\/* payment options *\/\r\n#dng-checkout .pays { display: flex !important; flex-direction: column !important; gap: 10px !important; }\r\n#dng-checkout .pay {\r\n  display: flex !important; gap: 13px !important; align-items: flex-start !important;\r\n  padding: 16px !important; border: 1.5px solid var(--line) !important; border-radius: var(--r) !important;\r\n  cursor: pointer !important; transition: border-color .2s, background-color .2s !important; background: var(--paper-2) !important;\r\n}\r\n#dng-checkout .pay:hover { border-color: var(--orange-3) !important; }\r\n#dng-checkout .pay.on { border-color: var(--orange) !important; background: var(--peach) !important; }\r\n#dng-checkout .pay input { position: absolute !important; opacity: 0 !important; width: 1px !important; height: 1px !important; }\r\n#dng-checkout .pay-dot { width: 19px !important; height: 19px !important; border-radius: 50% !important; border: 2px solid var(--line) !important; flex-shrink: 0 !important; margin-top: 2px !important; position: relative !important; transition: border-color .2s !important; background: #fff !important; }\r\n#dng-checkout .pay.on .pay-dot { border-color: var(--orange) !important; }\r\n#dng-checkout .pay.on .pay-dot::after { content: \"\" !important; position: absolute !important; inset: 3px !important; border-radius: 50% !important; background: var(--orange) !important; }\r\n#dng-checkout .pay-b { flex: 1 !important; min-width: 0 !important; }\r\n#dng-checkout .pay-t { display: flex !important; align-items: center !important; gap: 9px !important; flex-wrap: wrap !important; margin-bottom: 3px !important; }\r\n#dng-checkout .pay-t strong { font-family: var(--display) !important; font-size: 15px !important; font-weight: 600 !important; color: var(--teal) !important; }\r\n#dng-checkout .pay-b p { font-size: 12.5px !important; color: var(--body) !important; line-height: 1.5 !important; }\r\n#dng-checkout .pay-ico { width: 38px !important; height: 38px !important; border-radius: 9px !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; }\r\n#dng-checkout .pi-ps { background: #011B33 !important; color: #00C3F7 !important; }\r\n#dng-checkout .pi-pod { background: var(--teal) !important; color: var(--orange-3) !important; }\r\n#dng-checkout .pi-wa { background: #25D366 !important; color: #fff !important; }\r\n\r\n\/* account nudge *\/\r\n#dng-checkout .nudge { display: flex !important; gap: 11px !important; align-items: flex-start !important; padding: 14px 16px !important; background: var(--peach) !important; border-radius: var(--r) !important; margin-top: 16px !important; }\r\n#dng-checkout .nudge input { width: 17px !important; height: 17px !important; accent-color: var(--orange) !important; margin-top: 2px !important; flex-shrink: 0 !important; cursor: pointer !important; }\r\n#dng-checkout .nudge strong { display: block !important; font-size: 13.5px !important; font-weight: 600 !important; color: var(--teal) !important; margin-bottom: 2px !important; }\r\n#dng-checkout .nudge p { font-size: 12.5px !important; color: var(--body) !important; line-height: 1.5 !important; }\r\n\r\n\/* summary *\/\r\n#dng-checkout .sum { position: sticky !important; top: 84px !important; background: var(--paper) !important; border: 1px solid var(--line) !important; border-radius: var(--r-lg) !important; overflow: hidden !important; }\r\n#dng-checkout .sum-hd { padding: 16px 20px !important; background: var(--teal) !important; color: #fff !important; display: flex !important; justify-content: space-between !important; align-items: center !important; }\r\n#dng-checkout .sum-hd strong { font-family: var(--display) !important; font-size: 16px !important; font-weight: 600 !important; }\r\n#dng-checkout .sum-hd span { font-family: var(--mono) !important; font-size: 11px !important; color: var(--orange-3) !important; }\r\n#dng-checkout .sum-items { max-height: 300px !important; overflow-y: auto !important; padding: 4px 20px !important; }\r\n#dng-checkout .sum-bd { padding: 16px 20px 20px !important; border-top: 1px solid var(--line) !important; background: var(--paper-2) !important; }\r\n#dng-checkout .sum-secure { display: flex !important; align-items: center !important; gap: 8px !important; justify-content: center !important; padding: 12px !important; font-size: 11.5px !important; color: var(--muted) !important; border-top: 1px solid var(--line) !important; }\r\n#dng-checkout .sum-secure i { color: var(--ok) !important; display: flex !important; }\r\n\r\n#dng-checkout .rx-flag { display: flex !important; gap: 9px !important; align-items: flex-start !important; padding: 12px 14px !important; background: var(--peach) !important; border-radius: var(--r-sm) !important; margin-top: 12px !important; font-size: 12px !important; color: var(--body) !important; line-height: 1.5 !important; }\r\n#dng-checkout .rx-flag i { color: var(--orange-2) !important; flex-shrink: 0 !important; margin-top: 1px !important; }\r\n\r\n#dng-checkout .empty { text-align: center !important; padding: 80px 20px !important; background: var(--paper) !important; border: 1px dashed var(--line) !important; border-radius: var(--r-lg) !important; }\r\n#dng-checkout .empty-ico { width: 64px !important; height: 64px !important; margin: 0 auto 14px !important; border-radius: 50% !important; background: var(--peach) !important; color: var(--teal) !important; display: flex !important; align-items: center !important; justify-content: center !important; }\r\n#dng-checkout .empty p { font-size: 14px !important; color: var(--body) !important; margin: 8px 0 20px !important; }\r\n\r\n#dng-checkout .alert { display: none !important; gap: 10px !important; align-items: flex-start !important; padding: 13px 15px !important; border-radius: var(--r-sm) !important; margin-bottom: 16px !important; font-size: 13px !important; line-height: 1.5 !important; }\r\n#dng-checkout .alert.on { display: flex !important; }\r\n#dng-checkout .alert-bad { background: var(--danger-bg) !important; color: var(--danger) !important; border: 1px solid #F5C6C0 !important; }\r\n\r\n@media (max-width: 940px) {\r\n  #dng-checkout .cols { grid-template-columns: 1fr !important; }\r\n  #dng-checkout .sum { position: static !important; }\r\n}\r\n@media (max-width: 620px) {\r\n  #dng-checkout .shell { padding: 22px 0 70px !important; }\r\n  #dng-checkout .card { padding: 20px 17px !important; }\r\n  #dng-checkout .g2 { grid-template-columns: 1fr !important; }\r\n  #dng-checkout .steps { gap: 5px !important; }\r\n  #dng-checkout .step-line { width: 12px !important; }\r\n  #dng-checkout .step { font-size: 10px !important; }\r\n}\r\n\r\n<\/style>\r\n\r\n<div id=\"dng-checkout\">\r\n\r\n  <header class=\"hdr\">\r\n    <div class=\"wrap\">\r\n      <div class=\"hdr-in\">\r\n        <a href=\"https:\/\/dngpharmacyandmart.com\/\" class=\"logo\" aria-label=\"DNG Pharmacy and Mart \u2014 home\">\r\n          <img decoding=\"async\" src=\"https:\/\/dngpharmacyandmart.com\/wp-content\/uploads\/2025\/08\/DNG-Pharmacy-Mart-1.png\" alt=\"DNG Pharmacy and Mart\" width=\"180\" height=\"46\">\r\n        <\/a>\r\n\r\n        <div class=\"hdr-search\">\r\n          <span class=\"s-ico\"><svg width=\"17\" height=\"17\" viewBox=\"0 0 24 24\" fill=\"none\"><circle cx=\"11\" cy=\"11\" r=\"7.5\" stroke=\"currentColor\" stroke-width=\"2\"\/><path d=\"M20 20l-3.6-3.6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\/><\/svg><\/span>\r\n          <input type=\"search\" class=\"inp\" id=\"hSearch\" placeholder=\"Search medicines, vitamins, brands\u2026\" aria-label=\"Search products\">\r\n        <\/div>\r\n\r\n        <nav class=\"nav\" aria-label=\"Main\">\r\n          <a href=\"https:\/\/dngpharmacyandmart.com\/\">Home<\/a><a href=\"https:\/\/shop.dngpharmacyandmart.com\/\" class=\"on\">Shop<\/a><a href=\"https:\/\/dngpharmacyandmart.com\/about-us\/\">About<\/a><a href=\"https:\/\/dngpharmacyandmart.com\/contact-us\/\">Contact<\/a>\r\n        <\/nav>\r\n\r\n        <button class=\"hdr-cart\" data-cart-open aria-label=\"Open cart\">\r\n          <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 2.5L3.5 6.5V20a1.5 1.5 0 001.5 1.5h14a1.5 1.5 0 001.5-1.5V6.5L18 2.5z\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linejoin=\"round\"\/><path d=\"M3.5 6.5h17M15.5 10a3.5 3.5 0 01-7 0\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\"\/><\/svg><span class=\"n\" data-cart-n>0<\/span>\r\n        <\/button>\r\n\r\n        <button class=\"burger\" id=\"burger\" aria-label=\"Open menu\" aria-expanded=\"false\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M3.5 7h17M3.5 12h17M3.5 17h17\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\/><\/svg><\/button>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"m-search\">\r\n      <div class=\"hdr-search\" style=\"max-width:none!important;display:block!important;\">\r\n        <span class=\"s-ico\"><svg width=\"17\" height=\"17\" viewBox=\"0 0 24 24\" fill=\"none\"><circle cx=\"11\" cy=\"11\" r=\"7.5\" stroke=\"currentColor\" stroke-width=\"2\"\/><path d=\"M20 20l-3.6-3.6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"\/><\/svg><\/span>\r\n        <input type=\"search\" class=\"inp\" id=\"mSearch\" placeholder=\"Search medicines, vitamins\u2026\" aria-label=\"Search products\">\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <nav class=\"m-nav\" id=\"mNav\" aria-label=\"Mobile\">\r\n      <a href=\"https:\/\/dngpharmacyandmart.com\/\">Home<\/a><a href=\"https:\/\/shop.dngpharmacyandmart.com\/\" class=\"on\">Shop<\/a><a href=\"https:\/\/dngpharmacyandmart.com\/about-us\/\">About<\/a><a href=\"https:\/\/dngpharmacyandmart.com\/contact-us\/\">Contact<\/a>\r\n    <\/nav>\r\n  <\/header>\r\n\r\n  <section class=\"band\">\r\n    <div class=\"wrap\">\r\n      <h1>Checkout<\/h1>\r\n      <p>No account needed. Two minutes and it's on its way.<\/p>\r\n      <div class=\"steps\">\r\n        <div class=\"step on\"><i>1<\/i>Your details<\/div><div class=\"step-line\"><\/div>\r\n        <div class=\"step on\"><i>2<\/i>Delivery<\/div><div class=\"step-line\"><\/div>\r\n        <div class=\"step on\"><i>3<\/i>Payment<\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/section>\r\n\r\n  <div class=\"shell\">\r\n    <div class=\"wrap\">\r\n      <div id=\"empty\" hidden>\r\n        <div class=\"empty\">\r\n          <div class=\"empty-ico\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 2.5L3.5 6.5V20a1.5 1.5 0 001.5 1.5h14a1.5 1.5 0 001.5-1.5V6.5L18 2.5z\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linejoin=\"round\"\/><path d=\"M3.5 6.5h17M15.5 10a3.5 3.5 0 01-7 0\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\"\/><\/svg><\/div>\r\n          <div class=\"h-lg\">Your cart is empty<\/div>\r\n          <p>Add a few things and come back \u2014 we'll keep them here.<\/p>\r\n          <a href=\"https:\/\/shop.dngpharmacyandmart.com\/\" class=\"btn btn-teal\">Browse the shop <svg class=\"arw\" width=\"15\" height=\"15\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M3 8h10m0 0l-4-4m4 4l-4 4\" stroke=\"currentColor\" stroke-width=\"1.9\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/a>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"cols\" id=\"cols\">\r\n        <div>\r\n          <div class=\"alert alert-bad\" id=\"alert\">\r\n            <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" style=\"flex-shrink:0;margin-top:1px;\"><path d=\"M12 8.5v5M12 16.6h.01M10.3 3.9L1.8 18a2 2 0 001.7 3h17a2 2 0 001.7-3L13.7 3.9a2 2 0 00-3.4 0z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\r\n            <span id=\"alertMsg\"><\/span>\r\n          <\/div>\r\n\r\n          <!-- 1. CONTACT -->\r\n          <div class=\"card\">\r\n            <div class=\"card-hd\">\r\n              <div class=\"card-n\">1<\/div>\r\n              <div><h2>Who's this for?<\/h2><p>So we can confirm the order and reach you about delivery.<\/p><\/div>\r\n            <\/div>\r\n            <div class=\"g2\">\r\n              <div class=\"field\">\r\n                <label for=\"fName\">Full name<\/label>\r\n                <input type=\"text\" id=\"fName\" class=\"inp\" placeholder=\"Chinedu Okeke\" autocomplete=\"name\" required>\r\n                <div class=\"field-err\" data-for=\"fName\">Enter your name<\/div>\r\n              <\/div>\r\n              <div class=\"field\">\r\n                <label for=\"fPhone\">Phone number<\/label>\r\n                <input type=\"tel\" id=\"fPhone\" class=\"inp\" placeholder=\"0803 000 0000\" autocomplete=\"tel\" required>\r\n                <div class=\"field-err\" data-for=\"fPhone\">Enter a reachable phone number<\/div>\r\n              <\/div>\r\n            <\/div>\r\n            <div class=\"row field\" style=\"margin-top:14px!important;\">\r\n              <label for=\"fEmail\">Email address<\/label>\r\n              <input type=\"email\" id=\"fEmail\" class=\"inp\" placeholder=\"you@example.com\" autocomplete=\"email\" required>\r\n              <p class=\"hint\">Your receipt and order updates go here.<\/p>\r\n              <div class=\"field-err\" data-for=\"fEmail\">Enter a valid email address<\/div>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <!-- 2. DELIVERY -->\r\n          <div class=\"card\">\r\n            <div class=\"card-hd\">\r\n              <div class=\"card-n\">2<\/div>\r\n              <div><h2>Where should we bring it?<\/h2><p>We deliver across Abakaliki and nearby towns.<\/p><\/div>\r\n            <\/div>\r\n            <div class=\"field\">\r\n              <label for=\"fAddr\">Street address<\/label>\r\n              <input type=\"text\" id=\"fAddr\" class=\"inp\" placeholder=\"12 Ogoja Road, opposite the church\" autocomplete=\"street-address\" required>\r\n              <div class=\"field-err\" data-for=\"fAddr\">Enter the delivery address<\/div>\r\n            <\/div>\r\n            <div class=\"g2\" style=\"margin-top:14px!important;\">\r\n              <div class=\"field\">\r\n                <label for=\"fCity\">Town or area<\/label>\r\n                <input type=\"text\" id=\"fCity\" class=\"inp\" placeholder=\"Abakaliki\" autocomplete=\"address-level2\" required>\r\n                <div class=\"field-err\" data-for=\"fCity\">Enter your town<\/div>\r\n              <\/div>\r\n              <div class=\"field\">\r\n                <label for=\"fState\">State<\/label>\r\n                <select id=\"fState\" class=\"inp\">\r\n                  <option value=\"Ebonyi\" selected>Ebonyi<\/option>\r\n                  <option>Abia<\/option><option>Anambra<\/option><option>Benue<\/option>\r\n                  <option>Cross River<\/option><option>Enugu<\/option><option>Imo<\/option>\r\n                  <option>Lagos<\/option><option>FCT \u2014 Abuja<\/option><option>Rivers<\/option>\r\n                  <option>Other<\/option>\r\n                <\/select>\r\n              <\/div>\r\n            <\/div>\r\n            <div class=\"field\" style=\"margin-top:14px!important;\">\r\n              <label for=\"fNote\">Landmark or delivery note <span style=\"color:var(--muted);font-weight:400;\">(optional)<\/span><\/label>\r\n              <textarea id=\"fNote\" class=\"inp\" placeholder=\"Call when you reach the junction \u2014 the gate is blue.\"><\/textarea>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <!-- 3. PAYMENT -->\r\n          <div class=\"card\">\r\n            <div class=\"card-hd\">\r\n              <div class=\"card-n\">3<\/div>\r\n              <div><h2>How would you like to pay?<\/h2><p>All three work. Pick whichever suits you.<\/p><\/div>\r\n            <\/div>\r\n\r\n            <div class=\"pays\">\r\n              <label class=\"pay on\" data-pay=\"paystack\">\r\n                <input type=\"radio\" name=\"pay\" value=\"paystack\" checked>\r\n                <span class=\"pay-dot\"><\/span>\r\n                <span class=\"pay-b\">\r\n                  <span class=\"pay-t\"><strong>Pay now with Paystack<\/strong><span class=\"chip chip-stock\">Fastest<\/span><\/span>\r\n                  <p>Card, bank transfer or USSD. You'll be taken to Paystack's secure page and brought straight back.<\/p>\r\n                <\/span>\r\n                <span class=\"pay-ico pi-ps\"><svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"><rect x=\"2.5\" y=\"5\" width=\"19\" height=\"14\" rx=\"2.5\" stroke=\"currentColor\" stroke-width=\"2\"\/><path d=\"M2.5 10h19\" stroke=\"currentColor\" stroke-width=\"2\"\/><\/svg><\/span>\r\n              <\/label>\r\n\r\n              <label class=\"pay\" data-pay=\"pod\">\r\n                <input type=\"radio\" name=\"pay\" value=\"pod\">\r\n                <span class=\"pay-dot\"><\/span>\r\n                <span class=\"pay-b\">\r\n                  <span class=\"pay-t\"><strong>Pay on delivery<\/strong><\/span>\r\n                  <p>Cash or transfer when the rider hands it over. Available within Abakaliki.<\/p>\r\n                <\/span>\r\n                <span class=\"pay-ico pi-pod\"><svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M1.5 4h14v11h-14zM15.5 8H19l3.5 3.5V15h-7M5.5 20a2.2 2.2 0 100-4.4 2.2 2.2 0 000 4.4zM18 20a2.2 2.2 0 100-4.4 2.2 2.2 0 000 4.4z\" stroke=\"currentColor\" stroke-width=\"1.9\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/span>\r\n              <\/label>\r\n\r\n              <label class=\"pay\" data-pay=\"whatsapp\">\r\n                <input type=\"radio\" name=\"pay\" value=\"whatsapp\">\r\n                <span class=\"pay-dot\"><\/span>\r\n                <span class=\"pay-b\">\r\n                  <span class=\"pay-t\"><strong>Confirm on WhatsApp<\/strong><\/span>\r\n                  <p>We'll send your order to WhatsApp, confirm stock with you, then take payment however you prefer.<\/p>\r\n                <\/span>\r\n                <span class=\"pay-ico pi-wa\"><svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M17.5 14.4c-.3-.15-1.76-.87-2.03-.97-.27-.1-.47-.15-.67.15s-.77.96-.94 1.16c-.17.2-.35.22-.64.08-.3-.15-1.26-.47-2.4-1.48-.88-.79-1.48-1.76-1.65-2.06-.17-.3-.02-.46.13-.6.13-.14.3-.35.44-.53.15-.17.2-.3.3-.5.1-.2.05-.37-.02-.52-.08-.15-.67-1.61-.92-2.2-.24-.58-.49-.5-.67-.51h-.57c-.2 0-.52.07-.8.37-.27.3-1.03 1.02-1.03 2.48s1.06 2.87 1.21 3.07c.15.2 2.1 3.2 5.08 4.49 2.98 1.28 2.98.85 3.52.8.54-.05 1.76-.72 2-1.41.25-.7.25-1.29.18-1.42-.08-.12-.28-.2-.57-.35M12.05 21.8h-.01a9.87 9.87 0 01-5.03-1.38l-.36-.21-3.74.98 1-3.65-.24-.37a9.86 9.86 0 01-1.51-5.26c0-5.45 4.44-9.89 9.89-9.89 2.64 0 5.12 1.03 6.99 2.9a9.83 9.83 0 012.89 6.99c0 5.45-4.43 9.89-9.88 9.89\"\/><\/svg><\/span>\r\n              <\/label>\r\n            <\/div>\r\n\r\n            <div class=\"rx-flag\" id=\"rxFlag\" hidden>\r\n              <i><svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M12 8.5v5M12 16.6h.01M10.3 3.9L1.8 18a2 2 0 001.7 3h17a2 2 0 001.7-3L13.7 3.9a2 2 0 00-3.4 0z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/i>\r\n              <span>Your order includes prescription medicine. A pharmacist checks the prescription before dispatch \u2014 we'll call you if anything needs clarifying.<\/span>\r\n            <\/div>\r\n\r\n            <label class=\"nudge\">\r\n              <input type=\"checkbox\" id=\"fSave\">\r\n              <span>\r\n                <strong>Save my details for next time<\/strong>\r\n                <p>We'll create a free account with this email so reordering takes one tap. No password to remember \u2014 we send a sign-in link.<\/p>\r\n              <\/span>\r\n            <\/label>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- SUMMARY -->\r\n        <aside class=\"sum\">\r\n          <div class=\"sum-hd\"><strong>Order summary<\/strong><span data-cart-n-txt>0 items<\/span><\/div>\r\n          <div class=\"sum-items\" id=\"sumItems\"><\/div>\r\n          <div class=\"sum-bd\">\r\n            <div class=\"sum-r\"><span>Subtotal<\/span><span data-sub>\u20a60<\/span><\/div>\r\n            <div class=\"sum-r\"><span>Delivery<\/span><span data-ship>\u20a61,500<\/span><\/div>\r\n            <div class=\"sum-tot\"><span>Total<\/span><b data-tot>\u20a60<\/b><\/div>\r\n            <button class=\"btn btn-primary btn-block\" id=\"placeBtn\" style=\"margin-top:16px!important;\">Pay with Paystack <svg class=\"arw\" width=\"15\" height=\"15\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M3 8h10m0 0l-4-4m4 4l-4 4\" stroke=\"currentColor\" stroke-width=\"1.9\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/button>\r\n            <p class=\"dr-note\">By placing this order you agree to our terms and confirm the prescription details are correct.<\/p>\r\n          <\/div>\r\n          <div class=\"sum-secure\">\r\n            <i><svg width=\"13\" height=\"13\" viewBox=\"0 0 24 24\" fill=\"none\"><rect x=\"4\" y=\"10\" width=\"16\" height=\"11\" rx=\"2\" stroke=\"currentColor\" stroke-width=\"2\"\/><path d=\"M8 10V7a4 4 0 118 0v3\" stroke=\"currentColor\" stroke-width=\"2\"\/><\/svg><\/i>\r\n            Secured by Paystack \u00b7 your card details never touch our servers\r\n          <\/div>\r\n        <\/aside>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n\r\n  <footer class=\"ftr\">\r\n    <div class=\"wrap\">\r\n      <div class=\"ftr-grid\">\r\n        <div>\r\n          <a href=\"https:\/\/dngpharmacyandmart.com\/\" class=\"ftr-logo\"><img decoding=\"async\" src=\"https:\/\/dngpharmacyandmart.com\/wp-content\/uploads\/2025\/08\/DNG-Pharmacy-Mart-1.png\" alt=\"DNG Pharmacy and Mart\" width=\"170\" height=\"42\"><\/a>\r\n          <p class=\"ftr-about\"><b>DNG Pharmacy and Mart<\/b> is a Nigerian-owned pharmacy in Abakaliki, Ebonyi State \u2014 dispensing genuine medicine with real pharmacist guidance.<\/p>\r\n          <div class=\"socials\">\r\n            <a href=\"#\" class=\"soc\" aria-label=\"Facebook\"><svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M24 12.07C24 5.44 18.63.07 12 .07S0 5.44 0 12.07c0 5.99 4.39 10.95 10.13 11.85v-8.38H7.08v-3.47h3.05V9.43c0-3.01 1.79-4.67 4.53-4.67 1.31 0 2.69.24 2.69.24v2.95h-1.51c-1.49 0-1.96.93-1.96 1.87v2.25h3.33l-.53 3.47h-2.8v8.38C19.61 23.02 24 18.06 24 12.07z\"\/><\/svg><\/a>\r\n            <a href=\"#\" class=\"soc\" aria-label=\"Instagram\"><svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M12 2.16c3.2 0 3.58.01 4.85.07 3.25.15 4.77 1.69 4.92 4.92.06 1.27.07 1.65.07 4.85s-.01 3.58-.07 4.85c-.15 3.23-1.66 4.77-4.92 4.92-1.27.06-1.64.07-4.85.07s-3.58-.01-4.85-.07c-3.26-.15-4.77-1.7-4.92-4.92-.06-1.27-.07-1.64-.07-4.85s.01-3.58.07-4.85c.15-3.23 1.66-4.77 4.92-4.92C8.42 2.17 8.8 2.16 12 2.16zM12 0C8.74 0 8.33.01 7.05.07 2.7.27.27 2.69.07 7.05.01 8.33 0 8.74 0 12s.01 3.67.07 4.95c.2 4.36 2.62 6.78 6.98 6.98C8.33 23.99 8.74 24 12 24s3.67-.01 4.95-.07c4.35-.2 6.78-2.62 6.98-6.98.06-1.28.07-1.69.07-4.95s-.01-3.67-.07-4.95c-.2-4.35-2.62-6.78-6.98-6.98C15.67.01 15.26 0 12 0zm0 5.84a6.16 6.16 0 100 12.32 6.16 6.16 0 000-12.32zM12 16a4 4 0 110-8 4 4 0 010 8zm6.41-11.85a1.44 1.44 0 100 2.88 1.44 1.44 0 000-2.88z\"\/><\/svg><\/a>\r\n            <a href=\"#\" class=\"soc\" aria-label=\"X\"><svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M18.24 2.25h3.31l-7.23 8.26 8.5 11.24h-6.66l-5.21-6.82-5.97 6.82H1.68l7.73-8.84L1.25 2.25h6.83l4.71 6.23zm-1.16 17.52h1.83L7.08 4.13H5.12z\"\/><\/svg><\/a>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div>\r\n          <h4>Shop<\/h4>\r\n          <ul class=\"ftr-links\">\r\n            <li><a href=\"https:\/\/shop.dngpharmacyandmart.com\/?cat=prescription\">Prescription<\/a><\/li>\r\n            <li><a href=\"https:\/\/shop.dngpharmacyandmart.com\/?cat=otc\">Over-the-counter<\/a><\/li>\r\n            <li><a href=\"https:\/\/shop.dngpharmacyandmart.com\/?cat=vitamins\">Vitamins<\/a><\/li>\r\n            <li><a href=\"https:\/\/shop.dngpharmacyandmart.com\/?cat=baby\">Baby care<\/a><\/li>\r\n            <li><a href=\"https:\/\/shop.dngpharmacyandmart.com\/?cat=personal\">Personal care<\/a><\/li>\r\n          <\/ul>\r\n        <\/div>\r\n\r\n        <div>\r\n          <h4>Company<\/h4>\r\n          <ul class=\"ftr-links\">\r\n            <li><a href=\"https:\/\/dngpharmacyandmart.com\/\">Home<\/a><\/li>\r\n            <li><a href=\"https:\/\/dngpharmacyandmart.com\/about-us\/\">About us<\/a><\/li>\r\n            <li><a href=\"https:\/\/dngpharmacyandmart.com\/contact-us\/\">Contact<\/a><\/li>\r\n            <li><a href=\"https:\/\/dngpharmacyandmart.com\/contact-us\/\">Free consultation<\/a><\/li>\r\n            <li><a href=\"https:\/\/wa.me\/2347040231289\" target=\"_blank\" rel=\"noopener\">WhatsApp us<\/a><\/li>\r\n          <\/ul>\r\n        <\/div>\r\n\r\n        <div>\r\n          <h4>Opening hours<\/h4>\r\n          <ul class=\"ftr-hours\">\r\n            <li><span>Mon \u2013 Sat<\/span><b>8:00 \u2013 21:00<\/b><\/li>\r\n            <li><span>Sunday<\/span><b>14:00 \u2013 20:30<\/b><\/li>\r\n          <\/ul>\r\n          <div class=\"ftr-contact\">\r\n            <div class=\"ftr-ci\"><i><svg width=\"13\" height=\"13\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M21.5 16.9v2.8a1.9 1.9 0 01-2.07 1.9 18.8 18.8 0 01-8.2-2.92 18.5 18.5 0 01-5.7-5.7A18.8 18.8 0 012.6 4.75 1.9 1.9 0 014.5 2.68h2.8a1.9 1.9 0 011.9 1.63c.12.9.34 1.79.66 2.64a1.9 1.9 0 01-.43 2L8.2 10.1a15.2 15.2 0 005.7 5.7l1.15-1.23a1.9 1.9 0 012-.43c.85.32 1.74.54 2.64.66a1.9 1.9 0 011.63 1.93z\" stroke=\"currentColor\" stroke-width=\"1.9\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/i><span>+234 704 023 1289<\/span><\/div>\r\n            <div class=\"ftr-ci\"><i><svg width=\"13\" height=\"13\" viewBox=\"0 0 24 24\" fill=\"none\"><rect x=\"2.5\" y=\"4.5\" width=\"19\" height=\"15\" rx=\"2\" stroke=\"currentColor\" stroke-width=\"1.9\"\/><path d=\"M3 6l9 6.5L21 6\" stroke=\"currentColor\" stroke-width=\"1.9\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/i><span>dngpharmacyandmart@gmail.com<\/span><\/div>\r\n            <div class=\"ftr-ci\"><i><svg width=\"13\" height=\"13\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M20.5 10c0 6.5-8.5 12.5-8.5 12.5S3.5 16.5 3.5 10a8.5 8.5 0 0117 0z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"round\"\/><circle cx=\"12\" cy=\"10\" r=\"2.8\" stroke=\"currentColor\" stroke-width=\"2\"\/><\/svg><\/i><span>Adjacent Pastoral Center,<br>Kpiri Kpiri, Abakaliki<\/span><\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"ftr-bot\">\r\n        <p>\u00a9 2026 DNG Pharmacy and Mart<\/p>\r\n        <div>\r\n          <a href=\"https:\/\/dngpharmacyandmart.com\/privacy-policy\/\">Privacy<\/a>\r\n          <a href=\"https:\/\/dngpharmacyandmart.com\/terms\/\">Terms<\/a>\r\n          <a href=\"https:\/\/shop.dngpharmacyandmart.com\/\">Shop<\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/footer>\r\n\r\n  <div class=\"fab-stack\">\r\n    <a href=\"https:\/\/wa.me\/2347040231289?text=Hello%20DNG%20Pharmacy%2C%20I%20need%20help%20with%20an%20order\" target=\"_blank\" rel=\"noopener\" class=\"fab fab-wa\" aria-label=\"Chat with us on WhatsApp\">\r\n      <svg width=\"26\" height=\"26\" viewBox=\"0 0 24 24\" fill=\"currentColor\"><path d=\"M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51a12.8 12.8 0 00-.57-.01c-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413Z\"\/><\/svg><span class=\"fab-tip\">Chat with a pharmacist<\/span>\r\n    <\/a>\r\n    <button class=\"fab fab-cart\" data-cart-open aria-label=\"Open cart\">\r\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 2.5L3.5 6.5V20a1.5 1.5 0 001.5 1.5h14a1.5 1.5 0 001.5-1.5V6.5L18 2.5z\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linejoin=\"round\"\/><path d=\"M3.5 6.5h17M15.5 10a3.5 3.5 0 01-7 0\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\"\/><\/svg><span class=\"n\" data-cart-n>0<\/span><span class=\"fab-tip\">Your cart<\/span>\r\n    <\/button>\r\n  <\/div>\r\n\r\n  <div class=\"scrim\" data-cart-close><\/div>\r\n\r\n  <aside class=\"drawer\" id=\"drawer\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"drTitle\">\r\n    <div class=\"dr-hd\">\r\n      <div class=\"dr-hd-t\">\r\n        <span class=\"h-md\" id=\"drTitle\">Your cart<\/span>\r\n        <span class=\"dr-hd-n\" data-cart-n-txt>0 items<\/span>\r\n      <\/div>\r\n      <button class=\"dr-x\" data-cart-close aria-label=\"Close cart\"><svg width=\"15\" height=\"15\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6l12 12M18 6L6 18\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"\/><\/svg><\/button>\r\n    <\/div>\r\n    <div class=\"dr-bd\" id=\"drBody\"><\/div>\r\n    <div class=\"dr-ft\" id=\"drFoot\" hidden>\r\n      <div class=\"sum-r\"><span>Subtotal<\/span><span data-sub>\u20a60<\/span><\/div>\r\n      <div class=\"sum-r\"><span>Delivery \u2014 Abakaliki<\/span><span data-ship>\u20a61,500<\/span><\/div>\r\n      <div class=\"sum-tot\"><span>Total<\/span><b data-tot>\u20a60<\/b><\/div>\r\n      <a href=\"https:\/\/shop.dngpharmacyandmart.com\/checkout\/\" class=\"btn btn-primary btn-block\" style=\"margin-top:14px!important;\">Checkout <svg class=\"arw\" width=\"15\" height=\"15\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M3 8h10m0 0l-4-4m4 4l-4 4\" stroke=\"currentColor\" stroke-width=\"1.9\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/a>\r\n      <p class=\"dr-note\">Prescription items are checked by our pharmacist before dispatch.<\/p>\r\n    <\/div>\r\n  <\/aside>\r\n\r\n  <div class=\"toast\" id=\"toast\" role=\"status\" aria-live=\"polite\"><i><svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M20 6L9 17l-5-5\" stroke=\"currentColor\" stroke-width=\"3.2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg><\/i><span id=\"toastMsg\"><\/span><\/div>\r\n<\/div>\r\n\r\n<script>\r\n\r\nvar DNG = (function () {\r\n  'use strict';\r\n  var KEY = 'dng_cart_v1';\r\n  var mem = null;\r\n  var SHIP = 1500;\r\n\r\n  function read() {\r\n    if (mem) return mem;\r\n    try {\r\n      var raw = window.localStorage.getItem(KEY);\r\n      mem = raw ? JSON.parse(raw) : [];\r\n    } catch (e) { mem = []; }\r\n    if (!Array.isArray(mem)) mem = [];\r\n    return mem;\r\n  }\r\n  function write(items) {\r\n    mem = items;\r\n    try { window.localStorage.setItem(KEY, JSON.stringify(items)); } catch (e) {}\r\n    document.dispatchEvent(new CustomEvent('dng:cart'));\r\n  }\r\n  function money(n) { return '\u20a6' + Number(n || 0).toLocaleString('en-NG'); }\r\n\r\n  return {\r\n    SHIP: SHIP,\r\n    money: money,\r\n    items: read,\r\n    count: function () { return read().reduce(function (s, i) { return s + i.qty; }, 0); },\r\n    subtotal: function () { return read().reduce(function (s, i) { return s + i.price * i.qty; }, 0); },\r\n    total: function () { var s = this.subtotal(); return s > 0 ? s + SHIP : 0; },\r\n    add: function (p, qty) {\r\n      qty = qty || 1;\r\n      var items = read().slice();\r\n      var f = items.filter(function (i) { return i.id === p.id; })[0];\r\n      if (f) { f.qty += qty; if (p.rxFile) f.rxFile = p.rxFile; }\r\n      else items.push({ id: p.id, name: p.name, price: p.price, img: p.img || '', pack: p.pack || '', form: p.form || '', rx: !!p.rx, rxFile: p.rxFile || '', qty: qty });\r\n      write(items);\r\n    },\r\n    setQty: function (id, qty) {\r\n      var items = read().slice();\r\n      for (var i = 0; i < items.length; i++) {\r\n        if (items[i].id === id) { items[i].qty = qty; if (qty < 1) items.splice(i, 1); break; }\r\n      }\r\n      write(items);\r\n    },\r\n    remove: function (id) { write(read().filter(function (i) { return i.id !== id; })); },\r\n    clear: function () { write([]); },\r\n    hasRx: function () { return read().some(function (i) { return i.rx; }); }\r\n  };\r\n})();\r\n\r\n(function () {\r\n  'use strict';\r\n  function boot() {\r\n    var root = document.getElementById('dng-checkout');\r\n    if (!root) return;\r\n\r\n    \/* --- mobile nav --- *\/\r\n    var burger = root.querySelector('#burger'), mnav = root.querySelector('#mNav');\r\n    if (burger && mnav) burger.addEventListener('click', function () {\r\n      var open = mnav.classList.toggle('on');\r\n      burger.setAttribute('aria-expanded', open ? 'true' : 'false');\r\n    });\r\n\r\n    \/* --- search: route to shop --- *\/\r\n    ['#hSearch', '#mSearch'].forEach(function (sel) {\r\n      var el = root.querySelector(sel);\r\n      if (!el) return;\r\n      el.addEventListener('keydown', function (e) {\r\n        if (e.key === 'Enter' && el.value.trim()) {\r\n          var t = root.querySelector('#grid');\r\n          if (t && window.DNGShopSearch) { window.DNGShopSearch(el.value.trim()); }\r\n          else window.location.href = 'https:\/\/shop.dngpharmacyandmart.com\/?q=' + encodeURIComponent(el.value.trim());\r\n        }\r\n      });\r\n    });\r\n\r\n    \/* --- drawer --- *\/\r\n    var drawer = root.querySelector('#drawer'), scrim = root.querySelector('.scrim');\r\n    var lastFocus = null;\r\n    function open() {\r\n      lastFocus = document.activeElement;\r\n      drawer.classList.add('on'); scrim.classList.add('on');\r\n      document.body.style.overflow = 'hidden';\r\n      var x = drawer.querySelector('[data-cart-close]'); if (x) x.focus();\r\n    }\r\n    function close() {\r\n      drawer.classList.remove('on'); scrim.classList.remove('on');\r\n      document.body.style.overflow = '';\r\n      if (lastFocus) lastFocus.focus();\r\n    }\r\n    root.querySelectorAll('[data-cart-open]').forEach(function (b) { b.addEventListener('click', open); });\r\n    root.querySelectorAll('[data-cart-close]').forEach(function (b) { b.addEventListener('click', close); });\r\n    document.addEventListener('keydown', function (e) { if (e.key === 'Escape' && drawer.classList.contains('on')) close(); });\r\n    window.DNGOpenCart = open;\r\n\r\n    \/* --- render --- *\/\r\n    var body = root.querySelector('#drBody'), foot = root.querySelector('#drFoot');\r\n\r\n    function render() {\r\n      var items = DNG.items(), n = DNG.count();\r\n      root.querySelectorAll('[data-cart-n]').forEach(function (e) { e.textContent = n; });\r\n      root.querySelectorAll('[data-cart-n-txt]').forEach(function (e) { e.textContent = n + (n === 1 ? ' item' : ' items'); });\r\n\r\n      if (!items.length) {\r\n        body.innerHTML = '<div class=\"dr-empty\">' +\r\n          '<div class=\"dr-empty-ico\"><svg width=\"26\" height=\"26\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 2.5L3.5 6.5V20a1.5 1.5 0 001.5 1.5h14a1.5 1.5 0 001.5-1.5V6.5L18 2.5z\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linejoin=\"round\"\/><path d=\"M3.5 6.5h17M15.5 10a3.5 3.5 0 01-7 0\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\"\/><\/svg><\/div>' +\r\n          '<div class=\"h-sm\">Nothing here yet<\/div>' +\r\n          '<p>Browse the shelves and add what you need.<\/p>' +\r\n          '<a href=\"https:\/\/shop.dngpharmacyandmart.com\/\" class=\"btn btn-teal\">Start shopping<\/a><\/div>';\r\n        foot.hidden = true;\r\n        return;\r\n      }\r\n\r\n      body.innerHTML = items.map(function (i) {\r\n        var img = i.img\r\n          ? '<img decoding=\"async\" src=\"' + i.img + '\" alt=\"\">'\r\n          : '<div class=\"ph\" style=\"width:100%;height:100%;\"><small>IMG<\/small><\/div>';\r\n        return '<div class=\"ln\">' +\r\n          '<div class=\"ln-img\">' + img + '<\/div>' +\r\n          '<div><div class=\"ln-top\">' +\r\n            '<div><div class=\"ln-name\">' + i.name + '<\/div>' +\r\n            '<div class=\"ln-meta\">' + (i.pack || i.form || '') + ' \u00b7 ' + DNG.money(i.price) + ' each<\/div>' +\r\n            (i.rx ? '<div class=\"ln-rx\"><svg width=\"10\" height=\"10\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M20 6L9 17l-5-5\" stroke=\"currentColor\" stroke-width=\"3.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>Prescription attached<\/div>' : '') +\r\n            '<\/div>' +\r\n            '<div class=\"ln-amt\">' + DNG.money(i.price * i.qty) + '<\/div>' +\r\n          '<\/div>' +\r\n          '<div class=\"ln-bot\"><div class=\"stp\">' +\r\n            '<button data-q=\"-\" data-id=\"' + i.id + '\" aria-label=\"Decrease quantity\">\u2212<\/button>' +\r\n            '<b>' + i.qty + '<\/b>' +\r\n            '<button data-q=\"+\" data-id=\"' + i.id + '\" aria-label=\"Increase quantity\">+<\/button>' +\r\n          '<\/div><button class=\"ln-del\" data-del=\"' + i.id + '\">Remove<\/button><\/div><\/div><\/div>';\r\n      }).join('');\r\n\r\n      foot.hidden = false;\r\n      root.querySelector('[data-sub]').textContent = DNG.money(DNG.subtotal());\r\n      root.querySelector('[data-tot]').textContent = DNG.money(DNG.total());\r\n\r\n      body.querySelectorAll('[data-q]').forEach(function (b) {\r\n        b.addEventListener('click', function () {\r\n          var id = b.getAttribute('data-id');\r\n          var it = DNG.items().filter(function (x) { return x.id === id; })[0];\r\n          if (!it) return;\r\n          DNG.setQty(id, it.qty + (b.getAttribute('data-q') === '+' ? 1 : -1));\r\n        });\r\n      });\r\n      body.querySelectorAll('[data-del]').forEach(function (b) {\r\n        b.addEventListener('click', function () { DNG.remove(b.getAttribute('data-del')); });\r\n      });\r\n    }\r\n\r\n    document.addEventListener('dng:cart', render);\r\n    render();\r\n\r\n    \/* --- toast --- *\/\r\n    var toast = root.querySelector('#toast'), tmsg = root.querySelector('#toastMsg'), tt;\r\n    window.DNGToast = function (msg) {\r\n      if (!toast) return;\r\n      tmsg.textContent = msg;\r\n      toast.classList.add('on');\r\n      clearTimeout(tt);\r\n      tt = setTimeout(function () { toast.classList.remove('on'); }, 2600);\r\n    };\r\n  }\r\n  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', boot);\r\n  else boot();\r\n})();\r\n\r\n\r\n(function () {\r\n  'use strict';\r\n  var ORDER_API = '\/dng-backend\/api\/order-create.php';\r\n\r\n  function boot() {\r\n    var root = document.getElementById('dng-checkout');\r\n    if (!root) return;\r\n\r\n    var cols = root.querySelector('#cols'), empty = root.querySelector('#empty');\r\n    var btn = root.querySelector('#placeBtn');\r\n    var method = 'paystack';\r\n\r\n    function paint() {\r\n      var items = DNG.items();\r\n      if (!items.length) { cols.hidden = true; empty.hidden = false; return; }\r\n      cols.hidden = false; empty.hidden = true;\r\n\r\n      root.querySelector('#sumItems').innerHTML = items.map(function (i) {\r\n        var img = i.img ? '<img decoding=\"async\" src=\"' + i.img + '\" alt=\"\">' : '<div class=\"ph\" style=\"width:100%;height:100%;\"><small>\u2014<\/small><\/div>';\r\n        return '<div class=\"ln\"><div class=\"ln-img\">' + img + '<\/div><div>' +\r\n          '<div class=\"ln-top\"><div><div class=\"ln-name\">' + i.name + '<\/div>' +\r\n          '<div class=\"ln-meta\">' + (i.pack || '') + ' \u00b7 \u00d7' + i.qty + '<\/div>' +\r\n          (i.rx ? '<div class=\"ln-rx\"><svg width=\"10\" height=\"10\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M20 6L9 17l-5-5\" stroke=\"currentColor\" stroke-width=\"3.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>Prescription attached<\/div>' : '') +\r\n          '<\/div><div class=\"ln-amt\">' + DNG.money(i.price * i.qty) + '<\/div><\/div><\/div><\/div>';\r\n      }).join('');\r\n\r\n      root.querySelector('[data-sub]').textContent = DNG.money(DNG.subtotal());\r\n      root.querySelector('[data-tot]').textContent = DNG.money(DNG.total());\r\n      root.querySelector('#rxFlag').hidden = !DNG.hasRx();\r\n    }\r\n\r\n    document.addEventListener('dng:cart', paint);\r\n    paint();\r\n\r\n    \/* payment picker *\/\r\n    root.querySelectorAll('.pay').forEach(function (p) {\r\n      p.addEventListener('click', function () {\r\n        root.querySelectorAll('.pay').forEach(function (x) { x.classList.remove('on'); });\r\n        p.classList.add('on');\r\n        p.querySelector('input').checked = true;\r\n        method = p.getAttribute('data-pay');\r\n        btn.innerHTML = ({\r\n          paystack: 'Pay with Paystack',\r\n          pod:      'Place order \u2014 pay on delivery',\r\n          whatsapp: 'Send order to WhatsApp'\r\n        })[method] + ' <svg class=\"arw\" width=\"15\" height=\"15\" viewBox=\"0 0 16 16\" fill=\"none\"><path d=\"M3 8h10m0 0l-4-4m4 4l-4 4\" stroke=\"currentColor\" stroke-width=\"1.9\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>';\r\n      });\r\n    });\r\n\r\n    \/* validation *\/\r\n    function err(msg) {\r\n      var a = root.querySelector('#alert');\r\n      root.querySelector('#alertMsg').textContent = msg;\r\n      a.classList.add('on');\r\n      a.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n    }\r\n    function clearErr() {\r\n      root.querySelector('#alert').classList.remove('on');\r\n      root.querySelectorAll('.field-err').forEach(function (e) { e.classList.remove('on'); });\r\n      root.querySelectorAll('.inp').forEach(function (e) { e.classList.remove('err'); });\r\n    }\r\n    function mark(id) {\r\n      var f = root.querySelector('#' + id);\r\n      if (f) f.classList.add('err');\r\n      var e = root.querySelector('[data-for=\"' + id + '\"]');\r\n      if (e) e.classList.add('on');\r\n    }\r\n    function val(id) { var e = root.querySelector('#' + id); return e ? e.value.trim() : ''; }\r\n\r\n    btn.addEventListener('click', function () {\r\n      clearErr();\r\n      var f = {\r\n        name: val('fName'), phone: val('fPhone'), email: val('fEmail'),\r\n        address: val('fAddr'), city: val('fCity'),\r\n        state: root.querySelector('#fState').value,\r\n        note: val('fNote'),\r\n        save: root.querySelector('#fSave').checked ? 1 : 0\r\n      };\r\n\r\n      var bad = [];\r\n      if (!f.name) bad.push('fName');\r\n      if (!\/^[0-9+\\s()-]{7,}$\/.test(f.phone)) bad.push('fPhone');\r\n      if (!\/^[^\\s@]+@[^\\s@]+\\.[^\\s@]{2,}$\/.test(f.email)) bad.push('fEmail');\r\n      if (!f.address) bad.push('fAddr');\r\n      if (!f.city) bad.push('fCity');\r\n\r\n      if (bad.length) {\r\n        bad.forEach(mark);\r\n        err('A few details are still missing \u2014 check the highlighted fields.');\r\n        root.querySelector('#' + bad[0]).focus();\r\n        return;\r\n      }\r\n\r\n      var items = DNG.items();\r\n      if (!items.length) { err('Your cart is empty.'); return; }\r\n\r\n      var payload = {\r\n        customer: f,\r\n        method: method,\r\n        items: items.map(function (i) {\r\n          return { id: i.id, name: i.name, price: i.price, qty: i.qty, rx: i.rx ? 1 : 0, rx_ref: i.rxFile || '' };\r\n        }),\r\n        subtotal: DNG.subtotal(),\r\n        shipping: DNG.SHIP,\r\n        total: DNG.total()\r\n      };\r\n\r\n      btn.disabled = true;\r\n      btn.innerHTML = 'Placing your order\u2026';\r\n\r\n      fetch(ORDER_API, {\r\n        method: 'POST',\r\n        headers: { 'Content-Type': 'application\/json' },\r\n        body: JSON.stringify(payload)\r\n      })\r\n        .then(function (r) { return r.json(); })\r\n        .then(function (d) {\r\n          if (!d || !d.ok) throw new Error(d && d.error ? d.error : 'Order failed');\r\n\r\n          if (method === 'paystack' && d.authorization_url) {\r\n            window.location.href = d.authorization_url;\r\n            return;\r\n          }\r\n          if (method === 'whatsapp') {\r\n            DNG.clear();\r\n            window.open(waLink(payload, d.reference), '_blank');\r\n            window.location.href = 'https:\/\/shop.dngpharmacyandmart.com\/order-success\/?ref=' + encodeURIComponent(d.reference);\r\n            return;\r\n          }\r\n          DNG.clear();\r\n          window.location.href = 'https:\/\/shop.dngpharmacyandmart.com\/order-success\/?ref=' + encodeURIComponent(d.reference);\r\n        })\r\n        .catch(function (e) {\r\n          \/* Backend not reachable \u2014 fall back to WhatsApp so no sale is lost *\/\r\n          btn.disabled = false;\r\n          if (method === 'whatsapp') {\r\n            window.open(waLink(payload, 'PENDING'), '_blank');\r\n            btn.innerHTML = 'Sent to WhatsApp';\r\n            return;\r\n          }\r\n          err('We could not reach the payment server. Send the order on WhatsApp instead and we will take it from there.');\r\n          btn.innerHTML = 'Send order to WhatsApp';\r\n          method = 'whatsapp';\r\n          root.querySelectorAll('.pay').forEach(function (x) { x.classList.remove('on'); });\r\n          root.querySelector('[data-pay=\"whatsapp\"]').classList.add('on');\r\n        });\r\n    });\r\n\r\n    function waLink(p, ref) {\r\n      var lines = p.items.map(function (i) {\r\n        return '\u2022 ' + i.name + ' \u00d7' + i.qty + ' \u2014 ' + DNG.money(i.price * i.qty) + (i.rx ? ' (Rx attached)' : '');\r\n      }).join('\\n');\r\n      var msg =\r\n        '*New order from the website*\\n' +\r\n        (ref && ref !== 'PENDING' ? 'Ref: ' + ref + '\\n' : '') + '\\n' +\r\n        '*Items*\\n' + lines + '\\n\\n' +\r\n        'Subtotal: ' + DNG.money(p.subtotal) + '\\n' +\r\n        'Delivery: ' + DNG.money(p.shipping) + '\\n' +\r\n        '*Total: ' + DNG.money(p.total) + '*\\n\\n' +\r\n        '*Deliver to*\\n' + p.customer.name + '\\n' + p.customer.phone + '\\n' +\r\n        p.customer.address + ', ' + p.customer.city + ', ' + p.customer.state +\r\n        (p.customer.note ? '\\nNote: ' + p.customer.note : '');\r\n      return 'https:\/\/wa.me\/2347040231289?text=' + encodeURIComponent(msg);\r\n    }\r\n  }\r\n\r\n  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', boot);\r\n  else boot();\r\n})();\r\n\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>HomeShopAboutContact 0 HomeShopAboutContact Checkout No account needed. Two minutes and it&#8217;s on its way. 1Your details 2Delivery 3Payment Your cart is empty Add a few things and come back \u2014 we&#8217;ll keep them here. Browse the shop 1 Who&#8217;s this for? So we can confirm the order and reach you about delivery. Full name Enter&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_kad_post_transparent":"disable","_kad_post_title":"hide","_kad_post_layout":"fullwidth","_kad_post_sidebar_id":"","_kad_post_content_style":"unboxed","_kad_post_vertical_padding":"hide","_kad_post_feature":"hide","_kad_post_feature_position":"","_kad_post_header":true,"_kad_post_footer":true,"_kad_post_classname":"","footnotes":""},"class_list":["post-16","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/shop.dngpharmacyandmart.com\/index.php?rest_route=\/wp\/v2\/pages\/16","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/shop.dngpharmacyandmart.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/shop.dngpharmacyandmart.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/shop.dngpharmacyandmart.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/shop.dngpharmacyandmart.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=16"}],"version-history":[{"count":7,"href":"https:\/\/shop.dngpharmacyandmart.com\/index.php?rest_route=\/wp\/v2\/pages\/16\/revisions"}],"predecessor-version":[{"id":41,"href":"https:\/\/shop.dngpharmacyandmart.com\/index.php?rest_route=\/wp\/v2\/pages\/16\/revisions\/41"}],"wp:attachment":[{"href":"https:\/\/shop.dngpharmacyandmart.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=16"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}