    <style>
        /* General Styles */
        a {
            text-decoration: none!important;
        }

        button {
            text-decoration: none!important;
        }

        /* Login Form Container */
        .keypro-login-form-container {
            max-width: 500px;
            margin: 0 auto;
            padding: 20px;
            background-color: #fff;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.05);
        }

        /* Form Settings Box */
        .keypro-settings-box {
            background-color: #fff;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.05);
            padding: 1.5rem;
            margin-bottom: 1.5rem;
        }

        .keypro-settings-box-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 1.5rem;
            padding-bottom: 1rem;
            border-bottom: 1px solid #e0e0e0;
        }

        .keypro-settings-box-header h3 {
            font-size: 1.1rem;
            font-weight: 600;
            color: #2c3e50;
            margin: 0;
        }

        /* Form Rows */
        .keypro-form-row {
            margin-bottom: 0px;
        }

        .keypro-form-row label {
            display: block;
            margin-bottom: 5px;
            font-weight: 600;
            color: #2c3e50;
        }

        .keypro-form-row input[type="text"],
        .keypro-form-row input[type="password"] {
            width: 100%;
            padding: 10px;
            border: 1px solid #e0e0e0;
            border-radius: 4px;
            font-size: 1rem;
        }

        .keypro-form-row input[type="text"]:focus,
        .keypro-form-row input[type="password"]:focus {
            border-color: #1C9954;
            outline: none;
            box-shadow: 0 0 0 2px rgba(28, 153, 84, 0.2);
        }

        /* Checkbox Style */
        .keypro-checkbox-label {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            cursor: pointer;
        }

        .keypro-checkbox-label input[type="checkbox"] {
            width: 18px;
            height: 18px;
        }

        /* Button Styles */
        .keypro-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0.6rem 1.2rem;
            border-radius: 4px;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s ease;
            text-decoration: none;
            border: none;
            font-size: 0.9rem;
            box-shadow: none !important;
            -webkit-box-shadow: none !important;
            text-shadow: none !important;
        }

        .keypro-btn-primary {
            background-color: #1C9954;
            color: #ffffff;
        }

        .keypro-btn-primary:hover {
            background-color: #17703F;
            transform: translateY(-2px);
        }

        .keypro-btn-outline {
            background-color: transparent;
            border: 1px solid #e0e0e0;
            color: #333;
        }

        .keypro-btn-outline:hover {
            background-color: #f5f7fa;
            border-color: #666;
        }

        /* Form Actions */
        .keypro-form-actions {
            display: flex;
            gap: 1rem;
            margin-top: 20px;
        }

        /* Links */
        .keypro-action-link {
            display: inline-block;
            color: #1C9954;
            text-decoration: none;
            font-weight: 500;
            padding: 0.4rem 0.8rem;
            border-radius: 4px;
            transition: all 0.3s ease;
        }

        .keypro-action-link:hover {
            background-color: rgba(28, 153, 84, 0.1);
            color: #17703F;
            text-decoration: none;
        }

        /* Notifications */
        .keypro-notification {
            padding: 15px;
            border-radius: 4px;
            margin-bottom: 20px;
            font-weight: 500;
            text-align: center;
        }

        .keypro-notification.success {
            background-color: rgba(46, 204, 113, 0.15);
            color: #2ecc71;
            border: 1px solid rgba(46, 204, 113, 0.3);
        }

        .keypro-notification.error {
            background-color: rgba(231, 76, 60, 0.15);
            color: #e74c3c;
            border: 1px solid rgba(231, 76, 60, 0.3);
        }

        /* Elementor árnyék felülírások */
        .keypro-btn,
        .keypro-btn-primary,
        .keypro-btn-outline,
        #keypro-login-form .keypro-btn,
        #keypro-login-form .keypro-btn-primary,
        #keypro-login-form .keypro-btn-outline,
        .keypro-login-form-container .keypro-btn,
        .keypro-login-form-container .keypro-btn-primary,
        .keypro-login-form-container .keypro-btn-outline {
            box-shadow: none !important;
            -webkit-box-shadow: none !important;
            text-shadow: none !important;
        }
        
        /* A gomb hover állapotban sem lehet árnyék */
        .keypro-btn:hover,
        .keypro-btn-primary:hover,
        .keypro-btn-outline:hover,
        #keypro-login-form .keypro-btn:hover,
        #keypro-login-form .keypro-btn-primary:hover,
        #keypro-login-form .keypro-btn-outline:hover,
        .keypro-login-form-container .keypro-btn:hover,
        .keypro-login-form-container .keypro-btn-primary:hover,
        .keypro-login-form-container .keypro-btn-outline:hover {
            box-shadow: none !important;
            -webkit-box-shadow: none !important;
            text-shadow: none !important;
        }
        
        /* Turnstile widget stílusok */
        .cf-turnstile {
            margin: 10px 0;
        }
        
        .cf-turnstile iframe {
            margin: 0 auto;
            display: block;
        }

        /* Responsive Styles */
        @media (max-width: 768px) {
            .keypro-form-actions {
                flex-direction: column;
            }
            
            .keypro-login-form-container {
                padding: 15px;
            }
            
            .keypro-settings-box-header {
                flex-direction: column;
                align-items: flex-start;
                gap: 1rem;
            }
        }
    </style>
    {"id":7990,"date":"2025-03-21T17:48:26","date_gmt":"2025-03-21T17:48:26","guid":{"rendered":"https:\/\/keypro.hu\/?page_id=7990"},"modified":"2025-03-22T06:36:54","modified_gmt":"2025-03-22T06:36:54","slug":"demo-login","status":"publish","type":"page","link":"https:\/\/keypro.hu\/en\/demo-login\/","title":{"rendered":"Bel\u00e9p\u00e9s a demo oldalra"},"content":{"rendered":"<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<div class=\"wp-block-group\" style=\"padding-right:var(--wp--preset--spacing--20);padding-left:var(--wp--preset--spacing--20)\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-container-core-group-is-layout-8326be0e wp-block-group-is-layout-constrained\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">    <div class=\"keypro-settings-box keypro-login-form-container\" >\r\n                <div class=\"keypro-settings-box-header\">\r\n            <h3>Bel\u00e9p\u00e9s a demo oldalra<\/h3>\r\n        <\/div>\r\n                \r\n                <script src=\"https:\/\/challenges.cloudflare.com\/turnstile\/v0\/api.js\" async defer><\/script>\r\n                \r\n        <div id=\"keypro-login-message\" style=\"display:none;\"><\/div>\r\n        <form id=\"keypro-login-form\" class=\"keypro-settings-form\" method=\"post\" action=\"https:\/\/keypro.hu\/wp-admin\/admin-ajax.php\">\r\n            <input type=\"hidden\" name=\"action\" value=\"keypro_ajax_login\">\r\n            <div class=\"keypro-form-row\">\r\n                <label for=\"user_login\">Email<\/label>\r\n                <input type=\"text\" name=\"log\" id=\"user_login\" \r\n                       placeholder=\"Email c\u00edm\" \r\n                       value=\"demo\" \r\n                       required>\r\n            <\/div>\r\n            \r\n            <div class=\"keypro-form-row\">\r\n                <label for=\"user_pass\">Jelsz\u00f3<\/label>\r\n                <input type=\"password\" name=\"pwd\" id=\"user_pass\" \r\n                       placeholder=\"Jelsz\u00f3\" \r\n                       value=\"demo\" \r\n                       required>\r\n            <\/div>\r\n            \r\n                        \r\n                        <div class=\"keypro-form-row\">\r\n                <div class=\"cf-turnstile\" data-sitekey=\"0x4AAAAAABBLHa85GvPUBmOe\" data-theme=\"light\"><\/div>\r\n            <\/div>\r\n                        \r\n            <input type=\"hidden\" name=\"redirect_to\" value=\"https:\/\/keypro.hu\/en\">\r\n            <input type=\"hidden\" name=\"keypro_login_nonce\" value=\"2adb3b1d86\">\r\n            \r\n            <div class=\"keypro-form-actions\">\r\n                <button type=\"submit\" id=\"keypro-login-button\" class=\"keypro-btn keypro-btn-primary\">\r\n                    <span class=\"button-text\">Bel\u00e9p\u00e9s<\/span>\r\n                    <span class=\"button-loader\" style=\"display:none;\">\r\n                        <svg width=\"20\" height=\"20\" viewbox=\"0 0 24 24\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n                            <style>\r\n                                .spinner {\r\n                                    animation: rotate 2s linear infinite;\r\n                                    transform-origin: center;\r\n                                }\r\n                                .spinner-path {\r\n                                    stroke-dasharray: 150,200;\r\n                                    stroke-dashoffset: -10;\r\n                                    animation: dash 1.5s ease-in-out infinite;\r\n                                    stroke: white;\r\n                                    stroke-linecap: round;\r\n                                }\r\n                                @keyframes rotate {\r\n                                    100% { transform: rotate(360deg); }\r\n                                }\r\n                                @keyframes dash {\r\n                                    0% {\r\n                                        stroke-dasharray: 1,200;\r\n                                        stroke-dashoffset: 0;\r\n                                    }\r\n                                    50% {\r\n                                        stroke-dasharray: 89,200;\r\n                                        stroke-dashoffset: -35;\r\n                                    }\r\n                                    100% {\r\n                                        stroke-dasharray: 89,200;\r\n                                        stroke-dashoffset: -124;\r\n                                    }\r\n                                }\r\n                            <\/style>\r\n                            <circle class=\"spinner\" cx=\"12\" cy=\"12\" r=\"10\" fill=\"none\" stroke=\"white\" stroke-width=\"2\" opacity=\"0.3\"><\/circle>\r\n                            <circle class=\"spinner-path\" cx=\"12\" cy=\"12\" r=\"10\" fill=\"none\" stroke-width=\"2\"><\/circle>\r\n                        <\/svg>\r\n                    <\/span>\r\n                <\/button>\r\n                \r\n                                <a href=\"https:\/\/keypro.hu\/wp-login.php?action=register\" class=\"keypro-btn keypro-btn-outline\">\r\n                    Regisztr\u00e1ci\u00f3                <\/a>\r\n                                            <\/div>\r\n        <\/form>\r\n    <\/div>\r\n    \r\n    <script>\r\n    document.addEventListener('DOMContentLoaded', function() {\r\n        var form = document.getElementById('keypro-login-form');\r\n        var button = document.getElementById('keypro-login-button');\r\n        var buttonText = button.querySelector('.button-text');\r\n        var buttonLoader = button.querySelector('.button-loader');\r\n        var messageDiv = document.getElementById('keypro-login-message');\r\n\r\n        function showMessage(message, type) {\r\n            messageDiv.className = 'keypro-notification ' + type;\r\n            messageDiv.textContent = message;\r\n            messageDiv.style.display = 'block';\r\n\r\n            \/\/ Scroll to message\r\n            messageDiv.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\r\n        }\r\n\r\n        function hideMessage() {\r\n            messageDiv.style.display = 'none';\r\n        }\r\n\r\n        function resetButton() {\r\n            buttonText.style.display = 'inline';\r\n            buttonLoader.style.display = 'none';\r\n            button.disabled = false;\r\n        }\r\n\r\n        function resetTurnstile() {\r\n            \/\/ Reset Cloudflare Turnstile widget if exists\r\n            if (typeof turnstile !== 'undefined') {\r\n                var turnstileWidget = form.querySelector('.cf-turnstile');\r\n                if (turnstileWidget) {\r\n                    turnstile.reset(turnstileWidget);\r\n                }\r\n            }\r\n        }\r\n\r\n        form.addEventListener('submit', function(e) {\r\n            e.preventDefault();\r\n\r\n            \/\/ Hide previous messages\r\n            hideMessage();\r\n\r\n            \/\/ Show loading spinner\r\n            buttonText.style.display = 'none';\r\n            buttonLoader.style.display = 'inline-block';\r\n            button.disabled = true;\r\n\r\n            \/\/ First fetch a fresh nonce (the cached page may have a stale one)\r\n            var nonceBody = new FormData();\r\n            nonceBody.append('action', 'keypro_refresh_nonce');\r\n\r\n            fetch(form.getAttribute('action'), {\r\n                method: 'POST',\r\n                body: nonceBody,\r\n                credentials: 'same-origin'\r\n            })\r\n            .then(function(r) { return r.json(); })\r\n            .then(function(nonceData) {\r\n                if (nonceData.success) {\r\n                    form.querySelector('[name=\"keypro_login_nonce\"]').value = nonceData.data.nonce;\r\n                }\r\n\r\n                \/\/ Now submit the login with the fresh nonce\r\n                var formData = new FormData(form);\r\n\r\n                return fetch(form.getAttribute('action'), {\r\n                    method: 'POST',\r\n                    body: formData,\r\n                    credentials: 'same-origin'\r\n                });\r\n            })\r\n            .then(function(response) {\r\n                return response.json();\r\n            })\r\n            .then(function(data) {\r\n                if (data.success) {\r\n                    \/\/ Show success message\r\n                    showMessage(data.data.message, 'success');\r\n\r\n                    \/\/ Redirect after short delay\r\n                    setTimeout(function() {\r\n                        window.location.href = data.data.redirect;\r\n                    }, 500);\r\n                } else {\r\n                    \/\/ Show error message\r\n                    showMessage(data.data.message, 'error');\r\n\r\n                    \/\/ Reset button\r\n                    resetButton();\r\n\r\n                    \/\/ Reset Turnstile if needed\r\n                    if (data.data.reset_turnstile) {\r\n                        resetTurnstile();\r\n                    }\r\n                }\r\n            })\r\n            .catch(function(error) {\r\n                console.error('Login error:', error);\r\n                showMessage('H\u00e1l\u00f3zati hiba t\u00f6rt\u00e9nt. K\u00e9rj\u00fck pr\u00f3b\u00e1lja \u00fajra.', 'error');\r\n                resetButton();\r\n                resetTurnstile();\r\n            });\r\n        });\r\n    });\r\n    <\/script>\r\n    \n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<h3 class=\"wp-block-heading\">Partneri adminisztr\u00e1ci\u00f3s fel\u00fclet demo<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u00dcdv\u00f6z\u00f6lj\u00fck a KeyPro.hu partneri demo fel\u00fclet\u00e9n! Ezen az oldalon bejelentkez\u00e9s ut\u00e1n kipr\u00f3b\u00e1lhatja \u00e9s megismerheti teljes k\u00f6r\u0171 adminisztr\u00e1ci\u00f3s rendszer\u00fcnk m\u0171k\u00f6d\u00e9s\u00e9t.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Mit pr\u00f3b\u00e1lhat ki?<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Licenc kezel\u00e9si rendszer<\/strong>: Tekintse \u00e1t, hogyan kezelheti egyszer\u0171en \u00fcgyfelei licenceit<\/li>\n\n\n\n<li><strong>Term\u00e9kkulcs nyilv\u00e1ntart\u00e1s<\/strong>: Ismerje meg a hat\u00e9kony kulcsnyilv\u00e1ntart\u00e1si m\u00f3dszer\u00fcnket<\/li>\n\n\n\n<li><strong>MAR licenc hardver hozz\u00e1rendel\u00e9s<\/strong>: Pr\u00f3b\u00e1lja ki, milyen egyszer\u0171 a Microsoft Authorized Reseller licencek hardverhez rendel\u00e9se<\/li>\n\n\n\n<li><strong>\u00c9rt\u00e9kes\u00edt\u00e9si jelent\u00e9sek<\/strong>: Elemezze a mintaadatokat \u00e9s tekintse \u00e1t a jelent\u00e9si funkci\u00f3kat<\/li>\n\n\n\n<li><strong>\u00dcgyf\u00e9lkezel\u00e9s<\/strong>: Fedezze fel az \u00fcgyf\u00e9lkapcsolat-kezel\u00e9s teljes funkcionalit\u00e1s\u00e1t<\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\">Bejelentkez\u00e9si adatok<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">A demo rendszerbe az al\u00e1bbi adatokkal l\u00e9phet be:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Email<\/strong>: demo<\/li>\n\n\n\n<li><strong>Jelsz\u00f3<\/strong>: demo<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">A demo k\u00f6rnyezetben v\u00e9gzett m\u00f3dos\u00edt\u00e1sok nem ker\u00fclnek ment\u00e9sre, \u00edgy b\u00e1tran pr\u00f3b\u00e1ljon ki minden funkci\u00f3t!<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">A demo felhaszn\u00e1l\u00f3 nem l\u00e1thatja az \u00e1rakat, mivel a partneri kedvezm\u00e9nyeket minden esetben egyedileg \u00e1ll\u00edtjuk be. Rendel\u00e9s lead\u00e1s\u00e1ra nincs lehet\u0151s\u00e9g.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Amennyiben k\u00e9rd\u00e9se lenne vagy szem\u00e9lyes bemutat\u00f3t szeretne, keressen minket a +3620 288 2545 telefonsz\u00e1mon vagy az info@keypro.hu email c\u00edmen.<\/p>\n<\/div>\n<\/div>\n<\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>","protected":false},"excerpt":{"rendered":"<p>Partneri adminisztr\u00e1ci\u00f3s fel\u00fclet demo \u00dcdv\u00f6z\u00f6lj\u00fck a KeyPro.hu partneri demo fel\u00fclet\u00e9n! Ezen az oldalon bejelentkez\u00e9s ut\u00e1n kipr\u00f3b\u00e1lhatja \u00e9s megismerheti teljes k\u00f6r\u0171 adminisztr\u00e1ci\u00f3s rendszer\u00fcnk m\u0171k\u00f6d\u00e9s\u00e9t. Mit pr\u00f3b\u00e1lhat ki? Bejelentkez\u00e9si adatok A demo rendszerbe az al\u00e1bbi adatokkal l\u00e9phet be: A demo k\u00f6rnyezetben v\u00e9gzett m\u00f3dos\u00edt\u00e1sok nem ker\u00fclnek ment\u00e9sre, \u00edgy b\u00e1tran pr\u00f3b\u00e1ljon ki minden funkci\u00f3t! A demo felhaszn\u00e1l\u00f3 nem l\u00e1thatja [&hellip;]<\/p>","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-7990","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/keypro.hu\/en\/wp-json\/wp\/v2\/pages\/7990","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/keypro.hu\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/keypro.hu\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/keypro.hu\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/keypro.hu\/en\/wp-json\/wp\/v2\/comments?post=7990"}],"version-history":[{"count":14,"href":"https:\/\/keypro.hu\/en\/wp-json\/wp\/v2\/pages\/7990\/revisions"}],"predecessor-version":[{"id":8007,"href":"https:\/\/keypro.hu\/en\/wp-json\/wp\/v2\/pages\/7990\/revisions\/8007"}],"wp:attachment":[{"href":"https:\/\/keypro.hu\/en\/wp-json\/wp\/v2\/media?parent=7990"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}