{"version":3,"file":"00807f14-9b72185e3938ce161cea.js","mappings":"iWAaO,IAAMA,GAAkB,8CAMlB,mBAAQC,EAAAA,SAAAA,MAAR,KANkB,uBAU3B,mBAAOC,EAAAA,GAAAA,MAAP,8DACYD,EAAAA,iBAAAA,WADZ,QAEUA,EAAAA,iBAAAA,EAAAA,GAFV,KAV2B,QAkB3B,mBACGA,EAAD,kBACAA,EADA,gBAEAC,EAAAA,GAAAA,MAFA,mFAIcD,EAJd,kBADF,KAlB2B,QA2B7B,mBAAOE,EAAAA,EAAAA,IACHD,EAAAA,GAAAA,aADJ,gGAIc,WACN,WACE,KAAKE,EAAAA,EAAAA,GAAeH,EAAAA,MAApB,UACE,MAAM,uCACR,mBAAKA,EAAAA,MAAAA,SACH,MAAM,sCACR,QACE,OANJ,KALR,CAIc,IAJd,IAgBIC,EAAAA,GAAAA,QAhBJ,6CAiBY,WACN,WACE,KAAKE,EAAAA,EAAAA,GAAeH,EAAAA,MAApB,UACE,MAAM,wCACR,mBAAKA,EAAAA,MAAAA,SACH,MAAM,sCACR,QACE,OANJ,KAlBN,CAiBY,IAjBZ,aA3B6B,QA0DlBI,GAAc,8EAIdC,GAAmB,qEAK5BJ,EAAAA,GAAAA,MAL4B,+DAWnBK,GAAc,kJASdC,GAAe,qMAaA,mBAAQP,EAAAA,SAAAA,kBAAR,aAbA,qBAcX,mBAAQA,EAAAA,SAAAA,cAAR,iBAdW,uBAeT,mBAAQA,EAAAA,SAAAA,YAAR,QAfS,2BAgBJ,mBAAQA,EAAAA,SAAAA,kBAAR,aAhBI,oSA6BxB,mBAAOC,EAAAA,GAAAA,MAAP,4CACWD,EAAAA,OAAAA,EADX,EA7BwB,qQA8CX,mBAAQA,EAAAA,SAAAA,EAAAA,GAAR,CA9CW,+CAkDxB,mBACAA,EAAAA,WACAE,EAAAA,EAAAA,IACID,EAAAA,GAAAA,MAFJD,IAAAA,GAAAA,EAAAA,EAAAA,GAAAA,CAAAA,wFAAAA,IAOIC,EAAAA,GAAAA,aAPJD,IAAAA,GAAAA,EAAAA,EAAAA,GAAAA,CAAAA,8FAAAA,IAAAA,GAAAA,GAAAA,GAnDwB,O","sources":["webpack://@dnb-web-static-apps/dnb/./src/components/layout/ContactUs/styles.ts"],"sourcesContent":["import styled from '@emotion/styled'\nimport { css } from '@emotion/react'\nimport { media } from '@dnb-shared-libs/responsive'\nimport { isHomeTemplate } from '../../../utils/isHomeTemplate/index'\nimport {\n  MOBILE_BOTTOM_REM,\n  CONCTACT_US_ABSOLUTE_BOTTOM_REM,\n  CONTACT_US_ITEM_HEIGHT_REM,\n  CONTACT_US_MAX_WIDTH_REM,\n  DESKTOP_FIXED_TOP_REM,\n  DESKTOP_FIXED_TOP_LARGE_SCREEN_REM\n} from './constants'\n\nexport const ContactUsContainer = styled.div<{\n  shouldBeAbsolute?: boolean\n  isLandscapeIOS?: boolean\n  windowInnerHeight: string\n  showMenu?: boolean\n}>`\n  z-index: ${(p) => (p.showMenu ? '203' : '200')};\n  left: 0;\n  right: 0;\n\n  ${(p) => media.phone`\n    position: ${p.shouldBeAbsolute ? 'absolute' : 'fixed'};\n    bottom: ${p.shouldBeAbsolute ? CONCTACT_US_ABSOLUTE_BOTTOM_REM : MOBILE_BOTTOM_REM}\n  `}\n\n  ${\n    // CHECKME: DCE-4835 bug on iOS 13- landscape view\n    // top adress panel switch view without compensation bottom edge\n    (p) =>\n      !p.shouldBeAbsolute &&\n      p.isLandscapeIOS &&\n      media.phone`\n        bottom: auto;\n        top: calc(${p.windowInnerHeight} - ${MOBILE_BOTTOM_REM});\n      `\n  }\n\n${(p) => css`\n    ${media.tabletDevice`\n        position: fixed;\n        bottom: auto;\n        top: ${(() => {\n          switch (true) {\n            case isHomeTemplate(p.theme.template):\n              return `calc(var(--header-height) + 1.25rem)`\n            case p.theme.template === 'promotions':\n              return `calc(var(--header-height) + 3.5rem)`\n            default:\n              return DESKTOP_FIXED_TOP_REM\n          }\n        })()}\n      `}\n\n    ${media.desktop`\n      top: ${(() => {\n        switch (true) {\n          case isHomeTemplate(p.theme.template):\n            return `calc(var(--header-height) + 2.875rem)`\n          case p.theme.template === 'promotions':\n            return `calc(var(--header-height) + 6.5rem)`\n          default:\n            return DESKTOP_FIXED_TOP_LARGE_SCREEN_REM\n        }\n      })()}\n      `};\n  `}\n`\n\nexport const ContactUsInner = styled.div`\n  position: relative;\n`\n\nexport const ContactUsButtonWrap = styled.div`\n  position: absolute;\n  top: 0;\n  right: 0;\n\n  ${media.phone`\n    top: auto;\n    bottom: 0;\n  `}\n`\n\nexport const ContactUsLabel = styled.span`\n  position: relative;\n  display: inline-block;\n  flex-shrink: 0;\n  font-size: 1.125rem;\n  max-width: ${CONTACT_US_MAX_WIDTH_REM};\n  overflow: hidden;\n`\n\nexport const ContactUsButton = styled.button<{\n  showMenu?: boolean\n  scrolledToTopOrBottomOfPage?: boolean\n  shouldBeAbsolute?: boolean\n}>`\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  height: ${CONTACT_US_ITEM_HEIGHT_REM};\n  outline: 0;\n  white-space: nowrap;\n  appearance: none;\n  padding: 0 1rem;\n  background-color: var(--${(p) => (p.showMenu ? 'color-sea-green' : 'color-white')});\n  color: var(--${(p) => (p.showMenu ? 'color-white' : 'color-sea-green')});\n  border-radius: ${(p) => (p.showMenu ? '0.3125rem' : '1.5rem')};\n  border-color: var(--${(p) => (p.showMenu ? 'color-sea-green' : 'color-white')});\n  max-width: ${CONTACT_US_MAX_WIDTH_REM};\n  border-style: solid;\n  border-width: 0.125rem;\n  box-shadow: 0 0.0625rem 0.375rem rgba(0, 0, 0, 0.16);\n  cursor: pointer;\n  transition:\n    background-color 0.2s ease-in-out,\n    border-color 0.2s ease-in-out,\n    opacity 0.2s ease-in-out,\n    border-radius 0.2s ease-in-out,\n    padding 0.2s ease-in-out;\n\n  ${(p) => media.phone`\n    opacity: ${p.isHide ? 0 : 1};\n  `}\n\n  html[data-whatintent='mouse'] &:hover,\n  html[data-whatinput='keyboard'] &:focus {\n    border-color: var(--color-sea-green);\n  }\n\n  &:active {\n    background-color: var(--color-mint-green-50);\n    border-color: var(--color-mint-green-50);\n  }\n\n  &:after {\n    content: '';\n    width: ${CONTACT_US_MAX_WIDTH_REM};\n    max-width: ${(p) => (p.showMenu ? CONTACT_US_MAX_WIDTH_REM : 0)};\n    transition: max-width 0.2s ease-in-out;\n  }\n\n  ${(p) =>\n    p.showMenu &&\n    css`\n      ${media.phone`\n        border-top-left-radius: 0;\n        border-top-right-radius: 0;\n      `}\n\n      ${media.tabletDevice`\n        border-bottom-left-radius: 0;\n        border-bottom-right-radius: 0;\n      `}\n    `}\n`\n"],"names":["ContactUsContainer","p","media","css","isHomeTemplate","ContactUsInner","ContactUsButtonWrap","ContactUsLabel","ContactUsButton"],"sourceRoot":""}