import styled from "styled-components";
import T from "../typography";
export const ProgressRoot = styled.div `
  position: relative;
  width: 100%;
  height: 8px;
  border-radius: 4px;
  background-color: ${({ theme }) => theme.new?.colors?.primary250};
`;
export const ProgressBar = styled.div `
  width: ${({ width }) => width};
  height: inherit;
  border-radius: inherit;
  background-color: ${({ theme }) => theme.new?.colors?.primary950};
  transition: width 0.3s linear;
`;
export const ProgressInfoRoot = styled.div `
  position: absolute;
  display: flex;
  justify-content: space-between;
  top: calc(100% + 10px);
  width: 100%;
`;
export const ProgressInfo = styled(T.T16) `
  color: ${({ theme }) => theme.new?.colors?.primary950};
`;
export const TargetInfo = styled(T.T16) ``;
//# sourceMappingURL=progress.styled.js.map