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