import styled, { css, keyframes } from 'styled-components';
import { colors } from '../_styles/colors';
var backgroundSize = 8;
var color1 = colors.blue50;
var color2 = colors.blue40;
export var loaderTransitionDuration = 250;
var movingStripes = /*#__PURE__*/keyframes(["from{background-position:", "px 0;}100%{background-position:0 ", "px;}"], backgroundSize, backgroundSize);
export var StyledLoader = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledLoader",
  componentId: "core-11_26_1__sc-wgvjj9-0"
})(["display:block;height:100%;left:0;min-width:12px;position:absolute;transition:width ", "ms ease-out;top:0;"], loaderTransitionDuration);
export var StyledGradient = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledGradient",
  componentId: "core-11_26_1__sc-wgvjj9-1"
})(["height:100%;", ""], function (_ref) {
  var $animated = _ref.$animated;
  return $animated ? css(["animation:", " 0.5s linear infinite;background-image:linear-gradient( 45deg,", " 26%,", " 25%,", " 51%,", " 50%,", " 76%,", " 75%,", " );background-size:", "px ", "px;"], movingStripes, color1, color2, color2, color1, color1, color2, color2, backgroundSize, backgroundSize) : css(["background-color:", ";"], colors.blue50);
});
//# sourceMappingURL=Loader.styles.js.map