<div class="modal-overlay" id="typeAvancementModal">
    <div class="modal">
        <div class="modal-header">
            <h2 id="modalTitle">Ajouter un Type d'Avancement</h2>
            <button class="modal-close" onclick="closeModal()">&times;</button>
        </div>
        <div class="modal-body">
            <form id="typeAvancementForm" onsubmit="event.preventDefault();">
                <input type="hidden" id="typeAvancementId">
                <div class="form-group" style="margin-bottom: 15px;">
                    <label for="code" style="display:block; margin-bottom:5px;">Code *</label>
                    <input type="text" id="code" style="width:100%; padding:8px; border:1px solid #ccc; border-radius:4px;" required placeholder="Ex: REC">
                </div>
                <div class="form-group" style="margin-bottom: 15px;">
                    <label for="libelle" style="display:block; margin-bottom:5px;">Libellé *</label>
                    <input type="text" id="libelle" style="width:100%; padding:8px; border:1px solid #ccc; border-radius:4px;" required placeholder="Ex: Reclasselement">
                </div>
                <div class="form-group" style="margin-bottom: 15px;">
                    <label for="description" style="display:block; margin-bottom:5px;">Description</label>
                    <textarea id="description" rows="3" style="width:100%; padding:8px; border:1px solid #ccc; border-radius:4px;" placeholder="Description de l'avancement..."></textarea>
                </div>
                <div class="form-group" style="margin-bottom: 15px;">
                    <label for="status" style="display:block; margin-bottom:5px;">Statut</label>
                    <select id="status" style="width:100%; padding:8px; border:1px solid #ccc; border-radius:4px;">
                        <option value="active">Actif</option>
                        <option value="inactive">Inactif</option>
                    </select>
                </div>
            </form>
        </div>
        <div class="modal-footer">
            <button class="btn btn-secondary" onclick="closeModal()">Annuler</button>
            <button class="btn btn-primary" onclick="saveTypeAvancement()">Enregistrer</button>
        </div>
    </div>
</div>