@coinswap-app/uikit 1.0.15 → 1.0.17

package/dist/index.cjs.js

@@ -21,7 +21,6 @@ var material = require('@mui/material');
 var noop = require('lodash/noop');
 var _ = require('lodash');
 var reactRouterDom = require('react-router-dom');
-var core = require('@web3-react/core');
 var reactTransitionGroup = require('react-transition-group');
 var formik = require('formik');
 var Yup = require('yup');
@@ -330,9 +329,9 @@ var getThemeValue = function getThemeValue(path, fallback) {
   };
 };
 
-var _templateObject$2b, _templateObject2$16, _templateObject3$O;
-var rotate$1 = styledComponents.keyframes(_templateObject$2b || (_templateObject$2b = _taggedTemplateLiteral(["\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n"])));
-var spinStyle = styledComponents.css(_templateObject2$16 || (_templateObject2$16 = _taggedTemplateLiteral(["\n  animation: ", " 2s linear infinite;\n"])), rotate$1);
+var _templateObject$2a, _templateObject2$15, _templateObject3$N;
+var rotate$1 = styledComponents.keyframes(_templateObject$2a || (_templateObject$2a = _taggedTemplateLiteral(["\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n"])));
+var spinStyle = styledComponents.css(_templateObject2$15 || (_templateObject2$15 = _taggedTemplateLiteral(["\n  animation: ", " 2s linear infinite;\n"])), rotate$1);
 var Svg = styledComponents.styled("svg").withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
     return !['$spin', '$opac'].includes(prop);
@@ -340,7 +339,7 @@ var Svg = styledComponents.styled("svg").withConfig({
 }).withConfig({
   displayName: "Svg",
   componentId: "sc-1oa1mzv-0"
-})(_templateObject3$O || (_templateObject3$O = _taggedTemplateLiteral(["\n  fill: ", ";\n  flex-shrink: 0;\n  width: ", ";\n  xmlns: ", ";\n\n  ", "\n  ", "\n  path {\n    fill: ", ";\n    //Opacity set on 0.5\n    fill-opacity: ", ";\n  }\n"])), function (_ref) {
+})(_templateObject3$N || (_templateObject3$N = _taggedTemplateLiteral(["\n  fill: ", ";\n  flex-shrink: 0;\n  width: ", ";\n  xmlns: ", ";\n\n  ", "\n  ", "\n  path {\n    fill: ", ";\n    //Opacity set on 0.5\n    fill-opacity: ", ";\n  }\n"])), function (_ref) {
   var theme = _ref.theme,
     _ref$color = _ref.color,
     color = _ref$color === void 0 ? "text" : _ref$color;
@@ -374,10 +373,10 @@ var Icon$2H = function Icon(props) {
   }));
 };
 
-var _excluded$13 = ["fill"];
+var _excluded$12 = ["fill"];
 var Icon$2G = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$13);
+    props = _objectWithoutProperties(_ref, _excluded$12);
   return /*#__PURE__*/jsxRuntime.jsxs(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 20 20"
   }, props), {}, {
@@ -411,7 +410,7 @@ var Icon$2E = function Icon(props) {
   }));
 };
 
-var _templateObject$2a;
+var _templateObject$29;
 var getColor$1 = function getColor(_ref) {
   var color = _ref.color,
     theme = _ref.theme;
@@ -429,7 +428,7 @@ var Text = styledComponents.styled.div.withConfig({
 }).withConfig({
   displayName: "Text",
   componentId: "sc-nskjht-0"
-})(_templateObject$2a || (_templateObject$2a = _taggedTemplateLiteral(["\n  color: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: 1.5;\n  ", "\n  ", "\n  ", "\n"])), getColor$1, getFontSize, function (_ref3) {
+})(_templateObject$29 || (_templateObject$29 = _taggedTemplateLiteral(["\n  color: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: 1.5;\n  ", "\n  ", "\n  ", "\n"])), getColor$1, getFontSize, function (_ref3) {
   var $bold = _ref3.$bold,
     bold = _ref3.bold;
   return $bold || bold ? 700 : 400;
@@ -476,7 +475,7 @@ var variants$4 = {
   OUTLINE: "outline"
 };
 
-var _templateObject$29;
+var _templateObject$28;
 var getDisabledStyles$3 = function getDisabledStyles(_ref) {
   var $isLoading = _ref.$isLoading,
     theme = _ref.theme;
@@ -508,7 +507,7 @@ var StyledButton$2 = styledComponents.styled.button.withConfig({
 }).withConfig({
   displayName: "StyledButton",
   componentId: "sc-pxfjak-0"
-})(_templateObject$29 || (_templateObject$29 = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: ", ";\n  border: ", ";\n  border-radius: 10px;\n  color: ", ";\n  cursor: pointer;\n  display: inline-flex;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 600;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: background-color 0.2s;\n  opacity: ", ";\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    background-color: ", ";\n    border-color: ", ";\n  }\n\n  &:focus:not(:active) {\n    box-shadow: 0 0 0 1px ", ";\n  }\n\n  &:active {\n    background-color: ", ";\n    box-shadow: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), getButtonVariantProp$3("background"), getButtonVariantProp$3("border"), function (_ref4) {
+})(_templateObject$28 || (_templateObject$28 = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: ", ";\n  border: ", ";\n  border-radius: 10px;\n  color: ", ";\n  cursor: pointer;\n  display: inline-flex;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 600;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: background-color 0.2s;\n  opacity: ", ";\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    background-color: ", ";\n    border-color: ", ";\n  }\n\n  &:focus:not(:active) {\n    box-shadow: 0 0 0 1px ", ";\n  }\n\n  &:active {\n    background-color: ", ";\n    box-shadow: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), getButtonVariantProp$3("background"), getButtonVariantProp$3("border"), function (_ref4) {
   var $white = _ref4.$white;
   return $white ? "white" : getButtonVariantProp$3("color");
 }, function (_ref5) {
@@ -530,7 +529,7 @@ var StyledButton$2 = styledComponents.styled.button.withConfig({
   return theme.colors.secondary;
 }, getButtonVariantProp$3("backgroundActive"), getButtonVariantProp$3("boxShadowActive"), getDisabledStyles$3, removePointerEvents$3, styledSystem.space);
 
-var _excluded$12 = ["startIcon", "style", "endIcon", "children", "external", "$isLoading", "disabled", "$white", "$fullWidth", "fullWidth", "isLoading", "white"],
+var _excluded$11 = ["startIcon", "style", "endIcon", "children", "external", "$isLoading", "disabled", "$white", "$fullWidth", "fullWidth", "isLoading", "white"],
   _excluded2$2 = ["isActive"];
 var Button$1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var startIcon = _ref.startIcon,
@@ -547,7 +546,7 @@ var Button$1 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     fullWidthProp = _ref.fullWidth,
     isLoadingProp = _ref.isLoading,
     whiteProp = _ref.white,
-    props = _objectWithoutProperties(_ref, _excluded$12);
+    props = _objectWithoutProperties(_ref, _excluded$11);
   var internalProps = external ? getExternalLinkProps() : {};
   var $isLoading = $isLoadingProp || isLoadingProp || false;
   var $white = $whiteProp || whiteProp;
@@ -584,10 +583,10 @@ var Icon$2D = function Icon(props) {
   }));
 };
 
-var _excluded$11 = ["fill"];
+var _excluded$10 = ["fill"];
 var Icon$2C = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$11);
+    props = _objectWithoutProperties(_ref, _excluded$10);
   return /*#__PURE__*/jsxRuntime.jsxs(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 20 20"
   }, props), {}, {
@@ -618,10 +617,10 @@ var Icon$2B = function Icon() {
   });
 };
 
-var _excluded$10 = ["fill"];
+var _excluded$$ = ["fill"];
 var Icon$2A = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$10);
+    props = _objectWithoutProperties(_ref, _excluded$$);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 25"
   }, props), {}, {
@@ -632,10 +631,10 @@ var Icon$2A = function Icon(_ref) {
   }));
 };
 
-var _excluded$$ = ["fill"];
+var _excluded$_ = ["fill"];
 var Icon$2z = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$$);
+    props = _objectWithoutProperties(_ref, _excluded$_);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 25"
   }, props), {}, {
@@ -678,10 +677,10 @@ var Icon$2x = function Icon(props) {
   }));
 };
 
-var _excluded$_ = ["fill"];
+var _excluded$Z = ["fill"];
 var Icon$2w = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$_);
+    props = _objectWithoutProperties(_ref, _excluded$Z);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 25"
   }, props), {}, {
@@ -728,10 +727,10 @@ var Icon$2t = function Icon(props) {
   }));
 };
 
-var _excluded$Z = ["fill"];
+var _excluded$Y = ["fill"];
 var Icon$2s = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$Z);
+    props = _objectWithoutProperties(_ref, _excluded$Y);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 16 16"
   }, props), {}, {
@@ -743,10 +742,10 @@ var Icon$2s = function Icon(_ref) {
   }));
 };
 
-var _excluded$Y = ["fill"];
+var _excluded$X = ["fill"];
 var Icon$2r = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$Y);
+    props = _objectWithoutProperties(_ref, _excluded$X);
   return /*#__PURE__*/jsxRuntime.jsxs(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 25 24"
   }, props), {}, {
@@ -770,11 +769,11 @@ var Icon$2q = function Icon(props) {
   }));
 };
 
-var _excluded$X = ["fill", "fillOpacity"];
+var _excluded$W = ["fill", "fillOpacity"];
 var Icon$2p = function Icon(_ref) {
   var fill = _ref.fill,
     fillOpacity = _ref.fillOpacity,
-    props = _objectWithoutProperties(_ref, _excluded$X);
+    props = _objectWithoutProperties(_ref, _excluded$W);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({}, props), {}, {
     children: /*#__PURE__*/jsxRuntime.jsx("path", {
       fillRule: "evenodd",
@@ -786,10 +785,10 @@ var Icon$2p = function Icon(_ref) {
   }));
 };
 
-var _excluded$W = ["fill"];
+var _excluded$V = ["fill"];
 var Icon$2o = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$W);
+    props = _objectWithoutProperties(_ref, _excluded$V);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -800,10 +799,10 @@ var Icon$2o = function Icon(_ref) {
   }));
 };
 
-var _excluded$V = ["fill"];
+var _excluded$U = ["fill"];
 var Icon$2n = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$V);
+    props = _objectWithoutProperties(_ref, _excluded$U);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -814,10 +813,10 @@ var Icon$2n = function Icon(_ref) {
   }));
 };
 
-var _excluded$U = ["fill"];
+var _excluded$T = ["fill"];
 var Icon$2m = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$U);
+    props = _objectWithoutProperties(_ref, _excluded$T);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -828,10 +827,10 @@ var Icon$2m = function Icon(_ref) {
   }));
 };
 
-var _excluded$T = ["fill"];
+var _excluded$S = ["fill"];
 var Icon$2l = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$T);
+    props = _objectWithoutProperties(_ref, _excluded$S);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -842,10 +841,10 @@ var Icon$2l = function Icon(_ref) {
   }));
 };
 
-var _excluded$S = ["fill"];
+var _excluded$R = ["fill"];
 var Icon$2k = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$S);
+    props = _objectWithoutProperties(_ref, _excluded$R);
   return /*#__PURE__*/jsxRuntime.jsxs(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 20 20"
   }, props), {}, {
@@ -859,10 +858,10 @@ var Icon$2k = function Icon(_ref) {
   }));
 };
 
-var _excluded$R = ["fill"];
+var _excluded$Q = ["fill"];
 var Icon$2j = function Icon(_ref) {
   var fill = _ref.fill;
-    _objectWithoutProperties(_ref, _excluded$R);
+    _objectWithoutProperties(_ref, _excluded$Q);
   return /*#__PURE__*/jsxRuntime.jsx("svg", {
     width: "17",
     height: "17",
@@ -878,10 +877,10 @@ var Icon$2j = function Icon(_ref) {
   });
 };
 
-var _excluded$Q = ["fill"];
+var _excluded$P = ["fill"];
 var Icon$2i = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$Q);
+    props = _objectWithoutProperties(_ref, _excluded$P);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 20 22"
   }, props), {}, {
@@ -917,10 +916,10 @@ var Icon$2g = function Icon(props) {
   }));
 };
 
-var _excluded$P = ["fill"];
+var _excluded$O = ["fill"];
 var Icon$2f = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$P);
+    props = _objectWithoutProperties(_ref, _excluded$O);
   return /*#__PURE__*/jsxRuntime.jsxs(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 20 20"
   }, props), {}, {
@@ -990,10 +989,10 @@ var Icon$2c = function Icon(props) {
   }));
 };
 
-var _excluded$O = ["fill"];
+var _excluded$N = ["fill"];
 var Icon$2b = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$O);
+    props = _objectWithoutProperties(_ref, _excluded$N);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 14 14"
   }, props), {}, {
@@ -1149,10 +1148,10 @@ var Icon$27 = function Icon(props) {
   }));
 };
 
-var _excluded$N = ["fill"];
+var _excluded$M = ["fill"];
 var Icon$26 = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$N);
+    props = _objectWithoutProperties(_ref, _excluded$M);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -1414,10 +1413,10 @@ var Icon$1Y = function Icon(props) {
   }));
 };
 
-var _excluded$M = ["fill"];
+var _excluded$L = ["fill"];
 var Icon$1X = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$M);
+    props = _objectWithoutProperties(_ref, _excluded$L);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     width: "20",
     height: "20",
@@ -1430,10 +1429,10 @@ var Icon$1X = function Icon(_ref) {
   }));
 };
 
-var _excluded$L = ["fill"];
+var _excluded$K = ["fill"];
 var Icon$1W = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$L);
+    props = _objectWithoutProperties(_ref, _excluded$K);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 20 20"
   }, props), {}, {
@@ -1506,10 +1505,10 @@ var Icon$1U = function Icon(props) {
   }));
 };
 
-var _excluded$K = ["fill"];
+var _excluded$J = ["fill"];
 var Icon$1T = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$K);
+    props = _objectWithoutProperties(_ref, _excluded$J);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 20 20"
   }, props), {}, {
@@ -1520,10 +1519,10 @@ var Icon$1T = function Icon(_ref) {
   }));
 };
 
-var _excluded$J = ["fill"];
+var _excluded$I = ["fill"];
 var Icon$1S = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$J);
+    props = _objectWithoutProperties(_ref, _excluded$I);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -1607,10 +1606,10 @@ var Icon$1N = function Icon(props) {
   }));
 };
 
-var _excluded$I = ["fill"];
+var _excluded$H = ["fill"];
 var Icon$1M = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$I);
+    props = _objectWithoutProperties(_ref, _excluded$H);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 25"
   }, props), {}, {
@@ -1621,10 +1620,10 @@ var Icon$1M = function Icon(_ref) {
   }));
 };
 
-var _excluded$H = ["fill"];
+var _excluded$G = ["fill"];
 var Icon$1L = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$H);
+    props = _objectWithoutProperties(_ref, _excluded$G);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -1635,10 +1634,10 @@ var Icon$1L = function Icon(_ref) {
   }));
 };
 
-var _excluded$G = ["fill"];
+var _excluded$F = ["fill"];
 var Icon$1K = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$G);
+    props = _objectWithoutProperties(_ref, _excluded$F);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -1649,10 +1648,10 @@ var Icon$1K = function Icon(_ref) {
   }));
 };
 
-var _excluded$F = ["fill"];
+var _excluded$E = ["fill"];
 var Icon$1J = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$F);
+    props = _objectWithoutProperties(_ref, _excluded$E);
   return /*#__PURE__*/jsxRuntime.jsxs(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -1666,10 +1665,10 @@ var Icon$1J = function Icon(_ref) {
   }));
 };
 
-var _excluded$E = ["fill"];
+var _excluded$D = ["fill"];
 var Icon$1I = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$E);
+    props = _objectWithoutProperties(_ref, _excluded$D);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 14 14"
   }, props), {}, {
@@ -1682,10 +1681,10 @@ var Icon$1I = function Icon(_ref) {
   }));
 };
 
-var _excluded$D = ["fill"];
+var _excluded$C = ["fill"];
 var Icon$1H = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$D);
+    props = _objectWithoutProperties(_ref, _excluded$C);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 25"
   }, props), {}, {
@@ -1696,10 +1695,10 @@ var Icon$1H = function Icon(_ref) {
   }));
 };
 
-var _excluded$C = ["fill"];
+var _excluded$B = ["fill"];
 var Icon$1G = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$C);
+    props = _objectWithoutProperties(_ref, _excluded$B);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 20 12"
   }, props), {}, {
@@ -1712,10 +1711,10 @@ var Icon$1G = function Icon(_ref) {
   }));
 };
 
-var _excluded$B = ["fill"];
+var _excluded$A = ["fill"];
 var Icon$1F = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$B);
+    props = _objectWithoutProperties(_ref, _excluded$A);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 25"
   }, props), {}, {
@@ -1726,10 +1725,10 @@ var Icon$1F = function Icon(_ref) {
   }));
 };
 
-var _excluded$A = ["fill"];
+var _excluded$z = ["fill"];
 var Icon$1E = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$A);
+    props = _objectWithoutProperties(_ref, _excluded$z);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -1740,10 +1739,10 @@ var Icon$1E = function Icon(_ref) {
   }));
 };
 
-var _excluded$z = ["fill"];
+var _excluded$y = ["fill"];
 var Icon$1D = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$z);
+    props = _objectWithoutProperties(_ref, _excluded$y);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -1754,10 +1753,10 @@ var Icon$1D = function Icon(_ref) {
   }));
 };
 
-var _excluded$y = ["fill"];
+var _excluded$x = ["fill"];
 var Icon$1C = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$y);
+    props = _objectWithoutProperties(_ref, _excluded$x);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 20 20"
   }, props), {}, {
@@ -1768,10 +1767,10 @@ var Icon$1C = function Icon(_ref) {
   }));
 };
 
-var _excluded$x = ["fill"];
+var _excluded$w = ["fill"];
 var Icon$1B = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$x);
+    props = _objectWithoutProperties(_ref, _excluded$w);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -1782,10 +1781,10 @@ var Icon$1B = function Icon(_ref) {
   }));
 };
 
-var _excluded$w = ["fill"];
+var _excluded$v = ["fill"];
 var Icon$1A = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$w);
+    props = _objectWithoutProperties(_ref, _excluded$v);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 20 20"
   }, props), {}, {
@@ -1796,10 +1795,10 @@ var Icon$1A = function Icon(_ref) {
   }));
 };
 
-var _excluded$v = ["fill"];
+var _excluded$u = ["fill"];
 var Icon$1z = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$v);
+    props = _objectWithoutProperties(_ref, _excluded$u);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 24 24"
   }, props), {}, {
@@ -1810,10 +1809,10 @@ var Icon$1z = function Icon(_ref) {
   }));
 };
 
-var _excluded$u = ["fill"];
+var _excluded$t = ["fill"];
 var Icon$1y = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$u);
+    props = _objectWithoutProperties(_ref, _excluded$t);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 17 14"
   }, props), {}, {
@@ -2070,10 +2069,10 @@ var Icon$1l = function Icon(props) {
   }));
 };
 
-var _excluded$t = ["fill"];
+var _excluded$s = ["fill"];
 var Icon$1k = function Icon(_ref) {
   _ref.fill;
-    var props = _objectWithoutProperties(_ref, _excluded$t);
+    var props = _objectWithoutProperties(_ref, _excluded$s);
   return /*#__PURE__*/jsxRuntime.jsxs(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 20 20"
   }, props), {}, {
@@ -2194,10 +2193,10 @@ var Icon$1g = function Icon(props) {
   }));
 };
 
-var _excluded$s = ["fill"];
+var _excluded$r = ["fill"];
 var Icon$1f = function Icon(_ref) {
   _ref.fill;
-    var props = _objectWithoutProperties(_ref, _excluded$s);
+    var props = _objectWithoutProperties(_ref, _excluded$r);
   return /*#__PURE__*/jsxRuntime.jsxs(Svg, _objectSpread2(_objectSpread2({
     width: "20",
     height: "21",
@@ -2229,10 +2228,10 @@ var Icon$1f = function Icon(_ref) {
   }));
 };
 
-var _excluded$r = ["fill"];
+var _excluded$q = ["fill"];
 var Icon$1e = function Icon(_ref) {
   var fill = _ref.fill,
-    props = _objectWithoutProperties(_ref, _excluded$r);
+    props = _objectWithoutProperties(_ref, _excluded$q);
   return /*#__PURE__*/jsxRuntime.jsx(Svg, _objectSpread2(_objectSpread2({
     viewBox: "0 0 28 28",
     width: props.width || "28",
@@ -7943,17 +7942,17 @@ var Icon$T = function Icon(props) {
   });
 };
 
-var _templateObject$28, _templateObject2$15;
+var _templateObject$27, _templateObject2$14;
 var ButtonText = styledComponents.styled.span.withConfig({
   displayName: "ButtonText",
   componentId: "sc-kepl07-0"
-})(_templateObject$28 || (_templateObject$28 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 16px;\n  line-height: 28px;\n  width: 84px;\n  transition: all 0.5s ease-in;\n  display: ", ";\n"])), function (props) {
+})(_templateObject$27 || (_templateObject$27 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 16px;\n  line-height: 28px;\n  width: 84px;\n  transition: all 0.5s ease-in;\n  display: ", ";\n"])), function (props) {
   return props.extended ? "block" : "none";
 });
 var RampButtonWrapper$1 = styledComponents.styled(Button$1).withConfig({
   displayName: "RampButtonWrapper",
   componentId: "sc-kepl07-1"
-})(_templateObject2$15 || (_templateObject2$15 = _taggedTemplateLiteral(["\n  padding: 6px 10px;\n  padding: ", ";\n  outline: none;\n  border: none;\n  width: ", "px;\n  height: 40px;\n  background: ", ";\n  border-radius: 10px;\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  overflow: hidden;\n  transition: all 0.5s ease-in;\n"])), function (props) {
+})(_templateObject2$14 || (_templateObject2$14 = _taggedTemplateLiteral(["\n  padding: 6px 10px;\n  padding: ", ";\n  outline: none;\n  border: none;\n  width: ", "px;\n  height: 40px;\n  background: ", ";\n  border-radius: 10px;\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  overflow: hidden;\n  transition: all 0.5s ease-in;\n"])), function (props) {
   return props.extended ? "6px 25px" : "6px 10px";
 }, function (props) {
   return props.extended ? 110 : 60;
@@ -7981,20 +7980,20 @@ var RampButtonLite = function RampButtonLite(_ref2) {
   });
 };
 
-var _templateObject$27;
+var _templateObject$26;
 var IconButton = styledComponents.styled(Button$1).withConfig({
   displayName: "IconButton",
   componentId: "sc-9rnm19-0"
-})(_templateObject$27 || (_templateObject$27 = _taggedTemplateLiteral(["\n  padding: 0;\n  width: ", ";\n  margin: 0px 4px;\n  border: none;\n  outline: none;\n"])), function (_ref) {
+})(_templateObject$26 || (_templateObject$26 = _taggedTemplateLiteral(["\n  padding: 0;\n  width: ", ";\n  margin: 0px 4px;\n  border: none;\n  outline: none;\n"])), function (_ref) {
   var size = _ref.size;
   return size === "sm" ? "32px" : "60px";
 });
 
-var _templateObject$26;
+var _templateObject$25;
 var RampButtonWrapper = styledComponents.styled.button.withConfig({
   displayName: "RampButtonWrapper",
   componentId: "sc-1y4rjmy-0"
-})(_templateObject$26 || (_templateObject$26 = _taggedTemplateLiteral(["\n  padding: 6px 10px;\n  outline: none;\n  border: none;\n  width: ", "px;\n  height: 40px;\n  background: #2b2b38;\n  border-radius: 10px;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n  color: black;\n  cursor: pointer;\n  position: relative;\n  overflow: hidden;\n  &:active {\n    background: ", ";\n  }\n  transition: all 0.5s ease-in;\n"])), function (props) {
+})(_templateObject$25 || (_templateObject$25 = _taggedTemplateLiteral(["\n  padding: 6px 10px;\n  outline: none;\n  border: none;\n  width: ", "px;\n  height: 40px;\n  background: #2b2b38;\n  border-radius: 10px;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n  color: black;\n  cursor: pointer;\n  position: relative;\n  overflow: hidden;\n  &:active {\n    background: ", ";\n  }\n  transition: all 0.5s ease-in;\n"])), function (props) {
   return props.extended ? 108 : 70;
 }, function (_ref) {
   var theme = _ref.theme;
@@ -8018,17 +8017,17 @@ var RampButton = function RampButton(_ref2) {
   });
 };
 
-var _templateObject$25;
+var _templateObject$24;
 var Box = styledComponents.styled.div.withConfig({
   displayName: "Box",
   componentId: "sc-1vk503f-0"
-})(_templateObject$25 || (_templateObject$25 = _taggedTemplateLiteral(["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n"])), styledSystem.background, styledSystem.border, styledSystem.layout, styledSystem.position, styledSystem.space);
+})(_templateObject$24 || (_templateObject$24 = _taggedTemplateLiteral(["\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n"])), styledSystem.background, styledSystem.border, styledSystem.layout, styledSystem.position, styledSystem.space);
 
-var _templateObject$24;
+var _templateObject$23;
 var Flex = styledComponents.styled(Box).withConfig({
   displayName: "Flex",
   componentId: "sc-10l7f81-0"
-})(_templateObject$24 || (_templateObject$24 = _taggedTemplateLiteral(["\n  display: flex;\n  ", "\n"])), styledSystem.flexbox);
+})(_templateObject$23 || (_templateObject$23 = _taggedTemplateLiteral(["\n  display: flex;\n  ", "\n"])), styledSystem.flexbox);
 
 var variants$3 = {
   INFO: "info",
@@ -8037,7 +8036,7 @@ var variants$3 = {
   WARNING: "warning"
 };
 
-var _templateObject$23, _templateObject2$14, _templateObject3$N, _templateObject4$y;
+var _templateObject$22, _templateObject2$13, _templateObject3$M, _templateObject4$x;
 var getThemeColor = function getThemeColor(_ref) {
   var theme = _ref.theme,
     _ref$variant = _ref.variant,
@@ -8071,23 +8070,23 @@ var getIcon = function getIcon() {
 var IconLabel = styledComponents.styled.div.withConfig({
   displayName: "IconLabel",
   componentId: "sc-iju7nx-0"
-})(_templateObject$23 || (_templateObject$23 = _taggedTemplateLiteral(["\n  background-color: ", ";\n  border-radius: 10px 0 0 10px;\n  color: black;\n  padding: 12px;\n"])), getThemeColor);
+})(_templateObject$22 || (_templateObject$22 = _taggedTemplateLiteral(["\n  background-color: ", ";\n  border-radius: 10px 0 0 10px;\n  color: black;\n  padding: 12px;\n"])), getThemeColor);
 var withHandlerSpacing = 32 + 12 + 8; // button size + inner spacing + handler position
 var Details = styledComponents.styled.div.withConfig({
   displayName: "Details",
   componentId: "sc-iju7nx-1"
-})(_templateObject2$14 || (_templateObject2$14 = _taggedTemplateLiteral(["\n  flex: 1;\n  padding-bottom: 12px;\n  padding-left: 12px;\n  padding-right: ", ";\n  padding-top: 12px;\n"])), function (_ref2) {
+})(_templateObject2$13 || (_templateObject2$13 = _taggedTemplateLiteral(["\n  flex: 1;\n  padding-bottom: 12px;\n  padding-left: 12px;\n  padding-right: ", ";\n  padding-top: 12px;\n"])), function (_ref2) {
   var hasHandler = _ref2.hasHandler;
   return hasHandler ? "".concat(withHandlerSpacing, "px") : "12px";
 });
 var CloseHandler = styledComponents.styled.div.withConfig({
   displayName: "CloseHandler",
   componentId: "sc-iju7nx-2"
-})(_templateObject3$N || (_templateObject3$N = _taggedTemplateLiteral(["\n  border-radius: 0 16px 16px 0;\n  right: 8px;\n  position: absolute;\n  top: 8px;\n"])));
+})(_templateObject3$M || (_templateObject3$M = _taggedTemplateLiteral(["\n  border-radius: 0 16px 16px 0;\n  right: 8px;\n  position: absolute;\n  top: 8px;\n"])));
 var StyledAlert = styledComponents.styled(Flex).withConfig({
   displayName: "StyledAlert",
   componentId: "sc-iju7nx-3"
-})(_templateObject4$y || (_templateObject4$y = _taggedTemplateLiteral(["\n  position: relative;\n  background: ", ";\n  @-moz-document url-prefix() {\n    background: rgba(36, 36, 36, 0.95) !important;\n  }\n  box-shadow: 0 13px 20px rgba(0, 0, 0, 0.25);\n  border: 1px solid ", ";\n  border-radius: 10px;\n"])), function (_ref3) {
+})(_templateObject4$x || (_templateObject4$x = _taggedTemplateLiteral(["\n  position: relative;\n  background: ", ";\n  @-moz-document url-prefix() {\n    background: rgba(36, 36, 36, 0.95) !important;\n  }\n  box-shadow: 0 13px 20px rgba(0, 0, 0, 0.25);\n  border: 1px solid ", ";\n  border-radius: 10px;\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.backgrounds.secondary;
 }, function (_ref4) {
@@ -8137,11 +8136,11 @@ var observerOptions = {
   threshold: 0
 };
 
-var _templateObject$22;
+var _templateObject$21;
 var Wrapper$3 = styledComponents.styled.div.withConfig({
   displayName: "Wrapper",
   componentId: "sc-1ie94f-0"
-})(_templateObject$22 || (_templateObject$22 = _taggedTemplateLiteral(["\n  position: relative;\n  background-position: center center;\n  background-repeat: no-repeat;\n  background-size: cover;\n  height: ", "px;\n  max-width: ", "px;\n  max-height: ", "px;\n  width: 100%;\n  padding-top: ", "%;\n  ", "\n"])), function (_ref) {
+})(_templateObject$21 || (_templateObject$21 = _taggedTemplateLiteral(["\n  position: relative;\n  background-position: center center;\n  background-repeat: no-repeat;\n  background-size: cover;\n  height: ", "px;\n  max-width: ", "px;\n  max-height: ", "px;\n  width: 100%;\n  padding-top: ", "%;\n  ", "\n"])), function (_ref) {
   var height = _ref.height,
     responsive = _ref.responsive;
   return responsive ? 0 : height;
@@ -8158,20 +8157,20 @@ var Wrapper$3 = styledComponents.styled.div.withConfig({
   return responsive ? height / width * 100 : 0;
 }, styledSystem.space);
 
-var _excluded$q = ["src", "alt"];
-var _templateObject$21, _templateObject2$13;
+var _excluded$p = ["src", "alt"];
+var _templateObject$20, _templateObject2$12;
 var StyledImage = styledComponents.styled.img.withConfig({
   displayName: "StyledImage",
   componentId: "sc-10tqvvr-0"
-})(_templateObject$21 || (_templateObject$21 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  max-width: 100%;\n"])));
+})(_templateObject$20 || (_templateObject$20 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  max-width: 100%;\n"])));
 var Placeholder = styledComponents.styled.div.withConfig({
   displayName: "Placeholder",
   componentId: "sc-10tqvvr-1"
-})(_templateObject2$13 || (_templateObject2$13 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"])));
+})(_templateObject2$12 || (_templateObject2$12 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"])));
 var Image = function Image(_ref) {
   var src = _ref.src,
     alt = _ref.alt,
-    otherProps = _objectWithoutProperties(_ref, _excluded$q);
+    otherProps = _objectWithoutProperties(_ref, _excluded$p);
   var imgRef = React.useRef(null);
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -8203,7 +8202,7 @@ var Image = function Image(_ref) {
   }));
 };
 
-var _templateObject$20;
+var _templateObject$1$;
 var breakpointMap = {
   xs: 370,
   sm: 576,
@@ -8246,7 +8245,7 @@ var grids = {
   mobile: "grid-template-columns: repeat(".concat(gridsMap.mobile.gridColumns, ", minmax(0, 1fr));\n            grid-gap: 20px;\n            "),
   desktop: "grid-template-columns: repeat(".concat(gridsMap.desktop.gridColumns, ", minmax(0, 1fr));\n            grid-gap: 24px;\n            ")
 };
-var gridLayout = styledComponents.css(_templateObject$20 || (_templateObject$20 = _taggedTemplateLiteral(["\n  display: grid;\n  ", " {\n    ", ";\n  }\n  ", " {\n    ", ";\n  }\n"])), function (_ref) {
+var gridLayout = styledComponents.css(_templateObject$1$ || (_templateObject$1$ = _taggedTemplateLiteral(["\n  display: grid;\n  ", " {\n    ", ";\n  }\n  ", " {\n    ", ";\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.xs;
 }, grids.mobile, function (_ref2) {
@@ -8470,7 +8469,7 @@ var sizes$1 = {
   XXL: "xxl"
 };
 
-var _templateObject$1$;
+var _templateObject$1_;
 var style = _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, sizes$1.MD, {
   fontSize: "20px",
   fontSizeLg: "20px"
@@ -8494,7 +8493,7 @@ var Heading = styledComponents.styled(Text).attrs(function (_ref) {
 }).withConfig({
   displayName: "Heading",
   componentId: "sc-1bynhbg-0"
-})(_templateObject$1$ || (_templateObject$1$ = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-weight: 600;\n  line-height: 1.1;\n\n  ", " {\n    font-size: ", ";\n  }\n"])), function (_ref2) {
+})(_templateObject$1_ || (_templateObject$1_ = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-weight: 600;\n  line-height: 1.1;\n\n  ", " {\n    font-size: ", ";\n  }\n"])), function (_ref2) {
   var _ref2$size = _ref2.size,
     size = _ref2$size === void 0 ? sizes$1.MD : _ref2$size;
   return style[size].fontSize;
@@ -8507,11 +8506,11 @@ var Heading = styledComponents.styled(Text).attrs(function (_ref) {
   return style[size].fontSizeLg;
 });
 
-var _templateObject$1_, _templateObject2$12, _templateObject3$M, _templateObject4$x;
+var _templateObject$1Z, _templateObject2$11, _templateObject3$L, _templateObject4$w;
 var StyledModal = styledComponents.styled.div.withConfig({
   displayName: "StyledModal",
   componentId: "sc-gb2uez-0"
-})(_templateObject$1_ || (_templateObject$1_ = _taggedTemplateLiteral(["\n  background: ", ";\n  box-shadow: 0 13px 20px rgba(0, 0, 0, 0.25);\n  @-moz-document url-prefix() {\n    background: #191921 !important;\n  }\n  border-radius: 15px;\n  width: 100%;\n  z-index: 99;\n  overflow-y: auto;\n  padding-bottom: 8px;\n  ", " {\n    width: auto;\n    min-width: 360px;\n    max-width: 100%;\n    max-height: 80%;\n  }\n  ", " {\n    max-height: 80vh;\n  }\n"])), function (_ref) {
+})(_templateObject$1Z || (_templateObject$1Z = _taggedTemplateLiteral(["\n  background: ", ";\n  box-shadow: 0 13px 20px rgba(0, 0, 0, 0.25);\n  @-moz-document url-prefix() {\n    background: #191921 !important;\n  }\n  border-radius: 15px;\n  width: 100%;\n  z-index: 99;\n  overflow-y: auto;\n  padding-bottom: 8px;\n  ", " {\n    width: auto;\n    min-width: 360px;\n    max-width: 100%;\n    max-height: 80%;\n  }\n  ", " {\n    max-height: 80vh;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.card;
 }, function (_ref2) {
@@ -8524,15 +8523,15 @@ var StyledModal = styledComponents.styled.div.withConfig({
 var CloseButton$1 = styledComponents.styled(Button$1).withConfig({
   displayName: "CloseButton",
   componentId: "sc-gb2uez-1"
-})(_templateObject2$12 || (_templateObject2$12 = _taggedTemplateLiteral(["\n  z-index: 99999;\n  width: 16px;\n  border: none;\n  align-items: flex-start !important;\n  padding: 0px !important;\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    background-color: transparent;\n    border-color: transparent;\n  }\n  &:focus:not(:active) {\n    box-shadow: none;\n  }\n"])));
+})(_templateObject2$11 || (_templateObject2$11 = _taggedTemplateLiteral(["\n  z-index: 99999;\n  width: 16px;\n  border: none;\n  align-items: flex-start !important;\n  padding: 0px !important;\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    background-color: transparent;\n    border-color: transparent;\n  }\n  &:focus:not(:active) {\n    box-shadow: none;\n  }\n"])));
 var ModalHeader = styledComponents.styled.div.withConfig({
   displayName: "ModalHeader",
   componentId: "sc-gb2uez-2"
-})(_templateObject3$M || (_templateObject3$M = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  padding: 24px 24px 0;\n"])));
+})(_templateObject3$L || (_templateObject3$L = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  padding: 24px 24px 0;\n"])));
 var ModalTitle = styledComponents.styled(Flex).withConfig({
   displayName: "ModalTitle",
   componentId: "sc-gb2uez-3"
-})(_templateObject4$x || (_templateObject4$x = _taggedTemplateLiteral(["\n  align-items: center;\n  flex: 1;\n"])));
+})(_templateObject4$w || (_templateObject4$w = _taggedTemplateLiteral(["\n  align-items: center;\n  flex: 1;\n"])));
 var Modal = function Modal(_ref4) {
   var title = _ref4.title,
     onDismiss = _ref4.onDismiss,
@@ -8573,7 +8572,7 @@ var Modal = function Modal(_ref4) {
   });
 };
 
-var _templateObject$1Z;
+var _templateObject$1Y;
 var Overlay = styledComponents.styled.div.attrs(function (_ref) {
   var _ref$show = _ref.show,
     show = _ref$show === void 0 ? false : _ref$show,
@@ -8587,7 +8586,7 @@ var Overlay = styledComponents.styled.div.attrs(function (_ref) {
 }).withConfig({
   displayName: "Overlay",
   componentId: "sc-1u1va95-0"
-})(_templateObject$1Z || (_templateObject$1Z = _taggedTemplateLiteral(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-color: rgb(22, 22, 29);\n  transition: opacity 0.4s;\n  opacity: ", ";\n  z-index: ", ";\n  pointer-events: ", ";\n"])), function (_ref2) {
+})(_templateObject$1Y || (_templateObject$1Y = _taggedTemplateLiteral(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-color: rgb(22, 22, 29);\n  transition: opacity 0.4s;\n  opacity: ", ";\n  z-index: ", ";\n  pointer-events: ", ";\n"])), function (_ref2) {
   var _ref2$show = _ref2.show,
     show = _ref2$show === void 0 ? false : _ref2$show;
   return show ? 0.6 : 0;
@@ -8601,11 +8600,11 @@ var Overlay = styledComponents.styled.div.attrs(function (_ref) {
   return show ? "initial" : "none";
 });
 
-var _templateObject$1Y;
+var _templateObject$1X;
 var ModalWrapper = styledComponents.styled.div.withConfig({
   displayName: "ModalWrapper",
   componentId: "sc-4rfz2j-0"
-})(_templateObject$1Y || (_templateObject$1Y = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: ", ";\n  ", " {\n    justify-content: flex-start;\n    padding-top: 50px;\n  }\n"])), function (_ref) {
+})(_templateObject$1X || (_templateObject$1X = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: ", ";\n  ", " {\n    justify-content: flex-start;\n    padding-top: 50px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.zIndices.modal - 1;
 }, function (_ref2) {
@@ -8900,113 +8899,55 @@ var Icon$N = function Icon(props) {
   }));
 };
 
-exports.ConnectorNames = void 0;
+var ConnectorNames$1;
 (function (ConnectorNames) {
   ConnectorNames["Injected"] = "injected";
   ConnectorNames["WalletConnect"] = "walletconnect";
   ConnectorNames["BSC"] = "bsc";
-})(exports.ConnectorNames || (exports.ConnectorNames = {}));
+})(ConnectorNames$1 || (ConnectorNames$1 = {}));
 
-var connectors$1 = [{
+[{
   title: "Metamask",
   icon: Icon$S,
-  connectorId: exports.ConnectorNames.Injected
+  connectorId: ConnectorNames$1.Injected
 }, {
   title: "TrustWallet",
   icon: Icon$P,
-  connectorId: exports.ConnectorNames.Injected
+  connectorId: ConnectorNames$1.Injected
 }, {
   title: "MathWallet",
   icon: Icon$R,
-  connectorId: exports.ConnectorNames.Injected
+  connectorId: ConnectorNames$1.Injected
 }, {
   title: "TokenPocket",
   icon: Icon$Q,
-  connectorId: exports.ConnectorNames.Injected
+  connectorId: ConnectorNames$1.Injected
 }, {
   title: "WalletConnect",
   icon: Icon$O,
-  connectorId: exports.ConnectorNames.WalletConnect
+  connectorId: ConnectorNames$1.WalletConnect
 }, {
   title: "Binance Chain Wallet",
   icon: Icon$N,
-  connectorId: exports.ConnectorNames.BSC
+  connectorId: ConnectorNames$1.BSC
 }];
 var connectorLocalStorageKey$1 = "connectorId";
 
-var WalletCard = function WalletCard(_ref) {
-  var login = _ref.login,
-    walletConfig = _ref.walletConfig,
-    onDismiss = _ref.onDismiss,
-    mb = _ref.mb;
-  var title = walletConfig.title,
-    Icon = walletConfig.icon;
-  process.env.NODE_ENV === "development" ? "" : "".concat(process.env.REACT_APP_PROD_DOMAIN);
-  var _useCookies = reactCookie.useCookies([connectorLocalStorageKey$1]),
-    _useCookies2 = _slicedToArray(_useCookies, 2);
-    _useCookies2[0];
-    _useCookies2[1];
-  return /*#__PURE__*/jsxRuntime.jsxs(Button$1, {
-    $fullWidth: true,
-    variant: exports.ButtonVariant.OUTLINE,
-    onClick: function onClick() {
-      login(walletConfig.connectorId, title);
-      onDismiss();
-    },
-    style: {
-      justifyContent: "space-between"
-    },
-    mb: mb,
-    id: "wallet-connect-".concat(title.toLocaleLowerCase()),
-    children: [/*#__PURE__*/jsxRuntime.jsx(Text, {
-      bold: true,
-      color: "rgba(255, 255, 255, 0.55)",
-      mr: "16px",
-      children: title
-    }), /*#__PURE__*/jsxRuntime.jsx(Icon, {
-      width: "20px",
-      $opac: true
-    })]
-  });
-};
-
 var getTranslations = function getTranslations(translation) {
   return translation;
 };
 
-var ConnectModal = function ConnectModal(_ref) {
-  var login = _ref.login,
-    _ref$onDismiss = _ref.onDismiss,
-    onDismiss = _ref$onDismiss === void 0 ? function () {
-      return null;
-    } : _ref$onDismiss,
-    translations = _ref.translations;
-  var t = translations || getTranslations;
-  return /*#__PURE__*/jsxRuntime.jsx(Modal, {
-    title: t("Connect to a wallet"),
-    onDismiss: onDismiss,
-    children: connectors$1.map(function (entry, index) {
-      return /*#__PURE__*/jsxRuntime.jsx(WalletCard, {
-        login: login,
-        walletConfig: entry,
-        onDismiss: onDismiss,
-        mb: index < connectors$1.length - 1 ? "10px" : "0"
-      }, entry.title);
-    })
-  });
-};
-
-var _excluded$p = ["external", "color"];
-var _templateObject$1X;
+var _excluded$o = ["external", "color"];
+var _templateObject$1W;
 var StyledLink$1 = styledComponents.styled(Text).withConfig({
   displayName: "StyledLink",
   componentId: "sc-qw3uvt-0"
-})(_templateObject$1X || (_templateObject$1X = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  margin-right: 21px;\n  &:hover {\n    text-decoration: underline;\n  }\n"])));
+})(_templateObject$1W || (_templateObject$1W = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  margin-right: 21px;\n  &:hover {\n    text-decoration: underline;\n  }\n"])));
 var Link = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var external = _ref.external,
     _ref$color = _ref.color,
     color = _ref$color === void 0 ? "primary" : _ref$color,
-    props = _objectWithoutProperties(_ref, _excluded$p);
+    props = _objectWithoutProperties(_ref, _excluded$o);
   var internalProps = external ? getExternalLinkProps() : {};
   return /*#__PURE__*/jsxRuntime.jsx(StyledLink$1, _objectSpread2(_objectSpread2({
     ref: ref,
@@ -9017,10 +8958,10 @@ var Link = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
 });
 Link.displayName = "Link";
 
-var _excluded$o = ["children"];
+var _excluded$n = ["children"];
 var LinkExternal = function LinkExternal(_ref) {
   var children = _ref.children,
-    props = _objectWithoutProperties(_ref, _excluded$o);
+    props = _objectWithoutProperties(_ref, _excluded$n);
   return /*#__PURE__*/jsxRuntime.jsxs(Link, _objectSpread2(_objectSpread2({
     external: true
   }, props), {}, {
@@ -9033,21 +8974,20 @@ var LinkExternal = function LinkExternal(_ref) {
   }));
 };
 
-var _excluded$n = ["toCopy", "translations", "children"];
-var _templateObject$1W, _templateObject2$11;
-var StyleButton = styledComponents.styled(Text).attrs({
+var _templateObject$1V, _templateObject2$10;
+styledComponents.styled(Text).attrs({
   role: "button"
 }).withConfig({
   displayName: "StyleButton",
   componentId: "sc-v35pzo-0"
-})(_templateObject$1W || (_templateObject$1W = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  color: ", ";\n"])), function (_ref) {
+})(_templateObject$1V || (_templateObject$1V = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  color: ", ";\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.primary;
 });
-var Tooltip$1 = styledComponents.styled.div.withConfig({
+styledComponents.styled.div.withConfig({
   displayName: "Tooltip",
   componentId: "sc-v35pzo-1"
-})(_templateObject2$11 || (_templateObject2$11 = _taggedTemplateLiteral(["\n  display: ", ";\n  position: absolute;\n  bottom: -40px;\n  right: 0;\n  left: 0;\n  text-align: center;\n  background-color: ", ";\n  color: ", ";\n  border-radius: 5px;\n  opacity: 0.7;\n  padding: 5px;\n"])), function (_ref2) {
+})(_templateObject2$10 || (_templateObject2$10 = _taggedTemplateLiteral(["\n  display: ", ";\n  position: absolute;\n  bottom: -40px;\n  right: 0;\n  left: 0;\n  text-align: center;\n  background-color: ", ";\n  color: ", ";\n  border-radius: 5px;\n  opacity: 0.7;\n  padding: 5px;\n"])), function (_ref2) {
   var isTooltipDisplayed = _ref2.isTooltipDisplayed;
   return isTooltipDisplayed ? "block" : "none";
 }, function (_ref3) {
@@ -9057,104 +8997,6 @@ var Tooltip$1 = styledComponents.styled.div.withConfig({
   var theme = _ref4.theme;
   return theme.colors.invertedContrast;
 });
-var CopyToClipboard = function CopyToClipboard(_ref5) {
-  var toCopy = _ref5.toCopy,
-    translations = _ref5.translations,
-    children = _ref5.children,
-    props = _objectWithoutProperties(_ref5, _excluded$n);
-  var _useState = React.useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isTooltipDisplayed = _useState2[0],
-    setIsTooltipDisplayed = _useState2[1];
-  var t = translations || getTranslations;
-  return /*#__PURE__*/jsxRuntime.jsxs(StyleButton, _objectSpread2(_objectSpread2({
-    small: true,
-    bold: true,
-    onClick: function onClick() {
-      if (navigator.clipboard) {
-        navigator.clipboard.writeText(toCopy);
-        setIsTooltipDisplayed(true);
-        setTimeout(function () {
-          setIsTooltipDisplayed(false);
-        }, 1000);
-      }
-    }
-  }, props), {}, {
-    children: [children, /*#__PURE__*/jsxRuntime.jsx(Icon$2g, {
-      width: "20px",
-      color: "primary",
-      ml: "4px"
-    }), /*#__PURE__*/jsxRuntime.jsx(Tooltip$1, {
-      isTooltipDisplayed: isTooltipDisplayed,
-      children: t("Copied")
-    })]
-  }));
-};
-
-var AccountModal = function AccountModal(_ref) {
-  var account = _ref.account,
-    logout = _ref.logout,
-    _ref$onDismiss = _ref.onDismiss,
-    onDismiss = _ref$onDismiss === void 0 ? function () {
-      return null;
-    } : _ref$onDismiss,
-    translations = _ref.translations;
-  var t = translations || getTranslations;
-  return /*#__PURE__*/jsxRuntime.jsxs(Modal, {
-    title: t("Your wallet"),
-    onDismiss: onDismiss,
-    children: [/*#__PURE__*/jsxRuntime.jsx(Text, {
-      fontSize: "20px",
-      bold: true,
-      style: {
-        whiteSpace: "nowrap",
-        overflow: "hidden",
-        textOverflow: "ellipsis",
-        marginBottom: "8px"
-      },
-      children: account
-    }), /*#__PURE__*/jsxRuntime.jsxs(Flex, {
-      mb: "32px",
-      children: [/*#__PURE__*/jsxRuntime.jsx(LinkExternal, {
-        small: true,
-        href: "https://bscscan.com/address/".concat(account),
-        mr: "16px",
-        children: t("View on BscScan")
-      }), /*#__PURE__*/jsxRuntime.jsx(CopyToClipboard, {
-        toCopy: account,
-        children: "Copy Address"
-      })]
-    }), /*#__PURE__*/jsxRuntime.jsx(Flex, {
-      justifyContent: "center",
-      children: /*#__PURE__*/jsxRuntime.jsx(Button$1, {
-        size: "md",
-        variant: exports.ButtonVariant.PRIMARY,
-        onClick: logout,
-        children: t("Logout")
-      })
-    })]
-  });
-};
-
-var useWalletModal = function useWalletModal(login, logout, account, translations) {
-  var _useModal = useModal(/*#__PURE__*/jsxRuntime.jsx(ConnectModal, {
-      translations: translations,
-      login: login
-    })),
-    _useModal2 = _slicedToArray(_useModal, 1),
-    onPresentConnectModal = _useModal2[0];
-  var _useModal3 = useModal(/*#__PURE__*/jsxRuntime.jsx(AccountModal, {
-      translations: translations,
-      account: account || "",
-      logout: logout
-    })),
-    _useModal4 = _slicedToArray(_useModal3, 1),
-    onPresentAccountModal = _useModal4[0];
-  return {
-    onPresentConnectModal: onPresentConnectModal,
-    onPresentAccountModal: onPresentAccountModal
-  };
-};
 
 exports.Cookies = void 0;
 (function (Cookies) {
@@ -9388,11 +9230,11 @@ var useConnectWalletEvent = function useConnectWalletEvent(account) {
   }, [account]);
 };
 
-var _templateObject$1V, _templateObject2$10;
+var _templateObject$1U, _templateObject2$$;
 var BannerSlideWrapper = styledComponents.styled.div.withConfig({
   displayName: "BannerSlideWrapper",
   componentId: "sc-1mbqjcw-0"
-})(_templateObject$1V || (_templateObject$1V = _taggedTemplateLiteral(["\n  position: relative;\n  height: ", ";\n  max-height: 225px;\n  display: flex;\n  flex-direction: row;\n  justify-content: ", ";\n  align-items: center;\n"])), function (_ref) {
+})(_templateObject$1U || (_templateObject$1U = _taggedTemplateLiteral(["\n  position: relative;\n  height: ", ";\n  max-height: 225px;\n  display: flex;\n  flex-direction: row;\n  justify-content: ", ";\n  align-items: center;\n"])), function (_ref) {
   var height = _ref.height;
   return "".concat(height, "px");
 }, function (_ref2) {
@@ -9402,7 +9244,7 @@ var BannerSlideWrapper = styledComponents.styled.div.withConfig({
 var StyledImg = styledComponents.styled(Image).withConfig({
   displayName: "StyledImg",
   componentId: "sc-1mbqjcw-1"
-})(_templateObject2$10 || (_templateObject2$10 = _taggedTemplateLiteral(["\n  position: absolute;\n  max-height: 225px;\n  top: 0;\n  img {\n    object-fit: contain;\n    border-radius: ", ";\n  }\n"])), function (_ref3) {
+})(_templateObject2$$ || (_templateObject2$$ = _taggedTemplateLiteral(["\n  position: absolute;\n  max-height: 225px;\n  top: 0;\n  img {\n    object-fit: contain;\n    border-radius: ", ";\n  }\n"])), function (_ref3) {
   var isMobile = _ref3.isMobile,
     theme = _ref3.theme;
   return isMobile ? 0 : theme.radii.primary;
@@ -9439,18 +9281,18 @@ var BannerSlide = function BannerSlide(_ref4) {
   });
 };
 
-var _templateObject$1U, _templateObject2$$;
+var _templateObject$1T, _templateObject2$_;
 var CarouselWrapper = styledComponents.styled.div.withConfig({
   displayName: "CarouselWrapper",
   componentId: "sc-whzh3q-0"
-})(_templateObject$1U || (_templateObject$1U = _taggedTemplateLiteral(["\n  margin: 0 -32px;\n\n  ", " {\n    margin: 0;\n  }\n"])), function (_ref) {
+})(_templateObject$1T || (_templateObject$1T = _taggedTemplateLiteral(["\n  margin: 0 -32px;\n\n  ", " {\n    margin: 0;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 });
 var StyledSlider$2 = styledComponents.styled(Slider).withConfig({
   displayName: "StyledSlider",
   componentId: "sc-whzh3q-1"
-})(_templateObject2$$ || (_templateObject2$$ = _taggedTemplateLiteral(["\n  .slick-track {\n    > div {\n      padding: 0 10px;\n    }\n  }\n\n  .slick-dots {\n    .slick-active {\n      div {\n        background: ", " !important;\n        border: 2px ", " solid;\n      }\n    }\n  }\n"])), function (_ref2) {
+})(_templateObject2$_ || (_templateObject2$_ = _taggedTemplateLiteral(["\n  .slick-track {\n    > div {\n      padding: 0 10px;\n    }\n  }\n\n  .slick-dots {\n    .slick-active {\n      div {\n        background: ", " !important;\n        border: 2px ", " solid;\n      }\n    }\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.blue;
 }, function (_ref3) {
@@ -9509,11 +9351,11 @@ var BannerSlider = function BannerSlider(_ref4) {
   });
 };
 
-var _templateObject$1T, _templateObject2$_;
+var _templateObject$1S, _templateObject2$Z;
 var Separator = styledComponents.styled.div.withConfig({
   displayName: "Separator",
   componentId: "sc-1c6k3v2-0"
-})(_templateObject$1T || (_templateObject$1T = _taggedTemplateLiteral(["\n  align-items: center;\n  color: currentColor;\n  display: flex;\n  justify-content: center;\n  padding-left: 4px;\n  padding-right: 4px;\n\n  ", " {\n    padding-left: 8px;\n    padding-right: 8px;\n  }\n\n  ", " {\n    padding-left: 16px;\n    padding-right: 16px;\n  }\n"])), function (_ref) {
+})(_templateObject$1S || (_templateObject$1S = _taggedTemplateLiteral(["\n  align-items: center;\n  color: currentColor;\n  display: flex;\n  justify-content: center;\n  padding-left: 4px;\n  padding-right: 4px;\n\n  ", " {\n    padding-left: 8px;\n    padding-right: 8px;\n  }\n\n  ", " {\n    padding-left: 16px;\n    padding-right: 16px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 }, function (_ref2) {
@@ -9523,7 +9365,7 @@ var Separator = styledComponents.styled.div.withConfig({
 var StyledBreadcrumbs = styledComponents.styled.ul.withConfig({
   displayName: "StyledBreadcrumbs",
   componentId: "sc-1c6k3v2-1"
-})(_templateObject2$_ || (_templateObject2$_ = _taggedTemplateLiteral(["\n  align-items: center;\n  color: ", ";\n  display: flex;\n  flex-wrap: wrap;\n  list-style-type: none;\n\n  ", "\n"])), function (_ref3) {
+})(_templateObject2$Z || (_templateObject2$Z = _taggedTemplateLiteral(["\n  align-items: center;\n  color: ", ";\n  display: flex;\n  flex-wrap: wrap;\n  list-style-type: none;\n\n  ", "\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.textDisabled;
 }, styledSystem.space);
@@ -9559,7 +9401,7 @@ var Breadcrumbs = function Breadcrumbs(_ref4) {
   });
 };
 
-var _templateObject$1S;
+var _templateObject$1R;
 var StyledButtonMenu = styledComponents.styled.div.withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
     return prop !== 'variant';
@@ -9567,7 +9409,7 @@ var StyledButtonMenu = styledComponents.styled.div.withConfig({
 }).withConfig({
   displayName: "StyledButtonMenu",
   componentId: "sc-14hzc1v-0"
-})(_templateObject$1S || (_templateObject$1S = _taggedTemplateLiteral(["\n  background-color: transparent;\n  border-radius: 16px;\n  display: inline-flex;\n  @media (max-width: 500px) {\n    width: 100%;\n    justify-content: space-around;\n  }\n"])));
+})(_templateObject$1R || (_templateObject$1R = _taggedTemplateLiteral(["\n  background-color: transparent;\n  border-radius: 16px;\n  display: inline-flex;\n  @media (max-width: 500px) {\n    width: 100%;\n    justify-content: space-around;\n  }\n"])));
 
 var ButtonMenu = function ButtonMenu(_ref) {
   var _ref$activeIndex = _ref.activeIndex,
@@ -9599,7 +9441,7 @@ var sizes = {
 var variants$2 = {
   PRIMARY: "primary"};
 
-var _templateObject$1R;
+var _templateObject$1Q;
 var getDisabledStyles$2 = function getDisabledStyles(_ref) {
   var isLoading = _ref.isLoading,
     theme = _ref.theme;
@@ -9631,7 +9473,7 @@ var StyledButton$1 = styledComponents.styled.button.withConfig({
 }).withConfig({
   displayName: "StyledButton",
   componentId: "sc-zft497-0"
-})(_templateObject$1R || (_templateObject$1R = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: transparent;\n  border: none;\n  border-radius: 10px;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 700;\n  color: white;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: all 0.5s;\n\n  .dot {\n    margin-top: 10px;\n    height: ", ";\n    width: ", ";\n    border-radius: ", ";\n    display: inline-block;\n    background-color: ", ";\n  }\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: ", ";\n  }\n\n  &:active {\n    background-color: transparent;\n    color: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
+})(_templateObject$1Q || (_templateObject$1Q = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: transparent;\n  border: none;\n  border-radius: 10px;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 700;\n  color: white;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: all 0.5s;\n\n  .dot {\n    margin-top: 10px;\n    height: ", ";\n    width: ", ";\n    border-radius: ", ";\n    display: inline-block;\n    background-color: ", ";\n  }\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: ", ";\n  }\n\n  &:active {\n    background-color: transparent;\n    color: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
   var fullWidth = _ref4.fullWidth;
   return fullWidth ? "100%" : "max-content";
 }, function (_ref5) {
@@ -9693,7 +9535,7 @@ var getColor = function getColor(color, theme) {
   return getThemeValue("colors.".concat(color), color)(theme);
 };
 
-var _templateObject$1Q;
+var _templateObject$1P;
 var getThemeTextColor = function getThemeTextColor(_ref) {
   var outline = _ref.outline,
     _ref$variant = _ref.variant,
@@ -9704,7 +9546,7 @@ var getThemeTextColor = function getThemeTextColor(_ref) {
 var StyledTag = styledComponents.styled.div.withConfig({
   displayName: "StyledTag",
   componentId: "sc-j7cw9s-0"
-})(_templateObject$1Q || (_templateObject$1Q = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: ", ";\n  border: 1px solid ", ";\n  border-radius: 16px;\n  color: ", ";\n  display: inline-flex;\n  font-size: 14px;\n  font-weight: 400;\n  height: 28px;\n  line-height: 1.5;\n  padding: 0 8px;\n  white-space: nowrap;\n\n  svg {\n    fill: ", ";\n  }\n"])), function (_ref2) {
+})(_templateObject$1P || (_templateObject$1P = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: ", ";\n  border: 1px solid ", ";\n  border-radius: 16px;\n  color: ", ";\n  display: inline-flex;\n  font-size: 14px;\n  font-weight: 400;\n  height: 28px;\n  line-height: 1.5;\n  padding: 0 8px;\n  white-space: nowrap;\n\n  svg {\n    fill: ", ";\n  }\n"])), function (_ref2) {
   var outline = _ref2.outline,
     theme = _ref2.theme,
     _ref2$variant = _ref2.variant,
@@ -9719,15 +9561,15 @@ var StyledTag = styledComponents.styled.div.withConfig({
 
 var _excluded$l = ["isActive", "size", "variant", "as", "children", "tag", "hide"],
   _excluded2$1 = ["isActive", "onClick", "size", "variant"];
-var _templateObject$1P, _templateObject2$Z, _templateObject3$L;
+var _templateObject$1O, _templateObject2$Y, _templateObject3$K;
 var ButtonBody = styledComponents.styled.div.withConfig({
   displayName: "ButtonBody",
   componentId: "sc-1bbtdtk-0"
-})(_templateObject$1P || (_templateObject$1P = _taggedTemplateLiteral(["\n  display: inline-flex;\n  align-items: center;\n"])));
+})(_templateObject$1O || (_templateObject$1O = _taggedTemplateLiteral(["\n  display: inline-flex;\n  align-items: center;\n"])));
 var ButtonTag = styledComponents.styled(StyledTag).withConfig({
   displayName: "ButtonTag",
   componentId: "sc-1bbtdtk-1"
-})(_templateObject2$Z || (_templateObject2$Z = _taggedTemplateLiteral(["\n  margin-left: 7px;\n  font-weight: bold;\n  font-size: 11px;\n  padding: 1px 5px;\n  height: unset;\n  border-width: 1px;\n"])));
+})(_templateObject2$Y || (_templateObject2$Y = _taggedTemplateLiteral(["\n  margin-left: 7px;\n  font-weight: bold;\n  font-size: 11px;\n  padding: 1px 5px;\n  height: unset;\n  border-width: 1px;\n"])));
 var InactiveButton$1 = styledComponents.styled(Button).withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
     return prop !== 'colorKey' && prop !== 'isActive';
@@ -9735,7 +9577,7 @@ var InactiveButton$1 = styledComponents.styled(Button).withConfig({
 }).withConfig({
   displayName: "InactiveButton",
   componentId: "sc-1bbtdtk-2"
-})(_templateObject3$L || (_templateObject3$L = _taggedTemplateLiteral(["\n  background-color: transparent;\n  color: #535459;\n  .dot {\n    background-color: transparent;\n  }\n\n  &:hover:not(:disabled):not(:active) {\n    background-color: transparent;\n  }\n"])));
+})(_templateObject3$K || (_templateObject3$K = _taggedTemplateLiteral(["\n  background-color: transparent;\n  color: #535459;\n  .dot {\n    background-color: transparent;\n  }\n\n  &:hover:not(:disabled):not(:active) {\n    background-color: transparent;\n  }\n"])));
 var ButtonMenuItem = function ButtonMenuItem(_ref) {
   var _ref$isActive = _ref.isActive,
     isActive = _ref$isActive === void 0 ? false : _ref$isActive,
@@ -9790,11 +9632,11 @@ var ButtonMenuItem = function ButtonMenuItem(_ref) {
   }));
 };
 
-var _templateObject$1O;
+var _templateObject$1N;
 var StyledButtonActivityMenu = styledComponents.styled.div.withConfig({
   displayName: "StyledButtonActivityMenu",
   componentId: "sc-byew2t-0"
-})(_templateObject$1O || (_templateObject$1O = _taggedTemplateLiteral(["\n  background: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 17.71%), #16161d;\n  border: 1px solid #808080;\n  box-sizing: border-box;\n  border-radius: 99px;\n  display: inline-flex;\n"])));
+})(_templateObject$1N || (_templateObject$1N = _taggedTemplateLiteral(["\n  background: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 17.71%), #16161d;\n  border: 1px solid #808080;\n  box-sizing: border-box;\n  border-radius: 99px;\n  display: inline-flex;\n"])));
 
 var ButtonActivityMenu = function ButtonActivityMenu(_ref) {
   var _ref$activeIndex = _ref.activeIndex,
@@ -9820,7 +9662,7 @@ var ButtonActivityMenu = function ButtonActivityMenu(_ref) {
   });
 };
 
-var _templateObject$1N;
+var _templateObject$1M;
 var getDisabledStyles$1 = function getDisabledStyles(_ref) {
   var isLoading = _ref.isLoading,
     theme = _ref.theme;
@@ -9848,7 +9690,7 @@ var getButtonVariantProp$1 = function getButtonVariantProp(prop) {
 var StyledButtonActivity = styledComponents.styled.button.withConfig({
   displayName: "StyledButtonActivity",
   componentId: "sc-pam326-0"
-})(_templateObject$1N || (_templateObject$1N = _taggedTemplateLiteral(["\n  align-items: center;\n  border: none;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 600;\n  color: white;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: all 0.5s;\n\n  // Activity\n  border-radius: 99px;\n  background: linear-gradient(332.11deg, #13c3af 8.45%, #13d8b2 39.11%, #12ffb8 85.67%);\n  color: rgba(22, 22, 29, 1);\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: white;\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
+})(_templateObject$1M || (_templateObject$1M = _taggedTemplateLiteral(["\n  align-items: center;\n  border: none;\n  cursor: pointer;\n  display: flex;\n  flex-direction: column;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 600;\n  color: white;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  padding: ", ";\n  transition: all 0.5s;\n\n  // Activity\n  border-radius: 99px;\n  background: linear-gradient(332.11deg, #13c3af 8.45%, #13d8b2 39.11%, #12ffb8 85.67%);\n  color: rgba(22, 22, 29, 1);\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: white;\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
   var fullWidth = _ref4.fullWidth;
   return fullWidth ? "100%" : "max-content";
 }, function (_ref5) {
@@ -9887,11 +9729,11 @@ var ButtonActivity = function ButtonActivity(_ref) {
 };
 
 var _excluded$j = ["isActive", "size", "variant", "as"];
-var _templateObject$1M;
+var _templateObject$1L;
 var InactiveButton = styledComponents.styled(ButtonActivity).withConfig({
   displayName: "InactiveButton",
   componentId: "sc-kqgtlg-0"
-})(_templateObject$1M || (_templateObject$1M = _taggedTemplateLiteral(["\n  background: transparent;\n  color: #808080;\n  &:hover:not(:disabled):not(:active) {\n    background-color: transparent;\n  }\n"])));
+})(_templateObject$1L || (_templateObject$1L = _taggedTemplateLiteral(["\n  background: transparent;\n  color: #808080;\n  &:hover:not(:disabled):not(:active) {\n    background-color: transparent;\n  }\n"])));
 var ButtonActivityMenuItem = function ButtonActivityMenuItem(_ref) {
   var _ref$isActive = _ref.isActive,
     isActive = _ref$isActive === void 0 ? false : _ref$isActive,
@@ -9916,7 +9758,7 @@ var ButtonActivityMenuItem = function ButtonActivityMenuItem(_ref) {
   }, props));
 };
 
-var _templateObject$1L;
+var _templateObject$1K;
 var getDisabledStyles = function getDisabledStyles(_ref) {
   var isLoading = _ref.isLoading,
     theme = _ref.theme;
@@ -9944,7 +9786,7 @@ var getButtonVariantProp = function getButtonVariantProp(prop) {
 var StyledButtonSwitch = styledComponents.styled.button.withConfig({
   displayName: "StyledButtonSwitch",
   componentId: "sc-obsjj-0"
-})(_templateObject$1L || (_templateObject$1L = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  background-color: transparent;\n  border: none;\n  cursor: pointer;\n  font-family: inherit;\n  font-size: 16px;\n  line-height: 28px;\n  font-weight: 700;\n  color: ", ";\n  width: ", ";\n  height: 36px;\n  outline: 0;\n  padding: 0 8px;\n  transition: all 0.5s;\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
+})(_templateObject$1K || (_templateObject$1K = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  background-color: transparent;\n  border: none;\n  cursor: pointer;\n  font-family: inherit;\n  font-size: 16px;\n  line-height: 28px;\n  font-weight: 700;\n  color: ", ";\n  width: ", ";\n  height: 36px;\n  outline: 0;\n  padding: 0 8px;\n  transition: all 0.5s;\n\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border-color: ", ";\n    color: ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n"])), function (_ref4) {
   var theme = _ref4.theme,
     active = _ref4.active;
   return active ? "white" : theme.colors.grey;
@@ -9978,18 +9820,18 @@ var ButtonSwitch = function ButtonSwitch(_ref) {
   }));
 };
 
-var _templateObject$1K;
+var _templateObject$1J;
 var StyledButtonSwitchMenu = styledComponents.styled.div.withConfig({
   displayName: "StyledButtonSwitchMenu",
   componentId: "sc-1qzp9bs-0"
-})(_templateObject$1K || (_templateObject$1K = _taggedTemplateLiteral(["\n  background: transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n"])));
+})(_templateObject$1J || (_templateObject$1J = _taggedTemplateLiteral(["\n  background: transparent;\n  box-sizing: border-box;\n  display: inline-flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n"])));
 
 var variants$1 = {
   DEFAULT: "default",
   PANEL: "panel"
 };
 
-var _templateObject$1J, _templateObject2$Y, _templateObject3$K;
+var _templateObject$1I, _templateObject2$X, _templateObject3$J;
 var getToggleVariantProp = function getToggleVariantProp(prop) {
   return function (_ref) {
     var theme = _ref.theme,
@@ -10001,18 +9843,18 @@ var getToggleVariantProp = function getToggleVariantProp(prop) {
 var Handle = styledComponents.styled.div.withConfig({
   displayName: "Handle",
   componentId: "sc-11wqnqq-0"
-})(_templateObject$1J || (_templateObject$1J = _taggedTemplateLiteral(["\n  background-color: ", ";\n  border-radius: 50%;\n  cursor: pointer;\n  height: 16px;\n  left: 3px;\n  position: absolute;\n  top: 2px;\n  transition: all 200ms ease-in;\n  width: 16px;\n  z-index: 1;\n"])), function (_ref2) {
+})(_templateObject$1I || (_templateObject$1I = _taggedTemplateLiteral(["\n  background-color: ", ";\n  border-radius: 50%;\n  cursor: pointer;\n  height: 16px;\n  left: 3px;\n  position: absolute;\n  top: 2px;\n  transition: all 200ms ease-in;\n  width: 16px;\n  z-index: 1;\n"])), function (_ref2) {
   var checked = _ref2.checked;
   return checked ? getToggleVariantProp("backgroundHandleActive") : getToggleVariantProp("backgroundHandleInactive");
 });
 var Input$1 = styledComponents.styled.input.withConfig({
   displayName: "Input",
   componentId: "sc-11wqnqq-1"
-})(_templateObject2$Y || (_templateObject2$Y = _taggedTemplateLiteral(["\n  cursor: pointer;\n  opacity: 0;\n  height: 100%;\n  position: absolute;\n  width: 100%;\n  z-index: 3;\n\n  &:checked + ", " {\n    left: calc(100% - 18px);\n  }\n"])), Handle);
+})(_templateObject2$X || (_templateObject2$X = _taggedTemplateLiteral(["\n  cursor: pointer;\n  opacity: 0;\n  height: 100%;\n  position: absolute;\n  width: 100%;\n  z-index: 3;\n\n  &:checked + ", " {\n    left: calc(100% - 18px);\n  }\n"])), Handle);
 var StyledToggle = styledComponents.styled.div.withConfig({
   displayName: "StyledToggle",
   componentId: "sc-11wqnqq-2"
-})(_templateObject3$K || (_templateObject3$K = _taggedTemplateLiteral(["\n  align-items: center;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 11px;\n  cursor: pointer;\n  display: inline-flex;\n  height: 22px;\n  position: relative;\n  transition: background-color 200ms;\n  width: 42px;\n"])), function (_ref3) {
+})(_templateObject3$J || (_templateObject3$J = _taggedTemplateLiteral(["\n  align-items: center;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 11px;\n  cursor: pointer;\n  display: inline-flex;\n  height: 22px;\n  position: relative;\n  transition: background-color 200ms;\n  width: 42px;\n"])), function (_ref3) {
   var checked = _ref3.checked;
   return checked ? getToggleVariantProp("backgroundToggleActive") : getToggleVariantProp("backgroundToggleInactive");
 }, getToggleVariantProp("borderColor"));
@@ -10091,7 +9933,7 @@ var ButtonSwitchMenu = function ButtonSwitchMenu(_ref) {
   });
 };
 
-var _templateObject$1I;
+var _templateObject$1H;
 /**
  * Priority: Warning --> Success --> Active
  */
@@ -10124,7 +9966,7 @@ var StyledCard = styledComponents.styled.div.withConfig({
 }).withConfig({
   displayName: "StyledCard",
   componentId: "sc-b498h5-0"
-})(_templateObject$1I || (_templateObject$1I = _taggedTemplateLiteral(["\n  background: ", ";\n  @-moz-document url-prefix() {\n    background: rgba(36, 36, 36, 0.95) !important;\n  }\n  box-shadow: 0 13px 20px rgba(0, 0, 0, 0.25);\n  border: 1px solid ", ";\n  border-radius: 15px;\n  box-shadow: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n  padding: 30px;\n\n  ", "\n"])), function (_ref2) {
+})(_templateObject$1H || (_templateObject$1H = _taggedTemplateLiteral(["\n  background: ", ";\n  @-moz-document url-prefix() {\n    background: rgba(36, 36, 36, 0.95) !important;\n  }\n  box-shadow: 0 13px 20px rgba(0, 0, 0, 0.25);\n  border: 1px solid ", ";\n  border-radius: 15px;\n  box-shadow: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n  padding: 30px;\n\n  ", "\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.card;
 }, function (_ref3) {
@@ -10147,7 +9989,7 @@ var Card = function Card(_ref) {
   }));
 };
 
-var _templateObject$1H;
+var _templateObject$1G;
 var CardBody = styledComponents.styled.div.attrs(function (_ref) {
   var _ref$p = _ref.p,
     p = _ref$p === void 0 ? "24px" : _ref$p;
@@ -10157,15 +9999,15 @@ var CardBody = styledComponents.styled.div.attrs(function (_ref) {
 }).withConfig({
   displayName: "CardBody",
   componentId: "sc-1of0iur-0"
-})(_templateObject$1H || (_templateObject$1H = _taggedTemplateLiteral(["\n  ", "\n  display: flex;\n  justify-content: center;\n"])), styledSystem.space);
+})(_templateObject$1G || (_templateObject$1G = _taggedTemplateLiteral(["\n  ", "\n  display: flex;\n  justify-content: center;\n"])), styledSystem.space);
 
-var _templateObject$1G;
+var _templateObject$1F;
 var CardHeader = styledComponents.styled.div.withConfig({
   displayName: "CardHeader",
   componentId: "sc-1ikcixt-0"
-})(_templateObject$1G || (_templateObject$1G = _taggedTemplateLiteral(["\n  ", "\n  font-weight: 700;\n  font-size: 26px;\n  line-height: 130%;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n"])), styledSystem.space);
+})(_templateObject$1F || (_templateObject$1F = _taggedTemplateLiteral(["\n  ", "\n  font-weight: 700;\n  font-size: 26px;\n  line-height: 130%;\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n"])), styledSystem.space);
 
-var _templateObject$1F;
+var _templateObject$1E;
 var CardFooter = styledComponents.styled.div.attrs(function (_ref) {
   var _ref$p = _ref.p,
     p = _ref$p === void 0 ? "24px" : _ref$p;
@@ -10175,13 +10017,13 @@ var CardFooter = styledComponents.styled.div.attrs(function (_ref) {
 }).withConfig({
   displayName: "CardFooter",
   componentId: "sc-7k1ypk-0"
-})(_templateObject$1F || (_templateObject$1F = _taggedTemplateLiteral(["\n  ", "\n  display: flex;\n  justify-content: center;\n"])), styledSystem.space);
+})(_templateObject$1E || (_templateObject$1E = _taggedTemplateLiteral(["\n  ", "\n  display: flex;\n  justify-content: center;\n"])), styledSystem.space);
 
-var _templateObject$1E;
+var _templateObject$1D;
 var StyledCardRibbon = styledComponents.styled.div.withConfig({
   displayName: "StyledCardRibbon",
   componentId: "sc-1qhw702-0"
-})(_templateObject$1E || (_templateObject$1E = _taggedTemplateLiteral(["\n  background-color: ", ";\n  color: white;\n  margin: 0;\n  padding: 0;\n  padding: 8px 0;\n  position: absolute;\n  right: 0;\n  top: 0;\n  text-align: center;\n  transform: translateX(30%) translateY(0%) rotate(45deg);\n  transform-origin: top left;\n  width: 96px;\n\n  &:before,\n  &:after {\n    background-color: ", ";\n    content: \"\";\n    height: 100%;\n    margin: 0 -1px; /* Removes tiny gap */\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n\n  &:before {\n    right: 100%;\n  }\n\n  &:after {\n    left: 100%;\n  }\n\n  & > div {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    width: 96px;\n  }\n"])), function (_ref) {
+})(_templateObject$1D || (_templateObject$1D = _taggedTemplateLiteral(["\n  background-color: ", ";\n  color: white;\n  margin: 0;\n  padding: 0;\n  padding: 8px 0;\n  position: absolute;\n  right: 0;\n  top: 0;\n  text-align: center;\n  transform: translateX(30%) translateY(0%) rotate(45deg);\n  transform-origin: top left;\n  width: 96px;\n\n  &:before,\n  &:after {\n    background-color: ", ";\n    content: \"\";\n    height: 100%;\n    margin: 0 -1px; /* Removes tiny gap */\n    position: absolute;\n    top: 0;\n    width: 100%;\n  }\n\n  &:before {\n    right: 100%;\n  }\n\n  &:after {\n    left: 100%;\n  }\n\n  & > div {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    width: 96px;\n  }\n"])), function (_ref) {
   var _ref$variantColor = _ref.variantColor,
     variantColor = _ref$variantColor === void 0 ? "secondary" : _ref$variantColor,
     theme = _ref.theme;
@@ -10209,7 +10051,7 @@ var scales$2 = {
   MD: "md"
 };
 
-var _templateObject$1D;
+var _templateObject$1C;
 var getScale$1 = function getScale(_ref) {
   var scale = _ref.scale;
   switch (scale) {
@@ -10225,7 +10067,7 @@ var Checkbox = styledComponents.styled.input.attrs({
 }).withConfig({
   displayName: "Checkbox",
   componentId: "sc-1dgqwt2-0"
-})(_templateObject$1D || (_templateObject$1D = _taggedTemplateLiteral(["\n  appearance: none;\n  overflow: hidden;\n  cursor: pointer;\n  position: relative;\n  display: inline-block;\n  height: ", ";\n  width: ", ";\n  vertical-align: middle;\n  transition: background-color 0.2s ease-in-out;\n  border: ", ";\n  border-radius: 8px;\n  background-color: ", ";\n  box-shadow: ", ";\n\n  &:after {\n    content: \"\";\n    position: absolute;\n    border-bottom: 2px solid;\n    border-left: 2px solid;\n    border-color: transparent;\n    top: 30%;\n    left: 0;\n    right: 0;\n    width: 50%;\n    height: 25%;\n    margin: auto;\n    transform: rotate(-50deg);\n    transition: border-color 0.2s ease-in-out;\n  }\n\n  &:hover:not(:disabled):not(:checked) {\n    box-shadow: ", ";\n    border: ", ";\n  }\n\n  &:focus {\n    outline: none;\n    box-shadow: ", ";\n  }\n\n  &:checked {\n    background-color: ", ";\n    border: ", ";\n    &:after {\n      border-color: white;\n    }\n  }\n\n  &:disabled {\n    cursor: default;\n    opacity: 0.6;\n  }\n"])), getScale$1, getScale$1, function (_ref2) {
+})(_templateObject$1C || (_templateObject$1C = _taggedTemplateLiteral(["\n  appearance: none;\n  overflow: hidden;\n  cursor: pointer;\n  position: relative;\n  display: inline-block;\n  height: ", ";\n  width: ", ";\n  vertical-align: middle;\n  transition: background-color 0.2s ease-in-out;\n  border: ", ";\n  border-radius: 8px;\n  background-color: ", ";\n  box-shadow: ", ";\n\n  &:after {\n    content: \"\";\n    position: absolute;\n    border-bottom: 2px solid;\n    border-left: 2px solid;\n    border-color: transparent;\n    top: 30%;\n    left: 0;\n    right: 0;\n    width: 50%;\n    height: 25%;\n    margin: auto;\n    transform: rotate(-50deg);\n    transition: border-color 0.2s ease-in-out;\n  }\n\n  &:hover:not(:disabled):not(:checked) {\n    box-shadow: ", ";\n    border: ", ";\n  }\n\n  &:focus {\n    outline: none;\n    box-shadow: ", ";\n  }\n\n  &:checked {\n    background-color: ", ";\n    border: ", ";\n    &:after {\n      border-color: white;\n    }\n  }\n\n  &:disabled {\n    cursor: default;\n    opacity: 0.6;\n  }\n"])), getScale$1, getScale$1, function (_ref2) {
   var bordered = _ref2.bordered;
   return bordered ? "0.1px solid white !important" : "";
 }, function (_ref3) {
@@ -10251,7 +10093,7 @@ var Checkbox = styledComponents.styled.input.attrs({
   return bordered ? "none !important" : "";
 });
 
-var _templateObject$1C, _templateObject2$X;
+var _templateObject$1B, _templateObject2$W;
 var getLeft = function getLeft(_ref) {
   var position = _ref.position;
   if (position === "top-right") {
@@ -10269,7 +10111,7 @@ var getBottom = function getBottom(_ref2) {
 var DropdownContent = styledComponents.styled.div.withConfig({
   displayName: "DropdownContent",
   componentId: "sc-1ns2r4e-0"
-})(_templateObject$1C || (_templateObject$1C = _taggedTemplateLiteral(["\n  width: max-content;\n  display: none;\n  flex-direction: column;\n  position: absolute;\n  transform: translate(-50%, 0);\n  left: ", ";\n  bottom: ", ";\n  background-color: ", ";\n  box-shadow: ", ";\n  padding: 16px;\n  max-height: 400px;\n  overflow-y: auto;\n  overflow-x: hidden;\n  z-index: ", ";\n  border-radius: ", ";\n"])), getLeft, getBottom, function (_ref3) {
+})(_templateObject$1B || (_templateObject$1B = _taggedTemplateLiteral(["\n  width: max-content;\n  display: none;\n  flex-direction: column;\n  position: absolute;\n  transform: translate(-50%, 0);\n  left: ", ";\n  bottom: ", ";\n  background-color: ", ";\n  box-shadow: ", ";\n  padding: 16px;\n  max-height: 400px;\n  overflow-y: auto;\n  overflow-x: hidden;\n  z-index: ", ";\n  border-radius: ", ";\n"])), getLeft, getBottom, function (_ref3) {
   var theme = _ref3.theme;
   return theme.nav.background;
 }, function (_ref4) {
@@ -10285,7 +10127,7 @@ var DropdownContent = styledComponents.styled.div.withConfig({
 var Container$7 = styledComponents.styled.div.withConfig({
   displayName: "Container",
   componentId: "sc-1ns2r4e-1"
-})(_templateObject2$X || (_templateObject2$X = _taggedTemplateLiteral(["\n  position: relative;\n  &:hover ", ", &:focus-within ", " {\n    display: flex;\n  }\n"])), DropdownContent, DropdownContent);
+})(_templateObject2$W || (_templateObject2$W = _taggedTemplateLiteral(["\n  position: relative;\n  &:hover ", ", &:focus-within ", " {\n    display: flex;\n  }\n"])), DropdownContent, DropdownContent);
 var Dropdown = function Dropdown(_ref7) {
   var target = _ref7.target,
     _ref7$position = _ref7.position,
@@ -10300,15 +10142,15 @@ var Dropdown = function Dropdown(_ref7) {
 };
 
 var _excluded$e = ["tokenName", "amount", "tokenIcon", "actions"];
-var _templateObject$1B, _templateObject2$W, _templateObject3$J, _templateObject4$w, _templateObject5$t, _templateObject6$j, _templateObject7$f;
+var _templateObject$1A, _templateObject2$V, _templateObject3$I, _templateObject4$v, _templateObject5$s, _templateObject6$j, _templateObject7$f;
 var StyledHeading = styledComponents.styled.div.withConfig({
   displayName: "StyledHeading",
   componentId: "sc-1kzbws6-0"
-})(_templateObject$1B || (_templateObject$1B = _taggedTemplateLiteral(["\n  font-weight: 700;\n"])));
+})(_templateObject$1A || (_templateObject$1A = _taggedTemplateLiteral(["\n  font-weight: 700;\n"])));
 var StyledEarnedToken = styledComponents.styled.div.withConfig({
   displayName: "StyledEarnedToken",
   componentId: "sc-1kzbws6-1"
-})(_templateObject2$W || (_templateObject2$W = _taggedTemplateLiteral(["\n  width: 100%;\n  background: ", ";\n  border-radius: ", ";\n  overflow: hidden;\n  position: relative;\n  padding: ", ";\n  color: ", ";\n  font-size: 16px;\n  font-weight: 700;\n  line-height: 28px;\n\n  ", "\n\n  ", " {\n    padding: 15px;\n    border: 1px solid ", ";\n    font-size: 20px;\n    line-height: 26px;\n  }\n"])), function (_ref) {
+})(_templateObject2$V || (_templateObject2$V = _taggedTemplateLiteral(["\n  width: 100%;\n  background: ", ";\n  border-radius: ", ";\n  overflow: hidden;\n  position: relative;\n  padding: ", ";\n  color: ", ";\n  font-size: 16px;\n  font-weight: 700;\n  line-height: 28px;\n\n  ", "\n\n  ", " {\n    padding: 15px;\n    border: 1px solid ", ";\n    font-size: 20px;\n    line-height: 26px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 }, function (_ref2) {
@@ -10323,7 +10165,7 @@ var StyledEarnedToken = styledComponents.styled.div.withConfig({
   return theme.colors.white;
 }, function (_ref5) {
   var toggled = _ref5.toggled;
-  return toggled && styledComponents.css(_templateObject3$J || (_templateObject3$J = _taggedTemplateLiteral(["\n      border: 1px solid ", ";\n    "])), function (_ref6) {
+  return toggled && styledComponents.css(_templateObject3$I || (_templateObject3$I = _taggedTemplateLiteral(["\n      border: 1px solid ", ";\n    "])), function (_ref6) {
     var theme = _ref6.theme;
     return theme.colors.white10;
   });
@@ -10337,7 +10179,7 @@ var StyledEarnedToken = styledComponents.styled.div.withConfig({
 var Amount = styledComponents.styled.div.withConfig({
   displayName: "Amount",
   componentId: "sc-1kzbws6-2"
-})(_templateObject4$w || (_templateObject4$w = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: flex-start;\n  width: 100%;\n\n  svg {\n    width: 24px;\n    height: 24px;\n    margin-top: 5px;\n    margin-right: 15px;\n\n    ", " {\n      margin-top: 0;\n      margin-right: 8px;\n    }\n  }\n\n  ", " {\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-start;\n    align-items: center;\n    height: 24px;\n    padding: 25px 0;\n  }\n"])), function (_ref9) {
+})(_templateObject4$v || (_templateObject4$v = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: flex-start;\n  width: 100%;\n\n  svg {\n    width: 24px;\n    height: 24px;\n    margin-top: 5px;\n    margin-right: 15px;\n\n    ", " {\n      margin-top: 0;\n      margin-right: 8px;\n    }\n  }\n\n  ", " {\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-start;\n    align-items: center;\n    height: 24px;\n    padding: 25px 0;\n  }\n"])), function (_ref9) {
   var theme = _ref9.theme;
   return theme.mediaQueries.sm;
 }, function (_ref0) {
@@ -10347,7 +10189,7 @@ var Amount = styledComponents.styled.div.withConfig({
 var Actions = styledComponents.styled.div.withConfig({
   displayName: "Actions",
   componentId: "sc-1kzbws6-3"
-})(_templateObject5$t || (_templateObject5$t = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n\n  button {\n    width: 100%;\n    height: 40px;\n    font-size: 11px;\n    padding: 0;\n  }\n\n  ", " {\n    flex-direction: column;\n\n    button {\n      font-size: 16px;\n      margin-bottom: 5px;\n    }\n  }\n"])), function (_ref1) {
+})(_templateObject5$s || (_templateObject5$s = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n\n  button {\n    width: 100%;\n    height: 40px;\n    font-size: 11px;\n    padding: 0;\n  }\n\n  ", " {\n    flex-direction: column;\n\n    button {\n      font-size: 16px;\n      margin-bottom: 5px;\n    }\n  }\n"])), function (_ref1) {
   var theme = _ref1.theme;
   return theme.mediaQueries.sm;
 });
@@ -10418,11 +10260,11 @@ exports.Tokens = void 0;
   Tokens["ETH"] = "ETH";
 })(exports.Tokens || (exports.Tokens = {}));
 
-var _templateObject$1A;
+var _templateObject$1z;
 var StyledEarnedWrapper = styledComponents.styled.div.withConfig({
   displayName: "StyledEarnedWrapper",
   componentId: "sc-vkh54k-0"
-})(_templateObject$1A || (_templateObject$1A = _taggedTemplateLiteral(["\n  border: 1px solid ", ";\n  background: ", ";\n  width: 100%;\n  border-radius: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n"])), function (_ref) {
+})(_templateObject$1z || (_templateObject$1z = _taggedTemplateLiteral(["\n  border: 1px solid ", ";\n  background: ", ";\n  width: 100%;\n  border-radius: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white7;
 }, function (_ref2) {
@@ -10445,7 +10287,7 @@ var EarnedWrapper = function EarnedWrapper(_ref) {
   }));
 };
 
-var _templateObject$1z;
+var _templateObject$1y;
 var EarnedWrapperHeader = styledComponents.styled.div.attrs(function (_ref) {
   var _ref$as = _ref.as,
     as = _ref$as === void 0 ? tags.H2 : _ref$as;
@@ -10455,7 +10297,7 @@ var EarnedWrapperHeader = styledComponents.styled.div.attrs(function (_ref) {
 }).withConfig({
   displayName: "EarnedWrapperHeader",
   componentId: "sc-fpoazu-0"
-})(_templateObject$1z || (_templateObject$1z = _taggedTemplateLiteral(["\n  font-size: 20px;\n  line-height: 26px;\n  padding: 15px;\n  font-weight: 700;\n  color: ", ";\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n\n  ", " {\n    font-size: 26px;\n    line-height: 33.8px;\n    padding: 25px 10px 25px 30px;\n  }\n"])), function (_ref2) {
+})(_templateObject$1y || (_templateObject$1y = _taggedTemplateLiteral(["\n  font-size: 20px;\n  line-height: 26px;\n  padding: 15px;\n  font-weight: 700;\n  color: ", ";\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n\n  ", " {\n    font-size: 26px;\n    line-height: 33.8px;\n    padding: 25px 10px 25px 30px;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white;
 }, function (_ref3) {
@@ -10463,11 +10305,11 @@ var EarnedWrapperHeader = styledComponents.styled.div.attrs(function (_ref) {
   return theme.mediaQueries.md;
 });
 
-var _templateObject$1y;
+var _templateObject$1x;
 var GridLayout$1 = styledComponents.styled.div.withConfig({
   displayName: "GridLayout",
   componentId: "sc-183ri5-0"
-})(_templateObject$1y || (_templateObject$1y = _taggedTemplateLiteral(["\n  display: grid;\n  grid-template-columns: repeat(8, 1fr);\n  grid-gap: 16px;\n  ", " {\n    grid-gap: 10px;\n  }\n  ", " {\n    grid-template-columns: repeat(12, 1fr);\n    grid-gap: 24px;\n  }\n  ", " {\n    grid-template-columns: repeat(12, 1fr);\n    grid-gap: 32px;\n  }\n"])), function (_ref) {
+})(_templateObject$1x || (_templateObject$1x = _taggedTemplateLiteral(["\n  display: grid;\n  grid-template-columns: repeat(8, 1fr);\n  grid-gap: 16px;\n  ", " {\n    grid-gap: 10px;\n  }\n  ", " {\n    grid-template-columns: repeat(12, 1fr);\n    grid-gap: 24px;\n  }\n  ", " {\n    grid-template-columns: repeat(12, 1fr);\n    grid-gap: 32px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 }, function (_ref2) {
@@ -10478,20 +10320,20 @@ var GridLayout$1 = styledComponents.styled.div.withConfig({
   return theme.mediaQueries.lg;
 });
 
-var _templateObject$1x;
+var _templateObject$1w;
 var GridLayout = styledComponents.styled(GridLayout$1).withConfig({
   displayName: "GridLayout",
   componentId: "sc-1cke1k8-0"
-})(_templateObject$1x || (_templateObject$1x = _taggedTemplateLiteral(["\n  & > div {\n    grid-column: span 6;\n    ", " {\n      grid-column: span 4;\n    }\n  }\n"])), function (_ref) {
+})(_templateObject$1w || (_templateObject$1w = _taggedTemplateLiteral(["\n  & > div {\n    grid-column: span 6;\n    ", " {\n      grid-column: span 4;\n    }\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 });
 
-var _templateObject$1w, _templateObject2$V, _templateObject3$I;
+var _templateObject$1v, _templateObject2$U, _templateObject3$H;
 var StyledEarnedWrapperBody = styledComponents.styled.div.withConfig({
   displayName: "StyledEarnedWrapperBody",
   componentId: "sc-1bcwv2i-0"
-})(_templateObject$1w || (_templateObject$1w = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  justify-content: flex-start;\n  padding: 0 10px;\n\n  ", " {\n    padding: 0 30px;\n    margin-bottom: ", " !important;\n  }\n"])), function (_ref) {
+})(_templateObject$1v || (_templateObject$1v = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  justify-content: flex-start;\n  padding: 0 10px;\n\n  ", " {\n    padding: 0 30px;\n    margin-bottom: ", " !important;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.md;
 }, function (_ref2) {
@@ -10501,7 +10343,7 @@ var StyledEarnedWrapperBody = styledComponents.styled.div.withConfig({
 var StyledCardsLayout = styledComponents.styled(GridLayout$1).withConfig({
   displayName: "StyledCardsLayout",
   componentId: "sc-1bcwv2i-1"
-})(_templateObject2$V || (_templateObject2$V = _taggedTemplateLiteral(["\n  width: 100%;\n\n  & > div {\n    grid-column: span 12;\n    ", " {\n      grid-column: span 4;\n    }\n    ", " {\n      grid-column: span 4;\n    }\n    ", " {\n      grid-column: span ", ";\n    }\n  }\n"])), function (_ref3) {
+})(_templateObject2$U || (_templateObject2$U = _taggedTemplateLiteral(["\n  width: 100%;\n\n  & > div {\n    grid-column: span 12;\n    ", " {\n      grid-column: span 4;\n    }\n    ", " {\n      grid-column: span 4;\n    }\n    ", " {\n      grid-column: span ", ";\n    }\n  }\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.mediaQueries.sm;
 }, function (_ref4) {
@@ -10517,7 +10359,7 @@ var StyledCardsLayout = styledComponents.styled(GridLayout$1).withConfig({
 var EarnedWrapperFooter = styledComponents.styled.div.withConfig({
   displayName: "EarnedWrapperFooter",
   componentId: "sc-1bcwv2i-2"
-})(_templateObject3$I || (_templateObject3$I = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  padding: 10px 5px;\n\n  ", " {\n    padding: 20px 30px;\n  }\n"])), function (_ref7) {
+})(_templateObject3$H || (_templateObject3$H = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  padding: 10px 5px;\n\n  ", " {\n    padding: 20px 30px;\n  }\n"])), function (_ref7) {
   var theme = _ref7.theme;
   return theme.mediaQueries.md;
 });
@@ -10584,11 +10426,11 @@ var EarnedWrapperBody = function EarnedWrapperBody(_ref8) {
   });
 };
 
-var _templateObject$1v;
+var _templateObject$1u;
 var StyledEarnedCarouselWrapper = styledComponents.styled.div.withConfig({
   displayName: "StyledEarnedCarouselWrapper",
   componentId: "sc-1fmwe6r-0"
-})(_templateObject$1v || (_templateObject$1v = _taggedTemplateLiteral(["\n  border: 1px solid ", ";\n  background: ", ";\n  width: 100%;\n  border-radius: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n  padding-bottom: 10px;\n  ", " {\n    padding-bottom: 0px;\n  }\n"])), function (_ref) {
+})(_templateObject$1u || (_templateObject$1u = _taggedTemplateLiteral(["\n  border: 1px solid ", ";\n  background: ", ";\n  width: 100%;\n  border-radius: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n  padding-bottom: 10px;\n  ", " {\n    padding-bottom: 0px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white7;
 }, function (_ref2) {
@@ -10614,7 +10456,7 @@ var EarnedCarouselWrapper = function EarnedCarouselWrapper(_ref) {
   }));
 };
 
-var _templateObject$1u;
+var _templateObject$1t;
 var EarnedCarouselWrapperHeader = styledComponents.styled.div.attrs(function (_ref) {
   var _ref$as = _ref.as,
     as = _ref$as === void 0 ? tags.H2 : _ref$as;
@@ -10624,7 +10466,7 @@ var EarnedCarouselWrapperHeader = styledComponents.styled.div.attrs(function (_r
 }).withConfig({
   displayName: "EarnedCarouselWrapperHeader",
   componentId: "sc-zz4zep-0"
-})(_templateObject$1u || (_templateObject$1u = _taggedTemplateLiteral(["\n  font-size: 20px;\n  line-height: 26px;\n  padding: 15px;\n  font-weight: 700;\n  color: ", ";\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n\n  ", " {\n    font-size: 26px;\n    line-height: 33.8px;\n    padding: 25px 10px 25px 30px;\n  }\n"])), function (_ref2) {
+})(_templateObject$1t || (_templateObject$1t = _taggedTemplateLiteral(["\n  font-size: 20px;\n  line-height: 26px;\n  padding: 15px;\n  font-weight: 700;\n  color: ", ";\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n\n  ", " {\n    font-size: 26px;\n    line-height: 33.8px;\n    padding: 25px 10px 25px 30px;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white;
 }, function (_ref3) {
@@ -10632,15 +10474,15 @@ var EarnedCarouselWrapperHeader = styledComponents.styled.div.attrs(function (_r
   return theme.mediaQueries.md;
 });
 
-var _templateObject$1t, _templateObject2$U, _templateObject3$H;
+var _templateObject$1s, _templateObject2$T, _templateObject3$G;
 var CSSTokenWrapper = styledComponents.styled.div.withConfig({
   displayName: "CSSTokenWrapper",
   componentId: "sc-63miep-0"
-})(_templateObject$1t || (_templateObject$1t = _taggedTemplateLiteral(["\n  padding: 0 10px;\n\n  @media (max-width: 800px) {\n    width: 50%;\n  }\n  @media (min-width: 800px) {\n    width: 33.3%;\n  }\n  @media (min-width: 1200px) {\n    width: 25%;\n  }\n"])));
+})(_templateObject$1s || (_templateObject$1s = _taggedTemplateLiteral(["\n  padding: 0 10px;\n\n  @media (max-width: 800px) {\n    width: 50%;\n  }\n  @media (min-width: 800px) {\n    width: 33.3%;\n  }\n  @media (min-width: 1200px) {\n    width: 25%;\n  }\n"])));
 var SliderWrapper = styledComponents.styled.div.withConfig({
   displayName: "SliderWrapper",
   componentId: "sc-63miep-1"
-})(_templateObject2$U || (_templateObject2$U = _taggedTemplateLiteral(["\n  ", " {\n    margin: ", ";\n  }\n\n  ", " {\n    margin: ", ";\n  }\n\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n"])), function (_ref) {
+})(_templateObject2$T || (_templateObject2$T = _taggedTemplateLiteral(["\n  ", " {\n    margin: ", ";\n  }\n\n  ", " {\n    margin: ", ";\n  }\n\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 }, function (_ref2) {
@@ -10656,7 +10498,7 @@ var SliderWrapper = styledComponents.styled.div.withConfig({
 var StyledSlider$1 = styledComponents.styled(Slider).withConfig({
   displayName: "StyledSlider",
   componentId: "sc-63miep-2"
-})(_templateObject3$H || (_templateObject3$H = _taggedTemplateLiteral(["\n  @media (max-width: 800px) {\n    width: ", ";\n  }\n  @media (min-width: 800px) {\n    width: ", ";\n  }\n  @media (min-width: 1200px) {\n    width: ", ";\n  }\n\n  .slick-track {\n    display: flex;\n    > div {\n      padding: 0 10px;\n    }\n  }\n\n  .slick-dots {\n    .slick-active {\n      div {\n        background: ", " !important;\n      }\n    }\n  }\n"])), function (_ref5) {
+})(_templateObject3$G || (_templateObject3$G = _taggedTemplateLiteral(["\n  @media (max-width: 800px) {\n    width: ", ";\n  }\n  @media (min-width: 800px) {\n    width: ", ";\n  }\n  @media (min-width: 1200px) {\n    width: ", ";\n  }\n\n  .slick-track {\n    display: flex;\n    > div {\n      padding: 0 10px;\n    }\n  }\n\n  .slick-dots {\n    .slick-active {\n      div {\n        background: ", " !important;\n      }\n    }\n  }\n"])), function (_ref5) {
   var withoutMain = _ref5.withoutMain;
   if (withoutMain) {
     return "100%";
@@ -10821,7 +10663,7 @@ var BackgroundImage = function BackgroundImage(_ref) {
   }, otherProps));
 };
 
-var _templateObject$1s;
+var _templateObject$1r;
 var getBoxShadow$1 = function getBoxShadow(_ref) {
   var isActive = _ref.isActive,
     isWarning = _ref.isWarning,
@@ -10837,7 +10679,7 @@ var getBoxShadow$1 = function getBoxShadow(_ref) {
 var StyledInfoBox = styledComponents.styled.div.withConfig({
   displayName: "StyledInfoBox",
   componentId: "sc-132sfwq-0"
-})(_templateObject$1s || (_templateObject$1s = _taggedTemplateLiteral(["\n  filter: drop-shadow(rgba(25, 19, 38, 0.15) 0px 1px 4px);\n  width: 100%;\n  background: rgb(22, 22, 29);\n  border: 1px solid rgb(82, 75, 99);\n  border-radius: 15px;\n  border: 1px solid ", ";\n  box-shadow: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n\n  ", "\n"])), function (_ref2) {
+})(_templateObject$1r || (_templateObject$1r = _taggedTemplateLiteral(["\n  filter: drop-shadow(rgba(25, 19, 38, 0.15) 0px 1px 4px);\n  width: 100%;\n  background: rgb(22, 22, 29);\n  border: 1px solid rgb(82, 75, 99);\n  border-radius: 15px;\n  border: 1px solid ", ";\n  box-shadow: ", ";\n  color: ", ";\n  overflow: hidden;\n  position: relative;\n\n  ", "\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.borderColor;
 }, getBoxShadow$1, function (_ref3) {
@@ -10854,7 +10696,7 @@ var InfoBox$1 = function InfoBox(_ref) {
   }));
 };
 
-var _templateObject$1r;
+var _templateObject$1q;
 var InfoBox = styledComponents.styled.div.attrs(function (_ref) {
   var _ref$p = _ref.p,
     p = _ref$p === void 0 ? "24px" : _ref$p;
@@ -10864,15 +10706,15 @@ var InfoBox = styledComponents.styled.div.attrs(function (_ref) {
 }).withConfig({
   displayName: "InfoBox",
   componentId: "sc-1opp4pn-0"
-})(_templateObject$1r || (_templateObject$1r = _taggedTemplateLiteral(["\n  ", ";\n  padding: 20px;\n  display: flex;\n  justify-content: flex-start;\n"])), styledSystem.space);
+})(_templateObject$1q || (_templateObject$1q = _taggedTemplateLiteral(["\n  ", ";\n  padding: 20px;\n  display: flex;\n  justify-content: flex-start;\n"])), styledSystem.space);
 
-var _templateObject$1q;
+var _templateObject$1p;
 var InfoBoxHeader = styledComponents.styled.div.withConfig({
   displayName: "InfoBoxHeader",
   componentId: "sc-ll0lgz-0"
-})(_templateObject$1q || (_templateObject$1q = _taggedTemplateLiteral(["\n  ", ";\n  font-weight: 600;\n  font-size: 24px;\n  line-height: 130%;\n  color: white;\n\n  display: flex;\n  height: 55px;\n  padding: 0 20px;\n  justify-content: space-between;\n  align-items: center;\n  background: rgba(10, 10, 10, 1);\n"])), styledSystem.space);
+})(_templateObject$1p || (_templateObject$1p = _taggedTemplateLiteral(["\n  ", ";\n  font-weight: 600;\n  font-size: 24px;\n  line-height: 130%;\n  color: white;\n\n  display: flex;\n  height: 55px;\n  padding: 0 20px;\n  justify-content: space-between;\n  align-items: center;\n  background: rgba(10, 10, 10, 1);\n"])), styledSystem.space);
 
-var _templateObject$1p;
+var _templateObject$1o;
 var InfoBoxFooter = styledComponents.styled.div.attrs(function (_ref) {
   var _ref$p = _ref.p,
     p = _ref$p === void 0 ? "24px" : _ref$p;
@@ -10882,7 +10724,7 @@ var InfoBoxFooter = styledComponents.styled.div.attrs(function (_ref) {
 }).withConfig({
   displayName: "InfoBoxFooter",
   componentId: "sc-suth0r-0"
-})(_templateObject$1p || (_templateObject$1p = _taggedTemplateLiteral(["\n  ", ";\n  padding: 20px;\n  display: flex;\n  justify-content: flex-start;\n"])), styledSystem.space);
+})(_templateObject$1o || (_templateObject$1o = _taggedTemplateLiteral(["\n  ", ";\n  padding: 20px;\n  display: flex;\n  justify-content: flex-start;\n"])), styledSystem.space);
 
 var scales$1 = {
   SM: "sm",
@@ -10890,7 +10732,7 @@ var scales$1 = {
   LG: "lg"
 };
 
-var _templateObject$1o;
+var _templateObject$1n;
 /**
  * Priority: Warning --> Success
  */
@@ -10924,7 +10766,7 @@ var getHeight = function getHeight(_ref2) {
 var Input = styledComponents.styled.input.withConfig({
   displayName: "Input",
   componentId: "sc-i7ggno-0"
-})(_templateObject$1o || (_templateObject$1o = _taggedTemplateLiteral(["\n  background-color: ", ";\n  border: 1px solid rgba(255, 255, 255, 0.3);\n  border-radius: 10px;\n  box-shadow: ", ";\n  color: ", ";\n  display: block;\n  font-size: 16px;\n  height: ", ";\n  outline: 0;\n  padding: 0 16px;\n  width: 100%;\n\n  &::placeholder {\n    color: ", ";\n  }\n\n  &:disabled {\n    background-color: ", ";\n    box-shadow: none;\n    color: ", ";\n    cursor: not-allowed;\n  }\n\n  &:focus:not(:disabled) {\n    box-shadow: ", ";\n  }\n"])), function (_ref3) {
+})(_templateObject$1n || (_templateObject$1n = _taggedTemplateLiteral(["\n  background-color: ", ";\n  border: 1px solid rgba(255, 255, 255, 0.3);\n  border-radius: 10px;\n  box-shadow: ", ";\n  color: ", ";\n  display: block;\n  font-size: 16px;\n  height: ", ";\n  outline: 0;\n  padding: 0 16px;\n  width: 100%;\n\n  &::placeholder {\n    color: ", ";\n  }\n\n  &:disabled {\n    background-color: ", ";\n    box-shadow: none;\n    color: ", ";\n    cursor: not-allowed;\n  }\n\n  &:focus:not(:disabled) {\n    box-shadow: ", ";\n  }\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.input;
 }, getBoxShadow, function (_ref4) {
@@ -10947,30 +10789,30 @@ var Input = styledComponents.styled.input.withConfig({
 var _excluded$9 = ["children"],
   _excluded2 = ["children"],
   _excluded3 = ["children"];
-var _templateObject$1n, _templateObject2$T, _templateObject3$G, _templateObject4$v, _templateObject5$s, _templateObject6$i, _templateObject7$e, _templateObject8$a, _templateObject9$9;
+var _templateObject$1m, _templateObject2$S, _templateObject3$F, _templateObject4$u, _templateObject5$r, _templateObject6$i, _templateObject7$e, _templateObject8$a, _templateObject9$9;
 var InputLabelBox = styledComponents.styled.div.withConfig({
   displayName: "InputLabelBox",
   componentId: "sc-1xa506b-0"
-})(_templateObject$1n || (_templateObject$1n = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  margin-bottom: 8px;\n"])));
+})(_templateObject$1m || (_templateObject$1m = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  margin-bottom: 8px;\n"])));
 var Label = styledComponents.styled(Text).withConfig({
   displayName: "Label",
   componentId: "sc-1xa506b-1"
-})(_templateObject2$T || (_templateObject2$T = _taggedTemplateLiteral(["\n  color: ", ";\n  font-weight: bold;\n  font-size: 16px;\n  line-height: 28px;\n"])), function (_ref) {
+})(_templateObject2$S || (_templateObject2$S = _taggedTemplateLiteral(["\n  color: ", ";\n  font-weight: bold;\n  font-size: 16px;\n  line-height: 28px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white55;
 });
 var OptionalBox = styledComponents.styled(Text).withConfig({
   displayName: "OptionalBox",
   componentId: "sc-1xa506b-2"
-})(_templateObject3$G || (_templateObject3$G = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n"])));
+})(_templateObject3$F || (_templateObject3$F = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n"])));
 var Optional = styledComponents.styled(Text).withConfig({
   displayName: "Optional",
   componentId: "sc-1xa506b-3"
-})(_templateObject4$v || (_templateObject4$v = _taggedTemplateLiteral(["\n  color: #373749;\n  font-weight: bold;\n  font-size: 11px;\n  line-height: 138.5%;\n"])));
+})(_templateObject4$u || (_templateObject4$u = _taggedTemplateLiteral(["\n  color: #373749;\n  font-weight: bold;\n  font-size: 11px;\n  line-height: 138.5%;\n"])));
 var StyledInputDesc = styledComponents.styled(Text).withConfig({
   displayName: "StyledInputDesc",
   componentId: "sc-1xa506b-4"
-})(_templateObject5$s || (_templateObject5$s = _taggedTemplateLiteral(["\n  color: ", ";\n  font-weight: normal;\n  font-size: 12px;\n  line-height: 170%;\n"])), function (_ref2) {
+})(_templateObject5$r || (_templateObject5$r = _taggedTemplateLiteral(["\n  color: ", ";\n  font-weight: normal;\n  font-size: 12px;\n  line-height: 170%;\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white55;
 });
@@ -11056,14 +10898,14 @@ var InputWrapper$1 = function InputWrapper(_ref0) {
   });
 };
 
-var _templateObject$1m, _templateObject2$S;
+var _templateObject$1l, _templateObject2$R;
 var StyledInput$1 = styledComponents.styled(function (_ref) {
   var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
   return /*#__PURE__*/jsxRuntime.jsx(DatePicker.DatePicker, _objectSpread2({}, props));
 }).withConfig({
   displayName: "StyledInput",
   componentId: "sc-2l4k3e-0"
-})(_templateObject$1m || (_templateObject$1m = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 60px;\n  .MuiInputBase-root {\n    border: 1px solid\n      ", ";\n    border-radius: 10px;\n    background: ", ";\n    padding: 16px 24px;\n    color: white;\n    font-weight: 500;\n    font-size: 16px;\n    line-height: 28px;\n    &.Mui-disabled {\n      .MuiInputBase-input {\n        color: ", ";\n      }\n    }\n  }\n  .MuiFormHelperText-root.Mui-error {\n    display: none;\n  }\n"])), function (props) {
+})(_templateObject$1l || (_templateObject$1l = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 60px;\n  .MuiInputBase-root {\n    border: 1px solid\n      ", ";\n    border-radius: 10px;\n    background: ", ";\n    padding: 16px 24px;\n    color: white;\n    font-weight: 500;\n    font-size: 16px;\n    line-height: 28px;\n    &.Mui-disabled {\n      .MuiInputBase-input {\n        color: ", ";\n      }\n    }\n  }\n  .MuiFormHelperText-root.Mui-error {\n    display: none;\n  }\n"])), function (props) {
   return props.disabled ? "".concat(props.theme.colors.white55) : props.error ? "".concat(props.theme.colors.error) : props.value ? "".concat(props.theme.colors.white55) : "rgba(255, 255, 255, 0.03)";
 }, function (props) {
   return props.disabled ? props.theme.colors.disabled : props.theme.backgrounds.secondary;
@@ -11077,7 +10919,7 @@ var DateInputWrapper = styledComponents.styled(function (_ref3) {
 }).withConfig({
   displayName: "DateInputWrapper",
   componentId: "sc-2l4k3e-1"
-})(_templateObject2$S || (_templateObject2$S = _taggedTemplateLiteral(["\n  margin-bottom: 15px;\n"])));
+})(_templateObject2$R || (_templateObject2$R = _taggedTemplateLiteral(["\n  margin-bottom: 15px;\n"])));
 var MuiDateInput = function MuiDateInput(_ref4) {
   var name = _ref4.name,
     label = _ref4.label,
@@ -11141,14 +10983,14 @@ var MuiDateInput = function MuiDateInput(_ref4) {
   });
 };
 
-var _templateObject$1l, _templateObject2$R;
+var _templateObject$1k, _templateObject2$Q;
 var DragAndDropZone = styledComponents.styled(function (_ref) {
   var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
   return /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread2({}, props));
 }).withConfig({
   displayName: "DragAndDropZone",
   componentId: "sc-1qlv44t-0"
-})(_templateObject$1l || (_templateObject$1l = _taggedTemplateLiteral(["\n  background: ", ";\n  cursor: ", ";\n  border: 1px\n    ", ";\n  box-sizing: border-box;\n  border-radius: 10px;\n  padding: 16px 24px;\n  font-weight: 500;\n  font-size: 16px;\n  line-height: 28px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 10px;\n"])), function (props) {
+})(_templateObject$1k || (_templateObject$1k = _taggedTemplateLiteral(["\n  background: ", ";\n  cursor: ", ";\n  border: 1px\n    ", ";\n  box-sizing: border-box;\n  border-radius: 10px;\n  padding: 16px 24px;\n  font-weight: 500;\n  font-size: 16px;\n  line-height: 28px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 10px;\n"])), function (props) {
   return props.disabled ? props.theme.colors.disabled : props.theme.backgrounds.secondary;
 }, function (props) {
   return props.disabled ? "not-allowed" : "pointer";
@@ -11161,7 +11003,7 @@ var DragAndDropText = styledComponents.styled(function (_ref2) {
 }).withConfig({
   displayName: "DragAndDropText",
   componentId: "sc-1qlv44t-1"
-})(_templateObject2$R || (_templateObject2$R = _taggedTemplateLiteral(["\n  font-weight: 500;\n  font-size: 16px;\n  line-height: 28px;\n  color: ", ";\n  span {\n    color: ", ";\n  }\n"])), function (props) {
+})(_templateObject2$Q || (_templateObject2$Q = _taggedTemplateLiteral(["\n  font-weight: 500;\n  font-size: 16px;\n  line-height: 28px;\n  color: ", ";\n  span {\n    color: ", ";\n  }\n"])), function (props) {
   return props.disabled ? props.theme.colors.white55 : props.theme.colors.white;
 }, function (props) {
   return props.disabled ? props.theme.colors.white55 : props.theme.colors.primary;
@@ -11235,22 +11077,22 @@ var MuiFileInput = function MuiFileInput(_ref3) {
 };
 
 var _excluded$8 = ["name", "label", "placeholderLabel", "placeholder", "topDesc", "bottomDesc", "optional", "value", "onChange", "onBlur", "error", "textarea", "maxLength", "disabled", "success", "successMsg"];
-var _templateObject$1k, _templateObject2$Q, _templateObject3$F;
+var _templateObject$1j, _templateObject2$P, _templateObject3$E;
 var TextAreaWrapper = styledComponents.styled.div.withConfig({
   displayName: "TextAreaWrapper",
   componentId: "sc-1pp44v8-0"
-})(_templateObject$1k || (_templateObject$1k = _taggedTemplateLiteral(["\n  position: relative;\n"])));
+})(_templateObject$1j || (_templateObject$1j = _taggedTemplateLiteral(["\n  position: relative;\n"])));
 var LengthText = styledComponents.styled(Text).withConfig({
   displayName: "LengthText",
   componentId: "sc-1pp44v8-1"
-})(_templateObject2$Q || (_templateObject2$Q = _taggedTemplateLiteral(["\n  position: absolute;\n  font-weight: bold;\n  font-size: 11px;\n  line-height: 138.5%;\n  color: ", ";\n  bottom: 20px;\n  right: 15px;\n"])), function (_ref) {
+})(_templateObject2$P || (_templateObject2$P = _taggedTemplateLiteral(["\n  position: absolute;\n  font-weight: bold;\n  font-size: 11px;\n  line-height: 138.5%;\n  color: ", ";\n  bottom: 20px;\n  right: 15px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.grey;
 });
 var StyledTextField = styledComponents.styled(material.TextField).withConfig({
   displayName: "StyledTextField",
   componentId: "sc-1pp44v8-2"
-})(_templateObject3$F || (_templateObject3$F = _taggedTemplateLiteral(["\n  &.MuiTextField-root {\n    margin-bottom: 10px;\n    width: 100%;\n    .MuiInputBase-input {\n      color: white;\n      ::placeholder {\n        opacity: 1;\n        color: ", ";\n      }\n    }\n    .MuiFilledInput-root {\n      background-color: ", ";\n      border: 1px solid ", ";\n      border-radius: 10px;\n      height: ", ";\n      .MuiFilledInput-input {\n        padding: ", ";\n      }\n      &.Mui-error {\n        border: 1px solid ", ";\n      }\n      &.Mui-focused {\n        border: 1px solid ", ";\n        box-shadow: 0px 0px 8px rgba(18, 255, 184, 0.15);\n        &.Mui-error {\n          border: 1px solid ", ";\n          box-shadow: unset;\n        }\n      }\n      &.Mui-disabled {\n        background-color: ", ";\n        border: 1px solid ", ";\n        .MuiInputBase-input {\n          color: ", ";\n        }\n      }\n      &.MuiFilledInput-underline:before {\n        border-bottom: unset;\n      }\n      &.MuiFilledInput-underline:after {\n        border-bottom: unset;\n      }\n    }\n    .MuiInputLabel-filled {\n      font-weight: 500;\n      font-size: 16px;\n      line-height: 28px;\n      transform: translate(24px, 17px);\n      color: ", ";\n      transition: all 0.15s;\n      &.MuiInputLabel-shrink {\n        font-weight: bold;\n        font-size: 11px;\n        line-height: 138.5%;\n        transform: translate(24px, 10px);\n        color: ", ";\n      }\n    }\n  }\n  .MuiFilledInput-multiline {\n    padding: 0px 12px 30px 0px;\n  }\n"])), function (_ref2) {
+})(_templateObject3$E || (_templateObject3$E = _taggedTemplateLiteral(["\n  &.MuiTextField-root {\n    margin-bottom: 10px;\n    width: 100%;\n    .MuiInputBase-input {\n      color: white;\n      ::placeholder {\n        opacity: 1;\n        color: ", ";\n      }\n    }\n    .MuiFilledInput-root {\n      background-color: ", ";\n      border: 1px solid ", ";\n      border-radius: 10px;\n      height: ", ";\n      .MuiFilledInput-input {\n        padding: ", ";\n      }\n      &.Mui-error {\n        border: 1px solid ", ";\n      }\n      &.Mui-focused {\n        border: 1px solid ", ";\n        box-shadow: 0px 0px 8px rgba(18, 255, 184, 0.15);\n        &.Mui-error {\n          border: 1px solid ", ";\n          box-shadow: unset;\n        }\n      }\n      &.Mui-disabled {\n        background-color: ", ";\n        border: 1px solid ", ";\n        .MuiInputBase-input {\n          color: ", ";\n        }\n      }\n      &.MuiFilledInput-underline:before {\n        border-bottom: unset;\n      }\n      &.MuiFilledInput-underline:after {\n        border-bottom: unset;\n      }\n    }\n    .MuiInputLabel-filled {\n      font-weight: 500;\n      font-size: 16px;\n      line-height: 28px;\n      transform: translate(24px, 17px);\n      color: ", ";\n      transition: all 0.15s;\n      &.MuiInputLabel-shrink {\n        font-weight: bold;\n        font-size: 11px;\n        line-height: 138.5%;\n        transform: translate(24px, 10px);\n        color: ", ";\n      }\n    }\n  }\n  .MuiFilledInput-multiline {\n    padding: 0px 12px 30px 0px;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme,
     disabled = _ref2.disabled;
   return disabled ? theme.colors.white55 : theme.colors.grey;
@@ -11358,22 +11200,22 @@ var MuiTextInput = function MuiTextInput(_ref11) {
   });
 };
 
-var _templateObject$1j, _templateObject2$P, _templateObject3$E;
+var _templateObject$1i, _templateObject2$O, _templateObject3$D;
 var CarouselBox = styledComponents.styled.div.withConfig({
   displayName: "CarouselBox",
   componentId: "sc-xakklk-0"
-})(_templateObject$1j || (_templateObject$1j = _taggedTemplateLiteral(["\n  height: 200px;\n"])));
+})(_templateObject$1i || (_templateObject$1i = _taggedTemplateLiteral(["\n  height: 200px;\n"])));
 var StyledSlider = styledComponents.styled(Slider).withConfig({
   displayName: "StyledSlider",
   componentId: "sc-xakklk-1"
-})(_templateObject2$P || (_templateObject2$P = _taggedTemplateLiteral(["\n  .slick-track {\n    > div {\n      padding: 0 10px;\n    }\n  }\n\n  .slick-dots {\n    .slick-active {\n      div {\n        background: ", " !important;\n      }\n    }\n  }\n"])), function (_ref) {
+})(_templateObject2$O || (_templateObject2$O = _taggedTemplateLiteral(["\n  .slick-track {\n    > div {\n      padding: 0 10px;\n    }\n  }\n\n  .slick-dots {\n    .slick-active {\n      div {\n        background: ", " !important;\n      }\n    }\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.blue;
 });
 var ImageDiv = styledComponents.styled.div.withConfig({
   displayName: "ImageDiv",
   componentId: "sc-xakklk-2"
-})(_templateObject3$E || (_templateObject3$E = _taggedTemplateLiteral(["\n  background: ", ";\n  background-size: cover;\n  color: white;\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: flex-end;\n  padding-bottom: 30px;\n  height: 200px;\n  border-radius: 15px;\n  border: 1px solid ", ";\n"])), function (_ref2) {
+})(_templateObject3$D || (_templateObject3$D = _taggedTemplateLiteral(["\n  background: ", ";\n  background-size: cover;\n  color: white;\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: flex-end;\n  padding-bottom: 30px;\n  height: 200px;\n  border-radius: 15px;\n  border: 1px solid ", ";\n"])), function (_ref2) {
   var background = _ref2.background;
   return background;
 }, function (_ref3) {
@@ -11422,7 +11264,7 @@ var scales = {
   MD: "md"
 };
 
-var _templateObject$1i;
+var _templateObject$1h;
 var getScale = function getScale(_ref) {
   var scale = _ref.scale;
   switch (scale) {
@@ -11456,7 +11298,7 @@ var Radio = styledComponents.styled.input.attrs(function (_ref3) {
 }).withConfig({
   displayName: "Radio",
   componentId: "sc-955j6u-0"
-})(_templateObject$1i || (_templateObject$1i = _taggedTemplateLiteral(["\n  appearance: none;\n  overflow: hidden;\n  cursor: pointer;\n  position: relative;\n  display: inline-block;\n  height: ", ";\n  width: ", ";\n  vertical-align: middle;\n  transition: background-color 0.2s ease-in-out;\n  border: 0;\n  border-radius: 50%;\n  background-color: ", ";\n  box-shadow: ", ";\n\n  &:after {\n    border-radius: 50%;\n    content: \"\";\n    height: ", ";\n    left: 6px;\n    position: absolute;\n    top: 6px;\n    width: ", ";\n  }\n\n  &:hover:not(:disabled):not(:checked) {\n    box-shadow: ", ";\n  }\n\n  &:focus {\n    outline: none;\n    box-shadow: ", ";\n  }\n\n  &:checked {\n    background-color: ", ";\n    &:after {\n      background-color: ", ";\n    }\n  }\n\n  &:disabled {\n    cursor: default;\n    opacity: 0.6;\n  }\n  ", "\n"])), getScale, getScale, function (_ref4) {
+})(_templateObject$1h || (_templateObject$1h = _taggedTemplateLiteral(["\n  appearance: none;\n  overflow: hidden;\n  cursor: pointer;\n  position: relative;\n  display: inline-block;\n  height: ", ";\n  width: ", ";\n  vertical-align: middle;\n  transition: background-color 0.2s ease-in-out;\n  border: 0;\n  border-radius: 50%;\n  background-color: ", ";\n  box-shadow: ", ";\n\n  &:after {\n    border-radius: 50%;\n    content: \"\";\n    height: ", ";\n    left: 6px;\n    position: absolute;\n    top: 6px;\n    width: ", ";\n  }\n\n  &:hover:not(:disabled):not(:checked) {\n    box-shadow: ", ";\n  }\n\n  &:focus {\n    outline: none;\n    box-shadow: ", ";\n  }\n\n  &:checked {\n    background-color: ", ";\n    &:after {\n      background-color: ", ";\n    }\n  }\n\n  &:disabled {\n    cursor: default;\n    opacity: 0.6;\n  }\n  ", "\n"])), getScale, getScale, function (_ref4) {
   var theme = _ref4.theme;
   return theme.colors.input;
 }, function (_ref5) {
@@ -11594,11 +11436,11 @@ var darkColors = _objectSpread2(_objectSpread2(_objectSpread2({}, baseColors), b
   }
 });
 
-var _templateObject$1h, _templateObject2$O;
+var _templateObject$1g, _templateObject2$N;
 var StyledCoreTag = styledComponents.styled.div.withConfig({
   displayName: "StyledCoreTag",
   componentId: "sc-1bfj6gr-0"
-})(_templateObject$1h || (_templateObject$1h = _taggedTemplateLiteral(["\n  width: auto;\n  height: 24px;\n  display: inline-flex;\n  justify-content: space-between;\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid ", ";\n  border-radius: ", ";\n  color: ", ";\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 1.5;\n  padding: 0 8px;\n  white-space: nowrap;\n\n  svg {\n    margin-left: ", "px;\n    margin-right: ", "px;\n    width: 16px;\n    height: 16px;\n    fill: ", ";\n  }\n"])), function (_ref) {
+})(_templateObject$1g || (_templateObject$1g = _taggedTemplateLiteral(["\n  width: auto;\n  height: 24px;\n  display: inline-flex;\n  justify-content: space-between;\n  align-items: center;\n  background-color: transparent;\n  border: 1px solid ", ";\n  border-radius: ", ";\n  color: ", ";\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 1.5;\n  padding: 0 8px;\n  white-space: nowrap;\n\n  svg {\n    margin-left: ", "px;\n    margin-right: ", "px;\n    width: 16px;\n    height: 16px;\n    fill: ", ";\n  }\n"])), function (_ref) {
   var theme = _ref.theme,
     active = _ref.active,
     color = _ref.color;
@@ -11625,7 +11467,7 @@ var StyledCoreTag = styledComponents.styled.div.withConfig({
 var StyledText = styledComponents.styled(Text).withConfig({
   displayName: "StyledText",
   componentId: "sc-1bfj6gr-1"
-})(_templateObject2$O || (_templateObject2$O = _taggedTemplateLiteral(["\n  font-weight: 700;\n  color: ", ";\n  font-size: 14px;\n  line-height: 20px;\n"])), function (_ref7) {
+})(_templateObject2$N || (_templateObject2$N = _taggedTemplateLiteral(["\n  font-weight: 700;\n  color: ", ";\n  font-size: 14px;\n  line-height: 20px;\n"])), function (_ref7) {
   var theme = _ref7.theme,
     active = _ref7.active,
     color = _ref7.color;
@@ -11709,12 +11551,12 @@ var Icon$M = function Icon(props) {
   }));
 };
 
-var _templateObject$1g, _templateObject2$N, _templateObject3$D;
-var rotate = styledComponents.keyframes(_templateObject$1g || (_templateObject$1g = _taggedTemplateLiteral(["\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n"])));
+var _templateObject$1f, _templateObject2$M, _templateObject3$C;
+var rotate = styledComponents.keyframes(_templateObject$1f || (_templateObject$1f = _taggedTemplateLiteral(["\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n"])));
 var Container$6 = styledComponents.styled.div.withConfig({
   displayName: "Container",
   componentId: "sc-1wgci3j-0"
-})(_templateObject2$N || (_templateObject2$N = _taggedTemplateLiteral(["\n  position: relative;\n  height: ", "px;\n  width: ", "px;\n"])), function (_ref) {
+})(_templateObject2$M || (_templateObject2$M = _taggedTemplateLiteral(["\n  position: relative;\n  height: ", "px;\n  width: ", "px;\n"])), function (_ref) {
   var size = _ref.size;
   return size;
 }, function (_ref2) {
@@ -11724,7 +11566,7 @@ var Container$6 = styledComponents.styled.div.withConfig({
 var RotatingSpinnerIcon = styledComponents.styled(Icon$M).withConfig({
   displayName: "RotatingSpinnerIcon",
   componentId: "sc-1wgci3j-1"
-})(_templateObject3$D || (_templateObject3$D = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  animation: ", " 2s linear infinite;\n  transform: translate3d(0, 0, 0);\n"])), rotate);
+})(_templateObject3$C || (_templateObject3$C = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  animation: ", " 2s linear infinite;\n  transform: translate3d(0, 0, 0);\n"])), rotate);
 var Spinner = function Spinner(_ref3) {
   var _ref3$size = _ref3.size,
     size = _ref3$size === void 0 ? 128 : _ref3$size;
@@ -11736,26 +11578,26 @@ var Spinner = function Spinner(_ref3) {
   });
 };
 
-var _templateObject$1f, _templateObject2$M, _templateObject3$C, _templateObject4$u;
+var _templateObject$1e, _templateObject2$L, _templateObject3$B, _templateObject4$t;
 var StyledContainer = styledComponents.styled.div.withConfig({
   displayName: "StyledContainer",
   componentId: "sc-1c4vjp9-0"
-})(_templateObject$1f || (_templateObject$1f = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  ", "\n"])), function (_ref) {
+})(_templateObject$1e || (_templateObject$1e = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  ", "\n"])), function (_ref) {
   var loader = _ref.loader;
   return loader && "\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  ";
 });
 var StyledItem = styledComponents.styled.div.withConfig({
   displayName: "StyledItem",
   componentId: "sc-1c4vjp9-1"
-})(_templateObject2$M || (_templateObject2$M = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  border-bottom: 1px solid rgba(55, 55, 73, 0.3);\n  padding-top: 8px;\n  padding-bottom: 8px;\n"])));
+})(_templateObject2$L || (_templateObject2$L = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  border-bottom: 1px solid rgba(55, 55, 73, 0.3);\n  padding-top: 8px;\n  padding-bottom: 8px;\n"])));
 var StyledLabel = styledComponents.styled(Text).withConfig({
   displayName: "StyledLabel",
   componentId: "sc-1c4vjp9-2"
-})(_templateObject3$C || (_templateObject3$C = _taggedTemplateLiteral(["\n  opacity: 0.55;\n"])));
+})(_templateObject3$B || (_templateObject3$B = _taggedTemplateLiteral(["\n  opacity: 0.55;\n"])));
 var ListWrapper = styledComponents.styled.div.withConfig({
   displayName: "ListWrapper",
   componentId: "sc-1c4vjp9-3"
-})(_templateObject4$u || (_templateObject4$u = _taggedTemplateLiteral(["\n  display: flex;\n  height: ", ";\n"])), function (_ref2) {
+})(_templateObject4$t || (_templateObject4$t = _taggedTemplateLiteral(["\n  display: flex;\n  height: ", ";\n"])), function (_ref2) {
   var customHeight = _ref2.customHeight;
   return customHeight ? "".concat(customHeight, "px") : "100%";
 });
@@ -11818,18 +11660,18 @@ var List = function List(_ref3) {
   });
 };
 
-var _templateObject$1e, _templateObject2$L;
+var _templateObject$1d, _templateObject2$K;
 var Bar = styledComponents.styled.div.withConfig({
   displayName: "Bar",
   componentId: "sc-1wd61gz-0"
-})(_templateObject$1e || (_templateObject$1e = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  background-color: ", ";\n  border-top-left-radius: 32px;\n  border-bottom-left-radius: 32px;\n  height: 16px;\n  transition: width 200ms ease;\n"])), function (props) {
+})(_templateObject$1d || (_templateObject$1d = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  background-color: ", ";\n  border-top-left-radius: 32px;\n  border-bottom-left-radius: 32px;\n  height: 16px;\n  transition: width 200ms ease;\n"])), function (props) {
   var _props$primary;
   return ((_props$primary = props.primary) !== null && _props$primary !== void 0 ? _props$primary : false) ? props.theme.colors.secondary : "".concat(props.theme.colors.secondary, "80");
 });
 var StyledProgress = styledComponents.styled.div.withConfig({
   displayName: "StyledProgress",
   componentId: "sc-1wd61gz-1"
-})(_templateObject2$L || (_templateObject2$L = _taggedTemplateLiteral(["\n  position: relative;\n  background-color: ", ";\n  border-radius: 32px;\n  box-shadow: ", ";\n  height: 16px;\n  overflow: hidden;\n"])), function (_ref) {
+})(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteral(["\n  position: relative;\n  background-color: ", ";\n  border-radius: 32px;\n  box-shadow: ", ";\n  height: 16px;\n  overflow: hidden;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.input;
 }, function (_ref2) {
@@ -11837,11 +11679,11 @@ var StyledProgress = styledComponents.styled.div.withConfig({
   return theme.shadows.inset;
 });
 
-var _templateObject$1d;
+var _templateObject$1c;
 var ProgressBunnyWrapper = styledComponents.styled.div.withConfig({
   displayName: "ProgressBunnyWrapper",
   componentId: "sc-12wvu5w-0"
-})(_templateObject$1d || (_templateObject$1d = _taggedTemplateLiteral(["\n  display: flex;\n  z-index: 2;\n  top: -65%;\n  position: absolute;\n  transform: translate(-50%, -50%);\n  transition: left 200ms ease-out;\n"])));
+})(_templateObject$1c || (_templateObject$1c = _taggedTemplateLiteral(["\n  display: flex;\n  z-index: 2;\n  top: -65%;\n  position: absolute;\n  transform: translate(-50%, -50%);\n  transition: left 200ms ease-out;\n"])));
 
 var stepGuard = function stepGuard(step) {
   if (step < 0) {
@@ -11888,13 +11730,13 @@ var variant = {
 };
 
 var _excluded$6 = ["variant", "animation"];
-var _templateObject$1c, _templateObject2$K, _templateObject3$B, _templateObject4$t, _templateObject5$r;
-var waves = styledComponents.keyframes(_templateObject$1c || (_templateObject$1c = _taggedTemplateLiteral(["\n   from {\n        left: -150px;\n    }\n    to   {\n        left: 100%;\n    }\n"])));
-var pulse = styledComponents.keyframes(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteral(["\n  0% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.4;\n  }\n  100% {\n    opacity: 1;\n  }\n"])));
+var _templateObject$1b, _templateObject2$J, _templateObject3$A, _templateObject4$s, _templateObject5$q;
+var waves = styledComponents.keyframes(_templateObject$1b || (_templateObject$1b = _taggedTemplateLiteral(["\n   from {\n        left: -150px;\n    }\n    to   {\n        left: 100%;\n    }\n"])));
+var pulse = styledComponents.keyframes(_templateObject2$J || (_templateObject2$J = _taggedTemplateLiteral(["\n  0% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.4;\n  }\n  100% {\n    opacity: 1;\n  }\n"])));
 var Root = styledComponents.styled.div.withConfig({
   displayName: "Root",
   componentId: "sc-20824z-0"
-})(_templateObject3$B || (_templateObject3$B = _taggedTemplateLiteral(["\n  min-height: 20px;\n  display: block;\n  background-color: ", ";\n  border-radius: ", ";\n\n  ", "\n  ", "\n"])), function (_ref) {
+})(_templateObject3$A || (_templateObject3$A = _taggedTemplateLiteral(["\n  min-height: 20px;\n  display: block;\n  background-color: ", ";\n  border-radius: ", ";\n\n  ", "\n  ", "\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.backgroundDisabled;
 }, function (_ref2) {
@@ -11905,11 +11747,11 @@ var Root = styledComponents.styled.div.withConfig({
 var Pulse = styledComponents.styled(Root).withConfig({
   displayName: "Pulse",
   componentId: "sc-20824z-1"
-})(_templateObject4$t || (_templateObject4$t = _taggedTemplateLiteral(["\n  animation: ", " 2s infinite ease-out;\n  transform: translate3d(0, 0, 0);\n"])), pulse);
+})(_templateObject4$s || (_templateObject4$s = _taggedTemplateLiteral(["\n  animation: ", " 2s infinite ease-out;\n  transform: translate3d(0, 0, 0);\n"])), pulse);
 var Waves = styledComponents.styled(Root).withConfig({
   displayName: "Waves",
   componentId: "sc-20824z-2"
-})(_templateObject5$r || (_templateObject5$r = _taggedTemplateLiteral(["\n  position: relative;\n  overflow: hidden;\n  transform: translate3d(0, 0, 0);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  &:before {\n    content: \"\";\n    position: absolute;\n    background-image: linear-gradient(90deg, transparent, rgba(243, 243, 243, 0.5), transparent);\n    top: 0;\n    left: -150px;\n    height: 100%;\n    width: 150px;\n    animation: ", " 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;\n  }\n"])), waves);
+})(_templateObject5$q || (_templateObject5$q = _taggedTemplateLiteral(["\n  position: relative;\n  overflow: hidden;\n  transform: translate3d(0, 0, 0);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  &:before {\n    content: \"\";\n    position: absolute;\n    background-image: linear-gradient(90deg, transparent, rgba(243, 243, 243, 0.5), transparent);\n    top: 0;\n    left: -150px;\n    height: 100%;\n    width: 150px;\n    animation: ", " 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;\n  }\n"])), waves);
 var Skeleton = function Skeleton(_ref3) {
   var _ref3$variant = _ref3.variant,
     variant$1 = _ref3$variant === void 0 ? variant.RECT : _ref3$variant,
@@ -11927,15 +11769,15 @@ var Skeleton = function Skeleton(_ref3) {
 };
 
 var _excluded$5 = ["text"];
-var _templateObject$1b, _templateObject2$J;
+var _templateObject$1a, _templateObject2$I;
 var StyledButton = styledComponents.styled(Button$1).withConfig({
   displayName: "StyledButton",
   componentId: "sc-1ofv4rm-0"
-})(_templateObject$1b || (_templateObject$1b = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 11px 27px;\n  border-radius: 10px;\n  // Should this color be added to theme colors?\n  background-color: rgb(43, 43, 56);\n\n  #open-new {\n    width: 13.25px;\n    height: 13.25px;\n  }\n"])));
+})(_templateObject$1a || (_templateObject$1a = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 11px 27px;\n  border-radius: 10px;\n  // Should this color be added to theme colors?\n  background-color: rgb(43, 43, 56);\n\n  #open-new {\n    width: 13.25px;\n    height: 13.25px;\n  }\n"])));
 var DetailsContainer = styledComponents.styled.div.withConfig({
   displayName: "DetailsContainer",
   componentId: "sc-1ofv4rm-1"
-})(_templateObject2$J || (_templateObject2$J = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n\n  * {\n    margin-right: 10px;\n  }\n"])));
+})(_templateObject2$I || (_templateObject2$I = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n\n  * {\n    margin-right: 10px;\n  }\n"])));
 var SwapButton = function SwapButton(_ref) {
   var _ref$text = _ref.text,
     text = _ref$text === void 0 ? "Token info page" : _ref$text,
@@ -12647,11 +12489,11 @@ var lightTheme = _objectSpread2(_objectSpread2({}, base), {}, {
   tooltip: light
 });
 
-var _templateObject$1a;
+var _templateObject$19;
 var TableActiveDot = styledComponents.styled.div.withConfig({
   displayName: "TableActiveDot",
   componentId: "sc-1phywr3-0"
-})(_templateObject$1a || (_templateObject$1a = _taggedTemplateLiteral(["\n  width: 8px;\n  height: 8px;\n  background: ", ";\n  border-radius: 50%;\n  margin: auto;\n  box-shadow: ", ";\n  @media (max-width: 576px) {\n    margin: 0;\n  }\n"])), function (_ref) {
+})(_templateObject$19 || (_templateObject$19 = _taggedTemplateLiteral(["\n  width: 8px;\n  height: 8px;\n  background: ", ";\n  border-radius: 50%;\n  margin: auto;\n  box-shadow: ", ";\n  @media (max-width: 576px) {\n    margin: 0;\n  }\n"])), function (_ref) {
   var actionActive = _ref.actionActive;
   return actionActive ? "#12FFB8" : "#373749";
 }, function (_ref2) {
@@ -12659,11 +12501,11 @@ var TableActiveDot = styledComponents.styled.div.withConfig({
   return actionActive ? "0px 0px 14px 3px rgba(18, 255, 184, 0.17)" : "none";
 });
 
-var _templateObject$19, _templateObject2$I, _templateObject3$A, _templateObject4$s, _templateObject5$q;
+var _templateObject$18, _templateObject2$H, _templateObject3$z, _templateObject4$r, _templateObject5$p;
 var StyledRow = styledComponents.styled.div.withConfig({
   displayName: "StyledRow",
   componentId: "sc-qzdbwn-0"
-})(_templateObject$19 || (_templateObject$19 = _taggedTemplateLiteral(["\n  position: relative;\n  width: calc(100% - 60px);\n  height: ", ";\n  margin: ", " 30px 0 30px;\n  padding: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n  border-radius: ", ";\n  border: ", ";\n  border-bottom: ", ";\n  background: ", ";\n  @media (max-width: 576px) {\n    min-height: 59px;\n    width: calc(100% - 16px);\n    margin: ", " 8px 0 8px;\n  }\n"])), function (_ref) {
+})(_templateObject$18 || (_templateObject$18 = _taggedTemplateLiteral(["\n  position: relative;\n  width: calc(100% - 60px);\n  height: ", ";\n  margin: ", " 30px 0 30px;\n  padding: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: column;\n  border-radius: ", ";\n  border: ", ";\n  border-bottom: ", ";\n  background: ", ";\n  @media (max-width: 576px) {\n    min-height: 59px;\n    width: calc(100% - 16px);\n    margin: ", " 8px 0 8px;\n  }\n"])), function (_ref) {
   var active = _ref.active;
   return active ? "auto" : "77.5px";
 }, function (_ref2) {
@@ -12692,19 +12534,19 @@ var StyledRow = styledComponents.styled.div.withConfig({
 var StyledTableChildren = styledComponents.styled(GridLayout$1).withConfig({
   displayName: "StyledTableChildren",
   componentId: "sc-qzdbwn-1"
-})(_templateObject2$I || (_templateObject2$I = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 77.5px;\n  align-items: center;\n  justify-content: center;\n  flex-direction: row;\n  cursor: pointer;\n  position: relative;\n"])));
+})(_templateObject2$H || (_templateObject2$H = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 77.5px;\n  align-items: center;\n  justify-content: center;\n  flex-direction: row;\n  cursor: pointer;\n  position: relative;\n"])));
 var StyledTableDetails = styledComponents.styled(GridLayout$1).withConfig({
   displayName: "StyledTableDetails",
   componentId: "sc-qzdbwn-2"
-})(_templateObject3$A || (_templateObject3$A = _taggedTemplateLiteral(["\n  padding: 13px;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"])));
+})(_templateObject3$z || (_templateObject3$z = _taggedTemplateLiteral(["\n  padding: 13px;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n"])));
 var ToggleContainer = styledComponents.styled.div.withConfig({
   displayName: "ToggleContainer",
   componentId: "sc-qzdbwn-3"
-})(_templateObject4$s || (_templateObject4$s = _taggedTemplateLiteral(["\n  grid-column: span 1 / -1;\n  cursor: pointer;\n  margin-right: 19px;\n  @media (max-width: 576px) {\n    position: absolute;\n    right: 0;\n    margin-right: 10px;\n  }\n"])));
+})(_templateObject4$r || (_templateObject4$r = _taggedTemplateLiteral(["\n  grid-column: span 1 / -1;\n  cursor: pointer;\n  margin-right: 19px;\n  @media (max-width: 576px) {\n    position: absolute;\n    right: 0;\n    margin-right: 10px;\n  }\n"])));
 var DotContainer = styledComponents.styled.div.withConfig({
   displayName: "DotContainer",
   componentId: "sc-qzdbwn-4"
-})(_templateObject5$q || (_templateObject5$q = _taggedTemplateLiteral(["\n  grid-column: span 1;\n  @media (max-width: 576px) {\n    margin-left: 10px;\n  }\n"])));
+})(_templateObject5$p || (_templateObject5$p = _taggedTemplateLiteral(["\n  grid-column: span 1;\n  @media (max-width: 576px) {\n    margin-left: 10px;\n  }\n"])));
 var TableRow = function TableRow(_ref9) {
   var children = _ref9.children,
     details = _ref9.details,
@@ -12742,19 +12584,19 @@ var TableRow = function TableRow(_ref9) {
   });
 };
 
-var _templateObject$18, _templateObject2$H, _templateObject3$z;
+var _templateObject$17, _templateObject2$G, _templateObject3$y;
 var LiquidityWrapper = styledComponents.styled.div.withConfig({
   displayName: "LiquidityWrapper",
   componentId: "sc-wsy021-0"
-})(_templateObject$18 || (_templateObject$18 = _taggedTemplateLiteral(["\n  padding-right: 4px;\n  width: 100%;\n"])));
+})(_templateObject$17 || (_templateObject$17 = _taggedTemplateLiteral(["\n  padding-right: 4px;\n  width: 100%;\n"])));
 var DescriptionRow = styledComponents.styled.div.withConfig({
   displayName: "DescriptionRow",
   componentId: "sc-wsy021-1"
-})(_templateObject2$H || (_templateObject2$H = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n"])));
+})(_templateObject2$G || (_templateObject2$G = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n"])));
 var Container$5 = styledComponents.styled.div.withConfig({
   displayName: "Container",
   componentId: "sc-wsy021-2"
-})(_templateObject3$z || (_templateObject3$z = _taggedTemplateLiteral(["\n  height: 100%;\n  padding: 17px;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: space-around;\n  grid-column: span ", ";\n  border: 1px solid rgba(255, 255, 255, 0.1);\n  border-radius: 10px;\n  svg {\n    margin-left: 0;\n  }\n"])), function (_ref) {
+})(_templateObject3$y || (_templateObject3$y = _taggedTemplateLiteral(["\n  height: 100%;\n  padding: 17px;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: space-around;\n  grid-column: span ", ";\n  border: 1px solid rgba(255, 255, 255, 0.1);\n  border-radius: 10px;\n  svg {\n    margin-left: 0;\n  }\n"])), function (_ref) {
   var grid = _ref.grid;
   return grid;
 });
@@ -12786,11 +12628,11 @@ var LiquidityContainer = function LiquidityContainer(_ref2) {
   });
 };
 
-var _templateObject$17, _templateObject2$G, _templateObject3$y;
+var _templateObject$16, _templateObject2$F, _templateObject3$x;
 var Container$4 = styledComponents.styled.div.withConfig({
   displayName: "Container",
   componentId: "sc-1t71h7-0"
-})(_templateObject$17 || (_templateObject$17 = _taggedTemplateLiteral(["\n  width: 100%;\n  padding: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: space-around;\n  grid-column: span ", ";\n  border: ", ";\n  border-radius: 10px;\n  svg {\n    margin-left: 0;\n  }\n"])), function (_ref) {
+})(_templateObject$16 || (_templateObject$16 = _taggedTemplateLiteral(["\n  width: 100%;\n  padding: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: space-around;\n  grid-column: span ", ";\n  border: ", ";\n  border-radius: 10px;\n  svg {\n    margin-left: 0;\n  }\n"])), function (_ref) {
   var mobile = _ref.mobile;
   return mobile ? "0px" : "17px";
 }, function (_ref2) {
@@ -12803,14 +12645,14 @@ var Container$4 = styledComponents.styled.div.withConfig({
 var TokenValueWrapper = styledComponents.styled.div.withConfig({
   displayName: "TokenValueWrapper",
   componentId: "sc-1t71h7-1"
-})(_templateObject2$G || (_templateObject2$G = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: ", ";\n"])), function (_ref4) {
+})(_templateObject2$F || (_templateObject2$F = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: ", ";\n"])), function (_ref4) {
   var mobile = _ref4.mobile;
   return mobile ? "flex-start" : "space-between";
 });
 var ActionsWrapper = styledComponents.styled.div.withConfig({
   displayName: "ActionsWrapper",
   componentId: "sc-1t71h7-2"
-})(_templateObject3$y || (_templateObject3$y = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  margin-top: 4px;\n  width: 100%;\n  justify-content: space-between;\n"])));
+})(_templateObject3$x || (_templateObject3$x = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  margin-top: 4px;\n  width: 100%;\n  justify-content: space-between;\n"])));
 var TableActionBox = function TableActionBox(_ref5) {
   var title = _ref5.title,
     value = _ref5.value,
@@ -12870,30 +12712,30 @@ var getNumberedDifference = function getNumberedDifference(differenceToConvert)
   return 0;
 };
 
-var _templateObject$16, _templateObject2$F, _templateObject3$x, _templateObject4$r, _templateObject5$p;
+var _templateObject$15, _templateObject2$E, _templateObject3$w, _templateObject4$q, _templateObject5$o;
 var ValueBox = styledComponents.styled.div.withConfig({
   displayName: "ValueBox",
   componentId: "sc-2a5tiq-0"
-})(_templateObject$16 || (_templateObject$16 = _taggedTemplateLiteral(["\n  background: transparent;\n  color: white;\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: flex-start;\n  max-width: 190px;\n"])));
+})(_templateObject$15 || (_templateObject$15 = _taggedTemplateLiteral(["\n  background: transparent;\n  color: white;\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: flex-start;\n  max-width: 190px;\n"])));
 var IconColumn = styledComponents.styled.div.withConfig({
   displayName: "IconColumn",
   componentId: "sc-2a5tiq-1"
-})(_templateObject2$F || (_templateObject2$F = _taggedTemplateLiteral(["\n  width: auto;\n  padding-right: 10px;\n  padding-top: 1px;\n"])));
+})(_templateObject2$E || (_templateObject2$E = _taggedTemplateLiteral(["\n  width: auto;\n  padding-right: 10px;\n  padding-top: 1px;\n"])));
 var InfoColumn = styledComponents.styled.div.withConfig({
   displayName: "InfoColumn",
   componentId: "sc-2a5tiq-2"
-})(_templateObject3$x || (_templateObject3$x = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
+})(_templateObject3$w || (_templateObject3$w = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
 var PairContainer = styledComponents.styled.div.withConfig({
   displayName: "PairContainer",
   componentId: "sc-2a5tiq-3"
-})(_templateObject4$r || (_templateObject4$r = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  margin-bottom: 5px;\n  align-items: center;\n  flex-direction: ", ";\n"])), function (_ref) {
+})(_templateObject4$q || (_templateObject4$q = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  margin-bottom: 5px;\n  align-items: center;\n  flex-direction: ", ";\n"])), function (_ref) {
   var mobile = _ref.mobile;
   return mobile ? "column" : "row";
 });
 var ValueRow = styledComponents.styled.div.withConfig({
   displayName: "ValueRow",
   componentId: "sc-2a5tiq-4"
-})(_templateObject5$p || (_templateObject5$p = _taggedTemplateLiteral(["\n  width: 100%;\n"])));
+})(_templateObject5$o || (_templateObject5$o = _taggedTemplateLiteral(["\n  width: 100%;\n"])));
 var Value = function Value(_ref2) {
   var coin = _ref2.coin,
     value = _ref2.value,
@@ -12947,15 +12789,15 @@ var Value = function Value(_ref2) {
   });
 };
 
-var _templateObject$15, _templateObject2$E;
+var _templateObject$14, _templateObject2$D;
 var ValueFullBox = styledComponents.styled.div.withConfig({
   displayName: "ValueFullBox",
   componentId: "sc-ig82wo-0"
-})(_templateObject$15 || (_templateObject$15 = _taggedTemplateLiteral(["\n  background: transparent;\n  color: white;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n  width: 100%;\n"])));
+})(_templateObject$14 || (_templateObject$14 = _taggedTemplateLiteral(["\n  background: transparent;\n  color: white;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n  width: 100%;\n"])));
 var DifferenceBox = styledComponents.styled.div.withConfig({
   displayName: "DifferenceBox",
   componentId: "sc-ig82wo-1"
-})(_templateObject2$E || (_templateObject2$E = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  height: 24px;\n"])));
+})(_templateObject2$D || (_templateObject2$D = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  height: 24px;\n"])));
 var ValueFull = function ValueFull(_ref) {
   var value = _ref.value,
     difference = _ref.difference;
@@ -12986,11 +12828,11 @@ var ValueFull = function ValueFull(_ref) {
   });
 };
 
-var _templateObject$14;
+var _templateObject$13;
 var VContainer = styledComponents.styled.div.withConfig({
   displayName: "VContainer",
   componentId: "sc-o09b6h-0"
-})(_templateObject$14 || (_templateObject$14 = _taggedTemplateLiteral(["\n  position: absolute;\n  right: 20px;\n  bottom: 20px;\n  color: ", ";\n  opacity: 0.6;\n  font-size: 12px;\n"])), function (_ref) {
+})(_templateObject$13 || (_templateObject$13 = _taggedTemplateLiteral(["\n  position: absolute;\n  right: 20px;\n  bottom: 20px;\n  color: ", ";\n  opacity: 0.6;\n  font-size: 12px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.secondaryText;
 });
@@ -13001,23 +12843,23 @@ var VersionContainer = function VersionContainer(_ref2) {
   });
 };
 
-var _templateObject$13, _templateObject2$D, _templateObject3$w, _templateObject4$q, _templateObject5$o, _templateObject6$h, _templateObject7$d;
+var _templateObject$12, _templateObject2$C, _templateObject3$v, _templateObject4$p, _templateObject5$n, _templateObject6$h, _templateObject7$d;
 var ProgressDataColumn = styledComponents.styled.div.withConfig({
   displayName: "ProgressDataColumn",
   componentId: "sc-ri8846-0"
-})(_templateObject$13 || (_templateObject$13 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n"])));
+})(_templateObject$12 || (_templateObject$12 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n"])));
 var ProgressDataRow = styledComponents.styled.div.withConfig({
   displayName: "ProgressDataRow",
   componentId: "sc-ri8846-1"
-})(_templateObject2$D || (_templateObject2$D = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n"])));
+})(_templateObject2$C || (_templateObject2$C = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n"])));
 var ProgressBarWrapper = styledComponents.styled.div.withConfig({
   displayName: "ProgressBarWrapper",
   componentId: "sc-ri8846-2"
-})(_templateObject3$w || (_templateObject3$w = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  height: 8px;\n  background: #272730;\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: 4px;\n  box-sizing: border-box;\n"])));
+})(_templateObject3$v || (_templateObject3$v = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  height: 8px;\n  background: #272730;\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: 4px;\n  box-sizing: border-box;\n"])));
 var ProgressBar = styledComponents.styled.div.withConfig({
   displayName: "ProgressBar",
   componentId: "sc-ri8846-3"
-})(_templateObject4$q || (_templateObject4$q = _taggedTemplateLiteral(["\n  position: relative;\n  height: 100%;\n  width: ", "%;\n  background: ", ";\n  border-radius: 4px;\n"])), function (_ref) {
+})(_templateObject4$p || (_templateObject4$p = _taggedTemplateLiteral(["\n  position: relative;\n  height: 100%;\n  width: ", "%;\n  background: ", ";\n  border-radius: 4px;\n"])), function (_ref) {
   var width = _ref.width;
   return width;
 }, function (_ref2) {
@@ -13027,7 +12869,7 @@ var ProgressBar = styledComponents.styled.div.withConfig({
 var ProgressDescription = styledComponents.styled(Text).withConfig({
   displayName: "ProgressDescription",
   componentId: "sc-ri8846-4"
-})(_templateObject5$o || (_templateObject5$o = _taggedTemplateLiteral(["\n  font-weight: 600;\n  font-size: 18px;\n  line-height: 170%;\n  color: ", ";\n  margin-bottom: 8px;\n"])), function (_ref3) {
+})(_templateObject5$n || (_templateObject5$n = _taggedTemplateLiteral(["\n  font-weight: 600;\n  font-size: 18px;\n  line-height: 170%;\n  color: ", ";\n  margin-bottom: 8px;\n"])), function (_ref3) {
   var theme = _ref3.theme,
     color = _ref3.color;
   return color || theme.colors.white;
@@ -13083,22 +12925,22 @@ var SpacePadProgressBar = function SpacePadProgressBar(_ref4) {
   });
 };
 
-var _templateObject$12, _templateObject2$C, _templateObject3$v, _templateObject4$p, _templateObject5$n;
+var _templateObject$11, _templateObject2$B, _templateObject3$u, _templateObject4$o, _templateObject5$m;
 var MainWrapper$1 = styledComponents.styled.div.withConfig({
   displayName: "MainWrapper",
   componentId: "sc-1lzbjkk-0"
-})(_templateObject$12 || (_templateObject$12 = _taggedTemplateLiteral(["\n  display: flex;\n  height: 94px;\n  justify-content: flex-start;\n  align-items: center;\n  flex-direction: row;\n"])));
+})(_templateObject$11 || (_templateObject$11 = _taggedTemplateLiteral(["\n  display: flex;\n  height: 94px;\n  justify-content: flex-start;\n  align-items: center;\n  flex-direction: row;\n"])));
 var ProjectImage = styledComponents.styled.div.withConfig({
   displayName: "ProjectImage",
   componentId: "sc-1lzbjkk-1"
-})(_templateObject2$C || (_templateObject2$C = _taggedTemplateLiteral(["\n  display: flex;\n  width: 46px;\n  height: 46px;\n  margin-right: 34px;\n  border-radius: 50%;\n  justify-content: center;\n  align-items: center;\n  ", " {\n    margin-right: 12px;\n  }\n"])), function (_ref) {
+})(_templateObject2$B || (_templateObject2$B = _taggedTemplateLiteral(["\n  display: flex;\n  width: 46px;\n  height: 46px;\n  margin-right: 34px;\n  border-radius: 50%;\n  justify-content: center;\n  align-items: center;\n  ", " {\n    margin-right: 12px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.mobile;
 });
 var ProjectName$1 = styledComponents.styled.div.withConfig({
   displayName: "ProjectName",
   componentId: "sc-1lzbjkk-2"
-})(_templateObject3$v || (_templateObject3$v = _taggedTemplateLiteral(["\n  display: flex;\n  margin-right: 8px;\n  justify-content: center;\n  align-items: flex-end;\n  font-size: 26px;\n  font-weight: bold;\n  color: ", ";\n  ", " {\n    margin-bottom: 6px;\n  }\n"])), function (_ref2) {
+})(_templateObject3$u || (_templateObject3$u = _taggedTemplateLiteral(["\n  display: flex;\n  margin-right: 8px;\n  justify-content: center;\n  align-items: flex-end;\n  font-size: 26px;\n  font-weight: bold;\n  color: ", ";\n  ", " {\n    margin-bottom: 6px;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white;
 }, function (_ref3) {
@@ -13108,14 +12950,14 @@ var ProjectName$1 = styledComponents.styled.div.withConfig({
 var ProjectFullName = styledComponents.styled.div.withConfig({
   displayName: "ProjectFullName",
   componentId: "sc-1lzbjkk-3"
-})(_templateObject4$p || (_templateObject4$p = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  color: ", ";\n  letter-spacing: 0.03rem;\n  font-size: 14px;\n"])), function (_ref4) {
+})(_templateObject4$o || (_templateObject4$o = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: flex-end;\n  justify-content: center;\n  color: ", ";\n  letter-spacing: 0.03rem;\n  font-size: 14px;\n"])), function (_ref4) {
   var theme = _ref4.theme;
   return theme.colors.white55;
 });
 var ProjectDetails = styledComponents.styled.div.withConfig({
   displayName: "ProjectDetails",
   componentId: "sc-1lzbjkk-4"
-})(_templateObject5$n || (_templateObject5$n = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: flex-end;\n  justify-content: flex-start;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n"])), function (_ref5) {
+})(_templateObject5$m || (_templateObject5$m = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: flex-end;\n  justify-content: flex-start;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n"])), function (_ref5) {
   var theme = _ref5.theme;
   return theme.mediaQueries.mobile;
 });
@@ -13489,17 +13331,17 @@ var connectors = [{
 }];
 var connectorLocalStorageKey = "connectorId";
 
-var _templateObject$11;
+var _templateObject$10;
 var AccountNumber = styledComponents.styled(Text).withConfig({
   displayName: "AccountNumber",
   componentId: "sc-1jw25yf-0"
-})(_templateObject$11 || (_templateObject$11 = _taggedTemplateLiteral(["\n  color: #818c92;\n  line-height: 23.8px;\n"])));
+})(_templateObject$10 || (_templateObject$10 = _taggedTemplateLiteral(["\n  color: #818c92;\n  line-height: 23.8px;\n"])));
 
-var _templateObject$10;
+var _templateObject$$;
 var AccountNumberWrapper = styledComponents.styled.div.withConfig({
   displayName: "AccountNumberWrapper",
   componentId: "sc-1bz6nuv-0"
-})(_templateObject$10 || (_templateObject$10 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: ", ";\n  align-items: center;\n  justify-content: center;\n  text-align: ", ";\n"])), function (_ref) {
+})(_templateObject$$ || (_templateObject$$ = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: ", ";\n  align-items: center;\n  justify-content: center;\n  text-align: ", ";\n"])), function (_ref) {
   var isVerifiedUser = _ref.isVerifiedUser;
   return !isVerifiedUser ? "column" : "row";
 }, function (_ref2) {
@@ -13507,99 +13349,99 @@ var AccountNumberWrapper = styledComponents.styled.div.withConfig({
   return textAlign && textAlign;
 });
 
-var _templateObject$$;
+var _templateObject$_;
 var Background = styledComponents.styled.div.withConfig({
   displayName: "Background",
   componentId: "sc-s9bf1w-0"
-})(_templateObject$$ || (_templateObject$$ = _taggedTemplateLiteral(["\n  position: absolute;\n  width: 100vw;\n  height: 100vh;\n  background-color: black;\n  opacity: 0.4;\n  left: 0;\n  top: 0;\n  z-index: 11;\n"])));
+})(_templateObject$_ || (_templateObject$_ = _taggedTemplateLiteral(["\n  position: absolute;\n  width: 100vw;\n  height: 100vh;\n  background-color: black;\n  opacity: 0.4;\n  left: 0;\n  top: 0;\n  z-index: 11;\n"])));
 
-var _templateObject$_;
+var _templateObject$Z;
 var BottomRow = styledComponents.styled.div.withConfig({
   displayName: "BottomRow",
   componentId: "sc-1elsl0s-0"
-})(_templateObject$_ || (_templateObject$_ = _taggedTemplateLiteral(["\n  padding-top: 20px;\n"])));
+})(_templateObject$Z || (_templateObject$Z = _taggedTemplateLiteral(["\n  padding-top: 20px;\n"])));
 
-var _templateObject$Z;
+var _templateObject$Y;
 styledComponents.styled(Button$1).withConfig({
   displayName: "ChangeProviderButton",
   componentId: "sc-w1eu8g-0"
-})(_templateObject$Z || (_templateObject$Z = _taggedTemplateLiteral(["\n  background: #383847;\n  color: ", ";\n  width: 85px;\n  height: 32px;\n  font-size: 14px;\n"])), function (_ref) {
+})(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n  background: #383847;\n  color: ", ";\n  width: 85px;\n  height: 32px;\n  font-size: 14px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white;
 });
 
-var _templateObject$Y;
+var _templateObject$X;
 var CloseButton = styledComponents.styled(Icon$2m).withConfig({
   displayName: "CloseButton",
   componentId: "sc-1afnq0v-0"
-})(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n  width: 24px;\n  height: 24px;\n  border-radius: 50%;\n  cursor: pointer;\n  background: #383847;\n  position: absolute;\n  left: -35px;\n  top: 5px;\n"])));
+})(_templateObject$X || (_templateObject$X = _taggedTemplateLiteral(["\n  width: 24px;\n  height: 24px;\n  border-radius: 50%;\n  cursor: pointer;\n  background: #383847;\n  position: absolute;\n  left: -35px;\n  top: 5px;\n"])));
 
-var _templateObject$X;
+var _templateObject$W;
 var ConnectedInfoWrapper = styledComponents.styled.div.withConfig({
   displayName: "ConnectedInfoWrapper",
   componentId: "sc-lxc0i5-0"
-})(_templateObject$X || (_templateObject$X = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-top: 16px;\n"])));
+})(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-top: 16px;\n"])));
 
-var _templateObject$W;
+var _templateObject$V;
 var ConnectedProvider = styledComponents.styled.div.withConfig({
   displayName: "ConnectedProvider",
   componentId: "sc-1satccs-0"
-})(_templateObject$W || (_templateObject$W = _taggedTemplateLiteral(["\n  height: 72px;\n  width: 309px;\n  margin-top: 24px;\n  display: flex;\n  align-items: center;\n  padding-left: 32px;\n  border-radius: 10px;\n  background: #272730;\n"])));
+})(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n  height: 72px;\n  width: 309px;\n  margin-top: 24px;\n  display: flex;\n  align-items: center;\n  padding-left: 32px;\n  border-radius: 10px;\n  background: #272730;\n"])));
 
-var _templateObject$V, _templateObject2$B;
-var fadeInAnimation = styledComponents.keyframes(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n  0% {\n    right: -357px;\n  }\n  100% {\n    right: 0;\n  }\n"])));
+var _templateObject$U, _templateObject2$A;
+var fadeInAnimation = styledComponents.keyframes(_templateObject$U || (_templateObject$U = _taggedTemplateLiteral(["\n  0% {\n    right: -357px;\n  }\n  100% {\n    right: 0;\n  }\n"])));
 var ConnectWalletWrapper = styledComponents.styled.div.withConfig({
   displayName: "ConnectWalletWrapper",
   componentId: "sc-1oauz4x-0"
-})(_templateObject2$B || (_templateObject2$B = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 357px;\n  height: 100vh;\n  padding: 24px;\n  background: #191921;\n  position: fixed;\n  top: 0%;\n  right: 0;\n  animation: ", " 0.4s;\n  z-index: 20;\n"])), fadeInAnimation);
+})(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 357px;\n  height: 100vh;\n  padding: 24px;\n  background: #191921;\n  position: fixed;\n  top: 0%;\n  right: 0;\n  animation: ", " 0.4s;\n  z-index: 20;\n"])), fadeInAnimation);
 
-var _templateObject$U;
+var _templateObject$T;
 var LogoutButton = styledComponents.styled(Button$1).withConfig({
   displayName: "LogoutButton",
   componentId: "sc-ljmmm0-0"
-})(_templateObject$U || (_templateObject$U = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: #383847;\n  color: ", ";\n  width: 100%;\n  font-weight: 700;\n  font-size: 14px;\n"])), function (_ref) {
+})(_templateObject$T || (_templateObject$T = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: #383847;\n  color: ", ";\n  width: 100%;\n  font-weight: 700;\n  font-size: 14px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white;
 });
 
-var _templateObject$T;
+var _templateObject$S;
 var MiddleRow = styledComponents.styled.div.withConfig({
   displayName: "MiddleRow",
   componentId: "sc-deagnw-0"
-})(_templateObject$T || (_templateObject$T = _taggedTemplateLiteral(["\n  padding: 20px 0;\n  border-bottom: 1px solid #252530;\n"])));
+})(_templateObject$S || (_templateObject$S = _taggedTemplateLiteral(["\n  padding: 20px 0;\n  border-bottom: 1px solid #252530;\n"])));
 
-var _templateObject$S;
+var _templateObject$R;
 var MyWallet = styledComponents.styled(Text).withConfig({
   displayName: "MyWallet",
   componentId: "sc-17gxhjg-0"
-})(_templateObject$S || (_templateObject$S = _taggedTemplateLiteral(["\n  line-height: 28px;\n  margin-left: 18px;\n"])));
+})(_templateObject$R || (_templateObject$R = _taggedTemplateLiteral(["\n  line-height: 28px;\n  margin-left: 18px;\n"])));
 
-var _templateObject$R;
+var _templateObject$Q;
 var MyWalletWrapper = styledComponents.styled.div.withConfig({
   displayName: "MyWalletWrapper",
   componentId: "sc-126mq9l-0"
-})(_templateObject$R || (_templateObject$R = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n"])));
+})(_templateObject$Q || (_templateObject$Q = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n"])));
 
-var _templateObject$Q;
+var _templateObject$P;
 var ProviderTitle = styledComponents.styled(Text).withConfig({
   displayName: "ProviderTitle",
   componentId: "sc-cz48yj-0"
-})(_templateObject$Q || (_templateObject$Q = _taggedTemplateLiteral(["\n  font-weight: 600;\n  line-height: 24px;\n  margin-left: 16px;\n"])));
+})(_templateObject$P || (_templateObject$P = _taggedTemplateLiteral(["\n  font-weight: 600;\n  line-height: 24px;\n  margin-left: 16px;\n"])));
 
-var _templateObject$P;
+var _templateObject$O;
 var SettingsButton = styledComponents.styled(Button$1).withConfig({
   displayName: "SettingsButton",
   componentId: "sc-zhm3ih-0"
-})(_templateObject$P || (_templateObject$P = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: #383847;\n  color: ", ";\n  width: 100%;\n  font-weight: 700;\n  font-size: 14px;\n  margin-bottom: 16px;\n"])), function (_ref) {
+})(_templateObject$O || (_templateObject$O = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: #383847;\n  color: ", ";\n  width: 100%;\n  font-weight: 700;\n  font-size: 14px;\n  margin-bottom: 16px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white;
 });
 
-var _templateObject$O;
+var _templateObject$N;
 var UpperRow = styledComponents.styled.div.withConfig({
   displayName: "UpperRow",
   componentId: "sc-zlngw8-0"
-})(_templateObject$O || (_templateObject$O = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 54px;\n  display: flex;\n  align-items: ", ";\n  justify-content: ", ";\n  border-bottom: 1px solid #252530;\n  position: relative;\n  padding-bottom: 20px;\n"])), function (_ref) {
+})(_templateObject$N || (_templateObject$N = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 54px;\n  display: flex;\n  align-items: ", ";\n  justify-content: ", ";\n  border-bottom: 1px solid #252530;\n  position: relative;\n  padding-bottom: 20px;\n"])), function (_ref) {
   var alignItems = _ref.alignItems;
   return alignItems && alignItems;
 }, function (_ref2) {
@@ -13607,29 +13449,29 @@ var UpperRow = styledComponents.styled.div.withConfig({
   return justifyContent && justifyContent;
 });
 
-var _templateObject$N;
+var _templateObject$M;
 var VerificationInfo = styledComponents.styled.div.withConfig({
   displayName: "VerificationInfo",
   componentId: "sc-1jviz6b-0"
-})(_templateObject$N || (_templateObject$N = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-top: ", ";\n"])), function (_ref) {
+})(_templateObject$M || (_templateObject$M = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-top: ", ";\n"])), function (_ref) {
   var marginTop = _ref.marginTop;
   return marginTop && marginTop;
 });
 
-var _templateObject$M;
-var VerifiedWalletIcon = styledComponents.styled(Icon$28).withConfig({
+var _templateObject$L;
+var VerifiedWalletIcon$1 = styledComponents.styled(Icon$28).withConfig({
   displayName: "VerifiedWalletIcon",
   componentId: "sc-1l4uhr0-0"
-})(_templateObject$M || (_templateObject$M = _taggedTemplateLiteral(["\n  fill: ", ";\n  margin-right: 8px;\n"])), function (_ref) {
+})(_templateObject$L || (_templateObject$L = _taggedTemplateLiteral(["\n  fill: ", ";\n  margin-right: 8px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.vividBlue;
 });
 
-var _templateObject$L;
+var _templateObject$K;
 var Provider = styledComponents.styled.div.withConfig({
   displayName: "Provider",
   componentId: "sc-ipxejr-0"
-})(_templateObject$L || (_templateObject$L = _taggedTemplateLiteral(["\n  height: 72px;\n  width: 309px;\n  display: flex;\n  align-items: center;\n  padding-left: 32px;\n  border-radius: 10px;\n  background: ", ";\n  margin-bottom: ", ";\n  border: 1px solid transparent;\n\n  &:hover {\n    border: ", ";\n    cursor: pointer;\n  }\n"])), function (_ref) {
+})(_templateObject$K || (_templateObject$K = _taggedTemplateLiteral(["\n  height: 72px;\n  width: 309px;\n  display: flex;\n  align-items: center;\n  padding-left: 32px;\n  border-radius: 10px;\n  background: ", ";\n  margin-bottom: ", ";\n  border: 1px solid transparent;\n\n  &:hover {\n    border: ", ";\n    cursor: pointer;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 }, function (_ref2) {
@@ -13684,11 +13526,11 @@ var Icon$F = function Icon(props) {
   }));
 };
 
-var _templateObject$K;
+var _templateObject$J;
 var ConnectDescription = styledComponents.styled(Text).withConfig({
   displayName: "ConnectDescription",
   componentId: "sc-mzj27o-0"
-})(_templateObject$K || (_templateObject$K = _taggedTemplateLiteral(["\n  line-height: 24px;\n  font-weight: 400;\n  color: #818c92;\n  margin: 16px 0;\n"])));
+})(_templateObject$J || (_templateObject$J = _taggedTemplateLiteral(["\n  line-height: 24px;\n  font-weight: 400;\n  color: #818c92;\n  margin: 16px 0;\n"])));
 var ConnectWallet$1 = function ConnectWallet(_ref) {
   var handleLogin = _ref.handleLogin,
     setIsConnectWalletPanelOpen = _ref.setIsConnectWalletPanelOpen,
@@ -13734,22 +13576,22 @@ var ConnectWallet$1 = function ConnectWallet(_ref) {
   });
 };
 
-var _templateObject$J, _templateObject2$A, _templateObject3$u;
+var _templateObject$I, _templateObject2$z, _templateObject3$t;
 var VerifyAddressIndicator$1 = styledComponents.styled(Text).withConfig({
   displayName: "VerifyAddressIndicator",
   componentId: "sc-ooxgfj-0"
-})(_templateObject$J || (_templateObject$J = _taggedTemplateLiteral(["\n  color: ", ";\n  line-height: 20.4px;\n"])), function (_ref) {
+})(_templateObject$I || (_templateObject$I = _taggedTemplateLiteral(["\n  color: ", ";\n  line-height: 20.4px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.red;
 });
 var ConnectedInfo = styledComponents.styled(Text).withConfig({
   displayName: "ConnectedInfo",
   componentId: "sc-ooxgfj-1"
-})(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteral(["\n  color: #818c92;\n"])));
+})(_templateObject2$z || (_templateObject2$z = _taggedTemplateLiteral(["\n  color: #818c92;\n"])));
 var VerifyButton = styledComponents.styled(Button$1).withConfig({
   displayName: "VerifyButton",
   componentId: "sc-ooxgfj-2"
-})(_templateObject3$u || (_templateObject3$u = _taggedTemplateLiteral(["\n  font-size: 14px;\n  width: 100%;\n  margin: 24px 0;\n"])));
+})(_templateObject3$t || (_templateObject3$t = _taggedTemplateLiteral(["\n  font-size: 14px;\n  width: 100%;\n  margin: 24px 0;\n"])));
 var ConnectWallet = function ConnectWallet(_ref2) {
   var account = _ref2.account,
     setIsConnectWalletPanelOpen = _ref2.setIsConnectWalletPanelOpen;
@@ -13785,7 +13627,7 @@ var ConnectWallet = function ConnectWallet(_ref2) {
         }), /*#__PURE__*/jsxRuntime.jsxs(AccountNumberWrapper, {
           isUserVerified: isUserVerified,
           textAlign: "right",
-          children: [isUserVerified && /*#__PURE__*/jsxRuntime.jsx(VerifiedWalletIcon, {
+          children: [isUserVerified && /*#__PURE__*/jsxRuntime.jsx(VerifiedWalletIcon$1, {
             $opac: true
           }), /*#__PURE__*/jsxRuntime.jsx(AccountNumber, {
             bold: true,
@@ -13800,7 +13642,7 @@ var ConnectWallet = function ConnectWallet(_ref2) {
       }), /*#__PURE__*/jsxRuntime.jsxs(MiddleRow, {
         children: [isUserVerified && /*#__PURE__*/jsxRuntime.jsxs(VerificationInfo, {
           marginTop: "20px",
-          children: [/*#__PURE__*/jsxRuntime.jsx(VerifiedWalletIcon, {
+          children: [/*#__PURE__*/jsxRuntime.jsx(VerifiedWalletIcon$1, {
             $opac: true
           }), /*#__PURE__*/jsxRuntime.jsx(Text, {
             color: "#818C92",
@@ -13896,7 +13738,7 @@ var VerifiedWallet = function VerifiedWallet(_ref) {
           })]
         }), /*#__PURE__*/jsxRuntime.jsxs(AccountNumberWrapper, {
           isVerifiedUser: true,
-          children: [/*#__PURE__*/jsxRuntime.jsx(VerifiedWalletIcon, {
+          children: [/*#__PURE__*/jsxRuntime.jsx(VerifiedWalletIcon$1, {
             $opac: true
           }), /*#__PURE__*/jsxRuntime.jsx(AccountNumber, {
             bold: true,
@@ -13906,7 +13748,7 @@ var VerifiedWallet = function VerifiedWallet(_ref) {
         })]
       }), /*#__PURE__*/jsxRuntime.jsxs(MiddleRow, {
         children: [/*#__PURE__*/jsxRuntime.jsxs(VerificationInfo, {
-          children: [/*#__PURE__*/jsxRuntime.jsx(VerifiedWalletIcon, {
+          children: [/*#__PURE__*/jsxRuntime.jsx(VerifiedWalletIcon$1, {
             $opac: true
           }), /*#__PURE__*/jsxRuntime.jsx(Text, {
             color: "#818C92",
@@ -14183,11 +14025,11 @@ var getTimeValue = function getTimeValue(value, timeUnit) {
   return "".concat(value).concat(timeUnit);
 };
 
-var _templateObject$I, _templateObject2$z, _templateObject3$t, _templateObject4$o, _templateObject5$m, _templateObject6$g, _templateObject7$c, _templateObject8$9, _templateObject9$8, _templateObject0$6, _templateObject1$6, _templateObject10$5, _templateObject11$5, _templateObject12$4, _templateObject13$2;
+var _templateObject$H, _templateObject2$y, _templateObject3$s, _templateObject4$n, _templateObject5$l, _templateObject6$g, _templateObject7$c, _templateObject8$9, _templateObject9$8, _templateObject0$6, _templateObject1$6, _templateObject10$5, _templateObject11$5, _templateObject12$4, _templateObject13$2;
 var ActiveDot$1 = styledComponents.styled.div.withConfig({
   displayName: "ActiveDot",
   componentId: "sc-1kin2xe-0"
-})(_templateObject$I || (_templateObject$I = _taggedTemplateLiteral(["\n  height: 8px;\n  width: 8px;\n  border-radius: 50%;\n  background: ", ";\n  margin-right: 8px;\n  ", "\n"])), function (_ref) {
+})(_templateObject$H || (_templateObject$H = _taggedTemplateLiteral(["\n  height: 8px;\n  width: 8px;\n  border-radius: 50%;\n  background: ", ";\n  margin-right: 8px;\n  ", "\n"])), function (_ref) {
   var dotColor = _ref.dotColor;
   return dotColor;
 }, function (_ref2) {
@@ -14197,19 +14039,19 @@ var ActiveDot$1 = styledComponents.styled.div.withConfig({
 var ActivityDescription = styledComponents.styled(Text).withConfig({
   displayName: "ActivityDescription",
   componentId: "sc-1kin2xe-1"
-})(_templateObject2$z || (_templateObject2$z = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 140%;\n  width: max-content;\n"])));
+})(_templateObject2$y || (_templateObject2$y = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 140%;\n  width: max-content;\n"])));
 var ActivityWrapper = styledComponents.styled.div.withConfig({
   displayName: "ActivityWrapper",
   componentId: "sc-1kin2xe-2"
-})(_templateObject3$t || (_templateObject3$t = _taggedTemplateLiteral(["\n  display: flex;\n  position: absolute;\n  right: 15px;\n  top: 15px;\n"])));
+})(_templateObject3$s || (_templateObject3$s = _taggedTemplateLiteral(["\n  display: flex;\n  position: absolute;\n  right: 15px;\n  top: 15px;\n"])));
 var ActivityComponent = styledComponents.styled.div.withConfig({
   displayName: "ActivityComponent",
   componentId: "sc-1kin2xe-3"
-})(_templateObject4$o || (_templateObject4$o = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 4px 8px;\n  width: max-content;\n  height: 28px;\n  background: rgba(55, 55, 73, 0.5);\n  backdrop-filter: blur(53px);\n  border-radius: 10px;\n  margin-left: 8px;\n"])));
+})(_templateObject4$n || (_templateObject4$n = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 4px 8px;\n  width: max-content;\n  height: 28px;\n  background: rgba(55, 55, 73, 0.5);\n  backdrop-filter: blur(53px);\n  border-radius: 10px;\n  margin-left: 8px;\n"])));
 var ProjectNameColumn = styledComponents.styled.div.withConfig({
   displayName: "ProjectNameColumn",
   componentId: "sc-1kin2xe-4"
-})(_templateObject5$m || (_templateObject5$m = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: flex-start;\n"])));
+})(_templateObject5$l || (_templateObject5$l = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: flex-start;\n"])));
 var ProjectName = styledComponents.styled(Text).withConfig({
   displayName: "ProjectName",
   componentId: "sc-1kin2xe-5"
@@ -14387,36 +14229,36 @@ var getPreciseRatio = function getPreciseRatio(ratio) {
   return ratio.toString();
 };
 
-var _templateObject$H, _templateObject2$y, _templateObject3$s, _templateObject4$n, _templateObject5$l, _templateObject6$f, _templateObject7$b, _templateObject8$8, _templateObject9$7, _templateObject0$5, _templateObject1$5;
+var _templateObject$G, _templateObject2$x, _templateObject3$r, _templateObject4$m, _templateObject5$k, _templateObject6$f, _templateObject7$b, _templateObject8$8, _templateObject9$7, _templateObject0$5, _templateObject1$5;
 var SpacePadProjectDetailsWrapper = styledComponents.styled.div.withConfig({
   displayName: "SpacePadProjectDetailsWrapper",
   componentId: "sc-18f4woi-0"
-})(_templateObject$H || (_templateObject$H = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
+})(_templateObject$G || (_templateObject$G = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
 var StyledDetailsHeader = styledComponents.styled.div.withConfig({
   displayName: "StyledDetailsHeader",
   componentId: "sc-18f4woi-1"
-})(_templateObject2$y || (_templateObject2$y = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  margin-bottom: 32px;\n  ", " {\n    flex-direction: column-reverse;\n    align-items: flex-start;\n    justify-content: space-between;\n    margin-bottom: 16px;\n  }\n"])), function (_ref) {
+})(_templateObject2$x || (_templateObject2$x = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  margin-bottom: 32px;\n  ", " {\n    flex-direction: column-reverse;\n    align-items: flex-start;\n    justify-content: space-between;\n    margin-bottom: 16px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.mobile;
 });
 var StyledDetails = styledComponents.styled.div.withConfig({
   displayName: "StyledDetails",
   componentId: "sc-18f4woi-2"
-})(_templateObject3$s || (_templateObject3$s = _taggedTemplateLiteral(["\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  grid-gap: 32px;\n  height: max-content;\n  ", " {\n    display: flex;\n    flex-direction: column;\n  }\n"])), function (_ref2) {
+})(_templateObject3$r || (_templateObject3$r = _taggedTemplateLiteral(["\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  grid-gap: 32px;\n  height: max-content;\n  ", " {\n    display: flex;\n    flex-direction: column;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.mediaQueries.mobile;
 });
 var ProjectLogo$1 = styledComponents.styled.div.withConfig({
   displayName: "ProjectLogo",
   componentId: "sc-18f4woi-3"
-})(_templateObject4$n || (_templateObject4$n = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 80px;\n  height: 80px;\n  border-radius: 50%;\n  background: #16161d;\n  background-image: ", ";\n  background-position: center; /* Center the image */\n  background-repeat: no-repeat; /* Do not repeat the image */\n  background-size: cover;\n  border: 3px solid #373749;\n  overflow: hidden;\n  margin-right: 16px;\n"])), function (_ref3) {
+})(_templateObject4$m || (_templateObject4$m = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 80px;\n  height: 80px;\n  border-radius: 50%;\n  background: #16161d;\n  background-image: ", ";\n  background-position: center; /* Center the image */\n  background-repeat: no-repeat; /* Do not repeat the image */\n  background-size: cover;\n  border: 3px solid #373749;\n  overflow: hidden;\n  margin-right: 16px;\n"])), function (_ref3) {
   var background = _ref3.background;
   return background;
 });
 var TimerWrapper = styledComponents.styled.div.withConfig({
   displayName: "TimerWrapper",
   componentId: "sc-18f4woi-4"
-})(_templateObject5$l || (_templateObject5$l = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n    margin-bottom: 44px;\n  }\n"])), function (_ref4) {
+})(_templateObject5$k || (_templateObject5$k = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n    margin-bottom: 44px;\n  }\n"])), function (_ref4) {
   var theme = _ref4.theme;
   return theme.mediaQueries.mobile;
 });
@@ -14572,11 +14414,11 @@ var SpacePadProjectDetails = function SpacePadProjectDetails(props) {
   });
 };
 
-var _templateObject$G, _templateObject2$x, _templateObject3$r, _templateObject4$m, _templateObject5$k, _templateObject6$e, _templateObject7$a, _templateObject8$7, _templateObject9$6;
+var _templateObject$F, _templateObject2$w, _templateObject3$q, _templateObject4$l, _templateObject5$j, _templateObject6$e, _templateObject7$a, _templateObject8$7, _templateObject9$6;
 var WalletWrapper = styledComponents.styled.div.withConfig({
   displayName: "WalletWrapper",
   componentId: "sc-1uosrv7-0"
-})(_templateObject$G || (_templateObject$G = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  height: 129px;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 10px;\n  justify-content: space-around;\n  flex-direction: column;\n  padding: 12px 16px 34px 16px;\n"])), function (_ref) {
+})(_templateObject$F || (_templateObject$F = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  height: 129px;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 10px;\n  justify-content: space-around;\n  flex-direction: column;\n  padding: 12px 16px 34px 16px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 }, function (_ref2) {
@@ -14586,11 +14428,11 @@ var WalletWrapper = styledComponents.styled.div.withConfig({
 styledComponents.styled.div.withConfig({
   displayName: "WalletValueBar",
   componentId: "sc-1uosrv7-1"
-})(_templateObject2$x || (_templateObject2$x = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  height: 100%;\n  justify-content: space-between;\n  align-items: flex-start;\n  flex-direction: column;\n  flex: 2;\n"])));
+})(_templateObject2$w || (_templateObject2$w = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  height: 100%;\n  justify-content: space-between;\n  align-items: flex-start;\n  flex-direction: column;\n  flex: 2;\n"])));
 styledComponents.styled.div.withConfig({
   displayName: "ProgressBarWrapper",
   componentId: "sc-1uosrv7-2"
-})(_templateObject3$r || (_templateObject3$r = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  height: 30px;\n  background: ", ";\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: 7px;\n  border: 1px solid ", ";\n  box-sizing: border-box;\n  padding: 3px;\n"])), function (_ref3) {
+})(_templateObject3$q || (_templateObject3$q = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  height: 30px;\n  background: ", ";\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: 7px;\n  border: 1px solid ", ";\n  box-sizing: border-box;\n  padding: 3px;\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.dark;
 }, function (_ref4) {
@@ -14600,7 +14442,7 @@ styledComponents.styled.div.withConfig({
 styledComponents.styled.div.withConfig({
   displayName: "ProgressBar",
   componentId: "sc-1uosrv7-3"
-})(_templateObject4$m || (_templateObject4$m = _taggedTemplateLiteral(["\n  position: relative;\n  height: 100%;\n  width: ", "%;\n  font-size: 14px;\n  background: ", ";\n  border-radius: 7px;\n"])), function (_ref5) {
+})(_templateObject4$l || (_templateObject4$l = _taggedTemplateLiteral(["\n  position: relative;\n  height: 100%;\n  width: ", "%;\n  font-size: 14px;\n  background: ", ";\n  border-radius: 7px;\n"])), function (_ref5) {
   var width = _ref5.width;
   return width;
 }, function (_ref6) {
@@ -14610,7 +14452,7 @@ styledComponents.styled.div.withConfig({
 styledComponents.styled.div.withConfig({
   displayName: "ProcentValue",
   componentId: "sc-1uosrv7-4"
-})(_templateObject5$k || (_templateObject5$k = _taggedTemplateLiteral(["\n  position: absolute;\n  color: ", ";\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  font-weight: bold;\n  display: inline-block;\n  width: 100%;\n  text-align: center;\n"])), function (_ref7) {
+})(_templateObject5$j || (_templateObject5$j = _taggedTemplateLiteral(["\n  position: absolute;\n  color: ", ";\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  font-weight: bold;\n  display: inline-block;\n  width: 100%;\n  text-align: center;\n"])), function (_ref7) {
   var theme = _ref7.theme;
   return theme.colors.white;
 });
@@ -14670,11 +14512,11 @@ var WalletCap = function WalletCap(_ref1) {
   });
 };
 
-var _templateObject$F, _templateObject2$w, _templateObject3$q;
+var _templateObject$E, _templateObject2$v, _templateObject3$p;
 var TooltipContent = styledComponents.styled.div.withConfig({
   displayName: "TooltipContent",
   componentId: "sc-isj8qi-0"
-})(_templateObject$F || (_templateObject$F = _taggedTemplateLiteral(["\n  background: ", ";\n  padding: 16px;\n  border-radius: 10px;\n  border: 1px solid ", ";\n  box-shadow: 0px 13px 20px rgba(0, 0, 0, 0.25);\n  color: ", ";\n  width: max-content;\n  min-width: 200px;\n  display: none;\n  max-height: 500px;\n  z-index: 9999999;\n  position: absolute;\n  bottom: calc(100% + 16px);\n  transform: translate(34px, 0);\n  right: ", "px;\n  font-size: ", "px;\n\n  ", "\n"])), function (_ref) {
+})(_templateObject$E || (_templateObject$E = _taggedTemplateLiteral(["\n  background: ", ";\n  padding: 16px;\n  border-radius: 10px;\n  border: 1px solid ", ";\n  box-shadow: 0px 13px 20px rgba(0, 0, 0, 0.25);\n  color: ", ";\n  width: max-content;\n  min-width: 200px;\n  display: none;\n  max-height: 500px;\n  z-index: 9999999;\n  position: absolute;\n  bottom: calc(100% + 16px);\n  transform: translate(34px, 0);\n  right: ", "px;\n  font-size: ", "px;\n\n  ", "\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.card;
 }, function (_ref2) {
@@ -14689,7 +14531,7 @@ var TooltipContent = styledComponents.styled.div.withConfig({
 }, function (props) {
   return props.small ? 12 : "";
 }, function (props) {
-  return !props.removeAfter && styledComponents.css(_templateObject2$w || (_templateObject2$w = _taggedTemplateLiteral(["\n      &:after {\n        content: \"\";\n        display: block;\n        width: 0;\n        height: 0;\n        border-left: 10px solid transparent;\n        border-right: 10px solid transparent;\n        border-top: 10px solid ", ";\n        bottom: ", "px;\n        position: absolute;\n        transform: translate(-34px, 9px);\n        right: 0;\n      }\n    "])), function (_ref5) {
+  return !props.removeAfter && styledComponents.css(_templateObject2$v || (_templateObject2$v = _taggedTemplateLiteral(["\n      &:after {\n        content: \"\";\n        display: block;\n        width: 0;\n        height: 0;\n        border-left: 10px solid transparent;\n        border-right: 10px solid transparent;\n        border-top: 10px solid ", ";\n        bottom: ", "px;\n        position: absolute;\n        transform: translate(-34px, 9px);\n        right: 0;\n      }\n    "])), function (_ref5) {
     var theme = _ref5.theme;
     return theme.tooltip.background;
   }, props.bottom || 0);
@@ -14697,7 +14539,7 @@ var TooltipContent = styledComponents.styled.div.withConfig({
 var Container$3 = styledComponents.styled.div.withConfig({
   displayName: "Container",
   componentId: "sc-isj8qi-1"
-})(_templateObject3$q || (_templateObject3$q = _taggedTemplateLiteral(["\n  position: relative;\n  z-index: 99999999999;\n\n  &:hover ", ", &:focus-within ", " {\n    display: block;\n  }\n"])), TooltipContent, TooltipContent);
+})(_templateObject3$p || (_templateObject3$p = _taggedTemplateLiteral(["\n  position: relative;\n  z-index: 99999999999;\n\n  &:hover ", ", &:focus-within ", " {\n    display: block;\n  }\n"])), TooltipContent, TooltipContent);
 var Tooltip = function Tooltip(_ref6) {
   var content = _ref6.content,
     children = _ref6.children,
@@ -14722,11 +14564,11 @@ var Tooltip = function Tooltip(_ref6) {
   });
 };
 
-var _templateObject$E, _templateObject2$v, _templateObject3$p, _templateObject4$l, _templateObject5$j, _templateObject6$d, _templateObject7$9, _templateObject8$6, _templateObject9$5;
+var _templateObject$D, _templateObject2$u, _templateObject3$o, _templateObject4$k, _templateObject5$i, _templateObject6$d, _templateObject7$9, _templateObject8$6, _templateObject9$5;
 var CSSPowerWrapper = styledComponents.styled.div.withConfig({
   displayName: "CSSPowerWrapper",
   componentId: "sc-12ic40m-0"
-})(_templateObject$E || (_templateObject$E = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  background: #252530;\n  border: 1px solid ", ";\n  padding: 16px 24px;\n  border-radius: 10px;\n  ", " {\n    width: 100%;\n    align-items: center;\n    margin-top: 24px;\n  }\n"])), function (_ref) {
+})(_templateObject$D || (_templateObject$D = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  background: #252530;\n  border: 1px solid ", ";\n  padding: 16px 24px;\n  border-radius: 10px;\n  ", " {\n    width: 100%;\n    align-items: center;\n    margin-top: 24px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white3;
 }, function (_ref2) {
@@ -14736,25 +14578,25 @@ var CSSPowerWrapper = styledComponents.styled.div.withConfig({
 var PowerWrapper = styledComponents.styled.div.withConfig({
   displayName: "PowerWrapper",
   componentId: "sc-12ic40m-1"
-})(_templateObject2$v || (_templateObject2$v = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  justify-content: space-between;\n  margin-left: 30px;\n"])));
+})(_templateObject2$u || (_templateObject2$u = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  justify-content: space-between;\n  margin-left: 30px;\n"])));
 var CSSPowerText = styledComponents.styled(Text).withConfig({
   displayName: "CSSPowerText",
   componentId: "sc-12ic40m-2"
-})(_templateObject3$p || (_templateObject3$p = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 140%;\n  color: ", ";\n  width: max-content;\n"])), function (_ref3) {
+})(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  font-weight: bold;\n  font-size: 14px;\n  line-height: 140%;\n  color: ", ";\n  width: max-content;\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.white55;
 });
 var CSSPowerValue = styledComponents.styled(Text).withConfig({
   displayName: "CSSPowerValue",
   componentId: "sc-12ic40m-3"
-})(_templateObject4$l || (_templateObject4$l = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 36px;\n  line-height: 130%;\n  color: ", ";\n"])), function (_ref4) {
+})(_templateObject4$k || (_templateObject4$k = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 36px;\n  line-height: 130%;\n  color: ", ";\n"])), function (_ref4) {
   var theme = _ref4.theme;
   return theme.colors.white;
 });
 var StyledInfoIcon = styledComponents.styled(Icon$2E).withConfig({
   displayName: "StyledInfoIcon",
   componentId: "sc-12ic40m-4"
-})(_templateObject5$j || (_templateObject5$j = _taggedTemplateLiteral(["\n  margin-left: 5px;\n  height: 18px;\n  cursor: pointer;\n"])));
+})(_templateObject5$i || (_templateObject5$i = _taggedTemplateLiteral(["\n  margin-left: 5px;\n  height: 18px;\n  cursor: pointer;\n"])));
 var PowerDescriptionWrapper = styledComponents.styled.div.withConfig({
   displayName: "PowerDescriptionWrapper",
   componentId: "sc-12ic40m-5"
@@ -14826,11 +14668,11 @@ var CSSPower = function CSSPower(_ref7) {
 };
 
 var _excluded$4 = ["value", "onUserInput", "placeholder", "type"];
-var _templateObject$D;
+var _templateObject$C;
 var StyledInput = styledComponents.styled.input.withConfig({
   displayName: "StyledInput",
   componentId: "sc-mu1fop-0"
-})(_templateObject$D || (_templateObject$D = _taggedTemplateLiteral(["\n  color: ", ";\n  width: 0;\n  position: relative;\n  font-weight: 700;\n  outline: none;\n  border: none;\n  flex: 1 1 auto;\n  background-color: transparent;\n  background: transparent;\n  font-size: 24px;\n  text-align: ", ";\n  white-space: nowrap;\n  line-height: 33px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  padding: 0px;\n  -webkit-appearance: textfield;\n\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n\n  [type=\"number\"] {\n    -moz-appearance: textfield;\n  }\n\n  ::-webkit-outer-spin-button,\n  ::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n  }\n\n  ::placeholder {\n    color: ", ";\n  }\n"])), function (_ref) {
+})(_templateObject$C || (_templateObject$C = _taggedTemplateLiteral(["\n  color: ", ";\n  width: 0;\n  position: relative;\n  font-weight: 700;\n  outline: none;\n  border: none;\n  flex: 1 1 auto;\n  background-color: transparent;\n  background: transparent;\n  font-size: 24px;\n  text-align: ", ";\n  white-space: nowrap;\n  line-height: 33px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  padding: 0px;\n  -webkit-appearance: textfield;\n\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n\n  [type=\"number\"] {\n    -moz-appearance: textfield;\n  }\n\n  ::-webkit-outer-spin-button,\n  ::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n  }\n\n  ::placeholder {\n    color: ", ";\n  }\n"])), function (_ref) {
   var error = _ref.error,
     theme = _ref.theme;
   return error ? theme.colors.failure : theme.colors.text;
@@ -14876,11 +14718,11 @@ var NumericalInput = /*#__PURE__*/React.memo(function InnerInput(_ref4) {
   }));
 });
 
-var _templateObject$C, _templateObject2$u, _templateObject3$o, _templateObject4$k, _templateObject5$i, _templateObject6$c, _templateObject7$8, _templateObject8$5, _templateObject9$4, _templateObject0$4, _templateObject1$4, _templateObject10$4, _templateObject11$4, _templateObject12$3;
+var _templateObject$B, _templateObject2$t, _templateObject3$n, _templateObject4$j, _templateObject5$h, _templateObject6$c, _templateObject7$8, _templateObject8$5, _templateObject9$4, _templateObject0$4, _templateObject1$4, _templateObject10$4, _templateObject11$4, _templateObject12$3;
 var SpacePadDatesWrapper = styledComponents.styled.div.withConfig({
   displayName: "SpacePadDatesWrapper",
   componentId: "sc-wmdxzq-0"
-})(_templateObject$C || (_templateObject$C = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 10px;\n  padding: 16px 24px;\n  align-items: center;\n  justify-content: space-between;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n"])), function (_ref) {
+})(_templateObject$B || (_templateObject$B = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 10px;\n  padding: 16px 24px;\n  align-items: center;\n  justify-content: space-between;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 }, function (_ref2) {
@@ -14893,7 +14735,7 @@ var SpacePadDatesWrapper = styledComponents.styled.div.withConfig({
 var ActiveDot = styledComponents.styled.div.withConfig({
   displayName: "ActiveDot",
   componentId: "sc-wmdxzq-1"
-})(_templateObject2$u || (_templateObject2$u = _taggedTemplateLiteral(["\n  height: 16px;\n  width: 16px;\n  border-radius: 50%;\n  background: ", ";\n  margin-right: ", "px;\n  ", "\n"])), function (_ref4) {
+})(_templateObject2$t || (_templateObject2$t = _taggedTemplateLiteral(["\n  height: 16px;\n  width: 16px;\n  border-radius: 50%;\n  background: ", ";\n  margin-right: ", "px;\n  ", "\n"])), function (_ref4) {
   var color = _ref4.color;
   return color;
 }, function (_ref5) {
@@ -14906,18 +14748,18 @@ var ActiveDot = styledComponents.styled.div.withConfig({
 var TimeWrapper = styledComponents.styled.div.withConfig({
   displayName: "TimeWrapper",
   componentId: "sc-wmdxzq-2"
-})(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n    margin-bottom: 21px;\n  }\n"])), function (_ref7) {
+})(_templateObject3$n || (_templateObject3$n = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  ", " {\n    flex-direction: column;\n    align-items: flex-start;\n    margin-bottom: 21px;\n  }\n"])), function (_ref7) {
   var theme = _ref7.theme;
   return theme.mediaQueries.mobile;
 });
 var EndTimeWrapper = styledComponents.styled.div.withConfig({
   displayName: "EndTimeWrapper",
   componentId: "sc-wmdxzq-3"
-})(_templateObject4$k || (_templateObject4$k = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: flex-start;\n  height: 41px;\n"])));
+})(_templateObject4$j || (_templateObject4$j = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: flex-start;\n  height: 41px;\n"])));
 var TimeNumber = styledComponents.styled(Text).withConfig({
   displayName: "TimeNumber",
   componentId: "sc-wmdxzq-4"
-})(_templateObject5$i || (_templateObject5$i = _taggedTemplateLiteral(["\n  font-weight: 600;\n  font-size: 20px;\n  margin: 0px;\n  padding: 0px;\n  height: 100%;\n  line-height: 100%;\n"])));
+})(_templateObject5$h || (_templateObject5$h = _taggedTemplateLiteral(["\n  font-weight: 600;\n  font-size: 20px;\n  margin: 0px;\n  padding: 0px;\n  height: 100%;\n  line-height: 100%;\n"])));
 var PeriodText = styledComponents.styled(Text).withConfig({
   displayName: "PeriodText",
   componentId: "sc-wmdxzq-5"
@@ -15117,22 +14959,22 @@ var SpacePadDates = function SpacePadDates(_ref14) {
   });
 };
 
-var _templateObject$B, _templateObject2$t, _templateObject3$n, _templateObject4$j, _templateObject5$h, _templateObject6$b, _templateObject7$7, _templateObject8$4, _templateObject9$3, _templateObject0$3, _templateObject1$3, _templateObject10$3, _templateObject11$3, _templateObject12$2, _templateObject13$1;
+var _templateObject$A, _templateObject2$s, _templateObject3$m, _templateObject4$i, _templateObject5$g, _templateObject6$b, _templateObject7$7, _templateObject8$4, _templateObject9$3, _templateObject0$3, _templateObject1$3, _templateObject10$3, _templateObject11$3, _templateObject12$2, _templateObject13$1;
 var AddToCapWrapper = styledComponents.styled.div.withConfig({
   displayName: "AddToCapWrapper",
   componentId: "sc-1vjnrpf-0"
-})(_templateObject$B || (_templateObject$B = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  height: max-content;\n  width: 100%;\n  padding: 32px;\n  background: #191921;\n  border-radius: 16px;\n"])));
+})(_templateObject$A || (_templateObject$A = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  height: max-content;\n  width: 100%;\n  padding: 32px;\n  background: #191921;\n  border-radius: 16px;\n"])));
 var LogicComponentsWrapper = styledComponents.styled.div.withConfig({
   displayName: "LogicComponentsWrapper",
   componentId: "sc-1vjnrpf-1"
-})(_templateObject2$t || (_templateObject2$t = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  ", " {\n    flex-direction: column;\n  }\n"])), function (_ref) {
+})(_templateObject2$s || (_templateObject2$s = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  ", " {\n    flex-direction: column;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.mobile;
 });
 var CapInput = styledComponents.styled(NumericalInput).withConfig({
   displayName: "CapInput",
   componentId: "sc-1vjnrpf-2"
-})(_templateObject3$n || (_templateObject3$n = _taggedTemplateLiteral(["\n  height: 50px;\n  font-size: 16px;\n  padding: 11px 0px 11px 24px;\n  border: 1px solid ", ";\n  background: ", ";\n  border-radius: 10px;\n  margin-bottom: 20px;\n  ::placeholder {\n    color: ", ";\n    font-weight: 500;\n  }\n"])), function (_ref2) {
+})(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteral(["\n  height: 50px;\n  font-size: 16px;\n  padding: 11px 0px 11px 24px;\n  border: 1px solid ", ";\n  background: ", ";\n  border-radius: 10px;\n  margin-bottom: 20px;\n  ::placeholder {\n    color: ", ";\n    font-weight: 500;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white10;
 }, function (_ref3) {
@@ -15145,11 +14987,11 @@ var CapInput = styledComponents.styled(NumericalInput).withConfig({
 var EligibleWrapper = styledComponents.styled.div.withConfig({
   displayName: "EligibleWrapper",
   componentId: "sc-1vjnrpf-3"
-})(_templateObject4$j || (_templateObject4$j = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  width: max-content;\n  height: 50px;\n  width: 100%;\n  padding: 15.5px;\n  //Used only once in this component, not declared on theme\n  background: #272730;\n  box-sizing: border-box;\n  border-radius: 10px;\n  margin-bottom: 26px;\n"])));
+})(_templateObject4$i || (_templateObject4$i = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  width: max-content;\n  height: 50px;\n  width: 100%;\n  padding: 15.5px;\n  //Used only once in this component, not declared on theme\n  background: #272730;\n  box-sizing: border-box;\n  border-radius: 10px;\n  margin-bottom: 26px;\n"])));
 var IdoActionButton = styledComponents.styled(Button$1).withConfig({
   displayName: "IdoActionButton",
   componentId: "sc-1vjnrpf-4"
-})(_templateObject5$h || (_templateObject5$h = _taggedTemplateLiteral(["\n  color: ", " !important;\n  height: 50px;\n  width: 100%;\n  &:disabled,\n  &.button--disabled {\n    background: #12ffb8;\n    opacity: 0.2;\n    color: #3d3d41 !important;\n  }\n  ", " {\n    margin-top: 16px;\n    width: 100%;\n  }\n"])), function (_ref5) {
+})(_templateObject5$g || (_templateObject5$g = _taggedTemplateLiteral(["\n  color: ", " !important;\n  height: 50px;\n  width: 100%;\n  &:disabled,\n  &.button--disabled {\n    background: #12ffb8;\n    opacity: 0.2;\n    color: #3d3d41 !important;\n  }\n  ", " {\n    margin-top: 16px;\n    width: 100%;\n  }\n"])), function (_ref5) {
   var theme = _ref5.theme;
   return theme.colors.dark;
 }, function (_ref6) {
@@ -15556,33 +15398,33 @@ var AddToCap = function AddToCap(_ref18) {
   return withoutActions ? /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {}) : contentWrapper;
 };
 
-var _templateObject$A, _templateObject2$s, _templateObject3$m, _templateObject4$i, _templateObject5$g;
+var _templateObject$z, _templateObject2$r, _templateObject3$l, _templateObject4$h, _templateObject5$f;
 var Description = styledComponents.styled.div.withConfig({
   displayName: "Description",
   componentId: "sc-h5yjzn-0"
-})(_templateObject$A || (_templateObject$A = _taggedTemplateLiteral(["\n  font-family: Manrope;\n  font-size: 12px;\n  line-height: 170%;\n  color: rgba(255, 255, 255, 0.55);\n  align-self: flex-start;\n  font-weight: normal;\n"])));
+})(_templateObject$z || (_templateObject$z = _taggedTemplateLiteral(["\n  font-family: Manrope;\n  font-size: 12px;\n  line-height: 170%;\n  color: rgba(255, 255, 255, 0.55);\n  align-self: flex-start;\n  font-weight: normal;\n"])));
 var CounterWrapper = styledComponents.styled.div.withConfig({
   displayName: "CounterWrapper",
   componentId: "sc-h5yjzn-1"
-})(_templateObject2$s || (_templateObject2$s = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  height: 81px;\n  background: ", ";\n  border: 1px solid rgba(255, 255, 255, 0.03);\n  display: flex;\n  border-radius: 10px;\n  padding: 15px 0px 21px 20px;\n"])), function (_ref) {
+})(_templateObject2$r || (_templateObject2$r = _taggedTemplateLiteral(["\n  position: relative;\n  width: 100%;\n  height: 81px;\n  background: ", ";\n  border: 1px solid rgba(255, 255, 255, 0.03);\n  display: flex;\n  border-radius: 10px;\n  padding: 15px 0px 21px 20px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.backgrounds.secondary;
 });
 var CapDescriptionWrapper = styledComponents.styled.div.withConfig({
   displayName: "CapDescriptionWrapper",
   componentId: "sc-h5yjzn-2"
-})(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteral(["\n  color: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  font-weight: bold;\n"])), function (_ref2) {
+})(_templateObject3$l || (_templateObject3$l = _taggedTemplateLiteral(["\n  color: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  font-weight: bold;\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white;
 });
 var SoftCapWrapper = styledComponents.styled(CapDescriptionWrapper).withConfig({
   displayName: "SoftCapWrapper",
   componentId: "sc-h5yjzn-3"
-})(_templateObject4$i || (_templateObject4$i = _taggedTemplateLiteral(["\n  border-right: 2px solid #252530;\n  margin-left: 10px;\n  padding-right: 17px;\n"])));
+})(_templateObject4$h || (_templateObject4$h = _taggedTemplateLiteral(["\n  border-right: 2px solid #252530;\n  margin-left: 10px;\n  padding-right: 17px;\n"])));
 var HardCapWrapper = styledComponents.styled(CapDescriptionWrapper).withConfig({
   displayName: "HardCapWrapper",
   componentId: "sc-h5yjzn-4"
-})(_templateObject5$g || (_templateObject5$g = _taggedTemplateLiteral(["\n  align-items: center;\n  margin-left: 32px;\n"])));
+})(_templateObject5$f || (_templateObject5$f = _taggedTemplateLiteral(["\n  align-items: center;\n  margin-left: 32px;\n"])));
 var CapCounter = function CapCounter(_ref3) {
   var _ref3$softCap = _ref3.softCap,
     softCap = _ref3$softCap === void 0 ? 332.52 : _ref3$softCap,
@@ -15636,33 +15478,33 @@ var SpacePadSchedule = function SpacePadSchedule(_ref) {
   });
 };
 
-var _templateObject$z, _templateObject2$r, _templateObject3$l, _templateObject4$h, _templateObject5$f;
+var _templateObject$y, _templateObject2$q, _templateObject3$k, _templateObject4$g, _templateObject5$e;
 var MainWrapper = styledComponents.styled.div.withConfig({
   displayName: "MainWrapper",
   componentId: "sc-1bkh9t5-0"
-})(_templateObject$z || (_templateObject$z = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: rgba(255, 255, 255, 0.1);\n  width: ", ";\n  height: 34px;\n  border-radius: 10px;\n  font-weight: bold;\n  font-size: 14px;\n  padding: 2px;\n  z-index: 99;\n"])), function (_ref) {
+})(_templateObject$y || (_templateObject$y = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: rgba(255, 255, 255, 0.1);\n  width: ", ";\n  height: 34px;\n  border-radius: 10px;\n  font-weight: bold;\n  font-size: 14px;\n  padding: 2px;\n  z-index: 99;\n"])), function (_ref) {
   var width = _ref.width;
   return width ? "".concat(width, "px") : "100%";
 });
 var SecondWrapper = styledComponents.styled.div.withConfig({
   displayName: "SecondWrapper",
   componentId: "sc-1bkh9t5-1"
-})(_templateObject2$r || (_templateObject2$r = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  border-radius: 8px;\n  z-index: 101;\n  width: 100%;\n"])));
+})(_templateObject2$q || (_templateObject2$q = _taggedTemplateLiteral(["\n  position: relative;\n  display: flex;\n  border-radius: 8px;\n  z-index: 101;\n  width: 100%;\n"])));
 var ToggleButton = styledComponents.styled.div.withConfig({
   displayName: "ToggleButton",
   componentId: "sc-1bkh9t5-2"
-})(_templateObject3$l || (_templateObject3$l = _taggedTemplateLiteral(["\n  position: absolute;\n  display: flex;\n  height: 100%;\n  width: 50%;\n  background: rgba(255, 255, 255, 0.85);\n  border-radius: 8px;\n  transform: translateX(", ");\n  transition: 0.4s ease-out;\n  z-index: 100;\n"])), function (_ref2) {
+})(_templateObject3$k || (_templateObject3$k = _taggedTemplateLiteral(["\n  position: absolute;\n  display: flex;\n  height: 100%;\n  width: 50%;\n  background: rgba(255, 255, 255, 0.85);\n  border-radius: 8px;\n  transform: translateX(", ");\n  transition: 0.4s ease-out;\n  z-index: 100;\n"])), function (_ref2) {
   var isSwitched = _ref2.isSwitched;
   return isSwitched ? "100%" : "0%";
 });
 var RowWrapper = styledComponents.styled.div.withConfig({
   displayName: "RowWrapper",
   componentId: "sc-1bkh9t5-3"
-})(_templateObject4$h || (_templateObject4$h = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  height: 100%;\n"])));
+})(_templateObject4$g || (_templateObject4$g = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  height: 100%;\n"])));
 var SubscriptionWrapper = styledComponents.styled.div.withConfig({
   displayName: "SubscriptionWrapper",
   componentId: "sc-1bkh9t5-4"
-})(_templateObject5$f || (_templateObject5$f = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 30px;\n  width: 50%;\n  border-radius: 8px;\n  cursor: pointer;\n  z-index: 101;\n  color: ", ";\n  transition: 0.4s ease-out;\n"])), function (_ref3) {
+})(_templateObject5$e || (_templateObject5$e = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 30px;\n  width: 50%;\n  border-radius: 8px;\n  cursor: pointer;\n  z-index: 101;\n  color: ", ";\n  transition: 0.4s ease-out;\n"])), function (_ref3) {
   var isActive = _ref3.isActive;
   return isActive ? "black" : "rgba(255, 255, 255, 0.25)";
 });
@@ -15708,15 +15550,15 @@ var Switch = function Switch(_ref4) {
   });
 };
 
-var _templateObject$y, _templateObject2$q, _templateObject3$k, _templateObject4$g, _templateObject5$e, _templateObject6$a, _templateObject7$6, _templateObject8$3, _templateObject9$2, _templateObject0$2, _templateObject1$2, _templateObject10$2, _templateObject11$2, _templateObject12$1;
+var _templateObject$x, _templateObject2$p, _templateObject3$j, _templateObject4$f, _templateObject5$d, _templateObject6$a, _templateObject7$6, _templateObject8$3, _templateObject9$2, _templateObject0$2, _templateObject1$2, _templateObject10$2, _templateObject11$2, _templateObject12$1;
 var SponsoredText = styledComponents.styled(Text).withConfig({
   displayName: "SponsoredText",
   componentId: "sc-8tid8r-0"
-})(_templateObject$y || (_templateObject$y = _taggedTemplateLiteral(["\n  position: absolute;\n  font-weight: normal;\n  font-size: 10px;\n  line-height: 170%;\n  color: #12ffb8;\n  top: -20px;\n  left: 10px;\n"])));
+})(_templateObject$x || (_templateObject$x = _taggedTemplateLiteral(["\n  position: absolute;\n  font-weight: normal;\n  font-size: 10px;\n  line-height: 170%;\n  color: #12ffb8;\n  top: -20px;\n  left: 10px;\n"])));
 var SpacePadProjectWrapper = styledComponents.styled.div.withConfig({
   displayName: "SpacePadProjectWrapper",
   componentId: "sc-8tid8r-1"
-})(_templateObject2$q || (_templateObject2$q = _taggedTemplateLiteral(["\n  position: relative;\n  width: 406px;\n  height: max-content;\n  ", " {\n    min-width: max-content;\n  }\n  ", " {\n    width: 100%;\n  }\n"])), function (_ref) {
+})(_templateObject2$p || (_templateObject2$p = _taggedTemplateLiteral(["\n  position: relative;\n  width: 406px;\n  height: max-content;\n  ", " {\n    min-width: max-content;\n  }\n  ", " {\n    width: 100%;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.desktop;
 }, function (_ref2) {
@@ -15726,7 +15568,7 @@ var SpacePadProjectWrapper = styledComponents.styled.div.withConfig({
 var SpacePadProjectCard = styledComponents.styled.div.withConfig({
   displayName: "SpacePadProjectCard",
   componentId: "sc-8tid8r-2"
-})(_templateObject3$k || (_templateObject3$k = _taggedTemplateLiteral(["\n  background: ", ";\n  border: 1px solid ", ";\n  box-sizing: border-box;\n  border-radius: 15px;\n  max-width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: space-between;\n  overflow: hidden;\n  cursor: pointer;\n  padding-bottom: 24px;\n"])), function (_ref3) {
+})(_templateObject3$j || (_templateObject3$j = _taggedTemplateLiteral(["\n  background: ", ";\n  border: 1px solid ", ";\n  box-sizing: border-box;\n  border-radius: 15px;\n  max-width: 100%;\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: space-between;\n  overflow: hidden;\n  cursor: pointer;\n  padding-bottom: 24px;\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.backgrounds.primary;
 }, function (_ref4) {
@@ -15737,14 +15579,14 @@ var SpacePadProjectCard = styledComponents.styled.div.withConfig({
 var ProjectPoster = styledComponents.styled.div.withConfig({
   displayName: "ProjectPoster",
   componentId: "sc-8tid8r-3"
-})(_templateObject4$g || (_templateObject4$g = _taggedTemplateLiteral(["\n  min-height: 175px;\n  width: 100%;\n  position: relative;\n  background: #16161d;\n  background-image: ", ";\n  background-position: center; /* Center the image */\n  background-repeat: no-repeat; /* Do not repeat the image */\n  background-size: cover;\n"])), function (_ref5) {
+})(_templateObject4$f || (_templateObject4$f = _taggedTemplateLiteral(["\n  min-height: 175px;\n  width: 100%;\n  position: relative;\n  background: #16161d;\n  background-image: ", ";\n  background-position: center; /* Center the image */\n  background-repeat: no-repeat; /* Do not repeat the image */\n  background-size: cover;\n"])), function (_ref5) {
   var background = _ref5.background;
   return background;
 });
 var ProjectLogo = styledComponents.styled.div.withConfig({
   displayName: "ProjectLogo",
   componentId: "sc-8tid8r-4"
-})(_templateObject5$e || (_templateObject5$e = _taggedTemplateLiteral(["\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 80px;\n  height: 80px;\n  border-radius: 50%;\n  top: 138px;\n  left: 20px;\n  background: #16161d;\n  background-image: ", ";\n  background-position: center; /* Center the image */\n  background-repeat: no-repeat; /* Do not repeat the image */\n  background-size: cover;\n  border: 3px solid #373749;\n  overflow: hidden;\n"])), function (_ref6) {
+})(_templateObject5$d || (_templateObject5$d = _taggedTemplateLiteral(["\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 80px;\n  height: 80px;\n  border-radius: 50%;\n  top: 138px;\n  left: 20px;\n  background: #16161d;\n  background-image: ", ";\n  background-position: center; /* Center the image */\n  background-repeat: no-repeat; /* Do not repeat the image */\n  background-size: cover;\n  border: 3px solid #373749;\n  overflow: hidden;\n"])), function (_ref6) {
   var background = _ref6.background;
   return background;
 });
@@ -16005,11 +15847,11 @@ var SpacePadProject = function SpacePadProject(props) {
   });
 };
 
-var _templateObject$x, _templateObject2$p, _templateObject3$j, _templateObject4$f, _templateObject5$d, _templateObject6$9, _templateObject7$5, _templateObject8$2, _templateObject9$1, _templateObject0$1, _templateObject1$1, _templateObject10$1, _templateObject11$1, _templateObject12, _templateObject13;
+var _templateObject$w, _templateObject2$o, _templateObject3$i, _templateObject4$e, _templateObject5$c, _templateObject6$9, _templateObject7$5, _templateObject8$2, _templateObject9$1, _templateObject0$1, _templateObject1$1, _templateObject10$1, _templateObject11$1, _templateObject12, _templateObject13;
 var AccountInfoWrapper = styledComponents.styled.div.withConfig({
   displayName: "AccountInfoWrapper",
   componentId: "sc-1p04ez8-0"
-})(_templateObject$x || (_templateObject$x = _taggedTemplateLiteral(["\n  position: relative;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 10px;\n  padding: 42px 30px;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  ", " {\n    flex-direction: column;\n    padding: 30px 20px;\n  }\n"])), function (_ref) {
+})(_templateObject$w || (_templateObject$w = _taggedTemplateLiteral(["\n  position: relative;\n  background: ", ";\n  border: 1px solid ", ";\n  border-radius: 10px;\n  padding: 42px 30px;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  ", " {\n    flex-direction: column;\n    padding: 30px 20px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.card;
 }, function (_ref2) {
@@ -16022,7 +15864,7 @@ var AccountInfoWrapper = styledComponents.styled.div.withConfig({
 var StyledAccountInfo = styledComponents.styled.div.withConfig({
   displayName: "StyledAccountInfo",
   componentId: "sc-1p04ez8-1"
-})(_templateObject2$p || (_templateObject2$p = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: space-between;\n  justify-content: flex-start;\n  margin-left: 28px;\n  ", " {\n    margin-bottom: ", ";\n    margin-left: 0px;\n  }\n"])), function (_ref4) {
+})(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: space-between;\n  justify-content: flex-start;\n  margin-left: 28px;\n  ", " {\n    margin-bottom: ", ";\n    margin-left: 0px;\n  }\n"])), function (_ref4) {
   var theme = _ref4.theme;
   return theme.mediaQueries.mobile;
 }, function (_ref5) {
@@ -16032,7 +15874,7 @@ var StyledAccountInfo = styledComponents.styled.div.withConfig({
 var UserComponent = styledComponents.styled.p.withConfig({
   displayName: "UserComponent",
   componentId: "sc-1p04ez8-2"
-})(_templateObject3$j || (_templateObject3$j = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  ", " {\n    width: 100%;\n    margin-bottom: ", ";\n  }\n  ", " {\n    width: 100%;\n    justify-content: ", ";\n  }\n"])), function (_ref6) {
+})(_templateObject3$i || (_templateObject3$i = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  ", " {\n    width: 100%;\n    margin-bottom: ", ";\n  }\n  ", " {\n    width: 100%;\n    justify-content: ", ";\n  }\n"])), function (_ref6) {
   var theme = _ref6.theme;
   return theme.mediaQueries.tablet;
 }, function (_ref7) {
@@ -16058,7 +15900,7 @@ var UserComponent = styledComponents.styled.p.withConfig({
 var AccountComponent = styledComponents.styled.div.withConfig({
   displayName: "AccountComponent",
   componentId: "sc-1p04ez8-3"
-})(_templateObject4$f || (_templateObject4$f = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  justify-content: space-between;\n  border: 1px solid ", ";\n  border-radius: 10px;\n  background: ", ";\n  padding: 16px 24px;\n  margin-left: 31px;\n  ", " {\n    width: 100%;\n    align-items: center;\n    margin-left: 0px;\n  }\n"])), function (_ref0) {
+})(_templateObject4$e || (_templateObject4$e = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  justify-content: space-between;\n  border: 1px solid ", ";\n  border-radius: 10px;\n  background: ", ";\n  padding: 16px 24px;\n  margin-left: 31px;\n  ", " {\n    width: 100%;\n    align-items: center;\n    margin-left: 0px;\n  }\n"])), function (_ref0) {
   var theme = _ref0.theme;
   return theme.colors.white3;
 }, function (_ref1) {
@@ -16071,7 +15913,7 @@ var AccountComponent = styledComponents.styled.div.withConfig({
 var BalanceText = styledComponents.styled(Text).withConfig({
   displayName: "BalanceText",
   componentId: "sc-1p04ez8-4"
-})(_templateObject5$d || (_templateObject5$d = _taggedTemplateLiteral(["\n  margin-left: 50px;\n  ", " {\n    margin-left: 0px;\n  }\n"])), function (_ref11) {
+})(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteral(["\n  margin-left: 50px;\n  ", " {\n    margin-left: 0px;\n  }\n"])), function (_ref11) {
   var theme = _ref11.theme;
   return theme.mediaQueries.tablet;
 });
@@ -16390,30 +16232,30 @@ var Icon$C = function Icon() {
   });
 };
 
-var _templateObject$w, _templateObject2$o, _templateObject3$i, _templateObject4$e, _templateObject5$c, _templateObject6$8, _templateObject7$4, _templateObject8$1, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11;
+var _templateObject$v, _templateObject2$n, _templateObject3$h, _templateObject4$d, _templateObject5$b, _templateObject6$8, _templateObject7$4, _templateObject8$1, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11;
 var Wrapper$2 = styledComponents.styled.div.withConfig({
   displayName: "Wrapper",
   componentId: "sc-kcmda0-0"
-})(_templateObject$w || (_templateObject$w = _taggedTemplateLiteral(["\n    height: ", ";\n    width: 350px;\n    padding: 24px;\n    background: #191921;\n    border-radius: 10px;\n    @media screen and (max-width: 1180px) {\n      height: auto;\n    }\n"])), function (_ref) {
+})(_templateObject$v || (_templateObject$v = _taggedTemplateLiteral(["\n    height: ", ";\n    width: 350px;\n    padding: 24px;\n    background: #191921;\n    border-radius: 10px;\n    @media screen and (max-width: 1180px) {\n      height: auto;\n    }\n"])), function (_ref) {
   var height = _ref.height;
   return height ? "".concat(height, "px") : "auto";
 });
 var Header = styledComponents.styled.div.withConfig({
   displayName: "Header",
   componentId: "sc-kcmda0-1"
-})(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])));
+})(_templateObject2$n || (_templateObject2$n = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])));
 var PoolWeightWrapper = styledComponents.styled.div.withConfig({
   displayName: "PoolWeightWrapper",
   componentId: "sc-kcmda0-2"
-})(_templateObject3$i || (_templateObject3$i = _taggedTemplateLiteral(["\n  width: auto;\n  display: flex;\n  flex-direction: column;\n"])));
+})(_templateObject3$h || (_templateObject3$h = _taggedTemplateLiteral(["\n  width: auto;\n  display: flex;\n  flex-direction: column;\n"])));
 var PoolWeightText = styledComponents.styled(Text).withConfig({
   displayName: "PoolWeightText",
   componentId: "sc-kcmda0-3"
-})(_templateObject4$e || (_templateObject4$e = _taggedTemplateLiteral(["\n  color: rgba(255, 255, 255, 0.55);\n"])));
+})(_templateObject4$d || (_templateObject4$d = _taggedTemplateLiteral(["\n  color: rgba(255, 255, 255, 0.55);\n"])));
 var CssPowerText = styledComponents.styled(Text).withConfig({
   displayName: "CssPowerText",
   componentId: "sc-kcmda0-4"
-})(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteral(["\n  color: rgba(255, 255, 255, 0.55);\n"])));
+})(_templateObject5$b || (_templateObject5$b = _taggedTemplateLiteral(["\n  color: rgba(255, 255, 255, 0.55);\n"])));
 var RequirementDescripton = styledComponents.styled(Text).withConfig({
   displayName: "RequirementDescripton",
   componentId: "sc-kcmda0-5"
@@ -16514,27 +16356,27 @@ var TierCard = function TierCard(_ref2) {
   });
 };
 
-var _templateObject$v, _templateObject2$n, _templateObject3$h, _templateObject4$d, _templateObject5$b, _templateObject6$7;
+var _templateObject$u, _templateObject2$m, _templateObject3$g, _templateObject4$c, _templateObject5$a, _templateObject6$7;
 var Wrapper$1 = styledComponents.styled.div.withConfig({
   displayName: "Wrapper",
   componentId: "sc-8hnj4a-0"
-})(_templateObject$v || (_templateObject$v = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  width: 300px;\n"])));
+})(_templateObject$u || (_templateObject$u = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  width: 300px;\n"])));
 var Upper = styledComponents.styled.div.withConfig({
   displayName: "Upper",
   componentId: "sc-8hnj4a-1"
-})(_templateObject2$n || (_templateObject2$n = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n"])));
+})(_templateObject2$m || (_templateObject2$m = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n"])));
 var IconWrapper = styledComponents.styled.div.withConfig({
   displayName: "IconWrapper",
   componentId: "sc-8hnj4a-2"
-})(_templateObject3$h || (_templateObject3$h = _taggedTemplateLiteral(["\n  margin: 0 auto;\n  max-width: 220px;\n  max-height: 160px;\n"])));
+})(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteral(["\n  margin: 0 auto;\n  max-width: 220px;\n  max-height: 160px;\n"])));
 var StepNumber = styledComponents.styled.p.withConfig({
   displayName: "StepNumber",
   componentId: "sc-8hnj4a-3"
-})(_templateObject4$d || (_templateObject4$d = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  border: 1px solid rgba(255, 255, 255, 0.03);\n  color: #ffffff;\n  opacity: 0.55;\n  border-radius: 10px;\n  background: #1d1d26;\n"])));
+})(_templateObject4$c || (_templateObject4$c = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 40px;\n  height: 40px;\n  border: 1px solid rgba(255, 255, 255, 0.03);\n  color: #ffffff;\n  opacity: 0.55;\n  border-radius: 10px;\n  background: #1d1d26;\n"])));
 var StepDescription = styledComponents.styled(Text).withConfig({
   displayName: "StepDescription",
   componentId: "sc-8hnj4a-4"
-})(_templateObject5$b || (_templateObject5$b = _taggedTemplateLiteral(["\n  text-align: center;\n  color: rgba(255, 255, 255, 0.55);\n  max-width: 229px;\n  ", " {\n    font-size: 14px;\n  }\n"])), function (_ref) {
+})(_templateObject5$a || (_templateObject5$a = _taggedTemplateLiteral(["\n  text-align: center;\n  color: rgba(255, 255, 255, 0.55);\n  max-width: 229px;\n  ", " {\n    font-size: 14px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.mobile;
 });
@@ -16594,36 +16436,36 @@ var IdoParticipationStep = function IdoParticipationStep(_ref2) {
   });
 };
 
-var _templateObject$u, _templateObject2$m, _templateObject3$g, _templateObject4$c, _templateObject5$a, _templateObject6$6, _templateObject7$3;
+var _templateObject$t, _templateObject2$l, _templateObject3$f, _templateObject4$b, _templateObject5$9, _templateObject6$6, _templateObject7$3;
 var UserTiersWrapper = styledComponents.styled.div.withConfig({
   displayName: "UserTiersWrapper",
   componentId: "sc-ge61bg-0"
-})(_templateObject$u || (_templateObject$u = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  height: max-content;\n  background: ", ";\n  border-radius: 16px;\n  padding: 32px;\n"])), function (_ref) {
+})(_templateObject$t || (_templateObject$t = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  height: max-content;\n  background: ", ";\n  border-radius: 16px;\n  padding: 32px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.card;
 });
 var TiersTitle = styledComponents.styled(Text).withConfig({
   displayName: "TiersTitle",
   componentId: "sc-ge61bg-1"
-})(_templateObject2$m || (_templateObject2$m = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 32px;\n  line-height: 130%;\n  color: ", ";\n  margin-bottom: 20px;\n"])), function (_ref2) {
+})(_templateObject2$l || (_templateObject2$l = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 32px;\n  line-height: 130%;\n  color: ", ";\n  margin-bottom: 20px;\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.white;
 });
 var Column = styledComponents.styled.div.withConfig({
   displayName: "Column",
   componentId: "sc-ge61bg-2"
-})(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n"])));
+})(_templateObject3$f || (_templateObject3$f = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n"])));
 var TierRow = styledComponents.styled(Box).withConfig({
   displayName: "TierRow",
   componentId: "sc-ge61bg-3"
-})(_templateObject4$c || (_templateObject4$c = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 10px 0px;\n  border-bottom: ", ";\n"])), function (_ref3) {
+})(_templateObject4$b || (_templateObject4$b = _taggedTemplateLiteral(["\n  width: 100%;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 10px 0px;\n  border-bottom: ", ";\n"])), function (_ref3) {
   var bordered = _ref3.bordered;
   return bordered && "1px solid #272730";
 });
 var TierNumberText = styledComponents.styled(Text).withConfig({
   displayName: "TierNumberText",
   componentId: "sc-ge61bg-4"
-})(_templateObject5$a || (_templateObject5$a = _taggedTemplateLiteral(["\n  font-size: 14px;\n  line-height: 160%;\n  color: ", ";\n  font-weight: ", ";\n  position: relative;\n"])), function (_ref4) {
+})(_templateObject5$9 || (_templateObject5$9 = _taggedTemplateLiteral(["\n  font-size: 14px;\n  line-height: 160%;\n  color: ", ";\n  font-weight: ", ";\n  position: relative;\n"])), function (_ref4) {
   var theme = _ref4.theme,
     active = _ref4.active;
   return active ? theme.colors.white : "#818c92";
@@ -16706,11 +16548,11 @@ var UserTiers = function UserTiers(props) {
   });
 };
 
-var _templateObject$t;
+var _templateObject$s;
 var StyledMultiValue = styledComponents.styled.div.withConfig({
   displayName: "StyledMultiValue",
   componentId: "sc-11c5hed-0"
-})(_templateObject$t || (_templateObject$t = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-end;\n"])));
+})(_templateObject$s || (_templateObject$s = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-end;\n"])));
 var SpacePadKeyMetrics = function SpacePadKeyMetrics(_ref) {
   var spaceRound = _ref.spaceRound,
     useEndTime = _ref.useEndTime,
@@ -16744,15 +16586,15 @@ var SpacePadKeyMetrics = function SpacePadKeyMetrics(_ref) {
   });
 };
 
-var _templateObject$s, _templateObject2$l, _templateObject3$f, _templateObject4$b, _templateObject5$9;
+var _templateObject$r, _templateObject2$k, _templateObject3$e, _templateObject4$a, _templateObject5$8;
 var LaunchWrapper = styledComponents.styled.div.withConfig({
   displayName: "LaunchWrapper",
   componentId: "sc-8kj88a-0"
-})(_templateObject$s || (_templateObject$s = _taggedTemplateLiteral(["\n  width: 100%;\n  background: #1d1d26;\n  padding: 44px;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: center;\n  margin-top: 70px;\n"])));
+})(_templateObject$r || (_templateObject$r = _taggedTemplateLiteral(["\n  width: 100%;\n  background: #1d1d26;\n  padding: 44px;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: center;\n  margin-top: 70px;\n"])));
 var ForProjects = styledComponents.styled(Text).withConfig({
   displayName: "ForProjects",
   componentId: "sc-8kj88a-1"
-})(_templateObject2$l || (_templateObject2$l = _taggedTemplateLiteral(["\n  margin: 0 auto;\n  width: 135px;\n  text-align: center;\n  border: 1px solid ", ";\n  color: ", ";\n  line-height: 28px;\n  border-radius: 10px;\n"])), function (_ref) {
+})(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteral(["\n  margin: 0 auto;\n  width: 135px;\n  text-align: center;\n  border: 1px solid ", ";\n  color: ", ";\n  line-height: 28px;\n  border-radius: 10px;\n"])), function (_ref) {
   var theme = _ref.theme,
     mainColor = _ref.mainColor;
   return mainColor || theme.colors.darkPurple;
@@ -16764,15 +16606,15 @@ var ForProjects = styledComponents.styled(Text).withConfig({
 var LaunchHeader = styledComponents.styled(Text).withConfig({
   displayName: "LaunchHeader",
   componentId: "sc-8kj88a-2"
-})(_templateObject3$f || (_templateObject3$f = _taggedTemplateLiteral(["\n  margin: 20px 0;\n  text-align: center;\n  @media screen and (max-width: 760px) {\n    width: 310px;\n    font-size: 26px;\n  }\n"])));
+})(_templateObject3$e || (_templateObject3$e = _taggedTemplateLiteral(["\n  margin: 20px 0;\n  text-align: center;\n  @media screen and (max-width: 760px) {\n    width: 310px;\n    font-size: 26px;\n  }\n"])));
 var LaunchDescription = styledComponents.styled(Text).withConfig({
   displayName: "LaunchDescription",
   componentId: "sc-8kj88a-3"
-})(_templateObject4$b || (_templateObject4$b = _taggedTemplateLiteral(["\n  width: 630px;\n  color: rgba(255, 255, 255, 0.55);\n  text-align: center;\n  @media screen and (max-width: 760px) {\n    width: 310px;\n  }\n"])));
+})(_templateObject4$a || (_templateObject4$a = _taggedTemplateLiteral(["\n  width: 630px;\n  color: rgba(255, 255, 255, 0.55);\n  text-align: center;\n  @media screen and (max-width: 760px) {\n    width: 310px;\n  }\n"])));
 var ApplyForIdoButton = styledComponents.styled(Button$1).withConfig({
   displayName: "ApplyForIdoButton",
   componentId: "sc-8kj88a-4"
-})(_templateObject5$9 || (_templateObject5$9 = _taggedTemplateLiteral(["\n  width: 161px;\n  height: 44px;\n  border-radius: 10px;\n  background: #12ffb8;\n  margin-top: 45px;\n"])));
+})(_templateObject5$8 || (_templateObject5$8 = _taggedTemplateLiteral(["\n  width: 161px;\n  height: 44px;\n  border-radius: 10px;\n  background: #12ffb8;\n  margin-top: 45px;\n"])));
 var SpacePadLaunch = function SpacePadLaunch(_ref3) {
   var title = _ref3.title,
     description = _ref3.description,
@@ -16801,24 +16643,24 @@ var SpacePadLaunch = function SpacePadLaunch(_ref3) {
   });
 };
 
-var _templateObject$r;
+var _templateObject$q;
 var ReferralTitle = styledComponents.styled(Text).withConfig({
   displayName: "ReferralTitle",
   componentId: "sc-q2pgu9-0"
-})(_templateObject$r || (_templateObject$r = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 32px;\n  line-height: 130%;\n  color: ", ";\n"])), function (_ref) {
+})(_templateObject$q || (_templateObject$q = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-size: 32px;\n  line-height: 130%;\n  color: ", ";\n"])), function (_ref) {
   var fontColor = _ref.fontColor;
   return fontColor || "#ffffff";
 });
 
-var _templateObject$q, _templateObject2$k;
+var _templateObject$p, _templateObject2$j;
 var ReferralBannerWrapper = styledComponents.styled.div.withConfig({
   displayName: "ReferralBannerWrapper",
   componentId: "sc-3cib5z-0"
-})(_templateObject$q || (_templateObject$q = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
+})(_templateObject$p || (_templateObject$p = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n"])));
 var InvitationDescription = styledComponents.styled(Text).withConfig({
   displayName: "InvitationDescription",
   componentId: "sc-3cib5z-1"
-})(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteral(["\n  font-weight: normal;\n  font-size: 16px;\n  line-height: 24px;\n  color: #818c92;\n  margin-bottom: 24px;\n"])));
+})(_templateObject2$j || (_templateObject2$j = _taggedTemplateLiteral(["\n  font-weight: normal;\n  font-size: 16px;\n  line-height: 24px;\n  color: #818c92;\n  margin-bottom: 24px;\n"])));
 var ReferralBanner = function ReferralBanner(props) {
   var refFee = props.refFee,
     onReadMore = props.onReadMore,
@@ -16883,33 +16725,33 @@ var copyValueToClipboard = function copyValueToClipboard(value, copyCallback) {
   }, 3000);
 };
 
-var _templateObject$p, _templateObject2$j, _templateObject3$e, _templateObject4$a, _templateObject5$8, _templateObject6$5;
+var _templateObject$o, _templateObject2$i, _templateObject3$d, _templateObject4$9, _templateObject5$7, _templateObject6$5;
 var TableCard = styledComponents.styled(Card).withConfig({
   displayName: "TableCard",
   componentId: "sc-wd2wdf-0"
-})(_templateObject$p || (_templateObject$p = _taggedTemplateLiteral(["\n  border: none;\n  padding: 15px;\n  width: 100%;\n  margin-bottom: 24px;\n  ", " {\n    padding: 25px 30px;\n  }\n"])), function (_ref) {
+})(_templateObject$o || (_templateObject$o = _taggedTemplateLiteral(["\n  border: none;\n  padding: 15px;\n  width: 100%;\n  margin-bottom: 24px;\n  ", " {\n    padding: 25px 30px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.sm;
 });
 var CopyLinkCardWrapper = styledComponents.styled(TableCard).withConfig({
   displayName: "CopyLinkCardWrapper",
   componentId: "sc-wd2wdf-1"
-})(_templateObject2$j || (_templateObject2$j = _taggedTemplateLiteral(["\n  background: #1d1d26;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n"])));
+})(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteral(["\n  background: #1d1d26;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n"])));
 var MyReferralCard = styledComponents.styled(TableCard).withConfig({
   displayName: "MyReferralCard",
   componentId: "sc-wd2wdf-2"
-})(_templateObject3$e || (_templateObject3$e = _taggedTemplateLiteral(["\n  background: #16161d;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  grid-column: span 6;\n  ", " {\n    grid-column: span 7;\n  }\n"])), function (_ref2) {
+})(_templateObject3$d || (_templateObject3$d = _taggedTemplateLiteral(["\n  background: #16161d;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  grid-column: span 6;\n  ", " {\n    grid-column: span 7;\n  }\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.mediaQueries.sm;
 });
 var RefLink = styledComponents.styled(Text).withConfig({
   displayName: "RefLink",
   componentId: "sc-wd2wdf-3"
-})(_templateObject4$a || (_templateObject4$a = _taggedTemplateLiteral(["\n  display: inline;\n  align-items: center;\n  text-overflow: ellipsis;\n  width: 80%;\n  overflow: hidden;\n  white-space: nowrap;\n  height: max-content;\n  font-weight: 600;\n  font-size: 16px;\n  line-height: 24px;\n"])));
+})(_templateObject4$9 || (_templateObject4$9 = _taggedTemplateLiteral(["\n  display: inline;\n  align-items: center;\n  text-overflow: ellipsis;\n  width: 80%;\n  overflow: hidden;\n  white-space: nowrap;\n  height: max-content;\n  font-weight: 600;\n  font-size: 16px;\n  line-height: 24px;\n"])));
 var SocialRow = styledComponents.styled.div.withConfig({
   displayName: "SocialRow",
   componentId: "sc-wd2wdf-4"
-})(_templateObject5$8 || (_templateObject5$8 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n"])));
+})(_templateObject5$7 || (_templateObject5$7 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n"])));
 var ShareText = styledComponents.styled(Text).withConfig({
   displayName: "ShareText",
   componentId: "sc-wd2wdf-5"
@@ -17654,18 +17496,18 @@ var IconModule = /*#__PURE__*/Object.freeze({
   YouTubeIcon: Icon$e
 });
 
-var _templateObject$o, _templateObject2$i;
+var _templateObject$n, _templateObject2$h;
 var StyledLink = styledComponents.styled(reactRouterDom.Link).withConfig({
   displayName: "StyledLink",
   componentId: "sc-1u6975p-0"
-})(_templateObject$o || (_templateObject$o = _taggedTemplateLiteral(["\n  display: flex;\n  display: -webkit-flex;\n  align-items: center;\n  -webkit-align-items: center;\n  .mobile-icon {\n    width: 32px;\n    margin-left: 10px;\n  }\n  .desktop-icon {\n    width: 156px;\n    display: none;\n    ", " {\n      display: block;\n    }\n  }\n  margin-left: 0px;\n"])), function (_ref) {
+})(_templateObject$n || (_templateObject$n = _taggedTemplateLiteral(["\n  display: flex;\n  display: -webkit-flex;\n  align-items: center;\n  -webkit-align-items: center;\n  .mobile-icon {\n    width: 32px;\n    margin-left: 10px;\n  }\n  .desktop-icon {\n    width: 156px;\n    display: none;\n    ", " {\n      display: block;\n    }\n  }\n  margin-left: 0px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.mediaQueries.nav;
 });
 var CoinswapLogo = styledComponents.styled.div.withConfig({
   displayName: "CoinswapLogo",
   componentId: "sc-1u6975p-1"
-})(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteral(["\n  $opacity: ", ";\n  width: ", ";\n  transition: width 0.6s, $opacity 0.3s;\n"])), function (_ref2) {
+})(_templateObject2$h || (_templateObject2$h = _taggedTemplateLiteral(["\n  $opacity: ", ";\n  width: ", ";\n  transition: width 0.6s, $opacity 0.3s;\n"])), function (_ref2) {
   var isPushed = _ref2.isPushed;
   return isPushed ? 1 : 0;
 }, function (_ref3) {
@@ -17858,12 +17700,12 @@ var MENU_ACCORDION_HEIGHT = 30;
 var SIDEBAR_WIDTH_FULL = 240;
 var SIDEBAR_WIDTH_REDUCED = 70;
 
-var _templateObject$n, _templateObject2$h, _templateObject3$d;
-var rainbowAnimation = styledComponents.keyframes(_templateObject$n || (_templateObject$n = _taggedTemplateLiteral(["\n  0%,\n  100% {\n    background-position: 0 0;\n  }\n  50% {\n    background-position: 100% 0;\n  }\n"])));
+var _templateObject$m, _templateObject2$g, _templateObject3$c;
+var rainbowAnimation = styledComponents.keyframes(_templateObject$m || (_templateObject$m = _taggedTemplateLiteral(["\n  0%,\n  100% {\n    background-position: 0 0;\n  }\n  50% {\n    background-position: 100% 0;\n  }\n"])));
 var LinkLabel = styledComponents.styled.div.withConfig({
   displayName: "LinkLabel",
   componentId: "sc-1sxukum-0"
-})(_templateObject2$h || (_templateObject2$h = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  color: ", ";\n  transition: all 0.7s;\n  flex-grow: 1;\n  font-weight: 700;\n  font-size: 14px;\n  width: 100%;\n  opacity: ", ";\n"])), function (_ref) {
+})(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  color: ", ";\n  transition: all 0.7s;\n  flex-grow: 1;\n  font-weight: 700;\n  font-size: 14px;\n  width: 100%;\n  opacity: ", ";\n"])), function (_ref) {
   var isPushed = _ref.isPushed,
     isActive = _ref.isActive;
   return !isPushed ? "transparent" : isActive ? "rgba(255, 255, 255, 1)" : "rgba(255, 255, 255, 0.5)";
@@ -17874,7 +17716,7 @@ var LinkLabel = styledComponents.styled.div.withConfig({
 var MenuEntry = styledComponents.styled.div.withConfig({
   displayName: "MenuEntry",
   componentId: "sc-1sxukum-1"
-})(_templateObject3$d || (_templateObject3$d = _taggedTemplateLiteral(["\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  height: ", "px;\n  width: ", "px;\n  padding: ", ";\n  font-size: 14px;\n  background-color: ", ";\n  color: ", ";\n  transition: all 0.9s;\n  ", " {\n    height: 40px;\n  }\n\n  a {\n    display: flex;\n    align-items: center;\n    width: 100%;\n    height: 100%;\n    color: ", ";\n    font-weight: 700;\n    transition: all 0.5s;\n  }\n\n  .dot {\n    height: 5px;\n    width: 5px;\n    border-radius: 50%;\n    display: inline-block;\n    background-color: ", ";\n  }\n\n  svg {\n    fill: ", ";\n    margin-right: 13px;\n  }\n\n  &:hover {\n    svg {\n      path {\n        fill: #12ffb8;\n        fill-opacity: 1;\n      }\n      margin-right: ", ";\n    }\n    div,\n    a {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n\n    div,\n    a {\n      color: rgba(255, 255, 255, 1);\n    }\n  }\n\n  // Safari fix\n  flex-shrink: 0;\n\n  &.rainbow {\n    background-clip: text;\n    animation: ", " 3s ease-in-out infinite;\n    background: ", ";\n    background-size: 400% 100%;\n  }\n"])), MENU_ENTRY_HEIGHT, SIDEBAR_WIDTH_FULL, function (_ref3) {
+})(_templateObject3$c || (_templateObject3$c = _taggedTemplateLiteral(["\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  height: ", "px;\n  width: ", "px;\n  padding: ", ";\n  font-size: 14px;\n  background-color: ", ";\n  color: ", ";\n  transition: all 0.9s;\n  ", " {\n    height: 40px;\n  }\n\n  a {\n    display: flex;\n    align-items: center;\n    width: 100%;\n    height: 100%;\n    color: ", ";\n    font-weight: 700;\n    transition: all 0.5s;\n  }\n\n  .dot {\n    height: 5px;\n    width: 5px;\n    border-radius: 50%;\n    display: inline-block;\n    background-color: ", ";\n  }\n\n  svg {\n    fill: ", ";\n    margin-right: 13px;\n  }\n\n  &:hover {\n    svg {\n      path {\n        fill: #12ffb8;\n        fill-opacity: 1;\n      }\n      margin-right: ", ";\n    }\n    div,\n    a {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n\n    div,\n    a {\n      color: rgba(255, 255, 255, 1);\n    }\n  }\n\n  // Safari fix\n  flex-shrink: 0;\n\n  &.rainbow {\n    background-clip: text;\n    animation: ", " 3s ease-in-out infinite;\n    background: ", ";\n    background-size: 400% 100%;\n  }\n"])), MENU_ENTRY_HEIGHT, SIDEBAR_WIDTH_FULL, function (_ref3) {
   var secondary = _ref3.secondary;
   return secondary ? "0 32px" : "0 25px";
 }, function (_ref4) {
@@ -17908,15 +17750,15 @@ var MenuEntry = styledComponents.styled.div.withConfig({
   return theme.colors.gradients.bubblegum;
 });
 
-var _templateObject$m, _templateObject2$g, _templateObject3$c;
+var _templateObject$l, _templateObject2$f, _templateObject3$b;
 var Container$2 = styledComponents.styled.div.withConfig({
   displayName: "Container",
   componentId: "sc-1j605qy-0"
-})(_templateObject$m || (_templateObject$m = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  // Safari fix\n  flex-shrink: 0;\n"])));
+})(_templateObject$l || (_templateObject$l = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  // Safari fix\n  flex-shrink: 0;\n"])));
 var AccordionContent = styledComponents.styled.div.withConfig({
   displayName: "AccordionContent",
   componentId: "sc-1j605qy-1"
-})(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteral(["\n  max-height: ", ";\n  transition: max-height 0.3s ease-out;\n  overflow-x: hidden;\n  overflow-y: scroll;\n  border-color: ", ";\n  border-style: solid;\n  border-width: 1px 0;\n  border-bottom: none;\n"])), function (_ref) {
+})(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteral(["\n  max-height: ", ";\n  transition: max-height 0.3s ease-out;\n  overflow-x: hidden;\n  overflow-y: scroll;\n  border-color: ", ";\n  border-style: solid;\n  border-width: 1px 0;\n  border-bottom: none;\n"])), function (_ref) {
   var isOpen = _ref.isOpen,
     maxHeight = _ref.maxHeight;
   return isOpen ? "".concat(maxHeight, "px") : 0;
@@ -17928,7 +17770,7 @@ var AccordionContent = styledComponents.styled.div.withConfig({
 var ArrowIcon = styledComponents.styled(Icon$2x).withConfig({
   displayName: "ArrowIcon",
   componentId: "sc-1j605qy-2"
-})(_templateObject3$c || (_templateObject3$c = _taggedTemplateLiteral(["\n  margin-right: -7px !important;\n  transform: rotate(", "deg);\n  transition: transform 0.4s;\n"])), function (_ref3) {
+})(_templateObject3$b || (_templateObject3$b = _taggedTemplateLiteral(["\n  margin-right: -7px !important;\n  transform: rotate(", "deg);\n  transition: transform 0.4s;\n"])), function (_ref3) {
   var isOpen = _ref3.isOpen;
   return isOpen ? 0 : 180;
 });
@@ -18001,19 +17843,19 @@ exports.ExtraIcon = void 0;
   ExtraIcon["new"] = "new";
 })(exports.ExtraIcon || (exports.ExtraIcon = {}));
 
-var _templateObject$l, _templateObject2$f;
+var _templateObject$k, _templateObject2$e;
 var Icons$2 = IconModule;
 var Container$1 = styledComponents.styled.div.withConfig({
   displayName: "Container",
   componentId: "sc-1qgqorz-0"
-})(_templateObject$l || (_templateObject$l = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  overflow-x: hidden;\n  scrollbar-color: ", " transparent;\n  scrollbar-width: thin !important;\n"])), function (_ref) {
+})(_templateObject$k || (_templateObject$k = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n  overflow-x: hidden;\n  scrollbar-color: ", " transparent;\n  scrollbar-width: thin !important;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.primary;
 });
 var NewLabel = styledComponents.styled.div.withConfig({
   displayName: "NewLabel",
   componentId: "sc-1qgqorz-1"
-})(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  color: ", " !important;\n  border: solid 1px ", ";\n  border-radius: 12px;\n  padding: 2px 8px;\n  font-size: 10px;\n  line-height: 9px;\n  font-weight: 700;\n  margin-left: 5px;\n  text-align: center;\n"])), function (_ref2) {
+})(_templateObject2$e || (_templateObject2$e = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  color: ", " !important;\n  border: solid 1px ", ";\n  border-radius: 12px;\n  padding: 2px 8px;\n  font-size: 10px;\n  line-height: 9px;\n  font-weight: 700;\n  margin-left: 5px;\n  text-align: center;\n"])), function (_ref2) {
   var theme = _ref2.theme;
   return theme.colors.primary;
 }, function (_ref3) {
@@ -18117,7 +17959,7 @@ var PanelBody = function PanelBody(_ref4) {
 };
 
 var _excluded$1 = ["startIcon", "endIcon", "children", "external", "$isLoading", "isLoading", "disabled"];
-var _templateObject$k;
+var _templateObject$j;
 var StyledNavButton = styledComponents.styled.button.withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
     return !['$fullWidth', '$isLoading'].includes(prop);
@@ -18125,7 +17967,7 @@ var StyledNavButton = styledComponents.styled.button.withConfig({
 }).withConfig({
   displayName: "StyledNavButton",
   componentId: "sc-11strgr-0"
-})(_templateObject$k || (_templateObject$k = _taggedTemplateLiteral(["\n  align-items: center;\n  cursor: pointer;\n  display: flex;\n  justify-content: center;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 600;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  border: none;\n  transition: background-color 0.2s;\n  background-color: transparent;\n  opacity: ", ";\n  margin-left: 10px;\n"])), function (_ref) {
+})(_templateObject$j || (_templateObject$j = _taggedTemplateLiteral(["\n  align-items: center;\n  cursor: pointer;\n  display: flex;\n  justify-content: center;\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: 600;\n  /* max-content instead of auto for Safari fix */\n  width: ", ";\n  height: ", ";\n  line-height: 1;\n  letter-spacing: 0.03em;\n  justify-content: center;\n  outline: 0;\n  border: none;\n  transition: background-color 0.2s;\n  background-color: transparent;\n  opacity: ", ";\n  margin-left: 10px;\n"])), function (_ref) {
   var $fullWidth = _ref.$fullWidth,
     fullWidth = _ref.fullWidth;
   return $fullWidth || fullWidth ? "100%" : "max-content";
@@ -18162,14 +18004,14 @@ var NavButton = function NavButton(_ref4) {
   }));
 };
 
-var _templateObject$j;
+var _templateObject$i;
 var MenuButton = styledComponents.styled(NavButton).attrs({
   variant: "text",
   size: "sm"
 }).withConfig({
   displayName: "MenuButton",
   componentId: "sc-1nwrww1-0"
-})(_templateObject$j || (_templateObject$j = _taggedTemplateLiteral(["\n  color: ", ";\n  padding: 0 8px;\n  border-radius: 8px;\n"])), function (_ref) {
+})(_templateObject$i || (_templateObject$i = _taggedTemplateLiteral(["\n  color: ", ";\n  padding: 0 8px;\n  border-radius: 8px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.text;
 });
@@ -18205,13 +18047,13 @@ var getLangFlag = function getLangFlag(lang) {
   }
 };
 
-var _templateObject$i, _templateObject2$e, _templateObject3$b, _templateObject4$9, _templateObject5$7, _templateObject6$4, _templateObject7$2;
+var _templateObject$h, _templateObject2$d, _templateObject3$a, _templateObject4$8, _templateObject5$6, _templateObject6$4, _templateObject7$2;
 var Icons$1 = IconModule;
 var LanguageIcon = Icons$1.LanguageIcon;
 var LangButton = styledComponents.styled(Button$1).withConfig({
   displayName: "LangButton",
   componentId: "sc-1yvxo6n-0"
-})(_templateObject$i || (_templateObject$i = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  position: relative;\n  justify-content: flex-start;\n  z-index: 9999999;\n  border: 1px solid ", ";\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border: 1px solid rgba(255, 255, 255, 0.03);\n  }\n  transition: width 0.6s;\n  height: 28px;\n  width: ", "px;\n  margin-bottom: 15px;\n  padding: 0px 10px;\n"])), function (_ref) {
+})(_templateObject$h || (_templateObject$h = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  position: relative;\n  justify-content: flex-start;\n  z-index: 9999999;\n  border: 1px solid ", ";\n  &:hover:not(:disabled):not(.button--disabled):not(:active) {\n    border: 1px solid rgba(255, 255, 255, 0.03);\n  }\n  transition: width 0.6s;\n  height: 28px;\n  width: ", "px;\n  margin-bottom: 15px;\n  padding: 0px 10px;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.white3;
 }, function (_ref2) {
@@ -18221,7 +18063,7 @@ var LangButton = styledComponents.styled(Button$1).withConfig({
 var LangModal = styledComponents.styled.div.withConfig({
   displayName: "LangModal",
   componentId: "sc-1yvxo6n-1"
-})(_templateObject2$e || (_templateObject2$e = _taggedTemplateLiteral(["\n  position: absolute;\n  display: ", "};\n  bottom: 45px;\n  left: 0px;\n  background: ", ";\n  border: 1px solid rgba(255, 255, 255, 0.03);\n  width: 267px;\n  height: auto;\n  padding: 27px 17px 27px 27px;\n  border-radius: 15px;\n"])), function (_ref3) {
+})(_templateObject2$d || (_templateObject2$d = _taggedTemplateLiteral(["\n  position: absolute;\n  display: ", "};\n  bottom: 45px;\n  left: 0px;\n  background: ", ";\n  border: 1px solid rgba(255, 255, 255, 0.03);\n  width: 267px;\n  height: auto;\n  padding: 27px 17px 27px 27px;\n  border-radius: 15px;\n"])), function (_ref3) {
   var display = _ref3.display;
   return display ? "block" : "none";
 }, function (_ref4) {
@@ -18231,7 +18073,7 @@ var LangModal = styledComponents.styled.div.withConfig({
 var LangsList = styledComponents.styled.div.withConfig({
   displayName: "LangsList",
   componentId: "sc-1yvxo6n-2"
-})(_templateObject3$b || (_templateObject3$b = _taggedTemplateLiteral(["\n  max-height: 170px;\n  overflow-y: scroll;\n  &::-webkit-scrollbar {\n    width: 5px !important;\n  }\n  &::-webkit-scrollbar-thumb {\n    background: ", " !important;\n    border-radius: 8px;\n  }\n  &::-webkit-scrollbar-track {\n    box-shadow: inset 0 0 5px ", ";\n    border-radius: 3px;\n  }\n"])), function (_ref5) {
+})(_templateObject3$a || (_templateObject3$a = _taggedTemplateLiteral(["\n  max-height: 170px;\n  overflow-y: scroll;\n  &::-webkit-scrollbar {\n    width: 5px !important;\n  }\n  &::-webkit-scrollbar-thumb {\n    background: ", " !important;\n    border-radius: 8px;\n  }\n  &::-webkit-scrollbar-track {\n    box-shadow: inset 0 0 5px ", ";\n    border-radius: 3px;\n  }\n"])), function (_ref5) {
   var theme = _ref5.theme;
   return theme.colors.white55;
 }, function (_ref6) {
@@ -18241,11 +18083,11 @@ var LangsList = styledComponents.styled.div.withConfig({
 var TitleContainer = styledComponents.styled.div.withConfig({
   displayName: "TitleContainer",
   componentId: "sc-1yvxo6n-3"
-})(_templateObject4$9 || (_templateObject4$9 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  margin-bottom: 10px;\n"])));
-var ButtonContainer$1 = styledComponents.styled.div.withConfig({
+})(_templateObject4$8 || (_templateObject4$8 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  margin-bottom: 10px;\n"])));
+var ButtonContainer = styledComponents.styled.div.withConfig({
   displayName: "ButtonContainer",
   componentId: "sc-1yvxo6n-4"
-})(_templateObject5$7 || (_templateObject5$7 = _taggedTemplateLiteral(["\n  width: 100%;\n  text-align: start;\n  padding: 0px 8px;\n"])));
+})(_templateObject5$6 || (_templateObject5$6 = _taggedTemplateLiteral(["\n  width: 100%;\n  text-align: start;\n  padding: 0px 8px;\n"])));
 var LangText = styledComponents.styled(Text).withConfig({
   displayName: "LangText",
   componentId: "sc-1yvxo6n-5"
@@ -18280,7 +18122,7 @@ var LangSelector = function LangSelector(_ref9) {
       setshowModal(false);
     }
   }, [isPushed]);
-  return /*#__PURE__*/jsxRuntime.jsx(ButtonContainer$1, {
+  return /*#__PURE__*/jsxRuntime.jsx(ButtonContainer, {
     children: /*#__PURE__*/jsxRuntime.jsxs(LangButton, {
       variant: exports.ButtonVariant.OUTLINE,
       onClick: function onClick() {
@@ -18361,15 +18203,15 @@ var LangSelector$1 = /*#__PURE__*/React.memo(LangSelector, function (prev, next)
   return prev.currentLang === next.currentLang && prev.isPushed === next.isPushed;
 });
 
-var _templateObject$h, _templateObject2$d;
+var _templateObject$g, _templateObject2$c;
 var Container = styledComponents.styled.div.withConfig({
   displayName: "Container",
   componentId: "sc-11jjlfd-0"
-})(_templateObject$h || (_templateObject$h = _taggedTemplateLiteral(["\n  flex: none;\n  padding: 5px 5px 20px 5px;\n  background-color: transparent;\n  position: relative;\n  width: 100%;\n  margin-top: 15px;\n"])));
+})(_templateObject$g || (_templateObject$g = _taggedTemplateLiteral(["\n  flex: none;\n  padding: 5px 5px 20px 5px;\n  background-color: transparent;\n  position: relative;\n  width: 100%;\n  margin-top: 15px;\n"])));
 var SettingsEntry = styledComponents.styled.div.withConfig({
   displayName: "SettingsEntry",
   componentId: "sc-11jjlfd-1"
-})(_templateObject2$d || (_templateObject2$d = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: auto;\n"])));
+})(_templateObject2$c || (_templateObject2$c = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: auto;\n"])));
 var PanelFooter = function PanelFooter(_ref) {
   var isPushed = _ref.isPushed;
     _ref.pushNav;
@@ -18394,21 +18236,21 @@ var PanelFooter = function PanelFooter(_ref) {
   });
 };
 
-var _templateObject$g;
+var _templateObject$f;
 var MobileEntry = styledComponents.styled.div.withConfig({
   displayName: "MobileEntry",
   componentId: "sc-ialwsc-0"
-})(_templateObject$g || (_templateObject$g = _taggedTemplateLiteral(["\n    &:hover {\n    div,\n    a {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n\n    div,\n    a {\n      color: rgba(255, 255, 255, 1);\n    }\n  }\n"])), function (_ref) {
+})(_templateObject$f || (_templateObject$f = _taggedTemplateLiteral(["\n    &:hover {\n    div,\n    a {\n      svg {\n        path {\n          fill: ", ";\n        }\n      }\n    }\n\n    div,\n    a {\n      color: rgba(255, 255, 255, 1);\n    }\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.primary;
 });
 
-var _templateObject$f, _templateObject2$c, _templateObject3$a;
+var _templateObject$e, _templateObject2$b, _templateObject3$9;
 var MOBILE_MENU_PANEL_HEIGHT = 83;
 var MobileMenuContainer = styledComponents.styled.div.withConfig({
   displayName: "MobileMenuContainer",
   componentId: "sc-11f9rbo-0"
-})(_templateObject$f || (_templateObject$f = _taggedTemplateLiteral(["\n  position: fixed;\n  bottom: 0px;\n  width: 100%;\n  right: 0px;\n  left: 0px;\n  z-index: 98;\n  height: ", "px;\n  display: none;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n  background: ", ";\n  ", " {\n    display: flex;\n  }\n"])), MOBILE_MENU_PANEL_HEIGHT, function (_ref) {
+})(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral(["\n  position: fixed;\n  bottom: 0px;\n  width: 100%;\n  right: 0px;\n  left: 0px;\n  z-index: 98;\n  height: ", "px;\n  display: none;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n  background: ", ";\n  ", " {\n    display: flex;\n  }\n"])), MOBILE_MENU_PANEL_HEIGHT, function (_ref) {
   var theme = _ref.theme;
   return theme.colors.card;
 }, function (_ref2) {
@@ -18418,11 +18260,11 @@ var MobileMenuContainer = styledComponents.styled.div.withConfig({
 var MobileLink = styledComponents.styled(MenuLink).withConfig({
   displayName: "MobileLink",
   componentId: "sc-11f9rbo-1"
-})(_templateObject2$c || (_templateObject2$c = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-items: soace-between;\n  align-items: center;\n"])));
+})(_templateObject2$b || (_templateObject2$b = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  justify-items: soace-between;\n  align-items: center;\n"])));
 var MenuLinkLabel = styledComponents.styled.div.withConfig({
   displayName: "MenuLinkLabel",
   componentId: "sc-11f9rbo-2"
-})(_templateObject3$a || (_templateObject3$a = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  font-weight: 700;\n  font-size: 9px;\n  color: white;\n"])));
+})(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  font-weight: 700;\n  font-size: 9px;\n  color: white;\n"])));
 var Icons = IconModule;
 var MobileMenu = function MobileMenu(_ref3) {
   var links = _ref3.links,
@@ -18457,11 +18299,11 @@ var MobileMenu = function MobileMenu(_ref3) {
   });
 };
 
-var _templateObject$e, _templateObject2$b;
+var _templateObject$d, _templateObject2$a;
 var StyledPanel = styledComponents.styled.div.withConfig({
   displayName: "StyledPanel",
   componentId: "sc-1b3g4s2-0"
-})(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral(["\n  position: fixed;\n  padding-top: 100px;\n  top: 0;\n  left: 0;\n  flex-direction: column;\n  justify-content: space-between;\n  flex-shrink: 0;\n  background-color: #191921;\n  width: ", ";\n  height: 100vh;\n  transition: padding-top 0.2s, width 0.6s, box-shadow 0.4s;\n  z-index: 11;\n  overflow: ", ";\n  transform: translate3d(0, 0, 0);\n  ", " {\n    width: ", ";\n    padding-top: 100px;\n    margin-top: 0px;\n    transition: none;\n    overflow-y: auto;\n    padding-bottom: ", "px;\n  }\n"])), function (_ref) {
+})(_templateObject$d || (_templateObject$d = _taggedTemplateLiteral(["\n  position: fixed;\n  padding-top: 100px;\n  top: 0;\n  left: 0;\n  flex-direction: column;\n  justify-content: space-between;\n  flex-shrink: 0;\n  background-color: #191921;\n  width: ", ";\n  height: 100vh;\n  transition: padding-top 0.2s, width 0.6s, box-shadow 0.4s;\n  z-index: 11;\n  overflow: ", ";\n  transform: translate3d(0, 0, 0);\n  ", " {\n    width: ", ";\n    padding-top: 100px;\n    margin-top: 0px;\n    transition: none;\n    overflow-y: auto;\n    padding-bottom: ", "px;\n  }\n"])), function (_ref) {
   var isPushed = _ref.isPushed;
   return "".concat(isPushed ? SIDEBAR_WIDTH_FULL : SIDEBAR_WIDTH_REDUCED, "px");
 }, function (_ref2) {
@@ -18477,7 +18319,7 @@ var StyledPanel = styledComponents.styled.div.withConfig({
 var RowSplitter = styledComponents.styled.div.withConfig({
   displayName: "RowSplitter",
   componentId: "sc-1b3g4s2-1"
-})(_templateObject2$b || (_templateObject2$b = _taggedTemplateLiteral(["\n  border: 1px solid #252530;\n  margin: ", ";\n"])), function (_ref5) {
+})(_templateObject2$a || (_templateObject2$a = _taggedTemplateLiteral(["\n  border: 1px solid #252530;\n  margin: ", ";\n"])), function (_ref5) {
   var isPushed = _ref5.isPushed;
   return isPushed ? "20px" : "20px 15px";
 });
@@ -18499,269 +18341,24 @@ var Panel = function Panel(props) {
   });
 };
 
-var _templateObject$d, _templateObject2$a, _templateObject3$9, _templateObject4$8, _templateObject5$6;
-var Space = styledComponents.styled.div.withConfig({
-  displayName: "Space",
-  componentId: "sc-11tnsw3-0"
-})(_templateObject$d || (_templateObject$d = _taggedTemplateLiteral(["\n  width: 30px;\n"])));
-var DisclaimerContainer = styledComponents.styled.div.withConfig({
-  displayName: "DisclaimerContainer",
-  componentId: "sc-11tnsw3-1"
-})(_templateObject2$a || (_templateObject2$a = _taggedTemplateLiteral(["\n  max-width: 430px;\n"])));
-var CheckBoxContainer = styledComponents.styled.div.withConfig({
-  displayName: "CheckBoxContainer",
-  componentId: "sc-11tnsw3-2"
-})(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteral(["\n  width: 20%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n"])));
-var ButtonContainer = styledComponents.styled.div.withConfig({
-  displayName: "ButtonContainer",
-  componentId: "sc-11tnsw3-3"
-})(_templateObject4$8 || (_templateObject4$8 = _taggedTemplateLiteral(["\n  margin-top: 25px;\n"])));
-var ListContainer = styledComponents.styled.div.withConfig({
-  displayName: "ListContainer",
-  componentId: "sc-11tnsw3-4"
-})(_templateObject5$6 || (_templateObject5$6 = _taggedTemplateLiteral(["\n  font-size: 13px;\n  color: white;\n  margin-bottom: 10px;\n  padding-left: 14px;\n  ul li {\n    list-style-position: outside;\n    padding: 4px;\n    line-height: 17px;\n  }\n"])));
-var DiclaimerModal = function DiclaimerModal(_ref) {
-  var _ref$onDismiss = _ref.onDismiss,
-    onDismiss = _ref$onDismiss === void 0 ? function () {
-      return null;
-    } : _ref$onDismiss,
-    checkBoxesArray = _ref.checkBoxesArray,
-    onResolve = _ref.onResolve,
-    translations = _ref.translations;
-  var _useState = React.useState(checkBoxesArray),
-    _useState2 = _slicedToArray(_useState, 2),
-    checkBoxes = _useState2[0],
-    setCheckBoxes = _useState2[1];
-  var t = translations || getTranslations;
-  var updateCheckState = function updateCheckState(index) {
-    var checkArray = _toConsumableArray(checkBoxes);
-    checkArray[index].isChecked = !checkArray[index].isChecked;
-    setCheckBoxes(checkArray);
-  };
-  var resetAllCheckboxes = function resetAllCheckboxes() {
-    var checkArray = _toConsumableArray(checkBoxes);
-    checkArray.map(function (el) {
-      return el.isChecked === false;
-    });
-    setCheckBoxes(checkArray);
-  };
-  var onClickHandler = function onClickHandler(res) {
-    resetAllCheckboxes();
-    onDismiss();
-    onResolve(res);
-  };
-  return /*#__PURE__*/jsxRuntime.jsx(Modal, {
-    title: t("Important notice").toUpperCase(),
-    hideCloseButton: true,
-    children: /*#__PURE__*/jsxRuntime.jsxs(DisclaimerContainer, {
-      children: [/*#__PURE__*/jsxRuntime.jsx(Text, {
-        fontSize: "14px",
-        bold: true,
-        style: {
-          marginBottom: "18px",
-          maxWidth: 420
-        },
-        children: t("While we have taken careful steps to ensure a high level of safety for our clients then it is required that you read, comprehend and consent to the disclaimer underneath:")
-      }), /*#__PURE__*/jsxRuntime.jsx(ListContainer, {
-        children: /*#__PURE__*/jsxRuntime.jsxs("ul", {
-          children: [/*#__PURE__*/jsxRuntime.jsx("li", {
-            children: t("Using our platform may involve financial risk or loss of funds.")
-          }), /*#__PURE__*/jsxRuntime.jsx("li", {
-            children: t("Never put resources into a pool with tokens you do not trust.")
-          }), /*#__PURE__*/jsxRuntime.jsx("li", {
-            children: t("Never put resources into a pool with tokens whose rules for minting you disagree with.")
-          }), /*#__PURE__*/jsxRuntime.jsx("li", {
-            children: t("Never contribute beyond what you can stand to lose.")
-          }), /*#__PURE__*/jsxRuntime.jsx("li", {
-            children: t("Ensure the accuracy of the contracts for the tokens in the pool.")
-          }), /*#__PURE__*/jsxRuntime.jsx("li", {
-            children: t("Anyone can make a BEP-20 token on Binance Smart Chain with any name, including making counterfeit variants of existing tokens and tokens that claim to represent projects that do not have a token.")
-          })]
-        })
-      }), /*#__PURE__*/jsxRuntime.jsx(Text, {
-        fontSize: "14px",
-        bold: true,
-        style: {
-          marginBottom: "4px",
-          maxWidth: 420
-        },
-        children: t("Please read CoinSwap space Documentation!")
-      }), /*#__PURE__*/jsxRuntime.jsx(Text, {
-        fontSize: "14px",
-        bold: true,
-        style: {
-          marginBottom: "22px",
-          maxWidth: 420
-        },
-        children: t("Continuously do your own examination (due diligence)!")
-      }), checkBoxes === null || checkBoxes === void 0 ? void 0 : checkBoxes.map(function (checkBox, index) {
-        return /*#__PURE__*/jsxRuntime.jsxs(Flex, {
-          alignItems: "center",
-          children: [/*#__PURE__*/jsxRuntime.jsx(CheckBoxContainer, {
-            children: /*#__PURE__*/jsxRuntime.jsx(Checkbox, {
-              bordered: true,
-              onClick: function onClick() {
-                return updateCheckState(index);
-              }
-            })
-          }), /*#__PURE__*/jsxRuntime.jsx(Text, {
-            style: {
-              marginLeft: 20,
-              fontSize: 12
-            },
-            children: checkBox.checkboxDescription
-          })]
-        });
-      }), /*#__PURE__*/jsxRuntime.jsx(ButtonContainer, {
-        children: /*#__PURE__*/jsxRuntime.jsxs(Flex, {
-          justifyContent: "space-between",
-          children: [/*#__PURE__*/jsxRuntime.jsx(Button$1, {
-            $white: true,
-            size: "md",
-            variant: "secondary",
-            onClick: function onClick() {
-              return onClickHandler(false);
-            },
-            $fullWidth: true,
-            children: t("Decline")
-          }), /*#__PURE__*/jsxRuntime.jsx(Space, {}), /*#__PURE__*/jsxRuntime.jsx(Button$1, {
-            disabled: _.some(checkBoxes, {
-              isChecked: false
-            }),
-            size: "md",
-            variant: "primary",
-            onClick: function onClick() {
-              return onClickHandler(true);
-            },
-            $fullWidth: true,
-            children: t("Agree")
-          })]
-        })
-      })]
-    })
-  });
-};
-
-var useDisclaimerModal = function useDisclaimerModal(_ref) {
-  var checkBoxesArray = _ref.checkBoxesArray,
-    _onResolve = _ref.onResolve,
-    translations = _ref.translations;
-  var _useModal = useModal(/*#__PURE__*/jsxRuntime.jsx(DiclaimerModal, {
-      translations: translations,
-      onResolve: function onResolve(res) {
-        return _onResolve(res);
-      },
-      checkBoxesArray: checkBoxesArray
-    }), false),
-    _useModal2 = _slicedToArray(_useModal, 2),
-    onPresentDisclaimerModal = _useModal2[0],
-    onDismiss = _useModal2[1];
-  return {
-    onPresentDisclaimerModal: onPresentDisclaimerModal,
-    onDismiss: onDismiss
-  };
-};
-
-var Disclaimer = {
-  checkBox: "By checking this box, you agree that CoinSwap.space is not liable for any financial losses you might incur as a direct or indirect result of investing in any of the pools on the platform."
-};
-
-var useDisclaimer = function useDisclaimer(_ref) {
-  var handleLogin = _ref.handleLogin,
-    translations = _ref.translations,
-    setIsConnectWalletPanelOpen = _ref.setIsConnectWalletPanelOpen;
-  var _useWeb3React = core.useWeb3React(),
-    account = _useWeb3React.account;
-  // Note: deactivate is not available in newer versions of @web3-react/core
-  var deactivate = function deactivate() {}; // Placeholder - implement disconnect logic if needed
-  var _useCookies = useCookies(exports.Cookies.Disclaimer),
-    _useCookies2 = _slicedToArray(_useCookies, 2),
-    disclaimer = _useCookies2[0],
-    setDisclaimer = _useCookies2[1];
-  var _useState = React.useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    inProgress = _useState2[0],
-    setInProgress = _useState2[1];
-  var _useWalletModal = useWalletModal(handleLogin, deactivate, account, translations),
-    onPresentConnectModal = _useWalletModal.onPresentConnectModal;
-  var _useDisclaimerModal = useDisclaimerModal({
-      checkBoxesArray: [{
-        isChecked: false,
-        checkboxDescription: Disclaimer.checkBox
-      }],
-      onResolve: function onResolve(res) {
-        return _onResolve(res);
-      },
-      translations: translations
-    }),
-    onPresentDisclaimerModal = _useDisclaimerModal.onPresentDisclaimerModal;
-  function _onResolve(res) {
-    setDisclaimer(exports.Cookies.Disclaimer, res.toString());
-    setInProgress(false);
-    if (res) {
-      onPresentConnectModal();
-    }
-  }
-  var callback = React.useCallback(function () {
-    var disclaimerAccepted = disclaimer === "true";
-    if (!inProgress && !disclaimerAccepted) {
-      setInProgress(true);
-      onPresentDisclaimerModal();
-    }
-    if (disclaimerAccepted) {
-      if (setIsConnectWalletPanelOpen) {
-        setIsConnectWalletPanelOpen(true);
-      } else onPresentConnectModal();
-    }
-  }, [disclaimer, inProgress, setIsConnectWalletPanelOpen, onPresentDisclaimerModal, onPresentConnectModal]);
-  return {
-    callback: callback
-  };
-};
-
-var useAutoDisclaimer = function useAutoDisclaimer(_ref) {
-  var login = _ref.login,
-    translations = _ref.translations,
-    title = _ref.title;
-  var _useCookies = useCookies(exports.Cookies.Disclaimer),
-    _useCookies2 = _slicedToArray(_useCookies, 3),
-    disclaimer = _useCookies2[0],
-    setDisclaimer = _useCookies2[1],
-    disclaimerConnector = _useCookies2[2];
-  var _useState = React.useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    inProgress = _useState2[0],
-    setInProgress = _useState2[1];
-  function _onResolve(res) {
-    setDisclaimer(exports.Cookies.Disclaimer, res.toString());
-  }
-  var _useDisclaimerModal = useDisclaimerModal({
-      checkBoxesArray: [{
-        isChecked: false,
-        checkboxDescription: Disclaimer.checkBox
-      }],
-      onResolve: function onResolve(res) {
-        return _onResolve(res);
-      },
-      translations: translations
-    }),
-    onPresentDisclaimerModal = _useDisclaimerModal.onPresentDisclaimerModal;
-  React.useEffect(function () {
-    var disclaimerAccepted = disclaimer === "true";
-    if (!inProgress && !disclaimerAccepted) {
-      setInProgress(true);
-      onPresentDisclaimerModal();
-    }
-    if (disclaimerAccepted) {
-      var connectorId = disclaimerConnector;
-      if (connectorId && connectorId !== exports.ConnectorNames.BSC) {
-        login(connectorId, title);
-      }
-    }
-  }, [disclaimer, disclaimerConnector, inProgress, login, onPresentDisclaimerModal, title]);
-};
-
 var _templateObject$c, _templateObject2$9, _templateObject3$8, _templateObject4$7, _templateObject5$5;
+var useWalletModal = null;
+var useDisclaimer = null;
+var VerifiedWalletIcon = null;
+try {
+  // eslint-disable-next-line @typescript-eslint/no-require-imports
+  var walletModal = require("../../WalletModal");
+  useWalletModal = walletModal.useWalletModal;
+  // eslint-disable-next-line @typescript-eslint/no-require-imports
+  var disclaimerModal = require("../../DisclaimerModal");
+  useDisclaimer = disclaimerModal.useDisclaimer;
+  // eslint-disable-next-line @typescript-eslint/no-require-imports
+  var connectVerifyPanel = require("../../ConnectVerifyPanel/components");
+  VerifiedWalletIcon = connectVerifyPanel.VerifiedWalletIcon;
+} catch (e) {
+  // @web3-react/core is not available - wallet functionality will be disabled
+  console.warn("@web3-react/core is not available. Wallet features in Menu will be disabled.");
+}
 var UserBlockWrapper = styledComponents.styled.div.withConfig({
   displayName: "UserBlockWrapper",
   componentId: "sc-1speva4-0"
@@ -18804,6 +18401,7 @@ var Account = styledComponents.styled(Text).withConfig({
   return theme.mediaQueries.mobile;
 });
 var UserBlock = function UserBlock(_ref8) {
+  var _useWalletModal, _useDisclaimer;
   var handleLogin = _ref8.handleLogin,
     account = _ref8.account,
     login = _ref8.login,
@@ -18812,36 +18410,35 @@ var UserBlock = function UserBlock(_ref8) {
     setIsConnectWalletPanelOpen = _ref8.setIsConnectWalletPanelOpen,
     isUserVerified = _ref8.isUserVerified;
   var t = translations || getTranslations;
-  var _useWalletModal = useWalletModal(login, logout, account, translations);
-    _useWalletModal.onPresentAccountModal;
+  // Only use wallet hooks if available
+  useWalletModal ? (_useWalletModal = useWalletModal(login, logout, account, translations)) === null || _useWalletModal === void 0 ? void 0 : _useWalletModal.onPresentAccountModal : null;
   var accountEllipsis = account ? "".concat(account.substring(0, 4), "...").concat(account.substring(account.length - 4)) : null;
-  var _useDisclaimer = useDisclaimer({
-      handleLogin: handleLogin,
-      translations: translations,
-      setIsConnectWalletPanelOpen: setIsConnectWalletPanelOpen
-    });
-    _useDisclaimer.callback;
+  useDisclaimer ? (_useDisclaimer = useDisclaimer({
+    handleLogin: handleLogin,
+    translations: translations,
+    setIsConnectWalletPanelOpen: setIsConnectWalletPanelOpen
+  })) === null || _useDisclaimer === void 0 ? void 0 : _useDisclaimer.callback : null;
   return /*#__PURE__*/jsxRuntime.jsx(UserBlockWrapper, {
     children: account ? /*#__PURE__*/jsxRuntime.jsxs(AccountButton, {
-      isUserVerified: isUserVerified,
+      isUserVerified: isUserVerified || false,
       variant: "tertiary",
       onClick: function onClick() {
-        setIsConnectWalletPanelOpen(true);
+        setIsConnectWalletPanelOpen === null || setIsConnectWalletPanelOpen === void 0 || setIsConnectWalletPanelOpen(true);
       },
-      children: [isUserVerified ? /*#__PURE__*/jsxRuntime.jsx(VerifiedWalletIcon, {
+      children: [isUserVerified && VerifiedWalletIcon ? /*#__PURE__*/jsxRuntime.jsx(VerifiedWalletIcon, {
         $opac: true
       }) : /*#__PURE__*/jsxRuntime.jsx(VerifyAddressIndicator, {
         fontSize: "12px",
         fontWeight: 500,
         children: "Login with Web3"
       }), /*#__PURE__*/jsxRuntime.jsx(Account, {
-        isUserVerified: isUserVerified,
+        isUserVerified: isUserVerified || false,
         fontSize: "14px",
         children: accountEllipsis
       })]
     }) : /*#__PURE__*/jsxRuntime.jsx(ConnectButton, {
       onClick: function onClick() {
-        setIsConnectWalletPanelOpen(true);
+        setIsConnectWalletPanelOpen === null || setIsConnectWalletPanelOpen === void 0 || setIsConnectWalletPanelOpen(true);
       },
       children: t("Connect wallet")
     })
@@ -20383,7 +19980,6 @@ exports.alertVariants = variants$3;
 exports.baseColors = baseColors;
 exports.byTextAscending = byTextAscending;
 exports.byTextDescending = byTextDescending;
-exports.connectorLocalStorageKey = connectorLocalStorageKey$1;
 exports.dark = darkTheme;
 exports.darkColors = darkColors;
 exports.escapeRegExp = escapeRegExp;
@@ -20399,11 +19995,8 @@ exports.menuLinks = menuLinks;
 exports.moveUsercomWidget = moveUsercomWidget;
 exports.socials = socials;
 exports.toastTypes = types;
-exports.useAutoDisclaimer = useAutoDisclaimer;
 exports.useConnectWalletEvent = useConnectWalletEvent;
 exports.useCookies = useCookies;
-exports.useDisclaimer = useDisclaimer;
-exports.useDisclaimerModal = useDisclaimerModal;
 exports.useIdoExtensionsModal = useIdoExtensionsModal;
 exports.useMatchBreakpoints = useMatchBreakpoints;
 exports.useMenuConfig = useMenuConfig;
@@ -20414,6 +20007,5 @@ exports.useParticleBurst = useParticleBurst;
 exports.useTable = useTable;
 exports.useVerificationModal = useVerificationModal;
 exports.useVoting = useVoting;
-exports.useWalletModal = useWalletModal;
 exports.useWindowSize = useWindowSize;
 exports.verifyWallet = verifyWallet;