{"id":293,"date":"2026-09-17T16:33:43","date_gmt":"2026-09-17T16:33:43","guid":{"rendered":"https:\/\/staging.seeksocialdevelopent.online\/?page_id=293"},"modified":"2026-09-18T12:55:46","modified_gmt":"2026-09-18T12:55:46","slug":"shopping-cart-copy-copy","status":"publish","type":"page","link":"https:\/\/staging.seeksocialdevelopent.online\/?page_id=293","title":{"rendered":"Checkout-Payment -FTD"},"content":{"rendered":"\n\n\t<p><strong>Cart<\/strong><\/p>\n\t<p><strong>&gt;<\/strong><\/p>\n\t<p><strong>Shipping<\/strong><\/p>\n\t<p><strong>&gt;<\/strong><\/p>\n\t<p><strong>Payment<\/strong><\/p>\n<h2>\n\t\t\tPayment Details\t<\/h2>\n<h2>\n\t\t\tSelect Payment Method\t<\/h2>\n<figure itemscope itemtype=\"https:\/\/schema.org\/ImageObject\">\n\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/staging.seeksocialdevelopent.online\/wp-content\/uploads\/2026\/09\/Credit-card.png\" alt=\"Credit card\" height=\"20\" width=\"20\" title=\"Credit card\" onerror=\"this.style.display='none'\" loading=\"lazy\" \/>\n\t<\/figure>\n\t<p>Card Number<\/p>\n<figure itemscope itemtype=\"https:\/\/schema.org\/ImageObject\">\n\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/staging.seeksocialdevelopent.online\/wp-content\/uploads\/2026\/09\/PayPal-1.png\" alt=\"PayPal\" height=\"24\" width=\"25\" title=\"PayPal\" onerror=\"this.style.display='none'\" loading=\"lazy\" \/>\n\t<\/figure>\n\t<p>PayPal<\/p>\n<figure itemscope itemtype=\"https:\/\/schema.org\/ImageObject\">\n\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/staging.seeksocialdevelopent.online\/wp-content\/uploads\/2026\/09\/Apple-Pay-1.png\" alt=\"Apple Pay\" height=\"24\" width=\"57\" title=\"Apple Pay\" onerror=\"this.style.display='none'\" loading=\"lazy\" \/>\n\t<\/figure>\n\t<p>Apple Pay<\/p>\n\t<style>\n\/* CARD NUMBER - COMPLETE BLOCK *\/\n.payment-card-number {\n    width: 100%;\n    min-width: 0;\n    box-sizing: border-box;\n    font-family: Inter, sans-serif;\n}\n\/* Card Number label *\/\n.payment-card-number label {\n    display: block;\n    margin: 0 0 4px 0;\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 28px;\n    letter-spacing: 0;\n    color: #2E2B29;\n}\n\/* Input container *\/\n.payment-card-input {\n    position: relative;\n    width: 100%;\n    box-sizing: border-box;\n}\n\/* Input *\/\n.payment-card-input input {\n    display: block;\n    width: 100%;\n    max-width: 100%;\n    min-width: 0;\n    height: 40px;\n    padding: 0 14px 0 42px;\n    box-sizing: border-box;\n    background-color: #FFFCF7;\n    border: 1px solid #CFC7BC;\n    border-radius: 6px;\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 28px;\n    letter-spacing: 0;\n    color: #2E2B29;\n    outline: none;\n}\n\/* Credit-card icon *\/\n.payment-card-icon {\n    position: absolute;\n    left: 14px;\n    top: 50%;\n    transform: translateY(-50%);\n    width: 18px;\n    height: 18px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    pointer-events: none;\n}\n.payment-card-icon svg {\n    display: block;\n    width: 18px;\n    height: 18px;\n    fill: none;\n    stroke: #CFC7BC;\n    stroke-width: 1.5;\n}\n\/* Placeholder *\/\n.payment-card-input input::placeholder {\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    color: #CFC7BC;\n    opacity: 1;\n}\n\/* Focus *\/\n.payment-card-input input:focus {\n    border-color: #A89378;\n}\n\/* Responsive *\/\n@media (max-width: 900px) {\n    .payment-card-number {\n        width: 100%;\n    }\n}\n@media (max-width: 600px) {\n    .payment-card-number {\n        width: 100%;\n    }\n    .payment-card-input input {\n        width: 100%;\n        height: 44px;\n    }\n}\n<\/style>\n    <label for=\"checkout-card-number\">\n        Card Number\n    <\/label>\n        <input id=\"checkout-card-number\"\n            type=\"text\"\n            name=\"card-number\"\n            placeholder=\"0000 0000 0000 0000\"\n            inputmode=\"numeric\"\n            autocomplete=\"cc-number\"\/>\n\t<style>\n\/* EXPIRATION DATE - COMPLETE BLOCK *\/\n.checkout-expiration-field {\n    width: 100%;\n    min-width: 0;\n    box-sizing: border-box;\n    font-family: Inter, sans-serif;\n}\n\/* Label *\/\n.checkout-expiration-field label {\n    display: block;\n    margin: 0 0 4px 0;\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 28px;\n    letter-spacing: 0;\n    color: #2E2B29;\n}\n\/* Input *\/\n.checkout-expiration-field input {\n    display: block;\n    width: 100%;\n    max-width: 100%;\n    min-width: 0;\n    height: 40px;\n    padding: 0 14px;\n    box-sizing: border-box;\n    background-color: #FFFCF7;\n    border: 1px solid #CFC7BC;\n    border-radius: 6px;\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 28px;\n    letter-spacing: 0;\n    color: #2E2B29;\n    outline: none;\n}\n\/* Placeholder *\/\n.checkout-expiration-field input::placeholder {\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    color: #CFC7BC;\n    opacity: 1;\n}\n\/* Focus *\/\n.checkout-expiration-field input:focus {\n    border-color: #A89378;\n}\n\/* Tablet *\/\n@media (max-width: 900px) {\n    .checkout-expiration-field {\n        width: 100%;\n    }\n}\n\/* Mobile *\/\n@media (max-width: 600px) {\n    .checkout-expiration-field {\n        width: 100%;\n    }\n    .checkout-expiration-field input {\n        width: 100%;\n        height: 44px;\n    }\n}\n<\/style>\n    <label for=\"checkout-expiration\">\n        Expiration Date\n    <\/label>\n    <input id=\"checkout-expiration\"\n        type=\"text\"\n        name=\"expiration-date\"\n        placeholder=\"MM \/ YY\"\n        inputmode=\"numeric\"\n        autocomplete=\"cc-exp\"\n        maxlength=\"7\"\/>\n\t<style>\n\/* SECURITY CODE - COMPLETE BLOCK *\/\n.checkout-security-field {\n    width: 100%;\n    min-width: 0;\n    box-sizing: border-box;\n    font-family: Inter, sans-serif;\n}\n\/* Security Code label *\/\n.checkout-security-field label {\n    display: block;\n    margin: 0 0 4px 0;\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 28px;\n    letter-spacing: 0;\n    color: #2E2B29;\n}\n\/* CVV input *\/\n.checkout-security-field input {\n    display: block;\n    width: 100%;\n    max-width: 100%;\n    min-width: 0;\n    height: 40px;\n    padding: 0 14px;\n    box-sizing: border-box;\n    background-color: #FFFCF7;\n    border: 1px solid #CFC7BC;\n    border-radius: 6px;\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 28px;\n    letter-spacing: 0;\n    color: #2E2B29;\n    outline: none;\n}\n\/* CVV placeholder *\/\n.checkout-security-field input::placeholder {\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    color: #CFC7BC;\n    opacity: 1;\n}\n\/* Focus *\/\n.checkout-security-field input:focus {\n    border-color: #A89378;\n}\n\/* Tablet *\/\n@media (max-width: 900px) {\n    .checkout-security-field {\n        width: 100%;\n    }\n}\n\/* Mobile *\/\n@media (max-width: 600px) {\n    .checkout-security-field {\n        width: 100%;\n    }\n    .checkout-security-field input {\n        height: 44px;\n    }\n}\n<\/style>\n    <label for=\"checkout-security-code\">\n        Security Code\n    <\/label>\n    <input id=\"checkout-security-code\"\n        type=\"text\"\n        name=\"security-code\"\n        placeholder=\"CVV\"\n        inputmode=\"numeric\"\n        autocomplete=\"cc-csc\"\n        maxlength=\"4\"\/>\n\t<style>\n\/* CARDHOLDER NAME - COMPLETE BLOCK *\/\n.checkout-cardholder-field {\n    width: 100%;\n    min-width: 0;\n    box-sizing: border-box;\n    font-family: Inter, sans-serif;\n}\n\/* Label *\/\n.checkout-cardholder-field label {\n    display: block;\n    margin: 0 0 4px 0;\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 28px;\n    letter-spacing: 0;\n    color: #2E2B29;\n}\n\/* Input *\/\n.checkout-cardholder-field input {\n    display: block;\n    width: 100%;\n    max-width: 100%;\n    min-width: 0;\n    height: 40px;\n    padding: 0 14px;\n    box-sizing: border-box;\n    background-color: #FFFCF7;\n    border: 1px solid #CFC7BC;\n    border-radius: 6px;\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 28px;\n    letter-spacing: 0;\n    color: #2E2B29;\n    outline: none;\n}\n\/* Placeholder *\/\n.checkout-cardholder-field input::placeholder {\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    color: #CFC7BC;\n    opacity: 1;\n}\n\/* Focus *\/\n.checkout-cardholder-field input:focus {\n    border-color: #A89378;\n}\n\/* Tablet *\/\n@media (max-width: 900px) {\n    .checkout-cardholder-field {\n        width: 100%;\n    }\n}\n\/* Mobile *\/\n@media (max-width: 600px) {\n    .checkout-cardholder-field {\n        width: 100%;\n    }\n    .checkout-cardholder-field input {\n        height: 44px;\n    }\n}\n<\/style>\n    <label for=\"checkout-cardholder-name\">\n        Cardholder Name\n    <\/label>\n    <input id=\"checkout-cardholder-name\"\n        type=\"text\"\n        name=\"cardholder-name\"\n        placeholder=\"Name as displayed on card\"\n        autocomplete=\"cc-name\"\n        required\/>\n<h2>\n\t\t\tBilling Address\t<\/h2>\n\t<style>\n\/* SAME AS SHIPPING ADDRESS *\/\n.billing-same-address {\n    width: 100%;\n    min-width: 0;\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    min-height: 48px;\n    padding: 8px 14px;\n    background: #FFFCF7;\n    border: 1px solid #CFC7BC;\n    border-radius: 6px;\n    font-family: Inter, sans-serif;\n}\n\/* Clickable label *\/\n.billing-same-address label {\n    width: 100%;\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    margin: 0;\n    padding: 0;\n    cursor: pointer;\n    font-family: Inter, sans-serif;\n    font-size: 13px;\n    font-weight: 500;\n    line-height: 28px;\n    letter-spacing: 0;\n    color: #2E2B29;\n}\n\/* Hide browser's default checkbox *\/\n.billing-same-address input[type=\"checkbox\"] {\n    position: absolute;\n    opacity: 0;\n    pointer-events: none;\n}\n\/* Custom checkbox *\/\n.billing-checkmark {\n    width: 24px;\n    height: 24px;\n    flex: 0 0 24px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n    background: #FFFFFF;\n    border: 1px solid #CFC7BC;\n    border-radius: 2px;\n}\n\/* Checked background *\/\n.billing-same-address input[type=\"checkbox\"]:checked\n+ .billing-checkmark {\n    background: #8FA182;\n    border-color: #8FA182;\n}\n\/* Check symbol *\/\n.billing-checkmark::after {\n    content: \"\";\n    width: 5px;\n    height: 10px;\n    border: solid #FFFFFF;\n    border-width: 0 2px 2px 0;\n    transform: rotate(45deg);\n    margin-top: -2px;\n    display: none;\n}\n\/* Show check when selected *\/\n.billing-same-address input[type=\"checkbox\"]:checked\n+ .billing-checkmark::after {\n    display: block;\n}\n\/* Keyboard focus *\/\n.billing-same-address input[type=\"checkbox\"]:focus-visible\n+ .billing-checkmark {\n    outline: 2px solid #A89378;\n    outline-offset: 2px;\n}\n\/* Responsive *\/\n@media (max-width: 600px) {\n    .billing-same-address {\n        width: 100%;\n        padding: 8px 12px;\n    }\n    .billing-same-address label {\n        font-size: 13px;\n    }\n}\n<\/style>\n    <label for=\"same-shipping-address\">\n        <input type=\"checkbox\"\n            id=\"same-shipping-address\"\n            name=\"same-shipping-address\"\n            value=\"1\"\n            checked\/>\n        Same as shipping address\n    <\/label>\n<a target=\"_self\">Return to Shipping<\/a>\n<h2>\n\t\t\tOrder Summary\t<\/h2>\n<figure itemscope itemtype=\"https:\/\/schema.org\/ImageObject\">\n\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/staging.seeksocialdevelopent.online\/wp-content\/plugins\/bb-plugin\/img\/pixel.png\" alt=\"\" onerror=\"this.style.display='none'\" loading=\"lazy\" \/>\n\t<\/figure>\n\t<p>PRODUCT 1<\/p>\n\t<p><strong><em>ITEM 1, ITEM 2, ITEM 3, ITEM 4, and ITEM 5<\/em><\/strong><\/p>\n\t<p>$0.00<\/p>\n<figure itemscope itemtype=\"https:\/\/schema.org\/ImageObject\">\n\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/staging.seeksocialdevelopent.online\/wp-content\/plugins\/bb-plugin\/img\/pixel.png\" alt=\"\" onerror=\"this.style.display='none'\" loading=\"lazy\" \/>\n\t<\/figure>\n\t<p>PRODUCT 1<\/p>\n\t<p><strong><em>ITEM 1, ITEM 2, ITEM 3, ITEM 4, and ITEM 5<\/em><\/strong><\/p>\n\t<p>$0.00<\/p>\n<figure itemscope itemtype=\"https:\/\/schema.org\/ImageObject\">\n\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/staging.seeksocialdevelopent.online\/wp-content\/plugins\/bb-plugin\/img\/pixel.png\" alt=\"\" onerror=\"this.style.display='none'\" loading=\"lazy\" \/>\n\t<\/figure>\n\t<p>PRODUCT 1<\/p>\n\t<p><strong><em>ITEM 1, ITEM 2, ITEM 3, ITEM 4, and ITEM 5<\/em><\/strong><\/p>\n\t<p>$0.00<\/p>\n\t<p>SHIPPING METHOD<\/p>\n\t<p>Standard Delivery (1-3 Days)<\/p>\n\t<p>Ship To<\/p>\n\t<p>Lorem Ipsum<\/p>\n\t<p>Free<\/p>\n\t<p>Subtotal<\/p>\n\t<p>$0.00<\/p>\n\t<p>Shipping Estimate<\/p>\n\t<p>$0.00<\/p>\n\t<p>Tax<\/p>\n\t<p>$0.00<\/p>\n\t<p>Total<\/p>\n\t<p>$0.00<\/p>\n<a target=\"_self\">Continue to Checkout<\/a>\n","protected":false},"excerpt":{"rendered":"<p>Cart &gt; Shipping &gt; Payment Payment Details Select Payment Method Card Number PayPal Apple Pay Card Number Expiration Date Security [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"unboxed","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"disabled","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"disabled","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-293","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/staging.seeksocialdevelopent.online\/index.php?rest_route=\/wp\/v2\/pages\/293","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/staging.seeksocialdevelopent.online\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/staging.seeksocialdevelopent.online\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/staging.seeksocialdevelopent.online\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/staging.seeksocialdevelopent.online\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=293"}],"version-history":[{"count":11,"href":"https:\/\/staging.seeksocialdevelopent.online\/index.php?rest_route=\/wp\/v2\/pages\/293\/revisions"}],"predecessor-version":[{"id":326,"href":"https:\/\/staging.seeksocialdevelopent.online\/index.php?rest_route=\/wp\/v2\/pages\/293\/revisions\/326"}],"wp:attachment":[{"href":"https:\/\/staging.seeksocialdevelopent.online\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=293"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}