<script id="tmpl-nf-field-squareform" type="text/template" />
    <input type="hidden" data-id="{{{ data.id }}}" id="nf-field-{{{ data.id }}}" name="nf-field-{{{ data.id }}}" class="{{{ data.renderClasses() }}} nf-element nf-squareFormField" type="text" value="{{{ data.id }}}" {{{ data.renderPlaceholder() }}}>
    <div>
        <div class="ninja_square_container " data-id="{{{data.id}}}" id="gf_sqquare_container_">   
            <div class="messages"></div>
            <!-- <div class="single-element-configuration">
                <div class="element-toLeft">
                    <div class="gfsq-ccard-container">
                        <div class="gfsq-card">
                            <div class="gfsq-front"></div>
                            <div class="gfsq-back"></div>
                        </div>
                    </div>
                    <div id="ninja-square-card-number-{{{data.id}}}" class="nf-field-element"></div>   
                </div>
                <div class="element-toRight">
                    <div id="ninja-square-expiration-date-{{{data.id}}}" class="nf-field-element"></div>
                    <div id="ninja-square-cvv-{{{data.id}}}" class="nf-field-element"></div>
                    <div id="ninja-square-postal-code-{{{data.id}}}" class="nf-field-element"></div>
                </div>
            </div> 

            <div class="nf-form-fields">       
                <label class="nf-field-label" for="cf7-square-card-number-"  >Card Number</label>     
                <div id="ninja-square-card-number-{{{data.id}}}" class="nf-field-element"></div>
            </div>  
            <div class="nf-form-fields date">    
                <label class="nf-field-label" for="cf7-square-expiration-date-"  >Expiry (MM/YY)</label>    
                <div id="ninja-square-expiration-date-{{{data.id}}}" class="nf-field-element"></div>     
            </div>  
            <div class="nf-form-fields cvv">   
                <label class="nf-field-label" for="cf7-square-cvv-"  >Card Code</label>      
                <div id="ninja-square-cvv-{{{data.id}}}" class="nf-field-element"></div>
            </div>    
            <div class="nf-form-fields">     
                <label class="nf-field-label" for="cf7-square-postal-code-"  >Card Postal Code</label>     
                <div id="ninja-square-postal-code-{{{data.id}}}" class="nf-field-element"></div>              
            </div> -->
			<div  id="payment-form">
				<div id="card-container_payment"></div>
			</div>
			<div id="payment-status-container"></div>
			<input type="hidden" id="card-nonce" class="card-nonce">
        </div>
    </div>

</script>