{% load i18n %}

<div class="form-horizontal stripe-container">
    <div class="stripe-errors sr-only">

    </div>
    <noscript>
        <div class="alert alert-warning">
            {% trans "For a credit card payment, please turn on JavaScript." %}
        </div>
    </noscript>

    {% if request.session.payment_stripe_token %}
        <div id="stripe-current-card">
            <p>{% blocktrans trimmed %}
                You already entered a card number that we will use to charge the payment amount.
            {% endblocktrans %}</p>
            <dl class="dl-horizontal">
                <dt>{% trans "Card type" %}</dt>
                <dd id="stripe_card_brand_display">{{ request.session.payment_stripe_brand }}</dd>
                <dt>{% trans "Card number" %}</dt>
                <dd>
                    **** **** ****
                    <span id="stripe_card_last4_display">{{ request.session.payment_stripe_last4 }}</span>
                    <button class="btn btn-xs btn-default" id="stripe_other_card" type="button">
                        {% trans "Use a different card" %}
                    </button>
                </dd>
            </dl>
        </div>
    {% endif %}

    <div id="stripe-card" class="form-control">
        <span class="fa fa-spinner fa-spin"></span>
        <!-- a Stripe Element will be inserted here. -->
    </div>
    <p class="help-block">
        {% blocktrans trimmed %}
            Your payment will be processed by Stripe, Inc. Your credit card data will be transmitted directly to
            Stripe and never touches our servers.
        {% endblocktrans %}
        <input type="hidden" name="stripe_token" value="{{ request.session.payment_stripe_token }}" id="stripe_token"/>
        <input type="hidden" name="stripe_card_last4" value="{{ request.session.payment_stripe_last4 }}"
                id="stripe_card_last4"/>
        <input type="hidden" name="stripe_card_brand" value="{{ request.session.payment_stripe_brand }}"
                id="stripe_card_brand"/>
    </p>
</div>

