{"id":41121,"date":"2025-02-09T05:17:22","date_gmt":"2025-02-09T04:17:22","guid":{"rendered":"https:\/\/permis111.com\/?page_id=41121"},"modified":"2025-12-12T00:26:59","modified_gmt":"2025-12-11T23:26:59","slug":"login","status":"publish","type":"page","link":"https:\/\/permis111.com\/pt\/login\/","title":{"rendered":"Se connecter"},"content":{"rendered":"\n<style>\n    .kivicare-modern-auth * {\n        margin: 0;\n        padding: 0;\n        box-sizing: border-box;\n    }\n    \n    .kivicare-modern-auth {\n        font-family: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n        background: #f5f5f5;\n        min-height: 60vh;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        padding: 40px 20px;\n    }\n    \n    .kivicare-login-container {\n        background: white;\n        padding: 50px 45px;\n        width: 100%;\n        max-width: 480px;\n        border-radius: 8px;\n        box-shadow: 0 2px 20px rgba(0,0,0,0.1);\n    }\n    \n    .kivicare-logo {\n        text-align: center;\n        margin-bottom: 35px;\n    }\n    \n    .kivicare-logo h1 {\n        color: #333;\n        font-size: 28px;\n        font-weight: 600;\n        margin-bottom: 10px;\n    }\n    \n    .kivicare-logo p {\n        color: #666;\n        font-size: 15px;\n        font-weight: 400;\n    }\n    \n    .kivicare-form-group {\n        margin-bottom: 22px;\n    }\n    \n    .kivicare-form-group label {\n        display: block;\n        font-weight: 600;\n        color: #333;\n        margin-bottom: 10px;\n        font-size: 14px;\n    }\n    \n    .kivicare-form-group label span {\n        color: #dc3545;\n    }\n    \n    .kivicare-form-group input {\n        width: 100%;\n        padding: 14px 18px;\n        border: 1px solid #e0e0e0;\n        background: #f8f9fa;\n        border-radius: 6px;\n        font-size: 15px;\n        transition: all 0.3s;\n        color: #333;\n    }\n    \n    .kivicare-form-group input:focus {\n        outline: none;\n        border-color: #7E1710;\n        background: #fff;\n    }\n    \n    .kivicare-form-group input::placeholder {\n        color: #999;\n    }\n    \n    .kivicare-password-wrapper {\n        position: relative;\n    }\n    \n    .kivicare-password-wrapper input {\n        padding-right: 45px;\n    }\n    \n    .kivicare-toggle-password {\n        position: absolute;\n        right: 15px;\n        top: 50%;\n        transform: translateY(-50%);\n        background: none;\n        border: none;\n        cursor: pointer;\n        color: #999;\n        font-size: 16px;\n        padding: 5px;\n        transition: color 0.3s;\n    }\n    \n    .kivicare-toggle-password:hover {\n        color: #7E1710;\n    }\n    \n    .kivicare-remember-me {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        font-size: 14px;\n        margin-bottom: 30px;\n    }\n    \n    .kivicare-remember-me label {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n        color: #666;\n        cursor: pointer;\n        user-select: none;\n        margin: 0;\n        font-weight: 400;\n    }\n    \n    .kivicare-remember-me input[type=\"checkbox\"] {\n        width: 18px;\n        height: 18px;\n        cursor: pointer;\n        accent-color: #7E1710;\n    }\n    \n    .kivicare-remember-me a {\n        color: #7E1710;\n        text-decoration: none;\n        font-weight: 500;\n        transition: color 0.3s;\n    }\n    \n    .kivicare-remember-me a:hover {\n        color: #5d110c;\n    }\n    \n    .kivicare-btn-login {\n        width: 100%;\n        padding: 15px;\n        background: #7E1710;\n        color: white;\n        border: none;\n        border-radius: 6px;\n        font-size: 16px;\n        font-weight: 600;\n        cursor: pointer;\n        transition: background 0.3s;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        gap: 10px;\n        position: relative;\n    }\n    \n    .kivicare-btn-login:hover {\n        background: #5d110c;\n    }\n    \n    .kivicare-btn-login:active {\n        transform: scale(0.98);\n    }\n    \n    .kivicare-btn-login:disabled {\n        background: #ccc;\n        cursor: not-allowed;\n        opacity: 0.6;\n    }\n    \n    .kivicare-btn-login.loading {\n        pointer-events: none;\n        background: #7E1710 !important;\n        opacity: 1 !important;\n    }\n    \n    .kivicare-btn-login.loading .btn-text {\n        visibility: hidden;\n    }\n    \n    .kivicare-btn-login .spinner {\n        position: absolute;\n        left: 50%;\n        top: 50%;\n        transform: translate(-50%, -50%);\n        width: 20px;\n        height: 20px;\n        border: 3px solid rgba(255,255,255,0.3);\n        border-top-color: white;\n        border-radius: 50%;\n        animation: kivicare-spin 0.8s linear infinite;\n        display: none;\n    }\n    \n    .kivicare-btn-login.loading .spinner {\n        display: block;\n    }\n    \n    @keyframes kivicare-spin {\n        to { transform: translate(-50%, -50%) rotate(360deg); }\n    }\n    \n    .kivicare-alert {\n        padding: 14px 18px;\n        border-radius: 6px;\n        margin-bottom: 25px;\n        font-size: 14px;\n        display: none;\n    }\n    \n    .kivicare-alert.show {\n        display: flex;\n        align-items: center;\n        gap: 10px;\n    }\n    \n    .kivicare-alert i {\n        font-size: 18px;\n    }\n    \n    .kivicare-alert.alert-danger {\n        background: #f8d7da;\n        color: #721c24;\n        border: 1px solid #f5c6cb;\n    }\n    \n    .kivicare-alert.alert-danger i {\n        color: #dc3545;\n    }\n    \n    .kivicare-alert.alert-success {\n        background: #d4edda;\n        color: #155724;\n        border: 1px solid #c3e6cb;\n    }\n    \n    .kivicare-alert.alert-success i {\n        color: #28a745;\n    }\n    \n    @media (max-width: 480px) {\n        .kivicare-login-container {\n            padding: 35px 25px;\n        }\n        \n        .kivicare-logo h1 {\n            font-size: 24px;\n        }\n    }\n<\/style>\n\n<div class=\"kivicare-modern-auth\" dir=''>\n    <div class=\"kivicare-login-container\">\n        <div class=\"kivicare-logo\">\n            <h1><i class=\"fas fa-sign-in-alt\"><\/i> Connexion<\/h1>\n            <p>Connectez-vous \u00e0 votre compte<\/p>\n        <\/div>\n        \n        <div class=\"kivicare-alert alert-danger\" id=\"kivicare-login-error\">\n            <i class=\"fas fa-exclamation-triangle\"><\/i>\n            <span id=\"kivicare-login-error-msg\"><\/span>\n        <\/div>\n        \n        <div class=\"kivicare-alert alert-success\" id=\"kivicare-login-success\">\n            <i class=\"fas fa-check-circle\"><\/i>\n            <span id=\"kivicare-login-success-msg\"><\/span>\n        <\/div>\n        \n        <form id=\"kivicare-modern-login-form\">\n            <div class=\"kivicare-form-group\">\n                <label for=\"loginUsername\">\n                    Adresse Email                    <span>*<\/span>\n                <\/label>\n                <input \n                    type=\"text\" \n                    name=\"username\" \n                    id=\"loginUsername\"\n                    placeholder=\"infos@example.com\"\n                    required \n                    autofocus>\n            <\/div>\n            \n            <div class=\"kivicare-form-group\">\n                <label for=\"loginPassword\">\n                    Mot de passe                    <span>*<\/span>\n                <\/label>\n                <div class=\"kivicare-password-wrapper\">\n                    <input \n                        type=\"password\" \n                        name=\"password\" \n                        id=\"loginPassword\"\n                        placeholder=\"\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\"\n                        required>\n                    <button type=\"button\" class=\"kivicare-toggle-password\" onclick=\"kivicareTogglePassword()\" aria-label=\"Afficher le mot de passe\">\n                        <i class=\"fas fa-eye\" id=\"kivicare-eye-icon\"><\/i>\n                    <\/button>\n                <\/div>\n            <\/div>\n            \n            <div class=\"kivicare-remember-me\">\n                <label>\n                    <input type=\"checkbox\" name=\"remember-me\" id=\"kivicare-remember-me\">\n                    <span>Se souvenir de moi<\/span>\n                <\/label>\n                <a href=\"https:\/\/permis111.com\/pt\/mon-compte\/lost-password\/\" target=\"_blank\">\n                    Mot de passe oubli\u00e9 ?                <\/a>\n            <\/div>\n            \n            <button type=\"submit\" class=\"kivicare-btn-login\" id=\"kivicare-btn-login\">\n                <span class=\"btn-text\">\n                    <i class=\"fas fa-sign-in-alt\"><\/i> \n                    Se connecter                <\/span>\n                <span class=\"spinner\"><\/span>\n            <\/button>\n        <\/form>\n    <\/div>\n<\/div>\n\n<script>\n(function($) {\n    'use strict';\n    \n    window.kivicareTogglePassword = function() {\n        const passwordInput = document.getElementById('loginPassword');\n        const eyeIcon = document.getElementById('kivicare-eye-icon');\n        \n        if (passwordInput.type === 'password') {\n            passwordInput.type = 'text';\n            eyeIcon.className = 'fas fa-eye-slash';\n        } else {\n            passwordInput.type = 'password';\n            eyeIcon.className = 'fas fa-eye';\n        }\n    };\n    \n    function kivicareShowError(message) {\n        const errorDiv = document.getElementById('kivicare-login-error');\n        const errorMsg = document.getElementById('kivicare-login-error-msg');\n        const successDiv = document.getElementById('kivicare-login-success');\n        \n        errorMsg.innerHTML = message;\n        errorDiv.classList.add('show');\n        successDiv.classList.remove('show');\n    }\n    \n    function kivicareShowSuccess(message) {\n        const successDiv = document.getElementById('kivicare-login-success');\n        const successMsg = document.getElementById('kivicare-login-success-msg');\n        const errorDiv = document.getElementById('kivicare-login-error');\n        \n        successMsg.textContent = message;\n        successDiv.classList.add('show');\n        errorDiv.classList.remove('show');\n    }\n    \n    const post = (route, data = {}) => {\n        window.ajaxurl = 'https:\/\/permis111.com\/wp-admin\/admin-ajax.php';\n        window.nonce = '0abae89a41';\n        \n        let url = window.ajaxurl + '?action=ajax_post';\n        \n        data.route_name = route;\n        data._ajax_nonce = window.nonce;\n        \n        return new Promise((resolve, reject) => {\n            axios.post(url, data)\n                .then((response) => {\n                    if (response.data.status_code !== undefined && response.data.status_code === 403) {\n                        kivicareShowError('Route not found');\n                    }\n                    resolve(response);\n                })\n                .catch((error) => {\n                    reject(error);\n                    kivicareShowError('Internal server error');\n                });\n        });\n    };\n    \n    $(document).on('submit', '#kivicare-modern-login-form', function(event) {\n        event.preventDefault();\n        \n        const btnLogin = document.getElementById('kivicare-btn-login');\n        btnLogin.classList.add('loading');\n        \n        var result = {};\n        $.each($(this).serializeArray(), function() {\n            result[this.name] = this.value;\n        });\n        \n        post('login_new_user', result)\n            .then((response) => {\n                btnLogin.classList.remove('loading');\n                \n                if (response.data.status !== undefined && response.data.status === true) {\n                    kivicareShowSuccess(response.data.message || 'Connexion r\u00e9ussie ! Redirection...');\n                    setTimeout(() => {\n                        location.href = response.data.login_redirect_url;\n                    }, 1000);\n                } else {\n                    kivicareShowError(response.data.message || 'Identifiants incorrects');\n                }\n            })\n            .catch((error) => {\n                btnLogin.classList.remove('loading');\n                kivicareShowError('Erreur de connexion au serveur');\n                console.log(error);\n            });\n    });\n    \n})(jQuery);\n<\/script>\n\n\n\n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-41121","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/permis111.com\/pt\/wp-json\/wp\/v2\/pages\/41121","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/permis111.com\/pt\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/permis111.com\/pt\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/permis111.com\/pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/permis111.com\/pt\/wp-json\/wp\/v2\/comments?post=41121"}],"version-history":[{"count":7,"href":"https:\/\/permis111.com\/pt\/wp-json\/wp\/v2\/pages\/41121\/revisions"}],"predecessor-version":[{"id":42104,"href":"https:\/\/permis111.com\/pt\/wp-json\/wp\/v2\/pages\/41121\/revisions\/42104"}],"wp:attachment":[{"href":"https:\/\/permis111.com\/pt\/wp-json\/wp\/v2\/media?parent=41121"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}