{"id":663,"date":"2026-01-10T15:33:48","date_gmt":"2026-01-10T14:33:48","guid":{"rendered":"https:\/\/juricoservices.com\/?page_id=663"},"modified":"2026-01-10T18:46:37","modified_gmt":"2026-01-10T17:46:37","slug":"creation","status":"publish","type":"page","link":"https:\/\/juricoservices.com\/index.php\/creation\/","title":{"rendered":"Cr\u00e9ation"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"663\" class=\"elementor elementor-663\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-87e92a7 e-flex e-con-boxed e-con e-parent\" data-id=\"87e92a7\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-45c4368 elementor-widget elementor-widget-shortcode\" data-id=\"45c4368\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">    <div id=\"creation-form-container\">\n        <h2>Cr\u00e9ation de votre soci\u00e9t\u00e9<\/h2>\n        \n                \n        <form id=\"creation-societe-form\" method=\"post\" enctype=\"multipart\/form-data\" action=\"\">\n            <!-- \u00c9tape 1: Forme juridique -->\n            <div class=\"form-etape active\" id=\"etape-1\">\n                <h3>1. Forme juridique<\/h3>\n                <div class=\"choix-forme-juridique\">\n                    <label class=\"choix-option\">\n                        <input type=\"radio\" name=\"forme_juridique\" value=\"SARL\" required>\n                        <div class=\"option-content\">\n                            <strong>SARL<\/strong>\n                            <p>Soci\u00e9t\u00e9 \u00e0 Responsabilit\u00e9 Limit\u00e9e<\/p>\n                        <\/div>\n                    <\/label>\n                    \n                    <label class=\"choix-option\">\n                        <input type=\"radio\" name=\"forme_juridique\" value=\"SARL_AU\">\n                        <div class=\"option-content\">\n                            <strong>SARL A.U<\/strong>\n                            <p>SARL \u00e0 Associ\u00e9 Unique<\/p>\n                        <\/div>\n                    <\/label>\n                    \n                    <label class=\"choix-option\">\n                        <input type=\"radio\" name=\"forme_juridique\" value=\"SAS\">\n                        <div class=\"option-content\">\n                            <strong>SAS<\/strong>\n                            <p>Soci\u00e9t\u00e9 par Actions Simplifi\u00e9e<\/p>\n                        <\/div>\n                    <\/label>\n                    \n                    <label class=\"choix-option\">\n                        <input type=\"radio\" name=\"forme_juridique\" value=\"SA\">\n                        <div class=\"option-content\">\n                            <strong>SA<\/strong>\n                            <p>Soci\u00e9t\u00e9 Anonyme<\/p>\n                        <\/div>\n                    <\/label>\n                <\/div>\n                \n                <div class=\"boutons-navigation\">\n                    <button type=\"button\" class=\"btn-suivant\" data-next=\"etape-2\">Suivant \u2192<\/button>\n                <\/div>\n            <\/div>\n\n            <!-- \u00c9tape 2: Adresse et domiciliation -->\n            <div class=\"form-etape\" id=\"etape-2\">\n                <h3>2. Adresse et domiciliation<\/h3>\n                \n                <div class=\"form-group\">\n                    <label for=\"ville\">Ville *<\/label>\n                    <input type=\"text\" id=\"ville\" name=\"ville\" required placeholder=\"Saisir la ville\">\n                <\/div>\n                \n                <div class=\"form-group\">\n                    <label for=\"adresse\">Adresse compl\u00e8te *<\/label>\n                    <textarea id=\"adresse\" name=\"adresse\" rows=\"3\" required placeholder=\"Saisir l'adresse compl\u00e8te\"><\/textarea>\n                <\/div>\n                \n                <div class=\"form-group\">\n                    <label>Choix de la domiciliation *<\/label>\n                    <select name=\"choix_domiciliation\" required>\n                        <option value=\"\">S\u00e9lectionnez une option<\/option>\n                        <option value=\"Chez Jurico Services\">Chez Jurico Services<\/option>\n                        <option value=\"Vous poss\u00e9dez d\u00e9j\u00e0 un contrat de bail\">Vous poss\u00e9dez d\u00e9j\u00e0 un contrat de bail<\/option>\n                    <\/select>\n                <\/div>\n                \n                <div class=\"boutons-navigation\">\n                    <button type=\"button\" class=\"btn-precedent\" data-prev=\"etape-1\">\u2190 Pr\u00e9c\u00e9dent<\/button>\n                    <button type=\"button\" class=\"btn-suivant\" data-next=\"etape-3\">Suivant \u2192<\/button>\n                <\/div>\n            <\/div>\n\n            <!-- \u00c9tape 3: Noms de soci\u00e9t\u00e9 -->\n            <div class=\"form-etape\" id=\"etape-3\">\n                <h3>3. Noms propos\u00e9s pour votre soci\u00e9t\u00e9<\/h3>\n                <p class=\"description-etape\">Proposez 3 d\u00e9nominations pour votre soci\u00e9t\u00e9 (par ordre de pr\u00e9f\u00e9rence)<\/p>\n                \n                <div class=\"form-group\">\n                    <label for=\"nom_societe_1\">Nom 1 *<\/label>\n                    <input type=\"text\" id=\"nom_societe_1\" name=\"nom_societe_1\" required placeholder=\"Premier choix\">\n                <\/div>\n                \n                <div class=\"form-group\">\n                    <label for=\"nom_societe_2\">Nom 2<\/label>\n                    <input type=\"text\" id=\"nom_societe_2\" name=\"nom_societe_2\" placeholder=\"Deuxi\u00e8me choix\">\n                <\/div>\n                \n                <div class=\"form-group\">\n                    <label for=\"nom_societe_3\">Nom 3<\/label>\n                    <input type=\"text\" id=\"nom_societe_3\" name=\"nom_societe_3\" placeholder=\"Troisi\u00e8me choix\">\n                <\/div>\n                \n                <div class=\"boutons-navigation\">\n                    <button type=\"button\" class=\"btn-precedent\" data-prev=\"etape-2\">\u2190 Pr\u00e9c\u00e9dent<\/button>\n                    <button type=\"button\" class=\"btn-suivant\" data-next=\"etape-4\">Suivant \u2192<\/button>\n                <\/div>\n            <\/div>\n\n            <!-- \u00c9tape 4: Informations personnelles et parts -->\n            <div class=\"form-etape\" id=\"etape-4\">\n                <h3>4. Vos informations et r\u00e9partition des parts<\/h3>\n                \n                <div class=\"form-row\">\n                    <div class=\"form-group\">\n                        <label for=\"nom_client\">Votre nom *<\/label>\n                        <input type=\"text\" id=\"nom_client\" name=\"nom_client\" required placeholder=\"Votre nom\">\n                    <\/div>\n                    \n                    <div class=\"form-group\">\n                        <label for=\"prenom_client\">Votre pr\u00e9nom *<\/label>\n                        <input type=\"text\" id=\"prenom_client\" name=\"prenom_client\" required placeholder=\"Votre pr\u00e9nom\">\n                    <\/div>\n                <\/div>\n                \n                <div class=\"form-group\">\n                    <label for=\"cin_document\">Importez votre CIN recto-verso *<\/label>\n                    <input type=\"file\" id=\"cin_document\" name=\"cin_document\" accept=\"image\/*,.pdf\" required>\n                    <small>Formats accept\u00e9s: JPG, PNG, PDF. Taille max: 5MB<\/small>\n                <\/div>\n                \n                <div class=\"form-group\">\n                    <label for=\"activite_entreprise\">Activit\u00e9 de l'entreprise *<\/label>\n                    <input type=\"text\" id=\"activite_entreprise\" name=\"activite_entreprise\" value=\"IT\" required>\n                    <small>Exemple: IT, Commerce, Services, etc.<\/small>\n                <\/div>\n                \n                <div class=\"form-group\">\n                    <label for=\"email\">Email *<\/label>\n                    <input type=\"email\" id=\"email\" name=\"email\" required placeholder=\"votre@email.com\">\n                <\/div>\n                \n                <div class=\"form-group\">\n                    <label for=\"password\">Mot de passe *<\/label>\n                    <input type=\"password\" id=\"password\" name=\"password\" required placeholder=\"Cr\u00e9ez un mot de passe\">\n                <\/div>\n                \n                <!-- Section des parts (dynamique) -->\n                <div class=\"form-group\">\n                    <label>R\u00e9partition des parts *<\/label>\n                    <div id=\"parts-container\">\n                        <!-- Les parts seront ajout\u00e9es dynamiquement ici -->\n                    <\/div>\n                    <button type=\"button\" id=\"ajouter-part\" class=\"btn-ajouter\" style=\"display: none;\">\n                        + Ajouter une part\n                    <\/button>\n                <\/div>\n                \n                <div class=\"form-group checkbox\">\n                    <input type=\"checkbox\" id=\"accept_conditions\" name=\"accept_conditions\" required>\n                    <label for=\"accept_conditions\">J'accepte les conditions g\u00e9n\u00e9rales et la politique de confidentialit\u00e9 *<\/label>\n                <\/div>\n                \n                <div class=\"boutons-navigation\">\n                    <button type=\"button\" class=\"btn-precedent\" data-prev=\"etape-3\">\u2190 Pr\u00e9c\u00e9dent<\/button>\n                    <button type=\"submit\" name=\"submit_creation\" class=\"btn-submit\">Envoyer la demande<\/button>\n                <\/div>\n            <\/div>\n        <\/form>\n    <\/div>\n\n    <style>\n    \/* Styles pour le formulaire *\/\n    #creation-form-container {\n        max-width: 800px;\n        margin: 0 auto;\n        padding: 30px;\n        background: white;\n        border-radius: 10px;\n        box-shadow: 0 5px 20px rgba(0,0,0,0.1);\n    }\n    \n    .form-etape {\n        display: none;\n        animation: fadeIn 0.5s ease;\n    }\n    \n    .form-etape.active {\n        display: block;\n    }\n    \n    @keyframes fadeIn {\n        from { opacity: 0; transform: translateY(20px); }\n        to { opacity: 1; transform: translateY(0); }\n    }\n    \n    h2, h3 {\n        color: #333;\n        margin-bottom: 20px;\n    }\n    \n    .description-etape {\n        color: #666;\n        margin-bottom: 25px;\n    }\n    \n    .choix-forme-juridique {\n        display: grid;\n        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n        gap: 15px;\n        margin-bottom: 30px;\n    }\n    \n    .choix-option {\n        border: 2px solid #ddd;\n        border-radius: 8px;\n        padding: 20px;\n        cursor: pointer;\n        transition: all 0.3s ease;\n    }\n    \n    .choix-option:hover {\n        border-color: #0073aa;\n        background: #f8f9fa;\n    }\n    \n    .choix-option input[type=\"radio\"] {\n        display: none;\n    }\n    \n    .choix-option input[type=\"radio\"]:checked + .option-content {\n        border-color: #0073aa;\n        background: #e7f3ff;\n    }\n    \n    .option-content {\n        padding: 10px;\n        border-radius: 5px;\n    }\n    \n    .option-content strong {\n        display: block;\n        font-size: 18px;\n        margin-bottom: 5px;\n        color: #0073aa;\n    }\n    \n    .option-content p {\n        margin: 0;\n        color: #666;\n        font-size: 14px;\n    }\n    \n    .form-group {\n        margin-bottom: 20px;\n    }\n    \n    .form-row {\n        display: grid;\n        grid-template-columns: 1fr 1fr;\n        gap: 15px;\n    }\n    \n    label {\n        display: block;\n        margin-bottom: 8px;\n        font-weight: 600;\n        color: #333;\n    }\n    \n    input[type=\"text\"],\n    input[type=\"email\"],\n    input[type=\"password\"],\n    select,\n    textarea {\n        width: 100%;\n        padding: 12px 15px;\n        border: 1px solid #ddd;\n        border-radius: 6px;\n        font-size: 16px;\n        transition: border-color 0.3s;\n    }\n    \n    input:focus,\n    select:focus,\n    textarea:focus {\n        outline: none;\n        border-color: #0073aa;\n        box-shadow: 0 0 0 3px rgba(0, 115, 170, 0.1);\n    }\n    \n    .checkbox {\n        display: flex;\n        align-items: center;\n        gap: 10px;\n    }\n    \n    .checkbox input[type=\"checkbox\"] {\n        width: auto;\n    }\n    \n    small {\n        display: block;\n        margin-top: 5px;\n        color: #666;\n        font-size: 13px;\n    }\n    \n    \/* Section des parts *\/\n    .part-item {\n        display: flex;\n        gap: 10px;\n        align-items: center;\n        margin-bottom: 10px;\n        padding: 15px;\n        background: #f8f9fa;\n        border-radius: 6px;\n        border-left: 4px solid #0073aa;\n    }\n    \n    .part-item input {\n        flex: 1;\n    }\n    \n    .btn-supprimer-part {\n        background: #dc3545;\n        color: white;\n        border: none;\n        border-radius: 50%;\n        width: 30px;\n        height: 30px;\n        cursor: pointer;\n        font-size: 18px;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n    \n    .btn-supprimer-part:hover {\n        background: #c82333;\n    }\n    \n    .btn-ajouter {\n        background: #28a745;\n        color: white;\n        border: none;\n        padding: 10px 20px;\n        border-radius: 6px;\n        cursor: pointer;\n        font-size: 14px;\n    }\n    \n    .btn-ajouter:hover {\n        background: #218838;\n    }\n    \n    \/* Boutons de navigation *\/\n    .boutons-navigation {\n        display: flex;\n        justify-content: space-between;\n        margin-top: 30px;\n        padding-top: 20px;\n        border-top: 1px solid #eee;\n    }\n    \n    .btn-precedent,\n    .btn-suivant,\n    .btn-submit {\n        padding: 12px 30px;\n        border: none;\n        border-radius: 6px;\n        font-size: 16px;\n        cursor: pointer;\n        transition: all 0.3s;\n    }\n    \n    .btn-precedent {\n        background: #6c757d;\n        color: white;\n    }\n    \n    .btn-precedent:hover {\n        background: #5a6268;\n    }\n    \n    .btn-suivant,\n    .btn-submit {\n        background: #0073aa;\n        color: white;\n    }\n    \n    .btn-suivant:hover,\n    .btn-submit:hover {\n        background: #005a87;\n    }\n    \n    .btn-submit {\n        background: #28a745;\n    }\n    \n    .btn-submit:hover {\n        background: #218838;\n    }\n    \n    \/* Messages *\/\n    .success-message, .error-message {\n        padding: 15px;\n        border-radius: 5px;\n        margin-bottom: 20px;\n    }\n    \n    .success-message {\n        background: #d4edda;\n        color: #155724;\n        border: 1px solid #c3e6cb;\n    }\n    \n    .error-message {\n        background: #f8d7da;\n        color: #721c24;\n        border: 1px solid #f5c6cb;\n    }\n    <\/style>\n\n    <script>\n    document.addEventListener('DOMContentLoaded', function() {\n        \/\/ Initialiser les parts\n        function initialiserParts() {\n            const partsContainer = document.getElementById('parts-container');\n            const ajouterPartBtn = document.getElementById('ajouter-part');\n            const forme = document.querySelector('input[name=\"forme_juridique\"]:checked');\n            \n            if (!forme) return;\n            \n            partsContainer.innerHTML = '';\n            \n            if (forme.value === 'SARL' || forme.value === 'SARL_AU') {\n                \/\/ SARL: une seule part\n                partsContainer.innerHTML = `\n                    <div class=\"part-item\">\n                        <input type=\"text\" name=\"parts_nom[]\" placeholder=\"Nom associ\u00e9\" value=\"Associ\u00e9 unique\" readonly>\n                        <input type=\"number\" name=\"parts_pourcentage[]\" value=\"100\" readonly>\n                        <span>%<\/span>\n                    <\/div>\n                `;\n                ajouterPartBtn.style.display = 'none';\n            } else {\n                \/\/ SAS\/SA: plusieurs parts\n                partsContainer.innerHTML = `\n                    <div class=\"part-item\">\n                        <input type=\"text\" name=\"parts_nom[]\" placeholder=\"Nom associ\u00e9\" required>\n                        <input type=\"number\" name=\"parts_pourcentage[]\" placeholder=\"%\" min=\"1\" max=\"100\" required>\n                        <span>%<\/span>\n                        <button type=\"button\" class=\"btn-supprimer-part\" style=\"display: none;\">\u00d7<\/button>\n                    <\/div>\n                `;\n                ajouterPartBtn.style.display = 'block';\n            }\n        }\n        \n        \/\/ Gestion du changement de forme juridique\n        document.querySelectorAll('input[name=\"forme_juridique\"]').forEach(radio => {\n            radio.addEventListener('change', function() {\n                initialiserParts();\n            });\n        });\n        \n        \/\/ Initialiser les parts au chargement\n        initialiserParts();\n        \n        \/\/ Ajouter une part suppl\u00e9mentaire\n        document.getElementById('ajouter-part').addEventListener('click', function() {\n            const partsContainer = document.getElementById('parts-container');\n            const newPart = document.createElement('div');\n            newPart.className = 'part-item';\n            newPart.innerHTML = `\n                <input type=\"text\" name=\"parts_nom[]\" placeholder=\"Nom associ\u00e9\" required>\n                <input type=\"number\" name=\"parts_pourcentage[]\" placeholder=\"%\" min=\"1\" max=\"100\" required>\n                <span>%<\/span>\n                <button type=\"button\" class=\"btn-supprimer-part\">\u00d7<\/button>\n            `;\n            partsContainer.appendChild(newPart);\n            \n            \/\/ Afficher le bouton supprimer sur tous les items sauf le premier\n            const partItems = partsContainer.querySelectorAll('.part-item');\n            partItems.forEach((item, index) => {\n                const deleteBtn = item.querySelector('.btn-supprimer-part');\n                if (deleteBtn) {\n                    deleteBtn.style.display = index === 0 ? 'none' : 'block';\n                }\n            });\n        });\n        \n        \/\/ Supprimer une part\n        document.addEventListener('click', function(e) {\n            if (e.target.classList.contains('btn-supprimer-part')) {\n                const partItem = e.target.closest('.part-item');\n                if (partItem && document.querySelectorAll('.part-item').length > 1) {\n                    partItem.remove();\n                }\n            }\n        });\n        \n        \/\/ Navigation entre \u00e9tapes\n        document.querySelectorAll('.btn-suivant').forEach(btn => {\n            btn.addEventListener('click', function() {\n                const etapeActuelleDiv = document.querySelector('.form-etape.active');\n                const nextEtapeId = this.getAttribute('data-next');\n                const nextEtape = document.getElementById(nextEtapeId);\n                \n                if (nextEtape) {\n                    etapeActuelleDiv.classList.remove('active');\n                    nextEtape.classList.add('active');\n                }\n            });\n        });\n        \n        document.querySelectorAll('.btn-precedent').forEach(btn => {\n            btn.addEventListener('click', function() {\n                const etapeActuelleDiv = document.querySelector('.form-etape.active');\n                const prevEtapeId = this.getAttribute('data-prev');\n                const prevEtape = document.getElementById(prevEtapeId);\n                \n                if (prevEtape) {\n                    etapeActuelleDiv.classList.remove('active');\n                    prevEtape.classList.add('active');\n                }\n            });\n        });\n        \n        \/\/ Indicateur visuel pour les champs requis\n        const inputs = document.querySelectorAll('input, select, textarea');\n        inputs.forEach(input => {\n            input.addEventListener('blur', function() {\n                if (this.hasAttribute('required') && !this.value.trim()) {\n                    this.style.borderColor = '#dc3545';\n                } else {\n                    this.style.borderColor = '#ddd';\n                }\n            });\n            \n            input.addEventListener('input', function() {\n                if (this.value.trim()) {\n                    this.style.borderColor = '#28a745';\n                }\n            });\n        });\n    });\n    <\/script>\n    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"inline_featured_image":false,"footnotes":""},"class_list":["post-663","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/juricoservices.com\/index.php\/wp-json\/wp\/v2\/pages\/663","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/juricoservices.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/juricoservices.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/juricoservices.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/juricoservices.com\/index.php\/wp-json\/wp\/v2\/comments?post=663"}],"version-history":[{"count":28,"href":"https:\/\/juricoservices.com\/index.php\/wp-json\/wp\/v2\/pages\/663\/revisions"}],"predecessor-version":[{"id":695,"href":"https:\/\/juricoservices.com\/index.php\/wp-json\/wp\/v2\/pages\/663\/revisions\/695"}],"wp:attachment":[{"href":"https:\/\/juricoservices.com\/index.php\/wp-json\/wp\/v2\/media?parent=663"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}