@extends("template2")
@section("conteudo")
<div class="central">
	<div class="conteudo">
		<div class="rows">
			<div class="col-12 m-auto text-center pt-4">
				<span class="d-block text-center h4 text-escuro mt-1">Pagamento <span class="text-azul">via Cartão</span> </span>
			</div>
		</div>
		
		<div class="card pag1">
		<input type="hidden"  id="cliente_id" value="" > 
		<input type="hidden"  id="cobranca_id" value="" >
		<form id="form-checkout" >
		<div class="p-3 px-md">
		
    		<div class="rows">
        		<div class="col-4 mb-3">
        				<strong class="text-label">Número do cartão:</strong>
        			   <input type="text" name="cardNumber" id="form-checkout__cardNumber" value="5502096551067143" class="form-campo"/>
        		</div>
        		<div class="col-2 mb-3">
        				<strong class="text-label">Validade</strong>
    			   <input type="text" name="cardExpirationDate" id="form-checkout__cardExpirationDate" value="11/2028" class="form-campo"/>
    		  </div>
    		  <div class="col-6 mb-3">
        				<strong class="text-label">Titular do cartão:</strong>
    			   <input type="text" name="cardholderName" id="form-checkout__cardholderName" value="Manoel Nascimento" class="form-campo"/>
    		  </div>
    		  <div class="col-6 mb-3">
        				<strong class="text-label">Email</strong>
    			   <input type="email" name="cardholderEmail" id="form-checkout__cardholderEmail" value="mjailton@gmail.com" class="form-campo"/>
    		 </div>
    		 <div class="col-3 mb-3">
        				<strong class="text-label">Cód Segurança</strong>
    			   <input type="text" name="securityCode" id="form-checkout__securityCode" value="622" class="form-campo"/>
    	     </div>
    	   		<select name="issuer" id="form-checkout__issuer" class="form-campo" style="display:none"></select>
    		
    		<div class="col-3 mb-3">
        				<strong class="text-label">Tipo Documento</strong>
    			   <select name="identificationType" id="form-checkout__identificationType" class="form-campo"></select>
    	    </div>
    	    <div class="col-6 mb-3">
        				<strong class="text-label">Número do Documento:</strong>
    			   <input type="text" name="identificationNumber" id="form-checkout__identificationNumber" value="78589452387" class="form-campo" />
    	    </div>
    	    <div class="col-6 mb-3">
        			<strong class="text-label">Parcelas</strong>
    			   <select name="installments" id="form-checkout__installments" class="form-campo"></select>
    		</div>
    	    <div class="col-12">
				<progress value="0" class="progress-bar" style="width:100%">Carregando...</progress>
    		</div>
    			   
    		</div>
		</div>
		<div class="tfooter end">
    			<button type="submit" id="form-checkout__submit" class="btn btn-verde">Pagar</button>
				<a href="javascript:;" onclick="fecharModal()" class="btn btn-vermelho fechar">Fechar</a>
    		</div>
		
		</form>
	</div>
	
	</div>

  
</div>




@endsection