{"id":95,"date":"2025-02-07T21:33:42","date_gmt":"2025-02-07T21:33:42","guid":{"rendered":"https:\/\/ferdifixt.nl\/?page_id=95"},"modified":"2025-10-15T10:24:51","modified_gmt":"2025-10-15T10:24:51","slug":"reparatie","status":"publish","type":"page","link":"https:\/\/ferdifixt.nl\/en\/reparatie\/","title":{"rendered":"Register Repair"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"95\" class=\"elementor elementor-95\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4a936b3 e-flex e-con-boxed e-con e-parent\" data-id=\"4a936b3\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9b183ec elementor-widget elementor-widget-heading\" data-id=\"9b183ec\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">Repair<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2da499e e-flex e-con-boxed e-con e-parent\" data-id=\"2da499e\" 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-65b82bf elementor-widget elementor-widget-shortcode\" data-id=\"65b82bf\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">    <style>\n    \/* Modern Panel Interface Styling *\/\n\n.panel-interface {\n    max-width: 1200px;\n    margin: 20px auto;\n    padding: 20px;\n    background: #ffffff;\n    border-radius: 12px;\n    box-shadow: 0 4px 20px rgba(0,0,0,0.08);\n    transition: min-height 0.4s ease;\n    overflow: hidden;\n}\n\n.panels-container,\n.final-options-container {\n    transition: all 0.4s ease, min-height 0.4s ease;\n}\n\n.panel-header {\n    text-align: center;\n    margin-bottom: 30px;\n}\n\n.panel-title {\n    font-size: 28px;\n    color: #0081c3;\n    margin-bottom: 10px;\n    font-weight: 600;\n}\n\n.panel-subtitle {\n    font-size: 16px;\n    color: #666;\n    margin-bottom: 0;\n}\n\n\/* Breadcrumb Navigation *\/\n.breadcrumb-nav {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    margin-bottom: 30px;\n    flex-wrap: wrap;\n    gap: 10px;\n}\n\n.breadcrumb-item {\n    display: flex;\n    align-items: center;\n    font-size: 14px;\n    color: #666;\n}\n\n.breadcrumb-item.active {\n    color: #0081c3;\n    font-weight: 600;\n}\n\n.breadcrumb-separator {\n    margin: 0 8px;\n    color: #ccc;\n    font-size: 12px;\n}\n\n.breadcrumb-back {\n    background: #f8f9fa;\n    border: 1px solid #e9ecef;\n    border-radius: 6px;\n    padding: 6px 12px;\n    font-size: 13px;\n    color: #666;\n    cursor: pointer;\n    transition: all 0.2s ease;\n    text-decoration: none;\n}\n\n.breadcrumb-back:hover {\n    background: #e9ecef;\n    color: #333;\n    text-decoration: none;\n}\n\n\/* Panel Grid *\/\n.panels-container {\n    display: grid;\n    gap: 20px;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    max-width: 100%;\n    opacity: 0;\n    transform: translateY(20px);\n    transition: all 0.4s ease;\n}\n\n.panels-container.visible {\n    opacity: 1;\n    transform: translateY(0);\n}\n\n\/* Individual Panels *\/\n.selection-panel {\n    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);\n    border: 2px solid #e9ecef;\n    border-radius: 12px;\n    padding: 0;\n    cursor: pointer;\n    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n    position: relative;\n    min-height: 80px;\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    box-shadow: 0 2px 10px rgba(0,0,0,0.05);\n}\n\n.selection-panel:hover {\n    border-color: #0081c3;\n    transform: translateY(-3px);\n    box-shadow: 0 6px 20px rgba(0,129,195,0.15);\n}\n\n.selection-panel:active {\n    transform: translateY(-1px);\n}\n\n.panel-content {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n}\n\n.panel-text-bar {\n    background: linear-gradient(135deg, #0081c3 0%, #00a8e6 100%);\n    color: white;\n    padding: 16px 20px;\n    font-size: 16px;\n    font-weight: 600;\n    text-align: center;\n    flex: 1;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-height: 60px;\n    transition: all 0.3s ease;\n    box-shadow: 0 2px 8px rgba(0,129,195,0.2);\n}\n\n.selection-panel:hover .panel-text-bar {\n    background: linear-gradient(135deg, #006ba3 0%, #0088c3 100%);\n    box-shadow: 0 4px 15px rgba(0,129,195,0.3);\n}\n\n.panel-text {\n    margin: 0;\n    line-height: 1.3;\n    word-break: break-word;\n}\n\n\/* Final Options *\/\n.final-options-container {\n    display: grid;\n    gap: 20px;\n    grid-template-columns: repeat(auto-fit, minmax(300px, 320px));\n    justify-content: center;\n    margin-top: 30px;\n    opacity: 0;\n    transform: translateY(20px);\n    transition: all 0.4s ease;\n}\n\n.final-options-container.visible {\n    opacity: 1;\n    transform: translateY(0);\n}\n\n.repair-option-panel {\n    background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);\n    border: 2px solid #e9ecef;\n    border-radius: 12px;\n    overflow: hidden;\n    cursor: pointer;\n    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n    min-height: 200px;\n    width: 100%;\n    max-width: 320px;\n    box-shadow: 0 4px 15px rgba(0,0,0,0.08);\n    display: flex;\n    flex-direction: column;\n}\n\n.repair-option-panel:hover {\n    border-color: #0081c3;\n    transform: translateY(-4px);\n    box-shadow: 0 8px 25px rgba(0,129,195,0.15);\n}\n\n.repair-panel-header {\n    background: linear-gradient(135deg, #0081c3 0%, #00a8e6 100%);\n    color: white;\n    padding: 20px;\n    text-align: center;\n    min-height: 90px;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    box-shadow: 0 2px 10px rgba(0,129,195,0.2);\n}\n\n.repair-panel-title {\n    font-size: 18px;\n    font-weight: 600;\n    margin: 0 0 5px 0;\n    line-height: 1.2;\n}\n\n.repair-panel-model {\n    font-size: 14px;\n    opacity: 0.9;\n    margin: 0 0 8px 0;\n}\n\n.repair-panel-price {\n    font-size: 20px;\n    font-weight: 700;\n    margin: 0;\n}\n\n.repair-panel-body {\n    padding: 15px;\n    background: #ffffff;\n    flex: 1;\n}\n\n.repair-feature {\n    display: flex;\n    align-items: center;\n    margin: 8px 0;\n    font-size: 14px;\n    color: #555;\n}\n\n.repair-feature::before {\n    content: \"\u2713\";\n    color: #28a745;\n    font-weight: bold;\n    margin-right: 8px;\n    font-size: 12px;\n}\n\n.repair-panel-footer {\n    padding: 15px;\n    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);\n    text-align: center;\n    border-top: 1px solid #e9ecef;\n}\n\n.appointment-btn {\n    background: linear-gradient(135deg, #0081c3 0%, #00a8e6 100%);\n    color: white;\n    border: none;\n    border-radius: 8px;\n    padding: 12px 24px;\n    font-size: 14px;\n    font-weight: 600;\n    cursor: pointer;\n    transition: all 0.3s ease;\n    width: 100%;\n    box-shadow: 0 2px 8px rgba(0,129,195,0.2);\n}\n\n.appointment-btn:hover {\n    background: linear-gradient(135deg, #006ba3 0%, #0088c3 100%);\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px rgba(0,129,195,0.3);\n}\n\n\/* Responsive Design *\/\n@media (max-width: 768px) {\n    .panels-container {\n        grid-template-columns: repeat(3, 1fr);\n        gap: 15px;\n    }\n    \n    .final-options-container {\n        grid-template-columns: 1fr;\n    }\n    \n    .panel-interface {\n        margin: 10px;\n        padding: 15px;\n    }\n    \n    .panel-title {\n        font-size: 24px;\n    }\n    \n    .selection-panel {\n        min-height: 70px;\n    }\n    \n    .panel-text-bar {\n        padding: 12px 10px;\n        font-size: 14px;\n        min-height: 50px;\n    }\n    \n    .repair-option-panel {\n        min-height: 180px;\n    }\n    \n    .breadcrumb-nav {\n        margin-bottom: 20px;\n    }\n}\n\n@media (max-width: 480px) {\n    .panels-container {\n        grid-template-columns: repeat(3, 1fr);\n        gap: 10px;\n    }\n    \n    .panel-text-bar {\n        padding: 10px 8px;\n        font-size: 13px;\n        min-height: 45px;\n    }\n    \n    .selection-panel {\n        min-height: 60px;\n    }\n}\n\n\/* Loading Animation *\/\n.loading-spinner {\n    display: none;\n    text-align: center;\n    padding: 40px;\n}\n\n.spinner {\n    width: 40px;\n    height: 40px;\n    border: 4px solid #f3f3f3;\n    border-top: 4px solid #0081c3;\n    border-radius: 50%;\n    animation: spin 1s linear infinite;\n    margin: 0 auto 15px;\n}\n\n@keyframes spin {\n    0% { transform: rotate(0deg); }\n    100% { transform: rotate(360deg); }\n}\n\n\/* Repair Form Styling *\/\n#repair-form-container {\n    display: none;\n    opacity: 0;\n    transition: opacity 0.5s ease;\n    margin-top: 20px;\n    max-width: 600px;\n    margin-left: auto;\n    margin-right: auto;\n}\n\n.reparatie-form {\n    background: #ffffff;\n    border-radius: 12px;\n    padding: 30px;\n    box-shadow: 0 4px 20px rgba(0,0,0,0.08);\n}\n\n.form-group {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    margin-bottom: 20px;\n}\n\n.form-group label {\n    font-weight: 600;\n    color: #333;\n    font-size: 14px;\n}\n\n.form-group input,\n.form-group textarea {\n    padding: 12px;\n    border: 2px solid #e9ecef;\n    border-radius: 8px;\n    font-size: 14px;\n    transition: border-color 0.3s ease;\n}\n\n.form-group input:focus,\n.form-group textarea:focus {\n    outline: none;\n    border-color: #0081c3;\n}\n\n.checkbox-group {\n    display: flex;\n    align-items: center;\n    gap: 15px;\n    flex-wrap: wrap;\n}\n\n.checkbox-group input {\n    margin: 0;\n    width: auto;\n}\n\n.form-group.inline {\n    flex-direction: row;\n    align-items: center;\n    gap: 10px;\n}\n\n.form-group.inline label {\n    font-weight: normal;\n    margin: 0;\n}\n\n.submit-btn {\n    width: 100%;\n    padding: 15px;\n    background: linear-gradient(135deg, #0081c3, #00a8e6);\n    color: white;\n    border: none;\n    border-radius: 8px;\n    font-size: 16px;\n    font-weight: 600;\n    cursor: pointer;\n    transition: all 0.3s ease;\n    margin-top: 10px;\n}\n\n.submit-btn:hover {\n    background: linear-gradient(135deg, #006ba3, #0088c3);\n    transform: translateY(-2px);\n    box-shadow: 0 4px 15px rgba(0,129,195,0.3);\n}\n    <\/style>\n\n    <div id=\"filter-container\" class=\"panel-interface\">\n        <div class=\"panel-header\">\n            <h2 class=\"panel-title\">Choose your repair<\/h2>\n            <p class=\"panel-subtitle\">Select your device and repair type<\/p>\n        <\/div>\n\n        <div class=\"breadcrumb-nav\" id=\"breadcrumb-nav\" style=\"display: none;\">\n        <\/div>\n\n        <div class=\"loading-spinner\" id=\"loading-spinner\">\n            <div class=\"spinner\"><\/div>\n            <p>Loading options...<\/p>\n        <\/div>\n\n        <div class=\"panels-container\" id=\"panels-container\">\n        <\/div>\n\n        <div class=\"final-options-container\" id=\"final-options-container\">\n        <\/div>\n    <\/div>\n\n    <div id=\"repair-form-container\">\n        <div class=\"reparatie-form\">\n            <h4 style=\"text-align:center; color:#0081c3; margin-bottom: 25px;\">Repair Submission<\/h4>\n            <form id=\"ferdi-reparatie-form\" method=\"post\" action=\"https:\/\/ferdifixt.nl\/wp-admin\/admin-post.php\">\n                <input type=\"hidden\" id=\"ferdi_reparatie_nonce\" name=\"ferdi_reparatie_nonce\" value=\"2e7d5c5008\" \/><input type=\"hidden\" name=\"_wp_http_referer\" value=\"\/en\/wp-json\/wp\/v2\/pages\/95\" \/>                <input type=\"hidden\" name=\"action\" value=\"ferdi_reparatie_form_submit\">\n                <input type=\"hidden\" id=\"recaptcha_response\" name=\"recaptcha_response\">\n\n                <div class=\"form-group\">\n                    <label for=\"ferdi_naam\">Name<\/label>\n                    <input type=\"text\" id=\"ferdi_naam\" name=\"ferdi_naam\" required>\n                <\/div>\n\n                <div class=\"form-group\">\n                    <label>Preferred Contact Method:<\/label>\n                    <div class=\"checkbox-group\">\n                        <input type=\"radio\" id=\"contact_email\" name=\"ferdi_contact_method\" value=\"email\" required>\n                        <label for=\"contact_email\">Email<\/label>\n                        <input type=\"radio\" id=\"contact_whatsapp\" name=\"ferdi_contact_method\" value=\"whatsapp\" required>\n                        <label for=\"contact_whatsapp\">Whatsapp<\/label>\n                    <\/div>\n                <\/div>\n\n                <div class=\"form-group\" id=\"email_field\" style=\"display: none;\">\n                    <label for=\"ferdi_email\">Email Address<\/label>\n                    <input type=\"email\" id=\"ferdi_email\" name=\"ferdi_email\">\n                <\/div>\n\n                <div class=\"form-group\" id=\"whatsapp_field\" style=\"display: none;\">\n                    <label for=\"ferdi_telefoon\">WhatsApp Number<\/label>\n                    <input type=\"tel\" id=\"ferdi_telefoon\" name=\"ferdi_telefoon\" pattern=\"^[0-9+\\-]+$\" title=\"Use only numbers, plus (+) and minus (-)\">\n                <\/div>\n\n                <div class=\"form-group\">\n                    <label for=\"ferdi_reparatie\">Repair<\/label>\n                    <input type=\"text\" id=\"ferdi_reparatie\" name=\"ferdi_reparatie\" value=\"\" readonly>\n                <\/div>\n\n                <div class=\"form-group\">\n                    <label for=\"ferdi_probleem\">Problem Description<\/label>\n                    <textarea id=\"ferdi_probleem\" name=\"ferdi_probleem\" rows=\"4\" required><\/textarea>\n                <\/div>\n\n                <div class=\"form-group inline\">\n                    <input type=\"checkbox\" id=\"ferdi_agree\" name=\"ferdi_agree\" value=\"1\" required>\n                    <label for=\"ferdi_agree\">I agree with the <a href=\"https:\/\/ferdifixt.nl\/en\/terms-and-conditions\" target=\"_blank\">Terms and Conditions<\/a><\/label>\n                <\/div>\n                <button type=\"submit\" class=\"submit-btn\">Submit Repair Request<\/button>\n            <\/form>\n        <\/div>\n    <\/div>\n\n    <script src=\"https:\/\/www.google.com\/recaptcha\/api.js?render=6LeAsPgqAAAAAK5pJaO5NXy5XmC3B7Mo3u51JUPe\"><\/script>\n    <script>\n    (function(){\n        grecaptcha.ready(function() {\n            grecaptcha.execute('6LeAsPgqAAAAAK5pJaO5NXy5XmC3B7Mo3u51JUPe', {action: 'ferdi_form'}).then(function(token) {\n                document.getElementById('recaptcha_response').value = token;\n            });\n        });\n\n        var ajaxurl = 'https:\/\/ferdifixt.nl\/wp-admin\/admin-ajax.php';\n        var ajaxNonce = '56799d5f90';\n        var allData = [];\n        var boxDescriptions = {\"back_cover_originals\":{\"title\":\"Back Cover - Original\",\"features\":[\"Genuine Samsung part\",\"Original build quality\"]},\"back_cover_pulled\":{\"title\":\"Back Cover - Pulled\",\"features\":[\"Original part\",\"Taken from another device\",\"Brand new condition\",\"Sustainable choice\"]},\"battery_ferdi\":{\"title\":\"Battery - Ferdi\",\"features\":[\"High quality\",\"Same capacity as original\",\"Will not be recognized as genuine Battery\",\"Produced by independent manufacturer\"]},\"battery_original\":{\"title\":\"Battery - Original\",\"features\":[\"Original quality\",\"Apple original battery\",\"Will be recognized as genuine battery\",\"Produced by Apple\"]},\"battery_originals\":{\"title\":\"Battery - Original\",\"features\":[\"Original quality\",\"Samsung original battery\",\"Produced by Samsung\"]},\"display_basic\":{\"title\":\"Display - Basic\",\"features\":[\"Budget friendly option\",\"LCD technology\",\"Okay colour and less bright\",\"Less battery life (consumes more power)\"]},\"display_ferdi\":{\"title\":\"Display - Ferdi\",\"features\":[\"Best aftermarket display\",\"Vibrant OLED technology\",\"Colour close to original\",\"Normal battery performance\"]},\"display_originals\":{\"title\":\"Display - Original\",\"features\":[\"Original quality\",\"Samsung original display\",\"Produced by Samsung\"]},\"display_refurbished\":{\"title\":\"Display - Refurbished\",\"features\":[\"Original display taken from other iPhone\",\"OLED technology\",\"Original colour\",\"Normal battery performance\"]},\"other_other\":{\"title\":\"Other\",\"features\":[\"Free diagnosis\",\"Please describe the problem\"]}};\n        var displayPriority = {\"back_cover_originals\":1,\"back_cover_pulled\":2,\"battery_ferdi\":3,\"battery_original\":4,\"battery_originals\":5,\"display_basic\":6,\"display_ferdi\":7,\"display_originals\":8,\"display_refurbished\":9,\"other_other\":10};\n        var i18n = {\"choose_repair\":\"Choose your repair\",\"select_device\":\"Select your device and repair type\",\"loading\":\"Loading options...\",\"no_options\":\"No repair options found for your selection.\",\"load_failed\":\"Failed to load repair options. Please try again.\",\"connection_error\":\"Connection error. Please check your internet connection and try again.\",\"back\":\"\\u2190 Back\",\"on_request\":\"On request\",\"make_appointment\":\"Make an appointment\",\"repair_submission\":\"Repair Submission\",\"name\":\"Name\",\"contact_method\":\"Preferred Contact Method:\",\"email\":\"Email\",\"whatsapp\":\"WhatsApp\",\"email_address\":\"Email Address\",\"whatsapp_number\":\"WhatsApp Number\",\"repair\":\"Repair\",\"problem_description\":\"Problem Description\",\"agree_text\":\"I agree with the\",\"terms_label\":\"Terms and Conditions\",\"terms_url\":\"https:\\\/\\\/ferdifixt.nl\\\/en\\\/terms-and-conditions\",\"submit_btn\":\"Submit Repair Request\",\"contact_alert\":\"Please fill in your contact information.\"};\n        \n        var selectionState = {\n            merk: null,\n            serie: null,\n            model: null,\n            reparatiesoort: null,\n            currentStep: 'merk',\n            path: []\n        };\n\n        \/\/ ---- URL param helpers ----\n        function getURLParam(name) {\n            var params = new URLSearchParams(window.location.search);\n            return params.get(name);\n        }\n\n        function updateURL() {\n            var params = new URLSearchParams(window.location.search);\n            var keys = ['merk', 'serie', 'model', 'reparatiesoort'];\n            var stateKeys = ['merk', 'serie', 'model', 'reparatiesoort'];\n\n            keys.forEach(function(key, i) {\n                var val = selectionState[stateKeys[i]];\n                if (val) {\n                    params.set(key, val);\n                } else {\n                    params.delete(key);\n                }\n            });\n\n            var newUrl = window.location.pathname + (params.toString() ? '?' + params.toString() : '');\n            history.replaceState(null, '', newUrl);\n        }\n\n        function init() {\n            showLoadingSpinner(true);\n            jQuery.post(ajaxurl, {\n                action: 'reparatie_get_all_data',\n                nonce: ajaxNonce\n            }, function(response){\n                showLoadingSpinner(false);\n                if(response.success){\n                    allData = response.data;\n                    applyURLParams();\n                } else {\n                    showError(i18n.load_failed);\n                }\n            }).fail(function() {\n                showLoadingSpinner(false);\n                showError(i18n.connection_error);\n            });\n        }\n\n        function applyURLParams() {\n            var urlMerk         = getURLParam('merk');\n            var urlSerie        = getURLParam('serie');\n            var urlModel        = getURLParam('model');\n            var urlReparatie    = getURLParam('reparatiesoort');\n\n            \/\/ Validate merk\n            if (urlMerk) {\n                var brands = getUniqueValues('merk', {});\n                if (brands.indexOf(urlMerk) === -1) {\n                    \/\/ Invalid \u2014 fall back silently\n                    showBrandSelection();\n                    return;\n                }\n                selectionState.merk = urlMerk;\n                selectionState.path = [urlMerk];\n            } else {\n                showBrandSelection();\n                return;\n            }\n\n            \/\/ Validate serie\n            if (urlSerie) {\n                var series = getUniqueValues('serie', {merk: selectionState.merk});\n                if (series.indexOf(urlSerie) === -1) {\n                    selectionState.merk = null; selectionState.path = [];\n                    showBrandSelection();\n                    return;\n                }\n                selectionState.serie = urlSerie;\n                selectionState.path.push(urlSerie);\n            } else {\n                showSeriesSelection();\n                return;\n            }\n\n            \/\/ Validate model\n            if (urlModel) {\n                var models = getUniqueValues('model', {merk: selectionState.merk, serie: selectionState.serie});\n                if (models.indexOf(urlModel) === -1) {\n                    selectionState.serie = null; selectionState.path = [selectionState.merk];\n                    showModelSelection();\n                    return;\n                }\n                selectionState.model = urlModel;\n                selectionState.path.push(urlModel);\n            } else {\n                showModelSelection();\n                return;\n            }\n\n            \/\/ Validate reparatiesoort\n            if (urlReparatie) {\n                var repairTypes = getUniqueValues('reparatiesoort', {\n                    merk: selectionState.merk,\n                    serie: selectionState.serie,\n                    model: selectionState.model\n                });\n                if (repairTypes.indexOf(urlReparatie) === -1) {\n                    selectionState.model = null; selectionState.path = [selectionState.merk, selectionState.serie];\n                    showRepairTypeSelection();\n                    return;\n                }\n                selectionState.reparatiesoort = urlReparatie;\n                selectionState.path.push(urlReparatie);\n                showFinalOptions();\n            } else {\n                showRepairTypeSelection();\n            }\n        }\n\n        function showLoadingSpinner(show) {\n            jQuery('#loading-spinner').toggle(show);\n        }\n\n        function showError(message) {\n            jQuery('#panels-container').html('<div style=\"text-align: center; padding: 40px; color: #dc3545;\"><p>' + message + '<\/p><\/div>').addClass('visible');\n        }\n\n        function getUniqueValues(field, filters) {\n            var filtered = allData.filter(function(item){\n                for(var key in filters) {\n                    if(filters[key] && item[key] !== filters[key]){\n                        return false;\n                    }\n                }\n                return true;\n            });\n            var values = filtered.map(function(item){ return item[field]; });\n            return [...new Set(values)];\n        }\n\n        function updateBreadcrumb() {\n            var breadcrumbNav = jQuery('#breadcrumb-nav');\n            var html = '';\n            \n            if (selectionState.path.length > 0) {\n                html += '<a href=\"#\" class=\"breadcrumb-back\" onclick=\"return goBack(event)\">' + escapeHtml(i18n.back) + '<\/a>';\n                breadcrumbNav.html(html).show();\n            } else {\n                breadcrumbNav.hide();\n            }\n        }\n\n        window.goBack = function(event) {\n            if (event) {\n                event.preventDefault();\n            }\n            \n            if (selectionState.path.length === 0) return;\n            \n            switch(selectionState.currentStep) {\n                case 'serie':\n                    selectionState.merk = null;\n                    selectionState.currentStep = 'merk';\n                    selectionState.path = [];\n                    updateURL();\n                    showBrandSelection();\n                    break;\n                case 'model':\n                    selectionState.serie = null;\n                    selectionState.currentStep = 'serie';\n                    selectionState.path.pop();\n                    updateURL();\n                    showSeriesSelection();\n                    break;\n                case 'reparatiesoort':\n                    selectionState.model = null;\n                    selectionState.currentStep = 'model';\n                    selectionState.path.pop();\n                    updateURL();\n                    showModelSelection();\n                    break;\n                case 'final':\n                    selectionState.reparatiesoort = null;\n                    selectionState.currentStep = 'reparatiesoort';\n                    selectionState.path.pop();\n                    updateURL();\n                    showRepairTypeSelection();\n                    break;\n            }\n            return false;\n        };\n\n        function showBrandSelection() {\n            selectionState.currentStep = 'merk';\n            var brands = getUniqueValues('merk', {});\n            var panelsHtml = '';\n            \n            brands.forEach(function(brand) {\n                panelsHtml += '<div class=\"selection-panel\" onclick=\"selectBrand(\\'' + escapeHtml(brand) + '\\')\">';\n                panelsHtml += '<div class=\"panel-content\">';\n                panelsHtml += '<div class=\"panel-text-bar\">';\n                panelsHtml += '<div class=\"panel-text\">' + escapeHtml(brand) + '<\/div>';\n                panelsHtml += '<\/div>';\n                panelsHtml += '<\/div><\/div>';\n            });\n            \n            showPanels(panelsHtml);\n            updateBreadcrumb();\n        }\n\n        function showSeriesSelection() {\n            selectionState.currentStep = 'serie';\n            var series = getUniqueValues('serie', {merk: selectionState.merk});\n            var panelsHtml = '';\n            \n            series.forEach(function(serie) {\n                panelsHtml += '<div class=\"selection-panel\" onclick=\"selectSeries(\\'' + escapeHtml(serie) + '\\')\">';\n                panelsHtml += '<div class=\"panel-content\">';\n                panelsHtml += '<div class=\"panel-text-bar\">';\n                panelsHtml += '<div class=\"panel-text\">' + escapeHtml(serie) + '<\/div>';\n                panelsHtml += '<\/div>';\n                panelsHtml += '<\/div><\/div>';\n            });\n            \n            showPanels(panelsHtml);\n            updateBreadcrumb();\n        }\n\n        function showModelSelection() {\n            selectionState.currentStep = 'model';\n            var models = getUniqueValues('model', {\n                merk: selectionState.merk,\n                serie: selectionState.serie\n            });\n            var panelsHtml = '';\n            \n            models.forEach(function(model) {\n                panelsHtml += '<div class=\"selection-panel\" onclick=\"selectModel(\\'' + escapeHtml(model) + '\\')\">';\n                panelsHtml += '<div class=\"panel-content\">';\n                panelsHtml += '<div class=\"panel-text-bar\">';\n                panelsHtml += '<div class=\"panel-text\">' + escapeHtml(model) + '<\/div>';\n                panelsHtml += '<\/div>';\n                panelsHtml += '<\/div><\/div>';\n            });\n            \n            showPanels(panelsHtml);\n            updateBreadcrumb();\n        }\n\n        function showRepairTypeSelection() {\n            selectionState.currentStep = 'reparatiesoort';\n            var repairTypes = getUniqueValues('reparatiesoort', {\n                merk: selectionState.merk,\n                serie: selectionState.serie,\n                model: selectionState.model\n            });\n            var panelsHtml = '';\n            \n            repairTypes.forEach(function(repairType) {\n                panelsHtml += '<div class=\"selection-panel\" onclick=\"selectRepairType(\\'' + escapeHtml(repairType) + '\\')\">';\n                panelsHtml += '<div class=\"panel-content\">';\n                panelsHtml += '<div class=\"panel-text-bar\">';\n                panelsHtml += '<div class=\"panel-text\">' + escapeHtml(repairType) + '<\/div>';\n                panelsHtml += '<\/div>';\n                panelsHtml += '<\/div><\/div>';\n            });\n            \n            showPanels(panelsHtml);\n            updateBreadcrumb();\n        }\n\n        function showFinalOptions() {\n            selectionState.currentStep = 'final';\n            var filteredOptions = allData.filter(function(item) {\n                return item.merk === selectionState.merk &&\n                       item.serie === selectionState.serie &&\n                       item.model === selectionState.model &&\n                       item.reparatiesoort === selectionState.reparatiesoort;\n            });\n\n            if (filteredOptions.length === 0) {\n                showError(i18n.no_options);\n                return;\n            }\n\n            \/\/ Sort by display priority\n            filteredOptions.sort(function(a, b) {\n                var keyA = a.reparatiesoort.toLowerCase().replace(\/ \/g, '_') + '_' + a.kwaliteit.toLowerCase().replace(\/ \/g, '_');\n                var keyB = b.reparatiesoort.toLowerCase().replace(\/ \/g, '_') + '_' + b.kwaliteit.toLowerCase().replace(\/ \/g, '_');\n                var priorityA = displayPriority[keyA] || 999;\n                var priorityB = displayPriority[keyB] || 999;\n                return priorityA - priorityB;\n            });\n\n            var optionsHtml = '';\n            filteredOptions.forEach(function(option) {\n                var normalizedRepair = option.reparatiesoort.toLowerCase().trim().replace(\/ \/g, '_');\n                var normalizedQuality = option.kwaliteit.toLowerCase().trim().replace(\/ \/g, '_');\n                var key = normalizedRepair + '_' + normalizedQuality;\n                var description = boxDescriptions[key];\n                \n                if (description) {\n                    var priceText = (parseFloat(option.klantprijs) === -1) ? i18n.on_request : ('\u20ac ' + parseFloat(option.klantprijs).toFixed(2).replace('.',','));\n                    \n                    optionsHtml += '<div class=\"repair-option-panel\">';\n                    optionsHtml += '<div class=\"repair-panel-header\">';\n                    optionsHtml += '<div class=\"repair-panel-title\">' + escapeHtml(description.title) + '<\/div>';\n                    optionsHtml += '<div class=\"repair-panel-model\">' + escapeHtml(option.model) + '<\/div>';\n                    optionsHtml += '<div class=\"repair-panel-price\">' + priceText + '<\/div>';\n                    optionsHtml += '<\/div>';\n                    optionsHtml += '<div class=\"repair-panel-body\">';\n                    \n                    if (description.features && description.features.length > 0) {\n                        description.features.forEach(function(feature) {\n                            if (feature.trim() !== '') {\n                                optionsHtml += '<div class=\"repair-feature\">' + escapeHtml(feature) + '<\/div>';\n                            }\n                        });\n                    }\n                    \n                    optionsHtml += '<\/div>';\n                    optionsHtml += '<div class=\"repair-panel-footer\">';\n                    optionsHtml += '<button class=\"appointment-btn\" onclick=\"makeAppointment(\\'' + \n                        escapeHtml(option.model) + '\\', \\'' + escapeHtml(description.title) + '\\', \\'' + priceText + '\\')\">' + i18n.make_appointment + '<\/button>';\n                    optionsHtml += '<\/div>';\n                    optionsHtml += '<\/div>';\n                }\n            });\n\n            jQuery('#panels-container').removeClass('visible').html('');\n            jQuery('#final-options-container').html(optionsHtml);\n            \n            setTimeout(function() {\n                jQuery('#final-options-container').addClass('visible');\n            }, 100);\n            \n            updateBreadcrumb();\n        }\n\n        window.selectBrand = function(brand) {\n            selectionState.merk = brand;\n            selectionState.path = [brand];\n            updateURL();\n            showSeriesSelection();\n        };\n\n        window.selectSeries = function(serie) {\n            selectionState.serie = serie;\n            selectionState.path.push(serie);\n            updateURL();\n            showModelSelection();\n        };\n\n        window.selectModel = function(model) {\n            selectionState.model = model;\n            selectionState.path.push(model);\n            updateURL();\n            showRepairTypeSelection();\n        };\n\n        window.selectRepairType = function(repairType) {\n            selectionState.reparatiesoort = repairType;\n            selectionState.path.push(repairType);\n            updateURL();\n            showFinalOptions();\n        };\n\n        function showPanels(html) {\n            jQuery('#final-options-container').removeClass('visible').html('');\n            var container = jQuery('#panels-container');\n            \n            container.removeClass('visible');\n            \n            setTimeout(function() {\n                container.html(html);\n                \n                container.find('.selection-panel').each(function(index) {\n                    var panel = jQuery(this);\n                    panel.css({\n                        'opacity': '0',\n                        'transform': 'scale(0.9)'\n                    });\n                    \n                    setTimeout(function() {\n                        panel.css({\n                            'opacity': '1',\n                            'transform': 'scale(1)',\n                            'transition': 'all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1)'\n                        });\n                    }, index * 80);\n                });\n                \n                container.addClass('visible');\n            }, 200);\n        }\n\n        function escapeHtml(text) {\n            var map = {\n                '&': '&amp;',\n                '<': '&lt;',\n                '>': '&gt;',\n                '\"': '&quot;',\n                \"'\": '&#039;'\n            };\n            return String(text).replace(\/[&<>\"']\/g, function(m) { return map[m]; });\n        }\n\n        window.makeAppointment = function(model, title, price) {\n            var reparatieValue = model + ' ' + title + ' ' + price;\n            jQuery('#ferdi_reparatie').val(reparatieValue);\n            \n            jQuery('#filter-container').fadeOut(300, function(){\n                jQuery('#repair-form-container').css({ display: 'block' }).animate({ opacity: 1 }, 300);\n            });\n        };\n\n        jQuery('#ferdi-reparatie-form').on('submit', function(e){\n            var contactMethod = jQuery(\"input[name='ferdi_contact_method']:checked\").val();\n            var hasValidContact = false;\n            \n            if (contactMethod === 'email' && jQuery('#ferdi_email').val().trim() !== '') {\n                hasValidContact = true;\n            } else if (contactMethod === 'whatsapp' && jQuery('#ferdi_telefoon').val().trim() !== '') {\n                hasValidContact = true;\n            }\n            \n            if (!hasValidContact) {\n                e.preventDefault();\n                alert(i18n.contact_alert);\n                return false;\n            }\n            \n            if (contactMethod === 'email') {\n                jQuery('<input>').attr({\n                    type: 'hidden',\n                    name: 'ferdi_achternaam',\n                    value: ''\n                }).appendTo(this);\n                jQuery('<input>').attr({\n                    type: 'hidden',\n                    name: 'ferdi_bereikbaar[]',\n                    value: 'email'\n                }).appendTo(this);\n            } else {\n                jQuery('<input>').attr({\n                    type: 'hidden',\n                    name: 'ferdi_achternaam',\n                    value: ''\n                }).appendTo(this);\n                jQuery('<input>').attr({\n                    type: 'hidden',\n                    name: 'ferdi_bereikbaar[]',\n                    value: 'whatsapp'\n                }).appendTo(this);\n                jQuery('<input>').attr({\n                    type: 'hidden',\n                    name: 'ferdi_email',\n                    value: jQuery('#ferdi_telefoon').val()\n                }).appendTo(this);\n            }\n        });\n\n        jQuery('input[name=\"ferdi_contact_method\"]').on('change', function() {\n            var method = jQuery(this).val();\n            \n            jQuery('#ferdi_email, #ferdi_telefoon').attr('required', false);\n            jQuery('#email_field, #whatsapp_field').hide();\n            \n            if (method === 'email') {\n                jQuery('#ferdi_email').attr('required', true);\n                jQuery('#email_field').show();\n            } else {\n                jQuery('#ferdi_telefoon').attr('required', true);\n                jQuery('#whatsapp_field').show();\n            }\n        });\n\n        jQuery(document).ready(function() {\n            init();\n        });\n\n    })();\n    <\/script>\n    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Repair<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-95","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ferdifixt.nl\/en\/wp-json\/wp\/v2\/pages\/95","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ferdifixt.nl\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ferdifixt.nl\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ferdifixt.nl\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ferdifixt.nl\/en\/wp-json\/wp\/v2\/comments?post=95"}],"version-history":[{"count":105,"href":"https:\/\/ferdifixt.nl\/en\/wp-json\/wp\/v2\/pages\/95\/revisions"}],"predecessor-version":[{"id":801,"href":"https:\/\/ferdifixt.nl\/en\/wp-json\/wp\/v2\/pages\/95\/revisions\/801"}],"wp:attachment":[{"href":"https:\/\/ferdifixt.nl\/en\/wp-json\/wp\/v2\/media?parent=95"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}