@extends('layout.master')
@section('content')
@section('fpactive','active')
<br></br><br></br><br></br>
<div class="checkout-area">
            <div class="container">
                <form action="https://www.myascom.com/commandes" method="POST">
                    <input type="hidden" name="_token" value="5QFseICyTC9RHVcabknqC6yZ8vgky3F73MUfH7yb">                    <div class="row">
                        <div class="col-lg-6 col-md-6">
                            <div class="checkbox-form">
                                <h3>Details sur l'Investisseur</h3>
                                <div class="row">
                                                                            <div class="col-md-6">
                                            <div class="checkout-form-list">
                                                <label for="nom">Nom <span class="required">*</span></label>
                                                <input type="text" class="form-control " name="nom" value="" required="" autocomplete="nom" autofocus="" id="nom" placeholder="Nom" minlength="3">
                                                                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="checkout-form-list">
                                                <label for="prenoms">Prénoms <span class="required">*</span></label>
                                                <input type="text" class="form-control " name="prenoms" value="" required="" autocomplete="prenoms" id="prenoms" placeholder="Prénoms" minlength="3">
                                                                                            </div>
                                        </div>
                                       
                                        <div class="col-md-6 normalHeightInput">
                                            <div class="checkout-form-list">
                                                <label for="identifiant">Identifiant<span class="required">*</span></label>
                                                <input type="text" class="form-control " name="identifiant" value="" required="" autofocus="" autocomplete="identifiant" id="identifiant" placeholder="Email / Numéro" style="height: auto; padding:8px;" minlength="8">
                                                                                            </div>
                                        </div>
                                                                        <div class="col-md-6 mt-4">
                                        <div class="checkout-form-list">
                                            <label for="ville">Ville <span class="required">*</span></label>
                                            <input type="text" class="form-control " name="ville" value="" required="" autocomplete="ville" id="ville" placeholder="Ville" minlength="3">
                                                                                    </div>
                                    </div>
                                    
                                    <div class="col-md-6 mt-4">
                                        
                                    </div>
                                    <!-- <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label for="complement">Complement d'adresse</label>
                                            <input type="text" class="form-control " name="complement" value="" autocomplete="complement" id="complement" placeholder="Complement">
                                                                                    </div>
                                    </div> -->
                                        <!--  <div class="col-md-6 mt-4">
                                            <div class="checkout-form-list create-acc mb-30">
                                                <input id="CreerCompte" name="CreerCompte" value="CreerCompte" type="checkbox" checked="">
                                                <label for="CreerCompte">Creer un compte?</label>
                                            </div>
                                        </div> -->
                                        
                                       <!--  <div class="col-md-6 normalHeightInput" id="divPassword">
                                            <div class="checkout-form-list">
                                                <label for="password">Mot de passe <span class="required">*</span></label>
                                                <input type="password" class="form-control " name="password" value="" id="password" placeholder="Mot de passe" style="height: auto; padding:8px;" minlength="8">
                                             </div>
                                        </div> -->
                                        <script>
                                            var compte = document.querySelector('#CreerCompte');
                                            var divPassword = document.querySelector('#divPassword');
                                            var inputPassword = document.querySelector('#password');

                                            compte.onchange = function() {
                                                if(compte.checked){
                                                    divPassword.style.display = '';
                                                    inputPassword.setAttribute("required", "");
                                                } else {
                                                    divPassword.style.display = 'none';
                                                    inputPassword.removeAttribute("required");
                                                }
                                            }
                                        </script>
                                                                    </div>
                               
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-6">
                            <div class="your-order">
                                <h3 align="center">Financement</h3>
                                <div class="your-order-table table-responsive">
                                    <table>
                                        <thead>
                                            <tr>
                                                <th class="product-name">Produit</th>
                                                <th class="product-total">Total</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                                                                            <tr class="cart_item">
                                                    <td class="product-name">
                                                        Sac à main en cuir brillant <strong class="product-quantity"> × 1</strong>
                                                    </td>
                                                    <td class="product-total">
                                                        <span class="amount">7500F CFA</span>
                                                    </td>
                                                </tr>
                                                                                    </tbody>
                                        <tfoot>
                                            <tr class="cart-subtotal">
                                                <th>Sous-total</th>
                                                <td><span class="amount">7 500F CFA</span></td>
                                            </tr>
                                            <tr class="order-total">
                                                <th>Total</th>
                                                <td><strong><span class="amount">7 500F CFA</span></strong>
                                                </td>
                                            </tr>
                                        </tfoot>
                                    </table>
                                </div>
                                <div class="payment-method">
                                    <div class="payment-accordion">
                                        <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                                            <div class="panel panel-default">
                                                <div class="panel-heading" role="tab" id="headingTwo">
                                                    <h4 class="panel-title">
                                                        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                                        Mobile money
                                                    </a>
                                                    </h4>
                                                </div>
                                                <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
                                                    <div class="panel-body">
                                                        <p>Vous pouvez payer votre commande par mobile money, nous acceptons seulement les moyens disponibles au TOGO à savoir FLOOZ de MOOV et TMONEY de TOGOCEL.  </p>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="panel panel-default">
                                                <div class="panel-heading" role="tab" id="headingThree">
                                                    <h4 class="panel-title">
                                                        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                                                        Carte bancaire
                                                    </a>
                                                    </h4>
                                                </div>
                                                <div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                                                    <div class="panel-body">
                                                        <p>Vous pouvez aussi payer par carte bancaire, nous acceptons les paiements par carte Visa et MasterCard.</p>
                                                    </div>
                                                </div>
                                            </div>
                                    </div>
                                        <div class="sponsor-button">
                                        	<a href="https://cinetpay.com/"> Passer au paiement
                                            </a>
                                        </div>
                                        <br></br>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
@endsection