chromium/chrome/browser/resources/settings/autofill_page/credit_card_list_entry.html

    <style include="settings-shared passwords-shared screen-reader-only">
      .expiration-column,
      .misc-column {
        align-items: center;
        display: flex;
      }

      .misc-column {
        justify-content: flex-end;
      }

      .list-item {
        margin-bottom: 8px;
        margin-top: 8px;
      }

      .sub-label {
        color: var(--cr-secondary-text-color);
      }

      #paymentsIcon {
        vertical-align: middle;
      }

      #cardImage {
        margin-inline-end: 16px;
        vertical-align: middle;
      }
    </style>
    <div class="list-item" role="row">
      <div class="type-column" role="cell">
        <img id="cardImage" srcset="[[getCardImage_(creditCard.imageSrc)]]" alt="">
        <div class="summary-column screen-reader-only-host-node">
          <div class="screen-reader-only">
            [[getSummaryAriaLabel_(creditCard)]],
            [[getSummaryAriaSublabel_(creditCard)]]
          </div>
          <div id="summaryLabel" class="ellipses" aria-hidden="true">
            [[creditCard.metadata.summaryLabel]]
          </div>
          <div id="summarySublabel" class="sub-label">
            <span aria-hidden="true">[[getSummarySublabel_(creditCard)]]</span>
            <template is="dom-if" if="[[isCardBenefitsProductUrlAvailable_(creditCard)]]">
              | <a id="summaryTermsLink"
                  aria-label="[[getBenefitsTermsAriaLabel_(creditCard)]]"
                  aria-description="$i18n{opensInNewTab}"
                  on-click="onSummarySublabelTermsLinkClick_"
                  href="[[getCardBenefitsProductUrl_(creditCard)]]"
                  target="_blank">$i18n{benefitsTermsTagForCreditCardListEntry}</a>
            </template>
          </div>
        </div>
      </div>
      <div class="expiration-column">
        <div role="cell" class="misc-column">
          <div id="paymentsIndicator"
              hidden$="[[!shouldShowPaymentsIndicator_(creditCard.metadata)]]">
            <if expr="_google_chrome">
              <picture id="paymentsIcon">
                <source
                    srcset="[[getScaledSrcSet_('chrome://theme/IDR_AUTOFILL_GOOGLE_PAY_DARK_SMALL')]]"
                    media="(prefers-color-scheme: dark)">
                <img alt="" srcset="[[getScaledSrcSet_('chrome://theme/IDR_AUTOFILL_GOOGLE_PAY_SMALL')]]">
              </picture>
            </if>
            <if expr="not _google_chrome">
              <span class="sub-label">
                $i18n{googlePayments}
              </span>
            </if>
          </div>
          <template is="dom-if" if="[[showDots_(creditCard.metadata)]]">
            <cr-icon-button class="icon-more-vert" id="creditCardMenu"
                title="[[moreActionsTitle_(creditCard)]]"
                on-click="onDotsMenuClick_">
            </cr-icon-button>
          </template>
          <template is="dom-if" if="[[!showDots_(creditCard.metadata)]]">
            <cr-icon-button class="icon-external" id="remoteCreditCardLink"
                title="$i18n{remotePaymentMethodsLinkLabel}" role="link"
                on-click="onRemoteEditClick_"></cr-icon-button>
          </template>
        </div>
      </div>
    </div>