Boeking - Beauty & Wellness\n\t\t<\/title>\n\t\t<style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: 'Arial', sans-serif;\n }\n\n body {\n background-color: #f5f5f5;\n color: #333;\n line-height: 1.6;\n }\n\n .container {\n max-width: 1200px;\n margin: 0 auto;\n padding: 20px;\n }\n\n h1 {\n text-align: center;\n margin: 40px 0;\n color: #2c3e50;\n font-size: 2.5em;\n }\n\n .tabs {\n display: flex;\n gap: 10px;\n margin-bottom: 20px;\n flex-wrap: wrap;\n justify-content: center;\n list-style: none;\n padding: 0;\n }\n\n .tabs li {\n background: #ddc270;\n padding: 10px 30px;\n border-radius: 50px;\n cursor: pointer;\n font-weight: bold;\n transition: background-color 0.3s ease;\n }\n\n .tabs li a {\n text-decoration: none;\n color: #fff;\n }\n\n .tabs li:hover, .tabs li.active {\n background-color: #ce9369;\n }\n\n .tab-content {\n display: none;\n background: #fff;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 0 10px #ccc;\n }\n\n .tab-content.active {\n display: block;\n }\n\n label {\n display: block;\n margin: 10px 0;\n }\n\n label input[type=\"checkbox\"] {\n margin-right: 10px;\n height: 18px;\n width: 18px;\n }\n\n .pricing-section {\n margin-bottom: 20px;\n }\n\n .pricing-section h2 {\n color: #2c3e50;\n margin-bottom: 15px;\n font-size: 1.5em;\n border-bottom: 2px solid #ce9369;\n padding-bottom: 5px;\n }\n\n .description {\n font-size: 0.9em;\n color: #666;\n margin-top: 5px;\n margin-left: 28px;\n }\n\n #booking-form {\n margin-top: 20px;\n display: none;\n }\n\n #booking-form input[type=\"text\"],\n #booking-form input[type=\"email\"],\n #booking-form input[type=\"date\"],\n #booking-form input[type=\"time\"],\n #booking-form input[type=\"tel\"] {\n padding: 8px;\n width: 100%;\n margin-bottom: 10px;\n border: 1px solid #ccc;\n border-radius: 5px;\n }\n\n #booking-form input[type=\"submit\"] {\n background-color: #ce9369;\n color: white;\n padding: 10px 15px;\n border: none;\n cursor: pointer;\n border-radius: 5px;\n font-size: 1em;\n }\n\n #booking-form input[type=\"submit\"]:hover {\n background-color: #b57a5a;\n }\n\n #total-price {\n font-size: 1.2em;\n color: #2c3e50;\n margin-bottom: 15px;\n }\n\n #payment-section {\n margin-top: 15px;\n display: none;\n }\n\n #payment-section button {\n background-color: #ce9369;\n color: white;\n padding: 10px 15px;\n border: none;\n cursor: pointer;\n border-radius: 5px;\n font-size: 1em;\n }\n\n #payment-section button:hover {\n background-color: #b57a5a;\n }\n\n #error-message {\n color: red;\n margin-bottom: 10px;\n display: none;\n }\n\n @media (max-width: 768px) {\n .container {\n padding: 15px;\n }\n\n h1 {\n font-size: 2em;\n }\n\n .tabs li {\n flex: 1 1 45%;\n margin: 5px;\n font-size: 0.9em;\n text-align: center;\n }\n\n .pricing-section h2 {\n font-size: 1.3em;\n }\n }\n\n @media (max-width: 480px) {\n .tabs li {\n flex: 1 1 100%;\n }\n }\n\t\t<\/style>\n\t<\/head>\n\t<body>\n\t\t<div class=\"container\">\n\t\t\t<h1>Boeking - Beauty & Wellness\n\t\t\t<\/h1>\n\t\t\t<div class=\"row\">\n\t\t\t\t<div class=\"booking-tabs\">\n \n\t\t\t\t\t<ul class=\"tabs\">\n\t\t\t\t\t\t<li data-tab=\"treatments\" class=\"active\">\n\t\t\t\t\t\t\t<p><a href=\"#\">Behandelingen<\/a>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t<\/ul>\n\n \n\t\t\t\t\t<div class=\"tab-content active\" id=\"treatments\">\n\t\t\t\t\t\t<div class=\"pricing-section\">\n\t\t\t\t\t\t\t<h2>Behandelingen\n\t\t\t\t\t\t\t<\/h2>\n\t\t\t\t\t\t\t<p><label><input type=\"checkbox\" name=\"service\" value=\"Laser hele lichaam \u20ac180\" data-price=\"180\" \/> Laser hele lichaam \u20ac180<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"Algenpeeling \u20ac130\" data-price=\"130\" \/> Algenpeeling \u20ac130<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"Diode laser \u20ac120\" data-price=\"120\" \/> Diode laser \u20ac120<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"Carbon peeling \u20ac70\" data-price=\"70\" \/> Carbon peeling \u20ac70<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"Wimperlifting \u20ac45\" data-price=\"45\" \/> Wimperlifting \u20ac45<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"MesoTherapie voor haar \u20ac150\" data-price=\"150\" \/> MesoTherapie voor haar \u20ac150<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"MesoTherapie voor gezicht \u20ac150\" data-price=\"150\" \/> MesoTherapie voor gezicht \u20ac150<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"Tatoeage verwijderen vanaf \u20ac50\" data-price=\"50\" \/> Tatoeage verwijderen vanaf \u20ac50<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n \n\t\t\t\t\t<div id=\"booking-form\">\n\t\t\t\t\t\t<form action=\"#\" method=\"post\" id=\"contact-form\">\n\t\t\t\t\t\t\t<p><input type=\"hidden\" name=\"selected-services\" id=\"hidden-services\" \/>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<div id=\"total-price\">\n\t\t\t\t\t\t\t\t<p>Totaal: \u20ac0\n\t\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div id=\"error-message\">\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<p><label>Naam:<br \/>\n<input type=\"text\" name=\"your-name\" required \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><label>Email:<br \/>\n<input type=\"email\" name=\"your-email\" required \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><label>Adres:<br \/>\n<input type=\"text\" name=\"your-address\" \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><label>Telefoonnummer:<br \/>\n<input type=\"tel\" name=\"your-phone\" required \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><label>Datum:<br \/>\n<input type=\"date\" name=\"your-date\" required \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><label>Tijd:<br \/>\n<input type=\"time\" name=\"your-time\" required \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><input type=\"submit\" value=\"Boek nu\" \/>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<div id=\"payment-section\">\n\t\t\t\t\t\t\t\t<p><button type=\"button\" id=\"confirm-payment\">Bevestig Betaling<\/button>\n\t\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/form>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<p><script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n const tabs = document.querySelectorAll(\".tabs li\");\n const contents = document.querySelectorAll(\".tab-content\");\n const form = document.getElementById(\"booking-form\");\n const totalPriceDisplay = document.getElementById(\"total-price\");\n const errorMessage = document.getElementById(\"error-message\");\n const contactForm = document.getElementById(\"contact-form\");\n const paymentSection = document.getElementById(\"payment-section\");\n const confirmPaymentButton = document.getElementById(\"confirm-payment\");\n\n \/\/ Initialiseer boekingen vanuit localStorage of lege array\n let bookings = JSON.parse(localStorage.getItem(\"bookings\")) || [];\n\n \/\/ Functie om totaalprijs te berekenen\n function calculateTotalPrice() {\n const checked = document.querySelectorAll(\"input[name='service']:checked\");\n let total = 0;\n checked.forEach(cb => {\n total += parseFloat(cb.dataset.price) || 0;\n });\n totalPriceDisplay.textContent = `Totaal: \u20ac${total.toFixed(2)}`;\n return total;\n }\n\n \/\/ Functie om boekingsconflicten te controleren\n function checkBookingConflict(date, time) {\n return bookings.some(booking => \n booking.date === date && booking.time === time\n );\n }\n\n \/\/ Werk het formulier bij en selecteer diensten\n function updateForm() {\n const checked = document.querySelectorAll(\"input[name='service']:checked\");\n const selectedValues = Array.from(checked).map(cb => cb.value).join(\", \");\n document.getElementById(\"hidden-services\").value = selectedValues;\n form.style.display = checked.length > 0 ? \"block\" : \"none\";\n calculateTotalPrice();\n paymentSection.style.display = \"none\"; \/\/ Verberg betalingsectie tot boeking bevestigd\n errorMessage.style.display = \"none\"; \/\/ Reset foutmelding\n }\n\n \/\/ Tabbladen wisselen\n tabs.forEach(tab => {\n tab.addEventListener(\"click\", () => {\n tabs.forEach(t => t.classList.remove(\"active\"));\n tab.classList.add(\"active\");\n contents.forEach(content => content.classList.remove(\"active\"));\n document.getElementById(tab.dataset.tab).classList.add(\"active\");\n updateForm();\n });\n });\n\n \/\/ Wijziging in service-checkbox\n document.querySelectorAll(\"input[name='service']\").forEach(checkbox => {\n checkbox.addEventListener(\"change\", updateForm);\n });\n\n \/\/ Formulierverzending\n contactForm.addEventListener(\"submit\", function(event) {\n event.preventDefault();\n const date = document.querySelector(\"input[name='your-date']\").value;\n const time = document.querySelector(\"input[name='your-time']\").value;\n\n if (checkBookingConflict(date, time)) {\n errorMessage.textContent = \"Deze datum en tijd zijn al geboekt. Kies een andere tijd.\";\n errorMessage.style.display = \"block\";\n return;\n }\n\n \/\/ Toon betalingsectie\n paymentSection.style.display = \"block\";\n contactForm.querySelector(\"input[type='submit']\").style.display = \"none\";\n });\n\n \/\/ Betalingsbevestiging met WooCommerce\n confirmPaymentButton.addEventListener(\"click\", function() {\n const date = document.querySelector(\"input[name='your-date']\").value;\n const time = document.querySelector(\"input[name='your-time']\").value;\n const name = document.querySelector(\"input[name='your-name']\").value;\n const email = document.querySelector(\"input[name='your-email']\").value;\n const services = document.getElementById(\"hidden-services\").value;\n const total = calculateTotalPrice();\n\n if (total > 0) {\n \/\/ Voeg product toe aan de winkelwagen in WooCommerce\n jQuery.post(wc_add_to_cart_params.wc_ajax_url.toString().replace('%%endpoint%%', 'add_to_cart'), {\n product_id: 0, \/\/ Dynamisch product\n quantity: 1,\n variation_id: 0,\n variation: { price: total.toFixed(2) },\n custom_data: { date, time, name, email, services }\n }, function(response) {\n if (response.error) {\n alert('Fout bij het toevoegen aan de winkelwagen: ' + response.error);\n } else {\n \/\/ Rechtstreeks naar de betaalpagina\n window.location.href = wc_add_to_cart_params.checkout_url;\n }\n });\n } else {\n \/\/ Als gratis, stuur het formulier alleen\n alert(`Boeking bevestigd voor ${name} op ${date} om ${time}.`);\n contactForm.submit();\n }\n\n \/\/ Sla boeking op in localStorage\n bookings.push({ date, time, name, email, services, total });\n localStorage.setItem(\"bookings\", JSON.stringify(bookings));\n\n \/\/ Reset formulier\n contactForm.reset();\n document.querySelectorAll(\"input[name='service']\").forEach(cb => cb.checked = false);\n updateForm();\n paymentSection.style.display = \"none\";\n contactForm.querySelector(\"input[type='submit']\").style.display = \"block\";\n });\n });\n <\/script>\n\t\t<\/p>\n\t<\/body>\n<\/html><p style=\"display: none !important;\" class=\"akismet-fields-container\" data-prefix=\"_wpcf7_ak_\"><label>Δ<textarea name=\"_wpcf7_ak_hp_textarea\" cols=\"45\" rows=\"8\" maxlength=\"100\"><\/textarea><\/label><input type=\"hidden\" id=\"ak_js_1\" name=\"_wpcf7_ak_js\" value=\"137\"\/><script>document.getElementById( \"ak_js_1\" ).setAttribute( \"value\", ( new Date() ).getTime() );<\/script><\/p><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\t\t\t\t\t\n\t\t\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>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Boeking – Beauty & Wellness Boeking – Beauty & Wellness Behandelingen Behandelingen Laser hele lichaam \u20ac180 Algenpeeling \u20ac130 Diode laser \u20ac120 Carbon peeling \u20ac70 Wimperlifting \u20ac45 MesoTherapie voor haar \u20ac150 MesoTherapie voor gezicht \u20ac150 Tatoeage verwijderen vanaf \u20ac50 Totaal: \u20ac0 Naam: Email: Adres: Telefoonnummer: Datum: Tijd: Bevestig Betaling Δ<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-13506","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/pages\/13506","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=13506"}],"version-history":[{"count":16,"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/pages\/13506\/revisions"}],"predecessor-version":[{"id":13636,"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/pages\/13506\/revisions\/13636"}],"wp:attachment":[{"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=13506"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\n\t\t\t\t\t

\t\t\t\t\n\t\t\t\t\t\t

\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t<\/div>\t\t\n\t\t\t\t\t\t

\t\t\t\t\t\n\t\t\t\t\t\t\n

<\/p>

\n<\/fieldset>\n

\n<\/p>\n\n\t\n \n \n\t\tBoeking - Beauty & Wellness\n\t\t<\/title>\n\t\t<style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: 'Arial', sans-serif;\n }\n\n body {\n background-color: #f5f5f5;\n color: #333;\n line-height: 1.6;\n }\n\n .container {\n max-width: 1200px;\n margin: 0 auto;\n padding: 20px;\n }\n\n h1 {\n text-align: center;\n margin: 40px 0;\n color: #2c3e50;\n font-size: 2.5em;\n }\n\n .tabs {\n display: flex;\n gap: 10px;\n margin-bottom: 20px;\n flex-wrap: wrap;\n justify-content: center;\n list-style: none;\n padding: 0;\n }\n\n .tabs li {\n background: #ddc270;\n padding: 10px 30px;\n border-radius: 50px;\n cursor: pointer;\n font-weight: bold;\n transition: background-color 0.3s ease;\n }\n\n .tabs li a {\n text-decoration: none;\n color: #fff;\n }\n\n .tabs li:hover, .tabs li.active {\n background-color: #ce9369;\n }\n\n .tab-content {\n display: none;\n background: #fff;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 0 10px #ccc;\n }\n\n .tab-content.active {\n display: block;\n }\n\n label {\n display: block;\n margin: 10px 0;\n }\n\n label input[type=\"checkbox\"] {\n margin-right: 10px;\n height: 18px;\n width: 18px;\n }\n\n .pricing-section {\n margin-bottom: 20px;\n }\n\n .pricing-section h2 {\n color: #2c3e50;\n margin-bottom: 15px;\n font-size: 1.5em;\n border-bottom: 2px solid #ce9369;\n padding-bottom: 5px;\n }\n\n .description {\n font-size: 0.9em;\n color: #666;\n margin-top: 5px;\n margin-left: 28px;\n }\n\n #booking-form {\n margin-top: 20px;\n display: none;\n }\n\n #booking-form input[type=\"text\"],\n #booking-form input[type=\"email\"],\n #booking-form input[type=\"date\"],\n #booking-form input[type=\"time\"],\n #booking-form input[type=\"tel\"] {\n padding: 8px;\n width: 100%;\n margin-bottom: 10px;\n border: 1px solid #ccc;\n border-radius: 5px;\n }\n\n #booking-form input[type=\"submit\"] {\n background-color: #ce9369;\n color: white;\n padding: 10px 15px;\n border: none;\n cursor: pointer;\n border-radius: 5px;\n font-size: 1em;\n }\n\n #booking-form input[type=\"submit\"]:hover {\n background-color: #b57a5a;\n }\n\n #total-price {\n font-size: 1.2em;\n color: #2c3e50;\n margin-bottom: 15px;\n }\n\n #payment-section {\n margin-top: 15px;\n display: none;\n }\n\n #payment-section button {\n background-color: #ce9369;\n color: white;\n padding: 10px 15px;\n border: none;\n cursor: pointer;\n border-radius: 5px;\n font-size: 1em;\n }\n\n #payment-section button:hover {\n background-color: #b57a5a;\n }\n\n #error-message {\n color: red;\n margin-bottom: 10px;\n display: none;\n }\n\n @media (max-width: 768px) {\n .container {\n padding: 15px;\n }\n\n h1 {\n font-size: 2em;\n }\n\n .tabs li {\n flex: 1 1 45%;\n margin: 5px;\n font-size: 0.9em;\n text-align: center;\n }\n\n .pricing-section h2 {\n font-size: 1.3em;\n }\n }\n\n @media (max-width: 480px) {\n .tabs li {\n flex: 1 1 100%;\n }\n }\n\t\t<\/style>\n\t<\/head>\n\t<body>\n\t\t<div class=\"container\">\n\t\t\t<h1>Boeking - Beauty & Wellness\n\t\t\t<\/h1>\n\t\t\t<div class=\"row\">\n\t\t\t\t<div class=\"booking-tabs\">\n \n\t\t\t\t\t<ul class=\"tabs\">\n\t\t\t\t\t\t<li data-tab=\"treatments\" class=\"active\">\n\t\t\t\t\t\t\t<p><a href=\"#\">Behandelingen<\/a>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t<\/li>\n\t\t\t\t\t<\/ul>\n\n \n\t\t\t\t\t<div class=\"tab-content active\" id=\"treatments\">\n\t\t\t\t\t\t<div class=\"pricing-section\">\n\t\t\t\t\t\t\t<h2>Behandelingen\n\t\t\t\t\t\t\t<\/h2>\n\t\t\t\t\t\t\t<p><label><input type=\"checkbox\" name=\"service\" value=\"Laser hele lichaam \u20ac180\" data-price=\"180\" \/> Laser hele lichaam \u20ac180<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"Algenpeeling \u20ac130\" data-price=\"130\" \/> Algenpeeling \u20ac130<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"Diode laser \u20ac120\" data-price=\"120\" \/> Diode laser \u20ac120<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"Carbon peeling \u20ac70\" data-price=\"70\" \/> Carbon peeling \u20ac70<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"Wimperlifting \u20ac45\" data-price=\"45\" \/> Wimperlifting \u20ac45<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"MesoTherapie voor haar \u20ac150\" data-price=\"150\" \/> MesoTherapie voor haar \u20ac150<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"MesoTherapie voor gezicht \u20ac150\" data-price=\"150\" \/> MesoTherapie voor gezicht \u20ac150<\/label><br \/>\n<label><input type=\"checkbox\" name=\"service\" value=\"Tatoeage verwijderen vanaf \u20ac50\" data-price=\"50\" \/> Tatoeage verwijderen vanaf \u20ac50<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\n \n\t\t\t\t\t<div id=\"booking-form\">\n\t\t\t\t\t\t<form action=\"#\" method=\"post\" id=\"contact-form\">\n\t\t\t\t\t\t\t<p><input type=\"hidden\" name=\"selected-services\" id=\"hidden-services\" \/>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<div id=\"total-price\">\n\t\t\t\t\t\t\t\t<p>Totaal: \u20ac0\n\t\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<div id=\"error-message\">\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t<p><label>Naam:<br \/>\n<input type=\"text\" name=\"your-name\" required \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><label>Email:<br \/>\n<input type=\"email\" name=\"your-email\" required \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><label>Adres:<br \/>\n<input type=\"text\" name=\"your-address\" \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><label>Telefoonnummer:<br \/>\n<input type=\"tel\" name=\"your-phone\" required \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><label>Datum:<br \/>\n<input type=\"date\" name=\"your-date\" required \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><label>Tijd:<br \/>\n<input type=\"time\" name=\"your-time\" required \/><br \/>\n<\/label>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<p><input type=\"submit\" value=\"Boek nu\" \/>\n\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<div id=\"payment-section\">\n\t\t\t\t\t\t\t\t<p><button type=\"button\" id=\"confirm-payment\">Bevestig Betaling<\/button>\n\t\t\t\t\t\t\t\t<\/p>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/form>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t<p><script>\n document.addEventListener(\"DOMContentLoaded\", function() {\n const tabs = document.querySelectorAll(\".tabs li\");\n const contents = document.querySelectorAll(\".tab-content\");\n const form = document.getElementById(\"booking-form\");\n const totalPriceDisplay = document.getElementById(\"total-price\");\n const errorMessage = document.getElementById(\"error-message\");\n const contactForm = document.getElementById(\"contact-form\");\n const paymentSection = document.getElementById(\"payment-section\");\n const confirmPaymentButton = document.getElementById(\"confirm-payment\");\n\n \/\/ Initialiseer boekingen vanuit localStorage of lege array\n let bookings = JSON.parse(localStorage.getItem(\"bookings\")) || [];\n\n \/\/ Functie om totaalprijs te berekenen\n function calculateTotalPrice() {\n const checked = document.querySelectorAll(\"input[name='service']:checked\");\n let total = 0;\n checked.forEach(cb => {\n total += parseFloat(cb.dataset.price) || 0;\n });\n totalPriceDisplay.textContent = `Totaal: \u20ac${total.toFixed(2)}`;\n return total;\n }\n\n \/\/ Functie om boekingsconflicten te controleren\n function checkBookingConflict(date, time) {\n return bookings.some(booking => \n booking.date === date && booking.time === time\n );\n }\n\n \/\/ Werk het formulier bij en selecteer diensten\n function updateForm() {\n const checked = document.querySelectorAll(\"input[name='service']:checked\");\n const selectedValues = Array.from(checked).map(cb => cb.value).join(\", \");\n document.getElementById(\"hidden-services\").value = selectedValues;\n form.style.display = checked.length > 0 ? \"block\" : \"none\";\n calculateTotalPrice();\n paymentSection.style.display = \"none\"; \/\/ Verberg betalingsectie tot boeking bevestigd\n errorMessage.style.display = \"none\"; \/\/ Reset foutmelding\n }\n\n \/\/ Tabbladen wisselen\n tabs.forEach(tab => {\n tab.addEventListener(\"click\", () => {\n tabs.forEach(t => t.classList.remove(\"active\"));\n tab.classList.add(\"active\");\n contents.forEach(content => content.classList.remove(\"active\"));\n document.getElementById(tab.dataset.tab).classList.add(\"active\");\n updateForm();\n });\n });\n\n \/\/ Wijziging in service-checkbox\n document.querySelectorAll(\"input[name='service']\").forEach(checkbox => {\n checkbox.addEventListener(\"change\", updateForm);\n });\n\n \/\/ Formulierverzending\n contactForm.addEventListener(\"submit\", function(event) {\n event.preventDefault();\n const date = document.querySelector(\"input[name='your-date']\").value;\n const time = document.querySelector(\"input[name='your-time']\").value;\n\n if (checkBookingConflict(date, time)) {\n errorMessage.textContent = \"Deze datum en tijd zijn al geboekt. Kies een andere tijd.\";\n errorMessage.style.display = \"block\";\n return;\n }\n\n \/\/ Toon betalingsectie\n paymentSection.style.display = \"block\";\n contactForm.querySelector(\"input[type='submit']\").style.display = \"none\";\n });\n\n \/\/ Betalingsbevestiging met WooCommerce\n confirmPaymentButton.addEventListener(\"click\", function() {\n const date = document.querySelector(\"input[name='your-date']\").value;\n const time = document.querySelector(\"input[name='your-time']\").value;\n const name = document.querySelector(\"input[name='your-name']\").value;\n const email = document.querySelector(\"input[name='your-email']\").value;\n const services = document.getElementById(\"hidden-services\").value;\n const total = calculateTotalPrice();\n\n if (total > 0) {\n \/\/ Voeg product toe aan de winkelwagen in WooCommerce\n jQuery.post(wc_add_to_cart_params.wc_ajax_url.toString().replace('%%endpoint%%', 'add_to_cart'), {\n product_id: 0, \/\/ Dynamisch product\n quantity: 1,\n variation_id: 0,\n variation: { price: total.toFixed(2) },\n custom_data: { date, time, name, email, services }\n }, function(response) {\n if (response.error) {\n alert('Fout bij het toevoegen aan de winkelwagen: ' + response.error);\n } else {\n \/\/ Rechtstreeks naar de betaalpagina\n window.location.href = wc_add_to_cart_params.checkout_url;\n }\n });\n } else {\n \/\/ Als gratis, stuur het formulier alleen\n alert(`Boeking bevestigd voor ${name} op ${date} om ${time}.`);\n contactForm.submit();\n }\n\n \/\/ Sla boeking op in localStorage\n bookings.push({ date, time, name, email, services, total });\n localStorage.setItem(\"bookings\", JSON.stringify(bookings));\n\n \/\/ Reset formulier\n contactForm.reset();\n document.querySelectorAll(\"input[name='service']\").forEach(cb => cb.checked = false);\n updateForm();\n paymentSection.style.display = \"none\";\n contactForm.querySelector(\"input[type='submit']\").style.display = \"block\";\n });\n });\n <\/script>\n\t\t<\/p>\n\t<\/body>\n<\/html><p style=\"display: none !important;\" class=\"akismet-fields-container\" data-prefix=\"_wpcf7_ak_\"><label>Δ<textarea name=\"_wpcf7_ak_hp_textarea\" cols=\"45\" rows=\"8\" maxlength=\"100\"><\/textarea><\/label><input type=\"hidden\" id=\"ak_js_1\" name=\"_wpcf7_ak_js\" value=\"137\"\/><script>document.getElementById( \"ak_js_1\" ).setAttribute( \"value\", ( new Date() ).getTime() );<\/script><\/p><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\t\t\t\t\t\n\t\t\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>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Boeking – Beauty & Wellness Boeking – Beauty & Wellness Behandelingen Behandelingen Laser hele lichaam \u20ac180 Algenpeeling \u20ac130 Diode laser \u20ac120 Carbon peeling \u20ac70 Wimperlifting \u20ac45 MesoTherapie voor haar \u20ac150 MesoTherapie voor gezicht \u20ac150 Tatoeage verwijderen vanaf \u20ac50 Totaal: \u20ac0 Naam: Email: Adres: Telefoonnummer: Datum: Tijd: Bevestig Betaling Δ<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-13506","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/pages\/13506","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=13506"}],"version-history":[{"count":16,"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/pages\/13506\/revisions"}],"predecessor-version":[{"id":13636,"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=\/wp\/v2\/pages\/13506\/revisions\/13636"}],"wp:attachment":[{"href":"https:\/\/emmabeauty.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=13506"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}