{
  "version": 3,
  "sources": ["../javascripts/styled-components/components/Container/index.tsx"],
  "sourcesContent": ["import styled, { css } from 'styled-components';\n\ninterface ContainerProps {\n  $narrow?: boolean;\n  $size?: 'small' | 'medium' | 'large';\n  $bleedMobile?: boolean;\n}\n\nexport const Container = styled.div.withConfig({ componentId: 'sc-19lriw1-0' })<ContainerProps>`\n    width: 100%;\n    max-width: ${(props) => props.theme.size.containerMaxWidth};\n    margin-left: auto;\n    margin-right: auto;\n    padding: 0 ${(props) => props.theme.size.containerGutter};\n    padding-left: max(env(safe-area-inset-left), ${(props) => props.theme.size.containerGutter});\n    padding-right: max(env(safe-area-inset-right), ${(props) => props.theme.size.containerGutter});\n\n    ${(props) => props.theme.breakpoint.LtMd} {\n        padding: 0 ${(props) => props.theme.size.containerGutterLtMd};\n    }\n\n    ${({ $size }) =>\n      $size === 'medium' &&\n      css`\n            max-width: 920px;\n        `}\n\n    ${({ $size }) =>\n      $size === 'small' &&\n      css`\n            max-width: 728px;\n        `}\n\n    ${({ $bleedMobile }) =>\n      $bleedMobile &&\n      css`\n            ${(props) => props.theme.breakpoint.LtMd} {\n                padding-left: 0;\n                padding-right: 0;\n            }\n        `}\n`;\n"],
  "mappings": "sDAQO,IAAMA,EAAYC,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA,iBAE5DC,GAAUA,EAAM,MAAM,KAAK,iBAAiB;AAAA;AAAA;AAAA,iBAG5CA,GAAUA,EAAM,MAAM,KAAK,eAAe;AAAA,mDACRA,GAAUA,EAAM,MAAM,KAAK,eAAe;AAAA,qDACxCA,GAAUA,EAAM,MAAM,KAAK,eAAe;AAAA;AAAA,MAEzFA,GAAUA,EAAM,MAAM,WAAW,IAAI;AAAA,qBACtBA,GAAUA,EAAM,MAAM,KAAK,mBAAmB;AAAA;AAAA;AAAA,MAG9D,CAAC,CAAE,MAAAC,CAAM,IACTA,IAAU,UACVC;AAAA;AAAA,SAEG;AAAA;AAAA,MAEH,CAAC,CAAE,MAAAD,CAAM,IACTA,IAAU,SACVC;AAAA;AAAA,SAEG;AAAA;AAAA,MAEH,CAAC,CAAE,aAAAC,CAAa,IAChBA,GACAD;AAAA,cACSF,GAAUA,EAAM,MAAM,WAAW,IAAI;AAAA;AAAA;AAAA;AAAA,SAI3C;",
  "names": ["Container", "dt", "props", "$size", "lt", "$bleedMobile"]
}