{"id":6778,"date":"2025-10-28T09:07:36","date_gmt":"2025-10-28T09:07:36","guid":{"rendered":"https:\/\/usmantravels.com?page_id=6778"},"modified":"2025-10-28T13:30:17","modified_gmt":"2025-10-28T13:30:17","slug":"booking-form","status":"publish","type":"page","link":"https:\/\/usmantravels.com\/de\/booking-form\/","title":{"rendered":"Buchungsformular"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"6778\" class=\"elementor elementor-6778\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6ec29ef e-flex e-con-boxed e-con e-parent\" data-id=\"6ec29ef\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9d297fb elementor-widget elementor-widget-shortcode\" data-id=\"9d297fb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">    <!-- Tailwind CDN with Custom Configuration -->\n    <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n    <script>\n        tailwind.config = {\n            theme: {\n                extend: {\n                    colors: {\n                        primary: {\n                            50: '#fffbeb',\n                            100: '#fef3c7',\n                            200: '#fde68a',\n                            300: '#fcd34d',\n                            400: '#fbbf24',\n                            500: '#f59e0b',\n                            600: '#d97706',\n                            700: '#b45309',\n                            800: '#92400e',\n                            900: '#78350f',\n                        },\n                        premium: {\n                            gold: '#fbbf24',\n                            navy: '#1e3a8a',\n                            teal: '#0d9488'\n                        }\n                    },\n                    fontFamily: {\n                        'sans': ['Inter', 'system-ui', 'sans-serif'],\n                    },\n                    boxShadow: {\n                        'premium': '0 25px 50px -12px rgba(0, 0, 0, 0.15)',\n                        'premium-lg': '0 35px 60px -12px rgba(0, 0, 0, 0.2)',\n                    },\n                    animation: {\n                        'float': 'float 6s ease-in-out infinite',\n                        'fadeIn': 'fadeIn 0.8s ease-in-out',\n                    }\n                }\n            }\n        }\n    <\/script>\n\n    <style>\n        @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');\n\n        * {\n            font-family: 'Inter', sans-serif;\n        }\n\n        .smooth-transition {\n            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n        }\n\n        .glass-effect {\n            background: rgba(255, 255, 255, 0.85);\n            backdrop-filter: blur(20px);\n            border: 1px solid rgba(255, 255, 255, 0.3);\n        }\n\n        .gradient-bg {\n            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n        }\n\n        .premium-gradient {\n            background: linear-gradient(135deg, #f59e0b 0%, #d97706 50%, #b45309 100%);\n        }\n\n        .form-success {\n            background: linear-gradient(135deg, #10b981 0%, #059669 100%);\n            border: none;\n            color: white;\n            padding: 24px;\n            border-radius: 16px;\n            margin-bottom: 24px;\n            box-shadow: 0 20px 40px -12px rgba(16, 185, 129, 0.3);\n        }\n\n        .form-error {\n            background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);\n            border: none;\n            color: white;\n            padding: 24px;\n            border-radius: 16px;\n            margin-bottom: 24px;\n            box-shadow: 0 20px 40px -12px rgba(239, 68, 68, 0.3);\n        }\n\n        .email-test {\n            background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);\n            border: none;\n            color: white;\n            padding: 20px;\n            border-radius: 16px;\n            margin-bottom: 24px;\n            box-shadow: 0 20px 40px -12px rgba(59, 130, 246, 0.3);\n        }\n\n        .input-focus:focus {\n            transform: translateY(-2px);\n            box-shadow: 0 20px 40px -12px rgba(245, 158, 11, 0.3);\n        }\n\n        .floating-element {\n            animation: float 6s ease-in-out infinite;\n        }\n\n        @keyframes float {\n\n            0%,\n            100% {\n                transform: translateY(0px);\n            }\n\n            50% {\n                transform: translateY(-10px);\n            }\n        }\n\n        @keyframes fadeIn {\n            from {\n                opacity: 0;\n                transform: translateY(20px);\n            }\n\n            to {\n                opacity: 1;\n                transform: translateY(0);\n            }\n        }\n\n        .animate-fadeIn {\n            animation: fadeIn 0.8s ease-in-out;\n        }\n\n        .hide-sidebar .widget-area,\n        .hide-sidebar #secondary,\n        .hide-sidebar .sidebar-wrap-main {\n            display: none !important;\n        }\n\n        .gradient-text {\n            background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);\n            -webkit-background-clip: text;\n            -webkit-text-fill-color: transparent;\n            background-clip: text;\n        }\n    <\/style>\n\n    <div class=\"min-h-screen bg-gradient-to-br from-slate-50 via-orange-50 to-amber-50 py-8 px-4\">\n        <div class=\"max-w-7xl mx-auto\">\n            <!-- Background Decorative Elements -->\n            <div class=\"fixed top-0 left-0 w-full h-full pointer-events-none z-0\">\n                <div class=\"absolute top-10 left-10 w-20 h-20 bg-primary-200 rounded-full opacity-20 floating-element\"><\/div>\n                <div class=\"absolute top-40 right-20 w-16 h-16 bg-primary-300 rounded-full opacity-30 floating-element\" style=\"animation-delay: -2s;\"><\/div>\n                <div class=\"absolute bottom-20 left-20 w-24 h-24 bg-primary-400 rounded-full opacity-20 floating-element\" style=\"animation-delay: -4s;\"><\/div>\n                <div class=\"absolute bottom-40 right-40 w-12 h-12 bg-primary-500 rounded-full opacity-40 floating-element\" style=\"animation-delay: -1s;\"><\/div>\n            <\/div>\n\n            <!-- Display success\/error messages -->\n            \n            <!-- Email Test Section (for admin) -->\n            \n            <!-- Header Section -->\n            <div class=\"text-center mb-12 relative z-10 animate-fadeIn\">\n                <div class=\"inline-flex items-center justify-center w-20 h-20 bg-gradient-to-br from-primary-500 to-primary-600 rounded-2xl shadow-premium mb-6\">\n                    <i class=\"fas fa-plane-departure text-3xl text-white\"><\/i>\n                <\/div>\n                                    <h1 class=\"text-4xl md:text-5xl font-bold text-gray-900 mb-4\">Complete Your <span class=\"gradient-text\">Booking<\/span><\/h1>\n                    <p class=\"text-xl text-gray-600 max-w-2xl mx-auto\">Fill in your details below to confirm your travel package and embark on an unforgettable journey<\/p>\n                            <\/div>\n\n            \n            <div class=\"grid grid-cols-1 lg:grid-cols-3 gap-8 relative z-10\">\n                <!-- Booking Form -->\n                <div class=\"lg:col-span-2\">\n                    <div class=\"glass-effect rounded-3xl shadow-premium p-8 animate-fadeIn\" style=\"animation-delay: 0.2s;\">\n                        <div class=\"flex items-center space-x-3 mb-8\">\n                            <div class=\"w-12 h-12 bg-gradient-to-br from-primary-500 to-primary-600 rounded-xl flex items-center justify-center shadow-lg\">\n                                <i class=\"fas fa-user text-xl text-white\"><\/i>\n                            <\/div>\n                            <div>\n                                <h2 class=\"text-2xl font-bold text-gray-900\">Personal Information<\/h2>\n                                <p class=\"text-gray-600\">Tell us about yourself<\/p>\n                            <\/div>\n                        <\/div>\n\n                        \n                                                <form id=\"booking-form\" method=\"POST\" action=\"https:\/\/usmantravels.com\/wp-admin\/admin-post.php?action=process_travel_booking\"\n                            class=\"\"\n                            data-order-total=\"0\"\n                            data-original-total=\"0\"\n                            data-server-subtotal=\"0\"\n                            data-min-installment=\"100\"\n                            data-install-floor=\"100\"\n                            data-infant-fee=\"290\"\n                            data-stripe-on=\"0\"\n                            data-coupon-ajax=\"https:\/\/usmantravels.com\/wp-admin\/admin-ajax.php\"\n                            data-coupon-nonce=\"4c3c370056\"\n                        >\n                            <input type=\"hidden\" name=\"action\" value=\"process_travel_booking\">\n                            <input type=\"hidden\" name=\"package_id\" value=\"0\">\n                            <input type=\"hidden\" name=\"adults\" value=\"1\">\n                            <input type=\"hidden\" name=\"infants\" value=\"0\">\n                            <input type=\"hidden\" name=\"total_price\" id=\"travel-booking-total-price-field\" value=\"0\">\n                            <input type=\"hidden\" name=\"mtb_room_name\" value=\"\">\n                                                                                    <input type=\"hidden\" id=\"booking_nonce_field\" name=\"booking_nonce_field\" value=\"38a5a1104f\" \/><input type=\"hidden\" name=\"_wp_http_referer\" value=\"\/de\/wp-json\/wp\/v2\/pages\/6778\" \/>\n                            <div class=\"space-y-8\">\n                                <!-- Contact Information -->\n                                <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6\">\n                                    <div class=\"space-y-2\">\n                                        <label class=\"block text-sm font-semibold text-gray-700\">\n                                            <i class=\"fas fa-user mr-2 text-primary-500\"><\/i>Full Name *\n                                        <\/label>\n                                        <input type=\"text\" name=\"full_name\" required\n                                            class=\"w-full px-4 py-4 border-2 border-gray-200 rounded-xl focus:border-primary-500 focus:ring-0 input-focus smooth-transition\">\n                                    <\/div>\n\n                                    <div class=\"space-y-2\">\n                                        <label class=\"block text-sm font-semibold text-gray-700\">\n                                            <i class=\"fas fa-envelope mr-2 text-primary-500\"><\/i>Email Address *\n                                        <\/label>\n                                        <input type=\"email\" name=\"email\" required\n                                            class=\"w-full px-4 py-4 border-2 border-gray-200 rounded-xl focus:border-primary-500 focus:ring-0 input-focus smooth-transition\">\n                                    <\/div>\n\n                                    <div class=\"space-y-2\">\n                                        <label class=\"block text-sm font-semibold text-gray-700\">\n                                            <i class=\"fas fa-phone mr-2 text-primary-500\"><\/i>Phone Number *\n                                        <\/label>\n                                        <input type=\"tel\" name=\"phone\" required\n                                            class=\"w-full px-4 py-4 border-2 border-gray-200 rounded-xl focus:border-primary-500 focus:ring-0 input-focus smooth-transition\">\n                                    <\/div>\n\n                                    <div class=\"space-y-2\">\n                                            <label class=\"block text-sm font-medium text-gray-700\">Date of Birth<\/label>\n                                            <input type=\"date\" name=\"date_of_birth\"\n                                                class=\"w-full px-4 py-4 border-2 border-gray-200 rounded-xl focus:border-primary-500 focus:ring-0 input-focus smooth-transition text-gray-400\">\n                                    <\/div>\n\n                                <\/div>\n\n                                <!-- Additional Contact Information -->\n                                <div class=\"border-t border-gray-100 pt-8\">\n                                    <div class=\"flex items-center space-x-3 mb-6\">\n                                        <div class=\"w-10 h-10 bg-primary-100 rounded-lg flex items-center justify-center\">\n                                            <i class=\"fas fa-map-marker-alt text-primary-600\"><\/i>\n                                        <\/div>\n                                        <h3 class=\"text-xl font-semibold text-gray-800\">Additional Information<\/h3>\n                                    <\/div>\n                                    <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6\">\n                                        <div class=\"space-y-2\">\n                                            <label class=\"block text-sm font-medium text-gray-700\">Address<\/label>\n                                            <input type=\"text\" name=\"address\"\n                                                class=\"w-full px-4 py-4 border-2 border-gray-200 rounded-xl focus:border-primary-500 focus:ring-0 input-focus smooth-transition\">\n                                        <\/div>\n\n                                        <div class=\"space-y-2\">\n                                            <label class=\"block text-sm font-medium text-gray-700\">City<\/label>\n                                            <input type=\"text\" name=\"city\"\n                                                class=\"w-full px-4 py-4 border-2 border-gray-200 rounded-xl focus:border-primary-500 focus:ring-0 input-focus smooth-transition\">\n                                        <\/div>\n\n                                        <div class=\"space-y-2\">\n                                            <label class=\"block text-sm font-medium text-gray-700\">Postal Code<\/label>\n                                            <input type=\"text\" name=\"postal_code\"\n                                                class=\"w-full px-4 py-4 border-2 border-gray-200 rounded-xl focus:border-primary-500 focus:ring-0 input-focus smooth-transition\">\n                                        <\/div>\n\n                                        <div class=\"space-y-2\">\n                                        <label class=\"block text-sm font-semibold text-gray-700\">\n                                            <i class=\"fas fa-flag mr-2 text-primary-500\"><\/i>Country *\n                                        <\/label>\n                                        <input type=\"text\" name=\"country\" required\n                                            class=\"w-full px-4 py-4 border-2 border-gray-200 rounded-xl focus:border-primary-500 focus:ring-0 input-focus smooth-transition\">\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n\n                                <!-- Travel Details -->\n                                <div class=\"border-t border-gray-100 pt-8\">\n                                    <div class=\"flex items-center space-x-3 mb-6\">\n                                        <div class=\"w-10 h-10 bg-primary-100 rounded-lg flex items-center justify-center\">\n                                            <i class=\"fas fa-suitcase text-primary-600\"><\/i>\n                                        <\/div>\n                                        <h3 class=\"text-xl font-semibold text-gray-800\">Travel Details<\/h3>\n                                    <\/div>\n                                    <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6\">\n                                        <div class=\"space-y-2\">\n                                            <label class=\"block text-sm font-medium text-gray-700\">Number of Adults<\/label>\n                                            <div class=\"relative\">\n                                                <input type=\"number\" name=\"adults_display\" value=\"1\" readonly\n                                                    class=\"w-full px-4 py-4 border-2 border-gray-200 rounded-xl bg-gray-50 cursor-not-allowed text-gray-600\">\n                                                <div class=\"absolute right-3 top-1\/2 transform -translate-y-1\/2\">\n                                                    <i class=\"fas fa-user text-gray-400\"><\/i>\n                                                <\/div>\n                                            <\/div>\n                                        <\/div>\n\n                                        <div class=\"space-y-2\">\n                                            <label class=\"block text-sm font-medium text-gray-700\">Number of Infants<\/label>\n                                            <div class=\"relative\">\n                                                <input type=\"number\" name=\"infants_display\" value=\"0\" readonly\n                                                    class=\"w-full px-4 py-4 border-2 border-gray-200 rounded-xl bg-gray-50 cursor-not-allowed text-gray-600\">\n                                                <div class=\"absolute right-3 top-1\/2 transform -translate-y-1\/2\">\n                                                    <i class=\"fas fa-baby text-gray-400\"><\/i>\n                                                <\/div>\n                                            <\/div>\n                                        <\/div>\n                                    <\/div>\n                                <\/div>\n\n                                <!-- Special Requirements -->\n                                <div class=\"border-t border-gray-100 pt-8\">\n                                    <div class=\"flex items-center space-x-3 mb-6\">\n                                        <div class=\"w-10 h-10 bg-primary-100 rounded-lg flex items-center justify-center\">\n                                            <i class=\"fas fa-star text-primary-600\"><\/i>\n                                        <\/div>\n                                        <h3 class=\"text-xl font-semibold text-gray-800\">Special Requirements<\/h3>\n                                    <\/div>\n                                    <div class=\"space-y-2\">\n                                        <label class=\"block text-sm font-medium text-gray-700\">Additional Notes<\/label>\n                                        <textarea name=\"special_requirements\" rows=\"4\"\n                                            class=\"w-full px-4 py-4 border-2 border-gray-200 rounded-xl focus:border-primary-500 focus:ring-0 input-focus smooth-transition resize-none\"><\/textarea>\n                                    <\/div>\n                                <\/div>\n\n                                <!-- Promo code (before payment) -->\n                                \n                                \n                                <!-- Submit Button -->\n                                <div class=\"border-t border-gray-100 pt-8\">\n                                    <button type=\"submit\"\n                                        class=\"w-full premium-gradient text-white font-bold py-5 px-8 rounded-2xl shadow-premium-lg hover:shadow-premium transition-all duration-300 transform hover:scale-105 smooth-transition text-lg group\">\n                                        <span class=\"flex items-center justify-center space-x-3\">\n                                            <i class=\"fas fa-lock group-hover:scale-110 smooth-transition\"><\/i>\n                                            <span id=\"travel-booking-submit-total\">\n                                                                                                    Complete Booking - \u20ac0.00                                                                                            <\/span>\n                                        <\/span>\n                                    <\/button>\n                                    <p class=\"text-center text-sm text-gray-500 mt-4 flex items-center justify-center space-x-2\">\n                                        <i class=\"fas fa-shield-alt text-primary-500\"><\/i>\n                                        <span>By clicking this button, you agree to our Terms of Service and Privacy Policy<\/span>\n                                    <\/p>\n                                <\/div>\n                            <\/div>\n                        <\/form>\n                    <\/div>\n                <\/div>\n\n                <!-- Booking Summary -->\n                <div class=\"lg:col-span-1\">\n                    <div class=\"sticky top-8 animate-fadeIn\" style=\"animation-delay: 0.4s;\">\n                        <div class=\"bg-gradient-to-br from-gray-900 to-gray-800 rounded-3xl shadow-premium-lg p-8 text-white\">\n                            <div class=\"flex items-center space-x-3 mb-6\">\n                                <div class=\"w-12 h-12 bg-primary-500 rounded-xl flex items-center justify-center shadow-lg\">\n                                    <i class=\"fas fa-receipt text-xl\"><\/i>\n                                <\/div>\n                                <div>\n                                    <h3 class=\"text-xl font-bold\">Booking Summary<\/h3>\n                                    <p class=\"text-gray-300 text-sm\">Your travel details<\/p>\n                                <\/div>\n                            <\/div>\n\n                                                            <div class=\"space-y-6\">\n                                    <!-- Package Info -->\n                                    <div class=\"bg-gray-800 rounded-2xl p-5 border border-gray-700\">\n                                        <h4 class=\"font-bold text-lg mb-3 text-white\">Booking Form<\/h4>\n                                        <div class=\"space-y-3 text-sm text-gray-300\">\n                                            \n                                            \n                                            \n                                            \n                                                                                    <\/div>\n                                    <\/div>\n\n                                    <!-- Travelers -->\n                                    <div class=\"bg-gray-800 rounded-2xl p-5 border border-gray-700\">\n                                        <h5 class=\"font-semibold text-white mb-3 flex items-center space-x-2\">\n                                            <i class=\"fas fa-users text-primary-400\"><\/i>\n                                            <span>Travelers<\/span>\n                                        <\/h5>\n                                        <div class=\"space-y-2 text-sm\">\n                                            <div class=\"flex justify-between items-center\">\n                                                <span class=\"text-gray-300\">Adults:<\/span>\n                                                <span class=\"font-semibold text-white\" id=\"travel-booking-summary-adult-line\">1 x \u20ac0.00<\/span>\n                                            <\/div>\n                                                                                    <\/div>\n                                    <\/div>\n\n                                    <!-- Price Breakdown -->\n                                    <div class=\"bg-gray-800 rounded-2xl p-5 border border-gray-700\">\n                                        <h5 class=\"font-semibold text-white mb-3 flex items-center space-x-2\">\n                                            <i class=\"fas fa-receipt text-primary-400\"><\/i>\n                                            <span>Price Breakdown<\/span>\n                                        <\/h5>\n                                        <div class=\"space-y-3 text-sm\">\n                                            <div class=\"flex justify-between items-center\">\n                                                <span class=\"text-gray-300\">Adults Total:<\/span>\n                                                <span class=\"font-semibold text-white\" id=\"travel-booking-summary-adults-total\">\u20ac0.00<\/span>\n                                            <\/div>\n                                                                                        <div id=\"mtb-summary-coupon-line\" class=\"flex justify-between items-center text-emerald-300\" style=\"display:none;\">\n                                                <span class=\"text-gray-300\">Coupon discount:<\/span>\n                                                <span class=\"font-semibold\" id=\"mtb-summary-coupon-discount\">\u2212\u20ac0.00<\/span>\n                                            <\/div>\n                                            <div class=\"border-t border-gray-600 pt-3\">\n                                                <div class=\"flex justify-between items-center text-base font-bold\">\n                                                    <span class=\"text-white\">Total Amount:<\/span>\n                                                    <span class=\"text-primary-400 text-lg\" id=\"travel-booking-summary-total\">\u20ac0.00<\/span>\n                                                <\/div>\n                                            <\/div>\n                                        <\/div>\n                                    <\/div>\n\n                                    <!-- Need Help -->\n                                    <div class=\"bg-gradient-to-br from-primary-600 to-primary-700 rounded-2xl p-5 border border-primary-500\">\n                                        <h5 class=\"font-semibold text-white mb-3 flex items-center space-x-2\" style=\"color:black;\">\n                                            <i class=\"fas fa-headset\"><\/i>\n                                            <span>Need Help?<\/span>\n                                        <\/h5>\n                                        <p class=\"text-primary-100 text-sm mb-4\">Our travel experts are here to assist you with any questions.<\/p>\n                                        <div class=\"space-y-2 text-sm text-primary-100\">\n                                            <div class=\"flex items-center space-x-3\">\n                                                <i class=\"fas fa-envelope w-4\"><\/i>\n                                                <span>info@usmantravelssrl.com<\/span>\n                                            <\/div>\n                                            <div class=\"flex items-center space-x-3\">\n                                                <i class=\"fas fa-phone w-4\"><\/i>\n                                                <span>+39 3920498149<\/span>\n                                            <\/div>\n                                        <\/div>\n                                    <\/div>\n\n                                    <!-- Email Test Link (for admin) -->\n                                                                    <\/div>\n                                                    <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n                    <\/div>\n    <\/div>\n\n    <!-- Font Awesome for Icons -->\n    <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/js\/all.min.js\"><\/script>\n\n    <!-- JavaScript for form handling -->\n    <script>\n        window.mtbUpdatePayLabel = function () {\n            var form = document.getElementById('booking-form');\n            if (!form) { return; }\n            var out = document.getElementById('travel-booking-submit-total');\n            if (!out) { return; }\n            var order = parseFloat(form.getAttribute('data-order-total') || '0') || 0;\n            var r = form.querySelector('input[name=\"mtb_payment_choice\"]:checked');\n            var v = r ? r.value : '';\n            if (v === 'stripe_installment') {\n                var inp = document.getElementById('mtb-installment-amount');\n                var amt = inp ? parseFloat(String(inp.value).replace(',', '.')) : NaN;\n                var fl = parseFloat(form.getAttribute('data-install-floor') || '100') || 100;\n                if (!isFinite(amt) || amt < 0) { amt = Math.min(order, fl); }\n                out.textContent = 'Continue to payment \u2013 \u20ac' + amt.toFixed(2) + ' (installment)';\n                return;\n            }\n            if (v === 'stripe_full') {\n                out.textContent = 'Continue to payment \u2013 \u20ac' + order.toFixed(2);\n                return;\n            }\n            out.textContent = 'Complete booking \u2013 \u20ac' + order.toFixed(2);\n        };\n        window.mtbSyncStripePaymentUi = function (form) {\n            if (!form) { return; }\n            var r = form.querySelector('input[name=\"mtb_payment_choice\"]:checked');\n            var v = r ? r.value : '';\n            var stripe = v === 'stripe_full' || v === 'stripe_installment';\n            form.setAttribute('data-stripe-on', stripe ? '1' : '0');\n            var mode = document.getElementById('mtb-payment-mode');\n            if (mode) {\n                mode.value = v === 'stripe_installment' ? 'installment' : 'full';\n            }\n            var wrap = document.getElementById('mtb-installment-wrap');\n            var inp = document.getElementById('mtb-installment-amount');\n            if (wrap) {\n                wrap.style.display = v === 'stripe_installment' ? 'block' : 'none';\n            }\n            if (inp) {\n                inp.required = v === 'stripe_installment';\n            }\n            if (typeof window.mtbUpdatePayLabel === 'function') {\n                window.mtbUpdatePayLabel();\n            }\n        };\n        document.addEventListener('DOMContentLoaded', function() {\n            (function syncTotalFromUrl() {\n                function parseMoneyParam(raw) {\n                    if (raw == null || raw === '') {\n                        return NaN;\n                    }\n                    var s = String(raw).trim().replace(\/[^\\d,.\\-]\/g, '');\n                    if (!s || s === '-' || s === '.' || s === ',') {\n                        return NaN;\n                    }\n                    var hasComma = s.indexOf(',') !== -1;\n                    var hasDot = s.indexOf('.') !== -1;\n                    if (hasComma && hasDot) {\n                        if (s.lastIndexOf(',') > s.lastIndexOf('.')) {\n                            s = s.split('.').join('').replace(',', '.');\n                        } else {\n                            s = s.split(',').join('');\n                        }\n                    } else if (hasComma && !hasDot) {\n                        var parts = s.split(',');\n                        if (parts.length === 2 && parts[1].length <= 2) {\n                            s = parts[0].replace(\/\\.\/g, '') + '.' + parts[1];\n                        } else {\n                            s = s.split(',').join('');\n                        }\n                    }\n                    var n = parseFloat(s);\n                    return isFinite(n) && n > 0 ? n : NaN;\n                }\n                var params = new URLSearchParams(window.location.search);\n                var rawTotal = params.get('total') || params.get('booking_total');\n                var fromUrl = parseMoneyParam(rawTotal);\n                if (isNaN(fromUrl)) {\n                    return;\n                }\n                var formForStripe = document.getElementById('booking-form');\n                var infantFee = parseFloat(formForStripe && formForStripe.getAttribute('data-infant-fee')) || 290;\n                var adultsN = Math.max(1, parseInt(params.get('adults') || '1', 10) || 1);\n                var infantsN = Math.max(0, parseInt(params.get('infants') || '0', 10) || 0);\n                var adultsSub = Math.max(0, fromUrl - infantsN * infantFee);\n                var perAdult = adultsN > 0 ? (adultsSub \/ adultsN) : 0;\n                var perAdultStr = perAdult.toLocaleString('en-US', {\n                    minimumFractionDigits: 2,\n                    maximumFractionDigits: 2\n                });\n                var subStr = '\u20ac' + adultsSub.toLocaleString('en-US', {\n                    minimumFractionDigits: 2,\n                    maximumFractionDigits: 2\n                });\n                var hidden = document.getElementById('travel-booking-total-price-field');\n                var submitEl = document.getElementById('travel-booking-submit-total');\n                var summaryEl = document.getElementById('travel-booking-summary-total');\n                var adultLine = document.getElementById('travel-booking-summary-adult-line');\n                var adultsTotalEl = document.getElementById('travel-booking-summary-adults-total');\n                var formatted = '\u20ac' + fromUrl.toLocaleString('en-US', {\n                    minimumFractionDigits: 2,\n                    maximumFractionDigits: 2\n                });\n                if (hidden) {\n                    hidden.value = String(fromUrl);\n                }\n                if (formForStripe) {\n                    formForStripe.setAttribute('data-order-total', String(fromUrl));\n                    formForStripe.setAttribute('data-original-total', String(fromUrl));\n                }\n                if (formForStripe && typeof window.mtbSyncStripePaymentUi === 'function') {\n                    window.mtbSyncStripePaymentUi(formForStripe);\n                } else if (submitEl) {\n                    submitEl.textContent = 'Complete Booking - ' + formatted;\n                }\n                if (summaryEl) {\n                    summaryEl.textContent = formatted;\n                }\n                if (adultLine) {\n                    adultLine.textContent = adultsN + ' x \u20ac' + perAdultStr;\n                }\n                if (adultsTotalEl) {\n                    adultsTotalEl.textContent = subStr;\n                }\n            })();\n\n            window.mtbFormatEur = function (n) {\n                var x = typeof n === 'number' ? n : parseFloat(String(n).replace(',', '.'));\n                if (!isFinite(x)) { x = 0; }\n                return '\u20ac' + x.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 });\n            };\n\n            window.mtbApplyOrderTotalUi = function (form, grand, discount) {\n                if (!form) { return; }\n                grand = parseFloat(String(grand).replace(',', '.'));\n                discount = parseFloat(String(discount || 0).replace(',', '.'));\n                if (!isFinite(grand)) { grand = 0; }\n                if (!isFinite(discount)) { discount = 0; }\n                var hidden = document.getElementById('travel-booking-total-price-field');\n                if (hidden) { hidden.value = grand.toFixed(2); }\n                form.setAttribute('data-order-total', String(grand));\n                var summaryEl = document.getElementById('travel-booking-summary-total');\n                if (summaryEl) { summaryEl.textContent = window.mtbFormatEur(grand); }\n                var line = document.getElementById('mtb-summary-coupon-line');\n                var discEl = document.getElementById('mtb-summary-coupon-discount');\n                if (line && discEl) {\n                    if (discount > 0.001) {\n                        line.style.display = 'flex';\n                        discEl.textContent = '\u2212' + window.mtbFormatEur(discount);\n                    } else {\n                        line.style.display = 'none';\n                    }\n                }\n                var sfl = document.getElementById('mtb-stripe-full-line');\n                if (sfl) { sfl.textContent = window.mtbFormatEur(grand) + ' via Stripe Checkout'; }\n                var inst = document.getElementById('mtb-installment-amount');\n                var floor = parseFloat(form.getAttribute('data-install-floor') || '100') || 100;\n                if (inst) {\n                    inst.setAttribute('max', grand.toFixed(2));\n                    inst.setAttribute('min', floor.toFixed(2));\n                    var cur = parseFloat(String(inst.value).replace(',', '.'));\n                    if (!isFinite(cur) || cur > grand) { inst.value = grand.toFixed(2); }\n                    if (cur < floor && grand >= floor) { inst.value = Math.min(grand, floor).toFixed(2); }\n                }\n                var range = document.getElementById('mtb-installment-range-text');\n                if (range) {\n                    range.textContent = 'Between ' + window.mtbFormatEur(floor) + ' and ' + window.mtbFormatEur(grand) + '.';\n                }\n                var payInst = form.querySelector('input[name=\"mtb_payment_choice\"][value=\"stripe_installment\"]');\n                if (payInst) {\n                    var dis = grand < floor - 0.001;\n                    payInst.disabled = dis;\n                    if (dis && payInst.checked) {\n                        var full = form.querySelector('input[name=\"mtb_payment_choice\"][value=\"stripe_full\"]');\n                        if (full) { full.checked = true; }\n                        var wrap = document.getElementById('mtb-installment-wrap');\n                        if (wrap) { wrap.style.display = 'none'; }\n                    }\n                }\n                if (typeof window.mtbSyncStripePaymentUi === 'function') {\n                    window.mtbSyncStripePaymentUi(form);\n                }\n            };\n\n            (function mtbCouponUi() {\n                var form = document.getElementById('booking-form');\n                if (!form) { return; }\n                var ajaxUrl = form.getAttribute('data-coupon-ajax');\n                var nonce = form.getAttribute('data-coupon-nonce');\n                var applyBtn = document.getElementById('mtb-coupon-apply');\n                var removeBtn = document.getElementById('mtb-coupon-remove');\n                var input = document.getElementById('mtb-coupon-code-input');\n                var msg = document.getElementById('mtb-coupon-message');\n                if (!applyBtn || !input) { return; }\n\n                function setMsg(text, ok) {\n                    if (!msg) { return; }\n                    msg.textContent = text || '';\n                    msg.className = 'text-sm mt-2 min-h-[1.25rem] ' + (ok ? 'text-emerald-600' : 'text-red-600');\n                }\n\n                applyBtn.addEventListener('click', function () {\n                    if (!ajaxUrl || !nonce) { return; }\n                    var code = (input.value || '').trim();\n                    if (!code) { setMsg('Enter a coupon code.', false); return; }\n                    setMsg('Checking\u2026', true);\n                    applyBtn.disabled = true;\n                    var fd = new FormData();\n                    fd.append('action', 'mtb_validate_coupon');\n                    fd.append('nonce', nonce);\n                    fd.append('mtb_coupon_code', code);\n                    fd.append('package_id', form.querySelector('input[name=\"package_id\"]') ? form.querySelector('input[name=\"package_id\"]').value : '0');\n                    fd.append('adults', form.querySelector('input[name=\"adults\"]') ? form.querySelector('input[name=\"adults\"]').value : '1');\n                    fd.append('infants', form.querySelector('input[name=\"infants\"]') ? form.querySelector('input[name=\"infants\"]').value : '0');\n                    var rn = form.querySelector('input[name=\"mtb_room_name\"]');\n                    fd.append('mtb_room_name', rn ? rn.value : '');\n                    fetch(ajaxUrl, { method: 'POST', body: fd, credentials: 'same-origin' })\n                        .then(function (r) { return r.json(); })\n                        .then(function (j) {\n                            applyBtn.disabled = false;\n                            if (j.success && j.data) {\n                                window.mtbApplyOrderTotalUi(form, j.data.grand_total, j.data.discount);\n                                input.value = j.data.coupon_code || code.toUpperCase();\n                                removeBtn.classList.remove('hidden');\n                                setMsg(j.data.message || 'Coupon applied.', true);\n                            } else {\n                                var m = (j.data && j.data.message) ? j.data.message : 'Could not apply coupon.';\n                                setMsg(m, false);\n                            }\n                        })\n                        .catch(function () {\n                            applyBtn.disabled = false;\n                            setMsg('Network error. Try again.', false);\n                        });\n                });\n\n                if (removeBtn) {\n                    removeBtn.addEventListener('click', function () {\n                        input.value = '';\n                        var orig = parseFloat(form.getAttribute('data-original-total') || '0') || 0;\n                        window.mtbApplyOrderTotalUi(form, orig, 0);\n                        removeBtn.classList.add('hidden');\n                        setMsg('', true);\n                    });\n                }\n            })();\n\n            const form = document.getElementById('booking-form');\n            const mtbStripeJsonPostUrl = \"\";\n\n            if (form) {\n                form.querySelectorAll('input[name=\"mtb_payment_choice\"]').forEach(function (radio) {\n                    radio.addEventListener('change', function () {\n                        if (typeof window.mtbSyncStripePaymentUi === 'function') {\n                            window.mtbSyncStripePaymentUi(form);\n                        }\n                    });\n                });\n                var instInp = document.getElementById('mtb-installment-amount');\n                if (instInp) {\n                    instInp.addEventListener('input', function () {\n                        if (typeof window.mtbUpdatePayLabel === 'function') {\n                            window.mtbUpdatePayLabel();\n                        }\n                    });\n                }\n                if (typeof window.mtbSyncStripePaymentUi === 'function') {\n                    window.mtbSyncStripePaymentUi(form);\n                }\n\n                form.addEventListener('submit', function(e) {\n                    \/\/ Basic validation\n                    const requiredFields = form.querySelectorAll('[required]');\n                    let valid = true;\n\n                    requiredFields.forEach(field => {\n                        if (!field.value.trim()) {\n                            valid = false;\n                            field.classList.add('border-red-500', 'shake-animation');\n                            setTimeout(() => {\n                                field.classList.remove('shake-animation');\n                            }, 500);\n                        } else {\n                            field.classList.remove('border-red-500');\n                        }\n                    });\n\n                    if (!valid) {\n                        e.preventDefault();\n                        \/\/ Create error notification\n                        const notification = document.createElement('div');\n                        notification.className = 'fixed top-4 right-4 bg-red-500 text-white px-6 py-4 rounded-xl shadow-premium z-50 animate-fadeIn';\n                        notification.innerHTML = `\n                            <div class=\"flex items-center space-x-3\">\n                                <i class=\"fas fa-exclamation-circle text-xl\"><\/i>\n                                <span class=\"font-semibold\">Please fill in all required fields.<\/span>\n                            <\/div>\n                        `;\n                        document.body.appendChild(notification);\n\n                        setTimeout(() => {\n                            notification.remove();\n                        }, 4000);\n                        return;\n                    }\n\n                    const actionInput = form.querySelector('input[name=\"action\"]');\n                    const dbgAction = document.getElementById('mtb-debug-action');\n                    const dbgStripeOn = document.getElementById('mtb-debug-stripe-on');\n                    if (dbgAction && actionInput) {\n                        dbgAction.textContent = actionInput.value;\n                    }\n                    if (dbgStripeOn) {\n                        dbgStripeOn.textContent = form.getAttribute('data-stripe-on') || '';\n                    }\n                    if (actionInput && actionInput.value && form.getAttribute('data-stripe-on') !== '1') {\n                        form.action = 'https:\/\/usmantravels.com\/wp-admin\/admin-post.php?action=' + encodeURIComponent(actionInput.value);\n                    }\n\n                    var paySel = form.querySelector('input[name=\"mtb_payment_choice\"]:checked');\n                    var payVal = paySel ? paySel.value : '';\n                    if (payVal === 'stripe_installment') {\n                        var instEl = document.getElementById('mtb-installment-amount');\n                        var floor = parseFloat(form.getAttribute('data-install-floor') || '100') || 100;\n                        var tot = parseFloat(form.getAttribute('data-order-total') || '0') || 0;\n                        var raw = instEl && instEl.value !== '' ? parseFloat(String(instEl.value).replace(',', '.')) : NaN;\n                        if (!isFinite(raw) || raw < floor - 0.001 || raw > tot + 0.001) {\n                            e.preventDefault();\n                            alert('Installment amount must be between \u20ac' + floor.toFixed(2) + ' and \u20ac' + tot.toFixed(2) + '.');\n                            return;\n                        }\n                    }\n\n                    \/\/ Stripe: POST to JSON endpoint \u2014 card payment only (not offline methods).\n                    if (form.getAttribute('data-stripe-on') === '1') {\n                        e.preventDefault();\n                        const submitBtn = form.querySelector('button[type=\"submit\"]');\n                        const originalContent = submitBtn.innerHTML;\n                        submitBtn.innerHTML = `\n                            <span class=\"flex items-center justify-center space-x-3\">\n                                <i class=\"fas fa-spinner fa-spin\"><\/i>\n                                <span>Redirecting to Stripe...<\/span>\n                            <\/span>\n                        `;\n                        submitBtn.disabled = true;\n                        const fd = new FormData();\n                        for (const pair of new FormData(form).entries()) {\n                            if (pair[0] === 'action') {\n                                continue;\n                            }\n                            fd.append(pair[0], pair[1]);\n                        }\n                        fd.append('mtb_stripe_json', '1');\n                        var postTarget = (typeof mtbStripeJsonPostUrl === 'string' && mtbStripeJsonPostUrl) ? mtbStripeJsonPostUrl : (function () {\n                            var u = new URL(window.location.href.split('#')[0]);\n                            u.searchParams.set('mtb_stripe_api', '1');\n                            u.searchParams.set('mtb_nocache', String(Date.now()));\n                            return u.toString();\n                        }());\n                        fetch(postTarget, {\n                            method: 'POST',\n                            body: fd,\n                            credentials: 'same-origin',\n                            headers: { 'X-Requested-With': 'XMLHttpRequest' }\n                        }).then(function (res) {\n                            return res.text().then(function (text) {\n                                var data = null;\n                                try {\n                                    data = JSON.parse(text);\n                                } catch (err) {\n                                    if (text && text.trim().charAt(0) === '<') {\n                                        throw new Error('Server returned HTML instead of JSON (full-page cache or WAF). In LiteSpeed: Excludes \u2192 add URI *mtb_stripe_api* (or disable cache for this page). In Cloudflare: bypass cache for POST or create a cache rule for URLs containing mtb_stripe_api.');\n                                    }\n                                    throw new Error(text ? text.substring(0, 240) : 'Empty response');\n                                }\n                                return { res: res, data: data };\n                            });\n                        }).then(function (o) {\n                            if (o.data && o.data.success && o.data.data && o.data.data.url) {\n                                window.location.href = o.data.data.url;\n                                return;\n                            }\n                            var inner = o.data && o.data.data ? o.data.data : o.data;\n                            var msg = (inner && inner.message) ? inner.message : 'Could not start payment';\n                            var st = (inner && inner.stage) ? (' [' + inner.stage + ']') : '';\n                            throw new Error(msg + st);\n                        }).catch(function (err) {\n                            alert(err && err.message ? err.message : 'Network error while starting payment.');\n                            submitBtn.disabled = false;\n                            submitBtn.innerHTML = originalContent;\n                        });\n                        return;\n                    }\n\n                    \/\/ Show loading state\n                    const submitBtn = form.querySelector('button[type=\"submit\"]');\n                    const originalContent = submitBtn.innerHTML;\n                    submitBtn.innerHTML = `\n                        <span class=\"flex items-center justify-center space-x-3\">\n                            <i class=\"fas fa-spinner fa-spin\"><\/i>\n                            <span>Processing Your Booking...<\/span>\n                        <\/span>\n                    `;\n                    submitBtn.disabled = true;\n\n                    \/\/ Form will submit normally to admin-post.php\n                });\n\n                \/\/ Add input animations\n                const inputs = form.querySelectorAll('input, textarea, select');\n                inputs.forEach(input => {\n                    input.addEventListener('focus', function() {\n                        this.parentElement.classList.add('transform', 'scale-105');\n                    });\n\n                    input.addEventListener('blur', function() {\n                        this.parentElement.classList.remove('transform', 'scale-105');\n                    });\n                });\n            }\n\n            \/\/ Add shake animation style\n            const style = document.createElement('style');\n            style.textContent = `\n                @keyframes shake {\n                    0%, 100% { transform: translateX(0); }\n                    25% { transform: translateX(-5px); }\n                    75% { transform: translateX(5px); }\n                }\n                .shake-animation {\n                    animation: shake 0.3s ease-in-out;\n                }\n            `;\n            document.head.appendChild(style);\n        });\n    <\/script>\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-6778","page","type-page","status-publish","hentry","travel-monster-post","no-post-thumbnail","latest_post"],"_links":{"self":[{"href":"https:\/\/usmantravels.com\/de\/wp-json\/wp\/v2\/pages\/6778","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/usmantravels.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/usmantravels.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/usmantravels.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/usmantravels.com\/de\/wp-json\/wp\/v2\/comments?post=6778"}],"version-history":[{"count":7,"href":"https:\/\/usmantravels.com\/de\/wp-json\/wp\/v2\/pages\/6778\/revisions"}],"predecessor-version":[{"id":6793,"href":"https:\/\/usmantravels.com\/de\/wp-json\/wp\/v2\/pages\/6778\/revisions\/6793"}],"wp:attachment":[{"href":"https:\/\/usmantravels.com\/de\/wp-json\/wp\/v2\/media?parent=6778"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}