{"id":6659,"date":"2026-08-06T10:15:25","date_gmt":"2026-08-06T08:15:25","guid":{"rendered":"https:\/\/kirunabuss.se\/book-test\/confirm-booking\/"},"modified":"2026-08-17T14:54:48","modified_gmt":"2026-08-17T12:54:48","slug":"confirm-booking","status":"publish","type":"page","link":"https:\/\/kirunabuss.se\/en\/book-test\/confirm-booking\/","title":{"rendered":"Confirm booking"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"6659\" class=\"elementor elementor-6659 elementor-6654\" data-elementor-post-type=\"page\">\n\t\t\t\t<style>\n                .elementor-element-4f851f8{\n                --padding-top: var(--webien-padding-top-s);\n                --padding-right: var(--webien-padding-right-s);\n                --padding-bottom: var(--webien-padding-bottom-s);\n                --padding-left: var(--webien-padding-left-s);\n                }\n            <\/style><div class=\"webien-container-padding-s elementor-element elementor-element-4f851f8 e-flex e-con-boxed e-con e-parent\" data-id=\"4f851f8\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[],&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<style>\n                .elementor-element-0ff1e81{\n                --padding-top: var(--webien-padding-top-none);\n                --padding-right: var(--webien-padding-right-none);\n                --padding-bottom: var(--webien-padding-bottom-none);\n                --padding-left: var(--webien-padding-left-none);\n                }\n            <\/style><div class=\"webien-container-padding-none elementor-element elementor-element-0ff1e81 e-con-full e-flex e-con e-child\" data-id=\"0ff1e81\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t<style>\n                .elementor-element-5464387{\n                --padding-top: var(--webien-padding-top-none);\n                --padding-right: var(--webien-padding-right-none);\n                --padding-bottom: var(--webien-padding-bottom-none);\n                --padding-left: var(--webien-padding-left-none);\n                }\n            <\/style><div class=\"webien-container-padding-none elementor-element elementor-element-5464387 e-con-full e-flex e-con e-child\" data-id=\"5464387\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[]}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0efce43 elementor-widget elementor-widget-heading\" data-id=\"0efce43\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Confirm booking<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-aa18df2 elementor-widget elementor-widget-text-editor\" data-id=\"aa18df2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>You\u2019re almost done. Fill in your details to book your seat. <\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d0defb3 elementor-widget elementor-widget-webien_kiruna_book\" data-id=\"d0defb3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"webien_kiruna_book.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div id=\"bookItem-4f87cb7030\" data-unique=\"4f87cb7030\" class=\"webien-kiruna-book book-form\">\n\n    <div class=\"card\">\n        <div class=\"card-header\">\n            <div class=\"step\">1<\/div>\n            <h5 class=\"title\">Resen\u00e4rer<\/h5>\n        <\/div>\n        <div class=\"traveler\" v-for=\"(item, i) in order.travelers\" :key=\"i\">\n            <h6 class=\"traveler-label\">Deltagare #{{i + 1}}, {{ item.adult ? 'vuxen' : 'barn' }}<\/h6>\n            <div class=\"input-group\">\n                <div class=\"input required\">\n                    <span class=\"label\">F\u00f6rnamn<\/span>\n                    <input type=\"text\" v-model=\"order.travelers[i].fname\">\n                <\/div>\n                <div class=\"input required\">\n                    <span class=\"label\">Efternamn<\/span>\n                    <input type=\"text\" v-model=\"order.travelers[i].lname\">\n                <\/div>\n            <\/div>\n        <\/div>\n\n\n    <\/div>\n\n\n    <div class=\"card\">\n        <div class=\"card-header\">\n            <div class=\"step\">2<\/div>\n            <h5 class=\"title\">Betal- och kontaktuppgifter<\/h5>\n        <\/div>\n\n        <div class=\"input required\">\n            <span class=\"label\">F\u00f6rnamn<\/span>\n            <input type=\"text\" v-model=\"order.contact.fname\">\n        <\/div>\n\n        <div class=\"input required\">\n            <span class=\"label\">Efternamn<\/span>\n            <input type=\"text\" v-model=\"order.contact.lname\">\n        <\/div>\n\n        <div class=\"input required\">\n            <span class=\"label\">Mobilnummer<\/span>\n            <input type=\"text\" v-model=\"order.contact.phone\">\n        <\/div>\n\n        <div class=\"input required\">\n            <span class=\"label\">E-post<\/span>\n            <input type=\"email\" v-model=\"order.contact.email\">\n        <\/div>\n\n        <div class=\"input required\">\n            <span class=\"label\">Land<\/span>\n            <select v-model=\"order.contact.country\">\n                <option :value=\"null\" disabled>V\u00e4lj land<\/option>\n                <template v-for=\"(item, i) in countryOptions\" :key=\"i\">\n                    <option v-if=\"item.separator\" disabled>\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500<\/option>\n                    <option v-else :value=\"item.code\">{{item.name}}<\/option>\n                <\/template>\n            <\/select>\n        <\/div>\n    <\/div>\n\n\n    <div class=\"card\">\n        <div class=\"card-header\">\n            <div class=\"step\">3<\/div>\n            <h5 class=\"title\">Till\u00e4gg och \u00f6nskem\u00e5l<\/h5>\n        <\/div>\n\n\n        <div class=\"input required\" v-show=\"showPickupSelect\">\n            <span class=\"label\">Upph\u00e4mtningsplats<\/span>\n            <select v-model=\"order.extra.pickup\">\n                <option v-for=\"pickup in pickups\" :value=\"pickup\" v-html=\"pickup.locationName\"><\/option>\n            <\/select>\n        <\/div>\n\n        <div class=\"input required\">\n            <span class=\"label\">Delad eller privat upplevelse?<\/span>\n            <select v-model=\"order.extra.shared\">\n                <option :value=\"1\">Delad tur med andra g\u00e4ster<\/option>\n                <option :value=\"0\">Privat upplevelse<\/option>\n            <\/select>\n            <span class=\"descr\">Turen sker vanligtvis tillsammans med andra deltagare. V\u00e4lj privat upplevelse om ni \u00f6nskar boka hela turen exklusivt \u2013 priset uppdateras automatiskt.<\/span>\n        <\/div>\n\n        <div class=\"input\">\n            <span class=\"label\">\u00d6vriga \u00f6nskem\u00e5l<\/span>\n            <textarea rows=\"5\" v-model=\"order.extra.note\"><\/textarea>\n        <\/div>\n\n\n    <\/div>\n\n\n    <div class=\"card\">\n        <div class=\"card-header\">\n            <div class=\"step\">4<\/div>\n            <h5 class=\"title\">Villkor<\/h5>\n        <\/div>\n\n        <div class=\"input\">\n            <div class=\"confirm-terms\">\n                <div class=\"checkbox\" :class=\"{active:order.payAgreement}\" @click=\"togglePayAgreement\">\n                    <i class=\"icon icon-check\"><\/i>\n                <\/div>\n                <span>Jag godk\u00e4nner <button class=\"open-conditions\" @click=\"openOverlay('terms')\">k\u00f6pvillkoren<\/button>.<\/span>\n            <\/div>\n\n        <\/div>\n    <\/div>\n\n    <div class=\"webien-kiruna-book book-overlay\" :class=\"[{open:overlay.open}, overlay.scene]\">\n\n    <div class=\"bkg\" @click=\"overlayBkgClicked\"><\/div>\n\n    <div class=\"inner\">\n        <div class=\"top\">\n            <h5 class=\"title\">{{ overlayTitle }}<\/h5>\n            <button class=\"close\" @click=\"closeOverlay\">\n                <i class=\"icon icon-close\"><\/i>\n            <\/button>\n        <\/div>\n\n        <div class=\"travelers\" v-if=\"overlay.scene == 'travelers'\">\n            <div class=\"cat adults\">\n                <div class=\"txt\">\n                    <span class=\"label\">Vuxna<\/span>\n                    <span class=\"descr\">16 \u00e5r och \u00e4ldre.<\/span>\n                <\/div>\n\n                <div class=\"btns\">\n                    <button class=\"minus\" @click=\"changeTravelers('adults', false)\">\n                        <i class=\"icon icon-chevron-left\"><\/i>\n                    <\/button>\n                    <span class=\"value\" v-html=\"adultCount\"><\/span>\n                    <button class=\"plus\" @click=\"changeTravelers('adults', true)\">\n                        <i class=\"icon icon-chevron-right\"><\/i>\n                    <\/button>\n                <\/div>\n            <\/div>\n\n            <div class=\"cat children\">\n                <div class=\"txt\">\n                    <span class=\"label\">Barn<\/span>\n                    <span class=\"descr\">8-15 \u00e5r. Max 1 barn\/vuxen.<\/span>\n                <\/div>\n\n                <div class=\"btns\">\n                    <button class=\"minus\" @click=\"changeTravelers('children', false)\">\n                        <i class=\"icon icon-chevron-left\"><\/i>\n                    <\/button>\n                    <span class=\"value\" v-html=\"childrenCount\"><\/span>\n                    <button class=\"plus\" @click=\"changeTravelers('children', true)\">\n                        <i class=\"icon icon-chevron-right\"><\/i>\n                    <\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n\n\n        <div class=\"date-time\" v-if=\"overlay.scene == 'dateTime'\">\n            <div class=\"calendar\">\n                <v-date-picker\n                    v-model=\"calendar.date\"\n                    is-expanded\n                    locale=\"sv\"\n                    :masks=\"{ weekdays: 'WWW' }\"\n                    :min-date=\"calendar.minDate\"\n                    :available-dates='calendar.available'\n                ><\/v-date-picker>\n            <\/div>\n            <div class=\"slots\">\n                <h5 class=\"title\">Valbara tider {{ dateTitle }}<\/h5>\n                <div class=\"slot-list\" v-if=\"calendar.selectedSlots.length\">\n                    <div class=\"item\">\n                        <button\n                                v-for=\"slot in calendar.selectedSlots\"\n                                :key=\"slot.id || slot.startTimeLocal\"\n                                class=\"book-btn\"\n                                :class=\"{active: isSelectedTimeSlot(slot)}\"\n                                @click=\"selectTimeSlot(slot)\"\n                        >\n                            <span>{{ formatSlotTimeRange(slot) }}<\/span>\n                        <\/button>\n                        <small class=\"instructions\" v-if=\"getPickupInstruction()\" v-html=\"getPickupInstruction()\"><\/small>\n                    <\/div>\n\n                <\/div>\n                <p v-if=\"!calendar.selectedSlots.length\">Inga tider tillg\u00e4ngliga f\u00f6r valt datum.<\/p>\n            <\/div>\n        <\/div>\n\n\n\n        <div class=\"date-only\" v-if=\"overlay.scene == 'date'\">\n            <div class=\"calendar\">\n                <v-date-picker\n                        v-model=\"calendar.date\"\n                        is-expanded\n                        locale=\"sv\"\n                        :masks=\"{ weekdays: 'WWW' }\"\n                        :min-date=\"calendar.minDate\"\n                        :available-dates='calendar.available'\n                ><\/v-date-picker>\n            <\/div>\n        <\/div>\n\n\n\n        <div class=\"terms\" v-if=\"overlay.scene == 'terms'\">\n            <div v-html=\"settings.terms\"><\/div>\n        <\/div>\n\n\n        <div class=\"payment\" v-if=\"overlay.scene == 'payment'\">\n            <div class=\"summary\">\n                <h2>Slutf\u00f6r betalning<\/h2>\n                <p>{{ destinationText }} \u00b7 {{ dateAndTimeText }} \u00b7 {{ travelersText }}<\/p>\n            <\/div>\n            <div class=\"stripe-container\">\n                <div class=\"preloader\" v-if=\"stripe.loading\">\n                    <svg width=\"120\" height=\"30\" viewBox=\"0 0 120 30\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"#000\">\n    <circle cx=\"15\" cy=\"15\" r=\"15\">\n        <animate attributeName=\"r\" from=\"15\" to=\"15\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"15;9;15\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"1\" to=\"1\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"1;.5;1\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n    <circle cx=\"60\" cy=\"15\" r=\"9\" fill-opacity=\"0.3\">\n        <animate attributeName=\"r\" from=\"9\" to=\"9\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"9;15;9\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"0.5\" to=\"0.5\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\".5;1;.5\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n    <circle cx=\"105\" cy=\"15\" r=\"15\">\n        <animate attributeName=\"r\" from=\"15\" to=\"15\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"15;9;15\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"1\" to=\"1\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"1;.5;1\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n<\/svg>\n                <\/div>\n                <p class=\"stripe-error\" v-if=\"stripe.error\">{{ stripe.error }}<\/p>\n                <div class=\"stripe-payment-element\" :id=\"'stripe-payment-element-' + settings.instanceId\"><\/div>\n            <\/div>\n            <div class=\"total\">\n                <span class=\"label\">Att betala<\/span>\n                <span class=\"value\">{{ stripeTotalText }}<\/span>\n            <\/div>\n\n            <button\n                    class=\"book-cta\"\n                    @click=\"confirmStripePayment\"\n                    :disabled=\"stripe.loading || stripe.processing || !stripe.canConfirm\"\n            >\n                {{ stripePaymentButtonText }}\n            <\/button>\n\n        <\/div>\n\n        <div class=\"payment-success\" v-if=\"overlay.scene == 'paymentSuccess'\">\n            <h2>Tack, betalningen \u00e4r mottagen.<\/h2>\n            <p>{{ stripe.statusMessage }}<\/p>\n            <p>Visa detta meddelande eller g\u00f6r en redirect till en riktig tacksida med orderdata, kvitto etc..<\/p>\n            Order data basics:\n            <pre>{{ paymentSuccessOrderJson }}<\/pre>\n            <button class=\"book-cta\" @click=\"closeOverlay\">\n                St\u00e4ng            <\/button>\n        <\/div>\n\n\n        <div class=\"partner-book\" v-if=\"overlay.scene == 'partnerBook'\">\n            <div class=\"travelers\">\n                <div class=\"input\">\n                    <span class=\"label\">Antal resen\u00e4rer<\/span>\n                    <input class=\"persons\" type=\"number\" min=\"1\" step=\"1\" v-model.number=\"partnerDraft.travelers\">\n                <\/div>\n            <\/div>\n\n            <div class=\"input\" v-if=\"resources.length\">\n                <span class=\"label\">Storlek p\u00e5 buss<\/span>\n                <select class=\"bus\" v-model=\"partnerDraft.resource\">\n                    <option :value=\"null\">V\u00e4lj fordon<\/option>\n                    <option v-for=\"resource in resources\" :key=\"resource.id\" :value=\"resource.name\">{{ resource.name }}<\/option>\n                <\/select>\n            <\/div>\n\n            <div class=\"date-time\">\n                <div class=\"input\">\n                    <span class=\"label\">\u00d6nskat datum<\/span>\n                    <button class=\"select\" @click=\"showPartnerCalendarOverlay = true\">\n                        <i class=\"icon icon-calendar\"><\/i>\n                        <span class=\"txt\" v-html=\"partnerSelectDateText\"><\/span>\n                        <i class=\"icon icon-chevron\"><\/i>\n                    <\/button>\n                <\/div>\n\n            <\/div>\n\n            <div class=\"input\">\n                <span class=\"label\">\u00d6nskat guidespr\u00e5k<\/span>\n                <select v-model=\"partnerDraft.guideLanguage\">\n                    <option :value=\"null\">V\u00e4lj spr\u00e5k<\/option>\n                    <option v-for=\"language in partnerGuideLanguages\" :value=\"language\">{{language}}<\/option>\n                <\/select>\n            <\/div>\n\n            <div class=\"input\" v-show=\"partnerDraftPickups\">\n                <span class=\"label\">Upph\u00e4mtning<\/span>\n                <select class=\"from\" v-model=\"partnerDraft.desiredPickup\">\n                    <option v-for=\"pickup in partnerDraftPickups?.pickupLocations\" :value=\"pickup.locationName\" v-html=\"pickup.locationName\"><\/option>\n                <\/select>\n            <\/div>\n\n            <div class=\"input\">\n                <span class=\"label\">Kommentar eller \u00f6nskem\u00e5l<\/span>\n                <input type=\"text\" v-model=\"partnerDraft.comment\">\n            <\/div>\n\n        <\/div>\n\n\n\n\n\n        <div class=\"discount\" v-if=\"overlay.scene == 'discount'\">\n            <div class=\"input required\">\n                <span class=\"label\">Rabattkod<\/span>\n                <input\n                        type=\"text\"\n                        v-model=\"promoDraft.code\"\n                        @input=\"resetPromoDraftValidation\"\n                        @keydown.enter.prevent=\"submitPromoCode\"\n                        :disabled=\"promoDraft.checking\"\n                >\n                <span class=\"descr\" v-if=\"promoDraft.checking\">Verifierar\u2026<\/span>\n                <span class=\"descr\" v-else-if=\"promoDraft.valid === true\">{{ promoDraft.message }}<\/span>\n                <span class=\"descr error\" v-else-if=\"promoDraft.valid === false\">{{ promoDraft.message }}<\/span>\n            <\/div>\n        <\/div>\n\n\n        <div class=\"loading\" v-if=\"overlay.scene == 'loading'\">\n            <p v-show=\"loadingOverlayText.length\">{{ loadingOverlayText }}<\/p>\n            <svg width=\"120\" height=\"30\" viewBox=\"0 0 120 30\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"#000\">\n    <circle cx=\"15\" cy=\"15\" r=\"15\">\n        <animate attributeName=\"r\" from=\"15\" to=\"15\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"15;9;15\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"1\" to=\"1\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"1;.5;1\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n    <circle cx=\"60\" cy=\"15\" r=\"9\" fill-opacity=\"0.3\">\n        <animate attributeName=\"r\" from=\"9\" to=\"9\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"9;15;9\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"0.5\" to=\"0.5\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\".5;1;.5\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n    <circle cx=\"105\" cy=\"15\" r=\"15\">\n        <animate attributeName=\"r\" from=\"15\" to=\"15\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"15;9;15\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"1\" to=\"1\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"1;.5;1\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n<\/svg>\n        <\/div>\n\n\n        <div class=\"booking-error\" v-if=\"overlay.scene == 'bookingError'\">\n            <p v-html=\"booking.error\"><\/p>\n        <\/div>\n\n        <div class=\"message\" v-if=\"overlay.scene == 'message'\">\n            <p v-html=\"message.text\"><\/p>\n        <\/div>\n\n\n        <div class=\"bottom\" v-if=\"showOverlayBottom\">\n            <button class=\"book-btn cancel\" v-if=\"showOverlayCancel\" @click=\"closeOverlay\">\n                Avbryt            <\/button>\n            <div class=\"partner\" v-show=\"overlay.scene === 'partnerBook'\">\n                <button class=\"text remove-item\" :class=\"{show:isEditingPartnerDraft}\" @click=\"removePartnerItem()\">Ta bort bokning<\/button>\n                <span class=\"price\">Pris {{ getFormatedPrice(partnerDraft.product?.price * partnerDraft.travelers) }}<\/span>\n            <\/div>\n            <button class=\"book-cta save\" @click=\"saveOverlay\" :disabled=\"!canSaveOverlay\" v-html=\"overlayCta\"><\/button>\n        <\/div>\n\n    <\/div>\n\n\n\n\n    <div class=\"partner-calendar-overlay\" :class=\"{show: showPartnerCalendarOverlay}\">\n        <div class=\"bkg\"><\/div>\n        <div class=\"inner\">\n            <div class=\"top\">\n                <h5 class=\"title\">V\u00e4lj datum<\/h5>\n                <button class=\"close\" @click=\"showPartnerCalendarOverlay = false\">\n                    <i class=\"icon icon-close\"><\/i>\n                <\/button>\n            <\/div>\n\n            <div class=\"date-only\">\n                <div class=\"calendar\">\n                    <v-date-picker\n                            v-model=\"partnerDraft.desiredDate\"\n                            is-expanded\n                            locale=\"sv\"\n                            :masks=\"{ weekdays: 'WWW'}\"\n                            :min-date=\"new Date()\"\n                    ><\/v-date-picker>\n                <\/div>\n            <\/div>\n\n\n\n            <div class=\"bottom\">\n                <button class=\"book-btn cancel\" @click=\"showPartnerCalendarOverlay = false\">\n                    Avbryt                <\/button>\n                <button class=\"book-cta save\" @click=\"showPartnerCalendarOverlay = false\" :disabled=\"!partnerDraft.desiredDate\">V\u00e4lj datum<\/button>\n            <\/div>\n        <\/div>\n\n    <\/div>\n\n<\/div>\n\n\n<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<style>\n                .elementor-element-7e8e25a{\n                --padding-top: var(--webien-padding-top-none);\n                --padding-right: var(--webien-padding-right-none);\n                --padding-bottom: var(--webien-padding-bottom-none);\n                --padding-left: var(--webien-padding-left-none);\n                }\n            <\/style><div class=\"webien-container-padding-none elementor-element elementor-element-7e8e25a e-con-full e-flex e-con e-child\" data-id=\"7e8e25a\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;jet_parallax_layout_list&quot;:[],&quot;sticky&quot;:&quot;top&quot;,&quot;sticky_offset&quot;:24,&quot;sticky_parent&quot;:&quot;yes&quot;,&quot;sticky_on&quot;:[&quot;desktop&quot;],&quot;sticky_effects_offset&quot;:0,&quot;sticky_anchor_link_offset&quot;:0}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-21b0b34 elementor-widget elementor-widget-webien_kiruna_book\" data-id=\"21b0b34\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"webien_kiruna_book.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div id=\"bookItem-4a8609bcad\" data-unique=\"4a8609bcad\" class=\"webien-kiruna-book book-summary\">\n\n    <div class=\"card\">\n        <div class=\"card-header\">\n            <img class=\"thumb\" v-if=\"productData.image || order.image\" :src=\"productData.image || order.image\">\n                            <h5 class=\"title\" v-html=\"productData.name || order.title\"><\/h5>\n                    <\/div>\n\n\n        <div class=\"row from\" v-if=\"hasPickupOptions\">\n            <div class=\"txt\">\n                <span class=\"label\">Fr\u00e5n<\/span>\n                <span class=\"value\" v-if=\"!summary.editingRoute\" v-html=\"pickupText\"><\/span>\n                <div class=\"input\">\n                    <select v-if=\"summary.editingRoute\" v-model=\"order.extra.pickup\" @change=\"updateData\">\n                        <option v-for=\"pickup in pickups\" :value=\"pickup\" v-html=\"pickup.locationName\"><\/option>\n                    <\/select>\n                <\/div>\n\n            <\/div>\n\n            <div class=\"btns\">\n                <button class=\"book-btn\" @click=\"toggleSummaryRouteEdit\">\n                    <span v-html=\"summaryRouteSelectLabel\"><\/span>\n                <\/button>\n            <\/div>\n        <\/div>\n\n        <div class=\"row travelers\">\n            <div class=\"txt\">\n                <span class=\"label\">Resen\u00e4rer<\/span>\n                <span class=\"value\" v-html=\"travelersText\"><\/span>\n            <\/div>\n\n            <div class=\"btns\">\n                <button class=\"book-btn\" @click=\"openOverlay('travelers')\">\n                    <span>\u00c4ndra<\/span>\n                <\/button>\n            <\/div>\n        <\/div>\n\n        <div class=\"row date-time\">\n            <div class=\"txt\">\n                <span class=\"label\">Datum och tid<\/span>\n                <span class=\"value\" v-html=\"dateAndTimeText\"><\/span>\n            <\/div>\n\n            <div class=\"btns\">\n                <button class=\"book-btn\" @click=\"openOverlay('dateTime')\">\n                    <span>\u00c4ndra<\/span>\n                <\/button>\n            <\/div>\n        <\/div>\n\n        <div class=\"promo-code\">\n            <button v-if=\"!hasPromoApplied\" class=\"text add\" @click=\"openPromoOverlay\">\n                <i class=\"icon icon-plus\"><\/i>\n                <span>L\u00e4gg till rabattkod<\/span>\n            <\/button>\n            <div v-else class=\"applied\">\n                <span class=\"code\">Rabattkod: <strong>{{ order.promo.code }}<\/strong><\/span>\n                <button class=\"text\" @click=\"removePromoCode\">Ta bort<\/button>\n            <\/div>\n        <\/div>\n\n\n        <div class=\"price\">\n            <div class=\"tot\">\n                <span class=\"label\">Totalt<\/span>\n                <span class=\"value\">{{priceText}}<\/span>\n            <\/div>\n            <div class=\"meta\">\n                <span class=\"promo-msg\" v-if=\"hasPromoApplied\">Tidigare pris {{ originalPriceText }}<\/span>\n                <span class=\"label\">Moms och avgifter ing\u00e5r.<\/span>\n            <\/div>\n\n        <\/div>\n\n        <button @click=\"confirmAndBook\" class=\"book-cta\">\n            Bekr\u00e4fta och boka        <\/button>\n\n        \n    <\/div>\n\n    <div class=\"sticky-bar\">\n        <div class=\"price\">\n            <span class=\"label\">Totalt<\/span>\n            <span class=\"value\">{{priceText}}<\/span>\n        <\/div>\n\n        <button @click=\"confirmAndBook\" class=\"book-cta\">\n            Boka        <\/button>\n    <\/div>\n\n    <div class=\"webien-kiruna-book book-overlay\" :class=\"[{open:overlay.open}, overlay.scene]\">\n\n    <div class=\"bkg\" @click=\"overlayBkgClicked\"><\/div>\n\n    <div class=\"inner\">\n        <div class=\"top\">\n            <h5 class=\"title\">{{ overlayTitle }}<\/h5>\n            <button class=\"close\" @click=\"closeOverlay\">\n                <i class=\"icon icon-close\"><\/i>\n            <\/button>\n        <\/div>\n\n        <div class=\"travelers\" v-if=\"overlay.scene == 'travelers'\">\n            <div class=\"cat adults\">\n                <div class=\"txt\">\n                    <span class=\"label\">Vuxna<\/span>\n                    <span class=\"descr\">16 \u00e5r och \u00e4ldre.<\/span>\n                <\/div>\n\n                <div class=\"btns\">\n                    <button class=\"minus\" @click=\"changeTravelers('adults', false)\">\n                        <i class=\"icon icon-chevron-left\"><\/i>\n                    <\/button>\n                    <span class=\"value\" v-html=\"adultCount\"><\/span>\n                    <button class=\"plus\" @click=\"changeTravelers('adults', true)\">\n                        <i class=\"icon icon-chevron-right\"><\/i>\n                    <\/button>\n                <\/div>\n            <\/div>\n\n            <div class=\"cat children\">\n                <div class=\"txt\">\n                    <span class=\"label\">Barn<\/span>\n                    <span class=\"descr\">8-15 \u00e5r. Max 1 barn\/vuxen.<\/span>\n                <\/div>\n\n                <div class=\"btns\">\n                    <button class=\"minus\" @click=\"changeTravelers('children', false)\">\n                        <i class=\"icon icon-chevron-left\"><\/i>\n                    <\/button>\n                    <span class=\"value\" v-html=\"childrenCount\"><\/span>\n                    <button class=\"plus\" @click=\"changeTravelers('children', true)\">\n                        <i class=\"icon icon-chevron-right\"><\/i>\n                    <\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n\n\n        <div class=\"date-time\" v-if=\"overlay.scene == 'dateTime'\">\n            <div class=\"calendar\">\n                <v-date-picker\n                    v-model=\"calendar.date\"\n                    is-expanded\n                    locale=\"sv\"\n                    :masks=\"{ weekdays: 'WWW' }\"\n                    :min-date=\"calendar.minDate\"\n                    :available-dates='calendar.available'\n                ><\/v-date-picker>\n            <\/div>\n            <div class=\"slots\">\n                <h5 class=\"title\">Valbara tider {{ dateTitle }}<\/h5>\n                <div class=\"slot-list\" v-if=\"calendar.selectedSlots.length\">\n                    <div class=\"item\">\n                        <button\n                                v-for=\"slot in calendar.selectedSlots\"\n                                :key=\"slot.id || slot.startTimeLocal\"\n                                class=\"book-btn\"\n                                :class=\"{active: isSelectedTimeSlot(slot)}\"\n                                @click=\"selectTimeSlot(slot)\"\n                        >\n                            <span>{{ formatSlotTimeRange(slot) }}<\/span>\n                        <\/button>\n                        <small class=\"instructions\" v-if=\"getPickupInstruction()\" v-html=\"getPickupInstruction()\"><\/small>\n                    <\/div>\n\n                <\/div>\n                <p v-if=\"!calendar.selectedSlots.length\">Inga tider tillg\u00e4ngliga f\u00f6r valt datum.<\/p>\n            <\/div>\n        <\/div>\n\n\n\n        <div class=\"date-only\" v-if=\"overlay.scene == 'date'\">\n            <div class=\"calendar\">\n                <v-date-picker\n                        v-model=\"calendar.date\"\n                        is-expanded\n                        locale=\"sv\"\n                        :masks=\"{ weekdays: 'WWW' }\"\n                        :min-date=\"calendar.minDate\"\n                        :available-dates='calendar.available'\n                ><\/v-date-picker>\n            <\/div>\n        <\/div>\n\n\n\n        <div class=\"terms\" v-if=\"overlay.scene == 'terms'\">\n            <div v-html=\"settings.terms\"><\/div>\n        <\/div>\n\n\n        <div class=\"payment\" v-if=\"overlay.scene == 'payment'\">\n            <div class=\"summary\">\n                <h2>Slutf\u00f6r betalning<\/h2>\n                <p>{{ destinationText }} \u00b7 {{ dateAndTimeText }} \u00b7 {{ travelersText }}<\/p>\n            <\/div>\n            <div class=\"stripe-container\">\n                <div class=\"preloader\" v-if=\"stripe.loading\">\n                    <svg width=\"120\" height=\"30\" viewBox=\"0 0 120 30\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"#000\">\n    <circle cx=\"15\" cy=\"15\" r=\"15\">\n        <animate attributeName=\"r\" from=\"15\" to=\"15\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"15;9;15\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"1\" to=\"1\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"1;.5;1\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n    <circle cx=\"60\" cy=\"15\" r=\"9\" fill-opacity=\"0.3\">\n        <animate attributeName=\"r\" from=\"9\" to=\"9\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"9;15;9\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"0.5\" to=\"0.5\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\".5;1;.5\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n    <circle cx=\"105\" cy=\"15\" r=\"15\">\n        <animate attributeName=\"r\" from=\"15\" to=\"15\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"15;9;15\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"1\" to=\"1\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"1;.5;1\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n<\/svg>\n                <\/div>\n                <p class=\"stripe-error\" v-if=\"stripe.error\">{{ stripe.error }}<\/p>\n                <div class=\"stripe-payment-element\" :id=\"'stripe-payment-element-' + settings.instanceId\"><\/div>\n            <\/div>\n            <div class=\"total\">\n                <span class=\"label\">Att betala<\/span>\n                <span class=\"value\">{{ stripeTotalText }}<\/span>\n            <\/div>\n\n            <button\n                    class=\"book-cta\"\n                    @click=\"confirmStripePayment\"\n                    :disabled=\"stripe.loading || stripe.processing || !stripe.canConfirm\"\n            >\n                {{ stripePaymentButtonText }}\n            <\/button>\n\n        <\/div>\n\n        <div class=\"payment-success\" v-if=\"overlay.scene == 'paymentSuccess'\">\n            <h2>Tack, betalningen \u00e4r mottagen.<\/h2>\n            <p>{{ stripe.statusMessage }}<\/p>\n            <p>Visa detta meddelande eller g\u00f6r en redirect till en riktig tacksida med orderdata, kvitto etc..<\/p>\n            Order data basics:\n            <pre>{{ paymentSuccessOrderJson }}<\/pre>\n            <button class=\"book-cta\" @click=\"closeOverlay\">\n                St\u00e4ng            <\/button>\n        <\/div>\n\n\n        <div class=\"partner-book\" v-if=\"overlay.scene == 'partnerBook'\">\n            <div class=\"travelers\">\n                <div class=\"input\">\n                    <span class=\"label\">Antal resen\u00e4rer<\/span>\n                    <input class=\"persons\" type=\"number\" min=\"1\" step=\"1\" v-model.number=\"partnerDraft.travelers\">\n                <\/div>\n            <\/div>\n\n            <div class=\"input\" v-if=\"resources.length\">\n                <span class=\"label\">Storlek p\u00e5 buss<\/span>\n                <select class=\"bus\" v-model=\"partnerDraft.resource\">\n                    <option :value=\"null\">V\u00e4lj fordon<\/option>\n                    <option v-for=\"resource in resources\" :key=\"resource.id\" :value=\"resource.name\">{{ resource.name }}<\/option>\n                <\/select>\n            <\/div>\n\n            <div class=\"date-time\">\n                <div class=\"input\">\n                    <span class=\"label\">\u00d6nskat datum<\/span>\n                    <button class=\"select\" @click=\"showPartnerCalendarOverlay = true\">\n                        <i class=\"icon icon-calendar\"><\/i>\n                        <span class=\"txt\" v-html=\"partnerSelectDateText\"><\/span>\n                        <i class=\"icon icon-chevron\"><\/i>\n                    <\/button>\n                <\/div>\n\n            <\/div>\n\n            <div class=\"input\">\n                <span class=\"label\">\u00d6nskat guidespr\u00e5k<\/span>\n                <select v-model=\"partnerDraft.guideLanguage\">\n                    <option :value=\"null\">V\u00e4lj spr\u00e5k<\/option>\n                    <option v-for=\"language in partnerGuideLanguages\" :value=\"language\">{{language}}<\/option>\n                <\/select>\n            <\/div>\n\n            <div class=\"input\" v-show=\"partnerDraftPickups\">\n                <span class=\"label\">Upph\u00e4mtning<\/span>\n                <select class=\"from\" v-model=\"partnerDraft.desiredPickup\">\n                    <option v-for=\"pickup in partnerDraftPickups?.pickupLocations\" :value=\"pickup.locationName\" v-html=\"pickup.locationName\"><\/option>\n                <\/select>\n            <\/div>\n\n            <div class=\"input\">\n                <span class=\"label\">Kommentar eller \u00f6nskem\u00e5l<\/span>\n                <input type=\"text\" v-model=\"partnerDraft.comment\">\n            <\/div>\n\n        <\/div>\n\n\n\n\n\n        <div class=\"discount\" v-if=\"overlay.scene == 'discount'\">\n            <div class=\"input required\">\n                <span class=\"label\">Rabattkod<\/span>\n                <input\n                        type=\"text\"\n                        v-model=\"promoDraft.code\"\n                        @input=\"resetPromoDraftValidation\"\n                        @keydown.enter.prevent=\"submitPromoCode\"\n                        :disabled=\"promoDraft.checking\"\n                >\n                <span class=\"descr\" v-if=\"promoDraft.checking\">Verifierar\u2026<\/span>\n                <span class=\"descr\" v-else-if=\"promoDraft.valid === true\">{{ promoDraft.message }}<\/span>\n                <span class=\"descr error\" v-else-if=\"promoDraft.valid === false\">{{ promoDraft.message }}<\/span>\n            <\/div>\n        <\/div>\n\n\n        <div class=\"loading\" v-if=\"overlay.scene == 'loading'\">\n            <p v-show=\"loadingOverlayText.length\">{{ loadingOverlayText }}<\/p>\n            <svg width=\"120\" height=\"30\" viewBox=\"0 0 120 30\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"#000\">\n    <circle cx=\"15\" cy=\"15\" r=\"15\">\n        <animate attributeName=\"r\" from=\"15\" to=\"15\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"15;9;15\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"1\" to=\"1\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"1;.5;1\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n    <circle cx=\"60\" cy=\"15\" r=\"9\" fill-opacity=\"0.3\">\n        <animate attributeName=\"r\" from=\"9\" to=\"9\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"9;15;9\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"0.5\" to=\"0.5\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\".5;1;.5\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n    <circle cx=\"105\" cy=\"15\" r=\"15\">\n        <animate attributeName=\"r\" from=\"15\" to=\"15\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"15;9;15\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n        <animate attributeName=\"fill-opacity\" from=\"1\" to=\"1\"\n                 begin=\"0s\" dur=\"0.8s\"\n                 values=\"1;.5;1\" calcMode=\"linear\"\n                 repeatCount=\"indefinite\" \/>\n    <\/circle>\n<\/svg>\n        <\/div>\n\n\n        <div class=\"booking-error\" v-if=\"overlay.scene == 'bookingError'\">\n            <p v-html=\"booking.error\"><\/p>\n        <\/div>\n\n        <div class=\"message\" v-if=\"overlay.scene == 'message'\">\n            <p v-html=\"message.text\"><\/p>\n        <\/div>\n\n\n        <div class=\"bottom\" v-if=\"showOverlayBottom\">\n            <button class=\"book-btn cancel\" v-if=\"showOverlayCancel\" @click=\"closeOverlay\">\n                Avbryt            <\/button>\n            <div class=\"partner\" v-show=\"overlay.scene === 'partnerBook'\">\n                <button class=\"text remove-item\" :class=\"{show:isEditingPartnerDraft}\" @click=\"removePartnerItem()\">Ta bort bokning<\/button>\n                <span class=\"price\">Pris {{ getFormatedPrice(partnerDraft.product?.price * partnerDraft.travelers) }}<\/span>\n            <\/div>\n            <button class=\"book-cta save\" @click=\"saveOverlay\" :disabled=\"!canSaveOverlay\" v-html=\"overlayCta\"><\/button>\n        <\/div>\n\n    <\/div>\n\n\n\n\n    <div class=\"partner-calendar-overlay\" :class=\"{show: showPartnerCalendarOverlay}\">\n        <div class=\"bkg\"><\/div>\n        <div class=\"inner\">\n            <div class=\"top\">\n                <h5 class=\"title\">V\u00e4lj datum<\/h5>\n                <button class=\"close\" @click=\"showPartnerCalendarOverlay = false\">\n                    <i class=\"icon icon-close\"><\/i>\n                <\/button>\n            <\/div>\n\n            <div class=\"date-only\">\n                <div class=\"calendar\">\n                    <v-date-picker\n                            v-model=\"partnerDraft.desiredDate\"\n                            is-expanded\n                            locale=\"sv\"\n                            :masks=\"{ weekdays: 'WWW'}\"\n                            :min-date=\"new Date()\"\n                    ><\/v-date-picker>\n                <\/div>\n            <\/div>\n\n\n\n            <div class=\"bottom\">\n                <button class=\"book-btn cancel\" @click=\"showPartnerCalendarOverlay = false\">\n                    Avbryt                <\/button>\n                <button class=\"book-cta save\" @click=\"showPartnerCalendarOverlay = false\" :disabled=\"!partnerDraft.desiredDate\">V\u00e4lj datum<\/button>\n            <\/div>\n        <\/div>\n\n    <\/div>\n\n<\/div>\n<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Confirm booking You\u2019re almost done. Fill in your details to book your seat. 1 Resen\u00e4rer Deltagare #{{i + 1}}, {{ item.adult ? &#8216;vuxen&#8217; : &#8216;barn&#8217; }} F\u00f6rnamn Efternamn 2 Betal- och kontaktuppgifter F\u00f6rnamn Efternamn Mobilnummer E-post Land V\u00e4lj land\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500{{item.name}} 3 Till\u00e4gg och \u00f6nskem\u00e5l Upph\u00e4mtningsplats Delad eller privat upplevelse? Delad tur med andra g\u00e4sterPrivat upplevelse Turen [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":6632,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-6659","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/kirunabuss.se\/en\/wp-json\/wp\/v2\/pages\/6659","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kirunabuss.se\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/kirunabuss.se\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/kirunabuss.se\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kirunabuss.se\/en\/wp-json\/wp\/v2\/comments?post=6659"}],"version-history":[{"count":12,"href":"https:\/\/kirunabuss.se\/en\/wp-json\/wp\/v2\/pages\/6659\/revisions"}],"predecessor-version":[{"id":6933,"href":"https:\/\/kirunabuss.se\/en\/wp-json\/wp\/v2\/pages\/6659\/revisions\/6933"}],"up":[{"embeddable":true,"href":"https:\/\/kirunabuss.se\/en\/wp-json\/wp\/v2\/pages\/6632"}],"wp:attachment":[{"href":"https:\/\/kirunabuss.se\/en\/wp-json\/wp\/v2\/media?parent=6659"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}