Lak\u00f3aut\u00f3 B\u00e9rl\u00e9si \u00c1rkalkul\u00e1tor<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf\/2.5.1\/jspdf.umd.min.js\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf-autotable\/3.5.25\/jspdf.plugin.autotable.min.js\"><\/script>\n <style>\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800&display=swap');\n \n body {\n font-family: 'Inter', sans-serif;\n background-color: #f3f4f6;\n color: #1f2937;\n }\n\n \/* Egyedi g\u00f6rget\u0151s\u00e1v *\/\n ::-webkit-scrollbar {\n width: 8px;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: #d1d5db;\n border-radius: 4px;\n }\n\n .no-print {\n @media print {\n display: none;\n }\n }\n \n \/* Mod\u00e1lis st\u00edlusok *\/\n .modal {\n position: fixed;\n z-index: 1000;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.7);\n display: flex;\n justify-content: center;\n align-items: center;\n }\n <\/style>\n<\/head>\n<body class=\"p-4 md:p-8\">\n <div class=\"max-w-4xl mx-auto bg-white p-6 md:p-10 rounded-3xl shadow-2xl space-y-8\">\n \n <header class=\"text-center space-y-2\">\n <h1 class=\"text-3xl md:text-5xl font-extrabold text-[#4B5563]\">V\u00e1r r\u00e1d a lak\u00f3aut\u00f3s kaland<\/h1>\n <p class=\"text-lg text-[#6B7280]\">\n K\u00e9szen \u00e1llsz az indul\u00e1sra? Haszn\u00e1ld az azonnali \u00e1rkalkul\u00e1torunkat az \u00fat megtervez\u00e9s\u00e9hez \u00e9s kapj \u00e1tl\u00e1that\u00f3 becsl\u00e9st m\u00e1sodpercek alatt.\n <\/p>\n <\/header>\n\n <main class=\"grid grid-cols-1 gap-8 md:gap-12\">\n \n <section id=\"input-section\" class=\"space-y-6\">\n \n <div class=\"space-y-4\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">1. V\u00e1laszd ki a lak\u00f3aut\u00f3t<\/h2>\n <p class=\"text-sm text-gray-500\">A felt\u00fcntetett \u00e1rak brutt\u00f3 \u00e1rak (\u00c1FA-val).<\/p>\n <div class=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\n <label class=\"flex items-center p-4 bg-yellow-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-[#FDE047]\">\n <input type=\"radio\" name=\"van\" value=\"Duncan545\" data-low=\"75\" data-high=\"85\" data-prep=\"45\" data-clean=\"50\" data-min-low=\"3\" data-min-high=\"3\" class=\"hidden\" checked>\n <span class=\"font-semibold text-lg text-[#374151]\">Duncan545<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">75\u20ac-85\u20ac\/nap brutt\u00f3<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-yellow-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-[#FDE047]\">\n <input type=\"radio\" name=\"van\" value=\"Duncan500\" data-low=\"65\" data-high=\"75\" data-prep=\"40\" data-clean=\"45\" data-min-low=\"3\" data-min-high=\"3\" class=\"hidden\">\n <span class=\"font-semibold text-lg text-[#374151]\">Duncan500<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">65\u20ac-75\u20ac\/nap brutt\u00f3<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-yellow-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-[#FDE047]\">\n <input type=\"radio\" name=\"van\" value=\"Davis 590\" data-low=\"87\" data-high=\"96\" data-prep=\"45\" data-clean=\"50\" data-min-low=\"3\" data-min-high=\"3\" class=\"hidden\">\n <span class=\"font-semibold text-lg text-[#374151]\">Davis 590<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">87\u20ac-96\u20ac\/nap brutt\u00f3<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-yellow-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-[#FDE047]\">\n <input type=\"radio\" name=\"van\" value=\"Sunlight I68\" data-low=\"125\" data-high=\"148\" data-prep=\"60\" data-clean=\"65\" data-min-low=\"5\" data-min-high=\"7\" class=\"hidden\">\n <span class=\"font-semibold text-lg text-[#374151]\">Sunlight I68<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">125\u20ac-148\u20ac\/nap brutt\u00f3<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-yellow-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-[#FDE047]\">\n <input type=\"radio\" name=\"van\" value=\"Etrusco A7300DB\" data-low=\"110\" data-high=\"128\" data-prep=\"60\" data-clean=\"65\" data-min-low=\"5\" data-min-high=\"7\" class=\"hidden\">\n <span class=\"font-semibold text-lg text-[#374151]\">Etrusco A7300DB<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">110\u20ac-128\u20ac\/nap brutt\u00f3<\/span>\n <\/label>\n <\/div>\n <\/div>\n\n <div class=\"space-y-4\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">2. V\u00e1laszd ki a d\u00e1tumokat<\/h2>\n <p class=\"text-sm text-gray-500\">\n Duncan\/Davis: El\u0151szezon: 10.16. \u2013 05.31. | F\u0151szezon: 06.01. \u2013 10.15.\n <br>\n Sunlight\/Etrusco: El\u0151szezon: 09.16. \u2013 05.31. (Min. 5 nap) | F\u0151szezon: 06.01. \u2013 09.15. (Min. 7 nap)\n <\/p>\n <div class=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\n <div class=\"flex flex-col\">\n <label for=\"start-date\" class=\"text-sm font-medium text-gray-500 mb-1\">Kezd\u0151 d\u00e1tum<\/label>\n <input type=\"date\" id=\"start-date\" max=\"2026-12-31\" class=\"w-full p-4 border border-gray-300 rounded-xl focus:ring-2 focus:ring-[#FDE047] focus:border-transparent transition-colors\">\n <\/div>\n <div class=\"flex flex-col\">\n <label for=\"end-date\" class=\"text-sm font-medium text-gray-500 mb-1\">Befejez\u0151 d\u00e1tum<\/label>\n <input type=\"date\" id=\"end-date\" max=\"2026-12-31\" class=\"w-full p-4 border border-gray-300 rounded-xl focus:ring-2 focus:ring-[#FDE047] focus:border-transparent transition-colors\">\n <\/div>\n <\/div>\n <p class=\"text-center font-bold text-lg text-[#374151]\">\u00d6sszes nap: <span id=\"days-text\">0<\/span><\/p>\n <p id=\"days-error-message\" class=\"text-red-500 text-sm font-medium text-center hidden\"><\/p>\n <\/div>\n\n <div class=\"space-y-4\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">V\u00e1laszd ki az \u00e1tv\u00e9teli \u00e9s lead\u00e1si id\u0151pontokat<\/h2>\n <p class=\"text-sm font-medium text-gray-500\">A d\u00edjak a nap t\u00edpus\u00e1t\u00f3l (H-Szo vagy Vas\u00e1rnap\/\u00dcnnepnap) \u00e9s a v\u00e1lasztott id\u0151s\u00e1vt\u00f3l f\u00fcggenek.<\/p>\n <div class=\"space-y-4\">\n \n \n <div class=\"space-y-3 p-4 bg-white rounded-xl shadow\">\n <h3 class=\"text-lg font-semibold text-[#4B5563]\">\u00c1tv\u00e9teli id\u0151s\u00e1v:<\/h3>\n \n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"pickup-time\" value=\"H\u2013Szo 06:00\u201309:00\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 06:00\u201309:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"pickup-time\" value=\"H\u2013Szo 09:00\u201318:00\" data-fee=\"0.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 09:00\u201318:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"pickup-time\" value=\"H\u2013Szo 18:00\u201324:00\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 18:00\u201324:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"pickup-time\" value=\"Vas\u00e1rnap \u00e9s \u00dcnnepnapok\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Vas\u00e1rnap \u00e9s \u00dcnnepnapok<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"pickup-time\" value=\"M\u00e9g nem tudom\" data-fee=\"0.00\" class=\"hidden\" checked>\n <span class=\"font-medium text-[#374151]\">M\u00e9g nem tudom<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n <\/div>\n \n \n <div class=\"space-y-3 p-4 bg-white rounded-xl shadow\">\n <h3 class=\"text-lg font-semibold text-[#4B5563]\">Lead\u00e1si id\u0151s\u00e1v:<\/h3>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"dropoff-time\" value=\"H\u2013Szo 06:00\u201309:00\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 06:00\u201309:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"dropoff-time\" value=\"H\u2013Szo 09:00\u201318:00\" data-fee=\"0.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 09:00\u201318:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"dropoff-time\" value=\"H\u2013Szo 18:00\u201324:00\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 18:00\u201324:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"dropoff-time\" value=\"Vas\u00e1rnap \u00e9s \u00dcnnepnapok\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Vas\u00e1rnap \u00e9s \u00dcnnepnapok<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"dropoff-time\" value=\"M\u00e9g nem tudom\" data-fee=\"0.00\" class=\"hidden\" checked>\n <span class=\"font-medium text-[#374151]\">M\u00e9g nem tudom<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"space-y-4\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">3. Kilom\u00e9terek<\/h2>\n <p class=\"text-sm font-medium text-gray-500\">\n A b\u00e9rl\u00e9s <span id=\"included-kms\">0<\/span> km-t tartalmaz az \u00fatra (napi 100 km).\n <\/p>\n <div class=\"space-y-3\">\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"km-option\" id=\"unlimitedkm-radio\" data-cost=\"28\" data-type=\"per-day\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Korl\u00e1tlan kilom\u00e9terhaszn\u00e1lat<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">28\u20ac\/nap<\/span>\n <\/label>\n <div class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <label for=\"extra-kms-radio\" class=\"flex items-center w-full cursor-pointer\">\n <input type=\"radio\" name=\"km-option\" id=\"extra-kms-radio\" class=\"hidden\" checked>\n <span class=\"font-medium text-[#374151]\">Extra kilom\u00e9terek hozz\u00e1ad\u00e1sa (300 km-es blokk)<\/span>\n <div class=\"ml-auto flex items-center space-x-2\">\n <span class=\"text-sm text-[#4B5563]\">50\u20ac\/blokk<\/span>\n <input type=\"number\" id=\"extra-kms-count\" value=\"0\" min=\"0\" class=\"w-16 p-2 rounded-lg text-center bg-white border border-gray-300 focus:outline-none focus:ring-2 focus:ring-[#FDE047]\">\n <\/div>\n <\/label>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"space-y-4\" id=\"optional-extras-container\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">4. Opcion\u00e1lis extr\u00e1k hozz\u00e1ad\u00e1sa<\/h2>\n \n <h3 class=\"text-lg font-semibold text-[#4B5563]\">K\u00fcl\u00f6nleges csomagok<\/h3>\n <label class=\"flex items-start p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"beach-package\" data-cost=\"150\" data-type=\"flat\" class=\"mt-1 hidden\">\n <div class=\"flex flex-col flex-grow\">\n <span class=\"font-medium text-[#374151]\">Strand csomag<\/span>\n <span class=\"text-xs text-gray-500\">1x SUP, 2 strandt\u00f6r\u00f6lk\u00f6z\u0151, kemping szett, lecsavarhat\u00f3 naperny\u0151, h\u0171t\u0151t\u00e1ska j\u00e9gakkuval<\/span>\n <\/div>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac150<\/span>\n <\/label>\n <label class=\"flex items-start p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"trekking-package\" data-cost=\"150\" data-type=\"flat\" class=\"mt-1 hidden\">\n <div class=\"flex flex-col flex-grow\">\n <span class=\"font-medium text-[#374151]\">T\u00fara csomag<\/span>\n <span class=\"text-xs text-gray-500\">Tartalmazza: 2 ker\u00e9kp\u00e1r, <span id=\"trekking-details\">portabicis,<\/span> 2 aj\u00e1nd\u00e9k kulacs, 2 strandt\u00f6r\u00f6lk\u00f6z\u0151, kemping szett<\/span>\n <\/div>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac150<\/span>\n <\/label>\n\n <h3 class=\"text-lg font-semibold text-[#4B5563] mt-6\">Egyedi t\u00e9telek<\/h3>\n \n <label class=\"flex items-start p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"towel-set\" data-type=\"rent\" data-cost=\"20\" class=\"mt-1 hidden\">\n <div class=\"flex flex-col flex-grow\">\n <span class=\"font-medium text-[#374151]\">T\u00f6r\u00f6lk\u00f6z\u0151 szett (<span id=\"towel-set-desc\">1 nagy, 1 kicsi \/ f\u0151<\/span>)<\/span>\n <\/div>\n <span class=\"ml-auto text-sm text-[#4B5563]\"><span id=\"towel-set-price\">20\u20ac<\/span> \/\u00fat<\/span>\n <\/label>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"bedding-set\" data-type=\"rent\" data-cost=\"35\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">\u00c1gynem\u0171 szett<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\"><span id=\"bedding-set-price\">35\u20ac<\/span> \/\u00fat<\/span>\n <\/label>\n\n <label class=\"flex items-start p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"kitchen-set\" data-cost=\"0\" data-type=\"flat\" class=\"mt-1 hidden\">\n <div class=\"flex flex-col flex-grow\">\n <span class=\"font-medium text-[#374151]\">Konyhai k\u00e9szlet<\/span>\n <span class=\"text-xs text-gray-500\">Tartalma: ev\u0151eszk\u00f6z\u00f6k, 2 l\u00e1bas, 1 serpeny\u0151, 3 t\u00edpus\u00fa t\u00e1ny\u00e9r, poharak, konyharuha, szivacs \u00e9s mosogat\u00f3szer<\/span>\n <\/div>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n \n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"child-seat\" data-cost=\"0\" data-type=\"flat\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Gyerek\u00fcl\u00e9s<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n\n <div class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <label for=\"toilet-tablets\" class=\"flex items-center w-full cursor-pointer\">\n <input type=\"checkbox\" id=\"toilet-tablets\" data-cost=\"2\" data-type=\"piece\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Extra tabletta a k\u00e9miai WC-hez<\/span>\n <div class=\"ml-auto flex items-center space-x-2\">\n <span class=\"text-sm text-[#4B5563]\">2\u20ac\/db<\/span>\n <input type=\"number\" id=\"toilet-tablets-count\" value=\"0\" min=\"0\" class=\"w-16 p-2 rounded-lg text-center bg-white border border-gray-300 focus:outline-none focus:ring-2 focus:ring-[#FDE047] z-10\" onclick=\"event.stopPropagation()\">\n <\/div>\n <\/label>\n <\/div>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Davis 590\">\n <input type=\"checkbox\" id=\"bike-rack\" data-cost=\"15\" data-type=\"day\" data-max-cost=\"60\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Portabicicletas<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">15\u20ac \/nap (max 60\u20ac)<\/span>\n <\/label>\n\n <div class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <label for=\"e-bike\" class=\"flex items-center w-full cursor-pointer\">\n <input type=\"checkbox\" id=\"e-bike\" data-cost=\"30\" data-type=\"qty-day\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Elektromos ker\u00e9kp\u00e1r<\/span>\n <div class=\"ml-auto flex items-center space-x-2\">\n <span class=\"text-sm text-[#4B5563]\">30\u20ac \/nap<\/span>\n <input type=\"number\" id=\"e-bike-count\" value=\"1\" min=\"1\" class=\"w-16 p-2 rounded-lg text-center bg-white border border-gray-300 focus:outline-none focus:ring-2 focus:ring-[#FDE047] z-10\" onclick=\"event.stopPropagation()\">\n <\/div>\n <\/label>\n <\/div>\n\n <div class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <label for=\"bicycle\" class=\"flex items-center w-full cursor-pointer\">\n <input type=\"checkbox\" id=\"bicycle\" data-cost=\"10\" data-type=\"qty-day\" data-max-cost=\"50\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Bicikli<\/span>\n <div class=\"ml-auto flex items-center space-x-2\">\n <span class=\"text-sm text-[#4B5563]\">10\u20ac \/nap (max 50\u20ac)<\/span>\n <input type=\"number\" id=\"bicycle-count\" value=\"1\" min=\"1\" class=\"w-16 p-2 rounded-lg text-center bg-white border border-gray-300 focus:outline-none focus:ring-2 focus:ring-[#FDE047] z-10\" onclick=\"event.stopPropagation()\">\n <\/div>\n <\/label>\n <\/div>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"sup\" data-cost=\"100\" data-type=\"rent\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">SUP (Paddleboard)<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">100\u20ac \/\u00fat<\/span>\n <\/label>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Davis 590\">\n <input type=\"checkbox\" id=\"extra-gas-bottle\" data-cost=\"27.90\" data-type=\"flat\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Extra g\u00e1zpalack (2.75 kg)<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">27,90\u20ac<\/span>\n <\/label>\n \n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"camping-set\" data-cost=\"25.90\" data-type=\"flat\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Kemping szett (asztal + sz\u00e9kek)<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">25,90\u20ac<\/span>\n <\/label>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Davis 590\">\n <input type=\"checkbox\" id=\"pet-fee\" data-cost=\"100\" data-type=\"trip\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Kis\u00e1llat fel\u00e1r (max 15kg)<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">100\u20ac \/\u00fat<\/span>\n <\/label>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan500\">\n <input type=\"checkbox\" id=\"portable-toilet\" data-cost=\"40\" data-type=\"trip\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Hordozhat\u00f3 WC<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">40\u20ac \/\u00fat<\/span>\n <\/label>\n \n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Sunlight I68,Etrusco A7300DB\">\n <input type=\"checkbox\" id=\"portable-barbecue-grill\" data-cost=\"80\" data-type=\"trip\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Hordozhat\u00f3 grill<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">80\u20ac \/\u00fat<\/span>\n <\/label>\n <\/div>\n\n <div class=\"space-y-4\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">5. V\u00e1laszd ki a biztos\u00edt\u00e1si csomagot<\/h2>\n <div class=\"space-y-3\">\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" id=\"basic-coverage-label\">\n <input type=\"radio\" name=\"coverage-plan\" value=\"Alap biztos\u00edt\u00e1si csomag\" data-cost=\"0\" data-deposit=\"2000\" class=\"hidden\" checked>\n <div class=\"flex flex-col\">\n <span class=\"font-medium text-[#374151]\">Alap biztos\u00edt\u00e1si csomag<\/span>\n <span class=\"text-xs text-gray-500\">Tartalmazza a k\u00f6telez\u0151 biztos\u00edt\u00e1st.<\/span>\n <\/div>\n <div class=\"ml-auto text-right\">\n <span class=\"text-sm font-bold text-[#4B5563]\">Ingyenes<\/span>\n <span class=\"block text-xs text-gray-600 font-semibold\">2000\u20ac Let\u00e9t<\/span>\n <\/div>\n <\/label>\n <label class=\"flex items-center p-4 bg-green-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-green-300\" id=\"premium-coverage-label\">\n <input type=\"radio\" name=\"coverage-plan\" value=\"Pr\u00e9mium \u00f6nr\u00e9szcs\u00f6kkent\u0151 csomag\" data-cost=\"29.90\" data-type=\"per-day\" data-deposit=\"500\" class=\"hidden\">\n <div class=\"flex flex-col\">\n <span class=\"font-medium text-[#374151]\">Pr\u00e9mium \u00f6nr\u00e9szcs\u00f6kkent\u0151 csomag<\/span>\n <span class=\"text-xs text-gray-500\">Cs\u00f6kkenti a felel\u0151ss\u00e9gedet \u00e9s a sz\u00fcks\u00e9ges let\u00e9tet.<\/span>\n <\/div>\n <div class=\"ml-auto text-right\">\n <span class=\"text-sm font-bold text-[#4B5563]\">29,90\u20ac \/nap<\/span>\n <span class=\"block text-xs text-green-600 font-semibold\">500\u20ac Let\u00e9t<\/span>\n <\/div>\n <\/label>\n <\/div>\n <p class=\"text-center font-bold text-sm text-[#374151] pt-2\">\n Sz\u00fcks\u00e9ges biztons\u00e1gi let\u00e9t: <span id=\"deposit-text-value\" class=\"text-gray-600\">2000,00\u20ac<\/span>\n <\/p>\n <\/div>\n <\/section>\n\n <section id=\"estimate-section\" class=\"bg-gray-50 p-6 md:p-8 rounded-2xl shadow-inner space-y-6\">\n <h2 class=\"text-xl md:text-2xl font-bold text-center text-[#374151]\">Kalkul\u00e1ci\u00f3<\/h2>\n <div class=\"space-y-4\">\n <label for=\"passengers\" class=\"text-lg font-bold text-[#374151]\">Utasok sz\u00e1ma<\/label>\n <input type=\"number\" id=\"passengers\" value=\"1\" min=\"1\" class=\"w-full p-4 border border-gray-300 rounded-xl focus:ring-2 focus:ring-[#FDE047] focus:border-transparent transition-colors\">\n <\/div>\n <div id=\"breakdown\" class=\"text-sm text-[#4B5563] space-y-2\">\n <div class=\"flex justify-between\">\n <span>Furgon b\u00e9rl\u00e9s (<span id=\"selected-van-text\">Duncan545<\/span>, <span id=\"days-breakdown-text\">0<\/span> nap)<\/span>\n <span id=\"van-cost\">0.00 \u20ac<\/span>\n <\/div>\n <div class=\"flex justify-between\">\n <span>Opcion\u00e1lis extr\u00e1k<\/span>\n <span id=\"extras-cost\">0.00 \u20ac<\/span>\n <\/div>\n <\/div>\n <div class=\"border-t border-gray-200 pt-4 mt-4 text-center\">\n <div class=\"flex justify-between items-center\">\n <span class=\"text-xl md:text-2xl font-bold text-[#374151]\">Becs\u00fclt v\u00e9g\u00f6sszeg (Brutt\u00f3)<\/span>\n <span id=\"total-cost\" class=\"text-3xl md:text-4xl font-extrabold text-[#FDE047]\">0.00 \u20ac<\/span>\n <\/div>\n <\/div>\n \n <\/section>\n <\/main>\n\n <p class=\"text-sm text-center text-gray-500 mt-6 no-print\">\n K\u00fcldd el \u00e9rdekl\u0151d\u00e9sed k\u00f6telezetts\u00e9gv\u00e1llal\u00e1s n\u00e9lk\u00fcl. Felvessz\u00fck veled a kapcsolatot, \u00e9s amint visszaigazoltuk az el\u00e9rhet\u0151s\u00e9get, 30% el\u0151leget k\u00e9r\u00fcnk a foglal\u00e1s v\u00e9gleges\u00edt\u00e9s\u00e9hez.\n <\/p>\n <div class=\"flex flex-col md:flex-row justify-center items-center gap-4 mt-4 no-print\">\n <button id=\"export-pdf-btn\" class=\"px-6 py-3 bg-[#4B5563] text-white font-bold rounded-full shadow-lg transition-all duration-300 hover:bg-[#374151] hover:shadow-xl\">\n Kalkul\u00e1ci\u00f3 let\u00f6lt\u00e9se (PDF)\n <\/button>\n <button id=\"send-inquiry-btn\" class=\"px-6 py-3 bg-[#FDE047] text-[#374151] font-bold rounded-full shadow-lg transition-all duration-300 hover:bg-[#FCD34D] hover:shadow-xl\">\n \u00c9rdekl\u0151d\u00e9s bek\u00fcld\u00e9se\n <\/button>\n <\/div>\n <p id=\"status-message\" class=\"mt-4 text-center text-sm text-gray-500 hidden\"><\/p>\n <\/div>\n\n <script>\n \/\/ --- Seg\u00e9df\u00fcggv\u00e9ny a p\u00e9nznem form\u00e1z\u00e1s\u00e1hoz ---\n const formatCurrency = (amount) => {\n return amount.toFixed(2).replace('.', ',') + ' \u20ac'; \n };\n \n \/\/ --- Seg\u00e9d a szezon meghat\u00e1roz\u00e1s\u00e1hoz ---\n const isHighSeason = (date, vanName) => {\n const month = date.getMonth(); \/\/ 0-11\n const day = date.getDate(); \/\/ 1-31\n const safeVanName = vanName || \"\"; \n const isDuncanGroup = safeVanName.startsWith('Duncan') || safeVanName === 'Davis 590';\n\n if (isDuncanGroup) {\n \/\/ Duncan\/Davis szezonok (Magas: 06.01 \u2013 10.15)\n if (month > 5 && month < 9) return true; \/\/ J\u00falius, Augusztus, Szeptember\n if (month === 5 && day >= 1) return true; \/\/ J\u00fanius 1-t\u0151l\n if (month === 9 && day <= 15) return true; \/\/ Okt\u00f3ber 15-ig\n } else {\n \/\/ Sunlight\/Etrusco szezonok (Magas: 06.01 \u2013 09.15)\n if (month > 5 && month < 8) return true; \/\/ J\u00falius, Augusztus\n if (month === 5 && day >= 1) return true; \/\/ J\u00fanius 1-t\u0151l\n if (month === 8 && day <= 15) return true; \/\/ Szeptember 15-ig\n }\n return false;\n };\n\n const calculateRentalPeriod = (startDate, endDate, vanName) => {\n if (startDate.toString() === 'Invalid Date' || endDate.toString() === 'Invalid Date' || endDate < startDate) {\n return { totalDays: 0, lowDays: 0, highDays: 0 };\n }\n \n const oneDay = 1000 * 60 * 60 * 24;\n const diffDays = Math.round((endDate.getTime() - startDate.getTime()) \/ oneDay);\n const totalDays = diffDays + 1;\n\n let lowDays = 0;\n let highDays = 0;\n let currentDate = new Date(startDate);\n \n while (currentDate.getTime() <= endDate.getTime()) {\n if (isHighSeason(currentDate, vanName)) {\n highDays++;\n } else {\n lowDays++;\n }\n currentDate.setDate(currentDate.getDate() + 1);\n }\n return { totalDays, lowDays, highDays };\n };\n\n const calculateDiscountDays = (totalDays, vanName) => {\n const safeVanName = vanName || \"\";\n if (safeVanName === 'Sunlight I68' || safeVanName === 'Etrusco A7300DB') return 0;\n if (totalDays < 7) return 0;\n\n let freeDays = 0;\n if (totalDays >= 7 && totalDays < 12) freeDays = 1;\n if (totalDays >= 12) freeDays = 2;\n if (totalDays >= 21) {\n freeDays = 3; \/\/ 21. nap ingyenes\n const daysAfter21 = totalDays - 21;\n freeDays += Math.floor(daysAfter21 \/ 7); \n }\n return freeDays;\n }\n \n \/\/ --- DOM Elemek ---\n const vanRadios = document.querySelectorAll('input[name=\"van\"]');\n const startDateInput = document.getElementById('start-date');\n const endDateInput = document.getElementById('end-date');\n const daysTextSpan = document.getElementById('days-text');\n const daysBreakdownTextSpan = document.getElementById('days-breakdown-text');\n const daysErrorMessage = document.getElementById('days-error-message');\n const optionalItemsContainer = document.getElementById('optional-extras-container');\n const pickupRadios = document.querySelectorAll('input[name=\"pickup-time\"]');\n const dropoffRadios = document.querySelectorAll('input[name=\"dropoff-time\"]');\n const kmOptionRadios = document.querySelectorAll('input[name=\"km-option\"]');\n const coverageRadios = document.querySelectorAll('input[name=\"coverage-plan\"]'); \n const depositTextValueSpan = document.getElementById('deposit-text-value');\n const breakdownDiv = document.getElementById('breakdown');\n const vanCostSpan = document.getElementById('van-cost');\n const extrasCostSpan = document.getElementById('extras-cost');\n const totalCostSpan = document.getElementById('total-cost');\n const selectedVanTextSpan = document.getElementById('selected-van-text');\n const exportPdfBtn = document.getElementById('export-pdf-btn');\n const sendInquiryBtn = document.getElementById('send-inquiry-btn');\n const statusMessage = document.getElementById('status-message');\n const toiletTabletsCountInput = document.getElementById('toilet-tablets-count');\n const includedKmsSpan = document.getElementById('included-kms');\n const extraKmsCountInput = document.getElementById('extra-kms-count');\n const passengersInput = document.getElementById('passengers');\n const premiumCoverageLabel = document.getElementById('premium-coverage-label');\n const estimateSummaryDataTextarea = document.getElementById('estimate-summary-data');\n\n function updateOptionalExtras(vanName) {\n const allExtraContainers = document.querySelectorAll('#optional-extras-container > label, #optional-extras-container > div');\n const safeVanName = vanName || \"\";\n const isBigVan = safeVanName === 'Sunlight I68' || safeVanName === 'Etrusco A7300DB';\n\n const towelSetPriceSpan = document.getElementById('towel-set-price');\n const towelSetDescSpan = document.getElementById('towel-set-desc');\n const beddingSetPriceSpan = document.getElementById('bedding-set-price');\n const trekkingDetailsSpan = document.getElementById('trekking-details');\n const towelSetInput = document.getElementById('towel-set');\n const beddingSetInput = document.getElementById('bedding-set');\n\n if (isBigVan) {\n if (towelSetPriceSpan) towelSetPriceSpan.textContent = '35\u20ac';\n if (towelSetDescSpan) towelSetDescSpan.textContent = '\u00c1ltal\u00e1nos szett';\n if (towelSetInput) towelSetInput.dataset.cost = '35';\n if (beddingSetPriceSpan) beddingSetPriceSpan.textContent = '60\u20ac';\n if (beddingSetInput) beddingSetInput.dataset.cost = '60';\n if (trekkingDetailsSpan) trekkingDetailsSpan.textContent = ''; \n } else {\n if (towelSetPriceSpan) towelSetPriceSpan.textContent = '20\u20ac';\n if (towelSetDescSpan) towelSetDescSpan.textContent = '1 nagy, 1 kicsi\/f\u0151';\n if (towelSetInput) towelSetInput.dataset.cost = '20';\n if (beddingSetPriceSpan) beddingSetPriceSpan.textContent = '35\u20ac';\n if (beddingSetInput) beddingSetInput.dataset.cost = '35';\n if (trekkingDetailsSpan) trekkingDetailsSpan.textContent = 'portabicis,';\n }\n \n allExtraContainers.forEach(container => {\n const vansData = container.dataset.vans;\n if (!vansData) return;\n\n const supportedVans = vansData.split(',').map(v => v.trim());\n const isSupported = supportedVans.includes(safeVanName);\n const input = container.querySelector('input[type=\"checkbox\"]');\n\n if (isSupported) {\n container.classList.remove('hidden', 'opacity-50', 'pointer-events-none');\n } else {\n container.classList.add('hidden', 'opacity-50', 'pointer-events-none');\n if (input && input.checked) input.checked = false;\n if (input && input.id === 'toilet-tablets') toiletTabletsCountInput.value = 0;\n }\n });\n }\n\n function calculateEstimate() {\n const selectedVanRadio = document.querySelector('input[name=\"van\"]:checked');\n const vanName = selectedVanRadio ? selectedVanRadio.value : \"\";\n const startDate = new Date(startDateInput.value);\n const endDate = new Date(endDateInput.value);\n const { totalDays, lowDays, highDays } = calculateRentalPeriod(startDate, endDate, vanName);\n \n const minLowDays = parseInt(selectedVanRadio.dataset.minLow, 10);\n const minHighDays = parseInt(selectedVanRadio.dataset.minHigh, 10);\n const minRequiredDays = highDays > 0 ? minHighDays : minLowDays;\n \n if (totalDays < minRequiredDays) {\n daysErrorMessage.textContent = `A minim\u00e1lis b\u00e9rl\u00e9si id\u0151szak ${minRequiredDays} nap.`;\n daysErrorMessage.classList.remove('hidden');\n exportPdfBtn.disabled = true;\n sendInquiryBtn.disabled = true;\n return;\n } else {\n daysErrorMessage.classList.add('hidden');\n exportPdfBtn.disabled = false;\n sendInquiryBtn.disabled = false;\n }\n\n \/\/ Fedezeti korl\u00e1toz\u00e1s\n const isRestrictedVan = (vanName === 'Sunlight I68' || vanName === 'Etrusco A7300DB');\n const premiumRadio = document.querySelector('input[name=\"coverage-plan\"][value=\"Plan de reducci\u00f3n Premium\"]');\n if (isRestrictedVan) {\n if (premiumRadio && premiumRadio.checked) {\n document.querySelector('input[name=\"coverage-plan\"][value=\"Plan de cobertura b\u00e1sica\"]').checked = true;\n }\n premiumCoverageLabel.classList.add('opacity-50', 'pointer-events-none');\n } else {\n premiumCoverageLabel.classList.remove('opacity-50', 'pointer-events-none');\n }\n\n const vanLowRate = parseFloat(selectedVanRadio.dataset.low);\n const vanHighRate = parseFloat(selectedVanRadio.dataset.high);\n const baseVanCost = (lowDays * vanLowRate) + (highDays * vanHighRate);\n \n let extrasCost = 0;\n const extrasBreakdown = [];\n \n const prepFee = parseFloat(selectedVanRadio.dataset.prep);\n const cleanFee = parseFloat(selectedVanRadio.dataset.clean);\n extrasBreakdown.push({ name: `Kezel\u00e9si k\u00f6lts\u00e9g`, cost: prepFee });\n extrasBreakdown.push({ name: `Takar\u00edt\u00e1si d\u00edj`, cost: cleanFee });\n extrasCost += (prepFee + cleanFee);\n\n document.querySelectorAll('#optional-extras-container input[type=\"checkbox\"]').forEach(item => {\n if (item.checked && !item.parentElement.classList.contains('hidden')) {\n const cost = parseFloat(item.dataset.cost);\n const type = item.dataset.type;\n const maxCost = parseFloat(item.dataset.maxCost) || Infinity;\n let extraItemCost = 0;\n let itemName = item.parentElement.querySelector('span').textContent;\n\n switch(type) {\n case 'day': extraItemCost = Math.min(cost * totalDays, maxCost); break;\n case 'rent': case 'trip': case 'flat': extraItemCost = cost; break;\n case 'qty-day':\n const count = parseInt(document.getElementById(item.id + '-count').value, 10) || 1;\n extraItemCost = Math.min(cost * totalDays, maxCost) * count;\n itemName += ` (x${count})`;\n break;\n case 'piece':\n const tabletCount = parseInt(toiletTabletsCountInput.value, 10);\n extraItemCost = cost * tabletCount;\n itemName += ` (${tabletCount} db)`;\n break;\n }\n extrasCost += extraItemCost;\n extrasBreakdown.push({ name: itemName, cost: extraItemCost });\n }\n });\n\n \/\/ Id\u0151s\u00e1vok\n const pickupRadio = document.querySelector('input[name=\"pickup-time\"]:checked');\n const dropoffRadio = document.querySelector('input[name=\"dropoff-time\"]:checked');\n const pickupFee = parseFloat(pickupRadio.dataset.fee);\n const dropoffFee = parseFloat(dropoffRadio.dataset.fee);\n if (pickupFee > 0) extrasBreakdown.push({ name: `\u00c1tv\u00e9teli fel\u00e1r (${pickupRadio.value})`, cost: pickupFee });\n if (dropoffFee > 0) extrasBreakdown.push({ name: `Lead\u00e1si fel\u00e1r (${dropoffRadio.value})`, cost: dropoffFee });\n extrasCost += (pickupFee + dropoffFee);\n\n \/\/ Kilom\u00e9terek\n const selectedKmOption = document.querySelector('input[name=\"km-option\"]:checked');\n if (selectedKmOption) {\n if (selectedKmOption.id === 'extra-kms-radio') {\n const count = parseInt(extraKmsCountInput.value, 10);\n if (count > 0) {\n const cost = count * 50;\n extrasCost += cost;\n extrasBreakdown.push({ name: `Kms extra (${count} x 300km)`, cost: cost });\n }\n } else if (selectedKmOption.id === 'unlimitedkm-radio') {\n const cost = parseFloat(selectedKmOption.dataset.cost) * totalDays;\n extrasCost += cost;\n extrasBreakdown.push({ name: `Kilometraje ilimitado`, cost: cost });\n }\n }\n\n \/\/ Biztos\u00edt\u00e1s\n const coverage = document.querySelector('input[name=\"coverage-plan\"]:checked');\n const coverageCost = coverage.dataset.type === 'per-day' ? parseFloat(coverage.dataset.cost) * totalDays : 0;\n if (coverageCost > 0) extrasBreakdown.push({ name: `Cobertura: ${coverage.value}`, cost: coverageCost });\n extrasCost += coverageCost;\n\n depositTextValueSpan.textContent = formatCurrency(parseFloat(coverage.dataset.deposit));\n\n \/\/ Discount\n const freeDays = calculateDiscountDays(totalDays, vanName);\n const discountValue = freeDays > 0 ? (baseVanCost \/ totalDays) * freeDays : 0;\n if (discountValue > 0) extrasBreakdown.push({ name: `Hossz\u00fa t\u00e1v\u00fa kedvezm\u00e9ny (${freeDays} nap ingyen)`, cost: -discountValue });\n\n const finalTotal = baseVanCost + extrasCost - discountValue;\n\n \/\/ UI Update\n daysTextSpan.textContent = totalDays;\n daysBreakdownTextSpan.textContent = totalDays;\n selectedVanTextSpan.textContent = vanName;\n vanCostSpan.textContent = formatCurrency(baseVanCost);\n extrasCostSpan.textContent = formatCurrency(extrasCost - discountValue);\n totalCostSpan.textContent = formatCurrency(finalTotal);\n includedKmsSpan.textContent = totalDays * 100;\n\n let breakdownHTML = `<div class=\"flex justify-between font-semibold\"><span>Furgon b\u00e9rl\u00e9s (${vanName})<\/span><span>${formatCurrency(baseVanCost)}<\/span><\/div>`;\n extrasBreakdown.forEach(item => {\n breakdownHTML += `<div class=\"flex justify-between pl-4 text-sm ${item.cost < 0 ? 'text-green-600 font-bold' : 'text-gray-500'}\"><span>${item.name}<\/span><span>${item.cost === 0 ? 'Gratis' : formatCurrency(item.cost)}<\/span><\/div>`;\n });\n breakdownDiv.innerHTML = breakdownHTML;\n\n \/\/ Enhanced Summary for Contact Form 7 Bridge\n let summary = `--- TRIP DETAILS ---\\n`;\n summary += `Van Selected: ${vanName}\\n`;\n summary += `Dates: ${startDateInput.value} to ${endDateInput.value} (${totalDays} days)\\n`;\n summary += `Passengers: ${passengersInput.value}\\n`;\n summary += `Included Kms: ${totalDays * 100} km\\n\\n`;\n\n summary += `--- COST BREAKDOWN ---\\n`;\n summary += `Base Van Rental: ${formatCurrency(baseVanCost)}\\n`;\n \n extrasBreakdown.forEach(item => {\n summary += `${item.name}: ${item.cost === 0 ? 'Free' : formatCurrency(item.cost)}\\n`;\n });\n \n summary += `\\n--- FINAL ESTIMATE ---\\n`;\n summary += `TOTAL ESTIMATE (Brut): ${formatCurrency(finalTotal)}\\n`;\n summary += `REQUIRED DEPOSIT: ${formatCurrency(parseFloat(coverage.dataset.deposit))}\\n`;\n\n \/\/ Push to CF7 hidden field dynamically\n const cf7Textarea = document.getElementById('estimate-summary-data');\n if (cf7Textarea) {\n cf7Textarea.value = summary;\n }\n\n return { vanName, totalDays, startDate: startDateInput.value, endDate: endDateInput.value, passengers: passengersInput.value, totalCost: finalTotal, deposit: coverage.dataset.deposit, breakdown: extrasBreakdown, baseCost: baseVanCost };\n }\n\n function handleExportPdf() {\n const { jsPDF } = window.jspdf;\n const doc = new jsPDF();\n const est = calculateEstimate();\n\n \/\/ Header Section\n doc.setFontSize(22);\n doc.text(\"Lak\u00f3aut\u00f3 B\u00e9rl\u00e9si Kalkul\u00e1ci\u00f3\", 105, 20, null, null, \"center\");\n \n doc.setFontSize(10);\n doc.setFont(\"helvetica\", \"normal\");\n doc.text(`K\u00e9sz\u00fclt: ${new Date().toLocaleDateString()}`, 105, 27, null, null, \"center\");\n\n doc.setFontSize(12);\n doc.text(`B\u00e9rl\u00e9s: ${est.startDate} - ${est.endDate} (${est.totalDays} nap)`, 20, 40);\n doc.text(`T\u00edpus: ${est.vanName} | Utasok sz\u00e1ma: ${est.passengers}`, 20, 48);\n\n const rows = est.breakdown.map(item => [item.name, item.cost === 0 ? 'Ingyenes' : formatCurrency(item.cost)]);\n rows.unshift([`Alap b\u00e9rleti d\u00edj`, formatCurrency(est.baseCost)]);\n\n doc.autoTable({\n startY: 60,\n head: [['Megnevez\u00e9s', 'K\u00f6lts\u00e9g (Brutt\u00f3)']],\n body: rows,\n headStyles: { fillColor: [253, 224, 71], textColor: [55, 65, 81] },\n });\n\n const finalY = doc.lastAutoTable.finalY;\n doc.setFontSize(16);\n doc.setFont(\"helvetica\", \"bold\");\n doc.text(`Becs\u00fclt v\u00e9g\u00f6sszeg: ${formatCurrency(est.totalCost)}`, 20, finalY + 20);\n \n doc.setFontSize(12);\n doc.setFont(\"helvetica\", \"normal\");\n doc.text(`Sz\u00fcks\u00e9ges biztons\u00e1gi let\u00e9t: ${formatCurrency(parseFloat(est.deposit))}`, 20, finalY + 30);\n \n \/\/ Validity Note\n doc.setFontSize(10);\n doc.setTextColor(100);\n doc.text(\"Az \u00e1raj\u00e1nlat 30 napig \u00e9rv\u00e9nyes\", 20, finalY + 45);\n\n doc.save(\"lakoauto-kalkulacio.pdf\");\n }\n\n function handleSendInquiry() {\n calculateEstimate();\n statusMessage.textContent = 'G\u00f6rgess le az \u0171rlap kit\u00f6lt\u00e9s\u00e9hez!';\n statusMessage.classList.remove('hidden');\n const cf7Form = document.querySelector('.wpcf7'); \n if (cf7Form) {\n cf7Form.scrollIntoView({ behavior: 'smooth' });\n } else {\n window.scrollTo({ top: document.body.scrollHeight, behavior: 'smooth' });\n }\n }\n\n document.addEventListener('DOMContentLoaded', () => {\n const today = new Date();\n const tomorrow = new Date(today);\n tomorrow.setDate(tomorrow.getDate() + 3);\n startDateInput.valueAsDate = today;\n endDateInput.valueAsDate = tomorrow;\n\n updateOptionalExtras(document.querySelector('input[name=\"van\"]:checked').value);\n calculateEstimate();\n\n vanRadios.forEach(r => r.addEventListener('change', e => {\n updateOptionalExtras(e.target.value);\n calculateEstimate();\n }));\n \n [startDateInput, endDateInput, passengersInput, extraKmsCountInput, toiletTabletsCountInput].forEach(el => el.addEventListener('input', calculateEstimate));\n optionalItemsContainer.addEventListener('change', calculateEstimate);\n [...pickupRadios, ...dropoffRadios, ...kmOptionRadios, ...coverageRadios].forEach(r => r.addEventListener('change', calculateEstimate));\n \n exportPdfBtn.addEventListener('click', handleExportPdf);\n sendInquiryBtn.addEventListener('click', handleSendInquiry);\n });\n <\/script>\n<\/body>\n<\/html><\/div>\n<div class=\"wpcf7 no-js\" id=\"wpcf7-f2901-o1\" lang=\"hu-HU\" dir=\"ltr\" data-wpcf7-id=\"2901\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/hu\/wp-json\/wp\/v2\/pages\/2873#wpcf7-f2901-o1\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"Kapcsolatfelv\u00e9teli \u0171rlap\" novalidate=\"novalidate\" data-status=\"init\">\n<div style=\"display: none;\">\n<input type=\"hidden\" name=\"_wpcf7\" value=\"2901\" \/>\n<input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.0.6\" \/>\n<input type=\"hidden\" name=\"_wpcf7_locale\" value=\"hu_HU\" \/>\n<input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f2901-o1\" \/>\n<input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/>\n<input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/>\n<input type=\"hidden\" name=\"_wpcf7_recaptcha_response\" value=\"\" \/>\n<\/div>\n<div class=\"space-y-4 bg-white p-6 md:p-8 rounded-2xl shadow-md border border-gray-100 mt-8\">\n\t<h3 class=\"text-xl md:text-2xl font-bold text-gray-700 mb-4\">T\u00f6ltsd ki az \u0171rlapot\n\t<\/h3>\n\t<div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n\t\t<div class=\"flex flex-col\">\n\t\t\t<p><label class=\"text-sm font-medium text-gray-500 mb-1\">Neved *<\/label><span class=\"wpcf7-form-control-wrap\" data-name=\"your-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required w-full p-4 border border-gray-300 rounded-xl focusring-2 focusring-yellow-300 focusborder-transparent\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"text\" name=\"your-name\" \/><\/span>\n\t\t\t<\/p>\n\t\t<\/div>\n\t\t<div class=\"flex flex-col\">\n\t\t\t<p><label class=\"text-sm font-medium text-gray-500 mb-1\">E-mail c\u00edm *<\/label><span class=\"wpcf7-form-control-wrap\" data-name=\"your-email\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email w-full p-4 border border-gray-300 rounded-xl focusring-2 focusring-yellow-300 focusborder-transparent\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"email\" name=\"your-email\" \/><\/span>\n\t\t\t<\/p>\n\t\t<\/div>\n\t<\/div>\n\t<div class=\"flex flex-col\">\n\t\t<p><label class=\"text-sm font-medium text-gray-500 mb-1\">Telefonsz\u00e1m *<\/label><span class=\"wpcf7-form-control-wrap\" data-name=\"your-phone\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-tel wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-tel w-full p-4 border border-gray-300 rounded-xl focusring-2 focusring-yellow-300 focusborder-transparent\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"tel\" name=\"your-phone\" \/><\/span>\n\t\t<\/p>\n\t<\/div>\n\n \n\t<div style=\"display: none;\">\n\t\t<p><span class=\"wpcf7-form-control-wrap\" data-name=\"estimate-summary-data\"><textarea cols=\"40\" rows=\"10\" maxlength=\"2000\" class=\"wpcf7-form-control wpcf7-textarea\" id=\"estimate-summary-data\" aria-invalid=\"false\" name=\"estimate-summary-data\"><\/textarea><\/span>\n\t\t<\/p>\n\t<\/div>\n\t<div class=\"pt-4 text-center\">\n\t\t<p><input class=\"wpcf7-form-control wpcf7-submit has-spinner px-8 py-4 bg-yellow-300 text-gray-700 font-bold text-lg rounded-full shadow-lg transition-all duration-300 hoverbg-yellow-400 hovershadow-xl cursor-pointer\" type=\"submit\" value=\"\u00c9rdekl\u0151d\u00e9s k\u00fcld\u00e9se\" \/>\n\t\t<\/p>\n\t<\/div>\n<\/div><input type='hidden' class='wpcf7-pum' value='{\"closepopup\":false,\"closedelay\":0,\"openpopup\":false,\"openpopup_id\":0}' \/><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n<\/div><\/div><\/div><\/div><\/section>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"content-type":"","footnotes":""},"class_list":["post-2873","page","type-page","status-publish","hentry"],"yoast_head":"\n<title>\u00c1r kalkul\u00e1tor - solcaravan.es<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/solcaravan.es\/hu\/kalkulator\/\" \/>\n<meta property=\"og:locale\" content=\"hu_HU\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u00c1r kalkul\u00e1tor - solcaravan.es\" \/>\n<meta property=\"og:url\" content=\"https:\/\/solcaravan.es\/hu\/kalkulator\/\" \/>\n<meta property=\"og:site_name\" content=\"solcaravan.es\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/costadelsolcaravan\" \/>\n<meta property=\"article:modified_time\" content=\"2026-02-25T21:21:00+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Becs\u00fclt olvas\u00e1si id\u0151\" \/>\n\t<meta name=\"twitter:data1\" content=\"33 perc\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/solcaravan.es\/hu\/kalkulator\/\",\"url\":\"https:\/\/solcaravan.es\/hu\/kalkulator\/\",\"name\":\"\u00c1r kalkul\u00e1tor - solcaravan.es\",\"isPartOf\":{\"@id\":\"https:\/\/solcaravan.es\/hu\/#website\"},\"datePublished\":\"2026-02-22T20:23:07+00:00\",\"dateModified\":\"2026-02-25T21:21:00+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/solcaravan.es\/hu\/kalkulator\/#breadcrumb\"},\"inLanguage\":\"hu\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/solcaravan.es\/hu\/kalkulator\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/solcaravan.es\/hu\/kalkulator\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/solcaravan.es\/hu\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u00c1r kalkul\u00e1tor\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/solcaravan.es\/hu\/#website\",\"url\":\"https:\/\/solcaravan.es\/hu\/\",\"name\":\"solcaravan.es\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/solcaravan.es\/hu\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/solcaravan.es\/hu\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"hu\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/solcaravan.es\/hu\/#organization\",\"name\":\"Sol Caravan - Campervan Rental M\u00e1laga\",\"url\":\"https:\/\/solcaravan.es\/hu\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"hu\",\"@id\":\"https:\/\/solcaravan.es\/hu\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/solcaravan.es\/wp-content\/uploads\/2024\/10\/SOLCaravan-2.png\",\"contentUrl\":\"https:\/\/solcaravan.es\/wp-content\/uploads\/2024\/10\/SOLCaravan-2.png\",\"width\":500,\"height\":500,\"caption\":\"Sol Caravan - Campervan Rental M\u00e1laga\"},\"image\":{\"@id\":\"https:\/\/solcaravan.es\/hu\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/costadelsolcaravan\",\"https:\/\/www.instagram.com\/solcaravan\",\"https:\/\/www.tiktok.com\/@solcaravan.malaga\"]}]}<\/script>\n","yoast_head_json":{"title":"\u00c1r kalkul\u00e1tor - solcaravan.es","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/solcaravan.es\/hu\/kalkulator\/","og_locale":"hu_HU","og_type":"article","og_title":"\u00c1r kalkul\u00e1tor - solcaravan.es","og_url":"https:\/\/solcaravan.es\/hu\/kalkulator\/","og_site_name":"solcaravan.es","article_publisher":"https:\/\/www.facebook.com\/costadelsolcaravan","article_modified_time":"2026-02-25T21:21:00+00:00","twitter_card":"summary_large_image","twitter_misc":{"Becs\u00fclt olvas\u00e1si id\u0151":"33 perc"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/solcaravan.es\/hu\/kalkulator\/","url":"https:\/\/solcaravan.es\/hu\/kalkulator\/","name":"\u00c1r kalkul\u00e1tor - solcaravan.es","isPartOf":{"@id":"https:\/\/solcaravan.es\/hu\/#website"},"datePublished":"2026-02-22T20:23:07+00:00","dateModified":"2026-02-25T21:21:00+00:00","breadcrumb":{"@id":"https:\/\/solcaravan.es\/hu\/kalkulator\/#breadcrumb"},"inLanguage":"hu","potentialAction":[{"@type":"ReadAction","target":["https:\/\/solcaravan.es\/hu\/kalkulator\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/solcaravan.es\/hu\/kalkulator\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/solcaravan.es\/hu\/"},{"@type":"ListItem","position":2,"name":"\u00c1r kalkul\u00e1tor"}]},{"@type":"WebSite","@id":"https:\/\/solcaravan.es\/hu\/#website","url":"https:\/\/solcaravan.es\/hu\/","name":"solcaravan.es","description":"","publisher":{"@id":"https:\/\/solcaravan.es\/hu\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/solcaravan.es\/hu\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"hu"},{"@type":"Organization","@id":"https:\/\/solcaravan.es\/hu\/#organization","name":"Sol Caravan - Campervan Rental M\u00e1laga","url":"https:\/\/solcaravan.es\/hu\/","logo":{"@type":"ImageObject","inLanguage":"hu","@id":"https:\/\/solcaravan.es\/hu\/#\/schema\/logo\/image\/","url":"https:\/\/solcaravan.es\/wp-content\/uploads\/2024\/10\/SOLCaravan-2.png","contentUrl":"https:\/\/solcaravan.es\/wp-content\/uploads\/2024\/10\/SOLCaravan-2.png","width":500,"height":500,"caption":"Sol Caravan - Campervan Rental M\u00e1laga"},"image":{"@id":"https:\/\/solcaravan.es\/hu\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/costadelsolcaravan","https:\/\/www.instagram.com\/solcaravan","https:\/\/www.tiktok.com\/@solcaravan.malaga"]}]}},"_links":{"self":[{"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/pages\/2873"}],"collection":[{"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/comments?post=2873"}],"version-history":[{"count":6,"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/pages\/2873\/revisions"}],"predecessor-version":[{"id":2903,"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/pages\/2873\/revisions\/2903"}],"wp:attachment":[{"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/media?parent=2873"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

I am raw html block.Click edit button to change this html<\/p><\/div>

\n\n\n \n \n Lak\u00f3aut\u00f3 B\u00e9rl\u00e9si \u00c1rkalkul\u00e1tor<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf\/2.5.1\/jspdf.umd.min.js\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jspdf-autotable\/3.5.25\/jspdf.plugin.autotable.min.js\"><\/script>\n <style>\n @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800&display=swap');\n \n body {\n font-family: 'Inter', sans-serif;\n background-color: #f3f4f6;\n color: #1f2937;\n }\n\n \/* Egyedi g\u00f6rget\u0151s\u00e1v *\/\n ::-webkit-scrollbar {\n width: 8px;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: #d1d5db;\n border-radius: 4px;\n }\n\n .no-print {\n @media print {\n display: none;\n }\n }\n \n \/* Mod\u00e1lis st\u00edlusok *\/\n .modal {\n position: fixed;\n z-index: 1000;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.7);\n display: flex;\n justify-content: center;\n align-items: center;\n }\n <\/style>\n<\/head>\n<body class=\"p-4 md:p-8\">\n <div class=\"max-w-4xl mx-auto bg-white p-6 md:p-10 rounded-3xl shadow-2xl space-y-8\">\n \n <header class=\"text-center space-y-2\">\n <h1 class=\"text-3xl md:text-5xl font-extrabold text-[#4B5563]\">V\u00e1r r\u00e1d a lak\u00f3aut\u00f3s kaland<\/h1>\n <p class=\"text-lg text-[#6B7280]\">\n K\u00e9szen \u00e1llsz az indul\u00e1sra? Haszn\u00e1ld az azonnali \u00e1rkalkul\u00e1torunkat az \u00fat megtervez\u00e9s\u00e9hez \u00e9s kapj \u00e1tl\u00e1that\u00f3 becsl\u00e9st m\u00e1sodpercek alatt.\n <\/p>\n <\/header>\n\n <main class=\"grid grid-cols-1 gap-8 md:gap-12\">\n \n <section id=\"input-section\" class=\"space-y-6\">\n \n <div class=\"space-y-4\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">1. V\u00e1laszd ki a lak\u00f3aut\u00f3t<\/h2>\n <p class=\"text-sm text-gray-500\">A felt\u00fcntetett \u00e1rak brutt\u00f3 \u00e1rak (\u00c1FA-val).<\/p>\n <div class=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\n <label class=\"flex items-center p-4 bg-yellow-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-[#FDE047]\">\n <input type=\"radio\" name=\"van\" value=\"Duncan545\" data-low=\"75\" data-high=\"85\" data-prep=\"45\" data-clean=\"50\" data-min-low=\"3\" data-min-high=\"3\" class=\"hidden\" checked>\n <span class=\"font-semibold text-lg text-[#374151]\">Duncan545<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">75\u20ac-85\u20ac\/nap brutt\u00f3<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-yellow-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-[#FDE047]\">\n <input type=\"radio\" name=\"van\" value=\"Duncan500\" data-low=\"65\" data-high=\"75\" data-prep=\"40\" data-clean=\"45\" data-min-low=\"3\" data-min-high=\"3\" class=\"hidden\">\n <span class=\"font-semibold text-lg text-[#374151]\">Duncan500<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">65\u20ac-75\u20ac\/nap brutt\u00f3<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-yellow-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-[#FDE047]\">\n <input type=\"radio\" name=\"van\" value=\"Davis 590\" data-low=\"87\" data-high=\"96\" data-prep=\"45\" data-clean=\"50\" data-min-low=\"3\" data-min-high=\"3\" class=\"hidden\">\n <span class=\"font-semibold text-lg text-[#374151]\">Davis 590<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">87\u20ac-96\u20ac\/nap brutt\u00f3<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-yellow-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-[#FDE047]\">\n <input type=\"radio\" name=\"van\" value=\"Sunlight I68\" data-low=\"125\" data-high=\"148\" data-prep=\"60\" data-clean=\"65\" data-min-low=\"5\" data-min-high=\"7\" class=\"hidden\">\n <span class=\"font-semibold text-lg text-[#374151]\">Sunlight I68<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">125\u20ac-148\u20ac\/nap brutt\u00f3<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-yellow-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-[#FDE047]\">\n <input type=\"radio\" name=\"van\" value=\"Etrusco A7300DB\" data-low=\"110\" data-high=\"128\" data-prep=\"60\" data-clean=\"65\" data-min-low=\"5\" data-min-high=\"7\" class=\"hidden\">\n <span class=\"font-semibold text-lg text-[#374151]\">Etrusco A7300DB<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">110\u20ac-128\u20ac\/nap brutt\u00f3<\/span>\n <\/label>\n <\/div>\n <\/div>\n\n <div class=\"space-y-4\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">2. V\u00e1laszd ki a d\u00e1tumokat<\/h2>\n <p class=\"text-sm text-gray-500\">\n Duncan\/Davis: El\u0151szezon: 10.16. \u2013 05.31. | F\u0151szezon: 06.01. \u2013 10.15.\n <br>\n Sunlight\/Etrusco: El\u0151szezon: 09.16. \u2013 05.31. (Min. 5 nap) | F\u0151szezon: 06.01. \u2013 09.15. (Min. 7 nap)\n <\/p>\n <div class=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\n <div class=\"flex flex-col\">\n <label for=\"start-date\" class=\"text-sm font-medium text-gray-500 mb-1\">Kezd\u0151 d\u00e1tum<\/label>\n <input type=\"date\" id=\"start-date\" max=\"2026-12-31\" class=\"w-full p-4 border border-gray-300 rounded-xl focus:ring-2 focus:ring-[#FDE047] focus:border-transparent transition-colors\">\n <\/div>\n <div class=\"flex flex-col\">\n <label for=\"end-date\" class=\"text-sm font-medium text-gray-500 mb-1\">Befejez\u0151 d\u00e1tum<\/label>\n <input type=\"date\" id=\"end-date\" max=\"2026-12-31\" class=\"w-full p-4 border border-gray-300 rounded-xl focus:ring-2 focus:ring-[#FDE047] focus:border-transparent transition-colors\">\n <\/div>\n <\/div>\n <p class=\"text-center font-bold text-lg text-[#374151]\">\u00d6sszes nap: <span id=\"days-text\">0<\/span><\/p>\n <p id=\"days-error-message\" class=\"text-red-500 text-sm font-medium text-center hidden\"><\/p>\n <\/div>\n\n <div class=\"space-y-4\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">V\u00e1laszd ki az \u00e1tv\u00e9teli \u00e9s lead\u00e1si id\u0151pontokat<\/h2>\n <p class=\"text-sm font-medium text-gray-500\">A d\u00edjak a nap t\u00edpus\u00e1t\u00f3l (H-Szo vagy Vas\u00e1rnap\/\u00dcnnepnap) \u00e9s a v\u00e1lasztott id\u0151s\u00e1vt\u00f3l f\u00fcggenek.<\/p>\n <div class=\"space-y-4\">\n \n \n <div class=\"space-y-3 p-4 bg-white rounded-xl shadow\">\n <h3 class=\"text-lg font-semibold text-[#4B5563]\">\u00c1tv\u00e9teli id\u0151s\u00e1v:<\/h3>\n \n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"pickup-time\" value=\"H\u2013Szo 06:00\u201309:00\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 06:00\u201309:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"pickup-time\" value=\"H\u2013Szo 09:00\u201318:00\" data-fee=\"0.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 09:00\u201318:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"pickup-time\" value=\"H\u2013Szo 18:00\u201324:00\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 18:00\u201324:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"pickup-time\" value=\"Vas\u00e1rnap \u00e9s \u00dcnnepnapok\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Vas\u00e1rnap \u00e9s \u00dcnnepnapok<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"pickup-time\" value=\"M\u00e9g nem tudom\" data-fee=\"0.00\" class=\"hidden\" checked>\n <span class=\"font-medium text-[#374151]\">M\u00e9g nem tudom<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n <\/div>\n \n \n <div class=\"space-y-3 p-4 bg-white rounded-xl shadow\">\n <h3 class=\"text-lg font-semibold text-[#4B5563]\">Lead\u00e1si id\u0151s\u00e1v:<\/h3>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"dropoff-time\" value=\"H\u2013Szo 06:00\u201309:00\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 06:00\u201309:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"dropoff-time\" value=\"H\u2013Szo 09:00\u201318:00\" data-fee=\"0.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 09:00\u201318:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"dropoff-time\" value=\"H\u2013Szo 18:00\u201324:00\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">H \u2013 Szo 18:00\u201324:00<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"dropoff-time\" value=\"Vas\u00e1rnap \u00e9s \u00dcnnepnapok\" data-fee=\"90.00\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Vas\u00e1rnap \u00e9s \u00dcnnepnapok<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac90<\/span>\n <\/label>\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"dropoff-time\" value=\"M\u00e9g nem tudom\" data-fee=\"0.00\" class=\"hidden\" checked>\n <span class=\"font-medium text-[#374151]\">M\u00e9g nem tudom<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"space-y-4\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">3. Kilom\u00e9terek<\/h2>\n <p class=\"text-sm font-medium text-gray-500\">\n A b\u00e9rl\u00e9s <span id=\"included-kms\">0<\/span> km-t tartalmaz az \u00fatra (napi 100 km).\n <\/p>\n <div class=\"space-y-3\">\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <input type=\"radio\" name=\"km-option\" id=\"unlimitedkm-radio\" data-cost=\"28\" data-type=\"per-day\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Korl\u00e1tlan kilom\u00e9terhaszn\u00e1lat<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">28\u20ac\/nap<\/span>\n <\/label>\n <div class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\">\n <label for=\"extra-kms-radio\" class=\"flex items-center w-full cursor-pointer\">\n <input type=\"radio\" name=\"km-option\" id=\"extra-kms-radio\" class=\"hidden\" checked>\n <span class=\"font-medium text-[#374151]\">Extra kilom\u00e9terek hozz\u00e1ad\u00e1sa (300 km-es blokk)<\/span>\n <div class=\"ml-auto flex items-center space-x-2\">\n <span class=\"text-sm text-[#4B5563]\">50\u20ac\/blokk<\/span>\n <input type=\"number\" id=\"extra-kms-count\" value=\"0\" min=\"0\" class=\"w-16 p-2 rounded-lg text-center bg-white border border-gray-300 focus:outline-none focus:ring-2 focus:ring-[#FDE047]\">\n <\/div>\n <\/label>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"space-y-4\" id=\"optional-extras-container\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">4. Opcion\u00e1lis extr\u00e1k hozz\u00e1ad\u00e1sa<\/h2>\n \n <h3 class=\"text-lg font-semibold text-[#4B5563]\">K\u00fcl\u00f6nleges csomagok<\/h3>\n <label class=\"flex items-start p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"beach-package\" data-cost=\"150\" data-type=\"flat\" class=\"mt-1 hidden\">\n <div class=\"flex flex-col flex-grow\">\n <span class=\"font-medium text-[#374151]\">Strand csomag<\/span>\n <span class=\"text-xs text-gray-500\">1x SUP, 2 strandt\u00f6r\u00f6lk\u00f6z\u0151, kemping szett, lecsavarhat\u00f3 naperny\u0151, h\u0171t\u0151t\u00e1ska j\u00e9gakkuval<\/span>\n <\/div>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac150<\/span>\n <\/label>\n <label class=\"flex items-start p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"trekking-package\" data-cost=\"150\" data-type=\"flat\" class=\"mt-1 hidden\">\n <div class=\"flex flex-col flex-grow\">\n <span class=\"font-medium text-[#374151]\">T\u00fara csomag<\/span>\n <span class=\"text-xs text-gray-500\">Tartalmazza: 2 ker\u00e9kp\u00e1r, <span id=\"trekking-details\">portabicis,<\/span> 2 aj\u00e1nd\u00e9k kulacs, 2 strandt\u00f6r\u00f6lk\u00f6z\u0151, kemping szett<\/span>\n <\/div>\n <span class=\"ml-auto text-sm text-[#4B5563]\">\u20ac150<\/span>\n <\/label>\n\n <h3 class=\"text-lg font-semibold text-[#4B5563] mt-6\">Egyedi t\u00e9telek<\/h3>\n \n <label class=\"flex items-start p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"towel-set\" data-type=\"rent\" data-cost=\"20\" class=\"mt-1 hidden\">\n <div class=\"flex flex-col flex-grow\">\n <span class=\"font-medium text-[#374151]\">T\u00f6r\u00f6lk\u00f6z\u0151 szett (<span id=\"towel-set-desc\">1 nagy, 1 kicsi \/ f\u0151<\/span>)<\/span>\n <\/div>\n <span class=\"ml-auto text-sm text-[#4B5563]\"><span id=\"towel-set-price\">20\u20ac<\/span> \/\u00fat<\/span>\n <\/label>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"bedding-set\" data-type=\"rent\" data-cost=\"35\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">\u00c1gynem\u0171 szett<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\"><span id=\"bedding-set-price\">35\u20ac<\/span> \/\u00fat<\/span>\n <\/label>\n\n <label class=\"flex items-start p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"kitchen-set\" data-cost=\"0\" data-type=\"flat\" class=\"mt-1 hidden\">\n <div class=\"flex flex-col flex-grow\">\n <span class=\"font-medium text-[#374151]\">Konyhai k\u00e9szlet<\/span>\n <span class=\"text-xs text-gray-500\">Tartalma: ev\u0151eszk\u00f6z\u00f6k, 2 l\u00e1bas, 1 serpeny\u0151, 3 t\u00edpus\u00fa t\u00e1ny\u00e9r, poharak, konyharuha, szivacs \u00e9s mosogat\u00f3szer<\/span>\n <\/div>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n \n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"child-seat\" data-cost=\"0\" data-type=\"flat\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Gyerek\u00fcl\u00e9s<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">Ingyenes<\/span>\n <\/label>\n\n <div class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <label for=\"toilet-tablets\" class=\"flex items-center w-full cursor-pointer\">\n <input type=\"checkbox\" id=\"toilet-tablets\" data-cost=\"2\" data-type=\"piece\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Extra tabletta a k\u00e9miai WC-hez<\/span>\n <div class=\"ml-auto flex items-center space-x-2\">\n <span class=\"text-sm text-[#4B5563]\">2\u20ac\/db<\/span>\n <input type=\"number\" id=\"toilet-tablets-count\" value=\"0\" min=\"0\" class=\"w-16 p-2 rounded-lg text-center bg-white border border-gray-300 focus:outline-none focus:ring-2 focus:ring-[#FDE047] z-10\" onclick=\"event.stopPropagation()\">\n <\/div>\n <\/label>\n <\/div>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Davis 590\">\n <input type=\"checkbox\" id=\"bike-rack\" data-cost=\"15\" data-type=\"day\" data-max-cost=\"60\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Portabicicletas<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">15\u20ac \/nap (max 60\u20ac)<\/span>\n <\/label>\n\n <div class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <label for=\"e-bike\" class=\"flex items-center w-full cursor-pointer\">\n <input type=\"checkbox\" id=\"e-bike\" data-cost=\"30\" data-type=\"qty-day\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Elektromos ker\u00e9kp\u00e1r<\/span>\n <div class=\"ml-auto flex items-center space-x-2\">\n <span class=\"text-sm text-[#4B5563]\">30\u20ac \/nap<\/span>\n <input type=\"number\" id=\"e-bike-count\" value=\"1\" min=\"1\" class=\"w-16 p-2 rounded-lg text-center bg-white border border-gray-300 focus:outline-none focus:ring-2 focus:ring-[#FDE047] z-10\" onclick=\"event.stopPropagation()\">\n <\/div>\n <\/label>\n <\/div>\n\n <div class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <label for=\"bicycle\" class=\"flex items-center w-full cursor-pointer\">\n <input type=\"checkbox\" id=\"bicycle\" data-cost=\"10\" data-type=\"qty-day\" data-max-cost=\"50\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Bicikli<\/span>\n <div class=\"ml-auto flex items-center space-x-2\">\n <span class=\"text-sm text-[#4B5563]\">10\u20ac \/nap (max 50\u20ac)<\/span>\n <input type=\"number\" id=\"bicycle-count\" value=\"1\" min=\"1\" class=\"w-16 p-2 rounded-lg text-center bg-white border border-gray-300 focus:outline-none focus:ring-2 focus:ring-[#FDE047] z-10\" onclick=\"event.stopPropagation()\">\n <\/div>\n <\/label>\n <\/div>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"sup\" data-cost=\"100\" data-type=\"rent\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">SUP (Paddleboard)<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">100\u20ac \/\u00fat<\/span>\n <\/label>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Davis 590\">\n <input type=\"checkbox\" id=\"extra-gas-bottle\" data-cost=\"27.90\" data-type=\"flat\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Extra g\u00e1zpalack (2.75 kg)<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">27,90\u20ac<\/span>\n <\/label>\n \n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Sunlight I68,Etrusco A7300DB,Davis 590\">\n <input type=\"checkbox\" id=\"camping-set\" data-cost=\"25.90\" data-type=\"flat\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Kemping szett (asztal + sz\u00e9kek)<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">25,90\u20ac<\/span>\n <\/label>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan545,Duncan500,Davis 590\">\n <input type=\"checkbox\" id=\"pet-fee\" data-cost=\"100\" data-type=\"trip\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Kis\u00e1llat fel\u00e1r (max 15kg)<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">100\u20ac \/\u00fat<\/span>\n <\/label>\n\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Duncan500\">\n <input type=\"checkbox\" id=\"portable-toilet\" data-cost=\"40\" data-type=\"trip\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Hordozhat\u00f3 WC<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">40\u20ac \/\u00fat<\/span>\n <\/label>\n \n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" data-vans=\"Sunlight I68,Etrusco A7300DB\">\n <input type=\"checkbox\" id=\"portable-barbecue-grill\" data-cost=\"80\" data-type=\"trip\" class=\"hidden\">\n <span class=\"font-medium text-[#374151]\">Hordozhat\u00f3 grill<\/span>\n <span class=\"ml-auto text-sm text-[#4B5563]\">80\u20ac \/\u00fat<\/span>\n <\/label>\n <\/div>\n\n <div class=\"space-y-4\">\n <h2 class=\"text-xl md:text-2xl font-bold text-[#374151]\">5. V\u00e1laszd ki a biztos\u00edt\u00e1si csomagot<\/h2>\n <div class=\"space-y-3\">\n <label class=\"flex items-center p-4 bg-gray-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-2 has-[:checked]:ring-gray-300\" id=\"basic-coverage-label\">\n <input type=\"radio\" name=\"coverage-plan\" value=\"Alap biztos\u00edt\u00e1si csomag\" data-cost=\"0\" data-deposit=\"2000\" class=\"hidden\" checked>\n <div class=\"flex flex-col\">\n <span class=\"font-medium text-[#374151]\">Alap biztos\u00edt\u00e1si csomag<\/span>\n <span class=\"text-xs text-gray-500\">Tartalmazza a k\u00f6telez\u0151 biztos\u00edt\u00e1st.<\/span>\n <\/div>\n <div class=\"ml-auto text-right\">\n <span class=\"text-sm font-bold text-[#4B5563]\">Ingyenes<\/span>\n <span class=\"block text-xs text-gray-600 font-semibold\">2000\u20ac Let\u00e9t<\/span>\n <\/div>\n <\/label>\n <label class=\"flex items-center p-4 bg-green-50 rounded-xl cursor-pointer shadow-md transition-all duration-300 hover:shadow-xl has-[:checked]:ring-4 has-[:checked]:ring-green-300\" id=\"premium-coverage-label\">\n <input type=\"radio\" name=\"coverage-plan\" value=\"Pr\u00e9mium \u00f6nr\u00e9szcs\u00f6kkent\u0151 csomag\" data-cost=\"29.90\" data-type=\"per-day\" data-deposit=\"500\" class=\"hidden\">\n <div class=\"flex flex-col\">\n <span class=\"font-medium text-[#374151]\">Pr\u00e9mium \u00f6nr\u00e9szcs\u00f6kkent\u0151 csomag<\/span>\n <span class=\"text-xs text-gray-500\">Cs\u00f6kkenti a felel\u0151ss\u00e9gedet \u00e9s a sz\u00fcks\u00e9ges let\u00e9tet.<\/span>\n <\/div>\n <div class=\"ml-auto text-right\">\n <span class=\"text-sm font-bold text-[#4B5563]\">29,90\u20ac \/nap<\/span>\n <span class=\"block text-xs text-green-600 font-semibold\">500\u20ac Let\u00e9t<\/span>\n <\/div>\n <\/label>\n <\/div>\n <p class=\"text-center font-bold text-sm text-[#374151] pt-2\">\n Sz\u00fcks\u00e9ges biztons\u00e1gi let\u00e9t: <span id=\"deposit-text-value\" class=\"text-gray-600\">2000,00\u20ac<\/span>\n <\/p>\n <\/div>\n <\/section>\n\n <section id=\"estimate-section\" class=\"bg-gray-50 p-6 md:p-8 rounded-2xl shadow-inner space-y-6\">\n <h2 class=\"text-xl md:text-2xl font-bold text-center text-[#374151]\">Kalkul\u00e1ci\u00f3<\/h2>\n <div class=\"space-y-4\">\n <label for=\"passengers\" class=\"text-lg font-bold text-[#374151]\">Utasok sz\u00e1ma<\/label>\n <input type=\"number\" id=\"passengers\" value=\"1\" min=\"1\" class=\"w-full p-4 border border-gray-300 rounded-xl focus:ring-2 focus:ring-[#FDE047] focus:border-transparent transition-colors\">\n <\/div>\n <div id=\"breakdown\" class=\"text-sm text-[#4B5563] space-y-2\">\n <div class=\"flex justify-between\">\n <span>Furgon b\u00e9rl\u00e9s (<span id=\"selected-van-text\">Duncan545<\/span>, <span id=\"days-breakdown-text\">0<\/span> nap)<\/span>\n <span id=\"van-cost\">0.00 \u20ac<\/span>\n <\/div>\n <div class=\"flex justify-between\">\n <span>Opcion\u00e1lis extr\u00e1k<\/span>\n <span id=\"extras-cost\">0.00 \u20ac<\/span>\n <\/div>\n <\/div>\n <div class=\"border-t border-gray-200 pt-4 mt-4 text-center\">\n <div class=\"flex justify-between items-center\">\n <span class=\"text-xl md:text-2xl font-bold text-[#374151]\">Becs\u00fclt v\u00e9g\u00f6sszeg (Brutt\u00f3)<\/span>\n <span id=\"total-cost\" class=\"text-3xl md:text-4xl font-extrabold text-[#FDE047]\">0.00 \u20ac<\/span>\n <\/div>\n <\/div>\n \n <\/section>\n <\/main>\n\n <p class=\"text-sm text-center text-gray-500 mt-6 no-print\">\n K\u00fcldd el \u00e9rdekl\u0151d\u00e9sed k\u00f6telezetts\u00e9gv\u00e1llal\u00e1s n\u00e9lk\u00fcl. Felvessz\u00fck veled a kapcsolatot, \u00e9s amint visszaigazoltuk az el\u00e9rhet\u0151s\u00e9get, 30% el\u0151leget k\u00e9r\u00fcnk a foglal\u00e1s v\u00e9gleges\u00edt\u00e9s\u00e9hez.\n <\/p>\n <div class=\"flex flex-col md:flex-row justify-center items-center gap-4 mt-4 no-print\">\n <button id=\"export-pdf-btn\" class=\"px-6 py-3 bg-[#4B5563] text-white font-bold rounded-full shadow-lg transition-all duration-300 hover:bg-[#374151] hover:shadow-xl\">\n Kalkul\u00e1ci\u00f3 let\u00f6lt\u00e9se (PDF)\n <\/button>\n <button id=\"send-inquiry-btn\" class=\"px-6 py-3 bg-[#FDE047] text-[#374151] font-bold rounded-full shadow-lg transition-all duration-300 hover:bg-[#FCD34D] hover:shadow-xl\">\n \u00c9rdekl\u0151d\u00e9s bek\u00fcld\u00e9se\n <\/button>\n <\/div>\n <p id=\"status-message\" class=\"mt-4 text-center text-sm text-gray-500 hidden\"><\/p>\n <\/div>\n\n <script>\n \/\/ --- Seg\u00e9df\u00fcggv\u00e9ny a p\u00e9nznem form\u00e1z\u00e1s\u00e1hoz ---\n const formatCurrency = (amount) => {\n return amount.toFixed(2).replace('.', ',') + ' \u20ac'; \n };\n \n \/\/ --- Seg\u00e9d a szezon meghat\u00e1roz\u00e1s\u00e1hoz ---\n const isHighSeason = (date, vanName) => {\n const month = date.getMonth(); \/\/ 0-11\n const day = date.getDate(); \/\/ 1-31\n const safeVanName = vanName || \"\"; \n const isDuncanGroup = safeVanName.startsWith('Duncan') || safeVanName === 'Davis 590';\n\n if (isDuncanGroup) {\n \/\/ Duncan\/Davis szezonok (Magas: 06.01 \u2013 10.15)\n if (month > 5 && month < 9) return true; \/\/ J\u00falius, Augusztus, Szeptember\n if (month === 5 && day >= 1) return true; \/\/ J\u00fanius 1-t\u0151l\n if (month === 9 && day <= 15) return true; \/\/ Okt\u00f3ber 15-ig\n } else {\n \/\/ Sunlight\/Etrusco szezonok (Magas: 06.01 \u2013 09.15)\n if (month > 5 && month < 8) return true; \/\/ J\u00falius, Augusztus\n if (month === 5 && day >= 1) return true; \/\/ J\u00fanius 1-t\u0151l\n if (month === 8 && day <= 15) return true; \/\/ Szeptember 15-ig\n }\n return false;\n };\n\n const calculateRentalPeriod = (startDate, endDate, vanName) => {\n if (startDate.toString() === 'Invalid Date' || endDate.toString() === 'Invalid Date' || endDate < startDate) {\n return { totalDays: 0, lowDays: 0, highDays: 0 };\n }\n \n const oneDay = 1000 * 60 * 60 * 24;\n const diffDays = Math.round((endDate.getTime() - startDate.getTime()) \/ oneDay);\n const totalDays = diffDays + 1;\n\n let lowDays = 0;\n let highDays = 0;\n let currentDate = new Date(startDate);\n \n while (currentDate.getTime() <= endDate.getTime()) {\n if (isHighSeason(currentDate, vanName)) {\n highDays++;\n } else {\n lowDays++;\n }\n currentDate.setDate(currentDate.getDate() + 1);\n }\n return { totalDays, lowDays, highDays };\n };\n\n const calculateDiscountDays = (totalDays, vanName) => {\n const safeVanName = vanName || \"\";\n if (safeVanName === 'Sunlight I68' || safeVanName === 'Etrusco A7300DB') return 0;\n if (totalDays < 7) return 0;\n\n let freeDays = 0;\n if (totalDays >= 7 && totalDays < 12) freeDays = 1;\n if (totalDays >= 12) freeDays = 2;\n if (totalDays >= 21) {\n freeDays = 3; \/\/ 21. nap ingyenes\n const daysAfter21 = totalDays - 21;\n freeDays += Math.floor(daysAfter21 \/ 7); \n }\n return freeDays;\n }\n \n \/\/ --- DOM Elemek ---\n const vanRadios = document.querySelectorAll('input[name=\"van\"]');\n const startDateInput = document.getElementById('start-date');\n const endDateInput = document.getElementById('end-date');\n const daysTextSpan = document.getElementById('days-text');\n const daysBreakdownTextSpan = document.getElementById('days-breakdown-text');\n const daysErrorMessage = document.getElementById('days-error-message');\n const optionalItemsContainer = document.getElementById('optional-extras-container');\n const pickupRadios = document.querySelectorAll('input[name=\"pickup-time\"]');\n const dropoffRadios = document.querySelectorAll('input[name=\"dropoff-time\"]');\n const kmOptionRadios = document.querySelectorAll('input[name=\"km-option\"]');\n const coverageRadios = document.querySelectorAll('input[name=\"coverage-plan\"]'); \n const depositTextValueSpan = document.getElementById('deposit-text-value');\n const breakdownDiv = document.getElementById('breakdown');\n const vanCostSpan = document.getElementById('van-cost');\n const extrasCostSpan = document.getElementById('extras-cost');\n const totalCostSpan = document.getElementById('total-cost');\n const selectedVanTextSpan = document.getElementById('selected-van-text');\n const exportPdfBtn = document.getElementById('export-pdf-btn');\n const sendInquiryBtn = document.getElementById('send-inquiry-btn');\n const statusMessage = document.getElementById('status-message');\n const toiletTabletsCountInput = document.getElementById('toilet-tablets-count');\n const includedKmsSpan = document.getElementById('included-kms');\n const extraKmsCountInput = document.getElementById('extra-kms-count');\n const passengersInput = document.getElementById('passengers');\n const premiumCoverageLabel = document.getElementById('premium-coverage-label');\n const estimateSummaryDataTextarea = document.getElementById('estimate-summary-data');\n\n function updateOptionalExtras(vanName) {\n const allExtraContainers = document.querySelectorAll('#optional-extras-container > label, #optional-extras-container > div');\n const safeVanName = vanName || \"\";\n const isBigVan = safeVanName === 'Sunlight I68' || safeVanName === 'Etrusco A7300DB';\n\n const towelSetPriceSpan = document.getElementById('towel-set-price');\n const towelSetDescSpan = document.getElementById('towel-set-desc');\n const beddingSetPriceSpan = document.getElementById('bedding-set-price');\n const trekkingDetailsSpan = document.getElementById('trekking-details');\n const towelSetInput = document.getElementById('towel-set');\n const beddingSetInput = document.getElementById('bedding-set');\n\n if (isBigVan) {\n if (towelSetPriceSpan) towelSetPriceSpan.textContent = '35\u20ac';\n if (towelSetDescSpan) towelSetDescSpan.textContent = '\u00c1ltal\u00e1nos szett';\n if (towelSetInput) towelSetInput.dataset.cost = '35';\n if (beddingSetPriceSpan) beddingSetPriceSpan.textContent = '60\u20ac';\n if (beddingSetInput) beddingSetInput.dataset.cost = '60';\n if (trekkingDetailsSpan) trekkingDetailsSpan.textContent = ''; \n } else {\n if (towelSetPriceSpan) towelSetPriceSpan.textContent = '20\u20ac';\n if (towelSetDescSpan) towelSetDescSpan.textContent = '1 nagy, 1 kicsi\/f\u0151';\n if (towelSetInput) towelSetInput.dataset.cost = '20';\n if (beddingSetPriceSpan) beddingSetPriceSpan.textContent = '35\u20ac';\n if (beddingSetInput) beddingSetInput.dataset.cost = '35';\n if (trekkingDetailsSpan) trekkingDetailsSpan.textContent = 'portabicis,';\n }\n \n allExtraContainers.forEach(container => {\n const vansData = container.dataset.vans;\n if (!vansData) return;\n\n const supportedVans = vansData.split(',').map(v => v.trim());\n const isSupported = supportedVans.includes(safeVanName);\n const input = container.querySelector('input[type=\"checkbox\"]');\n\n if (isSupported) {\n container.classList.remove('hidden', 'opacity-50', 'pointer-events-none');\n } else {\n container.classList.add('hidden', 'opacity-50', 'pointer-events-none');\n if (input && input.checked) input.checked = false;\n if (input && input.id === 'toilet-tablets') toiletTabletsCountInput.value = 0;\n }\n });\n }\n\n function calculateEstimate() {\n const selectedVanRadio = document.querySelector('input[name=\"van\"]:checked');\n const vanName = selectedVanRadio ? selectedVanRadio.value : \"\";\n const startDate = new Date(startDateInput.value);\n const endDate = new Date(endDateInput.value);\n const { totalDays, lowDays, highDays } = calculateRentalPeriod(startDate, endDate, vanName);\n \n const minLowDays = parseInt(selectedVanRadio.dataset.minLow, 10);\n const minHighDays = parseInt(selectedVanRadio.dataset.minHigh, 10);\n const minRequiredDays = highDays > 0 ? minHighDays : minLowDays;\n \n if (totalDays < minRequiredDays) {\n daysErrorMessage.textContent = `A minim\u00e1lis b\u00e9rl\u00e9si id\u0151szak ${minRequiredDays} nap.`;\n daysErrorMessage.classList.remove('hidden');\n exportPdfBtn.disabled = true;\n sendInquiryBtn.disabled = true;\n return;\n } else {\n daysErrorMessage.classList.add('hidden');\n exportPdfBtn.disabled = false;\n sendInquiryBtn.disabled = false;\n }\n\n \/\/ Fedezeti korl\u00e1toz\u00e1s\n const isRestrictedVan = (vanName === 'Sunlight I68' || vanName === 'Etrusco A7300DB');\n const premiumRadio = document.querySelector('input[name=\"coverage-plan\"][value=\"Plan de reducci\u00f3n Premium\"]');\n if (isRestrictedVan) {\n if (premiumRadio && premiumRadio.checked) {\n document.querySelector('input[name=\"coverage-plan\"][value=\"Plan de cobertura b\u00e1sica\"]').checked = true;\n }\n premiumCoverageLabel.classList.add('opacity-50', 'pointer-events-none');\n } else {\n premiumCoverageLabel.classList.remove('opacity-50', 'pointer-events-none');\n }\n\n const vanLowRate = parseFloat(selectedVanRadio.dataset.low);\n const vanHighRate = parseFloat(selectedVanRadio.dataset.high);\n const baseVanCost = (lowDays * vanLowRate) + (highDays * vanHighRate);\n \n let extrasCost = 0;\n const extrasBreakdown = [];\n \n const prepFee = parseFloat(selectedVanRadio.dataset.prep);\n const cleanFee = parseFloat(selectedVanRadio.dataset.clean);\n extrasBreakdown.push({ name: `Kezel\u00e9si k\u00f6lts\u00e9g`, cost: prepFee });\n extrasBreakdown.push({ name: `Takar\u00edt\u00e1si d\u00edj`, cost: cleanFee });\n extrasCost += (prepFee + cleanFee);\n\n document.querySelectorAll('#optional-extras-container input[type=\"checkbox\"]').forEach(item => {\n if (item.checked && !item.parentElement.classList.contains('hidden')) {\n const cost = parseFloat(item.dataset.cost);\n const type = item.dataset.type;\n const maxCost = parseFloat(item.dataset.maxCost) || Infinity;\n let extraItemCost = 0;\n let itemName = item.parentElement.querySelector('span').textContent;\n\n switch(type) {\n case 'day': extraItemCost = Math.min(cost * totalDays, maxCost); break;\n case 'rent': case 'trip': case 'flat': extraItemCost = cost; break;\n case 'qty-day':\n const count = parseInt(document.getElementById(item.id + '-count').value, 10) || 1;\n extraItemCost = Math.min(cost * totalDays, maxCost) * count;\n itemName += ` (x${count})`;\n break;\n case 'piece':\n const tabletCount = parseInt(toiletTabletsCountInput.value, 10);\n extraItemCost = cost * tabletCount;\n itemName += ` (${tabletCount} db)`;\n break;\n }\n extrasCost += extraItemCost;\n extrasBreakdown.push({ name: itemName, cost: extraItemCost });\n }\n });\n\n \/\/ Id\u0151s\u00e1vok\n const pickupRadio = document.querySelector('input[name=\"pickup-time\"]:checked');\n const dropoffRadio = document.querySelector('input[name=\"dropoff-time\"]:checked');\n const pickupFee = parseFloat(pickupRadio.dataset.fee);\n const dropoffFee = parseFloat(dropoffRadio.dataset.fee);\n if (pickupFee > 0) extrasBreakdown.push({ name: `\u00c1tv\u00e9teli fel\u00e1r (${pickupRadio.value})`, cost: pickupFee });\n if (dropoffFee > 0) extrasBreakdown.push({ name: `Lead\u00e1si fel\u00e1r (${dropoffRadio.value})`, cost: dropoffFee });\n extrasCost += (pickupFee + dropoffFee);\n\n \/\/ Kilom\u00e9terek\n const selectedKmOption = document.querySelector('input[name=\"km-option\"]:checked');\n if (selectedKmOption) {\n if (selectedKmOption.id === 'extra-kms-radio') {\n const count = parseInt(extraKmsCountInput.value, 10);\n if (count > 0) {\n const cost = count * 50;\n extrasCost += cost;\n extrasBreakdown.push({ name: `Kms extra (${count} x 300km)`, cost: cost });\n }\n } else if (selectedKmOption.id === 'unlimitedkm-radio') {\n const cost = parseFloat(selectedKmOption.dataset.cost) * totalDays;\n extrasCost += cost;\n extrasBreakdown.push({ name: `Kilometraje ilimitado`, cost: cost });\n }\n }\n\n \/\/ Biztos\u00edt\u00e1s\n const coverage = document.querySelector('input[name=\"coverage-plan\"]:checked');\n const coverageCost = coverage.dataset.type === 'per-day' ? parseFloat(coverage.dataset.cost) * totalDays : 0;\n if (coverageCost > 0) extrasBreakdown.push({ name: `Cobertura: ${coverage.value}`, cost: coverageCost });\n extrasCost += coverageCost;\n\n depositTextValueSpan.textContent = formatCurrency(parseFloat(coverage.dataset.deposit));\n\n \/\/ Discount\n const freeDays = calculateDiscountDays(totalDays, vanName);\n const discountValue = freeDays > 0 ? (baseVanCost \/ totalDays) * freeDays : 0;\n if (discountValue > 0) extrasBreakdown.push({ name: `Hossz\u00fa t\u00e1v\u00fa kedvezm\u00e9ny (${freeDays} nap ingyen)`, cost: -discountValue });\n\n const finalTotal = baseVanCost + extrasCost - discountValue;\n\n \/\/ UI Update\n daysTextSpan.textContent = totalDays;\n daysBreakdownTextSpan.textContent = totalDays;\n selectedVanTextSpan.textContent = vanName;\n vanCostSpan.textContent = formatCurrency(baseVanCost);\n extrasCostSpan.textContent = formatCurrency(extrasCost - discountValue);\n totalCostSpan.textContent = formatCurrency(finalTotal);\n includedKmsSpan.textContent = totalDays * 100;\n\n let breakdownHTML = `<div class=\"flex justify-between font-semibold\"><span>Furgon b\u00e9rl\u00e9s (${vanName})<\/span><span>${formatCurrency(baseVanCost)}<\/span><\/div>`;\n extrasBreakdown.forEach(item => {\n breakdownHTML += `<div class=\"flex justify-between pl-4 text-sm ${item.cost < 0 ? 'text-green-600 font-bold' : 'text-gray-500'}\"><span>${item.name}<\/span><span>${item.cost === 0 ? 'Gratis' : formatCurrency(item.cost)}<\/span><\/div>`;\n });\n breakdownDiv.innerHTML = breakdownHTML;\n\n \/\/ Enhanced Summary for Contact Form 7 Bridge\n let summary = `--- TRIP DETAILS ---\\n`;\n summary += `Van Selected: ${vanName}\\n`;\n summary += `Dates: ${startDateInput.value} to ${endDateInput.value} (${totalDays} days)\\n`;\n summary += `Passengers: ${passengersInput.value}\\n`;\n summary += `Included Kms: ${totalDays * 100} km\\n\\n`;\n\n summary += `--- COST BREAKDOWN ---\\n`;\n summary += `Base Van Rental: ${formatCurrency(baseVanCost)}\\n`;\n \n extrasBreakdown.forEach(item => {\n summary += `${item.name}: ${item.cost === 0 ? 'Free' : formatCurrency(item.cost)}\\n`;\n });\n \n summary += `\\n--- FINAL ESTIMATE ---\\n`;\n summary += `TOTAL ESTIMATE (Brut): ${formatCurrency(finalTotal)}\\n`;\n summary += `REQUIRED DEPOSIT: ${formatCurrency(parseFloat(coverage.dataset.deposit))}\\n`;\n\n \/\/ Push to CF7 hidden field dynamically\n const cf7Textarea = document.getElementById('estimate-summary-data');\n if (cf7Textarea) {\n cf7Textarea.value = summary;\n }\n\n return { vanName, totalDays, startDate: startDateInput.value, endDate: endDateInput.value, passengers: passengersInput.value, totalCost: finalTotal, deposit: coverage.dataset.deposit, breakdown: extrasBreakdown, baseCost: baseVanCost };\n }\n\n function handleExportPdf() {\n const { jsPDF } = window.jspdf;\n const doc = new jsPDF();\n const est = calculateEstimate();\n\n \/\/ Header Section\n doc.setFontSize(22);\n doc.text(\"Lak\u00f3aut\u00f3 B\u00e9rl\u00e9si Kalkul\u00e1ci\u00f3\", 105, 20, null, null, \"center\");\n \n doc.setFontSize(10);\n doc.setFont(\"helvetica\", \"normal\");\n doc.text(`K\u00e9sz\u00fclt: ${new Date().toLocaleDateString()}`, 105, 27, null, null, \"center\");\n\n doc.setFontSize(12);\n doc.text(`B\u00e9rl\u00e9s: ${est.startDate} - ${est.endDate} (${est.totalDays} nap)`, 20, 40);\n doc.text(`T\u00edpus: ${est.vanName} | Utasok sz\u00e1ma: ${est.passengers}`, 20, 48);\n\n const rows = est.breakdown.map(item => [item.name, item.cost === 0 ? 'Ingyenes' : formatCurrency(item.cost)]);\n rows.unshift([`Alap b\u00e9rleti d\u00edj`, formatCurrency(est.baseCost)]);\n\n doc.autoTable({\n startY: 60,\n head: [['Megnevez\u00e9s', 'K\u00f6lts\u00e9g (Brutt\u00f3)']],\n body: rows,\n headStyles: { fillColor: [253, 224, 71], textColor: [55, 65, 81] },\n });\n\n const finalY = doc.lastAutoTable.finalY;\n doc.setFontSize(16);\n doc.setFont(\"helvetica\", \"bold\");\n doc.text(`Becs\u00fclt v\u00e9g\u00f6sszeg: ${formatCurrency(est.totalCost)}`, 20, finalY + 20);\n \n doc.setFontSize(12);\n doc.setFont(\"helvetica\", \"normal\");\n doc.text(`Sz\u00fcks\u00e9ges biztons\u00e1gi let\u00e9t: ${formatCurrency(parseFloat(est.deposit))}`, 20, finalY + 30);\n \n \/\/ Validity Note\n doc.setFontSize(10);\n doc.setTextColor(100);\n doc.text(\"Az \u00e1raj\u00e1nlat 30 napig \u00e9rv\u00e9nyes\", 20, finalY + 45);\n\n doc.save(\"lakoauto-kalkulacio.pdf\");\n }\n\n function handleSendInquiry() {\n calculateEstimate();\n statusMessage.textContent = 'G\u00f6rgess le az \u0171rlap kit\u00f6lt\u00e9s\u00e9hez!';\n statusMessage.classList.remove('hidden');\n const cf7Form = document.querySelector('.wpcf7'); \n if (cf7Form) {\n cf7Form.scrollIntoView({ behavior: 'smooth' });\n } else {\n window.scrollTo({ top: document.body.scrollHeight, behavior: 'smooth' });\n }\n }\n\n document.addEventListener('DOMContentLoaded', () => {\n const today = new Date();\n const tomorrow = new Date(today);\n tomorrow.setDate(tomorrow.getDate() + 3);\n startDateInput.valueAsDate = today;\n endDateInput.valueAsDate = tomorrow;\n\n updateOptionalExtras(document.querySelector('input[name=\"van\"]:checked').value);\n calculateEstimate();\n\n vanRadios.forEach(r => r.addEventListener('change', e => {\n updateOptionalExtras(e.target.value);\n calculateEstimate();\n }));\n \n [startDateInput, endDateInput, passengersInput, extraKmsCountInput, toiletTabletsCountInput].forEach(el => el.addEventListener('input', calculateEstimate));\n optionalItemsContainer.addEventListener('change', calculateEstimate);\n [...pickupRadios, ...dropoffRadios, ...kmOptionRadios, ...coverageRadios].forEach(r => r.addEventListener('change', calculateEstimate));\n \n exportPdfBtn.addEventListener('click', handleExportPdf);\n sendInquiryBtn.addEventListener('click', handleSendInquiry);\n });\n <\/script>\n<\/body>\n<\/html><\/div>\n<div class=\"wpcf7 no-js\" id=\"wpcf7-f2901-o1\" lang=\"hu-HU\" dir=\"ltr\" data-wpcf7-id=\"2901\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/hu\/wp-json\/wp\/v2\/pages\/2873#wpcf7-f2901-o1\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"Kapcsolatfelv\u00e9teli \u0171rlap\" novalidate=\"novalidate\" data-status=\"init\">\n<div style=\"display: none;\">\n<input type=\"hidden\" name=\"_wpcf7\" value=\"2901\" \/>\n<input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.0.6\" \/>\n<input type=\"hidden\" name=\"_wpcf7_locale\" value=\"hu_HU\" \/>\n<input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f2901-o1\" \/>\n<input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/>\n<input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/>\n<input type=\"hidden\" name=\"_wpcf7_recaptcha_response\" value=\"\" \/>\n<\/div>\n<div class=\"space-y-4 bg-white p-6 md:p-8 rounded-2xl shadow-md border border-gray-100 mt-8\">\n\t<h3 class=\"text-xl md:text-2xl font-bold text-gray-700 mb-4\">T\u00f6ltsd ki az \u0171rlapot\n\t<\/h3>\n\t<div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n\t\t<div class=\"flex flex-col\">\n\t\t\t<p><label class=\"text-sm font-medium text-gray-500 mb-1\">Neved *<\/label><span class=\"wpcf7-form-control-wrap\" data-name=\"your-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required w-full p-4 border border-gray-300 rounded-xl focusring-2 focusring-yellow-300 focusborder-transparent\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"text\" name=\"your-name\" \/><\/span>\n\t\t\t<\/p>\n\t\t<\/div>\n\t\t<div class=\"flex flex-col\">\n\t\t\t<p><label class=\"text-sm font-medium text-gray-500 mb-1\">E-mail c\u00edm *<\/label><span class=\"wpcf7-form-control-wrap\" data-name=\"your-email\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email w-full p-4 border border-gray-300 rounded-xl focusring-2 focusring-yellow-300 focusborder-transparent\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"email\" name=\"your-email\" \/><\/span>\n\t\t\t<\/p>\n\t\t<\/div>\n\t<\/div>\n\t<div class=\"flex flex-col\">\n\t\t<p><label class=\"text-sm font-medium text-gray-500 mb-1\">Telefonsz\u00e1m *<\/label><span class=\"wpcf7-form-control-wrap\" data-name=\"your-phone\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-tel wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-tel w-full p-4 border border-gray-300 rounded-xl focusring-2 focusring-yellow-300 focusborder-transparent\" aria-required=\"true\" aria-invalid=\"false\" value=\"\" type=\"tel\" name=\"your-phone\" \/><\/span>\n\t\t<\/p>\n\t<\/div>\n\n \n\t<div style=\"display: none;\">\n\t\t<p><span class=\"wpcf7-form-control-wrap\" data-name=\"estimate-summary-data\"><textarea cols=\"40\" rows=\"10\" maxlength=\"2000\" class=\"wpcf7-form-control wpcf7-textarea\" id=\"estimate-summary-data\" aria-invalid=\"false\" name=\"estimate-summary-data\"><\/textarea><\/span>\n\t\t<\/p>\n\t<\/div>\n\t<div class=\"pt-4 text-center\">\n\t\t<p><input class=\"wpcf7-form-control wpcf7-submit has-spinner px-8 py-4 bg-yellow-300 text-gray-700 font-bold text-lg rounded-full shadow-lg transition-all duration-300 hoverbg-yellow-400 hovershadow-xl cursor-pointer\" type=\"submit\" value=\"\u00c9rdekl\u0151d\u00e9s k\u00fcld\u00e9se\" \/>\n\t\t<\/p>\n\t<\/div>\n<\/div><input type='hidden' class='wpcf7-pum' value='{\"closepopup\":false,\"closedelay\":0,\"openpopup\":false,\"openpopup_id\":0}' \/><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n<\/div><\/div><\/div><\/div><\/section>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"content-type":"","footnotes":""},"class_list":["post-2873","page","type-page","status-publish","hentry"],"yoast_head":"\n<title>\u00c1r kalkul\u00e1tor - solcaravan.es<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/solcaravan.es\/hu\/kalkulator\/\" \/>\n<meta property=\"og:locale\" content=\"hu_HU\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u00c1r kalkul\u00e1tor - solcaravan.es\" \/>\n<meta property=\"og:url\" content=\"https:\/\/solcaravan.es\/hu\/kalkulator\/\" \/>\n<meta property=\"og:site_name\" content=\"solcaravan.es\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/costadelsolcaravan\" \/>\n<meta property=\"article:modified_time\" content=\"2026-02-25T21:21:00+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Becs\u00fclt olvas\u00e1si id\u0151\" \/>\n\t<meta name=\"twitter:data1\" content=\"33 perc\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/solcaravan.es\/hu\/kalkulator\/\",\"url\":\"https:\/\/solcaravan.es\/hu\/kalkulator\/\",\"name\":\"\u00c1r kalkul\u00e1tor - solcaravan.es\",\"isPartOf\":{\"@id\":\"https:\/\/solcaravan.es\/hu\/#website\"},\"datePublished\":\"2026-02-22T20:23:07+00:00\",\"dateModified\":\"2026-02-25T21:21:00+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/solcaravan.es\/hu\/kalkulator\/#breadcrumb\"},\"inLanguage\":\"hu\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/solcaravan.es\/hu\/kalkulator\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/solcaravan.es\/hu\/kalkulator\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/solcaravan.es\/hu\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u00c1r kalkul\u00e1tor\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/solcaravan.es\/hu\/#website\",\"url\":\"https:\/\/solcaravan.es\/hu\/\",\"name\":\"solcaravan.es\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/solcaravan.es\/hu\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/solcaravan.es\/hu\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"hu\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/solcaravan.es\/hu\/#organization\",\"name\":\"Sol Caravan - Campervan Rental M\u00e1laga\",\"url\":\"https:\/\/solcaravan.es\/hu\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"hu\",\"@id\":\"https:\/\/solcaravan.es\/hu\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/solcaravan.es\/wp-content\/uploads\/2024\/10\/SOLCaravan-2.png\",\"contentUrl\":\"https:\/\/solcaravan.es\/wp-content\/uploads\/2024\/10\/SOLCaravan-2.png\",\"width\":500,\"height\":500,\"caption\":\"Sol Caravan - Campervan Rental M\u00e1laga\"},\"image\":{\"@id\":\"https:\/\/solcaravan.es\/hu\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/costadelsolcaravan\",\"https:\/\/www.instagram.com\/solcaravan\",\"https:\/\/www.tiktok.com\/@solcaravan.malaga\"]}]}<\/script>\n","yoast_head_json":{"title":"\u00c1r kalkul\u00e1tor - solcaravan.es","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/solcaravan.es\/hu\/kalkulator\/","og_locale":"hu_HU","og_type":"article","og_title":"\u00c1r kalkul\u00e1tor - solcaravan.es","og_url":"https:\/\/solcaravan.es\/hu\/kalkulator\/","og_site_name":"solcaravan.es","article_publisher":"https:\/\/www.facebook.com\/costadelsolcaravan","article_modified_time":"2026-02-25T21:21:00+00:00","twitter_card":"summary_large_image","twitter_misc":{"Becs\u00fclt olvas\u00e1si id\u0151":"33 perc"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/solcaravan.es\/hu\/kalkulator\/","url":"https:\/\/solcaravan.es\/hu\/kalkulator\/","name":"\u00c1r kalkul\u00e1tor - solcaravan.es","isPartOf":{"@id":"https:\/\/solcaravan.es\/hu\/#website"},"datePublished":"2026-02-22T20:23:07+00:00","dateModified":"2026-02-25T21:21:00+00:00","breadcrumb":{"@id":"https:\/\/solcaravan.es\/hu\/kalkulator\/#breadcrumb"},"inLanguage":"hu","potentialAction":[{"@type":"ReadAction","target":["https:\/\/solcaravan.es\/hu\/kalkulator\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/solcaravan.es\/hu\/kalkulator\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/solcaravan.es\/hu\/"},{"@type":"ListItem","position":2,"name":"\u00c1r kalkul\u00e1tor"}]},{"@type":"WebSite","@id":"https:\/\/solcaravan.es\/hu\/#website","url":"https:\/\/solcaravan.es\/hu\/","name":"solcaravan.es","description":"","publisher":{"@id":"https:\/\/solcaravan.es\/hu\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/solcaravan.es\/hu\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"hu"},{"@type":"Organization","@id":"https:\/\/solcaravan.es\/hu\/#organization","name":"Sol Caravan - Campervan Rental M\u00e1laga","url":"https:\/\/solcaravan.es\/hu\/","logo":{"@type":"ImageObject","inLanguage":"hu","@id":"https:\/\/solcaravan.es\/hu\/#\/schema\/logo\/image\/","url":"https:\/\/solcaravan.es\/wp-content\/uploads\/2024\/10\/SOLCaravan-2.png","contentUrl":"https:\/\/solcaravan.es\/wp-content\/uploads\/2024\/10\/SOLCaravan-2.png","width":500,"height":500,"caption":"Sol Caravan - Campervan Rental M\u00e1laga"},"image":{"@id":"https:\/\/solcaravan.es\/hu\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/costadelsolcaravan","https:\/\/www.instagram.com\/solcaravan","https:\/\/www.tiktok.com\/@solcaravan.malaga"]}]}},"_links":{"self":[{"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/pages\/2873"}],"collection":[{"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/comments?post=2873"}],"version-history":[{"count":6,"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/pages\/2873\/revisions"}],"predecessor-version":[{"id":2903,"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/pages\/2873\/revisions\/2903"}],"wp:attachment":[{"href":"https:\/\/solcaravan.es\/hu\/wp-json\/wp\/v2\/media?parent=2873"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}