
<div class="discourse-subscriptions-section-columns">
  <div class="section-column discourse-subscriptions-confirmation-billing">
    <h2>
      {{model.product.name}}
    </h2>

    <hr>

    <p>
      {{model.product.description}}
    </p>
  </div>
  <div class="section-column">
    {{#unless model.product.subscribed}}
      <h2>
        {{i18n 'discourse_subscriptions.subscribe.card.title'}}
      </h2>

      <hr>

      {{payment-options
        plans=model.plans
        paymentsAllowed=paymentsAllowed
        planTypeIsSelected=planTypeIsSelected
      }}

      <hr>

      {{subscribe-card cardElement=cardElement}}

      {{#if loading}}
        {{loading-spinner}}
      {{else}}
        {{#d-button
          disabled=loading
          action="stripePaymentHandler"
          class="btn btn-primary btn-payment"}}
          {{buttonText}}
        {{/d-button}}
      {{/if}}

    {{/unless}}
  </div>
</div>
