{"version":3,"file":"Progress.css.cjs","sources":["../../../src/components/Progress/Progress.css.ts"],"sourcesContent":["import { css, keyframes } from '@stylefusion/react';\n\nconst stripesAnimation = keyframes({\n  '0%': {\n    backgroundPosition: '0 0',\n  },\n  '100%': {\n    backgroundPosition: '40px 0',\n  },\n});\n\nexport const ProgressRootStyle = css(({ theme }) => ({\n  '--progress-radius': 'var(--raikou-radius-default)',\n  '--progress-size': 'var(--progress-size-md)',\n\n  '--progress-size-xs': '3px',\n  '--progress-size-sm': '5px',\n  '--progress-size-md': '8px',\n  '--progress-size-lg': '12px',\n  '--progress-size-xl': '16px',\n\n  position: 'relative',\n  height: 'var(--progress-size)',\n  borderRadius: 'var(--progress-radius)',\n  overflow: 'hidden',\n  display: 'flex',\n\n  ...theme.applyStyles('light', {\n    backgroundColor: theme.colors.gray[2],\n  }),\n\n  ...theme.applyStyles('dark', {\n    backgroundColor: theme.colors.dark[4],\n  }),\n}));\n\nexport const ProgressSectionStyle = css({\n  backgroundColor: 'var(--progress-section-color)',\n  height: '100%',\n  width: 'var(--progress-section-width)',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  overflow: 'hidden',\n  backgroundSize: '20px 20px',\n  transition: 'width var(--progress-transition-duration, 100ms) ease',\n\n  '&:_where([data-striped])': {\n    backgroundImage:\n      'linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)',\n  },\n\n  '&:_where([data-animated])': {\n    animation: `${stripesAnimation} 1s linear infinite`,\n  },\n\n  '&:_where(:last-of-type)': {\n    borderRadius: 0,\n    borderStartEndRadius: 'var(--progress-radius)',\n    borderEndEndRadius: 'var(--progress-radius)',\n  },\n\n  '&:_where(:first-of-type)': {\n    borderRadius: 0,\n    borderStartStartRadius: 'var(--progress-radius)',\n    borderEndStartRadius: 'var(--progress-radius)',\n  },\n});\n\nexport const ProgressLabelStyle = css({\n  color: 'var(--progress-label-color, var(--raikou-color-white))',\n  fontWeight: 'bold',\n  userSelect: 'none',\n  overflow: 'hidden',\n  whiteSpace: 'nowrap',\n  textOverflow: 'ellipsis',\n  fontSize: 'min(calc(var(--progress-size) * 0.65), rem(18px))',\n  lineHeight: 1,\n  paddingInline: '4px',\n});\n"],"names":["keyframes","css"],"mappings":";;;;AAEA,MAAM,mBAAmBA,eAAU,CAAA;AAAA,EACjC,IAAM,EAAA;AAAA,IACJ,kBAAoB,EAAA;AAAA,GACtB;AAAA,EACA,MAAQ,EAAA;AAAA,IACN,kBAAoB,EAAA;AAAA;AAExB,CAAC,CAAA;AAEM,MAAM,iBAAoB,GAAAC,SAAA,CAAI,CAAC,EAAE,OAAa,MAAA;AAAA,EACnD,mBAAqB,EAAA,8BAAA;AAAA,EACrB,iBAAmB,EAAA,yBAAA;AAAA,EAEnB,oBAAsB,EAAA,KAAA;AAAA,EACtB,oBAAsB,EAAA,KAAA;AAAA,EACtB,oBAAsB,EAAA,KAAA;AAAA,EACtB,oBAAsB,EAAA,MAAA;AAAA,EACtB,oBAAsB,EAAA,MAAA;AAAA,EAEtB,QAAU,EAAA,UAAA;AAAA,EACV,MAAQ,EAAA,sBAAA;AAAA,EACR,YAAc,EAAA,wBAAA;AAAA,EACd,QAAU,EAAA,QAAA;AAAA,EACV,OAAS,EAAA,MAAA;AAAA,EAET,GAAG,KAAM,CAAA,WAAA,CAAY,OAAS,EAAA;AAAA,IAC5B,eAAiB,EAAA,KAAA,CAAM,MAAO,CAAA,IAAA,CAAK,CAAC;AAAA,GACrC,CAAA;AAAA,EAED,GAAG,KAAM,CAAA,WAAA,CAAY,MAAQ,EAAA;AAAA,IAC3B,eAAiB,EAAA,KAAA,CAAM,MAAO,CAAA,IAAA,CAAK,CAAC;AAAA,GACrC;AACH,CAAE,CAAA;AAEK,MAAM,uBAAuBA,SAAI,CAAA;AAAA,EACtC,eAAiB,EAAA,+BAAA;AAAA,EACjB,MAAQ,EAAA,MAAA;AAAA,EACR,KAAO,EAAA,+BAAA;AAAA,EACP,OAAS,EAAA,MAAA;AAAA,EACT,UAAY,EAAA,QAAA;AAAA,EACZ,cAAgB,EAAA,QAAA;AAAA,EAChB,QAAU,EAAA,QAAA;AAAA,EACV,cAAgB,EAAA,WAAA;AAAA,EAChB,UAAY,EAAA,uDAAA;AAAA,EAEZ,0BAA4B,EAAA;AAAA,IAC1B,eACE,EAAA;AAAA,GACJ;AAAA,EAEA,2BAA6B,EAAA;AAAA,IAC3B,SAAA,EAAW,GAAG,gBAAgB,CAAA,mBAAA;AAAA,GAChC;AAAA,EAEA,yBAA2B,EAAA;AAAA,IACzB,YAAc,EAAA,CAAA;AAAA,IACd,oBAAsB,EAAA,wBAAA;AAAA,IACtB,kBAAoB,EAAA;AAAA,GACtB;AAAA,EAEA,0BAA4B,EAAA;AAAA,IAC1B,YAAc,EAAA,CAAA;AAAA,IACd,sBAAwB,EAAA,wBAAA;AAAA,IACxB,oBAAsB,EAAA;AAAA;AAE1B,CAAC;AAEM,MAAM,qBAAqBA,SAAI,CAAA;AAAA,EACpC,KAAO,EAAA,wDAAA;AAAA,EACP,UAAY,EAAA,MAAA;AAAA,EACZ,UAAY,EAAA,MAAA;AAAA,EACZ,QAAU,EAAA,QAAA;AAAA,EACV,UAAY,EAAA,QAAA;AAAA,EACZ,YAAc,EAAA,UAAA;AAAA,EACd,QAAU,EAAA,mDAAA;AAAA,EACV,UAAY,EAAA,CAAA;AAAA,EACZ,aAAe,EAAA;AACjB,CAAC;;;;;;"}