{% set utilisateur  = equipement.clientUtilisateur %}
<div id="popup-transformer-souscripteur-{{ equipement.id }}" style="display:none;" >
    <div class="px-4 py-4 d-flex justify-content-center align-items-center flex-column" style="width:964px;"  >
        <form class="form" action="{{ path('equipement_utilisateur_souscripteur', {id : equipement.id}) }}" method="POST" onsubmit="$('#close_popup_utilisateur_souscripteur-{{ equipement.id }}').click();">
            <input type="hidden" name="type_transformation" value="" id="type_transformation-{{ equipement.id }}">
            <div class="color-primary mb-4 text-center" style="font-size:1.2rem;">Voulez vous que {{ (utilisateur.etatCivil ? utilisateur.etatCivil.libelleCourt : '') ~ ' ' ~ utilisateur.nomEntreprise ~ ' ' ~ utilisateur.nom ~ ' ' ~ utilisateur.prenom }} devienne souscripteur de l'équipement suivant ou d'un nouvel équipement?</div>
                <div class="d-flex justify-content-center">
                    <div class="border-grey-medium p-2 mb-2 me-3 choix-block" style="width:300px;border-radius:12px;cursor:pointer" data-target="#btn-submit-transformer-souscripteur-{{ equipement.id }}" onclick="$('#type_transformation-{{ equipement.id }}').val('meme_equipement');">
                        <div class="d-flex justify-content-between">
                            <span><b>{{ equipement.numSeriePrincipal }}</b></span>
                            <span class="text-right"><b>{{ equipement.EquipementTypePuissance ? equipement.EquipementTypePuissance.EquipementType.type : '' }}</b></span>
                        </div>
                        {{ equipement.EquipementFamille and equipement.EquipementFamille ? equipement.EquipementFamille.libelle : '' }}
                        <br/>
                        <br/>
                        <span class="mt-2 w-100">
                        <span class="bg-primary me-1" style="padding: 4px;border-radius: 3px;padding-top:2px;"> {{ equipement.EquipementFamilleContrat ? equipement.EquipementFamilleContrat.code }}</span>
                        &nbsp;{{ equipement.adresse.codePostal ~ ' ' ~ equipement.adresse.ville}}
                    </span>
                    </div>
                    <div style="padding:20px;flex-direction: column;cursor:pointer;height:92px;border-radius: 12px" class="border-grey-medium d-flex choix-block" data-target="#btn-submit-transformer-souscripteur-{{ equipement.id }}" onclick="$('#type_transformation-{{ equipement.id }}').val('new_equipement');">
                        <div class="align-self-center mb-2"><i class="fa fa-plus fa-lg"></i></div>
                        <div>Nouvel équipement</div>
                    </div>
                </div>

            <div class="form-group d-flex justify-content-center mt-4">
                <div class="form-actions-row">
                    <button  class="btn btn-danger btn-close-popup"  id="close_popup_utilisateur_souscripteur-{{ equipement.id }}" data-dxpopup-id="popup-transformer-souscripteur-{{ equipement.id }}" >Fermer</button>
                    <input type="submit" class="btn btn-success"  style="display: none;" id="btn-submit-transformer-souscripteur-{{ equipement.id }}" value="Valider">
                </div>
            </div>
        </form>
    </div>
</div>