{"id":29337,"date":"2025-11-20T16:31:25","date_gmt":"2025-11-20T16:31:25","guid":{"rendered":"https:\/\/demo.materiamedica.net\/demo31\/?page_id=29337"},"modified":"2025-12-26T09:22:27","modified_gmt":"2025-12-26T09:22:27","slug":"search","status":"publish","type":"page","link":"https:\/\/demo.materiamedica.net\/demo31\/search\/","title":{"rendered":"search"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"29337\" class=\"elementor elementor-29337\">\n\t\t\t\t<div class=\"wd-negative-gap elementor-element elementor-element-d5193d3 e-flex e-con-boxed e-con e-parent\" data-id=\"d5193d3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-890ceb7 elementor-widget elementor-widget-shortcode\" data-id=\"890ceb7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">    <style>\r\n    .tsw-wrapper{max-width:480px;margin:0 auto;padding:0}\r\n    .tsw-container{background:linear-gradient(135deg,#fbbf24 0%,#dc2626 100%);border-radius:20px;padding:0;overflow:hidden;box-shadow:0 10px 40px rgba(251, 191, 36,0.3)}\r\n    .tsw-header{background:rgba(255,255,255,0.15);backdrop-filter:blur(10px);padding:24px 28px;text-align:center;border-bottom:1px solid rgba(255,255,255,0.2)}\r\n    .tsw-header-content{display:flex;align-items:center;justify-content:center;gap:12px}\r\n    .tsw-header img{height:36px;width:36px}\r\n    .tsw-title{font-size:20px;font-weight:700;color:#fff;margin:0;line-height:1.3}\r\n    .tsw-subtitle{font-size:13px;color:rgba(255,255,255,0.9);margin:6px 0 0 0;line-height:1.4}\r\n    .tsw-tabs{display:flex;background:rgba(255,255,255,0.1);border-bottom:1px solid rgba(255,255,255,0.2)}\r\n    .tsw-tab-btn{flex:1;padding:16px;font-weight:600;font-size:15px;background:transparent;border:none;cursor:pointer;color:rgba(255,255,255,0.7);transition:all .2s;border-bottom:3px solid transparent}\r\n    .tsw-tab-btn:hover{color:#fff;background:rgba(255,255,255,0.05)}\r\n    .tsw-tab-btn.tsw-active{color:#fff;border-bottom-color:#fff;background:rgba(255,255,255,0.1)}\r\n    .tsw-content{background:#fff;padding:28px 24px 32px 24px}\r\n    .tsw-tab{display:none}\r\n    .tsw-tab.tsw-active{display:block}\r\n    .tsw-select-wrapper{position:relative;margin-bottom:16px}\r\n    .tsw-select{width:100%;padding:14px 42px 14px 16px;border-radius:8px;border:1px solid #e5e7eb;background:#fff;font-size:15px;color:#374151;appearance:none;cursor:pointer;transition:all .2s}\r\n    .tsw-select:hover{border-color:#d1d5db}\r\n    .tsw-select:focus{border-color:#fbbf24;outline:none;box-shadow:0 0 0 3px rgba(251, 191, 36,0.1)}\r\n    .tsw-select:disabled{background:#f9fafb;color:#9ca3af;cursor:not-allowed;border-color:#e5e7eb}\r\n    .tsw-select-wrapper::after{content:'';position:absolute;right:16px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #6b7280;pointer-events:none;transition:all .2s}\r\n    .tsw-select:disabled + .tsw-select-wrapper::after{border-top-color:#d1d5db}\r\n    .tsw-btn{width:100%;padding:16px;border:none;border-radius:8px;font-size:16px;font-weight:700;color:#fff;cursor:pointer;background:#fbbf24;transition:all .2s;margin-top:8px;display:flex;align-items:center;justify-content:center;gap:8px}\r\n    .tsw-btn:hover{background:#dc2626;transform:translateY(-1px);box-shadow:0 6px 20px rgba(220, 38, 38,0.4)}\r\n    .tsw-btn:active{transform:translateY(0)}\r\n    .tsw-btn svg{width:18px;height:18px}\r\n    @media(max-width:520px){\r\n        .tsw-content{padding:24px 20px 28px 20px}\r\n        .tsw-title{font-size:18px}\r\n        .tsw-subtitle{font-size:12px}\r\n    }\r\n    <\/style>\r\n\r\n    <div class=\"tsw-wrapper\">\r\n      <div class=\"tsw-container\">\r\n        <div class=\"tsw-header\">\r\n          <div class=\"tsw-header-content\">\r\n            <img decoding=\"async\" src=\"https:\/\/demo.materiamedica.net\/demo31\/wp-content\/uploads\/2025\/12\/car_18369364.png\" alt=\"icon\" \/>\r\n            <div class=\"tsw-title\">Get Car tyre fitted<\/div>\r\n          <\/div>\r\n          <div class=\"tsw-subtitle\">Available in selected cities<\/div>\r\n        <\/div>\r\n\r\n        <div class=\"tsw-tabs\">\r\n          <button class=\"tsw-tab-btn\" data-tab=\"size\">Tyres Size<\/button>\r\n          <button class=\"tsw-tab-btn\" data-tab=\"vehicle\">Vehicle Brands<\/button>\r\n        <\/div>\r\n\r\n        <div class=\"tsw-content\">\r\n          <div id=\"tsw-tab-size\" class=\"tsw-tab tsw-active\">\r\n            <div class=\"tsw-select-wrapper\">\r\n              <select id=\"tsw_width\" class=\"tsw-select\">\r\n                <option value=\"\">Select Width<\/option>\r\n              <\/select>\r\n            <\/div>\r\n\r\n            <div class=\"tsw-select-wrapper\">\r\n              <select id=\"tsw_profile\" class=\"tsw-select\" disabled>\r\n                <option value=\"\">Select Profile<\/option>\r\n              <\/select>\r\n            <\/div>\r\n\r\n            <div class=\"tsw-select-wrapper\">\r\n              <select id=\"tsw_rim\" class=\"tsw-select\" disabled>\r\n                <option value=\"\">Select Rim *<\/option>\r\n              <\/select>\r\n            <\/div>\r\n\r\n                        <div class=\"tsw-select-wrapper\">\r\n              <select id=\"tsw_city_size\" class=\"tsw-select\">\r\n                <option value=\"\">Select City (Optional)<\/option>\r\n                                  <option value=\"bengaluru\">Bengaluru<\/option>\r\n                                  <option value=\"chennai\">Chennai<\/option>\r\n                                  <option value=\"delhi-ncr\">Delhi NCR<\/option>\r\n                                  <option value=\"hyderabad\">Hyderabad<\/option>\r\n                                  <option value=\"mumbai\">Mumbai<\/option>\r\n                                  <option value=\"pune\">Pune<\/option>\r\n                                  <option value=\"other-city\">Other City<\/option>\r\n                              <\/select>\r\n            <\/div>\r\n            \r\n            <button id=\"tsw_btn_size\" class=\"tsw-btn\">\r\n              <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z\"\/><\/svg>\r\n              Search Tyres\r\n            <\/button>\r\n          <\/div>\r\n\r\n          <div id=\"tsw-tab-vehicle\" class=\"tsw-tab\">\r\n            <div class=\"tsw-select-wrapper\">\r\n              <select id=\"tsw_brand\" class=\"tsw-select\">\r\n                <option value=\"\">Select Brand<\/option>\r\n              <\/select>\r\n            <\/div>\r\n\r\n            <div class=\"tsw-select-wrapper\">\r\n              <select id=\"tsw_model\" class=\"tsw-select\" disabled>\r\n                <option value=\"\">Select Model<\/option>\r\n              <\/select>\r\n            <\/div>\r\n\r\n            <div class=\"tsw-select-wrapper\">\r\n              <select id=\"tsw_variant\" class=\"tsw-select\" disabled>\r\n                <option value=\"\">Select Variant *<\/option>\r\n              <\/select>\r\n            <\/div>\r\n\r\n                        <div class=\"tsw-select-wrapper\">\r\n              <select id=\"tsw_city\" class=\"tsw-select\">\r\n                <option value=\"\">Select City (Optional)<\/option>\r\n                                  <option value=\"bengaluru\">Bengaluru<\/option>\r\n                                  <option value=\"chennai\">Chennai<\/option>\r\n                                  <option value=\"delhi-ncr\">Delhi NCR<\/option>\r\n                                  <option value=\"hyderabad\">Hyderabad<\/option>\r\n                                  <option value=\"mumbai\">Mumbai<\/option>\r\n                                  <option value=\"pune\">Pune<\/option>\r\n                                  <option value=\"other-city\">Other City<\/option>\r\n                              <\/select>\r\n            <\/div>\r\n            \r\n            <button id=\"tsw_btn_vehicle\" class=\"tsw-btn\">\r\n              <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z\"\/><\/svg>\r\n              Search Tyres\r\n            <\/button>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n    jQuery(function($){\r\n        var opts = {\"vehicle_brand\":\"pa_brand\",\"vehicle_model\":\"pa_model\",\"vehicle_variant\":\"pa_variant\",\"size_width\":\"pa_width\",\"size_profile\":\"pa_profile\",\"size_rim\":\"pa_rim\",\"results_target\":\"shop\",\"custom_url\":\"\",\"shop_url\":\"https:\\\/\\\/demo.materiamedica.net\\\/demo31\\\/tyre-catalogue\\\/\"};\r\n\r\n        var ajaxurl = \"https:\/\/demo.materiamedica.net\/demo31\/wp-admin\/admin-ajax.php\";\r\n\r\n        \/\/ Tab switching\r\n        $('.tsw-tab-btn').on('click', function(){\r\n            $('.tsw-tab-btn').removeClass('tsw-active');\r\n            $(this).addClass('tsw-active');\r\n            var t = $(this).data('tab');\r\n            $('.tsw-tab').removeClass('tsw-active');\r\n            $('#tsw-tab-'+t).addClass('tsw-active');\r\n        });\r\n\r\n        \/\/ Load terms for any taxonomy\r\n        function loadTerms(tax, target) {\r\n            if (!tax || !target) return;\r\n            $.post(ajaxurl, { action: 'tsw_load_terms', taxonomy: tax }, function(resp){\r\n                if (!resp) return;\r\n                var placeholder = $(target).find('option:first').text();\r\n                $(target).html('<option value=\"\">' + placeholder + '<\/option>' + resp);\r\n            });\r\n        }\r\n\r\n        \/\/ Initial loads\r\n        loadTerms(opts.vehicle_brand, '#tsw_brand');\r\n        loadTerms(opts.size_width, '#tsw_width');\r\n\r\n        \/\/ Brand -> Models\r\n        $('#tsw_brand').on('change', function(){\r\n            var brand = $(this).val();\r\n            \r\n            $('#tsw_model').prop('disabled', true).html('<option value=\"\">Select Model<\/option>');\r\n            $('#tsw_variant').prop('disabled', true).html('<option value=\"\">Select Variant *<\/option>');\r\n            \r\n            if (!brand) return;\r\n            \r\n            $.post(ajaxurl, { \r\n                action: 'tsw_load_models', \r\n                brand: brand, \r\n                brand_tax: opts.vehicle_brand, \r\n                model_tax: opts.vehicle_model \r\n            }, function(resp){\r\n                if (resp) {\r\n                    $('#tsw_model').html('<option value=\"\">Select Model<\/option>' + resp).prop('disabled', false);\r\n                }\r\n            });\r\n        });\r\n\r\n        \/\/ Model -> Variants\r\n        $('#tsw_model').on('change', function(){\r\n            var model = $(this).val();\r\n            \r\n            $('#tsw_variant').prop('disabled', true).html('<option value=\"\">Select Variant *<\/option>');\r\n            \r\n            if (!model) return;\r\n            \r\n            $.post(ajaxurl, { \r\n                action: 'tsw_load_variants', \r\n                model: model, \r\n                model_tax: opts.vehicle_model, \r\n                variant_tax: opts.vehicle_variant \r\n            }, function(resp){\r\n                if (resp) {\r\n                    $('#tsw_variant').html('<option value=\"\">Select Variant *<\/option>' + resp).prop('disabled', false);\r\n                }\r\n            });\r\n        });\r\n\r\n        \/\/ Width -> Profiles\r\n        $('#tsw_width').on('change', function(){\r\n            var width = $(this).val();\r\n            \r\n            $('#tsw_profile').prop('disabled', true).html('<option value=\"\">Select Profile<\/option>');\r\n            $('#tsw_rim').prop('disabled', true).html('<option value=\"\">Select Rim *<\/option>');\r\n            \r\n            if (!width) return;\r\n            \r\n            $.post(ajaxurl, { \r\n                action: 'tsw_load_profiles', \r\n                width: width, \r\n                width_tax: opts.size_width, \r\n                profile_tax: opts.size_profile \r\n            }, function(resp){\r\n                if (resp) {\r\n                    $('#tsw_profile').html('<option value=\"\">Select Profile<\/option>' + resp).prop('disabled', false);\r\n                }\r\n            });\r\n        });\r\n\r\n        \/\/ Profile -> Rims\r\n        $('#tsw_profile').on('change', function(){\r\n            var profile = $(this).val();\r\n            \r\n            $('#tsw_rim').prop('disabled', true).html('<option value=\"\">Select Rim *<\/option>');\r\n            \r\n            if (!profile) return;\r\n            \r\n            var width = $('#tsw_width').val();\r\n            \r\n            $.post(ajaxurl, { \r\n                action: 'tsw_load_rims', \r\n                width: width,\r\n                profile: profile, \r\n                width_tax: opts.size_width,\r\n                profile_tax: opts.size_profile, \r\n                rim_tax: opts.size_rim \r\n            }, function(resp){\r\n                if (resp) {\r\n                    $('#tsw_rim').html('<option value=\"\">Select Rim *<\/option>' + resp).prop('disabled', false);\r\n                }\r\n            });\r\n        });\r\n\r\n        \/\/ Vehicle search submit\r\n        $('#tsw_btn_vehicle').on('click', function(e){\r\n            e.preventDefault();\r\n            var brand = $('#tsw_brand').val();\r\n            var model = $('#tsw_model').val();\r\n            var variant = $('#tsw_variant').val();\r\n            var city = $('#tsw_city').length ? $('#tsw_city').val() : '';\r\n\r\n            if (!brand) { alert('Please select Brand'); return; }\r\n            if (!model) { alert('Please select Model'); return; }\r\n            if (!variant) { alert('Please select Variant'); return; }\r\n\r\n            var params = { brand: brand, model: model, variant: variant };\r\n            if (city) params.city = city;\r\n\r\n            var q = $.param(params);\r\n            var dest = (opts.results_target === 'custom' && opts.custom_url) ? opts.custom_url : opts.shop_url;\r\n            window.location.href = dest + (q ? ('?' + q) : '');\r\n        });\r\n\r\n        \/\/ Size search submit\r\n        $('#tsw_btn_size').on('click', function(e){\r\n            e.preventDefault();\r\n            var width = $('#tsw_width').val();\r\n            var profile = $('#tsw_profile').val();\r\n            var rim = $('#tsw_rim').val();\r\n            var city = $('#tsw_city_size').length ? $('#tsw_city_size').val() : '';\r\n\r\n            if (!width) { alert('Please select Width'); return; }\r\n            if (!profile) { alert('Please select Profile'); return; }\r\n            if (!rim) { alert('Please select Rim'); return; }\r\n\r\n            var params = { width: width, profile: profile, rim: rim };\r\n            if (city) params.city = city;\r\n\r\n            var q = $.param(params);\r\n            var dest = (opts.results_target === 'custom' && opts.custom_url) ? opts.custom_url : opts.shop_url;\r\n            window.location.href = dest + (q ? ('?' + q) : '');\r\n        });\r\n    });\r\n    <\/script>\r\n    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-29337","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/demo.materiamedica.net\/demo31\/wp-json\/wp\/v2\/pages\/29337","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/demo.materiamedica.net\/demo31\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo.materiamedica.net\/demo31\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo.materiamedica.net\/demo31\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/demo.materiamedica.net\/demo31\/wp-json\/wp\/v2\/comments?post=29337"}],"version-history":[{"count":48,"href":"https:\/\/demo.materiamedica.net\/demo31\/wp-json\/wp\/v2\/pages\/29337\/revisions"}],"predecessor-version":[{"id":30223,"href":"https:\/\/demo.materiamedica.net\/demo31\/wp-json\/wp\/v2\/pages\/29337\/revisions\/30223"}],"wp:attachment":[{"href":"https:\/\/demo.materiamedica.net\/demo31\/wp-json\/wp\/v2\/media?parent=29337"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}