{"id":2525,"date":"2026-01-10T22:51:49","date_gmt":"2026-01-10T22:51:49","guid":{"rendered":"https:\/\/yms-training.com\/certcheck\/certificate-verification\/"},"modified":"2026-01-10T22:51:49","modified_gmt":"2026-01-10T22:51:49","slug":"certificate-verification","status":"publish","type":"page","link":"https:\/\/yms-training.com\/certcheck\/","title":{"rendered":"Certificate Verification"},"content":{"rendered":"        \n        <div id=\"certificate-verifier\">\n            <style>\n                * {\n                    margin: 0;\n                    padding: 0;\n                    box-sizing: border-box;\n                    font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;\n                }\n\n                #certificate-verifier {\n                    width: 100%;\n                    min-height: 100vh;\n                    background: linear-gradient(135deg, #f5f7fa 0%, #e4e8f0 100%);\n                    display: flex;\n                    align-items: center;\n                    justify-content: center;\n                    padding: 40px 20px;\n                }\n\n                body .verification-container {\n                    width: 100%;\n                    max-width: 1400px;\n                    display: flex;\n                    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.15);\n                    border-radius: 30px;\n                    overflow: hidden;\n                    background-color: white;\n                    min-height: 700px;\n                    position: relative;\n                    border: 1px solid rgba(0, 0, 0, 0.08);\n                    margin: 0;\n                }\n\n                .left-panel {\n                    flex: 1;\n                    background: linear-gradient(145deg, #1a237e, #283593);\n                    color: white;\n                    padding: 70px 60px;\n                    display: flex;\n                    flex-direction: column;\n                    justify-content: center;\n                    position: relative;\n                    overflow: hidden;\n                    min-width: 500px;\n                }\n\n                .left-panel::before {\n                    content: '';\n                    position: absolute;\n                    top: 0;\n                    left: 0;\n                    right: 0;\n                    bottom: 0;\n                    background: url('data:image\/svg+xml,<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"100\" height=\"100\" viewBox=\"0 0 100 100\"><path fill=\"rgba(255,255,255,0.03)\" d=\"M50,0 C77.614,0 100,22.386 100,50 C100,77.614 77.614,100 50,100 C22.386,100 0,77.614 0,50 C0,22.386 22.386,0 50,0 Z M50,10 C27.909,10 10,27.909 10,50 C10,72.091 27.909,90 50,90 C72.091,90 90,72.091 90,50 C90,27.909 72.091,10 50,10 Z\"><\/path><\/svg>');\n                    opacity: 0.1;\n                }\n\n                .right-panel {\n                    flex: 1.2;\n                    padding: 70px 60px;\n                    display: flex;\n                    flex-direction: column;\n                    justify-content: center;\n                    background: #fcfcfd;\n                    min-width: 600px;\n                }\n\n                .logo {\n                    display: flex;\n                    align-items: center;\n                    margin-bottom: 60px;\n                    position: relative;\n                }\n\n                .logo-icon {\n                    background: linear-gradient(135deg, #1565C0, #0D47A1);\n                    width: 70px;\n                    height: 70px;\n                    border-radius: 18px;\n                    display: flex;\n                    align-items: center;\n                    justify-content: center;\n                    margin-right: 25px;\n                    box-shadow: 0 10px 25px rgba(21, 101, 192, 0.3);\n                }\n\n                .logo-icon i {\n                    font-size: 32px;\n                }\n\n                .logo-text {\n                    font-size: 32px;\n                    font-weight: 700;\n                    letter-spacing: 0.5px;\n                    background: linear-gradient(135deg, #ffffff, #e3f2fd);\n                    -webkit-background-clip: text;\n                    -webkit-text-fill-color: transparent;\n                    background-clip: text;\n                }\n\n                .title {\n                    font-size: 42px;\n                    font-weight: 700;\n                    line-height: 1.2;\n                    margin-bottom: 30px;\n                    position: relative;\n                }\n\n                .description {\n                    font-size: 18px;\n                    line-height: 1.7;\n                    opacity: 0.9;\n                    margin-bottom: 50px;\n                    color: rgba(255, 255, 255, 0.85);\n                }\n\n                .features {\n                    list-style: none;\n                    margin-bottom: 60px;\n                }\n\n                .features li {\n                    margin-bottom: 20px;\n                    display: flex;\n                    align-items: center;\n                    font-size: 17px;\n                    color: rgba(255, 255, 255, 0.9);\n                }\n\n                .features i {\n                    color: #42A5F5;\n                    margin-right: 18px;\n                    font-size: 22px;\n                    background: rgba(255, 255, 255, 0.1);\n                    width: 36px;\n                    height: 36px;\n                    border-radius: 50%;\n                    display: flex;\n                    align-items: center;\n                    justify-content: center;\n                }\n\n                .tip-box {\n                    background: rgba(255, 255, 255, 0.12);\n                    border-radius: 15px;\n                    padding: 30px;\n                    border-left: 5px solid #42A5F5;\n                    backdrop-filter: blur(10px);\n                    border: 1px solid rgba(255, 255, 255, 0.15);\n                }\n\n                .tip-title {\n                    font-weight: 600;\n                    margin-bottom: 15px;\n                    display: flex;\n                    align-items: center;\n                    font-size: 20px;\n                }\n\n                .tip-title i {\n                    margin-right: 15px;\n                    color: #FFC107;\n                    font-size: 22px;\n                }\n\n                .tip-text {\n                    font-size: 16px;\n                    opacity: 0.9;\n                    line-height: 1.6;\n                    color: rgba(255, 255, 255, 0.85);\n                }\n\n                .form-container {\n                    max-width: 500px;\n                    margin: 0 auto;\n                    width: 100%;\n                }\n\n                .form-title {\n                    font-size: 34px;\n                    font-weight: 700;\n                    color: #1a237e;\n                    margin-bottom: 15px;\n                    background: linear-gradient(135deg, #1a237e, #283593);\n                    -webkit-background-clip: text;\n                    -webkit-text-fill-color: transparent;\n                    background-clip: text;\n                }\n\n                .form-subtitle {\n                    color: #666;\n                    margin-bottom: 50px;\n                    font-size: 17px;\n                    line-height: 1.6;\n                }\n\n                .input-group {\n                    margin-bottom: 35px;\n                }\n\n                .input-group label {\n                    display: block;\n                    margin-bottom: 12px;\n                    font-weight: 600;\n                    color: #333;\n                    font-size: 16px;\n                }\n\n                .input-with-example {\n                    display: flex;\n                    align-items: center;\n                    justify-content: space-between;\n                    margin-bottom: 10px;\n                }\n\n                .example-text {\n                    font-size: 14px;\n                    color: #888;\n                }\n\n                .input-wrapper {\n                    position: relative;\n                    display: flex;\n                    align-items: center;\n                }\n\n                .certificate-input {\n                    width: 100%;\n                    padding: 20px 25px 20px 25px;\n                    border: 2px solid #e0e6ed;\n                    border-radius: 15px;\n                    font-size: 18px;\n                    transition: all 0.3s ease;\n                    background-color: white;\n                    color: #333;\n                    font-weight: 500;\n                }\n\n                .certificate-input::placeholder {\n                    color: #999;\n                    font-weight: normal;\n                }\n\n                .certificate-input:focus {\n                    outline: none;\n                    border-color: #1565C0;\n                    background-color: white;\n                    box-shadow: 0 10px 30px rgba(21, 101, 192, 0.2);\n                    transform: translateY(-2px);\n                }\n\n                .search-button {\n                    background: linear-gradient(135deg, #1565C0, #0D47A1);\n                    color: white;\n                    border: none;\n                    padding: 22px 40px;\n                    border-radius: 15px;\n                    font-size: 18px;\n                    font-weight: 600;\n                    cursor: pointer;\n                    transition: all 0.3s ease;\n                    width: 100%;\n                    display: flex;\n                    align-items: center;\n                    justify-content: center;\n                    letter-spacing: 0.5px;\n                    text-transform: uppercase;\n                    box-shadow: 0 10px 25px rgba(21, 101, 192, 0.3);\n                }\n\n                .search-button i {\n                    margin-right: 15px;\n                    font-size: 22px;\n                }\n\n                .search-button:hover {\n                    background: linear-gradient(135deg, #0D47A1, #0B3D91);\n                    transform: translateY(-3px);\n                    box-shadow: 0 15px 30px rgba(21, 101, 192, 0.4);\n                }\n\n                .search-button:active {\n                    transform: translateY(0);\n                }\n\n                .verification-info {\n                    margin-top: 60px;\n                    padding: 30px;\n                    background: linear-gradient(135deg, #f8f9fa, #ffffff);\n                    border-radius: 15px;\n                    border-left: 5px solid #2196F3;\n                    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);\n                }\n\n                .info-title {\n                    font-weight: 600;\n                    color: #1a237e;\n                    margin-bottom: 15px;\n                    display: flex;\n                    align-items: center;\n                    font-size: 20px;\n                }\n\n                .info-title i {\n                    color: #2196F3;\n                    margin-right: 15px;\n                    font-size: 22px;\n                }\n\n                .info-text {\n                    font-size: 16px;\n                    color: #666;\n                    line-height: 1.6;\n                }\n\n                .copyright {\n                    text-align: center;\n                    margin-top: 60px;\n                    color: #888;\n                    font-size: 15px;\n                    padding-top: 30px;\n                    border-top: 1px solid #eee;\n                }\n\n                .copyright a {\n                    color: #1565C0;\n                    text-decoration: none;\n                    font-weight: 600;\n                }\n\n                .copyright a:hover {\n                    text-decoration: underline;\n                }\n\n                .result-section {\n                    margin-top: 40px;\n                    display: none;\n                }\n\n                .result-box {\n                    padding: 35px;\n                    border-radius: 18px;\n                    animation: fadeIn 0.5s ease;\n                    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.1);\n                    border: 1px solid rgba(0, 0, 0, 0.06);\n                }\n\n                .result-valid {\n                    background: linear-gradient(135deg, #e8f5e9, #c8e6c9);\n                    border: 2px solid #4CAF50;\n                }\n\n                .result-invalid {\n                    background: linear-gradient(135deg, #ffebee, #ffcdd2);\n                    border: 2px solid #f44336;\n                }\n\n                .result-expired {\n                    background: linear-gradient(135deg, #fff3e0, #ffe0b2);\n                    border: 2px solid #ff9800;\n                }\n\n                .certificate-details {\n                    margin-top: 30px;\n                    padding: 30px;\n                    background: rgba(255, 255, 255, 0.95);\n                    border-radius: 15px;\n                    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);\n                }\n\n                .detail-row {\n                    display: flex;\n                    margin-bottom: 15px;\n                    padding-bottom: 15px;\n                    border-bottom: 1px solid rgba(0, 0, 0, 0.06);\n                }\n\n                .detail-row:last-child {\n                    border-bottom: none;\n                    margin-bottom: 0;\n                    padding-bottom: 0;\n                }\n\n                .detail-label {\n                    font-weight: 600;\n                    width: 250px;\n                    color: #555;\n                    font-size: 16px;\n                    display: flex;\n                    align-items: center;\n                    flex-shrink: 0;\n                }\n\n                .detail-label i {\n                    margin-right: 12px;\n                    color: #666;\n                    font-size: 18px;\n                    min-width: 24px;\n                }\n\n                .detail-value {\n                    flex: 1;\n                    color: #333;\n                    font-weight: 500;\n                    font-size: 16px;\n                    word-break: break-word;\n                }\n\n                .valid-badge {\n                    background: #4CAF50;\n                    color: white;\n                    padding: 12px 30px;\n                    border-radius: 25px;\n                    font-weight: 600;\n                    display: inline-flex;\n                    align-items: center;\n                    margin-bottom: 25px;\n                    font-size: 18px;\n                    box-shadow: 0 6px 18px rgba(76, 175, 80, 0.3);\n                }\n\n                .valid-badge i {\n                    margin-right: 12px;\n                    font-size: 20px;\n                }\n\n                .invalid-badge {\n                    background: #f44336;\n                    color: white;\n                    padding: 12px 30px;\n                    border-radius: 25px;\n                    font-weight: 600;\n                    display: inline-flex;\n                    align-items: center;\n                    margin-bottom: 25px;\n                    font-size: 18px;\n                    box-shadow: 0 6px 18px rgba(244, 67, 54, 0.3);\n                }\n\n                .invalid-badge i {\n                    margin-right: 12px;\n                    font-size: 20px;\n                }\n\n                .expired-badge {\n                    background: #ff9800;\n                    color: #fff;\n                    padding: 12px 30px;\n                    border-radius: 25px;\n                    font-weight: 600;\n                    display: inline-flex;\n                    align-items: center;\n                    margin-bottom: 25px;\n                    font-size: 18px;\n                    box-shadow: 0 6px 18px rgba(255, 152, 0, 0.3);\n                }\n\n                .expired-badge i {\n                    margin-right: 12px;\n                    font-size: 20px;\n                }\n\n                .loading {\n                    text-align: center;\n                    padding: 50px;\n                    display: none;\n                }\n\n                .loading-spinner {\n                    border: 4px solid #f3f3f3;\n                    border-top: 4px solid #1565C0;\n                    border-radius: 50%;\n                    width: 60px;\n                    height: 60px;\n                    animation: spin 1s linear infinite;\n                    margin: 0 auto 25px;\n                }\n\n                @keyframes spin {\n                    0% { transform: rotate(0deg); }\n                    100% { transform: rotate(360deg); }\n                }\n\n                @keyframes fadeIn {\n                    from { opacity: 0; transform: translateY(20px); }\n                    to { opacity: 1; transform: translateY(0); }\n                }\n\n                @media (min-width: 1600px) {\n                    .verification-container {\n                        max-width: 1500px;\n                        min-height: 750px;\n                    }\n                    \n                    .left-panel, .right-panel {\n                        padding: 80px 70px;\n                    }\n                    \n                    .title {\n                        font-size: 46px;\n                    }\n                    \n                    .form-title {\n                        font-size: 38px;\n                    }\n                    \n                    .form-container {\n                        max-width: 550px;\n                    }\n                }\n\n                @media (min-width: 1920px) {\n                    .verification-container {\n                        max-width: 1700px;\n                        min-height: 800px;\n                    }\n                    \n                    .left-panel, .right-panel {\n                        padding: 90px 80px;\n                    }\n                    \n                    .title {\n                        font-size: 50px;\n                    }\n                    \n                    .form-title {\n                        font-size: 42px;\n                    }\n                    \n                    .form-container {\n                        max-width: 600px;\n                    }\n                }\n\n                @media (max-width: 1200px) {\n                    .verification-container {\n                        max-width: 95%;\n                        min-height: auto;\n                    }\n                    \n                    .left-panel, .right-panel {\n                        padding: 50px 40px;\n                        min-width: auto;\n                    }\n                    \n                    .title {\n                        font-size: 36px;\n                    }\n                    \n                    .form-title {\n                        font-size: 30px;\n                    }\n                }\n\n                @media (max-width: 1024px) {\n                    .verification-container {\n                        flex-direction: column;\n                        max-width: 700px;\n                    }\n                    \n                    .left-panel, .right-panel {\n                        width: 100%;\n                        min-width: auto;\n                        padding: 50px 40px;\n                    }\n                    \n                    .left-panel {\n                        order: 2;\n                    }\n                    \n                    .right-panel {\n                        order: 1;\n                    }\n                    \n                    .form-container {\n                        max-width: 100%;\n                    }\n                }\n\n                @media (max-width: 768px) {\n                    .verification-container {\n                        border-radius: 20px;\n                        max-width: 95%;\n                    }\n                    \n                    .left-panel, .right-panel {\n                        padding: 40px 30px;\n                    }\n                    \n                    .title {\n                        font-size: 32px;\n                    }\n                    \n                    .form-title {\n                        font-size: 28px;\n                    }\n                    \n                    .logo-text {\n                        font-size: 28px;\n                    }\n                    \n                    .logo-icon {\n                        width: 60px;\n                        height: 60px;\n                    }\n                    \n                    .detail-row {\n                        flex-direction: column;\n                    }\n                    \n                    .detail-label {\n                        width: 100%;\n                        margin-bottom: 8px;\n                    }\n                }\n\n                @media (max-width: 480px) {\n                    #certificate-verifier {\n                        padding: 20px 15px;\n                    }\n                    \n                    .verification-container {\n                        border-radius: 15px;\n                        margin: 0;\n                    }\n                    \n                    .left-panel, .right-panel {\n                        padding: 35px 25px;\n                    }\n                    \n                    .title {\n                        font-size: 28px;\n                    }\n                    \n                    .logo-text {\n                        font-size: 26px;\n                    }\n                    \n                    .form-title {\n                        font-size: 26px;\n                    }\n                    \n                    .logo-icon {\n                        width: 50px;\n                        height: 50px;\n                    }\n                    \n                    .search-button {\n                        padding: 18px 30px;\n                        font-size: 16px;\n                    }\n                    \n                    .certificate-input {\n                        padding: 16px 20px;\n                        font-size: 16px;\n                    }\n                }\n            <\/style>\n            \n            <div class=\"verification-container\">\n                <!-- Left Panel -->\n                <div class=\"left-panel\">\n                    <div class=\"logo\">\n                        <div class=\"logo-icon\">\n                            <i class=\"fas fa-award\"><\/i>\n                        <\/div>\n                        <div class=\"logo-text\">VerifyCert<\/div>\n                    <\/div>\n                    \n                    <h1 class=\"title\">Verify Your Certificate Online<\/h1>\n                    \n                    <p class=\"description\">\n                        Enter your certificate UIN to securely verify its authenticity and view associated information.\n                    <\/p>\n                    \n                    <ul class=\"features\">\n                        <li><i class=\"fas fa-check-circle\"><\/i> Enter the Certificate UIN (e.g., 260001)<\/li>\n                        <li><i class=\"fas fa-shield-alt\"><\/i> Quick and secure verification process<\/li>\n                        <li><i class=\"fas fa-file-certificate\"><\/i> Access to full certificate details<\/li>\n                        <li><i class=\"fas fa-check-double\"><\/i> Instant authenticity confirmation<\/li>\n                    <\/ul>\n                    \n                    <div class=\"tip-box\">\n                        <div class=\"tip-title\">\n                            <i class=\"fas fa-lightbulb\"><\/i> Tip\n                        <\/div>\n                        <div class=\"tip-text\">\n                            The UIN (Unique Identification Number) is a 6-digit code assigned to each certificate for unique identification.\n                        <\/div>\n                    <\/div>\n                <\/div>\n                \n                <!-- Right Panel -->\n                <div class=\"right-panel\">\n                    <div class=\"form-container\">\n                        <h2 class=\"form-title\">Certificate Verification<\/h2>\n                        <p class=\"form-subtitle\">Verify the authenticity of your certificate quickly<\/p>\n                        \n                        <div class=\"input-group\">\n                            <div class=\"input-with-example\">\n                                <label for=\"certificateCount\">Certificate Unique Identification Number<\/label>\n                                <span class=\"example-text\">e.g., 260001<\/span>\n                            <\/div>\n                            <div class=\"input-wrapper\">\n                                <input \n                                    type=\"text\" \n                                    id=\"certificateCount\" \n                                    class=\"certificate-input\" \n                                    placeholder=\"Enter your 6-digit Unique Identification Number\"\n                                    value=\"\"\n                                >\n                            <\/div>\n                        <\/div>\n                        \n                        <button type=\"button\" class=\"search-button\" onclick=\"verifyCertificate()\">\n                            <i class=\"fas fa-search\"><\/i> Verify Certificate\n                        <\/button>\n                        \n                        <!-- Loading -->\n                        <div class=\"loading\" id=\"loading\">\n                            <div class=\"loading-spinner\"><\/div>\n                            <p>Verifying certificate...<\/p>\n                        <\/div>\n                        \n                        <!-- Results Section -->\n                        <div class=\"result-section\" id=\"result-section\">\n                            <div id=\"result\" class=\"result-box\"><\/div>\n                        <\/div>\n                        \n                        <div class=\"verification-info\">\n                            <div class=\"info-title\">\n                                <i class=\"fas fa-shield-alt\"><\/i> Secure Verification\n                            <\/div>\n                            <div class=\"info-text\">\n                                Our verification system uses advanced encryption to protect your data. \n                                Only authorized certificate holders can access the full certificate details.\n                            <\/div>\n                        <\/div>\n                        \n                        <div class=\"copyright\">\n                            &copy; 2026 VerifyCert powered by <a href=\"#\">MM<\/a>. All rights reserved.\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n            \n            <script>\n            function verifyCertificate() {\n                var count = document.getElementById('certificateCount').value.trim();\n                if (!count) {\n                    alert('Please enter a Count number');\n                    return;\n                }\n                \n                \/\/ Validate it's exactly 6 digits\n                if (!\/^\\d{6}$\/.test(count)) {\n                    alert('Please enter exactly 6 digits for the Count.');\n                    return;\n                }\n                \n                \/\/ Show loading, hide results\n                document.getElementById('loading').style.display = 'block';\n                document.getElementById('result-section').style.display = 'none';\n                \n                \/\/ Update URL without reloading\n                history.replaceState(null, null, '?count=' + encodeURIComponent(count));\n                \n                \/\/ AJAX call\n                var xhr = new XMLHttpRequest();\n                xhr.open('POST', 'https:\/\/yms-training.com\/certcheck\/wp-json\/certificate\/v1\/verify', true);\n                xhr.setRequestHeader('Content-Type', 'application\/json');\n                xhr.setRequestHeader('X-WP-Nonce', '6e9e874cba');\n                \n                xhr.onreadystatechange = function() {\n                    if (xhr.readyState === 4) {\n                        \/\/ Hide loading\n                        document.getElementById('loading').style.display = 'none';\n                        document.getElementById('result-section').style.display = 'block';\n                        \n                        var resultDiv = document.getElementById('result');\n                        \n                        if (xhr.status === 200) {\n                            var data = JSON.parse(xhr.responseText);\n                            \n                            if (data.valid) {\n                                resultDiv.className = 'result-box result-valid';\n                                resultDiv.innerHTML = `\n                                    <div class=\"valid-badge\"><i class=\"fas fa-check-circle\"><\/i> VALID CERTIFICATE<\/div>\n                                    <p>This certificate is authentic and registered in our system.<\/p>\n                                    \n                                    <div class=\"certificate-details\">\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-hashtag\"><\/i> UIN:<\/div>\n                                            <div class=\"detail-value\"><strong>${data.certificate.count_number}<\/strong><\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-user\"><\/i> Holder Name:<\/div>\n                                            <div class=\"detail-value\">${data.certificate.first_name} ${data.certificate.last_name}<\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-graduation-cap\"><\/i> Course:<\/div>\n                                            <div class=\"detail-value\">${data.certificate.course_name}<\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-certificate\"><\/i> Certificate Number:<\/div>\n                                            <div class=\"detail-value\"><code>${data.certificate.certificate_no}<\/code><\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-calendar-alt\"><\/i> Course Date:<\/div>\n                                            <div class=\"detail-value\">${data.formatted_course_date}<\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-clock\"><\/i> Expiry Date:<\/div>\n                                            <div class=\"detail-value\">${data.formatted_expiry_date}<\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-check-circle\"><\/i> Status:<\/div>\n                                            <div class=\"detail-value\" style=\"color:#4CAF50; font-weight:bold;\">\u25cf VALID<\/div>\n                                        <\/div>\n                                    <\/div>\n                                    \n                                    <div style=\"margin-top: 25px; padding: 15px; background: rgba(76, 175, 80, 0.1); border-radius: 8px; font-size: 13px; color: #2e7d32; border-left: 4px solid #4CAF50;\">\n                                        <i class=\"fas fa-info-circle\"><\/i> Verified on ${new Date().toLocaleDateString('en-GB')} at ${new Date().toLocaleTimeString('en-GB')}\n                                    <\/div>\n                                `;\n                            } else if (data.expired) {\n                                resultDiv.className = 'result-box result-expired';\n                                resultDiv.innerHTML = `\n                                    <div class=\"expired-badge\"><i class=\"fas fa-exclamation-triangle\"><\/i> EXPIRED CERTIFICATE<\/div>\n                                    <p style=\"font-size: 16px; margin-bottom: 15px;\">${data.message}<\/p>\n                                    \n                                    <div class=\"certificate-details\">\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-hashtag\"><\/i> Count Number:<\/div>\n                                            <div class=\"detail-value\"><strong>${data.certificate.count_number}<\/strong><\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-user\"><\/i> Holder Name:<\/div>\n                                            <div class=\"detail-value\">${data.certificate.first_name} ${data.certificate.last_name}<\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-graduation-cap\"><\/i> Course:<\/div>\n                                            <div class=\"detail-value\">${data.certificate.course_name}<\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-certificate\"><\/i> Certificate Number:<\/div>\n                                            <div class=\"detail-value\"><code>${data.certificate.certificate_no}<\/code><\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-calendar-alt\"><\/i> Course Date:<\/div>\n                                            <div class=\"detail-value\">${data.formatted_course_date}<\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-clock\"><\/i> Expiry Date:<\/div>\n                                            <div class=\"detail-value\" style=\"color:#f44336; font-weight:bold;\">${data.formatted_expiry_date} (EXPIRED)<\/div>\n                                        <\/div>\n                                        <div class=\"detail-row\">\n                                            <div class=\"detail-label\"><i class=\"fas fa-times-circle\"><\/i> Status:<\/div>\n                                            <div class=\"detail-value\" style=\"color:#f44336; font-weight:bold;\">\u25cf EXPIRED<\/div>\n                                        <\/div>\n                                    <\/div>\n                                    \n                                    <div style=\"margin-top: 20px; padding: 15px; background: rgba(255, 152, 0, 0.1); border-radius: 8px; font-style: italic; color: #e65100; border-left: 4px solid #ff9800;\">\n                                        <i class=\"fas fa-info-circle\"><\/i> This certificate is no longer valid. Please contact the issuing authority for renewal.\n                                    <\/div>\n                                `;\n                            } else {\n                                resultDiv.className = 'result-box result-invalid';\n                                resultDiv.innerHTML = `\n                                    <div class=\"invalid-badge\"><i class=\"fas fa-times-circle\"><\/i> INVALID CERTIFICATE<\/div>\n                                    <p style=\"font-size: 16px; margin-bottom: 15px;\">${data.message}<\/p>\n                                    <p>Please check the Count number or contact the administrator.<\/p>\n                                `;\n                            }\n                        } else {\n                            resultDiv.className = 'result-box result-invalid';\n                            resultDiv.innerHTML = `\n                                <div class=\"invalid-badge\"><i class=\"fas fa-exclamation-circle\"><\/i> VERIFICATION ERROR<\/div>\n                                <p>An error occurred during verification.<\/p>\n                                <p>Please try again or contact the administrator.<\/p>\n                            `;\n                        }\n                    }\n                };\n                \n                xhr.send(JSON.stringify({ count: count }));\n            }\n            \n            \/\/ Allow Enter key\n            document.getElementById('certificateCount').addEventListener('keypress', function(e) {\n                if (e.key === 'Enter') {\n                    e.preventDefault();\n                    verifyCertificate();\n                }\n            });\n            \n            \/\/ Only allow numeric input and limit to 6 digits\n            document.getElementById('certificateCount').addEventListener('input', function(e) {\n                let value = e.target.value;\n                \/\/ Remove any non-numeric characters\n                value = value.replace(\/\\D\/g, '');\n                \/\/ Limit to 6 digits\n                value = value.substring(0, 6);\n                e.target.value = value;\n            });\n            \n            \/\/ Also validate on paste\n            document.getElementById('certificateCount').addEventListener('paste', function(e) {\n                setTimeout(() => {\n                    let value = this.value;\n                    value = value.replace(\/\\D\/g, '');\n                    value = value.substring(0, 6);\n                    this.value = value;\n                }, 0);\n            });\n            \n            \/\/ Auto-verify if count in URL\n                        <\/script>\n        <\/div>\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":{"_acf_changed":false,"footnotes":""},"class_list":["post-2525","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/yms-training.com\/certcheck\/wp-json\/wp\/v2\/pages\/2525","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/yms-training.com\/certcheck\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/yms-training.com\/certcheck\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/yms-training.com\/certcheck\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/yms-training.com\/certcheck\/wp-json\/wp\/v2\/comments?post=2525"}],"version-history":[{"count":0,"href":"https:\/\/yms-training.com\/certcheck\/wp-json\/wp\/v2\/pages\/2525\/revisions"}],"wp:attachment":[{"href":"https:\/\/yms-training.com\/certcheck\/wp-json\/wp\/v2\/media?parent=2525"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}