{"version":3,"file":"JobPost.Gg-TSIEX.js","sources":["../../../../views/career/JobBenefits.vue","../../../../views/career/JobAudio.vue","../../../../assets/icons/share.svg?component","../../../../views/career/JobPost.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Benefit } from '@mop/ui/components/cms/UiCmsBenefit';\nimport type { CmsContentElementModel } from '@/types/cms';\nimport type { JobModel } from '@/types/jobModel';\n\ndefineOptions({\n  name: 'JobBenefits',\n});\n\nconst props = defineProps({\n  job: {\n    type: Object as PropType<JobModel>,\n    required: true,\n  },\n  elements: {\n    type: Array as PropType<CmsContentElementModel[]>,\n    required: true,\n  },\n});\n\nconst benefitsRef = computed(() => {\n  const cmsNotReady = !props.elements;\n  if (cmsNotReady) {\n    return {};\n  }\n  let benefits: Benefit;\n  let defaultBenefits: any;\n  const departmentId = props.job.getDepartmentId();\n  const countryId = props.job.getCountryId();\n  props.elements.forEach((element) => {\n    const item = element.getData();\n    if (!benefits && item.departmentGroup.includes(departmentId)) {\n      benefits = item;\n    }\n    if (!defaultBenefits && item.departmentGroup.includes('default')) {\n      defaultBenefits = item;\n    }\n  });\n  benefits ??= defaultBenefits;\n  if (!benefits) {\n    return {};\n  }\n  benefits.body = benefits.body.filter(\n    (item: any) => !item.countryList || item.countryList.length === 0 || item.countryList.includes(countryId),\n  );\n  return benefits;\n});\n</script>\n\n<template>\n  <div class=\"jobs-benefits-wrapper\">\n    <UiCmsBenefit :data=\"benefitsRef\" />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport type { CmsContentElementModel } from '@/types/cms';\nimport type { JobModel } from '@/types/jobModel';\n\ndefineOptions({\n  name: 'JobAudio',\n});\n\nconst props = defineProps({\n  job: {\n    type: Object as PropType<JobModel>,\n    required: true,\n  },\n  elements: {\n    type: Array as PropType<CmsContentElementModel[]>,\n    required: true,\n  },\n});\n\nfunction getFiltersMatch({\n  departmentId,\n  countryId,\n  careerLevelId,\n}: {\n  departmentId?: string;\n  countryId?: string;\n  careerLevelId?: string;\n}) {\n  return props.elements.find((element) => {\n    const item = element.getData();\n    const foundDepartmentGroup =\n      (!departmentId && !item.departmentGroups.length) || item.departmentGroups.includes(departmentId);\n    const foundCountry = (!countryId && !item.countryList.length) || item.countryList.includes(countryId);\n    const foundCareerLevel = (!careerLevelId && !item.careerLevels.length) || item.careerLevels.includes(careerLevelId);\n    return foundDepartmentGroup && foundCountry && foundCareerLevel;\n  });\n}\n\nconst audioModuleDataRef = computed(() => {\n  const jobId = props.job.getId();\n\n  // PRIO 1: job ids match\n  let audioData = props.elements.find((element) => {\n    const item = element.getData();\n    return item.jobIds.some((idItem: any) => idItem.id.trim() === jobId);\n  });\n\n  if (!audioData) {\n    // PRIO 2: filter combi matches\n    const departmentId = props.job.getDepartmentId();\n    const countryId = props.job.getCountryId();\n    const careerLevelId = props.job.getCareerLevelId();\n\n    audioData = getFiltersMatch({ departmentId, countryId, careerLevelId });\n\n    if (!audioData) {\n      audioData = getFiltersMatch({ departmentId, countryId });\n    }\n\n    if (!audioData) {\n      audioData = getFiltersMatch({ departmentId, careerLevelId });\n    }\n\n    if (!audioData) {\n      audioData = getFiltersMatch({ countryId, careerLevelId });\n    }\n\n    if (!audioData) {\n      audioData = getFiltersMatch({ departmentId });\n    }\n\n    if (!audioData) {\n      audioData = getFiltersMatch({ countryId });\n    }\n\n    if (!audioData) {\n      audioData = getFiltersMatch({ careerLevelId });\n    }\n  }\n  return audioData?.getData();\n});\n</script>\n\n<template>\n  <div v-if=\"audioModuleDataRef\" class=\"job-post__audio\">\n    <MopCmsCompanyAudio :data=\"audioModuleDataRef\" />\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.job-post__audio {\n  margin-top: 60px;\n  margin-left: -$global-padding;\n  margin-right: -$global-padding;\n}\n</style>\n","import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = {\n  xmlns: \"http://www.w3.org/2000/svg\",\n  viewBox: \"0 0 44.291 44.292\"\n}\nconst _hoisted_2 = /*#__PURE__*/_createElementVNode(\"path\", {\n  d: \"m36.759 14.679-9.412 11.206-9.409 11.211.152-15.631L7.933 9.589l14.413 2.545zm-.37.134L18.09 21.465\",\n  style: {\"fill\":\"none\",\"stroke\":\"#000\",\"stroke-linecap\":\"round\",\"stroke-linejoin\":\"round\",\"stroke-width\":\"2px\",\"isolation\":\"isolate\"}\n}, null, -1)\nconst _hoisted_3 = [\n  _hoisted_2\n]\n\nexport function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", _hoisted_1, [..._hoisted_3]))\n}\nexport default { render: render }","<script setup lang=\"ts\">\nimport SVGHeart from '@mop/shared/images/misc/header-heart.svg?component';\nimport SVGHeartFilled from '@mop/shared/images/misc/heart-filled.svg?component';\nimport SVGMopLogo from '@mop/shared/images/logo/logo_mop.svg?component';\nimport SVGMopLogoSignet from '@mop/shared/images/logo/logo_mop_signet.svg?component';\nimport type { ObserveScrollConfig, ActionPosition } from '@mop/types/index';\nimport { getHtmlFromRichText } from '@mop/cms/utils/utils';\nimport JobBenefits from './JobBenefits.vue';\nimport JobAudio from './JobAudio.vue';\nimport type { Alternate, SeoBreadcrumb, CmsContentElementModel } from '@/types/cms';\nimport SVGShare from '@/assets/icons/share.svg?component';\n\ndefineOptions({\n  name: 'JobPost',\n});\n\nconst { $gtm, $urls, $mopI18n, $storyblokLivePreview } = useNuxtApp();\nconst route = useRoute();\nconst router = useRouter();\nconst classNameRef = ref(['']);\nconst loadingRef = ref({\n  loading: true,\n});\nconst { toggleWishlistItem, wishlistItemExists } = useMopWishlist();\nconst showShareRef = ref(false);\nconst { getCmsStory, trackPageView, cmsStoryModelRef } = useMopCms();\nconst { fetchJob, fetchAllJobs, jobItemRef, getJobIdFromPath } = useMopJob();\nconst { initTransition } = useMopPageTransitionClient();\nconst { getJobSchema, getHeadObject, getAlternatesFromStory, getBreadcrumbSchema, setAlternates } = useMopSeo();\nconst jobId = getJobIdFromPath(route.params.jobId as string);\ninitTransition(classNameRef, loadingRef);\n// TODO: finish when ready\nconst fullPath = window.location.href;\nconst applyNowLinkRef: Ref<string> = ref('');\nconst socialMediaLinksRef: Ref<{ [key: string]: string }> = ref({\n  email: '',\n  facebook: '',\n  linkedin: '',\n  twitter: '',\n  whatsapp: '',\n});\nconst isHeaderStickyRef = ref(false);\nconst isHeaderPrepareStickyRef = ref(false);\n\nonMounted(async () => {\n  const [language] = await Promise.all([fetchJob(jobId), fetchAllJobs()]);\n  if (!jobItemRef.value.getId() && !$storyblokLivePreview.isEnabledInIframe) {\n    router.replace($mopI18n.localePath($urls.CAREER_PAGE));\n    return;\n  } else {\n    socialMediaLinksRef.value = getMediaSiteLinks({\n      url: fullPath,\n      title: jobItemRef.value.getTitle(),\n    });\n    await getCmsStory('/career/start-creating-with-us/our-jobs/vacancy', {\n      language: language || 'default',\n    });\n    applyNowLinkRef.value = jobItemRef.value.isFranchiseDepartment()\n      ? `mailto:${getFranchiseContact()}?subject=${cmsStoryModelRef.value.getAttribute('franchiseEmailSubject')}`\n      : $mopI18n.localePath(`${$urls.CAREER_APPLY_PAGE}/${jobId}`);\n    trackPageView('Career');\n    $gtm.trackEvent({\n      eventName: 'view_item',\n      customValue: {\n        items: [jobItemRef.value.getGtmTrackData()],\n      },\n    });\n  }\n\n  const jobItemPath = jobItemRef.value.getUrl();\n\n  if (!route.path.includes(jobItemPath)) {\n    await router.replace($mopI18n.localePath(`${$urls.CAREER_PAGE}/${jobItemPath}`));\n  }\n\n  loadingRef.value.loading = false;\n});\n\nconst jobItemHeaderElementsRef = computed(() => {\n  const headerBlock = cmsStoryModelRef.value.getContentElements('header');\n  let headerBannerElement;\n  if (headerBlock.length === 0) {\n    return [];\n  }\n  const divisionId = jobItemRef.value.getDivisionId();\n  headerBannerElement = headerBlock.find((element) => element?.getData()?.divisionGroup?.includes(divisionId));\n  const defaultHeaderBannerElement = headerBlock.find(\n    (element) => element?.getData()?.divisionGroup?.includes('default'),\n  );\n\n  headerBannerElement ??= defaultHeaderBannerElement;\n  return [headerBannerElement] as CmsContentElementModel[];\n});\n\nconst startDateRef = computed(() => {\n  return (\n    jobItemRef.value.getFutureLocaleStartDate() || cmsStoryModelRef.value.getAttribute('sublineStartDateImmediately')\n  );\n});\n\nconst scopeTextRef = computed(() => {\n  return (\n    cmsStoryModelRef.value\n      .getContentElements('scopes')\n      .find((scope) => {\n        return scope.getData().scopeId === jobItemRef.value.getScopeId();\n      })\n      ?.getData().title || jobItemRef.value.getScope()\n  );\n});\n\nconst metaDataRef = computed(() => {\n  const careerLink: string = $mopI18n.localePath($urls.CAREER);\n  const startCreatingLink: string = $mopI18n.localePath($urls.CAREER_START_CREATING);\n  const ourJobsLink: string = $mopI18n.localePath($urls.CAREER_PAGE);\n  const title = jobItemRef.value.getTitle();\n  const description = cmsStoryModelRef.value?.getSeo()?.description?.replace('{job-title}', title) || title;\n  const isIndexable = true;\n  const canonical = route.path;\n  let alternates: Alternate[] = getAlternatesFromStory(cmsStoryModelRef.value);\n  alternates = alternates.map((alternate: Alternate) => {\n    const hrefSplit: string[] = alternate.href.split('/');\n    hrefSplit.splice(-1);\n    const href = `${hrefSplit.join('/')}/${jobItemRef.value.getUrl()}`;\n    return {\n      href,\n      lang: alternate.lang,\n    };\n  });\n  setAlternates(alternates);\n\n  const breadcrumbs: SeoBreadcrumb[] = [\n    {\n      name: $mopI18n.t('locale.blog.name_career'),\n      url: careerLink,\n    },\n    {\n      name: $mopI18n.t('locale.jobs.start_creating_with_us'),\n      url: startCreatingLink,\n    },\n    {\n      name: $mopI18n.t('locale.jobs.search_button'),\n      url: ourJobsLink,\n    },\n    {\n      name: title,\n      url: route.path,\n    },\n  ];\n  const ogDescription = jobItemRef.value.getDescription1();\n  const ogImage = cmsStoryModelRef.value?.getAttribute('ogImage');\n  const headObject = getHeadObject({\n    title,\n    description,\n    isIndexable,\n    canonical,\n    alternates,\n    ogDescription,\n    ogImage,\n  });\n  // @ts-ignore\n  headObject.script = [getJobSchema(jobItemRef.value)];\n  return { ...headObject, ...getBreadcrumbSchema(breadcrumbs) };\n});\n\nconst headerStickyConfig: ObserveScrollConfig = {\n  calculateActionPositions: (element) => {\n    const stickyStartPosition = element?.offsetTop;\n    const actionPositionNotSticky: ActionPosition = {\n      onEnter: () => {\n        isHeaderStickyRef.value = false;\n        isHeaderPrepareStickyRef.value = false;\n      },\n      positionStart: 0,\n      positionEnd: stickyStartPosition,\n    };\n\n    const actionPositionSticky: ActionPosition = {\n      onEnter: () => {\n        isHeaderPrepareStickyRef.value = true;\n        isHeaderStickyRef.value = true;\n      },\n      // @ts-ignore\n      positionStart: stickyStartPosition,\n    };\n\n    const actionPositionScrollUp: ActionPosition = {\n      onEnter: () => {\n        isHeaderStickyRef.value = false;\n        isHeaderPrepareStickyRef.value = true;\n      },\n      // @ts-ignore\n      positionStart: stickyStartPosition,\n      scrollDirection: constants.SCROLL_DIRECTION_UP,\n    };\n\n    return [actionPositionNotSticky, actionPositionSticky, actionPositionScrollUp];\n  },\n};\n\nfunction fixedEncodeURIComponent(str: string) {\n  return encodeURIComponent(str).replace(/[!'()*]/g, (c) => '%' + c.charCodeAt(0).toString(16));\n}\n\n// taken from https://github.com/bradvin/social-share-urls/blob/master/code/javascript/javascript/social-share-media.js\nfunction getMediaSiteLinks(args: any) {\n  const url = fixedEncodeURIComponent(args.url);\n  const title = fixedEncodeURIComponent(args.title);\n\n  return {\n    email: 'mailto:?subject=' + title + '&body=' + url,\n    facebook: 'https://www.facebook.com/sharer.php?u=' + url,\n    linkedin: 'https://www.linkedin.com/sharing/share-offsite/?url=' + url,\n    twitter: 'https://twitter.com/intent/tweet?url=' + url + '&text=' + title + '&via=&hashtags=',\n    whatsapp: 'https://api.whatsapp.com/send?text=' + title + '%20' + url,\n  };\n}\n\nfunction toggleShare() {\n  showShareRef.value = !showShareRef.value;\n}\n\nfunction closeTogleShare() {\n  showShareRef.value = false;\n}\n\nfunction handleCopyLink() {\n  navigator.clipboard.writeText(fullPath);\n}\n\nfunction trackJobPostClick(eventName: string, parameters: Array<any>) {\n  $gtm.trackEvent({\n    eventName,\n    parameters,\n  });\n}\n\nfunction getFranchiseContact() {\n  const whoWeAre = jobItemRef.value.getWhoWeAre() || '';\n  const matches = whoWeAre.match(/\\(<strong>(.*@.*\\..*)<\\/strong>\\)/);\n  return matches?.length && matches?.length > 1 ? matches[1] : '';\n}\n\n$storyblokLivePreview.initStoryListener('Storyblok', cmsStoryModelRef);\n\nuseHead(metaDataRef);\n</script>\n\n<template>\n  <div\n    :class=\"[\n      'job-post',\n      'transition',\n      {\n        'job-post--sticky-header-prepare': isHeaderPrepareStickyRef,\n        'job-post--sticky-header': isHeaderStickyRef,\n      },\n      ...classNameRef,\n    ]\"\n    @click=\"closeTogleShare\"\n  >\n    <MopPageLoad :class=\"classNameRef\" />\n\n    <div class=\"transition-content\">\n      <MopCmsContentElementsSlot\n        v-if=\"jobItemHeaderElementsRef\"\n        id=\"job-post\"\n        class=\"job-post__content\"\n        :elements=\"jobItemHeaderElementsRef\"\n      />\n      <div class=\"job-post__head-sticky\">\n        <div class=\"job-post__head-wrap\">\n          <NuxtLink class=\"job-post__headline-logo-link\" :to=\"$mopI18n.localePath('')\" no-prefetch>\n            <SVGMopLogoSignet width=\"30\" height=\"30\" />\n          </NuxtLink>\n          <div class=\"job-post__headline-wrap\">\n            <h1 class=\"job-post__headline\">\n              {{ jobItemRef.getTitle() }}\n            </h1>\n            <div class=\"job-post__subline\">\n              <div class=\"job-post__subline-text\">\n                {{ cmsStoryModelRef.getAttribute('sublineStartDate') }}:\n                {{ startDateRef }}\n                - {{ scopeTextRef }} - {{ jobItemRef.getDepartment() }} - {{ jobItemRef.getFullAddress() }}\n              </div>\n            </div>\n            <div class=\"job-post__apply-top-wrap--desktop-only job-post__apply-top-wrap\">\n              <NuxtLink\n                :to=\"applyNowLinkRef\"\n                class=\"job-post__apply-top\"\n                :style=\"{ '--bg-color': $mopConfig.getApplyNowButtonColor() }\"\n                no-prefetch\n                @click=\"trackJobPostClick('apply_now', ['click', 'intern'])\"\n              >\n                {{ cmsStoryModelRef.getAttribute('labelApply') }}\n              </NuxtLink>\n            </div>\n          </div>\n          <div class=\"job-post__headline-actions\">\n            <div class=\"job-post__share-wrap\">\n              <button class=\"job-post__share\" @click.stop.prevent=\"toggleShare\">\n                <SVGShare />\n              </button>\n              <button class=\"job-post__wishlist\" @click.stop.prevent=\"() => toggleWishlistItem(jobItemRef)\">\n                <SVGHeart v-if=\"!wishlistItemExists(jobItemRef.getId())\" width=\"27\" height=\"25\" />\n                <SVGHeartFilled v-else width=\"27\" height=\"25\" />\n              </button>\n\n              <div\n                class=\"job-post__share-list\"\n                :class=\"{\n                  'job-post__share-list--visible': showShareRef,\n                }\"\n                @click.stop\n              >\n                <a\n                  v-for=\"platform in Object.keys(socialMediaLinksRef)\"\n                  :key=\"platform\"\n                  :href=\"socialMediaLinksRef[platform]\"\n                  target=\"_blank\"\n                  class=\"job-post__share-link\"\n                  rel=\"noopener noreferrer\"\n                  @click=\"\n                    trackJobPostClick('vacancy_social_share', [\n                      'share',\n                      $gtm.getCurrentPageType(),\n                      platform,\n                      jobItemRef.getTitle(),\n                    ])\n                  \"\n                >\n                  {{ platform }}\n                </a>\n                <button class=\"job-post__share-link\" @click=\"handleCopyLink\">\n                  {{ 'copy link' }}\n                </button>\n              </div>\n            </div>\n            <div class=\"job-post__apply\">\n              <NuxtLink\n                :to=\"applyNowLinkRef\"\n                class=\"job-post__apply-now\"\n                :style=\"{ '--bg-color': $mopConfig.getApplyNowButtonColor() }\"\n                no-prefetch\n                @click=\"trackJobPostClick('apply_now', ['click', 'intern'])\"\n              >\n                {{ cmsStoryModelRef.getAttribute('labelApply') }}\n              </NuxtLink>\n              <!--\n                  <button\n                    class=\"job-post__apply-external\"\n                    @click=\"$gtm.trackEvent({\n                      eventName: 'apply_now',\n                      parameters: ['click', 'linkedin']\n                    });\"\n                  >\n                    {{ 'LN' }}\n                  </button>\n                  <button\n                    class=\"job-post__apply-external\"\n                    @click=\"$gtm.trackEvent({\n                      eventName: 'apply_now',\n                      parameters: ['click', 'xing']\n                    });\"\n                  >\n                    {{ 'XN' }}\n                  </button>\n    -->\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div v-observe-scroll=\"headerStickyConfig\" class=\"job-post__section\">\n        <h3 v-html=\"cmsStoryModelRef.getAttribute('headlineWhoWeAre')\" />\n        <div v-if=\"jobItemRef.getWhoWeAre()\" id=\"about-us\" class=\"job-post__text\" v-html=\"jobItemRef.getWhoWeAre()\" />\n        <MopCmsContentElementsSlot\n          v-else\n          id=\"about-us\"\n          class=\"job-post__content\"\n          :elements=\"cmsStoryModelRef.getContentElements('whoWeAre')\"\n        />\n      </div>\n\n      <div class=\"job-post__section\">\n        <h3 v-html=\"cmsStoryModelRef.getAttribute('headlineWhatYouCanCreate')\" />\n        <div class=\"job-post__text\" v-html=\"jobItemRef.getDescription1()\" />\n      </div>\n\n      <div class=\"job-post__section\">\n        <h3 v-html=\"cmsStoryModelRef.getAttribute('headlineWhoYouAre')\" />\n        <div class=\"job-post__text\" v-html=\"jobItemRef.getDescription2()\" />\n      </div>\n\n      <div class=\"job-post__section\">\n        <h3 v-html=\"cmsStoryModelRef.getAttribute('headlineJobBenefits')\" />\n        <div\n          v-if=\"jobItemRef.isFranchiseDepartment() || jobItemRef.isConcessionDepartment()\"\n          v-html=\"getHtmlFromRichText(cmsStoryModelRef.getAttribute('contractDepartmentBenefitsText'))\"\n        />\n        <JobBenefits v-else :elements=\"cmsStoryModelRef.getContentElements('benefits')\" :job=\"jobItemRef\" />\n      </div>\n\n      <div class=\"job-post__section job-post__section--believe\">\n        <MopCmsContentElementsSlot\n          id=\"what-we-believe-in\"\n          class=\"job-post__content\"\n          :elements=\"cmsStoryModelRef.getContentElements('whatWeBelieveIn')\"\n        />\n        <SVGMopLogo class=\"job-post__mop-logo\" width=\"190\" height=\"40\" />\n      </div>\n\n      <template v-if=\"!jobItemRef.isFranchiseDepartment()\">\n        <div class=\"job-post__section\">\n          <h3 v-html=\"cmsStoryModelRef.getAttribute('headlineHrContact')\" />\n          <p>\n            {{ jobItemRef.getHrName() }} {{ cmsStoryModelRef.getAttribute('labelHrName') }}<br />\n            {{ cmsStoryModelRef.getAttribute('labelHrContact') }}\n            <a :href=\"`mailto:${jobItemRef.getHrMail()}`\">\n              {{ jobItemRef.getHrMail() }}\n            </a>\n          </p>\n        </div>\n\n        <div class=\"job-post__section job-post__section--hr-contact\">\n          <MopCmsContentElementsSlot\n            id=\"hr-contact-section\"\n            :elements=\"cmsStoryModelRef.getContentElements('hrContact')\"\n          />\n        </div>\n      </template>\n\n      <div class=\"job-post__section\">\n        <MopCmsContentElementsSlot\n          id=\"career-blog\"\n          class=\"job-post__content\"\n          :elements=\"cmsStoryModelRef.getContentElements('careerBlog')\"\n        />\n      </div>\n\n      <div class=\"job-post__apply-bottom\">\n        <NuxtLink\n          :to=\"applyNowLinkRef\"\n          class=\"job-post__apply-now-bottom\"\n          :style=\"{ '--bg-color': $mopConfig.getApplyNowButtonColor() }\"\n          no-prefetch\n          @click=\"trackJobPostClick('apply_now', ['click', 'intern'])\"\n        >\n          {{ cmsStoryModelRef.getAttribute('labelApply') }}\n        </NuxtLink>\n      </div>\n      <JobAudio :elements=\"cmsStoryModelRef.getContentElements('audios')\" :job=\"jobItemRef\" />\n    </div>\n  </div>\n</template>\n\n<style lang=\"scss\" scoped>\n.job-post {\n  padding: 0 $global-padding;\n}\n\n.job-post__head-wrap {\n  margin: $space15 0 0;\n  padding-bottom: $space10;\n  display: flex;\n  justify-content: space-between;\n  transition: transform 0.3s ease;\n\n  @include apply-upto(small) {\n    flex-direction: column;\n  }\n}\n\n.job-post__content {\n  margin-left: -$global-padding;\n  margin-right: -$global-padding;\n}\n\n.job-post__headline {\n  @include text-style(strong);\n\n  font-size: 40px;\n  line-height: 40px;\n  margin: 0;\n  text-transform: uppercase;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n\n  @include apply-upto(medium) {\n    font-size: 22px;\n    line-height: 22px;\n  }\n}\n\n.job-post__headline-logo-link {\n  display: none;\n}\n\n.job-post__subline {\n  margin: $space5 0 0;\n  display: flex;\n  justify-content: space-between;\n}\n\n.job-post__headline-actions {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  position: relative;\n\n  @include apply-upto(small) {\n    flex-direction: row;\n    align-items: center;\n    justify-content: space-between;\n    margin-top: $space20;\n  }\n}\n\n.job-post__subline-text {\n  @include text-style(strong);\n\n  font-size: 14px;\n  line-height: 14px;\n}\n\n.job-post__apply {\n  display: none;\n  margin-top: $space30;\n\n  @include apply-upto(small) {\n    display: flex;\n    margin: 0;\n    order: -1;\n  }\n}\n\n.job-post__apply-now,\n.job-post__apply-top,\n.job-post__apply-now-bottom,\n.job-post__apply-external {\n  @include text-style(strong);\n\n  background: var(--bg-color, $black);\n  color: $white;\n  text-transform: uppercase;\n  padding: 16px $space20;\n  margin: 0 0 0 $space10;\n  border: 0;\n  line-height: 18px;\n  white-space: nowrap;\n\n  @include apply-upto(small) {\n    line-height: 15px;\n    margin: 0;\n  }\n}\n\n.job-post__apply-now-bottom {\n  margin: 0;\n}\n\n.job-post__apply-top-wrap {\n  margin: $space30 0 0;\n}\n\n.job-post__wishlist {\n  background: $white;\n  height: 47px;\n  width: 47px;\n  bottom: 0;\n  border: 1px solid $black;\n  line-height: 0;\n  cursor: pointer;\n  color: $black;\n  overflow: hidden;\n  padding: 0;\n  margin: 0;\n}\n\n.job-post__share {\n  background: $white;\n  height: 47px;\n  width: 47px;\n  bottom: 0;\n  border: 1px solid $black;\n  border-right: 0;\n  line-height: 0;\n  cursor: pointer;\n  color: $black;\n  padding: 0;\n  margin: 0;\n\n  svg {\n    width: 30px;\n  }\n}\n\n.job-post__apply-external {\n  padding: 8px 6px 8px 7px;\n}\n\n.job-post__section {\n  margin: $space30 0 0;\n  &:deep(h3) {\n    @include text-style(strong);\n\n    margin: 0 0 $space15;\n    font-size: 16px;\n    line-height: 16px;\n    text-transform: uppercase;\n  }\n\n  &:deep(p) {\n    @include text-style(common);\n\n    margin-bottom: 0;\n  }\n}\n\n.job-post__section--hr-contact {\n  margin: 0 -#{$global-padding};\n}\n\n.job-post__section--believe {\n  display: grid;\n  grid-template-columns: 1fr 400px;\n\n  @include apply-upto(medium) {\n    grid-template-columns: 1fr 300px;\n  }\n\n  @include apply-upto(small) {\n    grid-template-columns: 1fr;\n  }\n\n  &:deep(p) {\n    @include text-style(strong);\n\n    font-size: 16px;\n    line-height: 18px;\n    color: $surface-gray;\n    text-transform: uppercase;\n    margin-bottom: 0;\n  }\n\n  svg {\n    justify-self: center;\n    align-self: center;\n\n    @include apply-upto(small) {\n      justify-self: start;\n      margin: $space20 0 $space10;\n    }\n  }\n}\n\n.job-post__text {\n  @include text-style(common);\n\n  // comming from api\n  &:deep(ul) {\n    padding-left: $space20;\n  }\n  &:deep(li) {\n    @include text-style(common);\n\n    list-style: disc;\n    margin-left: $space5;\n    margin-top: $space5;\n    padding-left: $space10;\n  }\n}\n\n.job-post__share-wrap {\n  display: flex;\n}\n\n.job-post__share-list {\n  position: absolute;\n  width: 180px;\n  border: 1px solid $black;\n  top: 50px;\n  right: 0;\n  font-size: 13px;\n  line-height: 13px;\n  padding: $space20 $space10;\n  border-radius: 4px;\n  opacity: 0;\n  visibility: hidden;\n  transition: opacity 0.3s ease;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n\n  &::after,\n  &::before {\n    content: '';\n    position: absolute;\n    width: 0;\n    height: 0;\n    transform: rotate(90deg);\n  }\n\n  &::before {\n    top: -18px;\n    right: 60px;\n    border-top: 12px solid transparent;\n    border-bottom: 12px solid transparent;\n    border-right: 12px solid $black;\n  }\n\n  &::after {\n    top: -15px;\n    right: 61px;\n    border-top: 10px solid transparent;\n    border-bottom: 10px solid transparent;\n    border-right: 10px solid $white;\n  }\n}\n\n.job-post__share-list--visible {\n  @include z(global, content);\n\n  visibility: visible;\n  opacity: 1;\n  background: $white;\n}\n\n.job-post__share-link {\n  @include link-not-underlined(5px);\n  @include text-style(strong);\n\n  text-transform: uppercase;\n}\n\n.job-post--sticky-header-prepare {\n  .job-post__head-sticky {\n    padding-bottom: 100px;\n  }\n\n  .job-post__share-list {\n    &::before {\n      right: 38px;\n    }\n\n    &::after {\n      right: 39px;\n    }\n  }\n\n  .job-post__apply-top-wrap {\n    display: none;\n  }\n\n  .job-post__share,\n  .job-post__wishlist {\n    height: 29px;\n    width: 29px;\n\n    svg {\n      width: unset;\n    }\n  }\n\n  .job-post__apply-now {\n    padding: 7px $space15;\n    line-height: 15px;\n  }\n\n  .job-post__head-wrap {\n    @include z(layers, superbanner);\n\n    transform: translateY(-20px);\n    height: $header-height;\n    top: -$header-height;\n    width: auto;\n    left: 0;\n    right: 0;\n    position: fixed;\n    background: $white;\n    padding: 0 $global-padding;\n    margin: 0;\n    align-items: center;\n\n    @include apply-only-touch-device {\n      height: $mobile-header-height;\n      top: -$mobile-header-height;\n      justify-content: space-between;\n      flex-direction: row;\n    }\n\n    @include apply-upto(medium) {\n      height: $mobile-header-height;\n      top: -$mobile-header-height;\n      justify-content: flex-end;\n      flex-direction: row;\n    }\n  }\n\n  .job-post__subline-text {\n    @include text-style(common);\n  }\n\n  .job-post__headline,\n  .job-post__subline-text {\n    font-size: 13px;\n    line-height: 13px;\n  }\n\n  .job-post__headline-actions {\n    flex-direction: row;\n    align-items: center;\n\n    @include apply-upto(medium) {\n      margin: 0;\n    }\n  }\n\n  .job-post__apply {\n    display: flex;\n    margin: 0 $space10;\n    order: -1;\n  }\n\n  .job-post__headline-wrap {\n    padding-left: 50px;\n\n    @include apply-upto(medium) {\n      display: none;\n    }\n  }\n\n  .job-post__headline-logo-link {\n    position: absolute;\n    left: $global-padding;\n    display: block;\n\n    @include apply-only-touch-device {\n      top: 12px;\n    }\n  }\n}\n\n.job-post--sticky-header-prepare.job-post--sticky-header {\n  .job-post__head-wrap {\n    transform: translateY(100%);\n  }\n}\n\n.job-post__apply-bottom,\n.job-post__apply-top {\n  margin: $space30 0 0;\n}\n\n.job-post__apply-top-wrap--desktop-only {\n  @include apply-upto(small) {\n    display: none;\n  }\n}\n</style>\n"],"names":["props","__props","benefitsRef","computed","benefits","defaultBenefits","departmentId","countryId","element","item","getFiltersMatch","careerLevelId","foundDepartmentGroup","foundCountry","foundCareerLevel","audioModuleDataRef","jobId","audioData","idItem","_hoisted_1","_hoisted_2","_createElementVNode","_hoisted_3","render","_ctx","_cache","_openBlock","_createElementBlock","SVGShare","$gtm","$urls","$mopI18n","$storyblokLivePreview","useNuxtApp","route","useRoute","router","useRouter","classNameRef","ref","loadingRef","toggleWishlistItem","wishlistItemExists","useMopWishlist","showShareRef","getCmsStory","trackPageView","cmsStoryModelRef","useMopCms","fetchJob","fetchAllJobs","jobItemRef","getJobIdFromPath","useMopJob","initTransition","useMopPageTransitionClient","getJobSchema","getHeadObject","getAlternatesFromStory","getBreadcrumbSchema","setAlternates","useMopSeo","fullPath","applyNowLinkRef","socialMediaLinksRef","isHeaderStickyRef","isHeaderPrepareStickyRef","onMounted","language","getMediaSiteLinks","getFranchiseContact","jobItemPath","jobItemHeaderElementsRef","headerBlock","headerBannerElement","divisionId","_b","_a","defaultHeaderBannerElement","startDateRef","scopeTextRef","scope","metaDataRef","careerLink","startCreatingLink","ourJobsLink","title","description","_c","isIndexable","canonical","alternates","alternate","hrefSplit","breadcrumbs","ogDescription","ogImage","_d","headObject","headerStickyConfig","stickyStartPosition","actionPositionNotSticky","actionPositionSticky","actionPositionScrollUp","constants","fixedEncodeURIComponent","str","c","args","url","toggleShare","closeTogleShare","handleCopyLink","trackJobPostClick","eventName","parameters","matches","useHead"],"mappings":"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"}