@use "sass:map";
@use "sass:list";
@use "./functions.scss" as *;

$resizerId: "[data-cms-tool='cms-element-resizer']";
$resizeActive: '[data-cms-element-resizer="true"]';

$primary-color: var(--_primary-400);
$secondary-color: var(--_gray-300);
$light-color: #f5f5f5;
$dark-color: #343a40;

[data-div-type="element"] {
  &[data-element-type="checkout"] {
    width: var(--_sf-el-wh-st-mx,
        calc(1% * var(--_mob-ctm-ele-nw-wh-vl,
            var(--_tab-ctm-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))));
    margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));

    &>div {
      &.wrapper {
        width: 100%;
      }
    }

    // .react-international-phone-input-container .react-international-phone-input {
    //   width: 100%;
    // }

    .checkout_optional_method {
      display: flex;
      flex-direction: column;
      gap: 12px;
      margin-top: 12px;

      &>div {
        display: flex;
        gap: 12px;
      }
    }

    // checkout styles started
    .chk_checkout_wrapper {

      // checkout login styles started
      .chk_checkout_title {
        font-family: var(--_ctm-mob-dn-ct-te-ft-fy,
            var(--_ctm-tab-dn-ct-te-ft-fy, var(--_ctm-dn-ct-te-ft-fy)));
        text-transform: var(--_ctm-mob-dn-ct-te-tt-tm,
            var(--_ctm-tab-dn-ct-te-tt-tm, var(--_ctm-dn-ct-te-tt-tm)));
        word-wrap: var(--_ctm-mob-dn-ct-te-wd-wp,
            var(--_ctm-tab-dn-ct-te-wd-wp, var(--_ctm-dn-ct-te-wd-wp)));
        word-break: var(--_ctm-mob-dn-ct-te-wd-bk,
            var(--_ctm-tab-dn-ct-te-wd-bk, var(--_ctm-dn-ct-te-wd-bk)));
        color: var(--_ctm-mob-dn-ct-te-cr, var(--_ctm-tab-dn-ct-te-cr, var(--_ctm-dn-ct-te-cr)));
        font-weight: var(--_ctm-mob-dn-ct-te-ft-wt,
            var(--_ctm-tab-dn-ct-te-ft-wt, var(--_ctm-dn-ct-te-ft-wt)));
        font-size: var(--_ctm-mob-dn-ct-te-ft-se,
            var(--_ctm-tab-dn-ct-te-ft-se, var(--_ctm-dn-ct-te-ft-se)));
        text-decoration: var(--_ctm-mob-dn-ct-te-ue,
            var(--_ctm-tab-dn-ct-te-ue, var(--_ctm-dn-ct-te-ue)));
        letter-spacing: var(--_ctm-mob-dn-ct-te-lr-sg,
            var(--_ctm-tab-dn-ct-te-lr-sg, var(--_ctm-dn-ct-te-lr-sg)));
        line-height: var(--_ctm-mob-dn-ct-te-le-ht,
            var(--_ctm-tab-dn-ct-te-le-ht, var(--_ctm-dn-ct-te-le-ht)));
        font-style: var(--_ctm-mob-dn-ct-te-ft-se-ic,
            var(--_ctm-tab-dn-ct-te-ft-se-ic, var(--_ctm-dn-ct-te-ft-se-ic)));
        text-align: var(--_ctm-mob-dn-ct-te-tt-an,
            var(--_ctm-tab-dn-ct-te-tt-an, var(--_ctm-dn-ct-te-tt-an)));
        padding: var(--_ctm-mob-dn-ct-te-pg, var(--_ctm-tab-dn-ct-te-pg, var(--_ctm-dn-ct-te-pg)));
      }

      .checkout_auth_wrapper {
        display: flex;
        justify-content: space-between;
        padding: 2rem;
        gap: 2rem;

        @media (max-width: 500px) {
          flex-direction: column;
          padding: 1rem;
        }

        .sign_in_section {
          display: flex;
          flex-direction: column;
          font-family: var(--_thm-ty-h3-ft-fy);
          text-transform: var(--_thm-ty-h3-tt-tm);
          word-wrap: var(--_thm-ty-h3-wd-wp);
          &.flex__overflow {
            white-space: normal;
            @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
          }
          gap: 12px;
          flex: 1;
          max-width: 500px;
          word-break: keep-all;

          h2 {
            margin-bottom: -6px;

            font-weight: var(--_thm-ty-h3-bd);
            font-size: var(--_thm-ty-h3-ft-se);
            line-height: var(--_thm-ty-h3-le-ht);
            color: var(--_thm-ty-h3-tt-cr);
          }

          p {
            // font-weight: 400;
            // font-size: 14px;
            // line-height: 20px;
            // color: var(--_gray-600);
            color: var(--_thm-ty-p2-tt-cr);
            font-family: var(--_thm-ty-p2-ft-fy);
            text-transform: var(--_thm-ty-p2-tt-tm);
            word-wrap: var(--_thm-ty-p2-wd-wp);
            word-break: var(--_thm-ty-p2-wd-bk);
            font-size: var(--_thm-ty-p2-ft-se);
            font-weight: var(--_thm-ty-p2-bd);
            line-height: var(--_thm-ty-p2-le-ht);
          }

          .forgot_password {
            font-size: 0.85rem;
            color: #0056d2;
            text-decoration: underline;
            margin-top: 0.5rem;
            display: inline-block;
          }

          .privacy_note {
            font-size: 0.75rem;
            margin-top: 1rem;
            color: #777;

            a {
              color: #0056d2;
              text-decoration: underline;
            }
          }

          .sign_in_form {
            .grid_container {
              form {
                margin-left: -10px;

                .react-grid-layout {
                  .react-grid-item {
                    .grid-item {
                      padding: 0px;
                      padding-bottom: 16px;
                      background-color: transparent;

                      &:has(.error_styles) {
                        padding-bottom: 0px !important;
                      }
                    }
                  }
                }
              }
            }
          }
        }

        .create_account_section {
          display: flex;
          justify-content: space-between;
          gap: 12px;
          word-break: keep-all;

          .create_form_wrapper {
            display: flex;
            flex-direction: column;
            gap: 12px;
            flex: 1;
            max-width: 500px;
            word-break: keep-all;

            h2 {
              margin-bottom: -6px;

              font-weight: 600;
              font-size: 24px;
              line-height: 32px;
              color: var(--_gray-900);
            }

            p {
              font-weight: 400;
              font-size: 14px;
              line-height: 20px;
              color: var(--_gray-600);
            }

            .create_account_text {
              font-size: 0.8rem;
              margin-top: 1rem;

              a {
                color: #0056d2;
                text-decoration: underline;
              }
            }
          }
        }

        .checkout_auth_divider {
          width: 1px;
          background-color: #ddd;
        }

        .guest_checkout_section {
          flex: 0.8;
          display: flex;
          flex-direction: column;
          // justify-content: center;
          gap: 48px;

          .guest_box,
          .create_account_box {
            h3 {
              margin-bottom: 6px;

              // font-weight: 600;
              // font-size: 24px;
              // line-height: 32px;
              // color: var(--_gray-900);
              font-weight: var(--_thm-ty-h3-bd);
              font-size: var(--_thm-ty-h3-ft-se);
              line-height: var(--_thm-ty-h3-le-ht);
              color: var(--_thm-ty-h3-tt-cr);
            }

            p {
              margin-bottom: 12px;

              // font-weight: 400;
              // font-size: 14px;
              // line-height: 20px;
              // color: var(--_gray-600);
              color: var(--_thm-ty-p2-tt-cr);
              font-family: var(--_thm-ty-p2-ft-fy);
              text-transform: var(--_thm-ty-p2-tt-tm);
              word-wrap: var(--_thm-ty-p2-wd-wp);
              word-break: var(--_thm-ty-p2-wd-bk);
              font-size: var(--_thm-ty-p2-ft-se);
              font-weight: var(--_thm-ty-p2-bd);
              line-height: var(--_thm-ty-p2-le-ht);
            }

            .btn_primary {
              padding: 8px 16px;
            }
          }
        }

        .guest_address_mode_container {
          display: flex;
          flex-direction: column;
          gap: 12px;
          max-width: 500px;
          width: 100%;

          h2 {
            margin-bottom: -6px;
            font-weight: 600;
            font-size: 24px;
            line-height: 32px;
            color: var(--_gray-900);
          }

          p {
            font-weight: 400;
            font-size: 14px;
            line-height: 20px;
            color: var(--_gray-600);
          }

          .guest_address_form_container {
            .guest_address_section {
              form {
                display: flex;
                flex-direction: column;
                gap: 16px;
              }

              .chk_shipping_address_form_group {
                display: flex;
                flex-direction: row;
                gap: 12px;

                @media (max-width: 500px) {
                  flex-direction: column;
                }
              }

              .chk_shipping_address_input_wrapper {
                display: flex;
                flex-direction: column;
                gap: 6px;
                width: 100%;
              }

              .chk_shipping_address_form_label {
                color: var(--_gray-700);
                font-weight: 500;
                font-size: 14px;
              }

              .chk_shiping_address_form_input {
                padding: 8px 12px;
                width: -webkit-fill-available;
                height: 40px;
                background-color: var(--_base-white);
                color: var(--_gray-600);
                border: 1px solid var(--_gray-300);
                border-radius: 6px;
                font-size: 14px;

                &:focus {
                  border: 1px solid var(--_primary-300);
                  outline: 2px solid var(--_primary-100);
                }

                // react-international-phone overrides
                &.react-international-phone-input-container {
                  padding: 0;
                  display: flex;
                  align-items: center;

                  .react-international-phone-country-selector-button {
                    border: none;
                    background: transparent;
                    padding: 0 8px;
                  }

                  .react-international-phone-input {
                    border: none;
                    background: transparent;
                    height: 100%;
                    width: 100%;
                    font-size: 14px;
                    outline: none;
                  }
                }
              }

              .sc-phone-container .sc-phone-input-wrapper {
                border-color: var(--_gray-300);
              }

              .sc-phone-container .sc-phone-country-btn {
                border-right-color: var(--_gray-300);
              }

              .error-msg {
                color: #ff0000;
                font-size: 12px;
              }

              .chk_address_actions {
                display: flex;
                gap: 12px;
                margin-top: 8px;
                align-items: center;

                .chk_primary_bnt {
                  display: inline-flex;
                  align-items: center;
                  gap: 8px;
                }
              }
            }
          }
        }
      }

      // accordion styles
      .chk_checkout_accordion {
        display: flex;
        padding: var(--_ctm-lt-pg);
        gap: 4px;
        flex-direction: column;
        // gap: 24px;
        // gap: var(--_ctm-lt-te-ad-it-gp);
        word-break: keep-all;
        padding-bottom: 24px;

        .chk_checkout_title {
          font-family: var(--_ctm-mob-dn-ct-te-ft-fy,
              var(--_ctm-tab-dn-ct-te-ft-fy, var(--_ctm-dn-ct-te-ft-fy)));
          text-transform: var(--_ctm-mob-dn-ct-te-tt-tm,
              var(--_ctm-tab-dn-ct-te-tt-tm, var(--_ctm-dn-ct-te-tt-tm)));
          word-wrap: var(--_ctm-mob-dn-ct-te-wd-wp,
              var(--_ctm-tab-dn-ct-te-wd-wp, var(--_ctm-dn-ct-te-wd-wp)));
          word-break: var(--_ctm-mob-dn-ct-te-wd-bk,
              var(--_ctm-tab-dn-ct-te-wd-bk, var(--_ctm-dn-ct-te-wd-bk)));
          color: var(--_ctm-mob-dn-ct-te-cr, var(--_ctm-tab-dn-ct-te-cr, var(--_ctm-dn-ct-te-cr)));
          font-weight: var(--_ctm-mob-dn-ct-te-ft-wt,
              var(--_ctm-tab-dn-ct-te-ft-wt, var(--_ctm-dn-ct-te-ft-wt)));
          font-size: var(--_ctm-mob-dn-ct-te-ft-se,
              var(--_ctm-tab-dn-ct-te-ft-se, var(--_ctm-dn-ct-te-ft-se)));
          text-decoration: var(--_ctm-mob-dn-ct-te-ue,
              var(--_ctm-tab-dn-ct-te-ue, var(--_ctm-dn-ct-te-ue)));
          letter-spacing: var(--_ctm-mob-dn-ct-te-lr-sg,
              var(--_ctm-tab-dn-ct-te-lr-sg, var(--_ctm-dn-ct-te-lr-sg)));
          line-height: var(--_ctm-mob-dn-ct-te-le-ht,
              var(--_ctm-tab-dn-ct-te-le-ht, var(--_ctm-dn-ct-te-le-ht)));
          font-style: var(--_ctm-mob-dn-ct-te-ft-se-ic,
              var(--_ctm-tab-dn-ct-te-ft-se-ic, var(--_ctm-dn-ct-te-ft-se-ic)));
          text-align: var(--_ctm-mob-dn-ct-te-tt-an,
              var(--_ctm-tab-dn-ct-te-tt-an, var(--_ctm-dn-ct-te-tt-an)));
          padding: var(--_ctm-mob-dn-ct-te-pg,
              var(--_ctm-tab-dn-ct-te-pg, var(--_ctm-dn-ct-te-pg)));
        }

        .accordion {
          border-radius: 4px;
          display: flex;
          // gap: 16px;
          // gap: var(--_ctm-lt-an-hg-ad-ve-gp);
          flex-direction: column;
          transition: max-height 800ms ease-in;

          &.open {
            transition: max-height 800ms ease-in;

            .accordion-header {
              // background-color: var(--_gray-200);
              background-color: var(--_ctm-mob-dn-an-tb-an-hr-bd-cr,
                  var(--_ctm-tab-dn-an-tb-an-hr-bd-cr, var(--_ctm-dn-an-tb-an-hr-bd-cr)));
            }

            .accordion-body {
              transition: max-height 800ms ease-in;
              max-height: 100%;
              padding: 8px 0px 36px 2px;

              .shipping-address {
                max-height: fit-content;
                transition: max-height 800ms ease-in;
              }
            }
          }

          .accordion-header {
            height: 55px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            cursor: auto;
            background-color: var(--_ctm-mob-dn-an-tb-an-hr-bd-cr,
                var(--_ctm-tab-dn-an-tb-an-hr-bd-cr, var(--_ctm-dn-an-tb-an-hr-bd-cr)));
            padding: var(--_ctm-mob-dn-an-tb-an-hr-pg,
                var(--_ctm-tab-dn-an-tb-an-hr-pg, var(--_ctm-dn-an-tb-an-hr-pg)));
            border-color: var(--_ctm-mob-dn-an-tb-an-hr-br-cr,
                var(--_ctm-tab-dn-an-tb-an-hr-br-cr, var(--_ctm-dn-an-tb-an-hr-br-cr)));
            border-radius: var(--_ctm-mob-dn-an-tb-an-hr-br-rs,
                var(--_ctm-tab-dn-an-tb-an-hr-br-rs, var(--_ctm-dn-an-tb-an-hr-br-rs)));
            border-style: var(--_ctm-mob-dn-an-tb-an-hr-br-se,
                var(--_ctm-tab-dn-an-tb-an-hr-br-se, var(--_ctm-dn-an-tb-an-hr-br-se)));
            border-width: var(--_ctm-mob-dn-an-tb-an-hr-br-wh,
                var(--_ctm-tab-dn-an-tb-an-hr-br-wh, var(--_ctm-dn-an-tb-an-hr-br-wh)));

            .accordion-title {
              white-space: nowrap;
              display: flex;
              align-items: center;
              gap: var(--_ctm-mob-dn-an-tb-an-hr-im-gp,
                  var(--_ctm-tab-dn-an-tb-an-hr-im-gp, var(--_ctm-dn-an-tb-an-hr-im-gp)));
              font-family: var(--_ctm-mob-dn-an-tb-an-hr-ft-fy,
                  var(--_ctm-tab-dn-an-tb-an-hr-ft-fy, var(--_ctm-dn-an-tb-an-hr-ft-fy)));
              text-transform: var(--_ctm-mob-dn-an-tb-an-hr-tt-tm,
                  var(--_ctm-tab-dn-an-tb-an-hr-tt-tm, var(--_ctm-dn-an-tb-an-hr-tt-tm)));
              word-wrap: var(--_ctm-mob-dn-an-tb-an-hr-wd-wp,
                  var(--_ctm-tab-dn-an-tb-an-hr-wd-wp, var(--_ctm-dn-an-tb-an-hr-wd-wp)));
              word-break: var(--_ctm-mob-dn-an-tb-an-hr-wd-bk,
                  var(--_ctm-tab-dn-an-tb-an-hr-wd-bk, var(--_ctm-dn-an-tb-an-hr-wd-bk)));
              &.flex__overflow {
                white-space: normal;
                @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
              }
              color: var(--_ctm-mob-dn-an-tb-an-hr-cr,
                  var(--_ctm-tab-dn-an-tb-an-hr-cr, var(--_ctm-dn-an-tb-an-hr-cr)));
              font-weight: var(--_ctm-mob-dn-an-tb-an-hr-ft-wt,
                  var(--_ctm-tab-dn-an-tb-an-hr-ft-wt, var(--_ctm-dn-an-tb-an-hr-ft-wt)));
              font-size: var(--_ctm-mob-dn-an-tb-an-hr-ft-se,
                  var(--_ctm-tab-dn-an-tb-an-hr-ft-se, var(--_ctm-dn-an-tb-an-hr-ft-se)));
              text-decoration: var(--_ctm-mob-dn-an-tb-an-hr-ue,
                  var(--_ctm-tab-dn-an-tb-an-hr-ue, var(--_ctm-dn-an-tb-an-hr-ue)));
              letter-spacing: var(--_ctm-mob-dn-an-tb-an-hr-lr-sg,
                  var(--_ctm-tab-dn-an-tb-an-hr-lr-sg, var(--_ctm-dn-an-tb-an-hr-lr-sg)));
              line-height: var(--_ctm-mob-dn-an-tb-an-hr-le-ht,
                  var(--_ctm-tab-dn-an-tb-an-hr-le-ht, var(--_ctm-dn-an-tb-an-hr-le-ht)));
              font-style: var(--_ctm-mob-dn-an-tb-an-hr-ft-se-ic,
                  var(--_ctm-tab-dn-an-tb-an-hr-ft-se-ic, var(--_ctm-dn-an-tb-an-hr-ft-se-ic)));
              text-align: var(--_ctm-mob-dn-an-tb-an-hr-tt-an,
                  var(--_ctm-tab-dn-an-tb-an-hr-tt-an, var(--_ctm-dn-an-tb-an-hr-tt-an)));

              span {
                display: flex;

                svg {
                  // width: var(--_ctm-dn-an-tb-an-hr-in-se);
                  width: var(--_ctm-mob-dn-an-tb-an-hr-in-se,
                      var(--_ctm-tab-dn-an-tb-an-hr-in-se, var(--_ctm-dn-an-tb-an-hr-in-se)));
                  height: var(--_ctm-mob-dn-an-tb-an-hr-in-se,
                      var(--_ctm-tab-dn-an-tb-an-hr-in-se, var(--_ctm-dn-an-tb-an-hr-in-se)));

                  path {
                    stroke: var(--_ctm-dn-an-tb-an-hr-in-c1);
                    // Overrides the stroke-width presentation attribute baked into the icon markup.
                    stroke-width: prepareMediaVariable(--_ctm-dn-an-tb-an-hr-se-wh, 1.25);
                  }
                }
              }
            }

            .edit-btn {
              // cursor: pointer;
              // color: var(--_primary-400);
              background-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-bd-cr,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-bd-cr,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-bd-cr)));
              border-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-cr,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-cr,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-cr)));
              border-radius: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-rs,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-rs,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-rs)));
              border-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-se,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-se,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-se)));
              border-width: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-wh,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-wh,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-wh)));
              // color: var(
              //   --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-cr,
              //   var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-cr, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-cr))
              // );
              color: var(--_thm-cs-tt-ls-as);
              font-family: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-fy,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-fy,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-fy)));
              text-transform: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-tm,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-tm,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-tm)));
              word-wrap: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-wp,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-wp,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-wp)));
              word-break: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-bk,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-bk,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-bk)));
              font-size: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se)));
              font-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se-ic)));
              font-weight: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-wt,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-wt,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-wt)));
              // line-height: var(
              //   --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-le-ht,
              //   var(
              //     --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-le-ht,
              //     var(--_ctm-dn-an-tb-bs-ty-py-dt-se-le-ht)
              //   )
              // );
              // letter-spacing: var(
              //   --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-lr-sg,
              //   var(
              //     --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-lr-sg,
              //     var(--_ctm-dn-an-tb-bs-ty-py-dt-se-lr-sg)
              //   )
              // );
              text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue)));
              padding: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-pg,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-pg, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-pg)));
              text-align: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-an,
                  var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-an,
                    var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-an)));

              &:hover {
                background-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-bd-cr,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-bd-cr,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-bd-cr)));
                border-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-cr,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-cr,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-cr)));
                border-radius: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-rs,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-rs,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-rs)));
                border-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-se,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-se,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-wh,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-wh,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-wh)));
                color: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-cr,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-cr, var(--_ctm-dn-an-tb-bs-ty-py-hr-se-cr)));
                font-family: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-fy,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-fy,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-fy)));
                text-transform: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-tt-tm,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-tt-tm,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-tt-tm)));
                word-wrap: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-wd-wp,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-wd-wp,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-wd-wp)));
                word-break: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-wd-bk,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-wd-bk,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-wd-bk)));
                font-size: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-se,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-se,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-se)));
                font-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-se-ic,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-se-ic,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-se-ic)));
                font-weight: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-wt,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-wt,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-wt)));
                // line-height: var(
                //   --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-le-ht,
                //   var(
                //     --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-le-ht,
                //     var(--_ctm-dn-an-tb-bs-ty-py-hr-se-le-ht)
                //   )
                // );
                // letter-spacing: var(
                //   --_ctm-mob-dn-an-tb-bs-ty-py-hr-se-lr-sg,
                //   var(
                //     --_ctm-tab-dn-an-tb-bs-ty-py-hr-se-lr-sg,
                //     var(--_ctm-dn-an-tb-bs-ty-py-hr-se-lr-sg)
                //   )
                // );
                text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ue,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ue, var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ue)));
                padding: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-pg,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-pg, var(--_ctm-dn-an-tb-bs-ty-py-hr-se-pg)));
                text-align: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-tt-an,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-tt-an,
                      var(--_ctm-dn-an-tb-bs-ty-py-hr-se-tt-an)));
              }
            }
          }

          .accordion-body {
            // margin-bottom: 16px;
            transition: max-height 800ms ease-in;

            max-height: 0px;
            overflow: hidden;
            padding: 0;

            .summary {
              .chk_shipping_method_label {
                display: flex;
                align-items: center;
                gap: 4px;
                // color: var(--_gray-500);
                color: #101828;
                font-size: 14px;
                font-weight: 600;
                line-height: 20px;
              }

              .chk_shipping_method_heading {
                // color: var(--_gray-500);
                // font-weight: 600;
                color: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-cr,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-cr,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-cr)));
                font-family: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-fy,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-fy,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-fy)));
                text-transform: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-tt-tm,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-tt-tm,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-tt-tm)));
                word-wrap: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-wd-wp,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-wd-wp,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-wd-wp)));
                word-break: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-wd-bk,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-wd-bk,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-wd-bk)));
                font-size: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se)));
                font-style: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-ic,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-ic,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-ic)));
                font-weight: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-wt,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-wt,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-wt)));
                line-height: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-le-ht,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-le-ht,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-le-ht)));
                letter-spacing: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-lr-sg,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-lr-sg,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-lr-sg)));
                text-decoration: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ue,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ue,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ue)));
                padding: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-pg,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-pg,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-pg)));
                text-align: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-tt-an,
                    var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-tt-an,
                      var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-tt-an)));
              }
            }

            .shipping-address {
              transition: max-height 800ms ease-in;
              max-height: 0;
              display: flex;
              flex-direction: column;

              .btn_link {
                color: var(--_primary-400);

                &:hover {
                  text-decoration: underline;
                }
              }

              // gap: 24px;
              background-color: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-bd-cr,
                var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-bd-cr,
                  var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-bd-cr)));
              border-color: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-br-cr,
                var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-br-cr,
                  var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-br-cr)));
              border-style: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-br-se,
                var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-br-se,
                  var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-br-se)));
              border-width: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-br-wh,
                var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-br-wh,
                  var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-br-wh)));
              border-radius: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-br-rs,
                var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-br-rs,
                  var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-br-rs)));
              padding: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-pg,
                var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-pg,
                  var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-pg)));
              gap: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-im-gp,
                var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-im-gp,
                  var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-im-gp)));

              .chk_saved_address_button {
                cursor: pointer;
                border-radius: 6px;
                // color: var(--_primary-400);
                display: flex;
                gap: 4px;

                color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-cr,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-cr, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-cr)));

                text-align: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-an,
                    var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-an,
                      var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-an)));

                &:hover {
                  text-decoration: underline;
                }
              }

              .shipping_address_container {
                display: flex;
                flex-direction: column;
                gap: 24px;
                max-width: 485px;
              }

              .shipping_address_heading_container {
                display: flex;
                justify-content: space-between;
                align-items: center;
                font-size: 18px;
                font-weight: 600;
                color: var(--_gray-900);

                .icon {
                  background-color: #f1f1f1;
                  width: 24px;
                  height: 24px;
                  display: flex;
                  justify-content: center;
                  align-items: center;
                  cursor: pointer;

                  svg {
                    width: 20px;
                    height: 20px;
                  }
                }
              }

              .select_as_default {
                background-color: #f5f8ff;
                padding: 12px 16px;
                border-radius: 6px;
                gap: 12px;
                color: var(--_gray-900);
                display: flex;
                gap: 16px;
                align-items: center;
              }

              form {
                display: flex;
                flex-direction: column;
                // gap: 0.75rem;
                // max-width: 85%;
                max-width: 480px;
                gap: 12px;
                // gap: var(
                //   --_ctm-mob-dn-an-tb-fm-wr-fm-cr-im-gp,
                //   var(--_ctm-tab-dn-an-tb-fm-wr-fm-cr-im-gp, var(--_ctm-dn-an-tb-fm-wr-fm-cr-im-gp))
                // );
                background-color: var(--_ctm-mob-dn-an-tb-fm-wr-fm-cr-bd-cr,
                    var(--_ctm-tab-dn-an-tb-fm-wr-fm-cr-bd-cr, var(--_ctm-dn-an-tb-fm-wr-fm-cr-bd-cr)));
                padding: var(--_ctm-mob-dn-an-tb-fm-wr-fm-cr-pg,
                    var(--_ctm-tab-dn-an-tb-fm-wr-fm-cr-pg, var(--_ctm-dn-an-tb-fm-wr-fm-cr-pg)));
                border-color: var(--_ctm-mob-dn-an-tb-fm-wr-fm-cr-br-cr,
                    var(--_ctm-tab-dn-an-tb-fm-wr-fm-cr-br-cr, var(--_ctm-dn-an-tb-fm-wr-fm-cr-br-cr)));
                border-radius: var(--_ctm-mob-dn-an-tb-fm-wr-fm-cr-br-rs,
                    var(--_ctm-tab-dn-an-tb-fm-wr-fm-cr-br-rs, var(--_ctm-dn-an-tb-fm-wr-fm-cr-br-rs)));
                border-style: var(--_ctm-mob-dn-an-tb-fm-wr-fm-cr-br-se,
                    var(--_ctm-tab-dn-an-tb-fm-wr-fm-cr-br-se, var(--_ctm-dn-an-tb-fm-wr-fm-cr-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-fm-wr-fm-cr-br-wh,
                    var(--_ctm-tab-dn-an-tb-fm-wr-fm-cr-br-wh, var(--_ctm-dn-an-tb-fm-wr-fm-cr-br-wh)));

                @media (max-width: 500px) {
                  max-width: 100%;
                }
              }

              .chk_shipping_address_form_group {
                display: flex;
                justify-content: space-between;
                flex-direction: row;
                gap: 12px;
              }

              .chk_shipping_address_input_container {
                display: flex;
                width: 100%;
              }

              .chk_shipping_address_input_wrapper {
                display: flex;
                flex-direction: column;
                width: 100%;
                gap: 6px;
                // margin-bottom: 6px;
              }

              .chk_shipping_address_form_label {
                color: var(--_gray-700);
                font-size: 14px;
                padding-bottom: 0px;
              }

              .chk_shiping_address_form_input {
                // padding: 8px 12px;
                width: -webkit-fill-available;
                height: 40px;
                // background-color: var(--_base-white);
                // color: var(--_gray-600);
                // border: 1px solid var(--_gray-300);
                // border-radius: 6px;
                // height: 40px;
                background-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-bd-cr,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-bd-cr, var(--_ctm-dn-an-tb-fm-wr-is-bd-cr)));
                border-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-cr,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-br-cr, var(--_ctm-dn-an-tb-fm-wr-is-br-cr)));
                border-style: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-se,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-br-se, var(--_ctm-dn-an-tb-fm-wr-is-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-wh,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-br-wh, var(--_ctm-dn-an-tb-fm-wr-is-br-wh)));
                border-radius: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-rs,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-br-rs, var(--_ctm-dn-an-tb-fm-wr-is-br-rs)));
                padding: var(--_ctm-mob-dn-an-tb-fm-wr-is-pg,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-pg, var(--_ctm-dn-an-tb-fm-wr-is-pg)));

                &::placeholder {
                  color: var(--_gray-400);
                }

                input &:focus-within {
                  border: 1px solid var(--_primary-300);
                  outline: 2px solid var(--_primary-100);
                }
              }

              .input-field {
                font-family: var(--_ctm-mob-dn-an-tb-fm-wr-is-ft-fy,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-ft-fy, var(--_ctm-dn-an-tb-fm-wr-is-ft-fy)));
                text-transform: var(--_ctm-mob-dn-an-tb-fm-wr-is-tt-tm,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-tt-tm, var(--_ctm-dn-an-tb-fm-wr-is-tt-tm)));
                word-wrap: var(--_ctm-mob-dn-an-tb-fm-wr-is-wd-wp,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-wd-wp, var(--_ctm-dn-an-tb-fm-wr-is-wd-wp)));
                word-break: var(--_ctm-mob-dn-an-tb-fm-wr-is-wd-bk,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-wd-bk, var(--_ctm-dn-an-tb-fm-wr-is-wd-bk)));

                &::placeholder {
                  color: var(--_gray-300);
                }
              }

              input[type="checkbox"] {
                width: auto;
              }

              .error-msg {
                font-size: 12px;
                color: #ff0000;
              }

              label {
                display: flex;
                align-items: center;
                gap: 0.5rem;
                font-size: 14px;
              }

              .checkbox-group {
                display: flex;
                align-items: center;
                justify-content: start;
                gap: 8px;
              }

              .chk_shipping_address_use_as_billing_address_chkbx {
                display: flex;
                align-items: center;
                gap: 0.5rem;
                color: var(--_gray-600);
                font-size: 14px;

                .custom-checkbox {
                  width: 20px;
                  height: 20px;
                  border: 1px solid #d0d5dd;
                  border-radius: 4px;
                  position: relative;
                  background-color: #fff;
                  transition: all 0.2s ease;

                  &::after {
                    content: "";
                    position: absolute;
                    display: none;
                    left: 5px;
                    top: 0.5px;
                    width: 5px;
                    height: 10px;
                    border: solid #fff;
                    border-width: 0 2px 2px 0;
                    transform: rotate(45deg);
                  }
                }
              }

              input[type="checkbox"]:checked+label {
                .custom-checkbox {
                  background-color: #004dff;
                  border-color: #004dff;

                  &::after {
                    display: block;
                  }
                }
              }
            }

            .chk_multi_address {
              display: flex;
              flex-direction: column;
              width: 100%;
              gap: 48px;
              margin-top: 12px;

              &_product_container {
                display: flex;
                flex-direction: column;
                gap: 16px;
                width: 100%;
              }

              &_product_info_container {
                display: flex;
                flex-direction: row;
                justify-content: space-between;
                align-items: flex-start;
                width: 100%;
                background-color: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wt-pt-wr-bd-cr,
                    var(--_ctm-tab-dn-an-tb-sg-ds-pt-wt-pt-wr-bd-cr,
                      var(--_ctm-dn-an-tb-sg-ds-pt-wt-pt-wr-bd-cr)));
                border-color: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wt-pt-wr-br-cr,
                    var(--_ctm-tab-dn-an-tb-sg-ds-pt-wt-pt-wr-br-cr,
                      var(--_ctm-dn-an-tb-sg-ds-pt-wt-pt-wr-br-cr)));
                border-style: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wt-pt-wr-br-se,
                    var(--_ctm-tab-dn-an-tb-sg-ds-pt-wr-br-se, var(--_ctm-dn-an-tb-sg-ds-pt-wr-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wr-br-wh,
                    var(--_ctm-tab-dn-an-tb-sg-ds-pt-wr-br-wh, var(--_ctm-dn-an-tb-sg-ds-pt-wr-br-wh)));
                border-radius: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wr-br-rs,
                    var(--_ctm-tab-dn-an-tb-sg-ds-pt-wr-br-rs, var(--_ctm-dn-an-tb-sg-ds-pt-wr-br-rs)));
                padding: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wr-pg,
                    var(--_ctm-tab-dn-an-tb-sg-ds-pt-wr-pg, var(--_ctm-dn-an-tb-sg-ds-pt-wr-pg)));
                gap: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wr-im-gp,
                    var(--_ctm-tab-dn-an-tb-sg-ds-pt-wr-im-gp, var(--_ctm-dn-an-tb-sg-ds-pt-wr-im-gp)));

                @media (max-width: 500px) {
                  flex-direction: column;
                }
              }

              &_product_left_container {
                display: flex;
                flex: 1 0 0;
                width: 100%;
                gap: 16px;
              }

              &_product_image {
                height: 130px;
                width: 130px;
                border: 1px solid var(--_gray-100);
                border-radius: 6px;
              }

              &_product_info_wrapper {
                display: flex;
                flex-direction: column;
                gap: calc(var(--_ctm-lt-me-as-pt-io-hl-gp) / 4);

                .chk_multi_address_product_name {
                  // color: var(--_gray-900);
                  // font-size: 18px;
                  // font-weight: 700;
                  // line-height: 28px;
                  font-family: var(--_ctm-mob-dn-an-tb-sg-ds-pt-ds-pt-ne-ft-fy,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-ds-pt-ne-ft-fy,
                        var(--_ctm-dn-an-tb-sg-ds-pt-ds-pt-ne-ft-fy)));
                  text-transform: var(--_ctm-mob-dn-an-tb-sg-ds-pt-ds-pt-ne-tt-tm,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-ds-pt-ne-tt-tm,
                        var(--_ctm-dn-an-tb-sg-ds-pt-ds-pt-ne-tt-tm)));
                  word-wrap: var(--_ctm-mob-dn-an-tb-sg-ds-pt-ds-pt-ne-wd-wp,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-ds-pt-ne-wd-wp,
                        var(--_ctm-dn-an-tb-sg-ds-pt-ds-pt-ne-wd-wp)));
                  word-break: var(--_ctm-mob-dn-an-tb-sg-ds-pt-ds-pt-ne-wd-bk,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-ds-pt-ne-wd-bk,
                        var(--_ctm-dn-an-tb-sg-ds-pt-ds-pt-ne-wd-bk)));
                  color: var(--_gray-900);
                  font-weight: 600;
                  font-size: 14px;
                  padding: var(--_ctm-mob-dn-an-tb-sg-ds-pt-ds-pt-ne-pg,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-ds-pt-ne-pg,
                        var(--_ctm-dn-an-tb-sg-ds-pt-ds-pt-ne-pg)));
                  margin-bottom: 4px;
                }

                .chk_multi_address_product_feautes {
                  font-size: 14px;
                  color: var(--_gray-600);
                  display: flex;
                  flex-direction: column;
                  gap: 4px;
                }

                .chk_multi_address_product_info {
                  // color: var(--_gray-600);
                  // font-size: 14px;
                  // list-style: 20px;
                  font-family: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-ft-fy,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-ft-fy,
                        var(--_ctm-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-ft-fy)));
                  text-transform: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-tt-tm,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-tt-tm,
                        var(--_ctm-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-tt-tm)));
                  word-wrap: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-wd-wp,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-wd-wp,
                        var(--_ctm-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-wd-wp)));
                  word-break: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-wd-bk,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-wd-bk,
                        var(--_ctm-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-wd-bk)));
                  color: var(--_gray-600);
                  font-weight: 400;
                  font-size: 12px;
                  padding: var(--_ctm-mob-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-pg,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-pg,
                        var(--_ctm-dn-an-tb-sg-ds-pt-wt-pt-ds-vt-ds-pg)));
                }
              }

              &_product_right_container {
                display: flex;
                flex-direction: row;
                gap: 30px;
                align-items: center;

                @media (max-width: 500px) {
                  align-self: flex-end;
                }

                .chk_multi_address_product_price {
                  // color: var(--_gray-900);
                  // font-size: 20px;
                  // font-weight: 700;

                  color: var(--_gray-900);
                  font-weight: 700;
                  font-size: 20px;
                }
              }

              &_qty_wrapper {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 4px;

                .chk_multi_address_product_info {
                  color: var(--_gray-600);
                  font-size: 14px;
                  line-height: 18px;
                }

                .chk_multi_address_product_qty {
                  // color: var(--_gray-900);
                  // font-size: 12px;
                  // font-weight: 700;
                  font-family: var(--_ctm-mob-dn-an-tb-sg-ds-pt-ds-qy-ft-fy,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-ds-qy-ft-fy,
                        var(--_ctm-dn-an-tb-sg-ds-pt-ds-qy-ft-fy)));
                  text-transform: var(--_ctm-mob-dn-an-tb-sg-ds-pt-ds-qy-tt-tm,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-ds-qy-tt-tm,
                        var(--_ctm-dn-an-tb-sg-ds-pt-ds-qy-tt-tm)));
                  word-wrap: var(--_ctm-mob-dn-an-tb-sg-ds-pt-ds-qy-wd-wp,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-ds-qy-wd-wp,
                        var(--_ctm-dn-an-tb-sg-ds-pt-ds-qy-wd-wp)));
                  word-break: var(--_ctm-mob-dn-an-tb-sg-ds-pt-ds-qy-wd-bk,
                      var(--_ctm-tab-dn-an-tb-sg-ds-pt-ds-qy-wd-bk,
                        var(--_ctm-dn-an-tb-sg-ds-pt-ds-qy-wd-bk)));
                  color: var(--_gray-900);
                  font-weight: 700;
                  font-size: 14px;
                }
              }

              &_shipping_option_container {
                display: flex;
                flex-direction: column;
                gap: 6px;

                @media (max-width: 500px) {
                  flex-direction: row;
                }
              }

              &_shiping_option_heading_wrapper {
                display: grid;
                grid-template-columns: 0.5fr 2fr 2fr 40px 40px;
                gap: 16px;
                white-space: nowrap;
                align-items: center;

                &:not(:last-child) {
                  margin-bottom: 12px;
                }

                @media (max-width: 500px) {
                  grid-template-columns: auto;
                }

                .chk_multi_address_product_label {
                  color: var(--_gray-900);
                  font-size: 14px;
                  font-weight: 700;
                }
              }

              .chk_multi_address_icon {
                svg {
                  width: var(--_ctm-dn-me-sg-as-dn-dd-in-in-se);
                  height: var(--_ctm-dn-me-sg-as-dn-dd-in-in-se);

                  path {
                    stroke: var(--_ctm-dn-me-sg-as-dn-dd-in-in-c1);
                    // Overrides the stroke-width presentation attribute baked into the icon markup.
                    stroke-width: prepareMediaVariable(--_ctm-dn-me-sg-as-dn-dd-in-se-wh, 1.25);
                  }
                }

                &:hover {
                  cursor: pointer;

                  svg {
                    path {
                      stroke: var(--_error-700);
                    }
                  }
                }
              }

              .chk_shiping_address_form_input {
                padding: 8px 12px;
                width: -webkit-fill-available;
                border: 1px solid var(--_gray-300);
                border-radius: 6px;
                height: 40px;
                background-color: var(--_base-white);

                &:focus-within {
                  border: 1px solid var(--_primary-300);
                  outline: 2px solid var(--_primary-100);
                }

                .custom-arrows {
                  position: absolute;
                  right: 6px;
                  top: 50%;
                  transform: translateY(-50%);
                  display: flex;
                  flex-direction: column;

                  .arrow {
                    all: unset;
                    cursor: pointer;
                    font-size: 10px;
                    line-height: 1;
                  }
                }

                // .input-field {
                //   padding: 8px 12px;
                //   width: -webkit-fill-available;
                //   border: 1px solid var(--_gray-300);
                //   border-radius: 6px;
                //   height: 40px;
                //   background-color: var(--_base-white);

                //   &:focus-within {
                //     border: 1px solid var(--_primary-300);
                //     outline: 2px solid var(--_primary-100);
                //   }
                // }
              }
            }

            .shipping-method {
              display: flex;
              flex-direction: column;
              gap: var(--_ctm-lt-sg-md-le-gp);
              margin-top: 12px;

              &__grid {
                display: grid;
                grid-template-columns: 1fr;
                gap: var(--_ctm-lt-sg-md-le-gp);
                padding-top: 12px;

                @media (min-width: 768px) {
                  grid-template-columns: 1fr 1fr;
                  gap: 32px;
                }
              }

              &__group {
                display: flex;
                flex-direction: column;
                // gap: 12px;
                background-color: var(--_ctm-mob-dn-an-tb-sg-md-sg-md-cr-bd-cr,
                    var(--_ctm-tab-dn-an-tb-sg-md-sg-md-cr-bd-cr,
                      var(--_ctm-dn-an-tb-sg-md-sg-md-cr-bd-cr)));
                border-color: var(--_ctm-mob-dn-an-tb-sg-md-sg-md-cr-br-cr,
                    var(--_ctm-tab-dn-an-tb-sg-md-sg-md-cr-br-cr,
                      var(--_ctm-dn-an-tb-sg-md-sg-md-cr-br-cr)));
                border-style: var(--_ctm-mob-dn-an-tb-sg-md-sg-md-cr-br-se,
                    var(--_ctm-tab-dn-an-tb-sg-md-sg-md-cr-br-se,
                      var(--_ctm-dn-an-tb-sg-md-sg-md-cr-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-sg-md-sg-md-cr-br-wh,
                    var(--_ctm-tab-dn-an-tb-sg-md-sg-md-cr-br-wh,
                      var(--_ctm-dn-an-tb-sg-md-sg-md-cr-br-wh)));
                border-radius: var(--_ctm-mob-dn-an-tb-sg-md-sg-md-cr-br-rs,
                    var(--_ctm-tab-dn-an-tb-sg-md-sg-md-cr-br-rs,
                      var(--_ctm-dn-an-tb-sg-md-sg-md-cr-br-rs)));
                padding: var(--_ctm-mob-dn-an-tb-sg-md-sg-md-cr-pg,
                    var(--_ctm-tab-dn-an-tb-sg-md-sg-md-cr-pg, var(--_ctm-dn-an-tb-sg-md-sg-md-cr-pg)));
                // gap: var(
                //   --_ctm-mob-dn-an-tb-sg-md-sg-md-cr-im-gp,
                //   var(
                //     --_ctm-tab-dn-an-tb-sg-md-sg-md-cr-im-gp,
                //     var(--_ctm-dn-an-tb-sg-md-sg-md-cr-im-gp)
                //   )
                // );
                gap: 12px;

                .chk_shipping_method_heading {
                  // color: var(--_gray-700);
                  // font-weight: 700;
                  // font-size: 16px;
                  color: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-cr,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-cr,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-cr)));
                  font-family: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-ft-fy,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-ft-fy,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-ft-fy)));
                  text-transform: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-tt-tm,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-tt-tm,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-tt-tm)));
                  word-wrap: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-wd-wp,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-wd-wp,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-wd-wp)));
                  word-break: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-wd-bk,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-wd-bk,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-wd-bk)));
                  font-size: 14px;
                  font-weight: 700;
                  // font-size: var(
                  //   --_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-ft-se,
                  //   var(
                  //     --_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-ft-se,
                  //     var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-ft-se)
                  //   )
                  // );
                  font-style: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-ft-se-ic,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-ft-se-ic,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-ft-se-ic)));
                  // font-weight: var(
                  //   --_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-ft-wt,
                  //   var(
                  //     --_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-ft-wt,
                  //     var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-ft-wt)
                  //   )
                  // );
                  line-height: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-le-ht,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-le-ht,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-le-ht)));
                  letter-spacing: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-lr-sg,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-lr-sg,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-lr-sg)));
                  text-decoration: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-ue,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-ue,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-ue)));
                  padding: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-pg,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-pg,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-pg)));
                  text-align: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-md-ll-tt-an,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-md-ll-tt-an,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-md-ll-tt-an)));
                }
              }

              &__options {
                display: flex;
                flex-direction: column;
                gap: 12px;
              }

              &__option {
                display: flex;
                align-items: center;
                cursor: pointer;
                transition: all 0.2s ease;

                .custom_radio {
                  width: 20px;
                  margin-right: 12px;
                  height: 20px;
                  border: 1px solid transparent;
                  /* blue ring */
                  border-radius: 50%;
                  display: inline-block;
                  box-sizing: border-box;
                  background-color: white;
                  transition: all 0.2s ease;

                  input[type="radio"]:checked+.radio-style {
                    background-color: var(--_thm-py-bs-dt-se-bd-cr);
                    border: 6px solid;
                  }
                }

                .chk_shipping_method_label {
                  color: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-cr,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-cr,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-cr)));
                  font-family: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-fy,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-fy,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-fy)));
                  text-transform: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-tt-tm,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-tt-tm,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-tt-tm)));
                  word-wrap: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-wd-wp,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-wd-wp,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-wd-wp)));
                  word-break: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-wd-bk,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-wd-bk,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-wd-bk)));
                  font-size: 14px;
                  // font-size: var(
                  //   --_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se,
                  //   var(
                  //     --_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se,
                  //     var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se)
                  //   )
                  // );
                  font-style: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-ic,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-ic,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-ic)));
                  font-weight: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-wt,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-wt,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-wt)));
                  line-height: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-le-ht,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-le-ht,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-le-ht)));
                  letter-spacing: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-lr-sg,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-lr-sg,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-lr-sg)));
                  text-decoration: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ue,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ue,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ue)));
                  padding: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-pg,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-pg,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-pg)));
                  text-align: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-tt-an,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-tt-an,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-tt-an)));
                }

                .chk_shipping_method_value {
                  color: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-cr-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-cr-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-cr-dc)));
                  font-family: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-fy-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-fy-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-fy-dc)));
                  text-transform: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-tt-tm-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-tt-tm-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-tt-tm-dc)));
                  word-wrap: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-wd-wp-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-wd-wp-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-wd-wp-dc)));
                  word-break: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-wd-bk-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-wd-bk-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-wd-bk-dc)));
                  // font-size: var(
                  //   --_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-dc,
                  //   var(
                  //     --_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-dc,
                  //     var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-dc)
                  //   )
                  // );
                  font-style: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-ic-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-ic-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-se-ic-dc)));
                  font-weight: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ft-wt-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ft-wt-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ft-wt-dc)));
                  line-height: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-le-ht-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-le-ht-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-le-ht-dc)));
                  letter-spacing: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-lr-sg-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-lr-sg-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-lr-sg-dc)));
                  text-decoration: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-ue-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-ue-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-ue-dc)));
                  padding: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-pg-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-pg-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-pg-dc)));
                  text-align: var(--_ctm-mob-dn-an-tb-sg-md-se-ll-se-ll-os-tt-an-dc,
                      var(--_ctm-tab-dn-an-tb-sg-md-se-ll-se-ll-os-tt-an-dc,
                        var(--_ctm-dn-an-tb-sg-md-se-ll-se-ll-os-tt-an-dc)));
                }

                // input[type="radio"] {
                //   margin-right: 12px;
                //   width: 16px;
                //   height: 16px;
                //   accent-color: #2563eb;
                //   cursor: pointer;
                //   // display: none;
                // }

                .custom_radio {
                  position: relative;

                  input[type="radio"] {
                    margin-right: 12px;
                    width: 16px;
                    height: 16px;
                    accent-color: var(--_thm-py-bs-dt-se-tt-cr);
                    cursor: pointer;
                    display: none;
                  }

                  .radio-style {
                    width: 20px;
                    height: 20px;
                    border-radius: 50%;
                    border: 1px solid #d0d5dd;
                    background: white;
                    display: inline-block;
                    box-sizing: border-box;
                    transition: all 0.2s;
                  }

                  input[type="radio"]:checked+.radio-style {
                    background-color: var(--_base-white);
                    border: 5px solid var(--_thm-py-bs-dt-se-br-cr);
                  }
                }

                &.selected {
                  background-color: var(--_base-white);
                  border-color: var(--_thm-py-bs-dt-se-br-cr);
                }
              }

              // order level shipping
              .order_level_shipping {
                display: flex;
                gap: 24px;

                .order_level_shipping_img {
                  width: 120px;
                  height: 120px;
                  background-color: var(--_gray-100);
                  border-radius: 6px;
                }
              }
            }

            // .sg__md__sn {
            //   display: flex;
            //   flex-wrap: wrap;
            //   gap: 48px;
            //   margin-top: 12px;
            //   .sg_md_gp {
            //     display: flex;
            //     flex-direction: column;
            //     gap: 12px;
            //     .sg_md_gp_lt {
            //       display: flex;
            //       flex-direction: column;
            //       gap: 6px;
            //       & > div {
            //         display: flex;
            //         align-items: center;
            //         gap: 6px;
            //       }
            //     }
            //   }
            // }

            .chk_payment-options {
              form {
                display: flex;
                flex-direction: column;
                gap: 24px;

                @media (max-width: 650px) {
                  width: 100%;
                }
              }

              display: flex;
              flex-direction: column;
              margin-top: 12px;
              gap: var(--_ctm-mob-dn-an-tb-pt-md-pt-md-wr-im-gp,
                var(--_ctm-tab-dn-an-tb-pt-md-pt-md-wr-im-gp,
                  var(--_ctm-dn-an-tb-pt-md-pt-md-wr-im-gp)));

              .chk_payment_options_form {
                display: flex;
                flex-direction: column;
                overflow: hidden;
                gap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp)));
              }

              .payment_program {
                // padding: 0 12px;

                display: flex;
                flex-direction: column;
                background-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-md-wr-bd-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-md-wr-bd-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-md-wr-bd-cr)));
                border-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-md-wr-br-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-md-wr-br-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-md-wr-br-cr)));
                border-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-md-wr-br-se,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-md-wr-br-se,
                      var(--_ctm-dn-an-tb-pt-md-pt-md-wr-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-pt-md-pt-md-wr-br-wh,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-md-wr-br-wh,
                      var(--_ctm-dn-an-tb-pt-md-pt-md-wr-br-wh)));
                border-radius: var(--_ctm-mob-dn-an-tb-pt-md-pt-md-wr-br-rs,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-md-wr-br-rs,
                      var(--_ctm-dn-an-tb-pt-md-pt-md-wr-br-rs)));
                padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-md-wr-pg,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-md-wr-pg, var(--_ctm-dn-an-tb-pt-md-pt-md-wr-pg)));
                gap: var(--_ctm-mob-dn-an-tb-pt-md-pt-md-wr-im-gp,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-md-wr-im-gp,
                      var(--_ctm-dn-an-tb-pt-md-pt-md-wr-im-gp)));

                .payment_program_header {
                  display: flex;
                  justify-content: space-between;
                  // gap: 8px;
                  align-items: center;

                  // margin-bottom: 16px;

                  &_label {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;

                    &_title {
                      font-size: 14px;
                      font-weight: 600;
                      color: var(--_gray-600);
                    }
                  }

                  &_pds {
                    font-size: 14px;
                    font-weight: 600;

                    &_label {
                      font-size: 14px;
                      // color: var(--_gray-600);
                      color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-cr,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-cr,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-cr)));
                    }

                    &_value {
                      // font-size: 14px;
                      // color: var(--_gray-900);
                      color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-cr-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-cr-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-cr-dc)));
                      font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-fy-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-fy-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-fy-dc)));
                      text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-tt-tm-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-tt-tm-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-tt-tm-dc)));
                      word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-wd-wp-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-wd-wp-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-wd-wp-dc)));
                      word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-wd-bk-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-wd-bk-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-wd-bk-dc)));
                      font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-dc)));
                      font-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-ic-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-ic-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-ic-dc)));
                      font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-wt-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-wt-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-wt-dc)));
                      line-height: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-le-ht-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-le-ht-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-le-ht-dc)));
                      letter-spacing: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-lr-sg-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-lr-sg-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-lr-sg-dc)));
                      text-decoration: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ue-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ue-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ue-dc)));
                      padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-pg-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-pg-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-pg-dc)));
                      text-align: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-tt-an-dc,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-tt-an-dc,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-tt-an-dc)));
                    }
                  }
                }

                // .pmnt__md__sn {
                //   border: 1px solid var(--_gray-200);
                //   border-radius: 6px;
                //   .pmnt__md__sn__hr {
                //     display: flex;
                //     align-items: center;
                //     justify-content: space-between;
                //     padding: 8px 16px 0px 16px;
                //     border-bottom: 1px solid var(--_gray-200);
                //   }
                //   .pmnt__md__sn__body {
                //     display: flex;
                //     justify-content: space-between;
                //     padding: 8px 16px 16px 16px;

                //     & > div {
                //       display: flex;
                //       justify-content: space-between;
                //       align-items: center;
                //       gap: 12px;
                //       & > div {
                //         display: flex;
                //         gap: 12px;
                //         width: 100%;
                //       }
                //     }
                //   }
                // }
              }

              .gift_crd_chk_payment_option {
                border: 1px solid var(--_gray-300);
                border-radius: 6px;

                .add_gift_card {
                  display: flex;
                  gap: 12px;
                  padding: 16px;

                  .gc_icon {
                    svg {
                      width: 18px;
                      height: 14px;
                    }
                  }

                  .gc_info {
                    display: flex;
                    flex-direction: column;
                    gap: 6px;

                    .gc_title {
                      font-size: 14px;
                      font-weight: 600;
                    }
                  }
                }

                .payment_heading {
                  padding: 16px;

                  .chk_payment_options_heading {
                    padding: 0;
                    font-weight: 600;
                  }
                }
              }

              .chk_payment_option_wrapper {
                display: flex;
                flex-direction: column;
                // border: 1px solid var(--_gray-300);
                // margin-bottom: 12px;
                // border-radius: 4px;
                overflow: hidden;
                background-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-bd-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-bd-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-bd-cr)));
                border-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr)));
                border-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh)));
                border-radius: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs)));
                padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-pg,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-pg,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-pg)));
                // gap: var(
                //   --_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp,
                //   var(
                //     --_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp,
                //     var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp)
                //   )
                // );

                .pp_pmnt_method_groups {
                  &:not(:last-child) {
                    border-bottom: 1px solid var(--_gray-200);
                    padding-bottom: 16px;
                  }

                  .pp_ppm_section {
                    // background: #f5f5f5;
                    // padding: 12px 16px;
                    // font-size: 12px;
                    border-top: 1px solid var(--_gray-200);
                    background-color: var(--_gray-50);
                    background-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr)));
                    border-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr)));
                    border-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-se,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-se,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-se)));
                    border-width: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh)));
                    border-radius: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs)));
                    padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-pg,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-pg,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-pg)));

                    display: flex;
                    justify-content: space-between;
                    gap: 8px;

                    .pp_ppm_section_label {
                      font-size: 14px;
                      // font-weight: 700;
                      // color: var(--_gray-900);
                      color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-cr,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-cr,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-cr)));
                      font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-fy,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-fy,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-fy)));
                      text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-tt-tm,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-tt-tm,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-tt-tm)));
                      word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-wd-wp,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-wd-wp,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-wd-wp)));
                      word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-wd-bk,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-wd-bk,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-wd-bk)));
                      // font-size: var(
                      //   --_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-se,
                      //   var(
                      //     --_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-se,
                      //     var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-se)
                      //   )
                      // );
                      font-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-se-ic,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-se-ic,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-se-ic)));
                      font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-wt,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-wt,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-wt)));
                      line-height: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-le-ht,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-le-ht,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-le-ht)));
                      letter-spacing: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-lr-sg,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-lr-sg,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-lr-sg)));
                      -webkit-text-decoration: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ue,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ue,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ue)));
                      text-decoration: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ue,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ue,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ue)));
                      padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-pg,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-pg,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-pg)));
                      text-align: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-tt-an,
                          var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-tt-an,
                            var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-tt-an)));
                    }

                    .pp_ppm_section_value {
                      font-size: 14px;
                      font-weight: 600;
                      color: var(--_gray-600);

                      .pp_ppm_section_value_label {
                        // font-weight: 500;
                        // color: var(--_gray-500);
                        color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-cr,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-cr,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-cr)));
                      }

                      .pp_ppm_section_value_amount {
                        // font-weight: 500;
                        // color: var(--_gray-500);
                        color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-cr-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-cr-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-cr-dc)));
                      }
                    }
                  }

                  .payment_methods {
                    // padding: 12px;
                    display: grid;
                    gap: 8px;

                    .chk_payment_option {
                      .add_new_credit_card {
                        padding: 16px 16px 0px 16px;
                        display: flex;
                        justify-content: space-between;
                        font-weight: 600;

                        .cc_tertiary_btn {
                          // color: var(--_primary-400);
                          color: var(--_thm-cs-tt-ls-as);
                          font-size: 14px;

                          &:hover {
                            text-decoration: underline;
                          }
                        }
                      }

                      .chk_payment_section_wrapper {
                        width: 100%;
                        display: flex;
                        justify-content: space-between;
                        // padding: 16px;
                        background-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-bd-cr,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-bd-cr,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-bd-cr)));
                        border-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-cr,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-cr,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-cr)));
                        border-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-se,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-se,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-se)));
                        border-width: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-wh,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-wh,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-wh)));
                        border-radius: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-rs,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-rs,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-rs)));
                        padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-pg,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-pg,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-pg)));
                        gap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-im-gp,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-im-gp,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-im-gp)));

                        .chk_payment_section {
                          display: flex;
                          justify-content: space-between;
                          width: 100%;

                          @media (max-width: 650px) {
                            flex-wrap: wrap;
                            gap: 20px;
                          }

                          .chk_payment_section_col_left {
                            display: flex;
                            gap: 12px;
                            width: 70%;

                            @media (max-width: 650px) {
                              &>div {
                                width: 100%;
                              }
                            }

                            svg {
                              width: 24px;
                              height: 24px;
                            }

                            .chk_payment_section_method {
                              display: flex;
                              flex-direction: column;

                              .chk_payment_section_method_details {
                                display: flex;
                                flex-direction: column;
                                gap: 6px;
                                margin-bottom: 8px;

                                // align-items: center;
                                // gap: 12px;
                                .chk_payment_section_method_name {
                                  font-size: 14px;
                                  // font-weight: 700;
                                  line-height: 20px;
                                  // color: var(--_gray-700);
                                  white-space: nowrap;
                                  font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy)));
                                  text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm)));
                                  word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp)));
                                  word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk)));
                                  color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr)));
                                  font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt)));
                                  // font-size: var(
                                  //   --_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se,
                                  //   var(
                                  //     --_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se,
                                  //     var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se)
                                  //   )
                                  // );
                                  padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg)));
                                }

                                .po-container {
                                  // padding: 24px;
                                  max-width: 800px;

                                  .error_msg {
                                    margin-top: 4px;
                                  }

                                  input[type="text"] {
                                    width: -webkit-fill-available;
                                    height: 40px;
                                    background-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-bd-cr, var(--_ctm-tab-dn-an-tb-fm-wr-is-bd-cr, var(--_ctm-dn-an-tb-fm-wr-is-bd-cr)));
                                    border-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-cr, var(--_ctm-tab-dn-an-tb-fm-wr-is-br-cr, var(--_ctm-dn-an-tb-fm-wr-is-br-cr)));
                                    border-style: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-se, var(--_ctm-tab-dn-an-tb-fm-wr-is-br-se, var(--_ctm-dn-an-tb-fm-wr-is-br-se)));
                                    border-width: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-wh, var(--_ctm-tab-dn-an-tb-fm-wr-is-br-wh, var(--_ctm-dn-an-tb-fm-wr-is-br-wh)));
                                    border-radius: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-rs, var(--_ctm-tab-dn-an-tb-fm-wr-is-br-rs, var(--_ctm-dn-an-tb-fm-wr-is-br-rs)));
                                    padding: var(--_ctm-mob-dn-an-tb-fm-wr-is-pg, var(--_ctm-tab-dn-an-tb-fm-wr-is-pg, var(--_ctm-dn-an-tb-fm-wr-is-pg)));
                                  }

                                  .po-grid {
                                    width: 320px;
                                    display: grid;
                                    grid-template-columns: repeat(3, 1fr);
                                    // gap: 16px;
                                    // & > div {

                                    // }

                                    .po-input {
                                      // height: 44px;
                                      border: 1px solid var(--_gray-200);
                                      border-radius: 4px;
                                      background-color: var(--_base-white);
                                      display: flex;
                                      // width: 120px;
                                      overflow: hidden;
                                      align-items: center;
                                      padding-inline: 12px;
                                      gap: 12px;

                                      border-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-cr,
                                          var(--_ctm-tab-dn-an-tb-fm-wr-is-br-cr,
                                            var(--_ctm-dn-an-tb-fm-wr-is-br-cr)));
                                      border-style: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-se,
                                          var(--_ctm-tab-dn-an-tb-fm-wr-is-br-se,
                                            var(--_ctm-dn-an-tb-fm-wr-is-br-se)));
                                      border-width: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-wh,
                                          var(--_ctm-tab-dn-an-tb-fm-wr-is-br-wh,
                                            var(--_ctm-dn-an-tb-fm-wr-is-br-wh)));
                                      border-radius: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-rs,
                                          var(--_ctm-tab-dn-an-tb-fm-wr-is-br-rs,
                                            var(--_ctm-dn-an-tb-fm-wr-is-br-rs)));
                                      padding: var(--_ctm-mob-dn-an-tb-fm-wr-is-pg,
                                          var(--_ctm-tab-dn-an-tb-fm-wr-is-pg,
                                            var(--_ctm-dn-an-tb-fm-wr-is-pg)));

                                      &:disabled {
                                        color: #aaa;
                                        background-color: #f9f9f9;
                                        border-color: #ddd;
                                        cursor: not-allowed;
                                        overflow: hidden;
                                      }

                                      position: relative;

                                      &:first-child {
                                        &:focus-within {
                                          z-index: 2;
                                        }
                                      }

                                      &:nth-child(2) {
                                        &:focus-within {
                                          z-index: 2;
                                        }
                                      }

                                      &:nth-child(3) {
                                        &:focus-within {
                                          z-index: 2;
                                        }
                                      }

                                      &:focus-within {
                                        border: 1px solid var(--_primary-200);
                                        outline: 2px solid var(--_primary-50);
                                      }
                                    }

                                    .p1-input {
                                      border-top-right-radius: 0;
                                      border-bottom-right-radius: 0;
                                    }

                                    .p2-input {
                                      border-radius: 0;
                                      border-left: none;
                                      border-right: none;
                                    }

                                    .p3-input {
                                      border-top-left-radius: 0;
                                      border-bottom-left-radius: 0;
                                    }
                                  }
                                }
                              }

                              &>div {
                                display: flex;
                                gap: 2px;

                                .label {
                                  font-size: 12px;
                                  // color: var(--_gray-500);
                                  font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy)));
                                  text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm)));
                                  word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp)));
                                  word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk)));
                                  color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr)));
                                  font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt)));
                                  // font-size: var(
                                  //   --_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se,
                                  //   var(
                                  //     --_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se,
                                  //     var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se)
                                  //   )
                                  // );
                                  padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg)));
                                }

                                .price {
                                  font-size: 12px;
                                  // color: var(--_gray-900);
                                  font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc)));
                                  text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc)));
                                  word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc)));
                                  word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc)));
                                  color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc)));
                                  font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc)));
                                  // font-size: var(
                                  //   --_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc,
                                  //   var(
                                  //     --_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc,
                                  //     var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc)
                                  //   )
                                  // );
                                  padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc)));
                                }
                              }
                            }
                          }

                          &_col_right {
                            @media (max-width: 650px) {
                              width: 100% !important;
                              align-items: start !important;
                              margin-left: 35px;
                            }

                            width: 30%;
                            display: flex;
                            flex-direction: column;
                            align-items: flex-end;
                            gap: 5px;

                            .cur_conversion {
                              font-size: 12px;
                              font-weight: 600;
                            }
                          }
                        }

                        .chk_payment_options_heading {
                          color: var(--_gray-900);
                          font-size: 16px;
                          font-weight: 700;

                          .chk_primary_btn_link {
                            background-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-bd-cr,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-bd-cr,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-bd-cr)));
                            border-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-cr,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-cr,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-cr)));
                            border-radius: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-rs,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-rs,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-rs)));
                            border-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-se,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-se,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-se)));
                            border-width: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-wh,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-wh,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-wh)));
                            color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-cr,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-cr,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-cr)));
                            font-family: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-fy,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-fy,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-fy)));
                            text-transform: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-tm,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-tm,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-tm)));
                            word-wrap: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-wp,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-wp,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-wp)));
                            word-break: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-bk,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-bk,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-bk)));
                            // font-size: var(
                            //   --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se,
                            //   var(
                            //     --_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se,
                            //     var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se)
                            //   )
                            // );
                            font-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se-ic)));
                            font-weight: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-wt,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-wt,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-wt)));
                            line-height: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-le-ht,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-le-ht,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-le-ht)));
                            letter-spacing: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-lr-sg,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-lr-sg,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-lr-sg)));
                            -webkit-text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue)));
                            text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue)));
                            padding: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-pg,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-pg,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-pg)));
                            text-align: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-an,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-an,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-an)));
                          }
                        }

                        // gift card styles
                        .chk_gft_crd_wrapper {
                          display: flex;
                          justify-content: space-between;
                          align-items: center;
                          background-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-bd-cr,
                              var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-bd-cr,
                                var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-bd-cr)));
                          border-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr,
                              var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr,
                                var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr)));
                          border-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se,
                              var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se,
                                var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se)));
                          border-width: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh,
                              var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh,
                                var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh)));
                          border-radius: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs,
                              var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs,
                                var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs)));
                          padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-pg,
                              var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-pg,
                                var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-pg)));
                          gap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp,
                              var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp,
                                var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp)));

                          &_item {
                            display: flex;
                            align-items: center;
                            gap: 16px;

                            &_icon {
                              width: 40px;
                              height: 40px;
                              border: 1px solid var(--_gray-200);
                              border-radius: 6px;
                              display: flex;
                              justify-content: center;
                              align-items: center;
                            }

                            &_info {
                              display: flex;
                              flex-direction: column;

                              &_title {
                                // font-size: 14px;
                                // margin-bottom: 4px;
                                // font-weight: 600;
                                font-size: 14px;
                                // font-weight: 700;
                                line-height: 20px;
                                // color: var(--_gray-700);
                                font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy)));
                                text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm)));
                                word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp)));
                                word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk)));
                                color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr)));
                                font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt)));
                                font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se)));
                                padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg)));
                              }

                              &_desc {
                                display: flex;

                                &_value {
                                  font-size: 12px;
                                  // color: var(--_gray-900);
                                  font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc)));
                                  text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc)));
                                  word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc)));
                                  word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc)));
                                  color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc)));
                                  font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc)));
                                  font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc)));
                                  padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc)));
                                }

                                &_label {
                                  // font-size: 12px;
                                  // color: var(--_gray-900);
                                  font-size: 12px;
                                  // color: var(--_gray-500);
                                  font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy)));
                                  text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm)));
                                  word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp)));
                                  word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk)));
                                  color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr)));
                                  font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt)));
                                  font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se)));
                                  padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg)));
                                }
                              }
                            }

                            &_pin {
                              margin-left: 36px;

                              input[type="number"] {
                                border: 1px solid var(--_gray-300);
                                border-radius: 4px;
                                background-color: var(--_base-white);
                                width: 95px;
                                height: 44px;
                                padding-inline: 10px;

                                &:focus {
                                  outline: 2px solid var(--_primary-100);
                                  border: 1px solid var(--_primary-300);
                                }
                              }
                            }
                          }

                          &_input {
                            border: 1px solid var(--_gray-300);
                            border-radius: 4px;
                            background-color: var(--_base-white);
                            height: 44px;
                            width: 100px;
                            display: flex;
                            align-items: center;
                            gap: 8px;
                            padding-left: 10px;

                            input[type="number"] {
                              background-color: var(--_base-white);
                              padding-right: 10px;
                            }

                            background-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-bd-cr,
                              var(--_ctm-tab-dn-an-tb-fm-wr-is-bd-cr,
                                var(--_ctm-dn-an-tb-fm-wr-is-bd-cr)));
                            border-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-cr,
                              var(--_ctm-tab-dn-an-tb-fm-wr-is-br-cr,
                                var(--_ctm-dn-an-tb-fm-wr-is-br-cr)));
                            border-style: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-se,
                              var(--_ctm-tab-dn-an-tb-fm-wr-is-br-se,
                                var(--_ctm-dn-an-tb-fm-wr-is-br-se)));
                            border-width: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-wh,
                              var(--_ctm-tab-dn-an-tb-fm-wr-is-br-wh,
                                var(--_ctm-dn-an-tb-fm-wr-is-br-wh)));
                            border-radius: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-rs,
                              var(--_ctm-tab-dn-an-tb-fm-wr-is-br-rs,
                                var(--_ctm-dn-an-tb-fm-wr-is-br-rs)));
                            padding: var(--_ctm-mob-dn-an-tb-fm-wr-is-pg,
                              var(--_ctm-tab-dn-an-tb-fm-wr-is-pg, var(--_ctm-dn-an-tb-fm-wr-is-pg)));

                            &:focus-within {
                              outline: 2px solid var(--_primary-100);
                              border: 1px solid var(--_primary-300);
                            }
                          }
                        }

                        .chk_gft_crd_wrapper {
                          &_btn {
                            // text-align: left;
                            // margin-bottom: 16px;
                            // color: var(--_primary-400);
                            background-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-bd-cr,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-bd-cr,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-bd-cr)));
                            border-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-cr,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-cr,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-cr)));
                            border-radius: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-rs,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-rs,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-rs)));
                            border-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-se,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-se,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-se)));
                            border-width: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-wh,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-wh,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-wh)));
                            color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-cr,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-cr,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-cr)));
                            font-family: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-fy,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-fy,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-fy)));
                            text-transform: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-tm,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-tm,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-tm)));
                            word-wrap: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-wp,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-wp,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-wp)));
                            word-break: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-bk,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-bk,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-bk)));
                            font-size: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se)));
                            font-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se-ic)));
                            font-weight: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-wt,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-wt,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-wt)));
                            line-height: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-le-ht,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-le-ht,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-le-ht)));
                            letter-spacing: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-lr-sg,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-lr-sg,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-lr-sg)));
                            -webkit-text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue)));
                            text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue)));
                            padding: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-pg,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-pg,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-pg)));
                            text-align: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-an,
                                var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-an,
                                  var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-an)));

                            &:hover {
                              text-decoration: underline;
                            }
                          }
                        }

                        // payment other options styles
                        .chk_pmnt_other_options {
                          display: flex;
                          justify-content: space-between;
                          gap: 80px;
                          padding: 16px;

                          .chk_pmnt_other_options_left_container {
                            display: flex;
                            gap: 12px;

                            .chk_pmnt_option_info_wrapper {
                              display: flex;
                              gap: 12px;

                              .cards {
                                display: flex;
                                flex-direction: column;
                                gap: 8px;

                                .chk_payment_options_name {
                                  font-weight: 600;
                                }

                                span {
                                  font-size: 12px;

                                  .chk_payment_options_label {
                                    color: var(--_gray-600);
                                  }

                                  .chk_payment_options_value {
                                    color: var(--_gray-900);
                                  }
                                }
                              }
                            }
                          }

                          .chk_pmnt_other_options_container {
                            padding: 16px;
                          }
                        }

                        &__other_option_wrapper {
                          display: flex;
                          width: 100%;
                          justify-content: space-between;
                          padding: 16px;

                          @media (max-width: 500px) {
                            flex-direction: column;
                          }
                        }

                        &_left_container {
                          display: flex;
                          gap: 12px;
                          align-items: flex-start;

                          .chk_payment_option__info_wrapper {
                            display: flex;
                            gap: 0px;
                          }

                          @media (max-width: 500px) {
                            flex-wrap: wrap;
                          }
                        }

                        &__left_wrapper {
                          display: flex;
                          flex-direction: column;
                          align-items: flex-start;
                          gap: 16px;
                        }

                        &__card_icon {
                          width: 60px;
                          height: 40px;
                        }

                        &__info_wrapper {
                          display: flex;
                          flex-direction: column;

                          .chk_payment_options_name {
                            color: var(--_ctm-dn-pt-os-dn-pt-ne-dn-cr);
                            font-family: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-fy);
                            text-transform: var(--_ctm-dn-pt-os-dn-pt-ne-dn-tt-tm);
                            word-wrap: var(--_ctm-dn-pt-os-dn-pt-ne-dn-wd-wp);
                            word-break: var(--_ctm-dn-pt-os-dn-pt-ne-dn-wd-bk);
                            font-size: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-se);
                            font-style: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-se-ic);
                            font-weight: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-wt);
                            line-height: var(--_ctm-dn-pt-os-dn-pt-ne-dn-le-ht);
                            letter-spacing: var(--_ctm-dn-pt-os-dn-pt-ne-dn-lr-sg);
                            text-decoration: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ue);
                          }

                          .chk_payment_options_label {
                            color: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-cr);
                            font-family: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-fy);
                            text-transform: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-tt-tm);
                            word-wrap: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-wd-wp);
                            word-break: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-wd-bk);
                            font-size: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-se);
                            font-style: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-se-ic);
                            font-weight: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-wt);
                            line-height: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-le-ht);
                            letter-spacing: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-lr-sg);
                            text-decoration: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ue);
                          }

                          .chk_payment_options_value {
                            color: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-cr);
                            font-family: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-fy);
                            text-transform: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-tt-tm);
                            word-wrap: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-wd-wp);
                            word-break: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-wd-bk);
                            font-size: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-se);
                            font-style: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-se-ic);
                            font-weight: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-wt);
                            line-height: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-le-ht);
                            letter-spacing: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-lr-sg);
                            text-decoration: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ue);
                          }
                        }

                        &_right_container {
                          display: flex;
                          gap: 6px;
                          align-items: flex-start;

                          @media (max-width: 500px) {
                            justify-content: flex-end;
                          }
                        }

                        &_input {
                          display: flex;
                          padding: 9px 12px;
                          align-items: center;
                          max-width: 96px;
                          background-color: var(--_base-white);
                          border: 1px solid var(--_gray-300);
                          border-radius: 6px;
                          color: var(--_gray-700);

                          &:focus-within {
                            border: 1px solid var(--_primary-300);
                            outline: 2px solid var(--_primary-100);
                          }

                          .icon {
                            svg {
                              path {
                                stroke: var(--_primary-400);
                              }
                            }
                          }

                          .input_field {
                            background-color: var(--_base-white);
                            border: 1px solid var(--_gray-300);
                            border-radius: 6px;
                            color: var(--_gray-700);

                            &:focus-within {
                              border: 1px solid var(--_primary-300);
                              outline: 2px solid var(--_primary-100);
                            }
                          }
                        }
                      }
                    }
                  }
                }
              }

              .chk_gift_card_wrapper {
                display: flex;
                flex-direction: column;
                // border: 1px solid var(--_gray-300);
                // margin-bottom: 12px;
                // border-radius: 4px;
                overflow: hidden;
                background-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-bd-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-bd-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-bd-cr)));
                border-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr)));
                border-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh)));
                border-radius: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs)));
                padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-pg,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-pg,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-pg)));
                gap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-im-gp)));

                .pp_pmnt_method_groups {
                  .pp_ppm_section {
                    // background: #f5f5f5;
                    // padding: 12px 16px;
                    // font-size: 12px;
                    background-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr)));
                    border-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr)));
                    border-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-se,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-se,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-se)));
                    border-width: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh)));
                    border-radius: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs)));
                    padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-pg,
                        var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-pg,
                          var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-pg)));

                    display: flex;
                    justify-content: space-between;
                    gap: 8px;

                    .pp_ppm_section_label {
                      font-size: 14px;
                      font-weight: 700;
                      color: var(--_gray-900);
                    }

                    .pp_ppm_section_value {
                      font-size: 14px;
                      font-weight: 700;
                      color: var(--_gray-600);

                      .pp_ppm_section_value_label {
                        // font-weight: 500;
                        // color: var(--_gray-500);
                        color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-cr,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-cr,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-cr)));
                        font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-fy,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-fy,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-fy)));
                        text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-tt-tm,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-tt-tm,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-tt-tm)));
                        word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-wd-wp,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-wd-wp,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-wd-wp)));
                        word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-wd-bk,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-wd-bk,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-wd-bk)));
                        font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se)));
                        font-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-ic,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-ic,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-ic)));
                        font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-wt,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-wt,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-wt)));
                        line-height: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-le-ht,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-le-ht,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-le-ht)));
                        letter-spacing: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-lr-sg,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-lr-sg,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-lr-sg)));
                        text-decoration: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ue,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ue,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ue)));
                        padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-pg,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-pg,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-pg)));
                        text-align: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-tt-an,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-tt-an,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-tt-an)));
                      }

                      .pp_ppm_section_value_amount {
                        // font-weight: 500;
                        // color: var(--_gray-500);
                        color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-cr-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-cr-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-cr-dc)));
                        font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-fy-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-fy-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-fy-dc)));
                        text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-tt-tm-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-tt-tm-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-tt-tm-dc)));
                        word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-wd-wp-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-wd-wp-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-wd-wp-dc)));
                        word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-wd-bk-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-wd-bk-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-wd-bk-dc)));
                        font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-dc)));
                        font-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-ic-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-ic-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-se-ic-dc)));
                        font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ft-wt-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ft-wt-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ft-wt-dc)));
                        line-height: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-le-ht-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-le-ht-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-le-ht-dc)));
                        letter-spacing: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-lr-sg-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-lr-sg-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-lr-sg-dc)));
                        text-decoration: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-ue-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-ue-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-ue-dc)));
                        padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-pg-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-pg-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-pg-dc)));
                        text-align: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-ds-tt-an-dc,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-ds-tt-an-dc,
                              var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-ds-tt-an-dc)));
                      }
                    }
                  }

                  .payment_methods {
                    // padding: 12px;
                    display: grid;
                    gap: 8px;

                    .chk_payment_option {
                      .chk_payment_section_wrapper {
                        width: 100%;
                        display: flex;
                        justify-content: space-between;
                        // padding: 16px;
                        background-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-bd-cr,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-bd-cr,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-bd-cr)));
                        border-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-cr,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-cr,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-cr)));
                        border-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-se,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-se,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-se)));
                        border-width: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-wh,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-wh,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-wh)));
                        border-radius: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-rs,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-rs,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-br-rs)));
                        padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-pg,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-pg,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-pg)));
                        gap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-im-gp,
                            var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-im-gp,
                              var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-is-im-gp)));

                        &:hover {
                          background-color: var(--_gray-50);
                        }

                        .chk_payment_section {
                          display: flex;
                          justify-content: space-between;
                          align-items: center;
                          width: 100%;

                          .chk_payment_section_col_left {
                            display: flex;
                            gap: 12px;

                            .chk_payment_section_method {
                              display: flex;
                              flex-direction: column;

                              .chk_payment_section_method_name {
                                font-size: 14px;
                                // font-weight: 700;
                                line-height: 20px;
                                // color: var(--_gray-700);
                                font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy)));
                                text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm)));
                                word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp)));
                                word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk)));
                                color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr)));
                                font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt)));
                                font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se)));
                                padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg,
                                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg,
                                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg)));
                              }

                              &>div {
                                display: flex;

                                .label {
                                  font-size: 12px;
                                  // color: var(--_gray-500);
                                  font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy)));
                                  text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm)));
                                  word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp)));
                                  word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk)));
                                  color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr)));
                                  font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt)));
                                  font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se)));
                                  padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg)));
                                }

                                .price {
                                  font-size: 12px;
                                  // color: var(--_gray-900);
                                  font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc)));
                                  text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc)));
                                  word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc)));
                                  word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc)));
                                  color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc)));
                                  font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc)));
                                  font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc)));
                                  padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc,
                                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc,
                                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc)));
                                }
                              }
                            }
                          }

                          &_col_right {}
                        }

                        .chk_payment_options_heading {
                          color: var(--_gray-900);
                          font-size: 16px;
                          font-weight: 700;
                        }

                        // gift card styles
                        .chk_gft_crd_wrapper {
                          display: flex;
                          justify-content: space-between;
                          align-items: center;
                          padding: 16px 16px 0 16px;

                          &_item {
                            display: flex;
                            align-items: center;
                            gap: 16px;

                            &_icon {
                              width: 40px;
                              height: 40px;
                              border: 1px solid var(--_gray-200);
                              border-radius: 6px;
                              display: flex;
                              justify-content: center;
                              align-items: center;
                            }

                            &_info {
                              display: flex;
                              flex-direction: column;

                              &_title {
                                font-size: 14px;
                                margin-bottom: 4px;
                                font-weight: 600;
                              }

                              &_desc {
                                display: flex;

                                &_value {
                                  font-size: 12px;
                                  color: var(--_gray-600);
                                }

                                &_label {
                                  font-size: 12px;
                                  color: var(--_gray-900);
                                }
                              }
                            }

                            &_pin {
                              margin-left: 36px;

                              input[type="number"] {
                                border: 1px solid var(--_gray-300);
                                border-radius: 4px;
                                background-color: var(--_base-white);
                                width: 95px;
                                height: 44px;
                                padding-inline: 10px;

                                &:focus {
                                  outline: 2px solid var(--_primary-100);
                                  border: 1px solid var(--_primary-300);
                                }
                              }
                            }
                          }

                          &_input {
                            border: 1px solid var(--_gray-300);
                            border-radius: 4px;
                            background-color: var(--_base-white);
                            height: 44px;
                            width: 100px;
                            display: flex;
                            align-items: center;
                            gap: 8px;
                            padding-left: 10px;

                            input[type="number"] {
                              background-color: var(--_base-white);
                              padding-right: 10px;
                            }

                            &:focus-within {
                              outline: 2px solid var(--_primary-100);
                              border: 1px solid var(--_primary-300);
                            }
                          }
                        }

                        .chk_gft_crd_wrapper {
                          &_btn {
                            text-align: left;
                            margin-bottom: 16px;
                            color: var(--_primary-400);

                            &:hover {
                              text-decoration: underline;
                            }
                          }
                        }

                        // payment other options styles
                        .chk_pmnt_other_options {
                          display: flex;
                          justify-content: space-between;
                          gap: 80px;
                          padding: 16px;

                          .chk_pmnt_other_options_left_container {
                            display: flex;
                            gap: 12px;

                            .chk_pmnt_option_info_wrapper {
                              display: flex;
                              gap: 12px;

                              .cards {
                                display: flex;
                                flex-direction: column;
                                gap: 8px;

                                .chk_payment_options_name {
                                  font-weight: 600;
                                }

                                span {
                                  font-size: 12px;

                                  .chk_payment_options_label {
                                    color: var(--_gray-600);
                                  }

                                  .chk_payment_options_value {
                                    color: var(--_gray-900);
                                  }
                                }
                              }
                            }
                          }

                          .chk_pmnt_other_options_container {
                            padding: 16px;
                          }
                        }

                        &__other_option_wrapper {
                          display: flex;
                          width: 100%;
                          justify-content: space-between;
                          padding: 16px;

                          @media (max-width: 500px) {
                            flex-direction: column;
                          }
                        }

                        &_left_container {
                          display: flex;
                          gap: 12px;
                          align-items: flex-start;

                          .chk_payment_option__info_wrapper {
                            display: flex;
                            gap: 0px;
                          }

                          @media (max-width: 500px) {
                            flex-wrap: wrap;
                          }
                        }

                        &__left_wrapper {
                          display: flex;
                          flex-direction: column;
                          align-items: flex-start;
                          gap: 16px;
                        }

                        &__card_icon {
                          width: 60px;
                          height: 40px;
                        }

                        &__info_wrapper {
                          display: flex;
                          flex-direction: column;

                          .chk_payment_options_name {
                            color: var(--_ctm-dn-pt-os-dn-pt-ne-dn-cr);
                            font-family: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-fy);
                            text-transform: var(--_ctm-dn-pt-os-dn-pt-ne-dn-tt-tm);
                            word-wrap: var(--_ctm-dn-pt-os-dn-pt-ne-dn-wd-wp);
                            word-break: var(--_ctm-dn-pt-os-dn-pt-ne-dn-wd-bk);
                            font-size: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-se);
                            font-style: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-se-ic);
                            font-weight: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ft-wt);
                            line-height: var(--_ctm-dn-pt-os-dn-pt-ne-dn-le-ht);
                            letter-spacing: var(--_ctm-dn-pt-os-dn-pt-ne-dn-lr-sg);
                            text-decoration: var(--_ctm-dn-pt-os-dn-pt-ne-dn-ue);
                          }

                          .chk_payment_options_label {
                            color: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-cr);
                            font-family: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-fy);
                            text-transform: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-tt-tm);
                            word-wrap: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-wd-wp);
                            word-break: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-wd-bk);
                            font-size: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-se);
                            font-style: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-se-ic);
                            font-weight: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-wt);
                            line-height: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-le-ht);
                            letter-spacing: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-lr-sg);
                            text-decoration: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ue);
                          }

                          .chk_payment_options_value {
                            color: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-cr);
                            font-family: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-fy);
                            text-transform: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-tt-tm);
                            word-wrap: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-wd-wp);
                            word-break: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-wd-bk);
                            font-size: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-se);
                            font-style: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-se-ic);
                            font-weight: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-wt);
                            line-height: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-le-ht);
                            letter-spacing: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-lr-sg);
                            text-decoration: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ue);
                          }
                        }

                        &_right_container {
                          display: flex;
                          gap: 6px;
                          align-items: flex-start;

                          @media (max-width: 500px) {
                            justify-content: flex-end;
                          }
                        }

                        &_input {
                          display: flex;
                          padding: 9px 12px;
                          align-items: center;
                          max-width: 96px;
                          background-color: var(--_base-white);
                          border: 1px solid var(--_gray-300);
                          border-radius: 6px;
                          color: var(--_gray-700);

                          &:focus-within {
                            border: 1px solid var(--_primary-300);
                            outline: 2px solid var(--_primary-100);
                          }

                          .icon {
                            svg {
                              path {
                                stroke: var(--_primary-400);
                              }
                            }
                          }

                          .input_field {
                            background-color: var(--_base-white);
                            border: 1px solid var(--_gray-300);
                            border-radius: 6px;
                            color: var(--_gray-700);

                            &:focus-within {
                              border: 1px solid var(--_primary-300);
                              outline: 2px solid var(--_primary-100);
                            }
                          }
                        }
                      }
                    }
                  }
                }
              }

              .chk_gft_crd_container {
                width: 100%;
                display: flex;
                flex-direction: column;
                gap: var(--_ctm-lt-pt-os-cr-hl-gp);
                background-color: var(--_ctm-dn-pt-os-dn-pt-os-cr-dn-bd-cr);
                border: 1px solid var(--_gray-300);
                border-radius: 4px;
                overflow: hidden;

                .chk_gft_crd_option_heading {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  padding: 8px 12px;
                  border-bottom: 1px solid var(--_gray-300);
                }

                // gift card styles
                .chk_gft_crd_wrapper {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  padding: 16px 16px 0 16px;

                  &_item {
                    display: flex;
                    align-items: center;
                    gap: 16px;

                    &_icon {
                      width: 40px;
                      height: 40px;
                      border: 1px solid var(--_gray-200);
                      border-radius: 6px;
                      display: flex;
                      justify-content: center;
                      align-items: center;
                    }

                    &_info {
                      display: flex;
                      flex-direction: column;

                      &_title {
                        font-size: 14px;
                        margin-bottom: 4px;
                        font-weight: 600;
                      }

                      &_desc {
                        display: flex;

                        &_value {
                          font-size: 12px;
                          color: var(--_gray-600);
                        }

                        &_label {
                          font-size: 12px;
                          color: var(--_gray-900);
                        }
                      }
                    }

                    &_pin {
                      margin-left: 36px;

                      input[type="number"] {
                        border: 1px solid var(--_gray-300);
                        border-radius: 4px;
                        background-color: var(--_base-white);
                        width: 95px;
                        height: 44px;
                        padding-inline: 10px;

                        &:focus {
                          outline: 2px solid var(--_primary-100);
                          border: 1px solid var(--_primary-300);
                        }
                      }
                    }
                  }

                  &_input {
                    border: 1px solid var(--_gray-300);
                    border-radius: 4px;
                    background-color: var(--_base-white);
                    height: 44px;
                    width: 120px;
                    display: flex;
                    align-items: center;
                    gap: 8px;
                    padding-left: 10px;

                    input[type="number"] {
                      background-color: var(--_base-white);
                      padding-right: 10px;
                    }

                    &:focus-within {
                      outline: 2px solid var(--_primary-100);
                      border: 1px solid var(--_primary-300);
                    }
                  }
                }

                .chk_gft_crd_wrapper {
                  &_btn {
                    text-align: left;
                    margin-bottom: 16px;
                    color: var(--_primary-400);

                    &:hover {
                      text-decoration: underline;
                    }
                  }
                }

                // payment other options styles
                .chk_pmnt_other_options {
                  display: flex;
                  justify-content: space-between;
                  gap: 80px;
                  padding: 16px;

                  .chk_pmnt_other_options_left_container {
                    display: flex;
                    gap: 12px;

                    .chk_pmnt_option_info_wrapper {
                      display: flex;
                      gap: 12px;

                      .cards {
                        display: flex;
                        flex-direction: column;
                        gap: 8px;

                        .chk_payment_options_name {
                          font-weight: 600;
                        }

                        span {
                          font-size: 12px;

                          .chk_payment_options_label {
                            color: var(--_gray-600);
                          }

                          .chk_payment_options_value {
                            color: var(--_gray-900);
                          }
                        }
                      }
                    }
                  }

                  .chk_pmnt_other_options_container {
                    padding: 16px;
                  }
                }

                &__other_option_wrapper {
                  display: flex;
                  width: 100%;
                  justify-content: space-between;
                  padding: 16px;

                  @media (max-width: 500px) {
                    flex-direction: column;
                  }
                }

                &_left_container {
                  display: flex;
                  gap: 12px;
                  align-items: flex-start;

                  &>div {
                    display: flex;
                    gap: 12px;
                  }

                  @media (max-width: 500px) {
                    flex-wrap: wrap;
                  }
                }

                &__left_wrapper {
                  display: flex;
                  flex-direction: column;
                  align-items: flex-start;
                  gap: 16px;
                }

                &__card_icon {
                  width: 60px;
                  height: 40px;
                }

                &__info_wrapper {
                  display: flex;
                  flex-direction: column;

                  .chk_payment_options_name {
                    color: var(--_gray-900);
                    font-size: 16px;
                    font-weight: 600;
                  }

                  .chk_payment_options_label {
                    color: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-cr);
                    font-family: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-fy);
                    text-transform: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-tt-tm);
                    word-wrap: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-wd-wp);
                    word-break: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-wd-bk);
                    font-size: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-se);
                    font-style: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-se-ic);
                    font-weight: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ft-wt);
                    line-height: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-le-ht);
                    letter-spacing: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-lr-sg);
                    text-decoration: var(--_ctm-dn-pt-os-dn-pt-os-ll-dn-ue);
                  }

                  .chk_payment_options_value {
                    color: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-cr);
                    font-family: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-fy);
                    text-transform: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-tt-tm);
                    word-wrap: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-wd-wp);
                    word-break: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-wd-bk);
                    font-size: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-se);
                    font-style: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-se-ic);
                    font-weight: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ft-wt);
                    line-height: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-le-ht);
                    letter-spacing: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-lr-sg);
                    text-decoration: var(--_ctm-dn-pt-os-dn-pt-os-ve-dn-ue);
                  }
                }

                &_right_container {
                  display: flex;
                  gap: 6px;
                  align-items: flex-start;

                  @media (max-width: 500px) {
                    justify-content: flex-end;
                  }
                }

                &_input {
                  display: flex;
                  padding: 8px 12px;
                  width: -webkit-fill-available;
                  background-color: var(--_base-white);
                  border-radius: 6px;
                  border: 1px solid var(--_gray-300);

                  &:focus-within {
                    border: 1px solid var(--_primary-300);
                    outline: 2px solid var(--_primary-100);
                  }

                  .icon {
                    svg {
                      path {
                        stroke: var(--_primary-400);
                      }
                    }
                  }

                  .input_field {
                    padding: 8px 12px;
                    width: -webkit-fill-available;
                    background-color: var(--_base-white);
                    border-radius: 6px;
                    border: 1px solid var(--_gray-300);

                    &:focus-within {
                      border: 1px solid var(--_primary-300);
                      outline: 2px solid var(--_primary-100);
                    }
                  }
                }
              }

              .chk_payment_gift_card {
                display: flex;
                flex-direction: column;
                border-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-cr)));
                border-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-wh)));
                border-radius: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-cr-br-rs)));
              }

              .payment_heading {
                // padding: 12px;
                // display: flex;
                // justify-content: space-between;
                // border-bottom: 1px solid var(--_gray-100);
                // font-weight: 600;
                background-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr)));
                border-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr)));
                border-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-se,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-se,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh)));
                border-radius: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs)));
                padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-pg,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-pg,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-pg)));
                display: flex;
                justify-content: space-between;
                gap: 8px;
              }

              .chk_payment_options_heading {
                // color: var(--_gray-900);
                // font-size: 16px;
                // font-weight: 700;
                background-color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-bd-cr)));
                // border-color: var(
                //   --_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr,
                //   var(
                //     --_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr,
                //     var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-cr)
                //   )
                // );
                // border-style: var(
                //   --_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-se,
                //   var(
                //     --_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-se,
                //     var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-se)
                //   )
                // );
                // border-width: var(
                //   --_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh,
                //   var(
                //     --_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh,
                //     var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-wh)
                //   )
                // );
                // border-radius: var(
                //   --_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs,
                //   var(
                //     --_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs,
                //     var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-br-rs)
                //   )
                // );
                padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pe-hr-pg,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pe-hr-pg,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pe-hr-pg)));
                display: flex;
                justify-content: space-between;
                gap: 8px;
                display: flex;
                justify-content: space-between;
                gap: 8px;

                .payment_options_heading {
                  color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-cr,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-cr,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-cr)));
                  font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-fy,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-fy,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-fy)));
                  text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-tt-tm,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-tt-tm,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-tt-tm)));
                  word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-wd-wp,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-wd-wp,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-wd-wp)));
                  word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-wd-bk,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-wd-bk,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-wd-bk)));
                  font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-se,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-se,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-se)));
                  font-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-se-ic,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-se-ic,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-se-ic)));
                  font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-wt,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-wt,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-wt)));
                  line-height: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-le-ht,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-le-ht,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-le-ht)));
                  letter-spacing: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-lr-sg,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-lr-sg,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-lr-sg)));
                  -webkit-text-decoration: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ue,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ue,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ue)));
                  text-decoration: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ue,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ue,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ue)));
                  padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-pg,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-pg,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-pg)));
                  text-align: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-tt-an,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-tt-an,
                        var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-tt-an)));
                }

                .chk_primary_btn_link {
                  background-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-bd-cr,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-bd-cr,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-bd-cr)));
                  border-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-cr,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-cr,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-cr)));
                  border-radius: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-rs,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-rs,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-rs)));
                  border-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-se,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-se,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-se)));
                  border-width: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-wh,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-wh,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-wh)));
                  color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-cr,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-cr,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-cr)));
                  font-family: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-fy,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-fy,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-fy)));
                  text-transform: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-tm,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-tm,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-tm)));
                  word-wrap: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-wp,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-wp,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-wp)));
                  word-break: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-bk,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-bk,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-bk)));
                  font-size: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se)));
                  font-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se-ic)));
                  font-weight: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-wt,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-wt,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-wt)));
                  line-height: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-le-ht,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-le-ht,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-le-ht)));
                  letter-spacing: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-lr-sg,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-lr-sg,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-lr-sg)));
                  -webkit-text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue)));
                  text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue)));
                  padding: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-pg,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-pg,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-pg)));
                  text-align: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-an,
                      var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-an,
                        var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-an)));

                  &:hover {
                    background-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-bd-cr,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-bd-cr,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-bd-cr)));
                    border-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-cr,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-cr,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-cr)));
                    border-radius: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-rs,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-rs,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-rs)));
                    border-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-se,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-se,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-se)));
                    border-width: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-br-wh,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-br-wh,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-br-wh)));
                    color: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-cr,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-cr,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-cr)));
                    font-family: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-fy,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-fy,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-fy)));
                    text-transform: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-tt-tm,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-tt-tm,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-tt-tm)));
                    word-wrap: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-wd-wp,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-wd-wp,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-wd-wp)));
                    word-break: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-wd-bk,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-wd-bk,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-wd-bk)));
                    font-size: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-se,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-se,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-se)));
                    font-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-se-ic,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-se-ic,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-se-ic)));
                    font-weight: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ft-wt,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ft-wt,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ft-wt)));
                    line-height: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-le-ht,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-le-ht,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-le-ht)));
                    letter-spacing: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-lr-sg,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-lr-sg,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-lr-sg)));
                    -webkit-text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ue,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ue,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ue)));
                    text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ue,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ue,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ue)));
                    padding: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-pg,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-pg,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-pg)));
                    text-align: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-tt-an,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-tt-an,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-tt-an)));
                  }
                }
              }
            }

            .chk_billing_address {
              width: 100%;
              display: flex;
              flex-direction: column;
              margin-top: 24px;
              background-color: var(--_ctm-mob-dn-an-tb-bg-as-bg-as-cr-bd-cr,
                  var(--_ctm-tab-dn-an-tb-bg-as-bg-as-cr-bd-cr,
                    var(--_ctm-dn-an-tb-bg-as-bg-as-cr-bd-cr)));
              border-color: var(--_ctm-mob-dn-an-tb-bg-as-bg-as-cr-br-cr,
                  var(--_ctm-tab-dn-an-tb-bg-as-bg-as-cr-br-cr,
                    var(--_ctm-dn-an-tb-bg-as-bg-as-cr-br-cr)));
              border-style: var(--_ctm-mob-dn-an-tb-bg-as-bg-as-cr-br-se,
                  var(--_ctm-tab-dn-an-tb-bg-as-bg-as-cr-br-se,
                    var(--_ctm-dn-an-tb-bg-as-bg-as-cr-br-se)));
              border-width: var(--_ctm-mob-dn-an-tb-bg-as-bg-as-cr-br-wh,
                  var(--_ctm-tab-dn-an-tb-bg-as-bg-as-cr-br-wh,
                    var(--_ctm-dn-an-tb-bg-as-bg-as-cr-br-wh)));
              border-radius: var(--_ctm-mob-dn-an-tb-bg-as-bg-as-cr-br-rs,
                  var(--_ctm-tab-dn-an-tb-bg-as-bg-as-cr-br-rs,
                    var(--_ctm-dn-an-tb-bg-as-bg-as-cr-br-rs)));
              padding: var(--_ctm-mob-dn-an-tb-bg-as-bg-as-cr-pg,
                  var(--_ctm-tab-dn-an-tb-bg-as-bg-as-cr-pg, var(--_ctm-dn-an-tb-bg-as-bg-as-cr-pg)));
              display: flex;
              justify-content: space-between;
              gap: var(--_ctm-mob-dn-an-tb-bg-as-bg-as-cr-im-gp,
                  var(--_ctm-tab-dn-an-tb-bg-as-bg-as-cr-im-gp,
                    var(--_ctm-dn-an-tb-bg-as-bg-as-cr-im-gp)));

              &_form_container {
                border-radius: var(--_ctm-dn-pt-os-cr-dn-br-rs);
                padding-top: 24px;
                display: flex;
                flex-direction: column;
                gap: 24px;
              }

              .chk_payment_options_heading {
                font-family: var(--_ctm-mob-an-tb-bg-as-bg-te-ft-fy,
                    var(--_ctm-tab-an-tb-bg-as-bg-te-ft-fy, var(--_ctm-an-tb-bg-as-bg-te-ft-fy)));
                text-transform: var(--_ctm-mob-an-tb-bg-as-bg-te-tt-tm,
                    var(--_ctm-tab-an-tb-bg-as-bg-te-tt-tm, var(--_ctm-an-tb-bg-as-bg-te-tt-tm)));
                word-wrap: var(--_ctm-mob-an-tb-bg-as-bg-te-wd-wp,
                    var(--_ctm-tab-an-tb-bg-as-bg-te-wd-wp, var(--_ctm-an-tb-bg-as-bg-te-wd-wp)));
                word-break: var(--_ctm-mob-an-tb-bg-as-bg-te-wd-bk,
                    var(--_ctm-tab-an-tb-bg-as-bg-te-wd-bk, var(--_ctm-an-tb-bg-as-bg-te-wd-bk)));
                color: var(--_ctm-mob-an-tb-bg-as-bg-te-cr,
                    var(--_ctm-tab-an-tb-bg-as-bg-te-cr, var(--_ctm-an-tb-bg-as-bg-te-cr)));
                font-weight: 600;
                font-size: var(--_ctm-mob-an-tb-bg-as-bg-te-ft-se,
                    var(--_ctm-tab-an-tb-bg-as-bg-te-ft-se, var(--_ctm-an-tb-bg-as-bg-te-ft-se)));
                letter-spacing: var(--_ctm-mob-an-tb-bg-as-bg-te-lr-sg,
                    var(--_ctm-tab-an-tb-bg-as-bg-te-lr-sg, var(--_ctm-an-tb-bg-as-bg-te-lr-sg)));

                &.pl_0 {
                  padding-left: 0px;
                }
              }

              &_form_wrapper {
                display: flex;
                flex-direction: column;
                gap: 24px;
                border-radius: var(--_ctm-dn-pt-os-cr-dn-br-rs);
              }

              .shipping_address_container {
                display: flex;
                flex-direction: column;
                gap: 24px;
                max-width: 485px;
              }

              .shipping_address_heading_container {
                display: flex;
                justify-content: space-between;
                align-items: center;

                .chk_heading_info {
                  color: var(--_ctm-dn-sg-md-dn-hg-dn-cr);
                  font-family: var(--_ctm-dn-sg-md-dn-hg-dn-ft-fy);
                  text-transform: var(--_ctm-dn-sg-md-dn-hg-dn-tt-tm);
                  word-wrap: var(--_ctm-dn-sg-md-dn-hg-dn-wd-wp);
                  word-break: var(--_ctm-dn-sg-md-dn-hg-dn-wd-bk);
                  font-size: var(--_ctm-dn-sg-md-dn-hg-dn-ft-se);
                  font-style: var(--_ctm-dn-sg-md-dn-hg-dn-ft-se-ic);
                  font-weight: var(--_ctm-dn-sg-md-dn-hg-dn-ft-wt);
                  line-height: var(--_ctm-dn-sg-md-dn-hg-dn-le-ht);
                  letter-spacing: var(--_ctm-dn-sg-md-dn-hg-dn-lr-sg);
                  text-decoration: var(--_ctm-dn-sg-md-dn-hg-dn-ue);
                }

                .icon {
                  cursor: pointer;
                }
              }

              form {
                display: flex;
                flex-direction: column;
                gap: 16px;
                // max-width: 85%;

                @media (max-width: 500px) {
                  max-width: 100%;
                }
              }

              .chk_shipping_address_form_group {
                display: flex;
                justify-content: space-between;
                flex-direction: row;
                gap: 12px;
              }

              .chk_shipping_address_input_container {
                display: flex;
                width: 100%;
              }

              .chk_shipping_address_input_wrapper {
                display: flex;
                flex-direction: column;
                // gap: var(--_ctm-lt-ll-ad-it-gp);
                width: 100%;
                gap: 6px;
              }

              .chk_shipping_address_form_label {
                // color: var(--_gray-600);
                // font-size: 14px;
                font-family: var(--_ctm-mob-dn-an-tb-fm-wr-ls-ft-fy,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-ft-fy, var(--_ctm-dn-an-tb-fm-wr-ls-ft-fy)));
                text-transform: var(--_ctm-mob-dn-an-tb-fm-wr-ls-tt-tm,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-tt-tm, var(--_ctm-dn-an-tb-fm-wr-ls-tt-tm)));
                word-wrap: var(--_ctm-mob-dn-an-tb-fm-wr-ls-wd-wp,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-wd-wp, var(--_ctm-dn-an-tb-fm-wr-ls-wd-wp)));
                word-break: var(--_ctm-mob-dn-an-tb-fm-wr-ls-wd-bk,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-wd-bk, var(--_ctm-dn-an-tb-fm-wr-ls-wd-bk)));
                color: var(--_ctm-mob-dn-an-tb-fm-wr-ls-cr,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-cr, var(--_ctm-dn-an-tb-fm-wr-ls-cr)));
                font-weight: var(--_ctm-mob-dn-an-tb-fm-wr-ls-ft-wt,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-ft-wt, var(--_ctm-dn-an-tb-fm-wr-ls-ft-wt)));
                font-size: var(--_ctm-mob-dn-an-tb-fm-wr-ls-ft-se,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-ft-se, var(--_ctm-dn-an-tb-fm-wr-ls-ft-se)));
                text-decoration: var(--_ctm-mob-dn-an-tb-fm-wr-ls-ue,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-ue, var(--_ctm-dn-an-tb-fm-wr-ls-ue)));
                letter-spacing: var(--_ctm-mob-dn-an-tb-fm-wr-ls-lr-sg,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-lr-sg, var(--_ctm-dn-an-tb-fm-wr-ls-lr-sg)));
                line-height: var(--_ctm-mob-dn-an-tb-fm-wr-ls-le-ht,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-le-ht, var(--_ctm-dn-an-tb-fm-wr-ls-le-ht)));
                font-style: var(--_ctm-mob-dn-an-tb-fm-wr-ls-ft-se-ic,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-ft-se-ic, var(--_ctm-dn-an-tb-fm-wr-ls-ft-se-ic)));
                text-align: var(--_ctm-mob-dn-an-tb-fm-wr-ls-tt-an,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-tt-an, var(--_ctm-dn-an-tb-fm-wr-ls-tt-an)));
              }

              .chk_shiping_address_form_input {
                // padding: 8px 12px;
                // width: -webkit-fill-available;
                // background-color: var(--_base-white);
                // border-radius: 6px;
                // border: 1px solid var(--_gray-300);
                // padding: 8px 12px;
                height: 40px;
                width: -webkit-fill-available;
                // background-color: var(--_base-white);
                // color: var(--_gray-600);
                // border: 1px solid var(--_gray-300);
                // border-radius: 6px;
                // height: 40px;
                background-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-bd-cr,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-bd-cr, var(--_ctm-dn-an-tb-fm-wr-is-bd-cr)));
                border-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-cr,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-br-cr, var(--_ctm-dn-an-tb-fm-wr-is-br-cr)));
                border-style: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-se,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-br-se, var(--_ctm-dn-an-tb-fm-wr-is-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-wh,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-br-wh, var(--_ctm-dn-an-tb-fm-wr-is-br-wh)));
                border-radius: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-rs,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-br-rs, var(--_ctm-dn-an-tb-fm-wr-is-br-rs)));
                padding: var(--_ctm-mob-dn-an-tb-fm-wr-is-pg,
                    var(--_ctm-tab-dn-an-tb-fm-wr-is-pg, var(--_ctm-dn-an-tb-fm-wr-is-pg)));

                &::placeholder {
                  font-family: var(--_ctm-mob-dn-an-tb-fm-wr-is-ft-fy,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-ft-fy, var(--_ctm-dn-an-tb-fm-wr-is-ft-fy)));
                  text-transform: var(--_ctm-mob-dn-an-tb-fm-wr-is-tt-tm,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-tt-tm, var(--_ctm-dn-an-tb-fm-wr-is-tt-tm)));
                  word-wrap: var(--_ctm-mob-dn-an-tb-fm-wr-is-wd-wp,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-wd-wp, var(--_ctm-dn-an-tb-fm-wr-is-wd-wp)));
                  word-break: var(--_ctm-mob-dn-an-tb-fm-wr-is-wd-bk,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-wd-bk, var(--_ctm-dn-an-tb-fm-wr-is-wd-bk)));
                  color: var(--_ctm-mob-dn-an-tb-fm-wr-is-cr,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-cr, var(--_ctm-dn-an-tb-fm-wr-is-cr)));
                  font-weight: var(--_ctm-mob-dn-an-tb-fm-wr-is-ft-wt,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-ft-wt, var(--_ctm-dn-an-tb-fm-wr-is-ft-wt)));
                  font-size: var(--_ctm-mob-dn-an-tb-fm-wr-is-ft-se,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-ft-se, var(--_ctm-dn-an-tb-fm-wr-is-ft-se)));
                  text-decoration: var(--_ctm-mob-dn-an-tb-fm-wr-is-ue,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-ue, var(--_ctm-dn-an-tb-fm-wr-is-ue)));
                  letter-spacing: var(--_ctm-mob-dn-an-tb-fm-wr-is-lr-sg,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-lr-sg, var(--_ctm-dn-an-tb-fm-wr-is-lr-sg)));
                  line-height: var(--_ctm-mob-dn-an-tb-fm-wr-is-le-ht,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-le-ht, var(--_ctm-dn-an-tb-fm-wr-is-le-ht)));
                  font-style: var(--_ctm-mob-dn-an-tb-fm-wr-is-ft-se-ic,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-ft-se-ic,
                        var(--_ctm-dn-an-tb-fm-wr-is-ft-se-ic)));
                  text-align: var(--_ctm-mob-dn-an-tb-fm-wr-is-tt-an,
                      var(--_ctm-tab-dn-an-tb-fm-wr-is-tt-an, var(--_ctm-dn-an-tb-fm-wr-is-tt-an)));
                }

                &:focus-within {
                  border: 1px solid var(--_primary-300);
                  outline: 2px solid var(--_primary-100);
                }

                .input-field {
                  // padding: 8px 12px;
                  width: -webkit-fill-available;
                  background-color: var(--_base-white);
                  border-radius: 6px;
                  // border: 1px solid var(--_gray-300);

                  &:focus-within {
                    border: 1px solid var(--_primary-300);
                    outline: 2px solid var(--_primary-100);
                  }
                }
              }

              input[type="checkbox"] {
                width: auto;
              }

              .error-msg {
                font-size: 12px;
                color: #ff0000;
              }

              .chk_shipping_address_use_as_billing_address_chkbx {
                display: flex;
                align-items: center;
                cursor: pointer;
                gap: 10px;
                margin-bottom: 6px;
                font-family: var(--_ctm-mob-dn-an-tb-fm-wr-ls-ft-fy,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-ft-fy, var(--_ctm-dn-an-tb-fm-wr-ls-ft-fy)));
                text-transform: var(--_ctm-mob-dn-an-tb-fm-wr-ls-tt-tm,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-tt-tm, var(--_ctm-dn-an-tb-fm-wr-ls-tt-tm)));
                word-wrap: var(--_ctm-mob-dn-an-tb-fm-wr-ls-wd-wp,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-wd-wp, var(--_ctm-dn-an-tb-fm-wr-ls-wd-wp)));
                word-break: var(--_ctm-mob-dn-an-tb-fm-wr-ls-wd-bk,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-wd-bk, var(--_ctm-dn-an-tb-fm-wr-ls-wd-bk)));
                &.flex__overflow {
                  white-space: normal;
                  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
                }
                color: var(--_ctm-mob-dn-an-tb-fm-wr-ls-cr,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-cr, var(--_ctm-dn-an-tb-fm-wr-ls-cr)));
                font-weight: var(--_ctm-mob-dn-an-tb-fm-wr-ls-ft-wt,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-ft-wt, var(--_ctm-dn-an-tb-fm-wr-ls-ft-wt)));
                font-size: var(--_ctm-mob-dn-an-tb-fm-wr-ls-ft-se,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-ft-se, var(--_ctm-dn-an-tb-fm-wr-ls-ft-se)));
                letter-spacing: var(--_ctm-mob-dn-an-tb-fm-wr-ls-lr-sg,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-lr-sg, var(--_ctm-dn-an-tb-fm-wr-ls-lr-sg)));

                .custom-checkbox {
                  width: 20px;
                  height: 20px;
                  border: 1px solid #d0d5dd;
                  border-radius: 4px;
                  position: relative;
                  background-color: #fff;
                  transition: all 0.2s ease;

                  &::after {
                    content: "";
                    position: absolute;
                    display: none;
                    left: 5px;
                    top: 0.5px;
                    width: 5px;
                    height: 10px;
                    border: solid #fff;
                    border-width: 0 2px 2px 0;
                    transform: rotate(45deg);
                  }
                }
              }

              input[type="checkbox"]:checked+label {
                .custom-checkbox {
                  background-color: #004dff;
                  border-color: #004dff;

                  &::after {
                    display: block;
                  }
                }
              }

              .checkbox-group {
                display: flex;
                align-items: center;
                justify-content: start;
                gap: 8px;
              }

              &_same_as_billing_address_chkbx {
                color: var(--_ctm-dn-se-sg-as-dn-cx-dn-cr);
                font-family: var(--_ctm-dn-se-sg-as-dn-cx-dn-ft-fy);
                text-transform: var(--_ctm-dn-se-sg-as-dn-cx-dn-tt-tm);
                word-wrap: var(--_ctm-dn-se-sg-as-dn-cx-dn-wd-wp);
                word-break: var(--_ctm-dn-se-sg-as-dn-cx-dn-wd-bk);
                font-size: var(--_ctm-dn-se-sg-as-dn-cx-dn-ft-se);
                font-style: var(--_ctm-dn-se-sg-as-dn-cx-dn-ft-se-ic);
                font-weight: var(--_ctm-dn-se-sg-as-dn-cx-dn-ft-wt);
                line-height: var(--_ctm-dn-se-sg-as-dn-cx-dn-le-ht);
                letter-spacing: var(--_ctm-dn-se-sg-as-dn-cx-dn-lr-sg);
                text-decoration: var(--_ctm-dn-se-sg-as-dn-cx-dn-ue);
              }

              &_button_wrapper {
                display: flex;
                align-items: center;
                gap: 16px;
              }
            }

            .react-international-phone-country-selector-button {
              border: none !important;
              height: auto !important;
              background-color: transparent !important;
            }

            .react-international-phone-input {
              background-color: transparent !important;
              height: auto;
              border: none !important;
              color: var(--_ctm-dn-it-bx-dn-cr);
              font-family: var(--_ctm-dn-it-bx-dn-ft-fy);
              text-transform: var(--_ctm-dn-it-bx-dn-tt-tm);
              word-wrap: var(--_ctm-dn-it-bx-dn-wd-wp);
              word-break: var(--_ctm-dn-it-bx-dn-wd-bk);
              font-size: var(--_ctm-dn-it-bx-dn-ft-se);
              font-style: var(--_ctm-dn-it-bx-dn-ft-se-ic);
              font-weight: var(--_ctm-dn-it-bx-dn-ft-wt);
              line-height: var(--_ctm-dn-it-bx-dn-le-ht);
              letter-spacing: var(--_ctm-dn-it-bx-dn-lr-sg);
              box-shadow: var(--_ctm-dn-it-bx-dn-sw-ae) var(--_ctm-dn-it-bx-dn-sw-br) var(--_ctm-dn-it-bx-dn-sw-sd) var(--_ctm-dn-it-bx-dn-sw-cr);
              text-align: var(--_ctm-dn-it-bx-dn-tt-an);
              text-decoration: var(--_ctm-dn-it-bx-dn-ue);
            }

            .chk_checkbox_wrapper {
              display: flex;
              width: fit-content;
              align-items: center;
              gap: 12px;

              .discard_btn {
                padding: 12px 16px;
                border-radius: 4px;
                color: var(--_gray-600);

                &:hover {
                  background-color: var(--_gray-100);
                }
              }

              input[type="checkbox"] {
                display: none;
              }

              .payment_program_title {
                font-size: 16px;
                // font-weight: 500;
                // color: var(--_gray-900);
                color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-cr)));
                font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-fy,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-fy,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-fy)));
                text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-tt-tm,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-tt-tm,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-tt-tm)));
                word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-wd-wp,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-wd-wp,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-wd-wp)));
                word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-wd-bk,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-wd-bk,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-wd-bk)));
                // font-size: var(
                //   --_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-se,
                //   var(
                //     --_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-se,
                //     var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-se)
                //   )
                // );
                font-style: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-se-ic,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-se-ic,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-se-ic)));
                font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ft-wt,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ft-wt,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ft-wt)));
                line-height: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-le-ht,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-le-ht,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-le-ht)));
                letter-spacing: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-lr-sg,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-lr-sg,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-lr-sg)));
                text-decoration: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-ue,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-ue,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-ue)));
                padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-pg,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-pg,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-pg)));
                text-align: var(--_ctm-mob-dn-an-tb-pt-md-pt-pm-pm-te-tt-an,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pm-pm-te-tt-an,
                      var(--_ctm-dn-an-tb-pt-md-pt-pm-pm-te-tt-an)));
              }

              .chk_payment_options_use_as_billing_address_chkbx {
                display: flex;
                align-items: center;
                cursor: pointer;
                gap: 10px;
                margin-bottom: 6px;
                font-family: var(--_ctm-mob-dn-an-tb-fm-wr-ls-ft-fy,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-ft-fy, var(--_ctm-dn-an-tb-fm-wr-ls-ft-fy)));
                text-transform: var(--_ctm-mob-dn-an-tb-fm-wr-ls-tt-tm,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-tt-tm, var(--_ctm-dn-an-tb-fm-wr-ls-tt-tm)));
                word-wrap: var(--_ctm-mob-dn-an-tb-fm-wr-ls-wd-wp,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-wd-wp, var(--_ctm-dn-an-tb-fm-wr-ls-wd-wp)));
                word-break: var(--_ctm-mob-dn-an-tb-fm-wr-ls-wd-bk,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-wd-bk, var(--_ctm-dn-an-tb-fm-wr-ls-wd-bk)));
                &.flex__overflow {
                  white-space: normal;
                  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
                }
                color: var(--_ctm-mob-dn-an-tb-fm-wr-ls-cr,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-cr, var(--_ctm-dn-an-tb-fm-wr-ls-cr)));
                font-weight: var(--_ctm-mob-dn-an-tb-fm-wr-ls-ft-wt,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-ft-wt, var(--_ctm-dn-an-tb-fm-wr-ls-ft-wt)));
                font-size: var(--_ctm-mob-dn-an-tb-fm-wr-ls-ft-se,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-ft-se, var(--_ctm-dn-an-tb-fm-wr-ls-ft-se)));
                letter-spacing: var(--_ctm-mob-dn-an-tb-fm-wr-ls-lr-sg,
                    var(--_ctm-tab-dn-an-tb-fm-wr-ls-lr-sg, var(--_ctm-dn-an-tb-fm-wr-ls-lr-sg)));

                .custom-checkbox {
                  width: 20px;
                  height: 20px;
                  border: 1px solid #d0d5dd;
                  border-radius: 4px;
                  position: relative;
                  background-color: #fff;
                  transition: all 0.2s ease;

                  &::after {
                    content: "";
                    position: absolute;
                    display: none;
                    left: 5px;
                    top: 0.5px;
                    width: 5px;
                    height: 10px;
                    border: solid #fff;
                    border-width: 0 2px 2px 0;
                    transform: rotate(45deg);
                  }
                }
              }

              .chk_shipping_address_use_as_billing_address_chkbx {
                display: flex;
                align-items: center;
                cursor: pointer;
                gap: 10px;

                color: var(--_gray-900);
                font-weight: 500;
                font-size: 14px;

                .custom-checkbox {
                  width: 20px;
                  height: 20px;
                  border: 1px solid #d0d5dd;
                  border-radius: 4px;
                  position: relative;
                  background-color: #fff;
                  transition: all 0.2s ease;

                  &::after {
                    content: "";
                    position: absolute;
                    display: none;
                    left: 6px;
                    top: 0.5px;
                    width: 5px;
                    height: 10px;
                    border: solid #fff;
                    border-width: 0 2px 2px 0;
                    transform: rotate(45deg);
                  }
                }
              }

              input[type="checkbox"]:checked+label {
                .custom-checkbox {
                  background-color: var(--_thm-py-bs-dt-se-bd-cr);
                  border-color: var(--_thm-py-bs-dt-se-br-cr);

                  &::after {
                    display: block;
                  }
                }
              }
            }

            .chk_address_actions {
              display: flex;
              gap: 12px;
              margin-top: 16px;
            }

            .chk_payment-card__note {
              padding: 8px 6px;
              display: flex;
              align-items: center;
              gap: 6px;
              padding: 8px 16px;
              background-color: var(--_warning-100);
              color: var(--_warning-700);

              .icon {
                svg {
                  width: var(--_ctm-dn-pt-os-dn-ne-dn-in-se);
                  height: var(--_ctm-dn-pt-os-dn-ne-dn-in-se);

                  path {
                    stroke: var(--_ctm-dn-pt-os-dn-ne-dn-in-c1);
                    // Overrides the stroke-width presentation attribute baked into the icon markup.
                    stroke-width: prepareMediaVariable(--_ctm-dn-pt-os-dn-ne-dn-se-wh, 1.25);
                  }
                }
              }
            }

            .accordion-summary {
              flex: 1;
              display: flex;
              flex-direction: column;
              gap: 0.25rem;

              .summary-content {
                // &.show_button_only {
                //   &:hover {
                //     display: block !important;
                //     background-color: var(--_base-white);
                //   }
                // }
                display: flex;
                flex-wrap: wrap;
                flex-direction: row;
                justify-content: space-between;
                align-items: start;
                padding: 12px;
                border-radius: 4px;
                cursor: pointer;
                transition: background 400ms ease-in;
                // gap: 0.5rem;
                background-color: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-bd-cr,
                    var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-bd-cr,
                      var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-bd-cr)));
                border-color: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-br-cr,
                    var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-br-cr,
                      var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-br-cr)));
                border-style: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-br-se,
                    var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-br-se,
                      var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-br-se)));
                border-width: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-br-wh,
                    var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-br-wh,
                      var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-br-wh)));
                // border-radius: var(
                //   --_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-br-rs,
                //   var(
                //     --_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-br-rs,
                //     var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-br-rs)
                //   )
                // );
                // padding: var(
                //   --_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-pg,
                //   var(
                //     --_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-pg,
                //     var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-pg)
                //   )
                // );
                gap: var(--_ctm-mob-dn-an-tb-sg-ds-as-wr-as-cr-im-gp,
                    var(--_ctm-tab-dn-an-tb-sg-ds-as-wr-as-cr-im-gp,
                      var(--_ctm-dn-an-tb-sg-ds-as-wr-as-cr-im-gp)));

                .chk_shipping-summary {
                  display: flex;
                  flex-direction: column;
                  gap: 12px;
                  max-width: 650px;

                  .chk_address {
                    display: flex;
                    flex-direction: column;
                    gap: calc(var(--_ctm-lt-sd-sg-as-le-gp) / 2);

                    .chk_saved_address_name {
                      color: var(--_gray-900);
                      font-weight: 700;
                      font-size: 16px;
                    }

                    .chk_saved_address {
                      color: var(--_gray-500);
                      font-weight: 400;
                      font-size: 14px;
                      font-weight: 400;
                      margin-top: 6px;
                      line-height: 24px;
                    }
                  }

                  .contact {
                    font-size: 14px;
                    color: var(--_gray-600);
                    line-height: 20px;
                    font-weight: 600;

                    .chk_saved_address_contact {
                      font-size: 14px;
                      color: #101828;
                      line-height: 20px;
                      font-weight: 600;
                    }

                    .chk_saved_address_label {
                      color: var(--_gray-500);
                      font-weight: 500;
                      font-size: 14px;
                    }

                    .chk_saved_address_value {
                      color: var(--_gray-900);
                      font-weight: 600;
                      font-size: 14px;
                      margin-right: 6px;
                    }

                    .chk_saved_address_value+.chk_saved_address_label {
                      margin-left: 6px;
                    }
                  }
                }

                .right-btn {
                  display: flex;
                  align-items: center;
                  gap: 24px;

                  &.selected {
                    display: block;
                  }

                  &:has(.chk_saved_address_button.selected) {
                    display: flex !important;
                    height: fit-content;
                    align-items: center;
                  }

                  .chk_saved_address_button {
                    display: flex;
                    align-items: center;
                    gap: 4px;
                    color: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-cr,
                        var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-cr,
                          var(--_ctm-dn-an-tb-bs-ty-py-hr-se-cr)));

                    &>span {
                      display: flex;
                    }
                  }
                }

                &:hover {
                  .right-btn {
                    display: flex;
                    align-items: center;
                    // height: fit-content;
                  }
                }

                &:hover {
                  background-color: var(--_gray-50);
                }
              }
            }
          }
        }
      }
    }

    // credit card form syles
    .chk_cred_form_details {
      border-top: 1px solid var(--_gray-100);
      padding: 16px;

      .chk_basic_form_title {
        font-size: 14px;
        margin-bottom: 16px;
        font-weight: 600;
      }

      .chk_form_fields {
        width: 100%;

        h3 {
          font-size: 14px;
          margin-bottom: 8px;
        }

        display: flex;
        flex-direction: column;
        gap: 24px;
        width: 500px;

        .chk_form_field {
          width: 100%;

          .est__dropdown__button {
            width: 100%;
            display: flex;
            justify-content: space-between;

            .value__selected {
              justify-content: flex-start;
              align-items: center;
              display: flex;
            }
          }

          &.expiry_details {
            width: 80px;
          }

          display: flex;
          flex-direction: column;
          gap: 6px;
          width: 100%;

          .chk_form_field_label {
            // font-size: 14px;
            // color: var(--_gray-600);
            padding: var(--_ctm-mob-dn-an-tb-fm-wr-ls-pg,
                var(--_ctm-tab-dn-an-tb-fm-wr-ls-pg, var(--_ctm-dn-an-tb-fm-wr-ls-pg)));
            color: var(--_gray-700);
          }

          .chk_form_field_inp {
            width: -webkit-fill-available;
            height: 40px;
            // background-color: var(--_base-white);
            // color: var(--_gray-600);
            // border: 1px solid var(--_gray-300);
            // border-radius: 6px;
            // height: 40px;
            background-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-bd-cr,
                var(--_ctm-tab-dn-an-tb-fm-wr-is-bd-cr, var(--_ctm-dn-an-tb-fm-wr-is-bd-cr)));
            border-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-cr,
                var(--_ctm-tab-dn-an-tb-fm-wr-is-br-cr, var(--_ctm-dn-an-tb-fm-wr-is-br-cr)));
            border-style: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-se,
                var(--_ctm-tab-dn-an-tb-fm-wr-is-br-se, var(--_ctm-dn-an-tb-fm-wr-is-br-se)));
            border-width: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-wh,
                var(--_ctm-tab-dn-an-tb-fm-wr-is-br-wh, var(--_ctm-dn-an-tb-fm-wr-is-br-wh)));
            border-radius: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-rs,
                var(--_ctm-tab-dn-an-tb-fm-wr-is-br-rs, var(--_ctm-dn-an-tb-fm-wr-is-br-rs)));
            padding: var(--_ctm-mob-dn-an-tb-fm-wr-is-pg,
                var(--_ctm-tab-dn-an-tb-fm-wr-is-pg, var(--_ctm-dn-an-tb-fm-wr-is-pg)));

            &::placeholder {
              font-family: var(--_ctm-mob-dn-an-tb-fm-wr-is-ft-fy,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-ft-fy, var(--_ctm-dn-an-tb-fm-wr-is-ft-fy)));
              text-transform: var(--_ctm-mob-dn-an-tb-fm-wr-is-tt-tm,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-tt-tm, var(--_ctm-dn-an-tb-fm-wr-is-tt-tm)));
              word-wrap: var(--_ctm-mob-dn-an-tb-fm-wr-is-wd-wp,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-wd-wp, var(--_ctm-dn-an-tb-fm-wr-is-wd-wp)));
              word-break: var(--_ctm-mob-dn-an-tb-fm-wr-is-wd-bk,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-wd-bk, var(--_ctm-dn-an-tb-fm-wr-is-wd-bk)));
              color: var(--_ctm-mob-dn-an-tb-fm-wr-is-cr,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-cr, var(--_ctm-dn-an-tb-fm-wr-is-cr)));
              font-weight: var(--_ctm-mob-dn-an-tb-fm-wr-is-ft-wt,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-ft-wt, var(--_ctm-dn-an-tb-fm-wr-is-ft-wt)));
              font-size: var(--_ctm-mob-dn-an-tb-fm-wr-is-ft-se,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-ft-se, var(--_ctm-dn-an-tb-fm-wr-is-ft-se)));
              text-decoration: var(--_ctm-mob-dn-an-tb-fm-wr-is-ue,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-ue, var(--_ctm-dn-an-tb-fm-wr-is-ue)));
              letter-spacing: var(--_ctm-mob-dn-an-tb-fm-wr-is-lr-sg,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-lr-sg, var(--_ctm-dn-an-tb-fm-wr-is-lr-sg)));
              line-height: var(--_ctm-mob-dn-an-tb-fm-wr-is-le-ht,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-le-ht, var(--_ctm-dn-an-tb-fm-wr-is-le-ht)));
              font-style: var(--_ctm-mob-dn-an-tb-fm-wr-is-ft-se-ic,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-ft-se-ic, var(--_ctm-dn-an-tb-fm-wr-is-ft-se-ic)));
              text-align: var(--_ctm-mob-dn-an-tb-fm-wr-is-tt-an,
                  var(--_ctm-tab-dn-an-tb-fm-wr-is-tt-an, var(--_ctm-dn-an-tb-fm-wr-is-tt-an)));
            }

            input &:focus-within {
              border: 1px solid var(--_primary-300);
              outline: 2px solid var(--_primary-100);
            }
          }

          .error_msg {
            display: block;
            color: var(--_error-700);
            font-size: 12px;
          }
        }

        .checkbox {
          width: auto;

          label {
            display: flex;
            align-items: center;
            gap: 8px;
            cursor: pointer;
            position: relative;
            user-select: none;

            input[type="checkbox"] {
              display: none;

              &:checked+.custom-checkbox::after {
                opacity: 1;
              }
            }

            .custom-checkbox {
              width: 16px;
              height: 16px;
              border: 2px solid var(--_primary-400);
              border-radius: 4px;
              position: relative;
              display: inline-block;
              box-sizing: border-box;

              &::after {
                content: "";
                position: absolute;
                left: 3px;
                top: 0px;
                width: 4px;
                height: 8px;
                border: solid var(--_primary-400);
                border-width: 0 1px 1px 0;
                transform: rotate(45deg);
                opacity: 0;
                transition: opacity 0.2s ease-in-out;
              }
            }
          }
        }

        .expiry_details {
          display: flex;
          gap: 12px;

          .cvv_inp {
            width: 110px;
          }
        }
      }
    }

    // giftcard form styles
    .chk_gift_card_details {
      border-top: 1px solid var(--_gray-300);
      padding: 16px;

      .chk_gift_card_form {
        display: flex;
        flex-direction: column;
        gap: 16px;
        max-width: 480px;

        .chk_gift_cart_form_title {
          font-size: 14px;
          font-weight: 600;
        }

        .chk_gift_form_fields {
          display: flex;
          gap: 12px;
          width: 100%;

          .chk_gift_inp_field {
            display: flex;
            flex-direction: column;
            gap: 6px;
            width: 100%;

            label {
              color: var(--_gray-600);
            }

            .chk_gift_inp {
              border: 1px solid var(--_gray-300);
              border-radius: 6px;
              height: 40px;
              padding-inline: 10px;

              &:placeholder-shown {
                padding-left: 10px;
                color: var(--_gray-400);
              }

              &:focus {
                border: 1px solid var(--_primary-300);
                outline: 2px solid var(--_primary-100);
              }
            }

            &.pin {
              width: 110px;
            }

            .error_msg {
              display: block;
              color: var(--_error-700);
              font-size: 12px;
            }
          }

          .error_msg {
            color: var(--_error-700);
            font-size: 14px;
          }
        }
      }
    }

    .chk_form_actions {
      display: flex;
      gap: 12px;

      .chk_sav_btn {
        padding: 12px 16px;
        background-color: var(--_thm-py-bs-dt-se-bd-cr);
        border-radius: 6px;
        color: var(--_thm-py-bs-dt-se-tt-cr);
        font-size: 14px;

        &:hover {
          background-color: var(--_thm-py-bs-hr-se-bd-cr);
          color: var(--_thm-py-bs-hr-se-tt-cr);
        }
      }

      .chk_can_btn {
        padding: 12px 16px;
        background-color: transparent;
        border-radius: 6px;
        color: var(--_gray-600);
        padding-inline: 10px;
        font-size: 14px;

        &:hover {
          background-color: var(--_gray-50);
          color: var(--_gray-900);
        }
      }
    }

    .chk_payment_cred_section {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 16px 16px 8px 16px;

      .chk_currency_inp {
        height: 44px;
        border: 1px solid var(--_gray-200);
        border-radius: 4px;
        background-color: var(--_base-white);
        display: flex;
        width: 120px;
        overflow: hidden;
        align-items: center;
        padding-inline: 12px;
        gap: 12px;
        background-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-bd-cr,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-bd-cr, var(--_ctm-dn-an-tb-fm-wr-is-bd-cr)));
        border-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-cr,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-br-cr, var(--_ctm-dn-an-tb-fm-wr-is-br-cr)));
        border-style: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-se,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-br-se, var(--_ctm-dn-an-tb-fm-wr-is-br-se)));
        border-width: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-wh,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-br-wh, var(--_ctm-dn-an-tb-fm-wr-is-br-wh)));
        border-radius: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-rs,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-br-rs, var(--_ctm-dn-an-tb-fm-wr-is-br-rs)));
        padding: var(--_ctm-mob-dn-an-tb-fm-wr-is-pg,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-pg, var(--_ctm-dn-an-tb-fm-wr-is-pg)));

        &:focus-within {
          border: 1px solid var(--_primary-200);
          outline: 2px solid var(--_primary-50);
        }

        input {
          height: inherit;
          background-color: var(--_base-white);

          &:disabled {
            opacity: 0.8;
            cursor: not-allowed;
          }
        }
      }

      .chk_payment_cred_section_col_left {
        .chk_payment_cred_section_col_left_crd_details {
          display: flex;
          gap: 80px;
          align-items: center;

          &>div {
            display: flex;
            gap: 12px;

            .card_icon {
              width: 60px;
              height: 40px;
              border-radius: 4px;
            }

            .card_details {
              .card_details_num {
                // font-size: 12px;
                // font-weight: 600;
                // color: var(--_gray-900);
                font-size: 14px;
                line-height: 20px;
                font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-fy)));
                text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-tt-tm)));
                word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-wp)));
                word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-wd-bk)));
                color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-cr)));
                font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-wt)));
                font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-ft-se)));
                padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg,
                    var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg,
                      var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-te-pg)));
              }

              &>div {
                display: flex;

                .card_details_label {
                  // font-size: 12px;
                  // color: var(--_gray-500);
                  font-size: 12px;
                  font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy)));
                  text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm)));
                  word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp)));
                  word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk)));
                  color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr)));
                  font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt)));
                  // font-size: var(
                  //   --_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se,
                  //   var(
                  //     --_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se,
                  //     var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se)
                  //   )
                  // );
                  padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg)));
                }

                .card_details_value {
                  // font-size: 12px;
                  // color: var(--_gray-900);
                  font-size: 12px;
                  font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc)));
                  text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc)));
                  word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc)));
                  word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc)));
                  color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc)));
                  font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc)));
                  font-size: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc)));
                  padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc,
                      var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc,
                        var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc)));
                }
              }
            }
          }
        }
      }
    }

    .chk_payment_remove_card {
      padding-inline: 16px;
      margin-block: 8px;

      .error_msg {
        font-size: 12px;
        color: var(--_error-700);
      }
    }

    .tertiary_primary_btn {
      // font-size: 12px;
      // color: var(--_primary-400);
      // display: inline-flex;
      // &:hover {
      //   color: var(--_primary-500);
      //   text-decoration: underline;
      // }
      width: fit-content;
      background-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-bd-cr,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-bd-cr, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-bd-cr)));
      border-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-cr,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-cr, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-cr)));
      border-radius: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-rs,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-rs, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-rs)));
      border-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-se,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-se, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-se)));
      border-width: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-wh,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-wh, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-wh)));
      // color: var(
      //   --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-cr,
      //   var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-cr, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-cr))
      // );
      color: var(--_thm-cs-tt-ls-as);
      font-family: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-fy,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-fy, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-fy)));
      text-transform: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-tm,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-tm, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-tm)));
      word-wrap: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-wp,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-wp, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-wp)));
      word-break: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-bk,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-bk, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-bk)));
      font-size: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se)));
      font-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
            var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se-ic)));
      font-weight: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-wt,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-wt, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-wt)));
      // line-height: var(
      //   --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-le-ht,
      //   var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-le-ht, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-le-ht))
      // );
      // letter-spacing: var(
      //   --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-lr-sg,
      //   var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-lr-sg, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-lr-sg))
      // );
      -webkit-text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue)));
      text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue)));
      padding: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-pg,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-pg, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-pg)));
      text-align: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-an,
          var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-an, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-an)));

      &:hover {
        text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-hr-se-ue,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-hr-se-ue, var(--_ctm-dn-an-tb-bs-ty-py-hr-se-ue)));
      }
    }

    .chk_primary_bnt {
      // padding: 12px 24px;
      // background-color: var(--_primary-400);
      // color: var(--_base-white);
      // font-weight: 600;
      // border-radius: 6px;
      // width: max-content;
      // &:hover {
      //   background-color: var(--_primary-500);
      // }
      width: fit-content;
      background-color: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-bd-cr,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-bd-cr, var(--_ctm-dn-an-tb-bs-py-dt-se-bd-cr)));
      border-color: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-br-cr,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-br-cr, var(--_ctm-dn-an-tb-bs-py-dt-se-br-cr)));
      border-radius: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-br-rs,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-br-rs, var(--_ctm-dn-an-tb-bs-py-dt-se-br-rs)));
      border-style: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-br-se,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-br-se, var(--_ctm-dn-an-tb-bs-py-dt-se-br-se)));
      border-width: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-br-wh,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-br-wh, var(--_ctm-dn-an-tb-bs-py-dt-se-br-wh)));
      color: var(--_thm-cs-tt-ls-as);
      // color: var(
      //   --_ctm-mob-dn-an-tb-bs-py-dt-se-cr,
      //   var(--_ctm-tab-dn-an-tb-bs-py-dt-se-cr, var(--_ctm-dn-an-tb-bs-py-dt-se-cr))
      // );
      font-family: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-ft-fy,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-ft-fy, var(--_ctm-dn-an-tb-bs-py-dt-se-ft-fy)));
      text-transform: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-tt-tm,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-tt-tm, var(--_ctm-dn-an-tb-bs-py-dt-se-tt-tm)));
      word-wrap: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-wd-wp,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-wd-wp, var(--_ctm-dn-an-tb-bs-py-dt-se-wd-wp)));
      word-break: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-wd-bk,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-wd-bk, var(--_ctm-dn-an-tb-bs-py-dt-se-wd-bk)));
      font-size: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-ft-se,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-ft-se, var(--_ctm-dn-an-tb-bs-py-dt-se-ft-se)));
      font-style: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-ft-se-ic,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-ft-se-ic, var(--_ctm-dn-an-tb-bs-py-dt-se-ft-se-ic)));
      font-weight: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-ft-wt,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-ft-wt, var(--_ctm-dn-an-tb-bs-py-dt-se-ft-wt)));
      line-height: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-le-ht,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-le-ht, var(--_ctm-dn-an-tb-bs-py-dt-se-le-ht)));
      letter-spacing: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-lr-sg,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-lr-sg, var(--_ctm-dn-an-tb-bs-py-dt-se-lr-sg)));
      text-decoration: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-ue,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-ue, var(--_ctm-dn-an-tb-bs-py-dt-se-ue)));
      padding: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-pg,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-pg, var(--_ctm-dn-an-tb-bs-py-dt-se-pg)));
      text-align: var(--_ctm-mob-dn-an-tb-bs-py-dt-se-tt-an,
          var(--_ctm-tab-dn-an-tb-bs-py-dt-se-tt-an, var(--_ctm-dn-an-tb-bs-py-dt-se-tt-an)));

      &:hover {
        background-color: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-bd-cr,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-bd-cr, var(--_ctm-dn-an-tb-bs-py-hr-se-bd-cr)));
        border-color: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-br-cr,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-br-cr, var(--_ctm-dn-an-tb-bs-py-hr-se-br-cr)));
        border-radius: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-br-rs,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-br-rs, var(--_ctm-dn-an-tb-bs-py-hr-se-br-rs)));
        border-style: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-br-se,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-br-se, var(--_ctm-dn-an-tb-bs-py-hr-se-br-se)));
        border-width: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-br-wh,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-br-wh, var(--_ctm-dn-an-tb-bs-py-hr-se-br-wh)));
        color: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-cr,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-cr, var(--_ctm-dn-an-tb-bs-py-hr-se-cr)));
        font-family: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-ft-fy,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-ft-fy, var(--_ctm-dn-an-tb-bs-py-hr-se-ft-fy)));
        text-transform: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-tt-tm,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-tt-tm, var(--_ctm-dn-an-tb-bs-py-hr-se-tt-tm)));
        word-wrap: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-wd-wp,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-wd-wp, var(--_ctm-dn-an-tb-bs-py-hr-se-wd-wp)));
        word-break: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-wd-bk,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-wd-bk, var(--_ctm-dn-an-tb-bs-py-hr-se-wd-bk)));
        font-size: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-ft-se,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-ft-se, var(--_ctm-dn-an-tb-bs-py-hr-se-ft-se)));
        font-style: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-ft-se-ic,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-ft-se-ic, var(--_ctm-dn-an-tb-bs-py-hr-se-ft-se-ic)));
        font-weight: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-ft-wt,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-ft-wt, var(--_ctm-dn-an-tb-bs-py-hr-se-ft-wt)));
        line-height: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-le-ht,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-le-ht, var(--_ctm-dn-an-tb-bs-py-hr-se-le-ht)));
        letter-spacing: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-lr-sg,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-lr-sg, var(--_ctm-dn-an-tb-bs-py-hr-se-lr-sg)));
        text-decoration: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-ue,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-ue, var(--_ctm-dn-an-tb-bs-py-hr-se-ue)));
        padding: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-pg,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-pg, var(--_ctm-dn-an-tb-bs-py-hr-se-pg)));
        text-align: var(--_ctm-mob-dn-an-tb-bs-py-hr-se-tt-an,
            var(--_ctm-tab-dn-an-tb-bs-py-hr-se-tt-an, var(--_ctm-dn-an-tb-bs-py-hr-se-tt-an)));
      }
    }

    .chk_secondary_bnt {
      padding: 16px 24px;
      background-color: transparent;
      color: var(--_gray-600);
      font-weight: 600;
      border-radius: 6px;

      &:hover {
        background-color: var(--_gray-50);
        color: var(--_gray-900);
      }
    }

    // gift card styles
    .chk_gft_crd_wrapper {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 16px;

      &_item {
        display: flex;
        align-items: center;
        gap: 16px;

        &_icon {
          width: 40px;
          height: 40px;
          border: 1px solid var(--_gray-200);
          border-radius: 6px;
          display: flex;
          justify-content: center;
          align-items: center;
        }

        &_info {
          display: flex;
          flex-direction: column;

          &_title {
            font-size: 14px;
            margin-bottom: 4px;
            font-weight: 600;
          }

          &_desc {
            display: flex;
            gap: 4px;

            &_divider {
              width: 1px;
              height: 10px;
              background-color: #667085;
              display: block;
            }

            &_value {
              font-size: 12px;
              font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy-dc)));
              text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm-dc)));
              word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp-dc)));
              word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk-dc)));
              color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr-dc)));
              font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt-dc)));
              // font-size: var(
              //   --_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc,
              //   var(
              //     --_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc,
              //     var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se-dc)
              //   )
              // );
              padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg-dc)));
              // font-size: 12px;
              // color: var(--_gray-600);
            }

            &_label {
              // font-size: 12px;
              // color: var(--_gray-900);
              font-size: 12px;
              // color: var(--_gray-500);
              font-family: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-fy)));
              text-transform: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-tt-tm)));
              word-wrap: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-wp)));
              word-break: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-wd-bk)));
              color: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-cr)));
              font-weight: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-wt)));
              // font-size: var(
              //   --_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se,
              //   var(
              //     --_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se,
              //     var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-ft-se)
              //   )
              // );
              padding: var(--_ctm-mob-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg,
                  var(--_ctm-tab-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg,
                    var(--_ctm-dn-an-tb-pt-md-pt-pe-pl-by-pl-io-pg)));
            }
          }
        }

        &_pin {
          margin-left: 36px;

          input[type="number"] {
            border: 1px solid var(--_gray-300);
            border-radius: 4px;
            background-color: var(--_base-white);
            width: 95px;
            height: 44px;
            padding-inline: 10px;

            &:focus {
              outline: 2px solid var(--_primary-100);
              border: 1px solid var(--_primary-300);
            }

            &:disabled {
              opacity: 0.8;
              cursor: not-allowed;
            }
          }
        }
      }

      &_input {
        border: 1px solid var(--_gray-300);
        border-radius: 4px;
        background-color: var(--_base-white);
        height: 44px;
        width: 120px;
        display: flex;
        align-items: center;
        gap: 8px;
        padding-left: 10px;

        input[type="number"] {
          background-color: var(--_base-white);
          padding-right: 10px;

          &:disabled {
            opacity: 0.8;
            cursor: not-allowed;
          }
        }

        &:focus-within {
          outline: 2px solid var(--_primary-100);
          border: 1px solid var(--_primary-300);
        }
      }
    }

    .chk_gft_crd_wrapper {
      &_btn {
        background-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-bd-cr,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-bd-cr, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-bd-cr)));
        border-color: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-cr,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-cr, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-cr)));
        border-radius: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-rs,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-rs, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-rs)));
        border-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-se,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-se, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-se)));
        border-width: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-br-wh,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-br-wh, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-br-wh)));
        // color: var(
        //   --_ctm-mob-dn-an-tb-bs-ty-py-dt-se-cr,
        //   var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-cr, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-cr))
        // );
        color: var(--_thm-cs-tt-ls-as);
        font-family: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-fy,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-fy, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-fy)));
        text-transform: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-tm,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-tm, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-tm)));
        word-wrap: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-wp,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-wp, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-wp)));
        word-break: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-wd-bk,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-wd-bk, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-wd-bk)));
        font-size: 14px;
        font-style: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-se-ic,
              var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-se-ic)));
        font-weight: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ft-wt,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ft-wt, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ft-wt)));
        line-height: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-le-ht,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-le-ht, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-le-ht)));
        letter-spacing: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-lr-sg,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-lr-sg, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-lr-sg)));
        -webkit-text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue)));
        text-decoration: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-ue,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-ue, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-ue)));
        padding: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-pg,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-pg, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-pg)));
        text-align: var(--_ctm-mob-dn-an-tb-bs-ty-py-dt-se-tt-an,
            var(--_ctm-tab-dn-an-tb-bs-ty-py-dt-se-tt-an, var(--_ctm-dn-an-tb-bs-ty-py-dt-se-tt-an)));

        &:hover {
          text-decoration: underline;
        }
      }
    }

    .add_credit_card {
      display: flex;
      gap: 12px;
      padding: 16px;

      .cc_icon {
        svg {
          width: 18px;
          height: 14px;
        }
      }

      .cc_info {
        display: flex;
        justify-content: space-between;
        width: 100%;
        gap: 6px;

        .cc_title {
          font-size: 14px;
          font-weight: 600;
        }
      }
    }

    .add_new_credit_card {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding-inline: 16px;
    }

    .cc_tertiary_btn {
      // color: var(--_primary-400);
      color: var(--_thm-cs-tt-ls-as);

      &:hover {
        // color: var(--_primary-500);
        color: var(--_thm-cs-tt-ls-as);
        text-decoration: underline;
      }
    }

    .gc_tertiary_btn {
      // color: var(--_primary-400);
      color: var(--_thm-cs-tt-ls-as);
      font-size: 14px;
      line-height: auto;

      &:hover {
        color: var(--_thm-cs-tt-ls-as);
        text-decoration: underline;
      }

      &:disabled {
        opacity: 0.5;
        pointer-events: none;
        text-decoration: none;
      }
    }

    .chk_currency_inp_sec {
      .chk_currency_inp {
        height: 40px;
        border: 1px solid var(--_gray-200);
        border-radius: 4px;
        background-color: var(--_base-white);
        display: flex;
        width: 120px;
        overflow: hidden;
        align-items: center;
        padding-inline: 12px;
        gap: 12px;
        background-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-bd-cr,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-bd-cr, var(--_ctm-dn-an-tb-fm-wr-is-bd-cr)));
        border-color: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-cr,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-br-cr, var(--_ctm-dn-an-tb-fm-wr-is-br-cr)));
        border-style: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-se,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-br-se, var(--_ctm-dn-an-tb-fm-wr-is-br-se)));
        border-width: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-wh,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-br-wh, var(--_ctm-dn-an-tb-fm-wr-is-br-wh)));
        border-radius: var(--_ctm-mob-dn-an-tb-fm-wr-is-br-rs,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-br-rs, var(--_ctm-dn-an-tb-fm-wr-is-br-rs)));
        padding: var(--_ctm-mob-dn-an-tb-fm-wr-is-pg,
            var(--_ctm-tab-dn-an-tb-fm-wr-is-pg, var(--_ctm-dn-an-tb-fm-wr-is-pg)));

        &:focus-within {
          border: 1px solid var(--_primary-200);
          outline: 2px solid var(--_primary-50);
        }

        input {
          height: inherit;
        }
      }
    }
  }
}

//  .add_new_credit_card {
//       display: flex;
//       justify-content: space-between;
//       align-items: center;
//       padding-inline: 16px;
//     }
//     .cc_tertiary_btn {
//       // color: var(--_primary-400);
//       color: var(--_thm-cs-tt-ls-as);

//       &:hover {
//         // color: var(--_primary-500);
//         color: var(--_thm-cs-tt-ls-as);
//         text-decoration: underline;
//       }
//     }

//     .gc_tertiary_btn {
//       // color: var(--_primary-400);
//       color: var(--_thm-cs-tt-ls-as);
//       font-size: 14px;
//       line-height: auto;

//       &:hover {
//         color: var(--_thm-cs-tt-ls-as);
//         text-decoration: underline;
//       }
//     }