<div id="pricegrid" data-frequency="single">
    <div id="pricegrid_single" class="row g-1 gy-1 toggleablePrice mb-2">
    {% for price in pricesSingle %}
        <div class="col-6 col-sm-4">
            <input type="radio" class="btn-check" name="donation_amount" id="id_donation_amount_{{ loop.index0 }}_single" value="{{ price }}" autocomplete="off" {% if price == form.defaultDonation.single %} checked {% endif %} />
            <label class="btn btn-secondary w-100" for="id_donation_amount_{{ loop.index0 }}_single">{{ "$%d"|format(price // 100) }}</label>
        </div>
    {% endfor %}
    </div>
    <div id="pricegrid_monthly" class="row g-1 gy-1 hidden toggleablePrice mb-2">
    {% for price in pricesMonthly %}
        <div class="col-6 col-sm-4">
            <input type="radio" class="btn-check" name="donation_amount" id="id_donation_amount_{{ loop.index0 }}_monthly" value="{{ price }}" autocomplete="off" />
            <label class="btn btn-secondary w-100" for="id_donation_amount_{{ loop.index0 }}_monthly">{{ "$%d"|format(price // 100) }}</label>
        </div>
    {% endfor %}
    </div>
    <div class="input-group customDonation-container">
        <span class="input-group-text tiny">$</span>
        {{ form.custom_donation }}
        <span class="input-group-text">USD</span>
        <div class="invalid-feedback">
            {{ error_msg }}
        </div>
    </div>
</div>
