{"id":5313,"date":"2025-11-10T10:07:54","date_gmt":"2025-11-10T08:07:54","guid":{"rendered":"https:\/\/ks-scienceoasis.org.sa\/school-booking\/"},"modified":"2025-11-12T12:09:52","modified_gmt":"2025-11-12T10:09:52","slug":"school-booking","status":"publish","type":"page","link":"https:\/\/ks-scienceoasis.org.sa\/en\/school-booking\/","title":{"rendered":"School Booking"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"5313\" class=\"elementor elementor-5313 elementor-5305\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3664cfe e-flex e-con-boxed e-con e-parent\" data-id=\"3664cfe\" data-element_type=\"container\" data-e-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<div class=\"elementor-element elementor-element-1d1b019 e-con-full e-flex e-con e-child\" data-id=\"1d1b019\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a4f2911 jet-breadcrumbs-align-center elementor-widget elementor-widget-jet-breadcrumbs\" data-id=\"a4f2911\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"jet-breadcrumbs.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-jet-breadcrumbs jet-blocks\">\n\t\t<div class=\"jet-breadcrumbs\">\n\t\t<div class=\"jet-breadcrumbs__content\">\n\t\t<div class=\"jet-breadcrumbs__wrap\"><div class=\"jet-breadcrumbs__item\"><a href=\"https:\/\/ks-scienceoasis.org.sa\/en\/\" class=\"jet-breadcrumbs__item-link is-home\" rel=\"home\" title=\"\u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629\">\u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629<\/a><\/div>\n\t\t<\/div>\n\t\t<\/div>\n\t\t<\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-93a2645 elementor-widget__width-auto elementor-absolute elementor-widget elementor-widget-image\" data-id=\"93a2645\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_position&quot;:&quot;absolute&quot;}\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/ks-scienceoasis-dev.minasatech.com\/wp-content\/uploads\/2024\/11\/placeholder.png\" title=\"\" alt=\"\" loading=\"lazy\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\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-94902cc e-flex e-con-boxed e-con e-parent\" data-id=\"94902cc\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-565d4d4 e-con-full e-flex e-con e-child\" data-id=\"565d4d4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-294d7dd e-con-full e-flex e-con e-child\" data-id=\"294d7dd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-bc3dd58 e-con-full e-flex e-con e-child\" data-id=\"bc3dd58\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b7da4e4 elementor-widget elementor-widget-shortcode\" data-id=\"b7da4e4\" data-element_type=\"widget\" data-e-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\">\r\n<div id=\"school-booking-form\" class=\"school-booking-container\">\r\n    <form id=\"school-booking-form-element\" class=\"sb-booking-form\">\r\n        <h2>Basic School Information<\/h2>\r\n        \r\n        <div class=\"sb-form-section\">\r\n            <div class=\"sb-form-group\">\r\n                <label for=\"visit_date\" class=\"sb-required\">Visit Date<\/label>\r\n                <input type=\"text\" id=\"visit_date\" name=\"visit_date\" required \r\n                       placeholder=\"Select Date\">\r\n            <\/div>\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label for=\"school_name\" class=\"sb-required\">School Name<\/label>\r\n                <input type=\"text\" id=\"school_name\" name=\"school_name\" required>\r\n            <\/div>\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label for=\"school_email\" class=\"sb-required\">Email Address<\/label>\r\n                <input type=\"email\" id=\"school_email\" name=\"school_email\" required>\r\n            <\/div>\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label for=\"coordinator_name\" class=\"sb-required\">Coordinator Name<\/label>\r\n                <input type=\"text\" id=\"coordinator_name\" name=\"coordinator_name\" required>\r\n            <\/div>\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label for=\"coordinator_phone\" class=\"sb-required\">Coordinator Phone<\/label>\r\n                <input type=\"tel\" id=\"coordinator_phone\" name=\"coordinator_phone\" required>\r\n            <\/div>\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label for=\"school_type\" class=\"sb-required\">School Type<\/label>\r\n                <select id=\"school_type\" name=\"school_type\" required>\r\n                    <option value=\"\">Select School Type<\/option>\r\n                    <option value=\"Governmental\">Governmental<\/option>\r\n                    <option value=\"Private\">Private<\/option>\r\n                    <option value=\"International\">International<\/option>\r\n                <\/select>\r\n            <\/div>\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label class=\"sb-required\">Gender<\/label>\r\n                <div class=\"sb-radio-group\">\r\n                    <label>\r\n                        <input type=\"radio\" name=\"school_gender\" value=\"Boys\" required> Boys\r\n                    <\/label>\r\n                    <label>\r\n                        <input type=\"radio\" name=\"school_gender\" value=\"Girls\" required> Girls\r\n                    <\/label>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label for=\"students_count\" class=\"sb-required\">Number of Students<\/label>\r\n                <input type=\"number\" id=\"students_count\" name=\"students_count\" required \r\n                       min=\"1\" max=\"50\" \r\n                       onchange=\"validateStudentsCount()\" \r\n                       oninput=\"validateStudentsCount()\">\r\n                <small>Maximum: 50 students<\/small>\r\n            <\/div>\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label for=\"companions_count\" class=\"sb-required\">Number of Companions<\/label>\r\n                <input type=\"number\" id=\"companions_count\" name=\"companions_count\" required \r\n                       min=\"1\" onchange=\"validateCompanions()\" \r\n                       oninput=\"validateCompanions()\">\r\n                <small id=\"companions-hint\">Minimum 1 companion per 10 students required<\/small>\r\n            <\/div>\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label for=\"arrival_time\" class=\"sb-required\">Arrival Time<\/label>\r\n                <select id=\"arrival_time\" name=\"arrival_time\" required onchange=\"updateDepartureTime()\">\r\n                    <option value=\"\">Select Arrival Time<\/option>\r\n                                            <option value=\"08:00\" \r\n                                data-time-value=\"08:00\">\r\n                            08:00 - 09:00 \u0635\u0628\u0627\u062d\u0627\u064b                        <\/option>\r\n                                            <option value=\"09:00\" \r\n                                data-time-value=\"09:00\">\r\n                            09:00 - 10:00 \u0635\u0628\u0627\u062d\u0627\u064b                        <\/option>\r\n                                            <option value=\"10:00\" \r\n                                data-time-value=\"10:00\">\r\n                            10:00 - 11:00 \u0635\u0628\u0627\u062d\u0627\u064b                        <\/option>\r\n                                            <option value=\"11:00\" \r\n                                data-time-value=\"11:00\">\r\n                            11:00 - 12:00 \u0635\u0628\u0627\u062d\u0627\u064b                        <\/option>\r\n                                            <option value=\"12:00\" \r\n                                data-time-value=\"12:00\">\r\n                            12:00 - 01:00 \u0645\u0633\u0627\u0621\u064b                        <\/option>\r\n                                    <\/select>\r\n                <small id=\"time-availability\"><\/small>\r\n            <\/div>\r\n\r\n            <!-- Hidden departure time field - stored only in database -->\r\n            <input type=\"hidden\" id=\"departure_time\" name=\"departure_time\">\r\n            <input type=\"hidden\" id=\"form_language\" name=\"form_language\" value=\"en\">\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label for=\"region\" class=\"sb-required\">Region<\/label>\r\n                <select id=\"region\" name=\"region\" required>\r\n                    <option value=\"\">Select Region<\/option>\r\n                    <option value=\"Riyadh\">Riyadh<\/option>\r\n                    <option value=\"Makkah\">Makkah<\/option>\r\n                    <option value=\"Madinah\">Madinah<\/option>\r\n                    <option value=\"Qassim\">Qassim<\/option>\r\n                    <option value=\"Eastern Province\">Eastern Province<\/option>\r\n                    <option value=\"Asir\">Asir<\/option>\r\n                    <option value=\"Tabuk\">Tabuk<\/option>\r\n                    <option value=\"Hail\">Hail<\/option>\r\n                    <option value=\"Northern Borders\">Northern Borders<\/option>\r\n                    <option value=\"Jazan\">Jazan<\/option>\r\n                    <option value=\"Najran\">Najran<\/option>\r\n                    <option value=\"Al Baha\">Al Baha<\/option>\r\n                    <option value=\"Al Jawf\">Al Jawf<\/option>\r\n                <\/select>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <h2>Grade Level<\/h2>\r\n        \r\n        <div class=\"sb-form-section\">\r\n            <div class=\"sb-form-group\">\r\n                <label class=\"sb-required\">Grade Level<\/label>\r\n                <div class=\"sb-checkbox-group\">\r\n                    <label>\r\n                        <input type=\"checkbox\" name=\"grade_levels[]\" value=\"Elementary\" onchange=\"toggleGradeDetails()\"> Elementary\r\n                    <\/label>\r\n                    <label>\r\n                        <input type=\"checkbox\" name=\"grade_levels[]\" value=\"Middle\" onchange=\"toggleGradeDetails()\"> Middle\r\n                    <\/label>\r\n                    <label>\r\n                        <input type=\"checkbox\" name=\"grade_levels[]\" value=\"Secondary\" onchange=\"toggleGradeDetails()\"> Secondary\r\n                    <\/label>\r\n                    <label>\r\n                        <input type=\"checkbox\" name=\"grade_levels[]\" value=\"Other\" onchange=\"toggleGradeDetails()\"> Other\r\n                    <\/label>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div id=\"grade-details\" class=\"sb-grade-details\" style=\"display: none;\">\r\n                <div id=\"elementary-details\" class=\"sb-grade-level-details\" style=\"display: none;\">\r\n                    <label class=\"sb-form-group-label\">Grades (Elementary)<\/label>\r\n                    <div class=\"sb-checkbox-group\">\r\n                        <label><input type=\"checkbox\" name=\"grade_levels_details[]\" value=\"4\"> 4<\/label>\r\n                        <label><input type=\"checkbox\" name=\"grade_levels_details[]\" value=\"5\"> 5<\/label>\r\n                        <label><input type=\"checkbox\" name=\"grade_levels_details[]\" value=\"6\"> 6<\/label>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div id=\"middle-details\" class=\"sb-grade-level-details\" style=\"display: none;\">\r\n                    <label class=\"sb-form-group-label\">Grades (Middle)<\/label>\r\n                    <div class=\"sb-checkbox-group\">\r\n                        <label><input type=\"checkbox\" name=\"grade_levels_details[]\" value=\"1st Middle\"> 1st Middle<\/label>\r\n                        <label><input type=\"checkbox\" name=\"grade_levels_details[]\" value=\"2nd Middle\"> 2nd Middle<\/label>\r\n                        <label><input type=\"checkbox\" name=\"grade_levels_details[]\" value=\"3rd Middle\"> 3rd Middle<\/label>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div id=\"secondary-details\" class=\"sb-grade-level-details\" style=\"display: none;\">\r\n                    <label class=\"sb-form-group-label\">Grades (Secondary)<\/label>\r\n                    <div class=\"sb-checkbox-group\">\r\n                        <label><input type=\"checkbox\" name=\"grade_levels_details[]\" value=\"1st Secondary\"> 1st Secondary<\/label>\r\n                        <label><input type=\"checkbox\" name=\"grade_levels_details[]\" value=\"2nd Secondary\"> 2nd Secondary<\/label>\r\n                        <label><input type=\"checkbox\" name=\"grade_levels_details[]\" value=\"3rd Secondary\"> 3rd Secondary<\/label>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div id=\"other-details\" class=\"sb-grade-level-details\" style=\"display: none;\">\r\n                    <label for=\"other_grade_details\" class=\"sb-form-group-label\">Other Details<\/label>\r\n                    <input type=\"text\" id=\"other_grade_details\" name=\"other_grade_details\" placeholder=\"Enter details\">\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label class=\"sb-required\">Students with Special Needs<\/label>\r\n                <div class=\"sb-radio-group\">\r\n                    <label>\r\n                        <input type=\"radio\" name=\"special_needs\" value=\"Yes\" required> Yes\r\n                    <\/label>\r\n                    <label>\r\n                        <input type=\"radio\" name=\"special_needs\" value=\"No\" required> No\r\n                    <\/label>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <h2>Booking Confirmation<\/h2>\r\n        \r\n        <div class=\"sb-form-section\">\r\n            <div class=\"sb-form-group\">\r\n                <label for=\"notes\">Additional Notes<\/label>\r\n                <textarea id=\"notes\" name=\"notes\" rows=\"4\" placeholder=\"Write anything here..\"><\/textarea>\r\n            <\/div>\r\n\r\n            <div class=\"sb-form-group\">\r\n                <label class=\"sb-required\">\r\n                    <input type=\"checkbox\" id=\"acceptance\" name=\"acceptance\" required> \r\n                    <a title=\"Terms, Conditions, &amp; Instructions\" href=\"https:\/\/ks-scienceoasis.org.sa\/en\/school-booking\/terms\/\" target=\"_blank\">Terms, Conditions, &amp; Instructions<\/a>I acknowledge that I have read, understood, and agreed to the terms, conditions, and instructions, and I pledge to abide by them.                <\/label>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"sb-form-actions\">\r\n            <button type=\"submit\" class=\"sb-submit-btn\">Submit Request<\/button>\r\n        <\/div>\r\n    <\/form>\r\n\r\n    <!-- Confirmation Modal -->\r\n    <div id=\"booking-modal\" class=\"sb-modal\" style=\"display: none;\">\r\n        <div class=\"sb-modal-content\">\r\n            <span class=\"sb-close\">&times;<\/span>\r\n            <h3>Request Received<\/h3>\r\n            <p id=\"booking-message\"><\/p>\r\n            <div id=\"booking-details\"><\/div>\r\n            <button type=\"button\" class=\"sb-modal-close-btn\">Close<\/button>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\n\/\/ Validate student count (max 50)\r\nfunction validateStudentsCount() {\r\n    var studentsInput = document.getElementById('students_count');\r\n    var studentsCount = parseInt(studentsInput.value) || 0;\r\n    var maxStudents = 50;\r\n    \r\n    if (studentsCount > maxStudents) {\r\n        alert('Maximum number of students is ' + maxStudents + '. You cannot enter more than ' + maxStudents + ' students.');\r\n        studentsInput.value = maxStudents;\r\n        studentsCount = maxStudents;\r\n    }\r\n    \r\n    \/\/ Update required companions\r\n    if (studentsCount > 0) {\r\n        updateCompanionsRequired();\r\n    }\r\n}\r\n\r\nfunction updateCompanionsRequired() {\r\n    var studentsCount = parseInt(document.getElementById('students_count').value) || 0;\r\n    var requiredCompanions = Math.ceil(studentsCount \/ 10);\r\n    var companionsInput = document.getElementById('companions_count');\r\n    var companionsHint = document.getElementById('companions-hint');\r\n    \r\n    companionsInput.setAttribute('min', requiredCompanions);\r\n    if (companionsInput.value < requiredCompanions) {\r\n        companionsInput.value = requiredCompanions;\r\n    }\r\n    companionsHint.textContent = 'Minimum ' + requiredCompanions + ' companion(s) required (1 per 10 students)';\r\n}\r\n\r\nfunction validateCompanions() {\r\n    var studentsCount = parseInt(document.getElementById('students_count').value) || 0;\r\n    var companionsCount = parseInt(document.getElementById('companions_count').value) || 0;\r\n    var requiredCompanions = Math.ceil(studentsCount \/ 10);\r\n    \r\n    if (studentsCount > 0 && companionsCount < requiredCompanions) {\r\n        alert('Number of companions must be at least ' + requiredCompanions + ' companion(s) (1 per 10 students).\\n\\nNumber of students: ' + studentsCount + '\\nMinimum companions: ' + requiredCompanions);\r\n        document.getElementById('companions_count').value = requiredCompanions;\r\n    }\r\n}\r\n\r\nfunction updateDepartureTime() {\r\n    var arrivalTimeSelect = document.getElementById('arrival_time');\r\n    var arrivalTime = arrivalTimeSelect.value;\r\n    var departureTimeInput = document.getElementById('departure_time');\r\n    \r\n    if (arrivalTime) {\r\n        \/\/ Get selected text from dropdown\r\n        var selectedOption = arrivalTimeSelect.options[arrivalTimeSelect.selectedIndex];\r\n        var timeLabel = selectedOption.textContent;\r\n        \r\n        \/\/ Extract end time from label (e.g., \"8:00 - 9:00\")\r\n        var timeMatch = timeLabel.match(\/(\\d+:\\d+)\\s*-\\s*(\\d+:\\d+)\/);\r\n        if (timeMatch && timeMatch[2]) {\r\n            departureTimeInput.value = timeMatch[2];\r\n        } else {\r\n            \/\/ If range not found, calculate manually\r\n            var timeParts = arrivalTime.split(':');\r\n            var hour = parseInt(timeParts[0]);\r\n            var minute = parseInt(timeParts[1]);\r\n            \r\n            \/\/ Add one hour\r\n            hour += 1;\r\n            if (hour >= 24) {\r\n                hour = 0;\r\n            }\r\n            \r\n            var departureTime = String(hour).padStart(2, '0') + ':' + String(minute).padStart(2, '0');\r\n            departureTimeInput.value = departureTime;\r\n        }\r\n    }\r\n}\r\n\r\nfunction updateAvailableTimes() {\r\n    var visitDate = document.getElementById('visit_date').value;\r\n    if (!visitDate) {\r\n        return;\r\n    }\r\n    \r\n    jQuery.ajax({\r\n        url: schoolBooking.ajax_url,\r\n        type: 'POST',\r\n        data: {\r\n            action: 'get_available_times_school',\r\n            visit_date: visitDate,\r\n            nonce: schoolBooking.nonce\r\n        },\r\n        success: function(response) {\r\n            if (response.success) {\r\n                var arrivalTimeSelect = document.getElementById('arrival_time');\r\n                var currentValue = arrivalTimeSelect.value;\r\n                arrivalTimeSelect.innerHTML = '<option value=\"\">Select Arrival Time<\/option>';\r\n                \r\n                for (var timeValue in response.data) {\r\n                    var timeData = response.data[timeValue];\r\n                    var option = document.createElement('option');\r\n                    option.value = timeValue;\r\n                    \r\n                    \/\/ If available is 0, write \"Unavailable\" instead of \"Available: 0\"\r\n                    if (timeData.available === 0 || timeData.disabled) {\r\n                        option.disabled = true;\r\n                        option.textContent = timeData.label + ' - Unavailable';\r\n                    } else {\r\n                        option.textContent = timeData.label + ' (Available: ' + timeData.available + ')';\r\n                    }\r\n                    \r\n                    arrivalTimeSelect.appendChild(option);\r\n                }\r\n                \r\n                if (currentValue) {\r\n                    arrivalTimeSelect.value = currentValue;\r\n                    updateDepartureTime();\r\n                }\r\n            }\r\n        }\r\n    });\r\n}\r\n\r\nfunction toggleGradeDetails() {\r\n    var gradeLevels = document.querySelectorAll('#school-booking-form input[name=\"grade_levels[]\"]:checked');\r\n    var gradeDetails = document.getElementById('grade-details');\r\n    var hasSelection = gradeLevels.length > 0;\r\n    \r\n    if (gradeDetails) {\r\n        gradeDetails.style.display = hasSelection ? 'block' : 'none';\r\n        \r\n        \/\/ Show\/hide details for each level\r\n        var elementaryDetails = document.getElementById('elementary-details');\r\n        var middleDetails = document.getElementById('middle-details');\r\n        var secondaryDetails = document.getElementById('secondary-details');\r\n        var otherDetails = document.getElementById('other-details');\r\n        \r\n        if (elementaryDetails) {\r\n            elementaryDetails.style.display = \r\n                Array.from(gradeLevels).some(function(cb) { return cb.value === 'Elementary'; }) ? 'block' : 'none';\r\n        }\r\n        \r\n        if (middleDetails) {\r\n            middleDetails.style.display = \r\n                Array.from(gradeLevels).some(function(cb) { return cb.value === 'Middle'; }) ? 'block' : 'none';\r\n        }\r\n        \r\n        if (secondaryDetails) {\r\n            secondaryDetails.style.display = \r\n                Array.from(gradeLevels).some(function(cb) { return cb.value === 'Secondary'; }) ? 'block' : 'none';\r\n        }\r\n        \r\n        if (otherDetails) {\r\n            otherDetails.style.display = \r\n                Array.from(gradeLevels).some(function(cb) { return cb.value === 'Other'; }) ? 'block' : 'none';\r\n        }\r\n    }\r\n}\r\n\r\n\/\/ Open date picker when clicking anywhere on the field\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n    var dateInput = document.getElementById('visit_date');\r\n    if (dateInput) {\r\n        var minBookingDate = '2026-04-18';\r\n        \/\/ Get today's date in YYYY-MM-DD format\r\n        var today = new Date();\r\n        var todayStr = today.getFullYear() + '-' + \r\n                      String(today.getMonth() + 1).padStart(2, '0') + '-' + \r\n                      String(today.getDate()).padStart(2, '0');\r\n        var minAllowedDate = (minBookingDate > todayStr) ? minBookingDate : todayStr;\r\n        \r\n        var openPicker = function() {\r\n            \/\/ Ensure type is date before showing picker\r\n            if (dateInput.type !== 'date') {\r\n                dateInput.type = 'date';\r\n            }\r\n            \r\n            \/\/ Set the effective minimum booking date\r\n            dateInput.setAttribute('min', minAllowedDate);\r\n            dateInput.removeAttribute('max');\r\n            \r\n            if (typeof dateInput.showPicker === 'function') {\r\n                try { dateInput.showPicker(); return; } catch(e) {}\r\n            }\r\n            dateInput.focus();\r\n            dateInput.click();\r\n        };\r\n        \r\n        \/\/ On focus\/click convert field from text to date and open picker\r\n        dateInput.addEventListener('focus', openPicker);\r\n        dateInput.addEventListener('click', openPicker);\r\n        \r\n        \/\/ On blur if no value selected, revert type to text to show placeholder\r\n        dateInput.addEventListener('blur', function() {\r\n            if (!dateInput.value) {\r\n                dateInput.type = 'text';\r\n            }\r\n        });\r\n        \r\n        \/\/ On value change, validate date and update available times\r\n        dateInput.addEventListener('change', function() {\r\n            if (dateInput.value) {\r\n                \/\/ Validate that date is not before minimum booking date\r\n                if (dateInput.value < minAllowedDate) {\r\n                    alert('The earliest available booking date is ' + minAllowedDate + '. Please select this date or a later date.');\r\n                    dateInput.value = '';\r\n                    dateInput.type = 'text';\r\n                    return;\r\n                }\r\n\t\t\t\t\r\n\t\t\t\t\/\/ Prevent selecting Fridays and Saturdays\r\n\t\t\t\t(function() {\r\n\t\t\t\t\tvar parts = dateInput.value.split('-');\r\n\t\t\t\t\t\/\/ Create date in local time to avoid timezone shifts\r\n\t\t\t\t\tvar jsDate = new Date(parseInt(parts[0], 10), parseInt(parts[1], 10) - 1, parseInt(parts[2], 10));\r\n\t\t\t\t\tvar day = jsDate.getDay(); \/\/ 0 Sun .. 5 Fri .. 6 Sat\r\n\t\t\t\t\tif (day === 5 || day === 6) {\r\n\t\t\t\t\t\talert('Booking is not available on Fridays and Saturdays. Please choose another day.');\r\n\t\t\t\t\t\tdateInput.value = '';\r\n\t\t\t\t\t\tdateInput.type = 'text';\r\n\t\t\t\t\t\treturn;\r\n\t\t\t\t\t}\r\n\t\t\t\t})();\r\n                updateAvailableTimes();\r\n            }\r\n        });\r\n    }\r\n});\r\n<\/script>\r\n\r\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\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>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629<\/p>\n","protected":false},"author":9,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-5313","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ks-scienceoasis.org.sa\/en\/wp-json\/wp\/v2\/pages\/5313","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ks-scienceoasis.org.sa\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ks-scienceoasis.org.sa\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ks-scienceoasis.org.sa\/en\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/ks-scienceoasis.org.sa\/en\/wp-json\/wp\/v2\/comments?post=5313"}],"version-history":[{"count":17,"href":"https:\/\/ks-scienceoasis.org.sa\/en\/wp-json\/wp\/v2\/pages\/5313\/revisions"}],"predecessor-version":[{"id":5535,"href":"https:\/\/ks-scienceoasis.org.sa\/en\/wp-json\/wp\/v2\/pages\/5313\/revisions\/5535"}],"wp:attachment":[{"href":"https:\/\/ks-scienceoasis.org.sa\/en\/wp-json\/wp\/v2\/media?parent=5313"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}