{"id":6308,"date":"2025-04-12T23:33:25","date_gmt":"2025-04-12T21:33:25","guid":{"rendered":"https:\/\/test16.wptotem.com\/?page_id=6308"},"modified":"2025-08-23T11:54:59","modified_gmt":"2025-08-23T09:54:59","slug":"test","status":"publish","type":"page","link":"https:\/\/test16.wptotem.com\/de\/test\/","title":{"rendered":"test"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"6308\" class=\"elementor elementor-6308\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-298be3f e-flex e-con-boxed e-con e-parent\" data-id=\"298be3f\" 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-99900d5 elementor-widget elementor-widget-shortcode\" data-id=\"99900d5\" 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\">\n<!-- Titre du formulaire \u00e9tape 1 -->\n<div class=\"form-header\">\n    <h2 class=\"form-title\">\n        Choose a time slot    <\/h2>\n    <\/div>\n<div class=\"wpt-wowbook-booking-form-container multi-step-form\" data-product-id=\"1\" data-slot-duration=\"30\" data-offer-id=\"2\" data-price-type=\"deposit\" data-kiosk=\"on\">\n            <input type=\"hidden\" name=\"overprice\" value=\"199\" \/>\n                <input type=\"hidden\" name=\"overdeposit\" value=\"50\" \/>\n        <\/div>\n\n        <!-- Indicateur d'\u00e9tape -->\n    <div class=\"form-progress\">\n        <div class=\"step-indicator\">\n            <div class=\"step active\" data-step=\"1\">1. Select time slot<\/div>\n                            <div class=\"step\" data-step=\"1-5\">2. ID card<\/div>\n                <div class=\"step\" data-step=\"2\">3. Information<\/div>\n                <div class=\"step\" data-step=\"3\">4. Contract and agreement<\/div>\n                <div class=\"step\" data-step=\"4\">5. Review<\/div>\n                    <\/div>\n    <\/div>\n    \n    <!-- Messages d'erreur -->\n    <div class=\"form-messages\"><\/div>\n\n    <!-- Formulaire de r\u00e9servation en plusieurs \u00e9tapes -->\n    <form id=\"wpt-wowbook-booking-form\" class=\"booking-form\" method=\"post\" action=\"\">\n\n        <input type=\"hidden\" name=\"product_id\" value=\"1\">\n        <input type=\"hidden\" name=\"offer_id\" value=\"2\">\n        <input type=\"hidden\" name=\"action\" value=\"wpt_wowbook_submit_booking\">\n        <input type=\"hidden\" name=\"nonce\" value=\"498e04d32a\">\n        <input type=\"hidden\" name=\"contract_type\" value=\"conlic\">\n                <input type=\"hidden\" name=\"lang\" id=\"wpt-wowbook-lang\" value=\"de\">\n        <input type=\"hidden\" name=\"start_time\" id=\"selected-start-time\" value=\"\">\n        <input type=\"hidden\" name=\"end_time\" id=\"selected-end-time\" value=\"\">\n        <input type=\"hidden\" name=\"offer_price\" value=\"80.00\">\n        <input type=\"hidden\" name=\"offer_deposit\" value=\"20.00\">\n                <input type=\"hidden\" name=\"kiosk\" value=\"on\">\n        \n        <!-- \u00c9tape 1: S\u00e9lection de la date et du cr\u00e9neau -->\n        <div class=\"form-step active\" id=\"step1\">\n            \n\n\n<!-- Switch pour choisir entre aujourd'hui et autre jour -->\n<div class=\"date-selection-switch\">\n    <div class=\"switch-container\">\n        <input type=\"radio\" id=\"today\" name=\"date-selection\" value=\"today\" checked>\n        <label for=\"today\">Book today<\/label>\n        \n        <input type=\"radio\" id=\"other-day\" name=\"date-selection\" value=\"other\">\n        <label for=\"other-day\">Other day<\/label>\n    <\/div>\n<\/div>\n\n \n\n\n<div class=\"date-time-selection calendar-disabled\">\n    <div class=\"two-columns single-column\">\n        <!-- Colonne gauche: Calendrier -->\n        <div class=\"left-column\" style=\"display: none;\">\n            <div class=\"date-picker-container\">\n                <h4>Select a date<\/h4>\n                <div id=\"booking-calendar\" class=\"booking-calendar\" style=\"background-color: #000000;\">\n                    <div class=\"calendar-header\">\n                        <button type=\"button\" class=\"prev-month\">&lt;<\/button>\n                        <div class=\"current-month\"><\/div>\n                        <button type=\"button\" class=\"next-month\">&gt;<\/button>\n                    <\/div>\n                    <div class=\"calendar-weekdays\">\n                        <div>Su<\/div>\n                        <div>Mo<\/div>\n                        <div>Tu<\/div>\n                        <div>We<\/div>\n                        <div>Th<\/div>\n                        <div>Fr<\/div>\n                        <div>Sa<\/div>\n                    <\/div>\n                    <div class=\"calendar-days\"><\/div>\n                <\/div>\n                <input type=\"hidden\" id=\"selected-date\" name=\"selected_date\" value=\"\">\n                <div class=\"date-picker-info\">\n                    <p class=\"info-text\">Click a date to see available time slots<\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n        \n        <!-- Colonne droite: Liste des cr\u00e9neaux -->\n        <div class=\"right-column\">\n            <div class=\"time-slots-container\">\n                <h4>Available time slots<\/h4>\n                <div id=\"available-slots\" class=\"available-slots\">\n                    <p class=\"select-date-message\">Please select a date to see available time slots.<\/p>\n                <\/div>\n                <div class=\"loading-overlay\" style=\"display: none;\">\n                    <div class=\"loading-spinner\"><\/div>\n                    <p>Loading time slots...<\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n<!-- Boutons de navigation -->\n<div class=\"form-navigation\">\n    <!-- Le bouton Continuer a \u00e9t\u00e9 supprim\u00e9, l'avance se fait automatiquement apr\u00e8s s\u00e9lection d'un cr\u00e9neau -->\n<\/div>\n\n\n        <\/div>\n\n                <!-- \u00c9tape 1.5: Capture de photo de carte d'identit\u00e9 -->\n        <div class=\"form-step\" id=\"step1-5\">\n            \n<h3>Photo of your ID card<\/h3>\n\n<div class=\"selected-slot-info\">\n    <p><strong>Selected time slot:<\/strong> <span id=\"selected-slot-display\"><\/span><\/p>\n<\/div>\n\n<div class=\"id-card-capture-container\">\n    <div class=\"row\">\n        <div class=\"capture-column\">\n            <p class=\"section-desc\">\n                Please take a clear photo of your ID card. Make sure all information is readable.            <\/p>\n            \n            <div class=\"camera-container\">\n                <video id=\"camera-video\" autoplay playsinline muted><\/video>\n                <canvas id=\"camera-canvas\" style=\"display:none;\"><\/canvas>\n                <div id=\"camera-overlay\">\n                    <div class=\"id-card-outline\"><\/div>\n                <\/div>\n            <\/div>\n            \n            <div class=\"camera-controls\">\n                <button type=\"button\" id=\"start-camera\" class=\"button\" style=\"display:none;\">Enable camera<\/button>\n                <button type=\"button\" id=\"take-photo\" class=\"button\" disabled>Take photo<\/button>\n                <button type=\"button\" id=\"retake-photo\" class=\"button\" style=\"display:none;\">Retake photo<\/button>\n            <\/div>\n        <\/div>\n        \n        <div class=\"preview-column\">\n            <div class=\"preview-container\">\n                <p class=\"preview-title\">Photo preview<\/p>\n                <div class=\"id-card-preview\">\n                    <img decoding=\"async\" id=\"id-card-preview\" src=\"\" alt=\"ID card preview\" style=\"display:none;\">\n                    <p class=\"no-photo-text\">No photo captured<\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n    \n    <input type=\"hidden\" name=\"id_card_photo\" id=\"id-card-photo-data\" value=\"\">\n<\/div>\n\n<h3 style=\"margin-top: 28px;\">Photo of your Jet-ski Licence ID<\/h3>\n\n<div class=\"id-card-capture-container\" id=\"license-capture-container\">\n    <div class=\"row\">\n        <div class=\"capture-column\">\n            <p class=\"section-desc\">\n                Please take a clear photo of your Jet-ski licence. Make sure all information is readable.            <\/p>\n\n            <div class=\"camera-container\">\n                <video id=\"camera-video-license\" autoplay playsinline muted><\/video>\n                <canvas id=\"camera-canvas-license\" style=\"display:none;\"><\/canvas>\n                <div id=\"camera-overlay-license\">\n                    <div class=\"id-card-outline\"><\/div>\n                <\/div>\n            <\/div>\n\n            <div class=\"camera-controls\">\n                <button type=\"button\" id=\"start-camera-license\" class=\"button\" style=\"display:none;\">Enable camera<\/button>\n                <button type=\"button\" id=\"take-photo-license\" class=\"button\" disabled>Take photo<\/button>\n                <button type=\"button\" id=\"retake-photo-license\" class=\"button\" style=\"display:none;\">Retake photo<\/button>\n            <\/div>\n        <\/div>\n\n        <div class=\"preview-column\">\n            <div class=\"preview-container\">\n                <p class=\"preview-title\">&nbsp;<\/p>\n                <div class=\"id-card-preview\">\n                    <img decoding=\"async\" id=\"id-card-license-preview\" src=\"\" alt=\"Jet-ski licence preview\" style=\"display:none;\">\n                    <p class=\"no-photo-text no-photo-text-license\">No photo captured<\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <input type=\"hidden\" name=\"license_id_moto_photo\" id=\"license-id-moto-photo-data\" value=\"\">\n<\/div>\n\n<div class=\"form-navigation\">\n    <button type=\"button\" class=\"prev-step button button-secondary\">Previous<\/button>\n    <button type=\"button\" class=\"next-step button button-primary\" disabled>Continue<\/button>\n<\/div>\n        <\/div>\n        <!-- \u00c9tape 2: Informations client (toujours incluse) -->\n        <div class=\"form-step\" id=\"step2\">\n            \n<h3>Customer information<\/h3>\n\n<div class=\"client-info-section\">\n    <!-- Section 1: Informations client principal -->\n    <div class=\"info-section\">\n        <h4>CUSTOMER INFORMATION<\/h4>\n        \n        <div class=\"form-row\">\n            <div class=\"form-group\">\n                <label for=\"first_name\">First name <span class=\"required\">*<\/span><\/label>\n                <input type=\"text\" id=\"first_name\" name=\"first_name\" required>\n            <\/div>\n            \n            <div class=\"form-group\">\n                <label for=\"last_name\">Last name <span class=\"required\">*<\/span><\/label>\n                <input type=\"text\" id=\"last_name\" name=\"last_name\" required>\n            <\/div>\n        <\/div>\n        \n        <div class=\"form-group\">\n            <label for=\"email\">Email <span class=\"required\">*<\/span><\/label>\n            <input type=\"email\" id=\"email\" name=\"email\" required>\n        <\/div>\n        \n        <div class=\"form-group\">\n            <label for=\"phone\">Phone                        <\/label>\n            <input type=\"tel\" id=\"phone\" name=\"phone\" >\n        <\/div>\n    <\/div>\n    \n    <!-- Section 2: Informations passager 2 (optionnel) -->\n    <div class=\"info-section\">\n        <h4>PASSENGER 2 INFORMATION<\/h4>\n        \n        <div class=\"form-group\">\n            <label for=\"passenger2_name\">First and last name<\/label>\n            <input type=\"text\" id=\"passenger2_name\" name=\"passenger2_name\">\n            <input type=\"hidden\" name=\"passenger2_signature\" id=\"passenger2-signature-data\" value=\"\">\n            <input type=\"hidden\" name=\"passenger2_id_photo\" id=\"passenger2-id-photo-data\" value=\"\">\n            <input type=\"hidden\" name=\"minor_id_photo\" id=\"minor-id-photo-data\" value=\"\">\n            <small class=\"form-text\">Optional field<\/small>\n        <\/div>\n        \n        <!-- Section de capture de la carte d'identit\u00e9 pour le passager 2 -->\n                <div id=\"passenger2_id_capture\" class=\"id-capture-section\" data-scan=\"on\" style=\"display: none;\">\n            <h5>ID card capture<\/h5>\n            <p>Please capture passenger 2&#039;s ID card<\/p>\n            \n            <div class=\"id-card-capture-container\">\n                <div class=\"row\">\n                    <!-- Colonne de capture -->\n                    <div class=\"capture-column\">\n                        <div class=\"camera-container\">\n                            <video autoplay playsinline><\/video>\n                            <canvas style=\"display:none;\"><\/canvas>\n                        <\/div>\n                        \n                        <div class=\"camera-controls\">\n                            <button type=\"button\" class=\"button capture-btn\">\n                                Capture photo                            <\/button>\n                        <\/div>\n                    <\/div>\n                    \n                    <!-- Colonne de pr\u00e9visualisation -->\n                    <div class=\"preview-column\">\n                        <div class=\"preview-container\">\n                            <div class=\"preview-title\">Capture preview<\/div>\n                            <div class=\"preview\" style=\"display: none;\">\n                                <img decoding=\"async\" src=\"\" alt=\"Capture preview\">\n                            <\/div>\n                            <div class=\"preview-controls\" style=\"display: none;\">\n                                <button type=\"button\" class=\"button retake-btn\">\n                                    Retake                                <\/button>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n    \n    <!-- Section 3: Pour les enfants mineurs -->\n    <div class=\"info-section\">\n        <h4>FOR MINOR CHILDREN<\/h4>\n        \n        <div class=\"form-group checkbox-group\">\n            <input type=\"checkbox\" id=\"minor_authorized\" name=\"minor_authorized\" value=\"yes\">\n            <label for=\"minor_authorized\">I authorize<\/label>\n        <\/div>\n        \n        <div class=\"form-group minor-name-field\" style=\"display: none;\">\n            <label for=\"minor_name\">Minor&#039;s full name<\/label>\n            <input type=\"text\" id=\"minor_name\" name=\"minor_name\">\n        <\/div>\n        \n        <!-- Section de capture de la carte d'identit\u00e9 pour l'enfant mineur -->\n                <div id=\"minor_id_capture\" class=\"id-capture-section\" data-scan=\"on\" style=\"display: none;\">\n            <h5>ID card capture<\/h5>\n            <p>Please capture the minor&#039;s ID card<\/p>\n            \n            <div class=\"id-card-capture-container\">\n                <div class=\"row\">\n                    <!-- Colonne de capture -->\n                    <div class=\"capture-column\">\n                        <div class=\"camera-container\">\n                            <video autoplay playsinline><\/video>\n                            <canvas style=\"display:none;\"><\/canvas>\n                        <\/div>\n                        \n                        <div class=\"camera-controls\">\n                            <button type=\"button\" class=\"button capture-btn\">\n                                Capturer la photo                            <\/button>\n                        <\/div>\n                    <\/div>\n                    \n                    <!-- Colonne de pr\u00e9visualisation -->\n                    <div class=\"preview-column\">\n                        <div class=\"preview-container\">\n                            <div class=\"preview-title\">Aper\u00e7u de la capture<\/div>\n                            <div class=\"preview\" style=\"display: none;\">\n                                <img decoding=\"async\" src=\"\" alt=\"Aper\u00e7u de la capture\">\n                            <\/div>\n                            <div class=\"preview-controls\" style=\"display: none;\">\n                                <button type=\"button\" class=\"button retake-btn\">\n                                    Reprendre                                <\/button>\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n<!-- Boutons de navigation -->\n<div class=\"form-navigation\">\n    <button type=\"button\" class=\"button prev-step\">Back<\/button>\n    <button type=\"button\" class=\"button next-step\">Continue<\/button>\n<\/div>\n        <\/div>\n\n        \n        <!-- \u00c9tape 3: Contrat et accord -->\n        <div class=\"form-step\" id=\"step3\">\n            \n<h3>Contract and agreement<\/h3>\n\n<div class=\"contract-section\">\n    <!-- Affichage du contrat -->\n    <div class=\"contract-text-container\">\n        <h4>Please read the contract carefully below<\/h4>\n        <div class=\"contract-text\">\n            <h1>VERTRAG \u00dcBER DIE VERMIETUNG EINES FREIZEITBOOTES<\/h1><p>Kraft dieses Vertrages vermietet der <strong>VERMIETER<\/strong> dem <strong>MIETER<\/strong> das im Kopfteil beschriebene Freizeitboot, zum vereinbarten Preis und vorbehaltlich der nachstehenden allgemeinen Bestimmungen sowie der besonderen Bedingungen, die gegebenenfalls im Anhang festgelegt sind.<\/p><h2>KLAUSELN<\/h2><p><strong>1. Vertragsgegenstand<\/strong><\/p><p> Das Boot darf ausschlie\u00dflich f\u00fcr Freizeitzwecke verwendet werden. Eine Nutzung zu kommerziellen oder gewinnorientierten Zwecken ist ausdr\u00fccklich untersagt.<\/p><p><strong>2. F\u00fchrung des Bootes<\/strong><\/p><p> Das Boot wird ohne Besatzung \u00fcbergeben. Der <strong>MIETER<\/strong> muss als Skipper eine Person mit der erforderlichen Qualifikation einsetzen, mindestens mit dem Bef\u00e4higungsnachweis <em>Sportbootf\u00fchrerschein See<\/em> oder gleichwertig. Im Falle von Meinungsverschiedenheiten bez\u00fcglich der Navigation hat die Entscheidung des benannten Skippers Vorrang.<\/p><p><strong>3. Zul\u00e4ssige Kapazit\u00e4t<\/strong><\/p><p> Der <strong>MIETER<\/strong> verpflichtet sich, nicht mehr Personen an Bord zu nehmen, als die maximal zul\u00e4ssige Anzahl.<\/p><p><strong>4. Nutzungsbeschr\u00e4nkungen<\/strong><\/p><p> Der <strong>MIETER<\/strong> darf das Boot nicht:<\/p><ul><li>bei Regatten, Wettbewerben oder Sportveranstaltungen einsetzen,<\/li><li>au\u00dferhalb des im Vertrag angegebenen, genehmigten Seegebietes nutzen,<\/li><li>unbesetzt vor Anker oder vert\u00e4ut in ungesch\u00fctzten Gew\u00e4ssern oder in Bereichen ohne Liegeplatzgeb\u00fchr zur\u00fccklassen.<\/li><\/ul><p><strong>5. Zahlung<\/strong><\/p><p> Der vereinbarte Mietpreis ist vollst\u00e4ndig vor \u00dcbergabe des Bootes zu entrichten.<\/p><p><strong>6. Haftung f\u00fcr Sch\u00e4den<\/strong><\/p><p> Der <strong>MIETER<\/strong> haftet finanziell f\u00fcr alle Sch\u00e4den am Boot, an dessen Bestandteilen oder an der zur Verf\u00fcgung gestellten Ausr\u00fcstung.<\/p><p> Ebenso \u00fcbernimmt er die volle Verantwortung f\u00fcr Sch\u00e4den an seiner eigenen Person, an Dritten oder an den Passagieren, die durch Fahrl\u00e4ssigkeit, Missachtung grundlegender Sicherheitsregeln oder Nichtbefolgung der Anweisungen des Skippers entstehen.<\/p><p><strong>7. Kaution<\/strong><\/p><p> Zur Sicherstellung der Vertragserf\u00fcllung leistet der <strong>MIETER<\/strong> die im Kopfteil genannte Kaution. Seine Haftung beschr\u00e4nkt sich nicht auf diesen Betrag, sondern erstreckt sich auf den tats\u00e4chlichen Wert m\u00f6glicher Sch\u00e4den.<\/p><p> Im Schadensfall kann die Kaution bis zur endg\u00fcltigen Feststellung der Schadensh\u00f6he und zur Durchf\u00fchrung der entsprechenden Abrechnung vorl\u00e4ufig einbehalten werden.<\/p><p><strong>8. \u00dcbergabe und R\u00fcckgabe<\/strong><\/p><p> Das Boot wird zu dem in den besonderen Bedingungen festgelegten Datum, Zeitpunkt und Hafen \u00fcbergeben.<\/p><p> Eine versp\u00e4tete Nutzung durch den <strong>MIETER<\/strong>, die ihm zuzuschreiben ist, berechtigt nicht zu einer Verl\u00e4ngerung der Mietdauer.<\/p><p> Ebenso kann der <strong>MIETER<\/strong> im Falle einer versp\u00e4teten \u00dcbergabe aus Gr\u00fcnden, die au\u00dferhalb der Kontrolle des <strong>VERMIETERS<\/strong> liegen, weder eine Mietpreisminderung noch eine Verl\u00e4ngerung verlangen; der Vertrag endet wie vereinbart am vorgesehenen Datum, Zeitpunkt und Hafen.<\/p><p><strong>9. Unf\u00e4lle<\/strong><\/p><p> Im Falle eines Unfalls an Bord ist der <strong>MIETER<\/strong> verpflichtet, den <strong>VERMIETER<\/strong> unverz\u00fcglich schriftlich zu benachrichtigen und Ursachen, Umst\u00e4nde und Folgen des Vorfalls anzugeben sowie, soweit bekannt, die Daten der Verantwortlichen, Zeugen oder Gesch\u00e4digten.<\/p><p> F\u00fcr die Zwecke dieses Vertrages gilt als \u201eUnfall\u201c jedes zuf\u00e4llige, spontane, \u00e4u\u00dfere und gewaltsame Ereignis, das unabh\u00e4ngig vom Willen des Betroffenen eintritt und einen der Bootsinsassen betrifft.<\/p><p><strong>10. Vertragsaufl\u00f6sung<\/strong><\/p><p> Wird der Vertrag aus Gr\u00fcnden beendet, die dem <strong>MIETER<\/strong> zuzurechnen sind, verliert dieser zugunsten des <strong>VERMIETERS<\/strong> die geleisteten Zahlungen (Reservierung, Anzahlung) und bleibt verpflichtet, den Restbetrag zu begleichen.<\/p><p> Der <strong>VERMIETER<\/strong> kann den Vertrag aufl\u00f6sen, wenn er aus Gr\u00fcnden, die au\u00dferhalb seiner Kontrolle liegen, das Boot nicht zum vereinbarten Termin bereitstellen kann. In diesem Fall erstattet er dem <strong>MIETER<\/strong> die gezahlten Betr\u00e4ge zur\u00fcck. Der <strong>MIETER<\/strong> hat keinen Anspruch auf Schadensersatz.<\/p><p><strong>11. Versicherung<\/strong><\/p><p> Das Boot ist durch eine Vollkaskoversicherung mit Selbstbehalt gedeckt, deren Kosten vom <strong>VERMIETER<\/strong> getragen werden.<\/p><p><strong>12. Gerichtsstand<\/strong><\/p><p> F\u00fcr die Auslegung und Erf\u00fcllung dieses Vertrages vereinbaren die Parteien zun\u00e4chst ein Schiedsverfahren nach Billigkeit und, falls dies nicht m\u00f6glich ist, die ausschlie\u00dfliche Zust\u00e4ndigkeit der Gerichte von Almer\u00eda. Auf jedes andere m\u00f6gliche Gericht wird ausdr\u00fccklich verzichtet.<\/p>        <\/div>\n    <\/div>\n    \n    <!-- Case \u00e0 cocher d'acceptation -->\n    <div class=\"form-group checkbox-group terms-acceptance\" style=\"text-align:center;\">\n        <div style=\"display:inline-flex; align-items:center; gap:8px;\">\n            <input type=\"checkbox\" id=\"terms_accepted\" name=\"terms_accepted\" value=\"yes\" required>\n            <label for=\"terms_accepted\" style=\"margin:0;\">\n                I accept the terms and conditions and certify that the information provided is accurate. <span class=\"required\">*<\/span>\n            <\/label>\n        <\/div>\n    <\/div>\n    \n    <!-- Signatures -->\n    <div class=\"signatures-container\" style=\"text-align:center;\">\n        <h4 style=\"margin-bottom:14px;\">&nbsp;Signatures<\/h4>\n        \n        <!-- Signature Passager 1 -->\n        <div class=\"signature-section\" style=\"display:flex; flex-direction:column; align-items:center;\">\n            <label style=\"margin-bottom:8px;\">Passenger 1 signature <span class=\"required\">*<\/span><\/label>\n            <div class=\"signature-pad-container\" style=\"display:flex; justify-content:center;\">\n                <canvas id=\"signature-pad-1\" class=\"signature-pad\" width=\"400\" height=\"200\"><\/canvas>\n                <input type=\"hidden\" name=\"signature1\" id=\"signature1-data\">\n            <\/div>\n            <div class=\"signature-actions\" style=\"margin-top:8px;\">\n                <button type=\"button\" class=\"button clear-signature\" data-target=\"signature-pad-1\">Clear<\/button>\n            <\/div>\n        <\/div>\n        \n        <!-- Signature Passager 2 (conditionnelle) -->\n        <div class=\"signature-section passenger2-signature\" style=\"display:none; text-align:center;\">\n            <label style=\"margin-bottom:8px;\">Passenger 2 signature<\/label>\n            <div class=\"signature-pad-container\" style=\"display:flex; justify-content:center; margin:0 auto;\">\n                <canvas id=\"signature-pad-2\" class=\"signature-pad\" width=\"400\" height=\"200\" style=\"display:block; margin:0 auto;\"><\/canvas>\n                <input type=\"hidden\" name=\"signature2\" id=\"signature2-data\">\n            <\/div>\n            <div class=\"signature-actions\" style=\"margin-top:8px; text-align:center;\">\n                <button type=\"button\" class=\"button clear-signature\" data-target=\"signature-pad-2\">Clear<\/button>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n<!-- Boutons de navigation -->\n<div class=\"form-navigation\">\n    <button type=\"button\" class=\"button prev-step\">Back<\/button>\n    <button type=\"button\" class=\"button next-step\" disabled>Continue<\/button>\n<\/div>\n        <\/div>\n        \n        <!-- \u00c9tape 4: V\u00e9rification et confirmation -->\n        <div class=\"form-step\" id=\"step4\">\n            \n<h3>Review and confirmation<\/h3>\n\n<div class=\"verification-section\">\n    <div class=\"verification-intro\">\n        <p>Please review the information below before confirming your booking.<\/p>\n    <\/div>\n    \n    <!-- R\u00e9sum\u00e9 des informations saisies -->\n    <div class=\"booking-summary\">\n        <!-- D\u00e9tails de la r\u00e9servation -->\n        <div class=\"summary-section\">\n            <h4>Booking details<\/h4>\n            <div class=\"summary-item\">\n                <span class=\"item-label\">Booking ID:<\/span>\n                <span class=\"item-value\" id=\"summary-booking-id\"><\/span>\n                <input type=\"hidden\" name=\"booking_id\" id=\"booking_id_input\" value=\"\">\n            <\/div>\n            <div class=\"summary-item\">\n                <span class=\"item-label\">Date:<\/span>\n                <span class=\"item-value\" id=\"summary-date\"><\/span>\n            <\/div>\n            <div class=\"summary-item\">\n                <span class=\"item-label\">Time:<\/span>\n                <span class=\"item-value\" id=\"summary-time\"><\/span>\n            <\/div>\n                        <div class=\"summary-item\">\n                <span class=\"item-label\">Product:<\/span>\n                <span class=\"item-value\">Jet-ski<\/span>\n            <\/div>\n                        <div class=\"summary-item\">\n    <span class=\"item-label\">Total price:<\/span>\n    <span class=\"item-value\" id=\"summary-total-price\"><\/span>\n<\/div>\n<div class=\"summary-item\">\n    <span class=\"item-label\">Deposit:<\/span>\n    <span class=\"item-value\" id=\"summary-deposit\"><\/span>\n<\/div>\n<div class=\"summary-item\" id=\"summary-payment-note\" style=\"display:none;\">\n    <span class=\"item-label\"><\/span>\n    <span class=\"item-value\" style=\"color:#b48a00;\"><\/span>\n<\/div>\n            \n            <script>\n            (function($) {\n                $(document).ready(function() {\n                    \/\/ Afficher dans la console les valeurs disponibles\n                    console.log('Debug review information:');\n                    console.log('Date:', $('#summary-date').text());\n                    console.log('Time:', $('#summary-time').text());\n                    console.log('Product:', $('.summary-section .item-label:contains(\"Product:\")').closest('.summary-item').find('.item-value').text());\n                    console.log('Full name:', $('#summary-name').text());\n                    console.log('Email:', $('#summary-email').text());\n                    \n                    \/\/ Toutes les valeurs disponibles dans le formulaire\n                    console.log('Hidden values:');\n                    $('input[type=\"hidden\"]').each(function() {\n                        console.log($(this).attr('name') + ':', $(this).val());\n                    });\n                    \/\/ Afficher la langue d\u00e9tect\u00e9e depuis plusieurs sources\n                    try {\n                        var langFromParams = (typeof window.wpt_wowbook_params !== 'undefined') ? (wpt_wowbook_params.lang || wpt_wowbook_params.locale) : undefined;\n                        var langFromStorage = (function(){ try { return sessionStorage.getItem('wpt_wowbook_lang'); } catch(e) { return undefined; } })();\n                        var langFromHidden = $('#wpt-wowbook-lang').val();\n                        console.log('[WPT Wowbook][DEBUG] Language (params):', langFromParams);\n                        console.log('[WPT Wowbook][DEBUG] Language (sessionStorage):', langFromStorage);\n                        console.log('[WPT Wowbook][DEBUG] Language (hidden input):', langFromHidden);\n                    } catch(e) { console.warn('[WPT Wowbook] Debug langue step4 \u00e9chou\u00e9', e); }\n                    \n                    \/\/ Afficher le prix s'il est disponible dans un champ cach\u00e9\n                    var priceValue = $('input[name=\"offer_price\"]').val();\n                    if (priceValue && priceValue !== '') {\n                        $('#summary-price').text(priceValue + ' \u20ac');\n                    } else {\n                        $('#summary-price').text('Price not available');\n                    }\n                });\n            })(jQuery);\n            <\/script>\n        <\/div>\n        \n        <!-- Customer information -->\n        <div class=\"summary-section\">\n            <h4>Customer information<\/h4>\n            <div class=\"summary-item\">\n                <span class=\"item-label\">Full name:<\/span>\n                <span class=\"item-value\" id=\"summary-name\"><\/span>\n            <\/div>\n            <div class=\"summary-item\">\n                <span class=\"item-label\">Email:<\/span>\n                <span class=\"item-value\" id=\"summary-email\"><\/span>\n            <\/div>\n        <\/div>\n        \n        <!-- Passenger 2 (if applicable) -->\n        <div class=\"summary-section\" id=\"summary-passenger2-section\" style=\"display: none;\">\n            <h4>Passenger 2<\/h4>\n            <div class=\"summary-item\">\n                <span class=\"item-label\">Full name:<\/span>\n                <span class=\"item-value\" id=\"summary-passenger2\"><\/span>\n            <\/div>\n        <\/div>\n        \n        <!-- Minor information (if applicable) -->\n        <div class=\"summary-section\" id=\"summary-minor-section\" style=\"display: none;\">\n            <h4>Authorized minor child<\/h4>\n            <div class=\"summary-item\">\n                <span class=\"item-label\">Minor name:<\/span>\n                <span class=\"item-value\" id=\"summary-minor-name\"><\/span>\n            <\/div>\n        <\/div>\n    <\/div>\n    \n    <!-- Important message about payment -->\n    <\/div>\n\n<!-- Boutons de navigation -->\n<div class=\"form-navigation\">\n    <button type=\"button\" class=\"button prev-step\">Back<\/button>\n    <button type=\"button\" class=\"button cb-pay-button\" id=\"cb-pay-button\">Pay online<\/button><button type=\"submit\" class=\"button submit-booking\">Pay cash or Bizum<\/button><span class=\"cb-loader\" id=\"cb-loader\" style=\"display:none;margin-left:10px;\">Loading...<\/span><\/div>\n\n \n        <\/div>\n    <input type=\"hidden\" name=\"trp-form-language\" value=\"de\"\/><\/form>\n    \n    <!-- Message de confirmation final (affich\u00e9 apr\u00e8s soumission) -->\n    <div class=\"booking-confirmation\" style=\"display: none;\">\n        <div class=\"confirmation-message\">\n            <h3>Booking confirmed!<\/h3>\n            <p id=\"confirmation-message-text\">Please go to the counter within 30 minutes to make the payment and finalize your booking.<\/p>\n            <div class=\"booking-details\"><\/div>\n            <div class=\"return-button-container\">\n                <button type=\"button\" class=\"button return-button\" id=\"return-home-btn-ajax\">Back to home<\/button>\n                <div id=\"return-countdown-ajax\" style=\"margin-top:8px; font-size: 0.95em; opacity: .85;\"><\/div>\n            <\/div>\n\n            <script>\n\/\/ Masquage agressif des overlays (Ajax)\nfunction hideAjaxOverlaysNow() {\n    try {\n        var selectors = [\n            '.form-submitting-overlay',\n            '.wpt-wowbook-overlay',\n            '.loading-overlay',\n            '[id*=\"overlay\" i]',\n            '[class*=\"overlay\" i]'\n        ];\n        var overlays = document.querySelectorAll(selectors.join(','));\n        overlays.forEach(function(el){\n            el.style.setProperty('display', 'none', 'important');\n            el.style.setProperty('pointer-events', 'none', 'important');\n            el.style.setProperty('opacity', '0', 'important');\n            el.style.setProperty('visibility', 'hidden', 'important');\n        });\n        if (document.body) {\n            document.body.style.setProperty('pointer-events', 'auto', 'important');\n            document.body.style.setProperty('overflow', 'auto', 'important');\n        }\n    } catch(e) { if (console && console.warn) console.warn('[WPT DEBUG][Ajax] hide overlays failed', e); }\n}\n\n\/\/ Fonction de redirection automatique + compte \u00e0 rebours (Ajax)\nfunction initAutoRedirect() {\n    hideAjaxOverlaysNow();\n    \/\/ Balayage 2s pour overlays inject\u00e9s tardivement\n    (function sweep(){\n        var start = Date.now();\n        var t = setInterval(function(){\n            hideAjaxOverlaysNow();\n            if (Date.now() - start > 2000) clearInterval(t);\n        }, 200);\n    })();\n\n    var clicked = false;\n    var btn = document.getElementById('return-home-btn-ajax');\n    var countdownEl = document.getElementById('return-countdown-ajax');\n    var seconds = 5;\n    if (countdownEl) countdownEl.textContent = 'Redirection automatique dans ' + seconds + 's';\n    var countdownTimer = window.setInterval(function(){\n        seconds--;\n        if (seconds >= 0 && countdownEl) countdownEl.textContent = 'Redirection automatique dans ' + seconds + 's';\n        if (seconds <= 0) window.clearInterval(countdownTimer);\n    }, 1000);\n\n    if (btn) {\n        btn.addEventListener('click', function() {\n            clicked = true;\n            if (countdownTimer) window.clearInterval(countdownTimer);\n            \/\/ Flush session data before redirecting\n            flushSessionData();\n            window.location.href = '\/';\n        });\n    }\n    window.setTimeout(function() {\n        if (!clicked) {\n            console.log('[WPT DEBUG] Auto-redirect to \/kiosk after 5s');\n            \/\/ Flush session data before redirecting\n            flushSessionData();\n            window.location.href = '\/kiosk';\n        }\n    }, 5000);\n}\n\n\/\/ Fonction pour flusher les donn\u00e9es de session\nfunction flushSessionData() {\n    \/\/ Vider localStorage et sessionStorage\n    localStorage.clear();\n    sessionStorage.clear();\n    \n    \/\/ Effacer les cookies sp\u00e9cifiques au plugin (si existants)\n    \/\/ document.cookie = \"wpt_wowbook_booking=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=\/;\";\n    \n    console.log('[WPT DEBUG] Session data flushed');\n}\n\n\/\/ Initialiser la redirection seulement si la div est visible\nvar confirmationDiv = document.querySelector('.booking-confirmation');\nif (confirmationDiv && confirmationDiv.style.display !== 'none') {\n    initAutoRedirect();\n}\n<\/script>\n        <\/div>\n    <\/div>\n\n    <!-- Overlay global pour affichage du loader pendant soumission\/navigation -->\n    <div class=\"form-submitting-overlay\" style=\"display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 9999;\">\n        <div class=\"form-submitting\" style=\"position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; padding: 20px; border-radius: 5px; text-align: center;\">\n            <div class=\"loading-spinner\"><\/div>\n            <p>Processing your booking...<\/p>\n        <\/div>\n    <\/div>\n\n<\/div>\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":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","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":"","ast-breadcrumbs-content":"","ast-featured-img":"","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-6308","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/test16.wptotem.com\/de\/wp-json\/wp\/v2\/pages\/6308","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/test16.wptotem.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/test16.wptotem.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/test16.wptotem.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/test16.wptotem.com\/de\/wp-json\/wp\/v2\/comments?post=6308"}],"version-history":[{"count":0,"href":"https:\/\/test16.wptotem.com\/de\/wp-json\/wp\/v2\/pages\/6308\/revisions"}],"wp:attachment":[{"href":"https:\/\/test16.wptotem.com\/de\/wp-json\/wp\/v2\/media?parent=6308"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}