pixel-react 1.1.7 → 1.1.9

package/lib/index.js

@@ -48,11 +48,11 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z$T = ":root {\n  --tooltip-bg-color: #1e161f;\n  --status-approved-text-color: #016102;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-text-color: #3c3838;\n  --status-approved-bg-color: #c6efcd;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-warning-bg-color: #fae2c6;\n  --status-skipped-bg-color: #c4c3c3;\n  --brand-color: #71347b;\n  --icons-default-color: #71347b;\n  --default-icon-color: #a3a3a3;\n  --default-color: #747474;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --system-color--error: #c50303;\n  --hover-color: #f7ebff;\n  --brand2-color: #610b86;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --description-text-color: #d9d9d9;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --text-color: #1e161f;\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --error-light: #e42525;\n  --tabs-label-default-color: tabs-label-default-color;\n  --tabs-label-active-color: tabs-label-active-color;\n  --tabs-border-color: tabs-border-color;\n  --tabs-bg-color: tabs-bg-color;\n  --tab-bg-color: tab-bg-color;\n  --toggle-button-bg-color: #ffffff;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-strip-color: #cfd1e2;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --toggle-strip-color: #cfd1e2;\n  --add-icon-hover-color: #431b4a;\n  --arrows-button-border-color: #ded1e5;\n  --arrow-button-bg-color: #ffffff;\n  --text-bg-highlight: #f5fb00;\n  --slider-table-color: #efe1f9;\n  --button-close-color: button-close-color;\n  --button-bg-color: button-bg-color;\n}\n\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-button, .ff-button--small, .ff-button--medium {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd, .ff-button--large {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-button {\n  width: auto;\n  background-color: #ffffff;\n  border-radius: 4px;\n  padding: 4px 8px;\n  text-align: center;\n  text-decoration: none;\n  font-weight: 500;\n  cursor: pointer;\n  display: flex;\n  gap: 4px;\n  justify-content: center;\n  align-items: center;\n  border: 2px solid transparent;\n}\n.ff-button--transparent {\n  background-color: transparent;\n}\n.ff-button--primary, .ff-button--delete, .ff-button--secondary {\n  position: relative;\n  cursor: pointer;\n  border-radius: 4px;\n  z-index: 1;\n  border: none;\n  overflow: hidden;\n}\n.ff-button--primary:before, .ff-button--delete:before, .ff-button--secondary:before {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  border-radius: 4px;\n  padding: 0.6px;\n  background: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  mask: linear-gradient(#ffffff 0 0) content-box, linear-gradient(#ffffff 0 0);\n  mask-composite: exclude;\n  -webkit-mask: linear-gradient(#ffffff 0 0) content-box, linear-gradient(#ffffff 0 0);\n  -webkit-mask-composite: destination-out;\n  z-index: -1;\n}\n.ff-button--primary:hover, .ff-button--delete:hover, .ff-button--secondary:hover {\n  background: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n}\n.ff-button--primary:disabled, .ff-button--delete:disabled, .ff-button--secondary:disabled {\n  opacity: 50%;\n  cursor: no-drop;\n}\n.ff-button--primary:disabled:before, .ff-button--delete:disabled:before, .ff-button--secondary:disabled:before {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  border-radius: 4px;\n  padding: 0.6px;\n  -webkit-mask-composite: destination-out;\n  mask-composite: exclude;\n  z-index: -1;\n}\n.ff-button--primary {\n  background: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n}\n.ff-button--primary:before {\n  background: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n}\n.ff-button--primary:hover {\n  background: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n}\n.ff-button--delete {\n  background: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n  color: #ffffff;\n}\n.ff-button--delete:before {\n  background: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n}\n.ff-button--delete:hover {\n  background: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n}\n.ff-button--warning {\n  background: var(--warning-button-color);\n  border: var(--warning-button-border);\n}\n.ff-button--secondary:before {\n  background: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n}\n.ff-button--secondary:hover {\n  background: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n}\n.ff-button--tertiary {\n  border: none;\n  background: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n}\n.ff-button--tertiary:hover {\n  background: linear-gradient(179.06deg, rgba(113, 52, 123, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n}\n.ff-button--tertiary:disabled {\n  opacity: 0.5;\n  cursor: no-drop;\n}\n.ff-button--small {\n  font-weight: 500;\n  padding: 4.5px 8px;\n}\n.ff-button--medium {\n  font-weight: 500;\n  padding: 6px 12px;\n}\n.ff-button--large {\n  padding: 8px 16px;\n}\n.ff-button-primary--text {\n  color: #ffffff;\n}\n.ff-button-secondary--text, .ff-button-tertiary--text {\n  background: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n  -webkit-background-clip: text;\n  background-clip: text;\n  color: transparent;\n}";
-styleInject(css_248z$T);
+var css_248z$V = ":root {\n  --tooltip-bg-color: #1e161f;\n  --status-approved-text-color: #016102;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-text-color: #3c3838;\n  --status-approved-bg-color: #c6efcd;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-warning-bg-color: #fae2c6;\n  --status-skipped-bg-color: #c4c3c3;\n  --brand-color: #71347b;\n  --icons-default-color: #71347b;\n  --default-icon-color: #a3a3a3;\n  --default-color: #747474;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --system-color--error: #c50303;\n  --hover-color: #f7ebff;\n  --brand2-color: #610b86;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --description-text-color: #d9d9d9;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --text-color: #1e161f;\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --error-light: #e42525;\n  --tabs-label-default-color: tabs-label-default-color;\n  --tabs-label-active-color: tabs-label-active-color;\n  --tabs-border-color: tabs-border-color;\n  --tabs-bg-color: tabs-bg-color;\n  --tab-bg-color: tab-bg-color;\n  --toggle-button-bg-color: #ffffff;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-strip-color: #cfd1e2;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --toggle-strip-color: #cfd1e2;\n  --add-icon-hover-color: #431b4a;\n  --arrows-button-border-color: #ded1e5;\n  --arrow-button-bg-color: #ffffff;\n  --text-bg-highlight: #f5fb00;\n  --slider-table-color: #efe1f9;\n  --button-close-color: button-close-color;\n  --button-bg-color: button-bg-color;\n}\n\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-button, .ff-button--small, .ff-button--medium {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd, .ff-button--large {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-button {\n  width: auto;\n  background-color: #ffffff;\n  border-radius: 4px;\n  padding: 4px 8px;\n  text-align: center;\n  text-decoration: none;\n  font-weight: 500;\n  cursor: pointer;\n  display: flex;\n  gap: 4px;\n  justify-content: center;\n  align-items: center;\n  border: 2px solid transparent;\n}\n.ff-button--transparent {\n  background-color: transparent;\n}\n.ff-button--primary, .ff-button--delete, .ff-button--secondary {\n  position: relative;\n  cursor: pointer;\n  border-radius: 4px;\n  z-index: 1;\n  border: none;\n  overflow: hidden;\n}\n.ff-button--primary:before, .ff-button--delete:before, .ff-button--secondary:before {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  border-radius: 4px;\n  padding: 0.6px;\n  background: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  mask: linear-gradient(#ffffff 0 0) content-box, linear-gradient(#ffffff 0 0);\n  mask-composite: exclude;\n  -webkit-mask: linear-gradient(#ffffff 0 0) content-box, linear-gradient(#ffffff 0 0);\n  -webkit-mask-composite: destination-out;\n  z-index: -1;\n}\n.ff-button--primary:hover, .ff-button--delete:hover, .ff-button--secondary:hover {\n  background: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n}\n.ff-button--primary:disabled, .ff-button--delete:disabled, .ff-button--secondary:disabled {\n  opacity: 50%;\n  cursor: no-drop;\n}\n.ff-button--primary:disabled:before, .ff-button--delete:disabled:before, .ff-button--secondary:disabled:before {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  border-radius: 4px;\n  padding: 0.6px;\n  -webkit-mask-composite: destination-out;\n  mask-composite: exclude;\n  z-index: -1;\n}\n.ff-button--primary {\n  background: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n}\n.ff-button--primary:before {\n  background: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n}\n.ff-button--primary:hover {\n  background: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n}\n.ff-button--delete {\n  background: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n  color: #ffffff;\n}\n.ff-button--delete:before {\n  background: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n}\n.ff-button--delete:hover {\n  background: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n}\n.ff-button--warning {\n  background: var(--warning-button-color);\n  border: var(--warning-button-border);\n}\n.ff-button--secondary:before {\n  background: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n}\n.ff-button--secondary:hover {\n  background: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n}\n.ff-button--tertiary {\n  border: none;\n  background: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n}\n.ff-button--tertiary:hover {\n  background: linear-gradient(179.06deg, rgba(113, 52, 123, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n}\n.ff-button--tertiary:disabled {\n  opacity: 0.5;\n  cursor: no-drop;\n}\n.ff-button--small {\n  font-weight: 500;\n  padding: 4.5px 8px;\n}\n.ff-button--medium {\n  font-weight: 500;\n  padding: 6px 12px;\n}\n.ff-button--large {\n  padding: 8px 16px;\n}\n.ff-button-primary--text {\n  color: #ffffff;\n}\n.ff-button-secondary--text, .ff-button-tertiary--text {\n  background: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n  -webkit-background-clip: text;\n  background-clip: text;\n  color: transparent;\n}";
+styleInject(css_248z$V);
 
-var css_248z$S = ":root {\n  --tooltip-bg-color: #1e161f;\n  --status-approved-text-color: #016102;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-text-color: #3c3838;\n  --status-approved-bg-color: #c6efcd;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-warning-bg-color: #fae2c6;\n  --status-skipped-bg-color: #c4c3c3;\n  --brand-color: #71347b;\n  --icons-default-color: #71347b;\n  --default-icon-color: #a3a3a3;\n  --default-color: #747474;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --system-color--error: #c50303;\n  --hover-color: #f7ebff;\n  --brand2-color: #610b86;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --description-text-color: #d9d9d9;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --text-color: #1e161f;\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --error-light: #e42525;\n  --tabs-label-default-color: tabs-label-default-color;\n  --tabs-label-active-color: tabs-label-active-color;\n  --tabs-border-color: tabs-border-color;\n  --tabs-bg-color: tabs-bg-color;\n  --tab-bg-color: tab-bg-color;\n  --toggle-button-bg-color: #ffffff;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-strip-color: #cfd1e2;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --toggle-strip-color: #cfd1e2;\n  --add-icon-hover-color: #431b4a;\n  --arrows-button-border-color: #ded1e5;\n  --arrow-button-bg-color: #ffffff;\n  --text-bg-highlight: #f5fb00;\n  --slider-table-color: #efe1f9;\n  --button-close-color: button-close-color;\n  --button-bg-color: button-bg-color;\n}";
-styleInject(css_248z$S);
+var css_248z$U = ":root {\n  --tooltip-bg-color: #1e161f;\n  --status-approved-text-color: #016102;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-text-color: #3c3838;\n  --status-approved-bg-color: #c6efcd;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-warning-bg-color: #fae2c6;\n  --status-skipped-bg-color: #c4c3c3;\n  --brand-color: #71347b;\n  --icons-default-color: #71347b;\n  --default-icon-color: #a3a3a3;\n  --default-color: #747474;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --system-color--error: #c50303;\n  --hover-color: #f7ebff;\n  --brand2-color: #610b86;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --description-text-color: #d9d9d9;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --text-color: #1e161f;\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --error-light: #e42525;\n  --tabs-label-default-color: tabs-label-default-color;\n  --tabs-label-active-color: tabs-label-active-color;\n  --tabs-border-color: tabs-border-color;\n  --tabs-bg-color: tabs-bg-color;\n  --tab-bg-color: tab-bg-color;\n  --toggle-button-bg-color: #ffffff;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-strip-color: #cfd1e2;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --toggle-strip-color: #cfd1e2;\n  --add-icon-hover-color: #431b4a;\n  --arrows-button-border-color: #ded1e5;\n  --arrow-button-bg-color: #ffffff;\n  --text-bg-highlight: #f5fb00;\n  --slider-table-color: #efe1f9;\n  --button-close-color: button-close-color;\n  --button-bg-color: button-bg-color;\n}";
+styleInject(css_248z$U);
 
 function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
@@ -215,6 +215,40 @@ const SvgDetails = (props) => /* @__PURE__ */ React__namespace.createElement("sv
 
 const SvgImpactList = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 17 13", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M5.59083 0.184937H1.22727C0.825606 0.184937 0.500015 0.510527 0.500015 0.912192V5.27575C0.500015 5.67742 0.825606 6.00301 1.22727 6.00301H5.59083C5.9925 6.00301 6.31809 5.67742 6.31809 5.27575V0.912192C6.31809 0.510527 5.9925 0.184937 5.59083 0.184937ZM4.86358 4.5485H1.95453V1.63945H4.86358V4.5485Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M15.7725 2.3667H8.49988C8.09822 2.3667 7.77263 2.69229 7.77263 3.09395C7.77263 3.49562 8.09822 3.82121 8.49988 3.82121H15.7725C16.1742 3.82121 16.4998 3.49562 16.4998 3.09395C16.4998 2.69232 16.1741 2.3667 15.7725 2.3667Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M15.7725 9.63934H8.49988C8.09822 9.63934 7.77263 9.96496 7.77263 10.3666C7.77263 10.7682 8.09822 11.0939 8.49988 11.0939H15.7725C16.1742 11.0939 16.4998 10.7682 16.4998 10.3666C16.4998 9.96496 16.1741 9.63934 15.7725 9.63934Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M5.08175 8.39496L2.66071 10.7869L1.75018 9.8415C1.47083 9.55271 1.01026 9.54505 0.721464 9.8244C0.432666 10.1037 0.425011 10.5643 0.704359 10.8531L2.12542 12.3302C2.26093 12.4684 2.446 12.547 2.6396 12.5484H2.64833C2.839 12.5478 3.02183 12.4723 3.15741 12.3382L6.09992 9.42913C6.40434 9.16714 6.43874 8.70792 6.17675 8.4035C5.91475 8.09908 5.45554 8.06468 5.15112 8.32667C5.12651 8.34787 5.10333 8.37068 5.08175 8.39496Z", fill: "currentColor" }));
 
+const SvgFormatePainter = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M0 1.6C0 0.716352 0.691648 0 1.54483 0H11.8952C12.7484 0 13.44 0.716352 13.44 1.6V4C13.44 4.88365 12.7484 5.6 11.8952 5.6H1.54483C0.691648 5.6 0 4.88365 0 4V1.6Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M5.43994 10.0104C5.43994 9.60702 5.71215 9.28 6.04794 9.28H7.87194C8.20773 9.28 8.47994 9.60702 8.47994 10.0104V15.2696C8.47994 15.673 8.20773 16 7.87194 16H6.04794C5.71215 16 5.43994 15.673 5.43994 15.2696V10.0104Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M14.0801 3.44H14.5601C14.6484 3.44 14.7201 3.51164 14.7201 3.6V6.56C14.7201 6.64837 14.6484 6.72 14.5601 6.72H7.80011C7.00481 6.72 6.36011 7.36471 6.36011 8.16V8.64H7.64011V8.16C7.64011 8.07164 7.71174 8 7.80011 8H14.5601C15.3555 8 16.0001 7.3553 16.0001 6.56V3.6C16.0001 2.80471 15.3555 2.16 14.5601 2.16H14.0801V3.44Z", fill: "currentColor" }));
+
+const SvgBold = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M0.818604 16V0H6.31318C8.29833 0 9.84792 0.368169 10.9615 1.10442C12.0749 1.84058 12.6318 2.93777 12.6318 4.39562C12.6318 5.15763 12.4524 5.83496 12.0934 6.42867C11.7344 7.0222 11.1813 7.46905 10.434 7.7693C11.3717 7.9817 12.0639 8.40843 12.5109 9.04951C12.9576 9.69059 13.1813 10.4288 13.1813 11.2638C13.1813 12.8243 12.6574 14.0038 11.61 14.8022C10.5622 15.6009 9.06051 16 7.10429 16H0.818604ZM4.54395 6.67035H6.39009C7.23254 6.65571 7.86268 6.4927 8.28033 6.18125C8.6979 5.86997 8.90677 5.41395 8.90677 4.81319C8.90677 4.1318 8.69419 3.63565 8.26948 3.32419C7.84433 3.01292 7.19241 2.85715 6.31326 2.85715H4.54395V6.67035ZM4.54395 9.13198V13.1429H7.10429C7.89558 13.1429 8.48902 12.9872 8.88463 12.6757C9.28014 12.3644 9.47816 11.8865 9.47816 11.2419C9.47816 10.5458 9.30775 10.0202 8.96701 9.66483C8.62645 9.30963 8.07517 9.13198 7.31334 9.13198H4.54395Z", fill: "currentColor" }));
+
+const SvgItalic = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 10 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M8.46841 0H3.90172C3.17467 0 2.58507 0.589598 2.58507 1.31666C2.58507 2.04371 3.17467 2.63331 3.90172 2.63331H4.74886L2.52345 13.3443C2.52187 13.3519 2.52266 13.3591 2.52134 13.3667H1.53174C0.804686 13.3667 0.215088 13.956 0.215088 14.6833C0.215088 15.4107 0.804686 16 1.53174 16H6.09843C6.82575 16 7.41509 15.4107 7.41509 14.6833C7.41509 13.956 6.82575 13.3667 6.09843 13.3667H5.20337L7.43299 2.63331H8.46841C9.19573 2.63331 9.78507 2.04371 9.78507 1.31666C9.78507 0.589598 9.19573 0 8.46841 0Z", fill: "currentColor" }));
+
+const SvgStrikeThrough = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M6.58881 6.00047H13.9846V7.99607H10.0733C10.3988 8.20068 10.6794 8.38777 10.8762 8.54174C11.3946 8.94907 11.8 9.43237 12.0904 9.99167C12.3788 10.5529 12.525 11.1376 12.525 11.7476C12.525 12.8896 12.0748 13.8855 11.1744 14.7313C10.276 15.5771 9.11839 16 7.70354 16C7.267 16 6.84798 15.9668 6.44849 15.8986C6.22436 15.8694 5.73911 15.733 4.99856 15.4933C4.25604 15.2516 3.79222 15.1308 3.6032 15.1308C3.42973 15.1308 3.27969 15.1873 3.153 15.3004C3.0458 15.4134 2.96784 15.6472 2.91524 16H1.99929V10.7498H2.91524C3.01268 11.2915 3.12572 11.769 3.25434 12.1841C3.38103 12.5972 3.53304 12.9441 3.70453 13.2228C4.03584 13.7724 4.5406 14.2265 5.21879 14.5831C5.89699 14.9417 6.64534 15.1191 7.46581 15.1191C8.39152 15.1191 9.13208 14.8696 9.68555 14.3687C10.2371 13.8698 10.5138 13.2852 10.5138 12.6148C10.5138 12.2465 10.4125 11.8703 10.2098 11.4864C10.0071 11.1025 9.68361 10.742 9.23925 10.4029C8.96055 10.1924 8.15763 9.71491 6.83242 8.97046C6.2088 8.6177 5.65923 8.29226 5.18175 7.99604H0.0153809V6.00044H2.94253C2.89186 5.92052 2.82363 5.84646 2.77882 5.76461C2.49429 5.23843 2.35008 4.65961 2.35008 4.02819C2.35008 2.93684 2.77103 1.99361 3.61489 1.19652C4.45872 0.397562 5.53057 0 6.83239 0C7.66066 0 8.52398 0.196848 9.41851 0.590512C9.60756 0.672362 9.78296 0.738623 9.94469 0.791257C10.1065 0.843891 10.2292 0.86921 10.3111 0.86921C10.5001 0.86921 10.658 0.812678 10.7866 0.701611C10.9133 0.590512 11.0146 0.356652 11.0906 3.11809e-05H12.0066V5.28333H11.0906C11.0224 4.78053 10.9288 4.3284 10.808 3.92694C10.6872 3.52548 10.5371 3.1708 10.3559 2.86288C10.0168 2.27044 9.52178 1.79492 8.87087 1.43827C8.21996 1.08162 7.54956 0.902325 6.85578 0.902325C6.07235 0.902325 5.42534 1.14205 4.91474 1.61949C4.40218 2.09697 4.14494 2.64068 4.14494 3.25068C4.14494 3.70867 4.30671 4.13352 4.63215 4.52522C4.94982 4.91692 5.61439 5.41385 6.58881 6.00047Z", fill: "currentColor" }));
+
+const SvgUnderline = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M7.00008 12.4445C9.94675 12.4445 12.3334 10.0578 12.3334 7.11113V0H10.1112V7.11113C10.1112 8.83113 8.72008 10.2222 7.00008 10.2222C5.28008 10.2222 3.88896 8.83113 3.88896 7.11113V0H1.66675V7.11113C1.66675 10.0578 4.05341 12.4445 7.00008 12.4445Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M13.2223 14.2222H0.777832V16H13.2223V14.2222Z", fill: "currentColor" }));
+
+const SvgDoubleUnderline = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M6.99998 12.1081C9.867 12.1081 12.1892 9.78589 12.1892 6.91887V-6.10352e-05H10.027V6.91887C10.027 8.59238 8.67349 9.9459 6.99998 9.9459C5.32646 9.9459 3.97294 8.59238 3.97294 6.91887V-6.10352e-05H1.81079V6.91887C1.81079 9.78589 4.13295 12.1081 6.99998 12.1081Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M13.0542 15.027H0.946045V15.9999H13.0542V15.027Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M13.0542 13.081H0.946045V14.054H13.0542V13.081Z", fill: "currentColor" }));
+
+const SvgAllBorders = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.470617 8.23998V15.5294H7.76471V8.23998H0.470617ZM8.2353 8.23998V8.94118H8.23531V9.41176H8.2353V10.1176H8.23531V10.5882H8.2353V11.2941H8.23531V11.7647H8.2353V12.4706H8.23531V12.9412H8.2353V13.6471H8.23531V14.1176H8.2353V14.5882H8.23531V15.0588H8.2353V15.5294H15.5294V15.0588L15.5294 8.23998H8.2353ZM8.2353 16H7.76472H7.29412V16H7.05884V16H6.58825V16H5.88237V16H5.41178V16H4.7059V16H4.23531V16H3.52943V16H3.05884V16H2.35296V16H1.88237V16H0.941205V16H0.941191H0.941176H2.85506e-05H1.43051e-05H0V0H2.85506e-05H0.941176H0.941205H1.88237H2.35296H3.05884H3.52943H4.23531H4.7059H5.41178H5.88237H6.58825H7.05884H7.29412H7.76472H8.23531H8.94119H9.41178H10.1177H10.5883H11.2941H11.7647H12.4706H12.9412H13.6471H14.1177H15.0588L16 7.62939e-06V0.941184L16 7.29881V8.23998V15.0588V16L16 16H15.0588V16H14.1177V16H13.6471V16H12.9412V16H12.4706V16H11.7647V16H11.2941V16H10.5883V16H10.1177V16H9.41178V16H8.94119V16H8.23531V16H8.2353ZM8.2353 0.470588H15.0588H15.5294L15.5294 7.29881V7.76939H15.0588V7.76471H14.5882V7.76939H14.1177V7.76471H13.6471V7.76939H12.9412V7.76471H12.4706V7.76939H11.7647V7.76471H11.2941V7.76939H10.5883V7.76471H10.1177V7.76939H9.41178V7.76471H8.94119V7.76939H8.23531V7.76471H8.2353V7.05882H8.23531V6.58823H8.2353V5.88235H8.23531V5.41176H8.2353V4.70588H8.23531V4.23529H8.2353V3.52941H8.23531V3.05882H8.2353V2.35294H8.23531V1.88235H8.2353V1.41177H8.23531V0.941176H8.2353V0.470588ZM7.76471 0.470588V7.76939H7.05884V7.76471H6.58825V7.76939H5.88237V7.76471H5.41178V7.76939H4.7059V7.76471H4.23531V7.76939H3.52943V7.76471H3.05884V7.76939H2.35296V7.76471H1.88237V7.76939H1.41178V7.76471H0.941191V7.76939H0.470617V0.470589L7.29412 0.470588H7.76471Z", fill: "currentColor" }));
+
+const SvgBorderBottom = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.470588 0.470588H0.941176V0H0V0.941176H0.470588V0.470588ZM7.76471 0.941176H8.23529V1.41176H7.76471V0.941176ZM8.23529 1.88235H7.76471V2.35294H8.23529V1.88235ZM7.76471 3.05882H8.23529V3.52941H7.76471V3.05882ZM8.23529 4.23529H7.76471V4.70588H8.23529V4.23529ZM7.76471 8.94118H8.23529V9.41177H7.76471V8.94118ZM8.23529 10.1176H7.76471V10.5882H8.23529V10.1176ZM7.76471 11.2941H8.23529V11.7647H7.76471V11.2941ZM7.76471 13.6471H8.23529V14.1176H7.76471V13.6471ZM8.23529 14.5882H7.76471V15.0588H8.23529V14.5882ZM7.76471 12.4706H8.23529V12.9412H7.76471V12.4706ZM7.76471 6.58824H8.23529V7.05882H7.76471V6.58824ZM8.23529 5.41176H7.76471V5.88235H8.23529V5.41176ZM8.23529 7.76471H7.76471V8.23529H8.23529V7.76471ZM4.23529 7.76471H4.70588V8.23529H4.23529V7.76471ZM2.35294 7.76471H1.88235V8.23529H2.35294V7.76471ZM0.941176 7.76471H1.41176V8.23529H0.941176V7.76471ZM3.52941 7.76471H3.05882V8.23529H3.52941V7.76471ZM5.41176 7.76471H5.88235V8.23529H5.41176V7.76471ZM7.05882 7.76471H6.58824V8.23529H7.05882V7.76471ZM11.2941 7.76471H11.7647V8.23529H11.2941V7.76471ZM9.41177 7.76471H8.94118V8.23529H9.41177V7.76471ZM10.1176 7.76471H10.5882V8.23529H10.1176V7.76471ZM12.9412 7.76471H12.4706V8.23529H12.9412V7.76471ZM13.6471 7.76471H14.1176V8.23529H13.6471V7.76471ZM15.0588 7.76471H14.5882V8.23529H15.0588V7.76471ZM11.7647 0H11.2941V0.470588H11.7647V0ZM13.6471 0H14.1176V0.470588H13.6471V0ZM12.9412 0H12.4706V0.470588H12.9412V0ZM10.1176 0H10.5882V0.470588H10.1176V0ZM9.41177 0H8.94118V0.470588H9.41177V0ZM4.23529 0H4.70588V0.470588H4.23529V0ZM7.05882 0H6.58824V0.470588H7.05882V0ZM5.41176 0H5.88235V0.470588H5.41176V0ZM3.52941 0H3.05882V0.470588H3.52941V0ZM1.88235 0H2.35294V0.470588H1.88235V0ZM8.23529 0H7.76471V0.470588H8.23529V0ZM15.5294 11.2941H16V11.7647H15.5294V11.2941ZM16 13.6471H15.5294V14.1176H16V13.6471ZM15.5294 12.4706H16V12.9412H15.5294V12.4706ZM16 10.1176H15.5294V10.5882H16V10.1176ZM15.5294 8.94118H16V9.41177H15.5294V8.94118ZM16 4.23529H15.5294V4.70588H16V4.23529ZM15.5294 6.58824H16V7.05882H15.5294V6.58824ZM16 5.41176H15.5294V5.88235H16V5.41176ZM15.5294 3.05882H16V3.52941H15.5294V3.05882ZM16 1.88235H15.5294V2.35294H16V1.88235ZM15.5294 7.76471H16V8.23529H15.5294V7.76471ZM0.470588 11.2941H0V11.7647H0.470588V11.2941ZM0 13.6471H0.470588V14.1176H0V13.6471ZM0.470588 12.4706H0V12.9412H0.470588V12.4706ZM0 10.1176H0.470588V10.5882H0V10.1176ZM0.470588 8.94118H0V9.41177H0.470588V8.94118ZM0 4.23529H0.470588V4.70588H0V4.23529ZM0.470588 6.58824H0V7.05882H0.470588V6.58824ZM0 5.41176H0.470588V5.88235H0V5.41176ZM0.470588 3.05882H0V3.52941H0.470588V3.05882ZM0 1.88235H0.470588V2.35294H0V1.88235ZM0.470588 7.76471H0V8.23529H0.470588V7.76471ZM15.0588 0V0.470588H15.5294V0.941176H16V0H15.0588ZM0.470588 15.5294H15.5294V15.0588H16V16H0V15.0588H0.470588V15.5294Z", fill: "currentColor" }));
+
+const SvgBorderLeft = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.5294 0.470588V0.941176H16V0H15.0588V0.470588H15.5294ZM15.0588 7.76471V8.23529H14.5882V7.76471H15.0588ZM14.1176 8.23529V7.76471H13.6471V8.23529H14.1176ZM12.9412 7.76471V8.23529H12.4706V7.76471H12.9412ZM11.7647 8.23529V7.76471H11.2941V8.23529H11.7647ZM7.05882 7.76471V8.23529H6.58823V7.76471H7.05882ZM5.88235 8.23529V7.76471H5.41176V8.23529H5.88235ZM4.70588 7.76471V8.23529H4.23529V7.76471H4.70588ZM2.35294 7.76471V8.23529H1.88235V7.76471H2.35294ZM1.41177 8.23529V7.76471H0.941176V8.23529H1.41177ZM3.52941 7.76471V8.23529H3.05882V7.76471H3.52941ZM9.41176 7.76471V8.23529H8.94118V7.76471H9.41176ZM10.5882 8.23529V7.76471H10.1176V8.23529H10.5882ZM8.23529 8.23529V7.76471H7.76471V8.23529H8.23529ZM8.23529 4.23529V4.70588H7.76471V4.23529H8.23529ZM8.23529 2.35294V1.88235H7.76471V2.35294H8.23529ZM8.23529 0.941176V1.41176H7.76471V0.941176H8.23529ZM8.23529 3.52941V3.05882H7.76471V3.52941H8.23529ZM8.23529 5.41176V5.88235H7.76471V5.41176H8.23529ZM8.23529 7.05882V6.58824H7.76471V7.05882H8.23529ZM8.23529 11.2941V11.7647H7.76471V11.2941H8.23529ZM8.23529 9.41177V8.94118H7.76471V9.41177H8.23529ZM8.23529 10.1176V10.5882H7.76471V10.1176H8.23529ZM8.23529 12.9412V12.4706H7.76471V12.9412H8.23529ZM8.23529 13.6471V14.1176H7.76471V13.6471H8.23529ZM8.23529 15.0588V14.5882H7.76471V15.0588H8.23529ZM16 11.7647V11.2941H15.5294V11.7647H16ZM16 13.6471V14.1176H15.5294V13.6471H16ZM16 12.9412V12.4706H15.5294V12.9412H16ZM16 10.1176V10.5882H15.5294V10.1176H16ZM16 9.41177V8.94118H15.5294V9.41177H16ZM16 4.23529V4.70588H15.5294V4.23529H16ZM16 7.05882V6.58824H15.5294V7.05882H16ZM16 5.41176V5.88235H15.5294V5.41176H16ZM16 3.52941V3.05882H15.5294V3.52941H16ZM16 1.88235V2.35294H15.5294V1.88235H16ZM16 8.23529V7.76471H15.5294V8.23529H16ZM4.70588 15.5294V16H4.23529V15.5294H4.70588ZM2.35294 16V15.5294H1.88235V16H2.35294ZM3.52941 15.5294V16H3.05882V15.5294H3.52941ZM5.88235 16V15.5294H5.41176V16H5.88235ZM7.05882 15.5294V16H6.58823V15.5294H7.05882ZM11.7647 16V15.5294H11.2941V16H11.7647ZM9.41176 15.5294V16H8.94118V15.5294H9.41176ZM10.5882 16V15.5294H10.1176V16H10.5882ZM12.9412 15.5294V16H12.4706V15.5294H12.9412ZM14.1176 16V15.5294H13.6471V16H14.1176ZM8.23529 15.5294V16H7.76471V15.5294H8.23529ZM4.70588 0.470588V0H4.23529V0.470588H4.70588ZM2.35294 0V0.470588H1.88235V0H2.35294ZM3.52941 0.470588V0H3.05882V0.470588H3.52941ZM5.88235 0V0.470588H5.41176V0H5.88235ZM7.05882 0.470588V0H6.58823V0.470588H7.05882ZM11.7647 0V0.470588H11.2941V0H11.7647ZM9.41176 0.470588V0H8.94118V0.470588H9.41176ZM10.5882 0V0.470588H10.1176V0H10.5882ZM12.9412 0.470588V0H12.4706V0.470588H12.9412ZM14.1176 0V0.470588H13.6471V0H14.1176ZM8.23529 0.470588V0H7.76471V0.470588H8.23529ZM16 15.0588H15.5294V15.5294H15.0588V16H16V15.0588ZM0.470588 0.470588V15.5294H0.941176V16H0V0H0.941176V0.470588H0.470588Z", fill: "currentColor" }));
+
+const SvgBorderRight = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.470588 15.5294V15.0588H0V16H0.941176V15.5294H0.470588ZM0.941176 8.23529V7.76471H1.41176V8.23529H0.941176ZM1.88235 7.76471V8.23529H2.35294V7.76471H1.88235ZM3.05882 8.23529V7.76471H3.52941V8.23529H3.05882ZM4.23529 7.76471V8.23529H4.70588V7.76471H4.23529ZM8.94118 8.23529V7.76471H9.41177V8.23529H8.94118ZM10.1176 7.76471V8.23529H10.5882V7.76471H10.1176ZM11.2941 8.23529V7.76471H11.7647V8.23529H11.2941ZM13.6471 8.23529V7.76471H14.1176V8.23529H13.6471ZM14.5882 7.76471V8.23529H15.0588V7.76471H14.5882ZM12.4706 8.23529V7.76471H12.9412V8.23529H12.4706ZM6.58824 8.23529V7.76471H7.05882V8.23529H6.58824ZM5.41176 7.76471V8.23529H5.88235V7.76471H5.41176ZM7.76471 7.76471V8.23529H8.23529V7.76471H7.76471ZM7.76471 11.7647V11.2941H8.23529V11.7647H7.76471ZM7.76471 13.6471V14.1176H8.23529V13.6471H7.76471ZM7.76471 15.0588V14.5882H8.23529V15.0588H7.76471ZM7.76471 12.4706V12.9412H8.23529V12.4706H7.76471ZM7.76471 10.5882V10.1176H8.23529V10.5882H7.76471ZM7.76471 8.94118V9.41176H8.23529V8.94118H7.76471ZM7.76471 4.70588V4.23529H8.23529V4.70588H7.76471ZM7.76471 6.58823V7.05882H8.23529V6.58823H7.76471ZM7.76471 5.88235V5.41176H8.23529V5.88235H7.76471ZM7.76471 3.05882V3.52941H8.23529V3.05882H7.76471ZM7.76471 2.35294V1.88235H8.23529V2.35294H7.76471ZM7.76471 0.941176V1.41177H8.23529V0.941176H7.76471ZM0 4.23529V4.70588H0.470588V4.23529H0ZM0 2.35294V1.88235H0.470588V2.35294H0ZM0 3.05882V3.52941H0.470588V3.05882H0ZM0 5.88235V5.41176H0.470588V5.88235H0ZM0 6.58823V7.05882H0.470588V6.58823H0ZM0 11.7647V11.2941H0.470588V11.7647H0ZM0 8.94118V9.41176H0.470588V8.94118H0ZM0 10.5882V10.1176H0.470588V10.5882H0ZM0 12.4706V12.9412H0.470588V12.4706H0ZM0 14.1176V13.6471H0.470588V14.1176H0ZM0 7.76471V8.23529H0.470588V7.76471H0ZM11.2941 0.470589V0H11.7647V0.470589H11.2941ZM13.6471 0V0.470589H14.1176V0H13.6471ZM12.4706 0.470589V0H12.9412V0.470589H12.4706ZM10.1176 0V0.470589H10.5882V0H10.1176ZM8.94118 0.470589V0H9.41177V0.470589H8.94118ZM4.23529 0V0.470589H4.70588V0H4.23529ZM6.58824 0.470589V0H7.05882V0.470589H6.58824ZM5.41176 0V0.470589H5.88235V0H5.41176ZM3.05882 0.470589V0H3.52941V0.470589H3.05882ZM1.88235 0V0.470589H2.35294V0H1.88235ZM7.76471 0.470589V0H8.23529V0.470589H7.76471ZM11.2941 15.5294V16H11.7647V15.5294H11.2941ZM13.6471 16V15.5294H14.1176V16H13.6471ZM12.4706 15.5294V16H12.9412V15.5294H12.4706ZM10.1176 16V15.5294H10.5882V16H10.1176ZM8.94118 15.5294V16H9.41177V15.5294H8.94118ZM4.23529 16V15.5294H4.70588V16H4.23529ZM6.58824 15.5294V16H7.05882V15.5294H6.58824ZM5.41176 16V15.5294H5.88235V16H5.41176ZM3.05882 15.5294V16H3.52941V15.5294H3.05882ZM1.88235 16V15.5294H2.35294V16H1.88235ZM7.76471 15.5294V16H8.23529V15.5294H7.76471ZM0 0.941176H0.470588V0.470588H0.941176V0H0V0.941176ZM15.5294 15.5294V0.470588H15.0588V0H16V16H15.0588V15.5294H15.5294Z", fill: "currentColor" }));
+
+const SvgBorderTop = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.5294 15.5294H15.0588V16H16V15.0588H15.5294V15.5294ZM8.23529 15.0588H7.76471V14.5882H8.23529V15.0588ZM7.76471 14.1176H8.23529V13.6471H7.76471V14.1176ZM8.23529 12.9412H7.76471V12.4706H8.23529V12.9412ZM7.76471 11.7647H8.23529V11.2941H7.76471V11.7647ZM8.23529 7.05882H7.76471V6.58823H8.23529V7.05882ZM7.76471 5.88235H8.23529V5.41176H7.76471V5.88235ZM8.23529 4.70588H7.76471V4.23529H8.23529V4.70588ZM8.23529 2.35294H7.76471V1.88235H8.23529V2.35294ZM7.76471 1.41177H8.23529V0.941176H7.76471V1.41177ZM8.23529 3.52941H7.76471V3.05882H8.23529V3.52941ZM8.23529 9.41176H7.76471V8.94118H8.23529V9.41176ZM7.76471 10.5882H8.23529V10.1176H7.76471V10.5882ZM7.76471 8.23529H8.23529V7.76471H7.76471V8.23529ZM11.7647 8.23529H11.2941V7.76471H11.7647V8.23529ZM13.6471 8.23529H14.1176V7.76471H13.6471V8.23529ZM15.0588 8.23529H14.5882V7.76471H15.0588V8.23529ZM12.4706 8.23529H12.9412V7.76471H12.4706V8.23529ZM10.5882 8.23529H10.1176V7.76471H10.5882V8.23529ZM8.94118 8.23529H9.41176V7.76471H8.94118V8.23529ZM4.70588 8.23529H4.23529V7.76471H4.70588V8.23529ZM6.58823 8.23529H7.05882V7.76471H6.58823V8.23529ZM5.88235 8.23529H5.41176V7.76471H5.88235V8.23529ZM3.05882 8.23529H3.52941V7.76471H3.05882V8.23529ZM2.35294 8.23529H1.88235V7.76471H2.35294V8.23529ZM0.941176 8.23529H1.41177V7.76471H0.941176V8.23529ZM4.23529 16H4.70588V15.5294H4.23529V16ZM2.35294 16H1.88235V15.5294H2.35294V16ZM3.05882 16H3.52941V15.5294H3.05882V16ZM5.88235 16H5.41176V15.5294H5.88235V16ZM6.58823 16H7.05882V15.5294H6.58823V16ZM11.7647 16H11.2941V15.5294H11.7647V16ZM8.94118 16H9.41176V15.5294H8.94118V16ZM10.5882 16H10.1176V15.5294H10.5882V16ZM12.4706 16H12.9412V15.5294H12.4706V16ZM14.1176 16H13.6471V15.5294H14.1176V16ZM7.76471 16H8.23529V15.5294H7.76471V16ZM0.470589 4.70588H0V4.23529H0.470589V4.70588ZM0 2.35294H0.470589V1.88235H0V2.35294ZM0.470589 3.52941H0V3.05882H0.470589V3.52941ZM0 5.88235H0.470589V5.41176H0V5.88235ZM0.470589 7.05882H0V6.58823H0.470589V7.05882ZM0 11.7647H0.470589V11.2941H0V11.7647ZM0.470589 9.41176H0V8.94118H0.470589V9.41176ZM0 10.5882H0.470589V10.1176H0V10.5882ZM0.470589 12.9412H0V12.4706H0.470589V12.9412ZM0 14.1176H0.470589V13.6471H0V14.1176ZM0.470589 8.23529H0V7.76471H0.470589V8.23529ZM15.5294 4.70588H16V4.23529H15.5294V4.70588ZM16 2.35294H15.5294V1.88235H16V2.35294ZM15.5294 3.52941H16V3.05882H15.5294V3.52941ZM16 5.88235H15.5294V5.41176H16V5.88235ZM15.5294 7.05882H16V6.58823H15.5294V7.05882ZM16 11.7647H15.5294V11.2941H16V11.7647ZM15.5294 9.41176H16V8.94118H15.5294V9.41176ZM16 10.5882H15.5294V10.1176H16V10.5882ZM15.5294 12.9412H16V12.4706H15.5294V12.9412ZM16 14.1176H15.5294V13.6471H16V14.1176ZM15.5294 8.23529H16V7.76471H15.5294V8.23529ZM0.941176 16V15.5294H0.470588V15.0588H0V16H0.941176ZM15.5294 0.470588H0.470588V0.941176H0V0H16V0.941176H15.5294V0.470588Z", fill: "currentColor" }));
+
+const SvgNoBorder = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.470588 15.5294V15.0588H0V16H0.941176V15.5294H0.470588ZM0.941176 8.23529V7.76471H1.41176V8.23529H0.941176ZM1.88235 7.76471V8.23529H2.35294V7.76471H1.88235ZM3.05882 8.23529V7.76471H3.52941V8.23529H3.05882ZM4.23529 7.76471V8.23529H4.70588V7.76471H4.23529ZM8.94118 8.23529V7.76471H9.41177V8.23529H8.94118ZM10.1176 7.76471V8.23529H10.5882V7.76471H10.1176ZM11.2941 8.23529V7.76471H11.7647V8.23529H11.2941ZM13.6471 8.23529V7.76471H14.1176V8.23529H13.6471ZM14.5882 7.76471V8.23529H15.0588V7.76471H14.5882ZM12.4706 8.23529V7.76471H12.9412V8.23529H12.4706ZM6.58824 8.23529V7.76471H7.05882V8.23529H6.58824ZM5.41176 7.76471V8.23529H5.88235V7.76471H5.41176ZM7.76471 7.76471V8.23529H8.23529V7.76471H7.76471ZM7.76471 11.7647V11.2941H8.23529V11.7647H7.76471ZM7.76471 13.6471V14.1176H8.23529V13.6471H7.76471ZM7.76471 15.0588V14.5882H8.23529V15.0588H7.76471ZM7.76471 12.4706V12.9412H8.23529V12.4706H7.76471ZM7.76471 10.5882V10.1176H8.23529V10.5882H7.76471ZM7.76471 8.94118V9.41176H8.23529V8.94118H7.76471ZM7.76471 4.70588V4.23529H8.23529V4.70588H7.76471ZM7.76471 6.58823V7.05882H8.23529V6.58823H7.76471ZM7.76471 5.88235V5.41176H8.23529V5.88235H7.76471ZM7.76471 3.05882V3.52941H8.23529V3.05882H7.76471ZM7.76471 2.35294V1.88235H8.23529V2.35294H7.76471ZM7.76471 0.941176V1.41177H8.23529V0.941176H7.76471ZM15.5294 15.0588V15.5294H15.0588V16H16V15.0588H15.5294ZM0 4.70588V4.23529H0.470588V4.70588H0ZM15.5294 4.23534V4.70593H16V4.23534H15.5294ZM0 2.35294V1.88235H0.470588V2.35294H0ZM15.5294 1.88232V2.35291H16V1.88232H15.5294ZM0 3.52941V3.05882H0.470588V3.52941H0ZM15.5294 3.05883V3.52942H16V3.05883H15.5294ZM0 5.88235V5.41176H0.470588V5.88235H0ZM15.5294 5.41174V5.88232H16V5.41174H15.5294ZM0 7.05882V6.58823H0.470588V7.05882H0ZM15.5294 6.58825V7.05884H16V6.58825H15.5294ZM0 11.7647V11.2941H0.470588V11.7647H0ZM15.5294 11.2941V11.7646H16V11.2941H15.5294ZM0 9.41176V8.94118H0.470588V9.41176H0ZM15.5294 8.94115V9.41174H16V8.94115H15.5294ZM0 10.5882V10.1176H0.470588V10.5882H0ZM15.5294 10.1177V10.5883H16V10.1177H15.5294ZM0 12.9412V12.4706H0.470588V12.9412H0ZM15.5294 12.4706V12.9412H16V12.4706H15.5294ZM0 14.1176V13.6471H0.470588V14.1176H0ZM15.5294 13.6471V14.1177H16V13.6471H15.5294ZM0 8.23529V7.76471H0.470588V8.23529H0ZM15.5294 7.76476V8.23535H16V7.76476H15.5294ZM11.2941 0.470589V0H11.7647V0.470589H11.2941ZM13.6471 0V0.470589H14.1176V0H13.6471ZM12.4706 0.470589V0H12.9412V0.470589H12.4706ZM10.1176 0V0.470589H10.5882V0H10.1176ZM8.94118 0.470589V0H9.41177V0.470589H8.94118ZM4.23529 0V0.470589H4.70588V0H4.23529ZM6.58824 0.470589V0H7.05882V0.470589H6.58824ZM5.41176 0V0.470589H5.88235V0H5.41176ZM3.05882 0.470589V0H3.52941V0.470589H3.05882ZM1.88235 0V0.470589H2.35294V0H1.88235ZM7.76471 0.470589V0H8.23529V0.470589H7.76471ZM11.2941 15.5294V16H11.7647V15.5294H11.2941ZM13.6471 16V15.5294H14.1176V16H13.6471ZM12.4706 15.5294V16H12.9412V15.5294H12.4706ZM10.1176 16V15.5294H10.5882V16H10.1176ZM8.94118 15.5294V16H9.41177V15.5294H8.94118ZM4.23529 16V15.5294H4.70588V16H4.23529ZM6.58824 15.5294V16H7.05882V15.5294H6.58824ZM5.41176 16V15.5294H5.88235V16H5.41176ZM3.05882 15.5294V16H3.52941V15.5294H3.05882ZM1.88235 16V15.5294H2.35294V16H1.88235ZM7.76471 15.5294V16H8.23529V15.5294H7.76471ZM0 0.941176H0.470588V0.470588H0.941176V0H0V0.941176ZM15.5294 0.941162H16V-1.52588e-05H15.0588V0.470573H15.5294V0.941162Z", fill: "currentColor" }));
+
+const SvgTextAlignCenter = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.2 1.6H0.8C0.587827 1.6 0.384344 1.51571 0.234314 1.36569C0.0842854 1.21566 0 1.01217 0 0.8C0 0.587827 0.0842854 0.384344 0.234314 0.234315C0.384344 0.0842854 0.587827 0 0.8 0H15.2C15.4122 0 15.6157 0.0842854 15.7657 0.234315C15.9157 0.384344 16 0.587827 16 0.8C16 1.01217 15.9157 1.21566 15.7657 1.36569C15.6157 1.51571 15.4122 1.6 15.2 1.6ZM12.8 6.4H3.2C2.98783 6.4 2.78434 6.31571 2.63431 6.16568C2.48428 6.01566 2.4 5.81217 2.4 5.6C2.4 5.38783 2.48428 5.18434 2.63431 5.03431C2.78434 4.88428 2.98783 4.8 3.2 4.8H12.8C13.0122 4.8 13.2157 4.88428 13.3657 5.03431C13.5157 5.18434 13.6 5.38783 13.6 5.6C13.6 5.81217 13.5157 6.01566 13.3657 6.16568C13.2157 6.31571 13.0122 6.4 12.8 6.4ZM0.8 11.2H15.2C15.4122 11.2 15.6157 11.1157 15.7657 10.9657C15.9157 10.8157 16 10.6122 16 10.4C16 10.1878 15.9157 9.98434 15.7657 9.83431C15.6157 9.68428 15.4122 9.6 15.2 9.6H0.8C0.587827 9.6 0.384344 9.68428 0.234314 9.83431C0.0842854 9.98434 0 10.1878 0 10.4C0 10.6122 0.0842854 10.8157 0.234314 10.9657C0.384344 11.1157 0.587827 11.2 0.8 11.2ZM12.8 16H3.2C2.98783 16 2.78434 15.9157 2.63431 15.7657C2.48428 15.6157 2.4 15.4122 2.4 15.2C2.4 14.9878 2.48428 14.7843 2.63431 14.6343C2.78434 14.4843 2.98783 14.4 3.2 14.4H12.8C13.0122 14.4 13.2157 14.4843 13.3657 14.6343C13.5157 14.7843 13.6 14.9878 13.6 15.2C13.6 15.4122 13.5157 15.6157 13.3657 15.7657C13.2157 15.9157 13.0122 16 12.8 16Z", fill: "currentColor" }));
+
+const SvgTextAlignLeft = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.2 1.6H0.8C0.587827 1.6 0.384344 1.51571 0.234314 1.36569C0.0842854 1.21566 0 1.01217 0 0.8C0 0.587827 0.0842854 0.384344 0.234314 0.234315C0.384344 0.0842854 0.587827 0 0.8 0H15.2C15.4122 0 15.6157 0.0842854 15.7657 0.234315C15.9157 0.384344 16 0.587827 16 0.8C16 1.01217 15.9157 1.21566 15.7657 1.36569C15.6157 1.51571 15.4122 1.6 15.2 1.6ZM10.4 6.4H0.8C0.587827 6.4 0.384344 6.31571 0.234315 6.16568C0.0842854 6.01566 0 5.81217 0 5.6C0 5.38783 0.0842854 5.18434 0.234315 5.03431C0.384344 4.88428 0.587827 4.8 0.8 4.8H10.4C10.6122 4.8 10.8157 4.88428 10.9657 5.03431C11.1157 5.18434 11.2 5.38783 11.2 5.6C11.2 5.81217 11.1157 6.01566 10.9657 6.16568C10.8157 6.31571 10.6122 6.4 10.4 6.4ZM0.8 11.2H15.2C15.4122 11.2 15.6157 11.1157 15.7657 10.9657C15.9157 10.8157 16 10.6122 16 10.4C16 10.1878 15.9157 9.98434 15.7657 9.83431C15.6157 9.68428 15.4122 9.6 15.2 9.6H0.8C0.587827 9.6 0.384344 9.68428 0.234314 9.83431C0.0842854 9.98434 0 10.1878 0 10.4C0 10.6122 0.0842854 10.8157 0.234314 10.9657C0.384344 11.1157 0.587827 11.2 0.8 11.2ZM10.4 16H0.8C0.587827 16 0.384344 15.9157 0.234315 15.7657C0.0842854 15.6157 0 15.4122 0 15.2C0 14.9878 0.0842854 14.7843 0.234315 14.6343C0.384344 14.4843 0.587827 14.4 0.8 14.4H10.4C10.6122 14.4 10.8157 14.4843 10.9657 14.6343C11.1157 14.7843 11.2 14.9878 11.2 15.2C11.2 15.4122 11.1157 15.6157 10.9657 15.7657C10.8157 15.9157 10.6122 16 10.4 16Z", fill: "currentColor" }));
+
+const SvgTextAlignRight = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.800003 1.6H15.2C15.4122 1.6 15.6157 1.51571 15.7657 1.36569C15.9157 1.21566 16 1.01217 16 0.8C16 0.587827 15.9157 0.384344 15.7657 0.234315C15.6157 0.0842854 15.4122 0 15.2 0H0.800003C0.58783 0 0.384346 0.0842854 0.234317 0.234315C0.0842886 0.384344 3.8147e-06 0.587827 3.8147e-06 0.8C3.8147e-06 1.01217 0.0842886 1.21566 0.234317 1.36569C0.384346 1.51571 0.58783 1.6 0.800003 1.6ZM5.6 6.4H15.2C15.4122 6.4 15.6157 6.31571 15.7657 6.16568C15.9157 6.01566 16 5.81217 16 5.6C16 5.38783 15.9157 5.18434 15.7657 5.03431C15.6157 4.88428 15.4122 4.8 15.2 4.8H5.6C5.38783 4.8 5.18435 4.88428 5.03432 5.03431C4.88429 5.18434 4.8 5.38783 4.8 5.6C4.8 5.81217 4.88429 6.01566 5.03432 6.16568C5.18435 6.31571 5.38783 6.4 5.6 6.4ZM15.2 11.2H0.800003C0.58783 11.2 0.384346 11.1157 0.234317 10.9657C0.0842886 10.8157 3.8147e-06 10.6122 3.8147e-06 10.4C3.8147e-06 10.1878 0.0842886 9.98434 0.234317 9.83431C0.384346 9.68428 0.58783 9.6 0.800003 9.6H15.2C15.4122 9.6 15.6157 9.68428 15.7657 9.83431C15.9157 9.98434 16 10.1878 16 10.4C16 10.6122 15.9157 10.8157 15.7657 10.9657C15.6157 11.1157 15.4122 11.2 15.2 11.2ZM5.6 16H15.2C15.4122 16 15.6157 15.9157 15.7657 15.7657C15.9157 15.6157 16 15.4122 16 15.2C16 14.9878 15.9157 14.7843 15.7657 14.6343C15.6157 14.4843 15.4122 14.4 15.2 14.4H5.6C5.38783 14.4 5.18435 14.4843 5.03432 14.6343C4.88429 14.7843 4.8 14.9878 4.8 15.2C4.8 15.4122 4.88429 15.6157 5.03432 15.7657C5.18435 15.9157 5.38783 16 5.6 16Z", fill: "currentColor" }));
+
+const SvgTextColor = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M6.47068 1.95133e-08H5.52951C5.1521 1.95133e-08 4.81045 0.225883 4.66268 0.573177L0.113037 11.2941H2.15821L3.35633 8.47059H8.63068L9.8241 11.2941H11.8674L7.33751 0.574118C7.26541 0.403859 7.14475 0.258607 6.99059 0.156499C6.83643 0.0543998 6.65563 -3.76275e-05 6.47068 1.95133e-08ZM4.15539 6.58824L5.99915 2.24376L7.83539 6.58824H4.15539Z", fill: "currentColor" }));
+
+const SvgFillColor = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 12 11", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M3.13141 7.17795C2.95989 7.04242 2.74491 6.96777 2.5261 6.96777C2.22872 6.96777 1.95179 7.0999 1.76631 7.33035C1.60413 7.53207 1.5307 7.78445 1.55964 8.04092C1.58862 8.29795 1.71684 8.52817 1.92063 8.68925C2.09216 8.82481 2.30706 8.89946 2.52584 8.89946C2.82344 8.89946 3.1004 8.76707 3.28573 8.5364C3.44777 8.33501 3.52112 8.08293 3.49229 7.82657C3.46338 7.56955 3.33524 7.33917 3.13141 7.17795ZM2.94043 8.25881C2.83957 8.38441 2.68843 8.45648 2.52584 8.45648C2.40463 8.45648 2.29033 8.41679 2.19538 8.34173C2.08496 8.25446 2.01555 8.13001 1.99986 7.99127C1.98428 7.85308 2.02393 7.71692 2.11146 7.60809C2.21236 7.48271 2.36351 7.4108 2.5261 7.4108C2.64741 7.4108 2.76175 7.45048 2.85666 7.5255C2.96705 7.61278 3.03642 7.7373 3.05204 7.87612C3.06758 8.01419 3.028 8.15005 2.94043 8.25881Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M7.02684 4.9091C7.17296 4.9091 7.31425 4.87709 7.44712 4.81378C7.682 4.7014 7.85843 4.50481 7.94382 4.26018C8.02877 4.01711 8.01349 3.75554 7.90089 3.52388C7.73981 3.19183 7.3958 2.97726 7.02451 2.97726C6.8781 2.97726 6.73651 3.00938 6.60368 3.07277C6.36888 3.18478 6.19237 3.38123 6.10683 3.62592C6.02173 3.86918 6.03698 4.13078 6.14977 4.36256C6.31136 4.69457 6.65562 4.9091 7.02684 4.9091ZM6.52497 3.77216C6.57127 3.6398 6.66696 3.53341 6.7944 3.4726C6.8672 3.4379 6.94459 3.42029 7.02448 3.42029C7.2272 3.42029 7.41474 3.53684 7.50231 3.71741C7.56305 3.84234 7.57128 3.98318 7.52557 4.1141C7.47931 4.24652 7.38351 4.35307 7.25622 4.41399C7.18367 4.44858 7.10647 4.46608 7.0268 4.46608C6.8239 4.46608 6.63598 4.34934 6.54804 4.1687C6.48739 4.04395 6.47919 3.90314 6.52497 3.77216Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M4.61602 3.34364C4.68727 3.35974 4.76018 3.3679 4.83273 3.3679C5.28874 3.3679 5.67835 3.05948 5.78024 2.61746C5.8375 2.36682 5.79346 2.10879 5.65634 1.89082C5.51808 1.67116 5.302 1.51846 5.04807 1.46095C4.97653 1.4447 4.90332 1.43643 4.83044 1.43643C4.37472 1.43643 3.98552 1.74518 3.88396 2.18713C3.82622 2.43759 3.86997 2.69565 4.00712 2.91376C4.14549 3.13372 4.36179 3.28642 4.61602 3.34364ZM4.31572 2.28652C4.37077 2.04688 4.58246 1.87949 4.83044 1.87949C4.87027 1.87949 4.91048 1.88403 4.95002 1.893C5.08854 1.92438 5.2062 2.00741 5.28136 2.12681C5.35542 2.24447 5.3792 2.38365 5.34841 2.51833C5.2941 2.75391 5.0772 2.92488 4.83269 2.92488C4.79297 2.92488 4.75291 2.92037 4.71348 2.91147C4.57493 2.88028 4.45727 2.79732 4.38214 2.67793C4.30823 2.56034 4.28463 2.42138 4.31572 2.28652Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M2.85595 3.89638C3.05952 3.73508 3.18752 3.50467 3.21646 3.24761C3.2453 2.99132 3.17209 2.73924 3.00998 2.53748C2.8242 2.30714 2.54706 2.17505 2.24968 2.17505C2.03108 2.17505 1.81633 2.24948 1.64477 2.38478C1.44116 2.5456 1.31309 2.77564 1.28404 3.03252C1.25502 3.28914 1.32841 3.54166 1.49082 3.74375C1.67644 3.97435 1.95363 4.10663 2.25134 4.10663C2.47012 4.10659 2.68487 4.03194 2.85595 3.89638ZM1.83608 3.46602C1.74836 3.35688 1.70867 3.22058 1.72433 3.08221C1.73998 2.94366 1.80931 2.81939 1.91933 2.73244C2.01425 2.65757 2.12851 2.618 2.24972 2.618C2.41245 2.618 2.56393 2.68999 2.6649 2.81518C2.75221 2.92394 2.79179 3.05991 2.77625 3.19802C2.76063 3.33699 2.69122 3.4617 2.58087 3.54912C2.4864 3.62395 2.37243 3.66353 2.25138 3.66353C2.08845 3.66357 1.93709 3.5915 1.83608 3.46602Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M11.9153 1.72867C11.877 1.69006 11.8087 1.64402 11.7009 1.64402C11.5745 1.64402 11.2388 1.64402 9.20006 3.37889C9.15908 3.41374 9.11773 3.44908 9.07623 3.48467C8.71196 2.53442 8.07194 1.68725 7.24722 1.07448C6.30159 0.37188 5.17557 0.000295348 3.991 0C3.99063 0 3.99038 0 3.99008 0C3.19065 0 2.21888 0.279326 1.45389 0.729104C0.516158 1.28037 -0.000184543 2.01763 4.94768e-08 2.805C0.000295398 3.75557 0.536426 4.15319 0.967228 4.47264C1.31851 4.73318 1.59595 4.93892 1.5961 5.38985C1.59621 5.84073 1.31891 6.04629 0.967819 6.30657C0.537165 6.62584 0.00114452 7.02323 0.00143987 7.97392C0.00166138 8.76117 0.518336 9.49862 1.45625 10.0504C2.22179 10.5007 3.19408 10.7806 3.99366 10.7808C3.99421 10.7808 3.99469 10.7808 3.99521 10.7808C5.44629 10.7808 6.8104 10.2207 7.83636 9.20368C8.84926 8.1996 9.4126 6.86873 9.4274 5.4505C9.77134 5.05913 10.1045 4.67012 10.4087 4.30356C10.9291 3.67646 11.3293 3.15901 11.5981 2.76564C11.9542 2.24461 12.1101 1.92504 11.9153 1.72867ZM7.52451 8.88906C6.58202 9.82339 5.32878 10.3378 3.99525 10.3378C3.99484 10.3378 3.99425 10.3378 3.99385 10.3378C2.56484 10.3374 0.444868 9.34459 0.444462 7.97377C0.444241 7.24622 0.826716 6.96265 1.23168 6.66243C1.6102 6.38177 2.03923 6.06368 2.03908 5.3897C2.03886 4.71582 1.60972 4.39755 1.23109 4.11678C0.825941 3.8163 0.443244 3.53251 0.443022 2.80488C0.442838 1.96311 1.21695 1.3823 1.67843 1.11099C2.36873 0.705144 3.276 0.442985 3.99008 0.442985C3.99034 0.442985 3.99063 0.442985 3.99086 0.442985C5.07962 0.443281 6.1143 0.784629 6.98303 1.43004C7.78423 2.02535 8.39583 2.86104 8.71798 3.79463C7.75717 4.63357 6.71673 5.60084 5.94189 6.37819C4.65495 6.54477 4.47962 7.40246 4.35144 8.03255C4.24231 8.56905 4.17146 8.82844 3.75735 8.86166C3.6553 8.86986 3.5722 8.94687 3.55629 9.04799C3.54034 9.14907 3.59575 9.24794 3.69034 9.28711C3.71696 9.29811 4.35033 9.55691 5.09033 9.55695C5.09044 9.55695 5.09051 9.55695 5.09058 9.55695C5.60626 9.55695 6.04862 9.43194 6.40533 9.18544C6.84488 8.88167 7.14292 8.40007 7.2927 7.75422C7.79896 7.24201 8.37744 6.62436 8.94946 5.98815C8.8178 7.08352 8.3235 8.09701 7.52451 8.88906ZM6.84765 7.71228C6.61292 8.64248 6.0223 9.114 5.09055 9.11397C5.09055 9.11397 5.0904 9.11397 5.09033 9.11397C4.84463 9.11397 4.60935 9.08044 4.41154 9.03865C4.64782 8.79768 4.72162 8.43507 4.78553 8.12093C4.90725 7.52255 5.02236 6.95626 5.96408 6.82173L6.84765 7.71228ZM9.90657 4.21388C9.02846 5.26004 7.96558 6.43486 7.09061 7.3281L6.95515 7.19158L6.35748 6.58918C7.15079 5.79949 8.16848 4.85789 9.11799 4.03383C9.22867 3.93777 9.33865 3.84292 9.44704 3.75048C10.549 2.81072 11.1264 2.40173 11.421 2.22375C11.2451 2.5201 10.8399 3.10197 9.90657 4.21388Z", fill: "currentColor" }));
+
 const SvgInfoIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M13.5 7C13.5 10.5898 10.5898 13.5 7 13.5C3.41016 13.5 0.5 10.5898 0.5 7C0.5 3.41015 3.41015 0.5 7 0.5C10.5898 0.5 13.5 3.41016 13.5 7Z", stroke: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7.00141 4.44022C7.47304 4.44022 7.85537 4.05789 7.85537 3.58626C7.85537 3.11463 7.47304 2.7323 7.00141 2.7323C6.52978 2.7323 6.14745 3.11463 6.14745 3.58626C6.14745 4.05789 6.52978 4.44022 7.00141 4.44022ZM5.8623 5.36406H5.3623V6.36406H5.8623H6.50092V9.91851H5.8623H5.3623V10.9185H5.8623H7.00092H8.13953H8.63953V9.91851H8.13953H7.50092V5.86406C7.50092 5.58792 7.27706 5.36406 7.00092 5.36406H5.8623Z", fill: "currentColor" }));
 
 const SvgCalendarIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M13.878 4.05558C13.7895 2.60703 12.5608 1.47217 11.0809 1.47217H10.3604V0.920871C10.3604 0.616552 10.1095 0.369568 9.80034 0.369568C9.4912 0.369568 9.2403 0.616552 9.2403 0.920871V1.47217H4.75997V0.920871C4.75997 0.616552 4.50907 0.369568 4.19993 0.369568C3.89079 0.369568 3.63989 0.616552 3.63989 0.920871V1.47217H2.9194C1.43921 1.47217 0.210478 2.60703 0.122271 4.05558C-0.0437812 6.78012 -0.0407009 9.5438 0.131512 12.2697C0.218878 13.654 1.3454 14.763 2.75166 14.849C4.16101 14.9353 5.58043 14.9783 6.99986 14.9783C8.419 14.9783 9.83871 14.9353 11.248 14.849C12.6543 14.763 13.7808 13.654 13.8682 12.2697C14.0407 9.54518 14.0438 6.78177 13.878 4.05558ZM12.7506 12.2014C12.698 13.0319 12.0223 13.697 11.1789 13.7486C8.40612 13.9181 5.59415 13.9181 2.82139 13.7486C1.97769 13.6968 1.302 13.0316 1.24963 12.2014C1.11718 10.1056 1.09002 7.98774 1.16087 5.8826H12.8397C12.9103 7.98857 12.8831 10.1064 12.7506 12.2014ZM4.19993 3.67738C4.50907 3.67738 4.75997 3.4304 4.75997 3.12608V2.57478H9.2403V3.12608C9.2403 3.4304 9.4912 3.67738 9.80034 3.67738C10.1095 3.67738 10.3604 3.4304 10.3604 3.12608V2.57478H11.0809C11.9694 2.57478 12.707 3.25426 12.7599 4.12146C12.773 4.34033 12.7786 4.56057 12.7896 4.77999H1.21071C1.22191 4.56057 1.22723 4.34033 1.24039 4.12146C1.29332 3.25426 2.03061 2.57478 2.9194 2.57478H3.63989V3.12608C3.63989 3.4304 3.89079 3.67738 4.19993 3.67738Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M4.19944 9.19047C4.66339 9.19047 5.0395 8.82023 5.0395 8.36351C5.0395 7.9068 4.66339 7.53656 4.19944 7.53656C3.73548 7.53656 3.35938 7.9068 3.35938 8.36351C3.35938 8.82023 3.73548 9.19047 4.19944 9.19047Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M7.00022 9.19047C7.46417 9.19047 7.84028 8.82023 7.84028 8.36351C7.84028 7.9068 7.46417 7.53656 7.00022 7.53656C6.53626 7.53656 6.16016 7.9068 6.16016 8.36351C6.16016 8.82023 6.53626 9.19047 7.00022 9.19047Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M4.19944 11.9468C4.66339 11.9468 5.0395 11.5766 5.0395 11.1199C5.0395 10.6631 4.66339 10.2929 4.19944 10.2929C3.73548 10.2929 3.35938 10.6631 3.35938 11.1199C3.35938 11.5766 3.73548 11.9468 4.19944 11.9468Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M9.79905 9.19047C10.263 9.19047 10.6391 8.82023 10.6391 8.36351C10.6391 7.9068 10.263 7.53656 9.79905 7.53656C9.33509 7.53656 8.95898 7.9068 8.95898 8.36351C8.95898 8.82023 9.33509 9.19047 9.79905 9.19047Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M9.79905 11.9468C10.263 11.9468 10.6391 11.5766 10.6391 11.1199C10.6391 10.6631 10.263 10.2929 9.79905 10.2929C9.33509 10.2929 8.95898 10.6631 8.95898 11.1199C8.95898 11.5766 9.33509 11.9468 9.79905 11.9468Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M7.00022 11.9468C7.46417 11.9468 7.84028 11.5766 7.84028 11.1199C7.84028 10.6631 7.46417 10.2929 7.00022 10.2929C6.53626 10.2929 6.16016 10.6631 6.16016 11.1199C6.16016 11.5766 6.53626 11.9468 7.00022 11.9468Z", fill: "currentColor" }));
@@ -265,6 +299,12 @@ const SvgAllProjects = (props) => /* @__PURE__ */ React__namespace.createElement
 
 const SvgAndroidIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M8.67013 16C9.2051 16 9.67163 15.5335 9.67163 14.9985V12.6596H10.3403C10.7416 12.6596 11.0091 12.392 11.0091 11.9908V5.31055H2.99084V11.9909C2.99084 12.3921 3.25833 12.6596 3.65956 12.6596H4.32832V14.9985C4.32832 15.5335 4.79474 16 5.32982 16C5.86474 16 6.33121 15.5335 6.33121 14.9985V12.6596H7.66869V14.9985C7.66863 15.5335 8.13516 16 8.67013 16Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M12.6793 11.9909C13.2143 11.9909 13.6807 11.5244 13.6807 10.9894V6.31161C13.6807 5.77947 13.2143 5.31055 12.6793 5.31055C12.1443 5.31055 11.6778 5.77947 11.6778 6.31161V10.9894C11.6778 11.5244 12.1442 11.9909 12.6793 11.9909Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M1.3206 11.9909C1.85563 11.9909 2.3221 11.5244 2.3221 10.9894V6.31161C2.3221 5.77947 1.85568 5.31055 1.3206 5.31055C0.785631 5.31055 0.319214 5.77947 0.319214 6.31161V10.9894C0.319214 11.5244 0.785631 11.9909 1.3206 11.9909Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M10.2065 0.100908C10.0729 -0.0336359 9.87381 -0.0336359 9.74012 0.100908L8.84322 0.994821L8.80184 1.03615C8.27002 0.769834 7.67376 0.636839 7.00975 0.635558C7.00649 0.635558 7.00328 0.635451 7.00003 0.635451H6.99992C6.99656 0.635451 6.99346 0.635558 6.9901 0.635558C6.32614 0.636839 5.72987 0.769834 5.19811 1.03615L5.15662 0.994821L4.25977 0.100908C4.12598 -0.0336359 3.92704 -0.0336359 3.79335 0.100908C3.65956 0.234704 3.65956 0.433262 3.79335 0.566951L4.66095 1.4347C4.38139 1.62136 4.1279 1.84976 3.90745 2.111C3.37969 2.73657 3.04306 3.55072 2.99677 4.43284C2.99634 4.44202 2.99544 4.45109 2.99501 4.46028C2.99218 4.52034 2.99084 4.58073 2.99084 4.64132H11.0091C11.0091 4.58073 11.0076 4.52034 11.0049 4.46028C11.0045 4.45109 11.0036 4.44202 11.003 4.43284C10.9568 3.55072 10.6201 2.73652 10.0923 2.11105C9.872 1.84981 9.61839 1.62141 9.33884 1.43476L10.2065 0.567005C10.3403 0.433262 10.3403 0.234704 10.2065 0.100908ZM5.32854 3.47373C5.05187 3.47373 4.82758 3.24944 4.82758 2.97277C4.82758 2.6961 5.05187 2.47181 5.32854 2.47181C5.60521 2.47181 5.8295 2.6961 5.8295 2.97277C5.8295 3.24944 5.60521 3.47373 5.32854 3.47373ZM8.67136 3.47373C8.39469 3.47373 8.1704 3.24944 8.1704 2.97277C8.1704 2.6961 8.39469 2.47181 8.67136 2.47181C8.94803 2.47181 9.17232 2.6961 9.17232 2.97277C9.17232 3.24944 8.94803 3.47373 8.67136 3.47373Z", fill: "currentColor" }));
 
+const SvgNoAccessIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M14 7C14 10.866 10.866 14 7 14C3.13401 14 0 10.866 0 7C0 3.13401 3.13401 0 7 0C10.866 0 14 3.13401 14 7ZM1.75 7C1.75 9.8995 4.1005 12.25 7 12.25C9.8995 12.25 12.25 9.8995 12.25 7C12.25 4.1005 9.8995 1.75 7 1.75C4.1005 1.75 1.75 4.1005 1.75 7Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M1 7C1 6.44772 1.44772 6 2 6H12C12.5523 6 13 6.44772 13 7C13 7.55228 12.5523 8 12 8H2C1.44772 8 1 7.55228 1 7Z", fill: "currentColor" }));
+
+const SvgFullAccessIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M14.3023 1.71582C14.0651 1.7172 13.838 1.81245 13.6708 1.98077C13.6708 1.98077 9.91509 5.72922 7.63431 8.00848L6.02693 6.40109C5.67669 6.05175 5.1098 6.05175 4.75956 6.40109C4.41022 6.75132 4.41022 7.31822 4.75956 7.66845L7.00284 9.91173C7.35309 10.261 7.91995 10.261 8.2702 9.91173C10.3923 7.79041 14.9382 3.24814 14.9382 3.24814C15.2875 2.8979 15.2875 2.33101 14.9382 1.98077C14.7699 1.81138 14.5411 1.71603 14.3023 1.71582Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M8.00172 1C4.14578 1.00003 1 4.14236 1 7.99832C1 11.8542 4.14578 15 8.00172 15C11.166 15 13.944 12.8676 14.763 9.8111C14.9214 9.22021 15 8.61007 15 7.99832C15 7.51546 14.6089 7.12387 14.1261 7.12323C13.6432 7.12387 13.2521 7.51546 13.2521 7.99832C13.2521 8.45716 13.1897 8.91556 13.071 9.35875C12.4548 11.6582 10.3823 13.2521 8.00172 13.2522C5.09163 13.2521 2.74786 10.9084 2.74786 7.99832C2.74786 5.08823 5.09162 2.74788 8.00172 2.74788C8.46061 2.74791 8.91551 2.81042 9.35875 2.92902C9.82555 3.05418 10.3054 2.77725 10.4306 2.31044C10.4307 2.31004 10.4308 2.3096 10.4309 2.30919C10.5561 1.84238 10.2791 1.36252 9.81234 1.23736C9.81192 1.23726 9.81152 1.23712 9.8111 1.23702C9.22011 1.07869 8.61357 1.00003 8.00172 1Z", fill: "currentColor" }));
+
+const SvgViewAccessIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M14.911 7.18924C14.786 7.01815 11.806 3 7.99994 3C4.19392 3 1.21377 7.01815 1.08884 7.18907C0.970387 7.35139 0.970387 7.57153 1.08884 7.73385C1.21377 7.90494 4.19392 11.9231 7.99994 11.9231C11.806 11.9231 14.786 7.90491 14.911 7.73398C15.0297 7.5717 15.0297 7.35139 14.911 7.18924ZM7.99994 11C5.1964 11 2.76824 8.33309 2.04946 7.46123C2.76731 6.5886 5.19039 3.92307 7.99994 3.92307C10.8033 3.92307 13.2313 6.58953 13.9504 7.46186C13.2326 8.33445 10.8095 11 7.99994 11Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M7.99996 4.69238C6.47302 4.69238 5.23071 5.9347 5.23071 7.46163C5.23071 8.98856 6.47302 10.2309 7.99996 10.2309C9.52689 10.2309 10.7692 8.98856 10.7692 7.46163C10.7692 5.9347 9.52689 4.69238 7.99996 4.69238ZM7.99996 9.30778C6.98195 9.30778 6.15381 8.47961 6.15381 7.46163C6.15381 6.44365 6.98198 5.61548 7.99996 5.61548C9.01794 5.61548 9.84611 6.44365 9.84611 7.46163C9.84611 8.47961 9.01797 9.30778 7.99996 9.30778Z", fill: "currentColor" }));
+
 const SvgAddLocator = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2.79688 8.32801V2.87501C2.79688 1.29432 4.09013 -0.000244141 5.67169 -0.000244141H11.1247C12.7063 -0.000244141 13.9995 1.29432 13.9995 2.87501V8.32801C13.9995 9.90869 12.7063 11.2033 11.1247 11.2033H5.67169C4.09013 11.2033 2.79688 9.90869 2.79688 8.32801ZM12.1402 1.85963C11.8708 1.59029 11.5056 1.43863 11.1247 1.43782H5.67169C5.29077 1.43874 4.9257 1.59044 4.65631 1.85975C4.38691 2.12907 4.2351 2.49408 4.23406 2.87501V8.32801C4.23522 8.70889 4.38707 9.07384 4.65644 9.34313C4.9258 9.61242 5.2908 9.76415 5.67169 9.76519H11.1247C11.5056 9.76427 11.8707 9.61257 12.1401 9.34326C12.4095 9.07394 12.5613 8.70893 12.5623 8.32801V2.87501C12.5614 2.49405 12.4096 2.12896 12.1402 1.85963ZM0.718813 2.23969C1.11388 2.23969 1.43763 2.56344 1.43763 2.95851V10.7661C1.43763 11.7711 2.26363 12.5625 3.23444 12.5625H11.0416C11.4376 12.5625 11.7609 12.8858 11.7609 13.2813C11.7609 13.6768 11.4371 14.0001 11.0416 14.0001H3.23444C1.43763 14.0001 0 12.5262 0 10.7661V2.95851C0 2.56301 0.323313 2.23969 0.718813 2.23969ZM7.67944 4.88263V3.28576C7.67967 3.09514 7.75537 2.91237 7.88999 2.77742C8.02462 2.64247 8.2072 2.56632 8.39781 2.56563C8.58843 2.56644 8.77099 2.64261 8.90566 2.77752C9.04033 2.91243 9.11617 3.09514 9.11663 3.28576V4.88263H10.7148C11.1112 4.88263 11.4341 5.20682 11.4341 5.60144C11.4341 5.99738 11.1108 6.32026 10.7148 6.32026H9.11663V7.92019C9.11663 8.31569 8.79244 8.63857 8.39781 8.63857C8.00231 8.63857 7.679 8.31569 7.679 7.92019V6.32026H6.08081C5.68531 6.32026 5.362 5.99694 5.362 5.60144C5.362 5.20638 5.68575 4.88263 6.08081 4.88263H7.67944Z", fill: "currentColor" }));
 
 const SvgPlusUserIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7 1C7 0.447715 6.55228 0 6 0C5.44772 0 5 0.447715 5 1V2.49994C5 3.88062 3.88074 4.99988 2.50006 4.99988H1C0.447715 4.99988 0 5.44759 0 5.99988C0 6.55216 0.447715 6.99988 1 6.99988H2.5C3.88071 6.99988 5 8.11917 5 9.49988V11C5 11.5523 5.44772 12 6 12C6.55228 12 7 11.5523 7 11V9.49988C7 8.11917 8.11929 6.99988 9.5 6.99988H11C11.5523 6.99988 12 6.55216 12 5.99988C12 5.44759 11.5523 4.99988 11 4.99988H9.49994C8.11926 4.99988 7 3.88062 7 2.49994V1Z", fill: "currentColor" }));
@@ -301,8 +341,25 @@ const SvgContinueWithoutSign = (props) => /* @__PURE__ */ React__namespace.creat
 
 const SvgCloudServerHostIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 8 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M7.32309 14.2733L7.09953 15.1872C6.42885 15.4519 5.89312 15.6534 5.49418 15.7919C5.09482 15.9309 4.63078 16 4.10207 16C3.29014 16 2.65862 15.8011 2.2082 15.406C1.75778 15.0094 1.53251 14.5068 1.53251 13.8971C1.53251 13.661 1.54885 13.4182 1.58284 13.1709C1.61711 12.9232 1.6716 12.6443 1.74617 12.3326L2.58434 9.36594C2.6589 9.08187 2.72228 8.81271 2.77305 8.55818C2.82453 8.30522 2.84934 8.07249 2.84934 7.86298C2.84934 7.48412 2.7709 7.21912 2.61474 7.07013C2.45857 6.92157 2.16059 6.84614 1.71821 6.84614C1.50153 6.84614 1.27883 6.88084 1.05183 6.94796C0.823829 7.01535 0.62895 7.08046 0.465332 7.14097L0.689464 6.22637C1.23854 6.00281 1.76338 5.81138 2.26542 5.65249C2.76746 5.49318 3.24182 5.41345 3.69051 5.41345C4.49684 5.41345 5.11905 5.60832 5.55599 5.99808C5.99292 6.38813 6.21132 6.89375 6.21132 7.51682C6.21132 7.64573 6.19698 7.87288 6.16615 8.19753C6.13603 8.5229 6.07997 8.82103 5.99823 9.0922L5.16365 12.0469C5.09525 12.2843 5.03373 12.5556 4.98024 12.8609C4.92503 13.1641 4.89865 13.3959 4.89865 13.5513C4.89865 13.9437 4.98612 14.2115 5.1615 14.3539C5.33816 14.4963 5.64246 14.5672 6.07466 14.5672C6.27757 14.5672 6.50844 14.5312 6.76498 14.4605C7.0208 14.3898 7.20737 14.3277 7.32309 14.2733ZM7.53475 1.86849C7.53475 2.38329 7.34073 2.82295 6.95083 3.18446C6.56193 3.54725 6.0933 3.7288 5.54509 3.7288C4.99515 3.7288 4.52538 3.54725 4.13204 3.18446C3.73941 2.8228 3.54267 2.38329 3.54267 1.86849C3.54267 1.35469 3.73941 0.91431 4.13204 0.548213C4.52466 0.18269 4.9953 0 5.54509 0C6.09316 0 6.56193 0.18312 6.95083 0.548213C7.34101 0.91431 7.53475 1.35483 7.53475 1.86849Z", fill: "currentColor" }));
 
+const SvgNotificationIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M12.9691 10.1187V7.07871C12.9691 4.82065 11.5284 2.85163 9.54476 2.11615C9.56791 2.00001 9.58076 1.88132 9.58076 1.76259C9.5808 0.789693 8.79352 0 7.82359 0C6.85365 0 6.06637 0.789693 6.06637 1.76259C6.06637 1.87873 6.07921 1.99483 6.09979 2.10581C5.41803 2.34839 4.78769 2.7329 4.24999 3.25419C3.23632 4.23484 2.67803 5.55354 2.67803 6.96774V10.1187C2.67803 10.2297 2.58798 10.3226 2.47477 10.3226C1.52542 10.3226 0.714972 11.04 0.627496 11.9536C0.578602 12.462 0.745864 12.9678 1.08804 13.3445C1.42763 13.7187 1.91391 13.9355 2.42072 13.9355H5.52351C5.65214 15.0942 6.63496 16 7.82359 16C9.01221 16 9.99503 15.0942 10.1237 13.9355H13.2265C13.7333 13.9355 14.2195 13.7187 14.5591 13.3445C14.8987 12.9678 15.066 12.462 15.0197 11.9536C14.9322 11.04 14.1192 10.3226 13.1724 10.3226C13.0592 10.3226 12.9691 10.2322 12.9691 10.1187ZM7.82359 1.03224C8.22492 1.03224 8.55167 1.35998 8.55167 1.76255C8.55167 1.79607 8.54651 1.82706 8.54136 1.86059C8.3664 1.83477 8.18887 1.81672 8.01134 1.81155C7.70517 1.8012 7.40416 1.82189 7.10573 1.86318C7.10057 1.82965 7.09542 1.79866 7.09542 1.76513C7.0955 1.35998 7.42225 1.03224 7.82359 1.03224ZM7.82359 14.9677C7.20356 14.9677 6.68386 14.5238 6.56291 13.9355H9.08422C8.96336 14.5239 8.44365 14.9677 7.82359 14.9677ZM13.9957 12.0516C14.0163 12.2736 13.9468 12.4877 13.8002 12.6503C13.6484 12.8129 13.4477 12.9032 13.2265 12.9032H2.42076C2.19949 12.9032 1.99885 12.8129 1.84959 12.6503C1.70037 12.4877 1.6309 12.2735 1.65148 12.0516C1.68748 11.6619 2.05028 11.3548 2.47477 11.3548C3.154 11.3548 3.70713 10.8 3.70713 10.1187V6.96774C3.70713 5.83741 4.15478 4.78195 4.96522 3.99742C5.73962 3.24647 6.74818 2.8387 7.82359 2.8387C7.87506 2.8387 7.92391 2.8387 7.97538 2.84128C10.1597 2.91869 11.94 4.82065 11.94 7.07871V10.1187C11.94 10.8 12.4932 11.3548 13.1724 11.3548C13.5969 11.3548 13.9571 11.6619 13.9957 12.0516Z", fill: "currentColor" }));
+
+const SvgNlpHelpIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M16 10.8281C16 8.49597 14.4286 6.45837 12.2126 5.84436C12.0734 2.59814 9.38928 0 6.10938 0C2.7406 0 0 2.7406 0 6.10938C0 7.20728 0.292236 8.27625 0.847168 9.21472L0.0224609 12.1962L3.00403 11.3716C3.8667 11.8817 4.83984 12.1691 5.84424 12.2124C6.45813 14.4285 8.49585 16 10.8281 16C11.759 16 12.6643 15.7521 13.4597 15.281L15.9774 15.9774L15.281 13.4597C15.7521 12.6643 16 11.759 16 10.8281ZM3.15198 10.3579L1.36707 10.8517L1.86084 9.06677L1.74829 8.89075C1.2179 8.06091 0.9375 7.09912 0.9375 6.10938C0.9375 3.25757 3.25757 0.9375 6.10938 0.9375C8.96118 0.9375 11.2812 3.25757 11.2812 6.10938C11.2812 8.96118 8.96118 11.2812 6.10938 11.2812C5.11963 11.2812 4.15796 11.0009 3.328 10.4705L3.15198 10.3579ZM14.6329 14.6329L13.3085 14.2665L13.1316 14.3816C12.4459 14.827 11.6493 15.0625 10.8281 15.0625C8.99512 15.0625 7.3844 13.8773 6.81372 12.1779C9.62061 11.8542 11.8542 9.62061 12.178 6.8136C13.8773 7.3844 15.0625 8.99512 15.0625 10.8281C15.0625 11.6493 14.827 12.4459 14.3816 13.1316L14.2665 13.3085L14.6329 14.6329ZM6.57812 8.46875V9.40625H5.64062V8.46875H6.57812ZM6.7417 5.37952C6.93848 5.19946 7.04687 4.95374 7.04687 4.6875C7.04687 4.17053 6.62634 3.75 6.10937 3.75C5.59241 3.75 5.17187 4.17053 5.17187 4.6875H4.23437C4.23437 3.65356 5.07544 2.8125 6.10937 2.8125C7.14331 2.8125 7.98437 3.65356 7.98437 4.6875C7.98437 5.21228 7.76208 5.71655 7.37463 6.07117L6.57812 6.80017V7.53125H5.64062V6.38733L6.7417 5.37952Z", fill: "currentColor" }));
+
+const SvgUpdateIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7.71572 9.02032C7.87816 9.18275 8.04059 9.26397 8.28425 9.26397C8.5279 9.26397 8.77156 9.18275 8.85277 9.02032L15.7563 2.11676C16.0812 1.79189 16.0812 1.30458 15.7563 0.979708C15.4315 0.654835 14.9441 0.654835 14.6193 0.979708L8.28425 7.31473L5.44161 4.47209C5.11673 4.14722 4.62943 4.14722 4.30455 4.47209C3.97968 4.79697 3.97968 5.28428 4.30455 5.60915L7.71572 9.02032ZM3.65482 9.02033C3.81726 9.18277 3.9797 9.26399 4.22335 9.26399C4.46701 9.26399 4.71066 9.18277 4.79188 9.02033C5.11675 8.69546 5.11675 8.20815 4.79188 7.88328L1.38071 4.47211C1.05584 4.14724 0.568528 4.14724 0.243655 4.47211C-0.0812183 4.79698 -0.0812183 5.28429 0.243655 5.60917L3.65482 9.02033ZM7.95939 4.79698C8.12183 4.95942 8.28426 5.04064 8.52792 5.04064C8.77157 5.04064 8.93401 4.95942 9.09645 4.79698L11.6954 2.11678C12.0203 1.79191 12.0203 1.3046 11.6954 0.979724C11.3706 0.65485 10.8832 0.65485 10.5584 0.979724L7.95939 3.65993C7.63452 3.9848 7.63452 4.47211 7.95939 4.79698Z", fill: "currentColor" }));
+
+const SvgAddFile = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 24 25", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("g", { clipPath: "url(#clip0_911_11481)" }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M19.1307 13.4822C19.6597 13.4822 20.0885 13.0534 20.0885 12.5243C20.0885 11.9953 19.6597 11.5665 19.1307 11.5665L12.9579 11.5665L12.9579 5.39368C12.9579 4.86467 12.529 4.43582 12 4.43582C11.471 4.43582 11.0421 4.86467 11.0421 5.39368L11.0421 11.5665L4.86934 11.5665C4.34033 11.5665 3.91148 11.9953 3.91148 12.5243C3.91148 13.0534 4.34032 13.4822 4.86934 13.4822L11.0421 13.4822V19.655C11.0421 20.184 11.471 20.6129 12 20.6129C12.529 20.6129 12.9579 20.184 12.9579 19.655V13.4822L19.1307 13.4822Z", fill: "currentColor" })), /* @__PURE__ */ React__namespace.createElement("defs", null, /* @__PURE__ */ React__namespace.createElement("clipPath", { id: "clip0_911_11481" }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M0 4.52441C0 2.31528 1.79086 0.524414 4 0.524414H20C22.2091 0.524414 24 2.31528 24 4.52441V20.5244C24 22.7336 22.2091 24.5244 20 24.5244H4C1.79086 24.5244 0 22.7336 0 20.5244V4.52441Z", fill: "currentColor" }))));
+
+const SvgCloneIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.86942 0.0111092H12.8728C13.7018 0.0123063 14.4965 0.342161 15.0828 0.928364C15.669 1.51457 15.9988 2.30928 16 3.1383V9.8924C15.9988 10.7214 15.669 11.5161 15.0828 12.1023C14.4965 12.6885 13.7018 13.0184 12.8728 13.0196H12.2586C12.2176 13.8104 11.8782 14.5578 11.3068 15.1097C10.7104 15.6858 9.90991 16.0018 9.08083 15.9885H3.18372C2.35443 16.0018 1.55368 15.6859 0.956918 15.1099C0.360155 14.5339 0.0160501 13.7448 0 12.9156V6.05293C0.0160501 5.22369 0.360155 4.43463 0.956918 3.85864C1.55368 3.28264 2.35443 2.96669 3.18372 2.98001H3.74183C3.76016 2.62314 3.83951 2.27164 3.97679 1.94088C4.13434 1.56131 4.3651 1.21649 4.6559 0.926106C4.94671 0.63572 5.29187 0.405455 5.67166 0.24846C6.05146 0.0914646 6.45846 0.010813 6.86942 0.0111092ZM3.73771 4.11059H3.18372C2.65408 4.0966 2.14051 4.29322 1.75562 4.65733C1.37074 5.02144 1.14596 5.52333 1.13058 6.05293V12.9065C1.14596 13.4361 1.37074 13.938 1.75562 14.3021C2.14051 14.6662 2.65408 14.8629 3.18372 14.8489H9.08083C9.61009 14.8622 10.1231 14.6654 10.5075 14.3013C10.8644 13.9633 11.0834 13.5067 11.1252 13.0196H6.86942C6.45846 13.0199 6.05146 12.9392 5.67166 12.7822C5.29187 12.6252 4.94671 12.395 4.6559 12.1046C4.3651 11.8142 4.13434 11.4694 3.97679 11.0898C3.81925 10.7102 3.73801 10.3034 3.73771 9.8924V4.11059ZM11.7002 11.889L11.697 11.889L11.6939 11.889H6.86942C6.34007 11.8884 5.83258 11.6779 5.45827 11.3036C5.08396 10.9292 4.87341 10.4217 4.87282 9.8924V3.1383C4.87341 2.60895 5.08396 2.10145 5.45827 1.72715C5.83258 1.35284 6.34007 1.14229 6.86942 1.14169H12.8728C13.4022 1.14229 13.9097 1.35284 14.284 1.72715C14.6583 2.10145 14.8688 2.60895 14.8694 3.1383V9.8924C14.8688 10.4217 14.6583 10.9292 14.284 11.3036C13.9097 11.6779 13.4022 11.8884 12.8728 11.889H11.7002ZM12.2962 4.58997H7.4415C7.29157 4.58997 7.14779 4.64952 7.04178 4.75554C6.93577 4.86155 6.87621 5.00533 6.87621 5.15526C6.87621 5.30518 6.93577 5.44897 7.04178 5.55498C7.14779 5.66099 7.29157 5.72055 7.4415 5.72055H12.2962C12.4461 5.72055 12.5899 5.66099 12.6959 5.55498C12.802 5.44897 12.8615 5.30518 12.8615 5.15526C12.8615 5.00533 12.802 4.86155 12.6959 4.75554C12.5899 4.64952 12.4461 4.58997 12.2962 4.58997ZM7.4415 7.32144H12.2962C12.4461 7.32144 12.5899 7.381 12.6959 7.48701C12.802 7.59303 12.8615 7.73681 12.8615 7.88673C12.8615 8.03666 12.802 8.18044 12.6959 8.28646C12.5899 8.39247 12.4461 8.45203 12.2962 8.45203H7.4415C7.29157 8.45203 7.14779 8.39247 7.04178 8.28646C6.93577 8.18044 6.87621 8.03666 6.87621 7.88673C6.87621 7.73681 6.93577 7.59303 7.04178 7.48701C7.14779 7.381 7.29157 7.32144 7.4415 7.32144Z", fill: "currentColor" }));
+
+const SvgMoveIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M14.3333 15.3334H11C10.0667 15.3334 9.33333 14.6 9.33333 13.6667V10.3334C9.33333 9.40002 10.0667 8.66669 11 8.66669H14.3333C15.2667 8.66669 16 9.40002 16 10.3334V13.6667C16 14.6 15.2667 15.3334 14.3333 15.3334ZM11 10C10.8 10 10.6667 10.1334 10.6667 10.3334V13.6667C10.6667 13.8667 10.8 14 11 14H14.3333C14.5333 14 14.6667 13.8667 14.6667 13.6667V10.3334C14.6667 10.1334 14.5333 10 14.3333 10H11Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M5 15.3334H1.66667C0.733333 15.3334 0 14.6 0 13.6667V10.3334C0 9.40002 0.733333 8.66669 1.66667 8.66669H5C5.93333 8.66669 6.66667 9.40002 6.66667 10.3334V13.6667C6.66667 14.6 5.93333 15.3334 5 15.3334Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M12.6667 7.33335C12.4667 7.33335 12.3333 7.26669 12.2 7.13335L10.8667 5.80002C10.6 5.53335 10.6 5.13335 10.8667 4.86669C11.1333 4.60002 11.5333 4.60002 11.8 4.86669L11.8667 4.93335C11.4 3.20002 9.80001 2.00002 8.00001 2.00002C5.80001 2.00002 4.00001 3.80002 4.00001 6.00002C4.00001 6.40002 3.73334 6.66669 3.33334 6.66669C2.93334 6.66669 2.66667 6.40002 2.66667 6.00002C2.66667 3.06669 5.06667 0.666687 8.00001 0.666687C10.6667 0.666687 12.8667 2.60002 13.2667 5.13335L13.5333 4.86669C13.8 4.60002 14.2 4.60002 14.4667 4.86669C14.7333 5.13335 14.7333 5.53335 14.4667 5.80002L13.1333 7.13335C13 7.26669 12.8667 7.33335 12.6667 7.33335Z", fill: "currentColor" }));
+
+const SvgJira = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.3371 0H7.63428C7.63428 1.92 9.18856 3.47428 11.1085 3.47428H12.5257V4.84572C12.5257 6.76572 14.0799 8.31997 15.9999 8.31997V0.662875C15.9999 0.297156 15.7028 0 15.3371 0ZM11.5201 3.83997H3.8172C3.8172 5.75997 5.37148 7.31422 7.29148 7.31422H8.70861V8.68568C8.70861 10.6057 10.2629 12.1599 12.1829 12.1599V4.50284C12.1829 4.13709 11.8857 3.83997 11.5201 3.83997ZM0.00012207 7.68005H7.703C8.06872 7.68005 8.36587 7.97718 8.36587 8.34293V16.0001C6.44587 16.0001 4.89153 14.4458 4.89153 12.5258V11.1543H3.4744C1.5544 11.1543 0.00012207 9.60005 0.00012207 7.68005Z", fill: "currentColor" }));
+
+const SvgHistoryIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("mask", { id: "path-1-inside-1_2947_13205", fill: "currentColor" }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M7.63624 1.5C9.29576 1.5 9.69963 1.54828 10.3071 1.6209L10.3555 1.6267C10.5059 1.64474 10.6742 1.66492 10.8747 1.68562L10.8997 1.68812C11.0622 1.70542 11.2223 1.74042 11.3772 1.7925L11.4084 1.80312L11.4322 1.81187H11.4359L11.44 1.81344C11.7875 1.94044 12.098 2.15188 12.3435 2.42873C12.589 2.70558 12.7617 3.03914 12.8462 3.39937L12.8756 3.68062C12.9509 4.40688 13.0109 5.50219 13.0419 6.77594C13.0464 6.9684 13.1261 7.15143 13.264 7.28579C13.4018 7.42016 13.5868 7.49515 13.7794 7.49469C13.8825 7.49428 13.9846 7.47349 14.0796 7.43352C14.1747 7.39355 14.261 7.33518 14.3334 7.26176C14.4059 7.18835 14.4631 7.10134 14.5018 7.00574C14.5406 6.91014 14.56 6.80783 14.559 6.70469C14.5444 4.76719 14.3859 3.52625 14.3859 3.52625C14.314 2.83126 14.0484 2.17042 13.6194 1.61891C13.1904 1.06739 12.6153 0.64735 11.9594 0.406563C11.9247 0.39375 11.89 0.38125 11.855 0.369063C11.5957 0.28191 11.3276 0.223538 11.0556 0.195L11.0297 0.192187C10.8197 0.170636 10.6453 0.14994 10.4827 0.130637C9.84117 0.0544934 9.38206 0 7.63624 0C5.79355 0 5.25185 0.0607585 4.50652 0.144357C4.36705 0.16 4.22045 0.176443 4.05686 0.193437L4.03092 0.19625C3.74536 0.226245 3.46422 0.289163 3.19311 0.38375V0.369375C2.51701 0.599223 1.92102 1.01815 1.4758 1.57647C1.03058 2.13479 0.754828 2.80908 0.681235 3.51938C0.551235 4.76937 0.484985 5.97469 0.484985 7.90812C0.484985 9.84156 0.551235 11.0472 0.681235 12.2972C0.77005 13.1502 1.14949 13.9467 1.75592 14.5531C2.36234 15.1596 3.15886 15.539 4.01186 15.6278L4.0378 15.6303C4.24679 15.652 4.42044 15.6728 4.5824 15.6922C5.12105 15.7567 5.53034 15.8058 6.67999 15.8197C6.7785 15.8209 6.87629 15.8027 6.96777 15.7661C7.05924 15.7294 7.1426 15.6752 7.21309 15.6063C7.28359 15.5375 7.33982 15.4554 7.37859 15.3649C7.41736 15.2743 7.43791 15.177 7.43905 15.0784C7.44123 14.8808 7.36531 14.6903 7.22779 14.5483C7.09028 14.4064 6.90228 14.3244 6.70467 14.3203C5.73124 14.3003 5.14217 14.2481 4.75655 14.2019L4.753 14.2014C4.59232 14.1822 4.41118 14.1605 4.19217 14.1378L4.16717 14.135C3.65643 14.0819 3.17949 13.8548 2.81639 13.4917C2.4533 13.1286 2.22617 12.6517 2.17311 12.1409C2.0603 11.0569 1.98561 9.92219 1.98561 7.90719C1.98561 5.89219 2.06092 4.75781 2.17311 3.67375C2.21249 3.29234 2.34953 2.92753 2.571 2.61453C2.79248 2.30153 3.09091 2.05091 3.43749 1.88687L3.68499 1.80062C3.8468 1.74414 4.01457 1.70639 4.18499 1.68812L4.21186 1.68562C4.3708 1.66885 4.51117 1.65318 4.64628 1.6381L4.67124 1.63531C5.39592 1.55375 5.87499 1.5 7.63624 1.5Z" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M11.3506 12.6722H12.744C12.9243 12.6722 13.0972 12.6006 13.2247 12.4731C13.3521 12.3456 13.4237 12.1728 13.4237 11.9925C13.4237 11.8122 13.3521 11.6394 13.2247 11.5119C13.0972 11.3844 12.9243 11.3128 12.744 11.3128H12.0303V10.3206C12.0303 10.1404 11.9587 9.96748 11.8312 9.84001C11.7038 9.71255 11.5309 9.64094 11.3506 9.64094C11.1703 9.64094 10.9975 9.71255 10.87 9.84001C10.7425 9.96748 10.6709 10.1404 10.6709 10.3206V11.9925C10.6711 12.1727 10.7428 12.3455 10.8702 12.4729C10.9976 12.6004 11.1704 12.672 11.3506 12.6722Z" }), /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.4172 16C9.15748 16 7.31936 14.1619 7.31936 11.9025C7.32052 10.816 7.75262 9.77443 8.52086 9.00619C9.2891 8.23795 10.3307 7.80585 11.4172 7.80469C13.6765 7.80469 15.515 9.64281 15.515 11.9025C15.515 14.1622 13.6765 16 11.4172 16ZM11.4172 9.30469C10.9034 9.30469 10.4011 9.45705 9.9739 9.7425C9.5467 10.0279 9.21373 10.4337 9.01711 10.9084C8.82048 11.383 8.76904 11.9054 8.86928 12.4093C8.96951 12.9132 9.21693 13.3761 9.58024 13.7394C9.94355 14.1027 10.4064 14.3502 10.9104 14.4504C11.4143 14.5506 11.9366 14.4992 12.4113 14.3026C12.886 14.1059 13.2917 13.773 13.5772 13.3458C13.8626 12.9186 14.015 12.4163 14.015 11.9025C14.0142 11.2137 13.7403 10.5534 13.2533 10.0664C12.7663 9.57937 12.1059 9.30543 11.4172 9.30469Z" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M10.934 4.16094H4.11342C3.9186 4.16493 3.7331 4.24512 3.59674 4.38432C3.46037 4.52351 3.38399 4.71061 3.38399 4.90547C3.38399 5.10033 3.46037 5.28743 3.59674 5.42662C3.7331 5.56581 3.9186 5.64601 4.11342 5.65H10.934C11.1289 5.64601 11.3144 5.56581 11.4507 5.42662C11.5871 5.28743 11.6635 5.10033 11.6635 4.90547C11.6635 4.71061 11.5871 4.52351 11.4507 4.38432C11.3144 4.24512 11.1289 4.16493 10.934 4.16094Z" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M4.11342 8.835C3.916 8.835 3.72667 8.75658 3.58707 8.61698C3.44747 8.47738 3.36905 8.28805 3.36905 8.09063C3.36905 7.89321 3.44747 7.70387 3.58707 7.56427C3.72667 7.42468 3.916 7.34625 4.11342 7.34625H8.0028C8.20022 7.34625 8.38955 7.42468 8.52915 7.56427C8.66875 7.70387 8.74717 7.89321 8.74717 8.09063C8.74717 8.28805 8.66875 8.47738 8.52915 8.61698C8.38955 8.75658 8.20022 8.835 8.0028 8.835H4.11342Z" })), /* @__PURE__ */ React__namespace.createElement("path", { d: "M7.63624 1.5C9.29576 1.5 9.69963 1.54828 10.3071 1.6209L10.3555 1.6267C10.5059 1.64474 10.6742 1.66492 10.8747 1.68562L10.8997 1.68812C11.0622 1.70542 11.2223 1.74042 11.3772 1.7925L11.4084 1.80312L11.4322 1.81187H11.4359L11.44 1.81344C11.7875 1.94044 12.098 2.15188 12.3435 2.42873C12.589 2.70558 12.7617 3.03914 12.8462 3.39937L12.8756 3.68062C12.9509 4.40688 13.0109 5.50219 13.0419 6.77594C13.0464 6.9684 13.1261 7.15143 13.264 7.28579C13.4018 7.42016 13.5868 7.49515 13.7794 7.49469C13.8825 7.49428 13.9846 7.47349 14.0796 7.43352C14.1747 7.39355 14.261 7.33518 14.3334 7.26176C14.4059 7.18835 14.4631 7.10134 14.5018 7.00574C14.5406 6.91014 14.56 6.80783 14.559 6.70469C14.5444 4.76719 14.3859 3.52625 14.3859 3.52625C14.314 2.83126 14.0484 2.17042 13.6194 1.61891C13.1904 1.06739 12.6153 0.64735 11.9594 0.406563C11.9247 0.39375 11.89 0.38125 11.855 0.369063C11.5957 0.28191 11.3276 0.223538 11.0556 0.195L11.0297 0.192187C10.8197 0.170636 10.6453 0.14994 10.4827 0.130637C9.84117 0.0544934 9.38206 0 7.63624 0C5.79355 0 5.25185 0.0607585 4.50652 0.144357C4.36705 0.16 4.22045 0.176443 4.05686 0.193437L4.03092 0.19625C3.74536 0.226245 3.46422 0.289163 3.19311 0.38375V0.369375C2.51701 0.599223 1.92102 1.01815 1.4758 1.57647C1.03058 2.13479 0.754828 2.80908 0.681235 3.51938C0.551235 4.76937 0.484985 5.97469 0.484985 7.90812C0.484985 9.84156 0.551235 11.0472 0.681235 12.2972C0.77005 13.1502 1.14949 13.9467 1.75592 14.5531C2.36234 15.1596 3.15886 15.539 4.01186 15.6278L4.0378 15.6303C4.24679 15.652 4.42044 15.6728 4.5824 15.6922C5.12105 15.7567 5.53034 15.8058 6.67999 15.8197C6.7785 15.8209 6.87629 15.8027 6.96777 15.7661C7.05924 15.7294 7.1426 15.6752 7.21309 15.6063C7.28359 15.5375 7.33982 15.4554 7.37859 15.3649C7.41736 15.2743 7.43791 15.177 7.43905 15.0784C7.44123 14.8808 7.36531 14.6903 7.22779 14.5483C7.09028 14.4064 6.90228 14.3244 6.70467 14.3203C5.73124 14.3003 5.14217 14.2481 4.75655 14.2019L4.753 14.2014C4.59232 14.1822 4.41118 14.1605 4.19217 14.1378L4.16717 14.135C3.65643 14.0819 3.17949 13.8548 2.81639 13.4917C2.4533 13.1286 2.22617 12.6517 2.17311 12.1409C2.0603 11.0569 1.98561 9.92219 1.98561 7.90719C1.98561 5.89219 2.06092 4.75781 2.17311 3.67375C2.21249 3.29234 2.34953 2.92753 2.571 2.61453C2.79248 2.30153 3.09091 2.05091 3.43749 1.88687L3.68499 1.80062C3.8468 1.74414 4.01457 1.70639 4.18499 1.68812L4.21186 1.68562C4.3708 1.66885 4.51117 1.65318 4.64628 1.6381L4.67124 1.63531C5.39592 1.55375 5.87499 1.5 7.63624 1.5Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M11.3506 12.6722H12.744C12.9243 12.6722 13.0972 12.6006 13.2247 12.4731C13.3521 12.3456 13.4237 12.1728 13.4237 11.9925C13.4237 11.8122 13.3521 11.6394 13.2247 11.5119C13.0972 11.3844 12.9243 11.3128 12.744 11.3128H12.0303V10.3206C12.0303 10.1404 11.9587 9.96748 11.8312 9.84001C11.7038 9.71255 11.5309 9.64094 11.3506 9.64094C11.1703 9.64094 10.9975 9.71255 10.87 9.84001C10.7425 9.96748 10.6709 10.1404 10.6709 10.3206V11.9925C10.6711 12.1727 10.7428 12.3455 10.8702 12.4729C10.9976 12.6004 11.1704 12.672 11.3506 12.6722Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.4172 16C9.15748 16 7.31936 14.1619 7.31936 11.9025C7.32052 10.816 7.75262 9.77443 8.52086 9.00619C9.2891 8.23795 10.3307 7.80585 11.4172 7.80469C13.6765 7.80469 15.515 9.64281 15.515 11.9025C15.515 14.1622 13.6765 16 11.4172 16ZM11.4172 9.30469C10.9034 9.30469 10.4011 9.45705 9.9739 9.7425C9.5467 10.0279 9.21373 10.4337 9.01711 10.9084C8.82048 11.383 8.76904 11.9054 8.86928 12.4093C8.96951 12.9132 9.21693 13.3761 9.58024 13.7394C9.94355 14.1027 10.4064 14.3502 10.9104 14.4504C11.4143 14.5506 11.9366 14.4992 12.4113 14.3026C12.886 14.1059 13.2917 13.773 13.5772 13.3458C13.8626 12.9186 14.015 12.4163 14.015 11.9025C14.0142 11.2137 13.7403 10.5534 13.2533 10.0664C12.7663 9.57937 12.1059 9.30543 11.4172 9.30469Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M10.934 4.16094H4.11342C3.9186 4.16493 3.7331 4.24512 3.59674 4.38432C3.46037 4.52351 3.38399 4.71061 3.38399 4.90547C3.38399 5.10033 3.46037 5.28743 3.59674 5.42662C3.7331 5.56581 3.9186 5.64601 4.11342 5.65H10.934C11.1289 5.64601 11.3144 5.56581 11.4507 5.42662C11.5871 5.28743 11.6635 5.10033 11.6635 4.90547C11.6635 4.71061 11.5871 4.52351 11.4507 4.38432C11.3144 4.24512 11.1289 4.16493 10.934 4.16094Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M4.11342 8.835C3.916 8.835 3.72667 8.75658 3.58707 8.61698C3.44747 8.47738 3.36905 8.28805 3.36905 8.09063C3.36905 7.89321 3.44747 7.70387 3.58707 7.56427C3.72667 7.42468 3.916 7.34625 4.11342 7.34625H8.0028C8.20022 7.34625 8.38955 7.42468 8.52915 7.56427C8.66875 7.70387 8.74717 7.89321 8.74717 8.09063C8.74717 8.28805 8.66875 8.47738 8.52915 8.61698C8.38955 8.75658 8.20022 8.835 8.0028 8.835H4.11342Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M7.63624 1.5C9.29576 1.5 9.69963 1.54828 10.3071 1.6209L10.3555 1.6267C10.5059 1.64474 10.6742 1.66492 10.8747 1.68562L10.8997 1.68812C11.0622 1.70542 11.2223 1.74042 11.3772 1.7925L11.4084 1.80312L11.4322 1.81187H11.4359L11.44 1.81344C11.7875 1.94044 12.098 2.15188 12.3435 2.42873C12.589 2.70558 12.7617 3.03914 12.8462 3.39937L12.8756 3.68062C12.9509 4.40688 13.0109 5.50219 13.0419 6.77594C13.0464 6.9684 13.1261 7.15143 13.264 7.28579C13.4018 7.42016 13.5868 7.49515 13.7794 7.49469C13.8825 7.49428 13.9846 7.47349 14.0796 7.43352C14.1747 7.39355 14.261 7.33518 14.3334 7.26176C14.4059 7.18835 14.4631 7.10134 14.5018 7.00574C14.5406 6.91014 14.56 6.80783 14.559 6.70469C14.5444 4.76719 14.3859 3.52625 14.3859 3.52625C14.314 2.83126 14.0484 2.17042 13.6194 1.61891C13.1904 1.06739 12.6153 0.64735 11.9594 0.406563C11.9247 0.39375 11.89 0.38125 11.855 0.369063C11.5957 0.28191 11.3276 0.223538 11.0556 0.195L11.0297 0.192187C10.8197 0.170636 10.6453 0.14994 10.4827 0.130637C9.84117 0.0544934 9.38206 0 7.63624 0C5.79355 0 5.25185 0.0607585 4.50652 0.144357C4.36705 0.16 4.22045 0.176443 4.05686 0.193437L4.03092 0.19625C3.74536 0.226245 3.46422 0.289163 3.19311 0.38375V0.369375C2.51701 0.599223 1.92102 1.01815 1.4758 1.57647C1.03058 2.13479 0.754828 2.80908 0.681235 3.51938C0.551235 4.76937 0.484985 5.97469 0.484985 7.90812C0.484985 9.84156 0.551235 11.0472 0.681235 12.2972C0.77005 13.1502 1.14949 13.9467 1.75592 14.5531C2.36234 15.1596 3.15886 15.539 4.01186 15.6278L4.0378 15.6303C4.24679 15.652 4.42044 15.6728 4.5824 15.6922C5.12105 15.7567 5.53034 15.8058 6.67999 15.8197C6.7785 15.8209 6.87629 15.8027 6.96777 15.7661C7.05924 15.7294 7.1426 15.6752 7.21309 15.6063C7.28359 15.5375 7.33982 15.4554 7.37859 15.3649C7.41736 15.2743 7.43791 15.177 7.43905 15.0784C7.44123 14.8808 7.36531 14.6903 7.22779 14.5483C7.09028 14.4064 6.90228 14.3244 6.70467 14.3203C5.73124 14.3003 5.14217 14.2481 4.75655 14.2019L4.753 14.2014C4.59232 14.1822 4.41118 14.1605 4.19217 14.1378L4.16717 14.135C3.65643 14.0819 3.17949 13.8548 2.81639 13.4917C2.4533 13.1286 2.22617 12.6517 2.17311 12.1409C2.0603 11.0569 1.98561 9.92219 1.98561 7.90719C1.98561 5.89219 2.06092 4.75781 2.17311 3.67375C2.21249 3.29234 2.34953 2.92753 2.571 2.61453C2.79248 2.30153 3.09091 2.05091 3.43749 1.88687L3.68499 1.80062C3.8468 1.74414 4.01457 1.70639 4.18499 1.68812L4.21186 1.68562C4.3708 1.66885 4.51117 1.65318 4.64628 1.6381L4.67124 1.63531C5.39592 1.55375 5.87499 1.5 7.63624 1.5Z", stroke: "white", strokeWidth: 0.2, mask: "url(#path-1-inside-1_2947_13205)" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M11.3506 12.6722H12.744C12.9243 12.6722 13.0972 12.6006 13.2247 12.4731C13.3521 12.3456 13.4237 12.1728 13.4237 11.9925C13.4237 11.8122 13.3521 11.6394 13.2247 11.5119C13.0972 11.3844 12.9243 11.3128 12.744 11.3128H12.0303V10.3206C12.0303 10.1404 11.9587 9.96748 11.8312 9.84001C11.7038 9.71255 11.5309 9.64094 11.3506 9.64094C11.1703 9.64094 10.9975 9.71255 10.87 9.84001C10.7425 9.96748 10.6709 10.1404 10.6709 10.3206V11.9925C10.6711 12.1727 10.7428 12.3455 10.8702 12.4729C10.9976 12.6004 11.1704 12.672 11.3506 12.6722Z", stroke: "white", strokeWidth: 0.2, mask: "url(#path-1-inside-1_2947_13205)" }), /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.4172 16C9.15748 16 7.31936 14.1619 7.31936 11.9025C7.32052 10.816 7.75262 9.77443 8.52086 9.00619C9.2891 8.23795 10.3307 7.80585 11.4172 7.80469C13.6765 7.80469 15.515 9.64281 15.515 11.9025C15.515 14.1622 13.6765 16 11.4172 16ZM11.4172 9.30469C10.9034 9.30469 10.4011 9.45705 9.9739 9.7425C9.5467 10.0279 9.21373 10.4337 9.01711 10.9084C8.82048 11.383 8.76904 11.9054 8.86928 12.4093C8.96951 12.9132 9.21693 13.3761 9.58024 13.7394C9.94355 14.1027 10.4064 14.3502 10.9104 14.4504C11.4143 14.5506 11.9366 14.4992 12.4113 14.3026C12.886 14.1059 13.2917 13.773 13.5772 13.3458C13.8626 12.9186 14.015 12.4163 14.015 11.9025C14.0142 11.2137 13.7403 10.5534 13.2533 10.0664C12.7663 9.57937 12.1059 9.30543 11.4172 9.30469Z", stroke: "white", strokeWidth: 0.2, mask: "url(#path-1-inside-1_2947_13205)" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M10.934 4.16094H4.11342C3.9186 4.16493 3.7331 4.24512 3.59674 4.38432C3.46037 4.52351 3.38399 4.71061 3.38399 4.90547C3.38399 5.10033 3.46037 5.28743 3.59674 5.42662C3.7331 5.56581 3.9186 5.64601 4.11342 5.65H10.934C11.1289 5.64601 11.3144 5.56581 11.4507 5.42662C11.5871 5.28743 11.6635 5.10033 11.6635 4.90547C11.6635 4.71061 11.5871 4.52351 11.4507 4.38432C11.3144 4.24512 11.1289 4.16493 10.934 4.16094Z", stroke: "white", strokeWidth: 0.2, mask: "url(#path-1-inside-1_2947_13205)" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M4.11342 8.835C3.916 8.835 3.72667 8.75658 3.58707 8.61698C3.44747 8.47738 3.36905 8.28805 3.36905 8.09063C3.36905 7.89321 3.44747 7.70387 3.58707 7.56427C3.72667 7.42468 3.916 7.34625 4.11342 7.34625H8.0028C8.20022 7.34625 8.38955 7.42468 8.52915 7.56427C8.66875 7.70387 8.74717 7.89321 8.74717 8.09063C8.74717 8.28805 8.66875 8.47738 8.52915 8.61698C8.38955 8.75658 8.20022 8.835 8.0028 8.835H4.11342Z", stroke: "white", strokeWidth: 0.2, mask: "url(#path-1-inside-1_2947_13205)" }));
+
+const SvgLinkedDefects = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M5.22499 13.7397C5.09343 13.8514 5.07734 14.0486 5.18902 14.1802C5.30071 14.3117 5.49793 14.3278 5.62949 14.2161C5.76106 14.1044 5.77715 13.9072 5.66546 13.7757C5.55377 13.6441 5.35656 13.628 5.22499 13.7397Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M9.31659 9.14405L8.77474 8.87024L8.63074 8.33286C8.60305 8.22952 8.52449 8.14749 8.42246 8.11533C8.32033 8.08314 8.20899 8.10533 8.12708 8.17411L6.74248 9.33593C6.30095 8.91739 5.73557 8.66111 5.12042 8.60727C4.40016 8.54405 3.6986 8.76539 3.14488 9.23002L0.967091 11.0574C0.413558 11.5219 0.073869 12.1744 0.0105251 12.895C-0.0524751 13.615 0.168869 14.3166 0.633715 14.8705C1.16831 15.5076 1.93612 15.8361 2.70913 15.8361C3.32316 15.836 3.94051 15.6287 4.44654 15.2041L4.53657 15.1285C4.66901 15.0173 4.68632 14.8199 4.57516 14.6874C4.46401 14.5549 4.26657 14.5377 4.13407 14.6488L4.04404 14.7244C3.16532 15.4616 1.85069 15.3467 1.11337 14.468C0.756027 14.0422 0.585902 13.5028 0.634308 12.9496C0.682996 12.3957 0.94409 11.8941 1.36956 11.5371L3.54735 9.70965C3.97294 9.35255 4.51232 9.18271 5.06579 9.23102C5.51401 9.27027 5.92807 9.44896 6.25908 9.74146L5.94923 10.0015C5.84354 10.0901 5.74339 10.1414 5.67564 10.1624C5.16554 9.8068 4.47801 9.83196 3.99216 10.2397L1.81434 12.0671C1.22797 12.5592 1.15128 13.4366 1.64347 14.0231C1.91766 14.3499 2.31153 14.5184 2.70803 14.5184C3.023 14.5184 3.33966 14.4121 3.59926 14.1943L5.77707 12.3668C5.88404 12.277 5.97529 12.1739 6.04967 12.059C6.36198 11.9893 6.65955 11.8642 6.92833 11.6902C6.84664 12.1241 6.62955 12.521 6.30417 12.8241C6.17764 12.942 6.17064 13.1401 6.28851 13.2666C6.35017 13.3328 6.43379 13.3663 6.51764 13.3663C6.59408 13.3663 6.67067 13.3385 6.73098 13.2823C7.22067 12.8261 7.52242 12.207 7.58058 11.5397C7.59164 11.4153 7.5933 11.2898 7.58695 11.1649L9.37662 9.66324C9.45724 9.59561 9.49849 9.49199 9.4864 9.38746C9.47431 9.28299 9.41049 9.19152 9.31659 9.14405ZM3.19672 13.7147C2.87482 13.9848 2.39322 13.9426 2.12309 13.6207C1.9925 13.4651 1.93034 13.2675 1.94809 13.0643C1.96581 12.8612 2.06125 12.6774 2.21681 12.5469L3.60085 11.3855C4.01729 11.7803 4.54413 12.0302 5.11829 12.1023L3.19672 13.7147ZM6.79633 11.011C6.50998 11.2512 6.16492 11.41 5.79839 11.4702C5.79548 11.4707 5.4486 11.5047 5.27782 11.4896C4.82979 11.4506 4.41576 11.2721 4.08476 10.9795L4.39466 10.7195C4.39466 10.7195 4.39473 10.7194 4.39479 10.7194C4.68113 10.4792 5.09492 10.4809 5.37867 10.7234C5.42826 10.7658 5.48985 10.7916 5.55482 10.7973C5.89795 10.8274 6.22654 10.5862 6.35173 10.4812L8.15308 8.96967L8.20614 9.16758C8.22921 9.25364 8.28783 9.32577 8.36736 9.36596L8.61043 9.4888L6.79633 11.011Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M15.6361 1.51653C14.8899 0.224213 13.2315 -0.220257 11.939 0.525964L9.47701 1.94741C8.85075 2.30897 8.40297 2.89263 8.21625 3.59038C8.18378 3.71097 8.16038 3.83422 8.14494 3.95829L6.12168 5.12642C6.02993 5.17942 5.97115 5.2752 5.96556 5.38101C5.95996 5.48682 6.00828 5.58832 6.09393 5.65067L6.58003 6.00457L6.62503 6.56395C6.63365 6.67098 6.69653 6.76614 6.79156 6.81605C6.83718 6.84001 6.88715 6.85195 6.93709 6.85195C6.99122 6.85195 7.04528 6.83792 7.09362 6.81001L8.65894 5.90629C9.0211 6.39514 9.53338 6.74567 10.1299 6.90555C10.3631 6.96805 10.5997 6.99895 10.8349 6.99895C11.3038 6.99895 11.7666 6.87598 12.1835 6.6353L14.6456 5.21385C15.2713 4.85254 15.7192 4.26888 15.9067 3.57029C16.0937 2.87219 15.9976 2.14281 15.6361 1.51653ZM7.19269 5.81104C7.18537 5.72004 7.13869 5.63676 7.06487 5.58304L6.85184 5.42792L8.597 4.42035C8.59885 4.41929 8.60072 4.41826 8.60253 4.41716L8.89678 4.24729C9.2205 4.06038 9.58872 3.96379 9.95929 3.96844C9.96238 3.96851 9.96544 3.96844 9.96854 3.96841C10.1397 3.97122 10.31 3.99513 10.4754 4.03966C10.9098 4.15591 11.2865 4.40363 11.5617 4.7492L11.2114 4.95148C11.2112 4.95157 11.211 4.95166 11.2108 4.95179C10.8873 5.13823 10.4803 5.06476 10.2429 4.7767C10.2014 4.72638 10.1453 4.69026 10.0823 4.67338C9.74926 4.58423 9.38413 4.7646 9.2426 4.84632L8.601 5.21673C8.601 5.21673 8.60097 5.21673 8.60094 5.21676C8.60091 5.21679 8.60091 5.21679 8.60088 5.21679L7.20943 6.02014L7.19269 5.81104ZM10.7389 3.464L12.9112 2.20978C13.0871 2.10822 13.2924 2.08128 13.4894 2.13409C13.6863 2.18684 13.8506 2.31278 13.9522 2.48872C14.0538 2.66469 14.0807 2.87006 14.028 3.06707C13.9752 3.26407 13.8493 3.42844 13.6735 3.52997L12.1088 4.43335C11.7672 3.97222 11.2918 3.63472 10.7389 3.464ZM15.3019 3.4081C15.1578 3.94513 14.8135 4.39382 14.3325 4.67154L11.8704 6.09298C11.3893 6.37076 10.8287 6.44448 10.2919 6.30067C9.85735 6.1842 9.48063 5.93629 9.20544 5.59076L9.55572 5.38854C9.67522 5.31957 9.78276 5.28648 9.85307 5.27751C10.2937 5.71632 10.9752 5.81082 11.5244 5.4937L13.9865 4.07222C14.3073 3.88707 14.5368 3.58757 14.6328 3.22897C14.7288 2.87044 14.6797 2.49635 14.4945 2.17559C14.3093 1.85481 14.0099 1.62528 13.6514 1.52922C13.2929 1.43309 12.9188 1.48222 12.5981 1.66744L10.136 3.08891C10.0151 3.15875 9.90729 3.24444 9.81413 3.34472C9.49432 3.35913 9.17935 3.43079 8.88425 3.5555C9.05291 3.10647 9.369 2.73272 9.7901 2.48963L12.2521 1.06818C13.2455 0.494683 14.5202 0.836246 15.0938 1.82956C15.3717 2.31106 15.4456 2.87169 15.3019 3.4081Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M3.05852 5.17202C3.11918 5.22993 3.19699 5.25868 3.27471 5.25868C3.35724 5.25868 3.43968 5.22624 3.50118 5.1618C3.62062 5.03674 3.61602 4.83855 3.49096 4.71915L2.8803 4.13605C2.75521 4.01664 2.55708 4.02114 2.43765 4.14627C2.31821 4.27133 2.3228 4.46952 2.44786 4.58893L3.05852 5.17202Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M1.65559 7.13491L2.38232 7.42919C2.42085 7.44478 2.46063 7.45219 2.49975 7.45219C2.6235 7.45219 2.74075 7.37828 2.79004 7.25653C2.85494 7.09625 2.77763 6.91369 2.61738 6.84881L1.89066 6.55453C1.73028 6.48963 1.54781 6.56694 1.48294 6.72719C1.41803 6.88747 1.49534 7.07003 1.65559 7.13491Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M5.05995 3.89848C5.11983 3.99135 5.22055 4.04198 5.32342 4.04198C5.38149 4.04198 5.4403 4.02582 5.49274 3.99201C5.63805 3.89832 5.67995 3.70457 5.58627 3.55923L5.16152 2.90023C5.06786 2.75491 4.87417 2.71297 4.72873 2.80669C4.58342 2.90038 4.54151 3.09413 4.6352 3.23948L5.05995 3.89848Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M12.6246 10.0189C12.4995 9.89945 12.3014 9.90398 12.182 10.0291C12.0625 10.1541 12.0671 10.3523 12.1922 10.4717L12.8028 11.0548C12.8635 11.1127 12.9413 11.1415 13.019 11.1415C13.1016 11.1415 13.184 11.109 13.2455 11.0446C13.3649 10.9195 13.3603 10.7214 13.2353 10.6019L12.6246 10.0189Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M14.0276 8.05591L13.3009 7.76162C13.1405 7.69672 12.9581 7.77403 12.8932 7.93428C12.8283 8.09456 12.9055 8.27709 13.0658 8.342L13.7925 8.63628C13.831 8.65188 13.8708 8.65928 13.9099 8.65928C14.0337 8.65928 14.1509 8.58538 14.2002 8.46363C14.2651 8.30334 14.1879 8.12081 14.0276 8.05591Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M10.6232 11.2924C10.5296 11.147 10.3358 11.105 10.1905 11.1988C10.0451 11.2925 10.0032 11.4862 10.0969 11.6315L10.5217 12.2906C10.5815 12.3835 10.6822 12.4341 10.7851 12.4341C10.8432 12.4341 10.902 12.418 10.9544 12.3841C11.0997 12.2905 11.1417 12.0967 11.048 11.9514L10.6232 11.2924Z", fill: "currentColor" }));
+
 let Components = {};
-//icons
 Components['delete_info'] = SvgDeleteInfo;
 Components['success'] = SvgSuccess;
 Components['warning'] = SvgWarning;
@@ -345,6 +402,23 @@ Components['delete'] = SvgDelete;
 Components['details'] = SvgDetails;
 Components['impactList'] = SvgImpactList;
 Components['add_variable'] = SvgAddVariableIcon;
+Components['formate_painter'] = SvgFormatePainter;
+Components['bold'] = SvgBold;
+Components['italic'] = SvgItalic;
+Components['strike_through'] = SvgStrikeThrough;
+Components['underline'] = SvgUnderline;
+Components['double_underline'] = SvgDoubleUnderline;
+Components['border_left'] = SvgBorderLeft;
+Components['border_right'] = SvgBorderRight;
+Components['border_bottom'] = SvgBorderBottom;
+Components['border_top'] = SvgBorderTop;
+Components['all_borders'] = SvgAllBorders;
+Components['no_border'] = SvgNoBorder;
+Components['text_align_center'] = SvgTextAlignCenter;
+Components['text_align_left'] = SvgTextAlignLeft;
+Components['text_align_right'] = SvgTextAlignRight;
+Components['text_color'] = SvgTextColor;
+Components['fill_color'] = SvgFillColor;
 Components['info'] = SvgInfoIcon;
 Components['calendar_icon'] = SvgCalendarIcon;
 Components['hide_icon'] = SvgHideIcon;
@@ -390,9 +464,21 @@ Components['app_switch'] = SvgAppSwitch;
 Components['user_profile'] = SvgUserProfile;
 Components['continue_without_signin'] = SvgContinueWithoutSign;
 Components['cloud_server_host'] = SvgCloudServerHostIcon;
-
-var css_248z$R = ".ff-icon-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.ff-icon-click {\n  cursor: pointer;\n  padding: 4px;\n  box-sizing: content-box;\n}\n.ff-icon-click:hover {\n  border-radius: 50%;\n  background-color: var(--drawer-footer-bg);\n  box-shadow: 0px 0px 16px var(--toggle-strip-shadow);\n}\n.ff-icon-click:hover > svg {\n  color: var(--brand-color);\n}\n\n.ff-icon-disabled {\n  cursor: no-drop;\n}\n.ff-icon-disabled > svg {\n  color: var(--toggle-strip-color);\n}\n.ff-icon-disabled:hover {\n  box-shadow: none;\n}\n.ff-icon-disabled:hover > svg {\n  color: var(--toggle-strip-color);\n}";
-styleInject(css_248z$R);
+Components['notification_icon'] = SvgNotificationIcon;
+Components['nlp_help_icon'] = SvgNlpHelpIcon;
+Components['update_icon'] = SvgUpdateIcon;
+Components['add_file'] = SvgAddFile;
+Components['clone_icon'] = SvgCloneIcon;
+Components['move_icon'] = SvgMoveIcon;
+Components['jira'] = SvgJira;
+Components['history'] = SvgHistoryIcon;
+Components['linked_defects'] = SvgLinkedDefects;
+Components['no_access_icon'] = SvgNoAccessIcon;
+Components['full_access_icon'] = SvgFullAccessIcon;
+Components['view_access_icon'] = SvgViewAccessIcon;
+
+var css_248z$T = ".ff-icon-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.ff-icon-click {\n  cursor: pointer;\n  padding: 4px;\n  box-sizing: content-box;\n}\n.ff-icon-click:hover {\n  border-radius: 4px;\n  background-color: var(--ff-icon-hover-fill-color);\n}\n.ff-icon-click:hover > svg {\n  color: var(--brand-color);\n}\n\n.ff-icon-disabled {\n  cursor: no-drop;\n}\n.ff-icon-disabled > svg {\n  color: var(--toggle-strip-color);\n}\n.ff-icon-disabled:hover {\n  box-shadow: none;\n}\n.ff-icon-disabled:hover > svg {\n  color: var(--toggle-strip-color);\n}";
+styleInject(css_248z$T);
 
 const Icon = /*#__PURE__*/React.forwardRef(({
   name,
@@ -476,8 +562,8 @@ const Button$1 = /*#__PURE__*/React.forwardRef(({
   });
 });
 
-var css_248z$Q = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-title {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-drawer-container .ff-overlay {\n  position: fixed;\n  inset: 0;\n  background-color: var(--drawer-title-color);\n  opacity: 0.5;\n}\n.ff-drawer-container .ff-drawer {\n  position: fixed;\n  right: 0;\n  top: 80px;\n  bottom: 0;\n  min-width: 450px;\n  background-color: var(--primary-button-text-color);\n  z-index: 999;\n  transform: translateX(100%);\n  opacity: 0;\n}\n.ff-drawer-container .ff-drawer--open {\n  transform: translateX(0);\n  opacity: 1;\n}\n.ff-drawer-container .ff-drawer--small {\n  width: 444px;\n}\n.ff-drawer-container .ff-drawer--medium {\n  width: 666px;\n}\n.ff-drawer-container .ff-drawer--large {\n  width: 888px;\n}\n.ff-drawer-container .ff-drawer--x-large {\n  width: calc(100vw - 10px);\n}\n.ff-drawer-container .ff-drawer--open, .ff-drawer-container .ff-drawer--medium, .ff-drawer-container .ff-drawer--large, .ff-drawer-container .ff-drawer--x-large {\n  transition: all 0.4s ease-in-out;\n  border-radius: 5px;\n  border: 1px solid var(--border-color);\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header {\n  padding: 4px 8px 4px 8px;\n  display: flex;\n  gap: 10px;\n  border-bottom: 1px solid var(--border-color);\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-title {\n  font-weight: 600;\n  color: var(--drawer-title-color);\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-close-icon {\n  height: 16px;\n  width: 16px;\n  background-color: var(--button-bg-color);\n  border-radius: 4px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  height: 24px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section .ff-action-button {\n  display: flex;\n  align-items: center;\n  gap: 5px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section .ff-action-button .ff-expand-collapse-button {\n  cursor: pointer;\n  height: 24px;\n  width: 24px;\n  background-color: var(--button-bg-color);\n  outline: none;\n  border: none;\n  margin: 0;\n  border: 1px solid transparent;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 8px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-body {\n  background-color: var(--drawer-footer-bg);\n  height: calc(100vh - 76px);\n  overflow: hidden auto;\n}\n.ff-drawer-container .ff-drawer .no-footer {\n  height: 100vh;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-footer {\n  height: 24px;\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  padding: 4px 8px 4px 8px;\n  display: flex;\n  justify-content: space-between;\n  border-top: 1px solid var(--drawer-footer-border);\n}\n.ff-drawer-container .ff-drawer .ff-drawer-footer .button-container {\n  display: flex;\n  justify-content: flex-end;\n  gap: 10px;\n}";
-styleInject(css_248z$Q);
+var css_248z$S = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-title {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-drawer-container .ff-overlay {\n  position: fixed;\n  inset: 0;\n  background-color: var(--drawer-title-color);\n  opacity: 0.5;\n}\n.ff-drawer-container .ff-drawer {\n  position: fixed;\n  right: 0;\n  bottom: 0;\n  min-width: 450px;\n  background-color: var(--primary-button-text-color);\n  z-index: 999;\n  transform: translateX(100%);\n  opacity: 0;\n}\n.ff-drawer-container .ff-drawer--open {\n  transform: translateX(0);\n  opacity: 1;\n}\n.ff-drawer-container .ff-drawer--small {\n  width: 444px;\n}\n.ff-drawer-container .ff-drawer--medium {\n  width: 666px;\n}\n.ff-drawer-container .ff-drawer--large {\n  width: 888px;\n}\n.ff-drawer-container .ff-drawer--x-large {\n  width: calc(100vw - 10px);\n}\n.ff-drawer-container .ff-drawer--open, .ff-drawer-container .ff-drawer--medium, .ff-drawer-container .ff-drawer--large, .ff-drawer-container .ff-drawer--x-large {\n  transition: all 0.4s ease-in-out;\n  border-radius: 5px;\n  border: 1px solid var(--border-color);\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header {\n  padding: 4px 8px 4px 8px;\n  display: flex;\n  gap: 10px;\n  border-bottom: 1px solid var(--border-color);\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-title {\n  font-weight: 600;\n  color: var(--drawer-title-color);\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-close-icon {\n  height: 16px;\n  width: 16px;\n  background-color: var(--button-bg-color);\n  border-radius: 4px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n  height: 24px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section .ff-action-button {\n  display: flex;\n  align-items: center;\n  gap: 5px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-header .ff-drawer-action-section .ff-action-button .ff-expand-collapse-button {\n  cursor: pointer;\n  height: 24px;\n  width: 24px;\n  background-color: var(--button-bg-color);\n  outline: none;\n  border: none;\n  margin: 0;\n  border: 1px solid transparent;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 8px;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-body {\n  background-color: var(--drawer-footer-bg);\n  height: calc(100vh - 76px);\n  overflow: hidden auto;\n}\n.ff-drawer-container .ff-drawer .no-footer {\n  height: 100vh;\n}\n.ff-drawer-container .ff-drawer .ff-drawer-footer {\n  height: 24px;\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  padding: 4px 8px 4px 8px;\n  display: flex;\n  justify-content: space-between;\n  border-top: 1px solid var(--drawer-footer-border);\n}\n.ff-drawer-container .ff-drawer .ff-drawer-footer .button-container {\n  display: flex;\n  justify-content: flex-end;\n  gap: 10px;\n}";
+styleInject(css_248z$S);
 
 function useEscapeKey(key) {
   return callBack => {
@@ -496,8 +582,8 @@ function useEscapeKey(key) {
   };
 }
 
-var css_248z$P = ":root {\n  --button-bg-color: #f6ebff;\n  --brand-color: #71347b;\n  --text-color: #1e161f;\n  --description-text: #7a7a7a;\n  --click-able-text-color: #71347b;\n  --icons-default-color: #71347b;\n  --border-color: #f0e7f4;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --hover-color: #f7ebff;\n  --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n  --slider-table-color: rgba(212, 176, 228, 0.1490196078);\n  --drawer-footer-bg: #ffffff;\n  --drawer-footer-border: #f0e7f4;\n  --text-bg-highlight: #f5fb00;\n  --tooltip-bg-color: #1e161f;\n  --tooltip-text-color: #ffffff;\n  --toggle-strip-color: #cfd1e2;\n  --toggle-strip-active: #71347b;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-button-bg-color: #ffffff;\n  --toggle-disable-icon-color: #767994;\n  --text-area-default-color: #747474;\n  --add-icon-hover-color: #431b4a;\n  --arrow-button-bg-color: #ffffff;\n  --arrows-button-border-color: #ded1e5;\n  --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n  --chip-fill-color: #f9d5ff;\n  --chip-text-color: #1e161f;\n  --file-drop-zone-default-fill-color: rgba(113, 52, 123, 0.1019607843);\n  --file-drop-zone-default-text-color: #1e161f;\n  --file-drop-zone-selected-fill-color: rgba(113, 52, 123, 0.2);\n  --file-drop-zone-selected-text-color: #1e161f;\n  --icon-color: #71347b;\n  --default-icon-color: #a3a3a3;\n  --tree-connecting-lines-color: #d7b5e3;\n  --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-hover: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n  --primary-button-disable: linear-gradient(180deg, #46164d 0%, #71347b 100%);\n  --primary-button-text-color: #ffffff;\n  --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n  --secondary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-text-color: #46164d;\n  --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-color: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n  --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n  --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n  --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n  --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n  --error: #e42525;\n  --drawer-title-color: #252c37;\n  --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n  --error_light: #e42525;\n  --ff-success: #079455;\n  --ff-warning: #f79009;\n  --ff-header-text-color: #fdfaff;\n  --ff-header-submenu-text-color: #666468;\n  --ff-header-submenu-highlight-text-color: #170328;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --ff-mini-modal-border: #ffffff;\n  --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n  --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n  --ff-error-light: #e42525;\n  --ff-chips-fill-color: #f9d5ff;\n  --ff-chips-blur-color: #575757;\n  --ff-chip-bg: #ffffff;\n  --ff-chip-text-color: #1e161f;\n  --ff-mini-modal-footer-background: #aeb0c0;\n  --input-default-border-color: #a3a3a3;\n  --input-hover-border-color: #1e161f;\n  --input-default-label-color: #747474;\n  --input-label-bg-color: #ffffff;\n  --input-active-text-color: #71347b;\n  --input-error-text-color: #e42525;\n  --tabs-label-default-color: #7a7a7a;\n  --tabs-label-active-color: #71347b;\n  --tabs-border-color: #f1ebf2;\n  --tabs-bg-color: #ede6f2;\n  --tab-bg-color: #ffffff;\n  --toast-close-icon-wrapper-bg: #fafafa;\n  --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n  --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n  --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n  --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n  --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n  --option-card-border-color: #ded1e5;\n  --option-card-bg-color: #ffffff;\n  --checkbox-bg-color: #fbfdff;\n  --checkbox-border-color: #b5b5b5;\n  --checkbox-partial-color: #ffffff;\n  --checkbox-hover-color: #f7edff;\n  --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n  --multi-select-label-bg: #ffffff;\n  --text-color-light: rgba(30, 22, 31, 0.5019607843);\n  --radio-button-border: #b5b5b5;\n  --radio-button-hover: #d3d3d3;\n  --menu-variant-dark-icon-color: #ffffff;\n  --menu-option-icon-color: #ffffff;\n  --menu-option-icon-clicked: #71347b;\n  --delete-text-color: #c50303;\n  --status-success-bg-color: #c6efcd;\n  --status-success-text-color: #016102;\n  --status-warning-bg-color: #ffe380;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-bg-color: #c4c3c3;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --status-button-bg-passed: #c6efcd;\n  --status-button-bg-failed: #f7d9d9;\n  --status-button-bg-running: #ecedf8;\n  --status-button-bg-skipped: #c4c3c3;\n  --status-button-bg-warning: #ffb803;\n  --status-button-bg-terminated: #f7d9d9;\n  --status-button-bg-partiallyExecuted: #dee7f1;\n  --status-button-bg-aborted: #f7d9d9;\n  --status-button-bg-notExecuted: #f7d9d9;\n  --status-button-text-passed: #016102;\n  --status-button-text-failed: #c50303;\n  --status-button-text-running: #434db8;\n  --status-button-text-skipped: #3c3838;\n  --status-button-text-warning: #ffffff;\n  --status-button-text-terminated: #c50303;\n  --status-button-text-partiallyExecuted: #0d69d4;\n  --status-button-text-aborted: #c50303;\n  --status-button-text-notExecuted: #c50303;\n  --ff-select-option-border-color: #ded1e5;\n  --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n  --ff-select-background-color: #ffffff;\n  --ff-select-scroll-thumb-color: #d9d9d9;\n  --ff-select-scroll-track-bg: #f1f1f1;\n  --ff-select-scroll-thumb-hover: #b8b8b8;\n  --ff-select-text-color: #14041c;\n  --ff-select-option-hover-color: #f7ebff;\n  --ff-select-default-color: #747474;\n  --ff-select-border-color: #a3a3a3;\n  --ff-select-brand-color: #71347b;\n  --ff-select-text-hover-color: #1e161f;\n  --ff-search-filed-clear-text: #71347b;\n  --ff-search-filed-placeholder-text: #a3a3a3;\n  --ff-search-filed-close-Icon: #14041c;\n  --ff-paper-background-color: #f5f5f5;\n  --ff-paper-dark-background-color: #d1c4e9;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --disabled-primary-color: #f9f9f9;\n  --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n  --license_expireSoon_color: #ba7422;\n  --license_active_color: #268735;\n  --license_expired_color: #e34242;\n  --license_header_text_color: #592f7c;\n  --license_active_status_color: #518e18;\n  --license_expired_status_color: #ab3425;\n  --pie-chart-border-color: #b6b6b6;\n  --modal-header-text-color: #ffc600;\n  --switch-license-text-color: #61296a;\n  --switch-license-header-text-color: #610b86;\n  --ff-machine-input-field-border-color: #f1ebf2;\n  --ff-machine-input-field-text-color: #1e161f;\n  --ff-connecting-branch-color: #71347b;\n  --ff-connecting-branch-modal-header: #71347b;\n  --ff-connecting-branch-modal-border: #e0e0e0;\n  --ff-connecting-branch-scope-color: #079455;\n  --ff-connecting-branch-delete-color: #e42525;\n}\n\n:root {\n  --brand-color: #71347b;\n  --text-color: #e8e0e9;\n  --description-text: #d9d9d9;\n  --click-able-text-color: #e8e0e9;\n  --icons-default-color: #e8e0e9;\n  --border-color: #333234;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --hover-color: #f7ebff;\n  --pop-up-background-blur: rgba(18, 18, 18, 0.6);\n  --slider-table-color: #272428;\n  --drawer-footer-bg: rgba(27, 24, 28, 0.6);\n  --drawer-footer-border: #333234;\n  --text-bg-highlight: #f5fb00;\n  --tooltip-bg-color: #2a2a2a;\n  --tooltip-text-color: #ffffff;\n  --toggle-strip-color: #cfd1e2;\n  --toggle-strip-active-color: #71347b;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-button-bg-color: #ffffff;\n  --toggle-disable-icon-color: #767994;\n  --text-area-default-color: #747474;\n  --add-icon-hover-color: #431b4a;\n  --arrow-button-bg-color: #ffffff;\n  --arrows-button-border-color: #ded1e5;\n  --overlay-bg: rgba(18, 18, 18, 0.6);\n  --chip-fill-color: #f9d5ff;\n  --chip-text-color: #1e161f;\n  --file-drop-zone-default-fill-color: rgba(113, 52, 123, 0.1019607843);\n  --file-drop-zone-default-text-color: #1e161f;\n  --file-drop-zone-selected-fill-color: rgba(113, 52, 123, 0.2);\n  --file-drop-zone-selected-text-color: #1e161f;\n  --icon-color: #71347b;\n  --tree-connecting-lines-color: #d7b5e3;\n  --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-hover: linear-gradient(188.79deg, #7c4685 2.94%, #582d5f 93.09%);\n  --primary-button-disable: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-text-color: #ffffff;\n  --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n  --secondary-button-border: linear-gradient(360deg, #46164d 0%, #71347b 100%);\n  --secondary-button-text-color: #71347b;\n  --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-color: linear-gradient(180deg, rgba(70, 22, 77, 0.05) 0%, rgba(113, 52, 123, 0.05) 100%);\n  --tertiary-button-hover: linear-gradient(180deg, rgba(70, 22, 77, 0.1) 0%, rgba(113, 52, 123, 0.1) 100%);\n  --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n  --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n  --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n  --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n  --drawer-title-color: #252c37;\n  --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n  --error_light: #e42525;\n  --ff-success: #079455;\n  --ff-warning: #f79009;\n  --ff-header-text-color: #fdfaff;\n  --ff-header-submenu-text-color: #666468;\n  --ff-header-submenu-highlight-text-color: #170328;\n  --default-icon-color: #a3a3a3;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --ff-mini-modal-border: #ffffff;\n  --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n  --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n  --ff-error-light: #e42525;\n  --ff-chips-fill-color: #f9d5ff;\n  --ff-chips-blur-color: #575757;\n  --ff-chip-bg: #ffffff;\n  --ff-chip-text-color: #1e161f;\n  --ff-mini-modal-footer-background: #aeb0c0;\n  --input-default-border-color: #a3a3a3;\n  --input-hover-border-color: #1e161f;\n  --input-default-label-color: #747474;\n  --input-label-bg-color: #ffffff;\n  --input-active-text-color: #71347b;\n  --input-error-text-color: #e42525;\n  --tabs-label-default-color: #7a7a7a;\n  --tabs-label-active-color: #71347b;\n  --tabs-border-color: #f1ebf2;\n  --tabs-bg-color: #ede6f2;\n  --tab-bg-color: #ffffff;\n  --toast-close-icon-wrapper-bg: #fafafa;\n  --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n  --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n  --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n  --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n  --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n  --option-card-border-color: #ded1e5;\n  --option-card-bg-color: #ffffff;\n  --checkbox-bg-color: #fbfdff;\n  --checkbox-border-color: #b5b5b5;\n  --checkbox-partial-color: #ffffff;\n  --checkbox-hover-color: #f7edff;\n  --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n  --multi-select-label-bg: #ffffff;\n  --text-color-light: rgba(30, 22, 31, 0.5019607843);\n  --radio-button-border: #b5b5b5;\n  --radio-button-hover: #d3d3d3;\n  --menu-variant-dark-icon-color: #ffffff;\n  --menu-option-icon-color: #ffffff;\n  --menu-option-icon-clicked: #71347b;\n  --delete-text-color: #c50303;\n  --status-success-bg-color: #c6efcd;\n  --status-success-text-color: #016102;\n  --status-warning-bg-color: #ffe380;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-bg-color: #c4c3c3;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --status-button-bg-passed: #c6efcd;\n  --status-button-bg-failed: #f7d9d9;\n  --status-button-bg-running: #ecedf8;\n  --status-button-bg-skipped: #c4c3c3;\n  --status-button-bg-warning: #ffb803;\n  --status-button-bg-terminated: #f7d9d9;\n  --status-button-bg-partiallyExecuted: #dee7f1;\n  --status-button-bg-aborted: #f7d9d9;\n  --status-button-bg-notExecuted: #f7d9d9;\n  --status-button-text-passed: #016102;\n  --status-button-text-failed: #c50303;\n  --status-button-text-running: #434db8;\n  --status-button-text-skipped: #3c3838;\n  --status-button-text-warning: #ffffff;\n  --status-button-text-terminated: #c50303;\n  --status-button-text-partiallyExecuted: #0d69d4;\n  --status-button-text-aborted: #c50303;\n  --status-button-text-notExecuted: #c50303;\n  --ff-select-option-border-color: #ded1e5;\n  --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n  --ff-select-background-color: #ffffff;\n  --ff-select-scroll-thumb-color: #d9d9d9;\n  --ff-select-scroll-track-bg: #f1f1f1;\n  --ff-select-scroll-thumb-hover: #b8b8b8;\n  --ff-select-text-color: #14041c;\n  --ff-select-option-hover-color: #f7ebff;\n  --ff-select-default-color: #747474;\n  --ff-select-border-color: #a3a3a3;\n  --ff-select-brand-color: #71347b;\n  --ff-select-text-hover-color: #1e161f;\n  --ff-search-filed-clear-text: #71347b;\n  --ff-search-filed-placeholder-text: #a3a3a3;\n  --ff-search-filed-close-Icon: #14041c;\n  --ff-paper-background-color: #f5f5f5;\n  --ff-paper-dark-background-color: #d1c4e9;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --disabled-primary-color: #f9f9f9;\n  --license_expireSoon_color: #ba7422;\n  --license_active_color: #268735;\n  --license_expired_color: #e34242;\n  --license_header_text_color: #592f7c;\n  --license_active_status_color: #518e18;\n  --license_expired_status_color: #ab3425;\n  --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n  --pie-chart-border-color: #b6b6b6;\n  --button-bg-color: #f6ebff;\n  --modal-header-text-color: #ffc600;\n  --switch-license-text-color: #61296a;\n  --switch-license-header-text-color: #610b86;\n}\n\n.ff-light-theme {\n  --button-bg-color: #f6ebff;\n  --brand-color: #71347b;\n  --text-color: #1e161f;\n  --description-text: #7a7a7a;\n  --click-able-text-color: #71347b;\n  --icons-default-color: #71347b;\n  --border-color: #f0e7f4;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --hover-color: #f7ebff;\n  --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n  --slider-table-color: rgba(212, 176, 228, 0.1490196078);\n  --drawer-footer-bg: #ffffff;\n  --drawer-footer-border: #f0e7f4;\n  --text-bg-highlight: #f5fb00;\n  --tooltip-bg-color: #1e161f;\n  --tooltip-text-color: #ffffff;\n  --toggle-strip-color: #cfd1e2;\n  --toggle-strip-active: #71347b;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-button-bg-color: #ffffff;\n  --toggle-disable-icon-color: #767994;\n  --text-area-default-color: #747474;\n  --add-icon-hover-color: #431b4a;\n  --arrow-button-bg-color: #ffffff;\n  --arrows-button-border-color: #ded1e5;\n  --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n  --chip-fill-color: #f9d5ff;\n  --chip-text-color: #1e161f;\n  --file-drop-zone-default-fill-color: rgba(113, 52, 123, 0.1019607843);\n  --file-drop-zone-default-text-color: #1e161f;\n  --file-drop-zone-selected-fill-color: rgba(113, 52, 123, 0.2);\n  --file-drop-zone-selected-text-color: #1e161f;\n  --icon-color: #71347b;\n  --default-icon-color: #a3a3a3;\n  --tree-connecting-lines-color: #d7b5e3;\n  --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-hover: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n  --primary-button-disable: linear-gradient(180deg, #46164d 0%, #71347b 100%);\n  --primary-button-text-color: #ffffff;\n  --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n  --secondary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-text-color: #46164d;\n  --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-color: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n  --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n  --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n  --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n  --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n  --error: #e42525;\n  --drawer-title-color: #252c37;\n  --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n  --error_light: #e42525;\n  --ff-success: #079455;\n  --ff-warning: #f79009;\n  --ff-header-text-color: #fdfaff;\n  --ff-header-submenu-text-color: #666468;\n  --ff-header-submenu-highlight-text-color: #170328;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --ff-mini-modal-border: #ffffff;\n  --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n  --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n  --ff-error-light: #e42525;\n  --ff-chips-fill-color: #f9d5ff;\n  --ff-chips-blur-color: #575757;\n  --ff-chip-bg: #ffffff;\n  --ff-chip-text-color: #1e161f;\n  --ff-mini-modal-footer-background: #aeb0c0;\n  --input-default-border-color: #a3a3a3;\n  --input-hover-border-color: #1e161f;\n  --input-default-label-color: #747474;\n  --input-label-bg-color: #ffffff;\n  --input-active-text-color: #71347b;\n  --input-error-text-color: #e42525;\n  --tabs-label-default-color: #7a7a7a;\n  --tabs-label-active-color: #71347b;\n  --tabs-border-color: #f1ebf2;\n  --tabs-bg-color: #ede6f2;\n  --tab-bg-color: #ffffff;\n  --toast-close-icon-wrapper-bg: #fafafa;\n  --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n  --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n  --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n  --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n  --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n  --option-card-border-color: #ded1e5;\n  --option-card-bg-color: #ffffff;\n  --checkbox-bg-color: #fbfdff;\n  --checkbox-border-color: #b5b5b5;\n  --checkbox-partial-color: #ffffff;\n  --checkbox-hover-color: #f7edff;\n  --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n  --multi-select-label-bg: #ffffff;\n  --text-color-light: rgba(30, 22, 31, 0.5019607843);\n  --radio-button-border: #b5b5b5;\n  --radio-button-hover: #d3d3d3;\n  --menu-variant-dark-icon-color: #ffffff;\n  --menu-option-icon-color: #ffffff;\n  --menu-option-icon-clicked: #71347b;\n  --delete-text-color: #c50303;\n  --status-success-bg-color: #c6efcd;\n  --status-success-text-color: #016102;\n  --status-warning-bg-color: #ffe380;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-bg-color: #c4c3c3;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --status-button-bg-passed: #c6efcd;\n  --status-button-bg-failed: #f7d9d9;\n  --status-button-bg-running: #ecedf8;\n  --status-button-bg-skipped: #c4c3c3;\n  --status-button-bg-warning: #ffb803;\n  --status-button-bg-terminated: #f7d9d9;\n  --status-button-bg-partiallyExecuted: #dee7f1;\n  --status-button-bg-aborted: #f7d9d9;\n  --status-button-bg-notExecuted: #f7d9d9;\n  --status-button-text-passed: #016102;\n  --status-button-text-failed: #c50303;\n  --status-button-text-running: #434db8;\n  --status-button-text-skipped: #3c3838;\n  --status-button-text-warning: #ffffff;\n  --status-button-text-terminated: #c50303;\n  --status-button-text-partiallyExecuted: #0d69d4;\n  --status-button-text-aborted: #c50303;\n  --status-button-text-notExecuted: #c50303;\n  --ff-select-option-border-color: #ded1e5;\n  --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n  --ff-select-background-color: #ffffff;\n  --ff-select-scroll-thumb-color: #d9d9d9;\n  --ff-select-scroll-track-bg: #f1f1f1;\n  --ff-select-scroll-thumb-hover: #b8b8b8;\n  --ff-select-text-color: #14041c;\n  --ff-select-option-hover-color: #f7ebff;\n  --ff-select-default-color: #747474;\n  --ff-select-border-color: #a3a3a3;\n  --ff-select-brand-color: #71347b;\n  --ff-select-text-hover-color: #1e161f;\n  --ff-search-filed-clear-text: #71347b;\n  --ff-search-filed-placeholder-text: #a3a3a3;\n  --ff-search-filed-close-Icon: #14041c;\n  --ff-paper-background-color: #f5f5f5;\n  --ff-paper-dark-background-color: #d1c4e9;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --disabled-primary-color: #f9f9f9;\n  --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n  --license_expireSoon_color: #ba7422;\n  --license_active_color: #268735;\n  --license_expired_color: #e34242;\n  --license_header_text_color: #592f7c;\n  --license_active_status_color: #518e18;\n  --license_expired_status_color: #ab3425;\n  --pie-chart-border-color: #b6b6b6;\n  --modal-header-text-color: #ffc600;\n  --switch-license-text-color: #61296a;\n  --switch-license-header-text-color: #610b86;\n  --ff-machine-input-field-border-color: #f1ebf2;\n  --ff-machine-input-field-text-color: #1e161f;\n  --ff-connecting-branch-color: #71347b;\n  --ff-connecting-branch-modal-header: #71347b;\n  --ff-connecting-branch-modal-border: #e0e0e0;\n  --ff-connecting-branch-scope-color: #079455;\n  --ff-connecting-branch-delete-color: #e42525;\n}\n\n.ff-dark-theme {\n  --brand-color: #71347b;\n  --text-color: #e8e0e9;\n  --description-text: #d9d9d9;\n  --click-able-text-color: #e8e0e9;\n  --icons-default-color: #e8e0e9;\n  --border-color: #333234;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --hover-color: #f7ebff;\n  --pop-up-background-blur: rgba(18, 18, 18, 0.6);\n  --slider-table-color: #272428;\n  --drawer-footer-bg: rgba(27, 24, 28, 0.6);\n  --drawer-footer-border: #333234;\n  --text-bg-highlight: #f5fb00;\n  --tooltip-bg-color: #2a2a2a;\n  --tooltip-text-color: #ffffff;\n  --toggle-strip-color: #cfd1e2;\n  --toggle-strip-active-color: #71347b;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-button-bg-color: #ffffff;\n  --toggle-disable-icon-color: #767994;\n  --text-area-default-color: #747474;\n  --add-icon-hover-color: #431b4a;\n  --arrow-button-bg-color: #ffffff;\n  --arrows-button-border-color: #ded1e5;\n  --overlay-bg: rgba(18, 18, 18, 0.6);\n  --chip-fill-color: #f9d5ff;\n  --chip-text-color: #1e161f;\n  --file-drop-zone-default-fill-color: rgba(113, 52, 123, 0.1019607843);\n  --file-drop-zone-default-text-color: #1e161f;\n  --file-drop-zone-selected-fill-color: rgba(113, 52, 123, 0.2);\n  --file-drop-zone-selected-text-color: #1e161f;\n  --icon-color: #71347b;\n  --tree-connecting-lines-color: #d7b5e3;\n  --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-hover: linear-gradient(188.79deg, #7c4685 2.94%, #582d5f 93.09%);\n  --primary-button-disable: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-text-color: #ffffff;\n  --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n  --secondary-button-border: linear-gradient(360deg, #46164d 0%, #71347b 100%);\n  --secondary-button-text-color: #71347b;\n  --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-color: linear-gradient(180deg, rgba(70, 22, 77, 0.05) 0%, rgba(113, 52, 123, 0.05) 100%);\n  --tertiary-button-hover: linear-gradient(180deg, rgba(70, 22, 77, 0.1) 0%, rgba(113, 52, 123, 0.1) 100%);\n  --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n  --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n  --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n  --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n  --drawer-title-color: #252c37;\n  --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n  --error_light: #e42525;\n  --ff-success: #079455;\n  --ff-warning: #f79009;\n  --ff-header-text-color: #fdfaff;\n  --ff-header-submenu-text-color: #666468;\n  --ff-header-submenu-highlight-text-color: #170328;\n  --default-icon-color: #a3a3a3;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --ff-mini-modal-border: #ffffff;\n  --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n  --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n  --ff-error-light: #e42525;\n  --ff-chips-fill-color: #f9d5ff;\n  --ff-chips-blur-color: #575757;\n  --ff-chip-bg: #ffffff;\n  --ff-chip-text-color: #1e161f;\n  --ff-mini-modal-footer-background: #aeb0c0;\n  --input-default-border-color: #a3a3a3;\n  --input-hover-border-color: #1e161f;\n  --input-default-label-color: #747474;\n  --input-label-bg-color: #ffffff;\n  --input-active-text-color: #71347b;\n  --input-error-text-color: #e42525;\n  --tabs-label-default-color: #7a7a7a;\n  --tabs-label-active-color: #71347b;\n  --tabs-border-color: #f1ebf2;\n  --tabs-bg-color: #ede6f2;\n  --tab-bg-color: #ffffff;\n  --toast-close-icon-wrapper-bg: #fafafa;\n  --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n  --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n  --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n  --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n  --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n  --option-card-border-color: #ded1e5;\n  --option-card-bg-color: #ffffff;\n  --checkbox-bg-color: #fbfdff;\n  --checkbox-border-color: #b5b5b5;\n  --checkbox-partial-color: #ffffff;\n  --checkbox-hover-color: #f7edff;\n  --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n  --multi-select-label-bg: #ffffff;\n  --text-color-light: rgba(30, 22, 31, 0.5019607843);\n  --radio-button-border: #b5b5b5;\n  --radio-button-hover: #d3d3d3;\n  --menu-variant-dark-icon-color: #ffffff;\n  --menu-option-icon-color: #ffffff;\n  --menu-option-icon-clicked: #71347b;\n  --delete-text-color: #c50303;\n  --status-success-bg-color: #c6efcd;\n  --status-success-text-color: #016102;\n  --status-warning-bg-color: #ffe380;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-bg-color: #c4c3c3;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --status-button-bg-passed: #c6efcd;\n  --status-button-bg-failed: #f7d9d9;\n  --status-button-bg-running: #ecedf8;\n  --status-button-bg-skipped: #c4c3c3;\n  --status-button-bg-warning: #ffb803;\n  --status-button-bg-terminated: #f7d9d9;\n  --status-button-bg-partiallyExecuted: #dee7f1;\n  --status-button-bg-aborted: #f7d9d9;\n  --status-button-bg-notExecuted: #f7d9d9;\n  --status-button-text-passed: #016102;\n  --status-button-text-failed: #c50303;\n  --status-button-text-running: #434db8;\n  --status-button-text-skipped: #3c3838;\n  --status-button-text-warning: #ffffff;\n  --status-button-text-terminated: #c50303;\n  --status-button-text-partiallyExecuted: #0d69d4;\n  --status-button-text-aborted: #c50303;\n  --status-button-text-notExecuted: #c50303;\n  --ff-select-option-border-color: #ded1e5;\n  --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n  --ff-select-background-color: #ffffff;\n  --ff-select-scroll-thumb-color: #d9d9d9;\n  --ff-select-scroll-track-bg: #f1f1f1;\n  --ff-select-scroll-thumb-hover: #b8b8b8;\n  --ff-select-text-color: #14041c;\n  --ff-select-option-hover-color: #f7ebff;\n  --ff-select-default-color: #747474;\n  --ff-select-border-color: #a3a3a3;\n  --ff-select-brand-color: #71347b;\n  --ff-select-text-hover-color: #1e161f;\n  --ff-search-filed-clear-text: #71347b;\n  --ff-search-filed-placeholder-text: #a3a3a3;\n  --ff-search-filed-close-Icon: #14041c;\n  --ff-paper-background-color: #f5f5f5;\n  --ff-paper-dark-background-color: #d1c4e9;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --disabled-primary-color: #f9f9f9;\n  --license_expireSoon_color: #ba7422;\n  --license_active_color: #268735;\n  --license_expired_color: #e34242;\n  --license_header_text_color: #592f7c;\n  --license_active_status_color: #518e18;\n  --license_expired_status_color: #ab3425;\n  --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n  --pie-chart-border-color: #b6b6b6;\n  --button-bg-color: #f6ebff;\n  --modal-header-text-color: #ffc600;\n  --switch-license-text-color: #61296a;\n  --switch-license-header-text-color: #610b86;\n}";
-styleInject(css_248z$P);
+var css_248z$R = ":root {\n  --button-bg-color: #f6ebff;\n  --brand-color: #71347b;\n  --text-color: #1e161f;\n  --description-text: #7a7a7a;\n  --click-able-text-color: #71347b;\n  --icons-default-color: #71347b;\n  --border-color: #f0e7f4;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --hover-color: #f7ebff;\n  --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n  --slider-table-color: rgba(212, 176, 228, 0.1490196078);\n  --drawer-footer-bg: #ffffff;\n  --drawer-footer-border: #f0e7f4;\n  --text-bg-highlight: #f5fb00;\n  --tooltip-bg-color: #1e161f;\n  --tooltip-text-color: #ffffff;\n  --toggle-strip-color: #cfd1e2;\n  --toggle-strip-active: #71347b;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-button-bg-color: #ffffff;\n  --toggle-disable-icon-color: #767994;\n  --text-area-default-color: #747474;\n  --add-icon-hover-color: #431b4a;\n  --arrow-button-bg-color: #ffffff;\n  --arrows-button-border-color: #ded1e5;\n  --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n  --chip-fill-color: #f9d5ff;\n  --chip-text-color: #1e161f;\n  --file-drop-zone-default-fill-color: rgba(113, 52, 123, 0.1019607843);\n  --file-drop-zone-default-text-color: #1e161f;\n  --file-drop-zone-selected-fill-color: rgba(113, 52, 123, 0.2);\n  --file-drop-zone-selected-text-color: #1e161f;\n  --icon-color: #71347b;\n  --default-icon-color: #a3a3a3;\n  --tree-connecting-lines-color: #d7b5e3;\n  --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-hover: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n  --primary-button-disable: linear-gradient(180deg, #46164d 0%, #71347b 100%);\n  --primary-button-text-color: #ffffff;\n  --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n  --secondary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-text-color: #46164d;\n  --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-color: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n  --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n  --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n  --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n  --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n  --error: #e42525;\n  --drawer-title-color: #252c37;\n  --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n  --error_light: #e42525;\n  --ff-success: #079455;\n  --ff-warning: #f79009;\n  --ff-header-text-color: #fdfaff;\n  --ff-header-submenu-text-color: #666468;\n  --ff-header-submenu-highlight-text-color: #170328;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --ff-mini-modal-border: #ffffff;\n  --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n  --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n  --ff-error-light: #e42525;\n  --ff-chips-fill-color: #f9d5ff;\n  --ff-chips-blur-color: #575757;\n  --ff-chip-bg: #ffffff;\n  --ff-chip-text-color: #1e161f;\n  --ff-mini-modal-footer-background: #aeb0c0;\n  --input-default-border-color: #a3a3a3;\n  --input-hover-border-color: #1e161f;\n  --input-default-label-color: #747474;\n  --input-label-bg-color: #ffffff;\n  --input-active-text-color: #71347b;\n  --input-error-text-color: #e42525;\n  --tabs-label-default-color: #7a7a7a;\n  --tabs-label-active-color: #71347b;\n  --tabs-border-color: #f1ebf2;\n  --tabs-bg-color: #ede6f2;\n  --tab-bg-color: #ffffff;\n  --toast-close-icon-wrapper-bg: #fafafa;\n  --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n  --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n  --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n  --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n  --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n  --option-card-border-color: #ded1e5;\n  --option-card-bg-color: #ffffff;\n  --checkbox-bg-color: #fbfdff;\n  --checkbox-border-color: #b5b5b5;\n  --checkbox-partial-color: #ffffff;\n  --checkbox-hover-color: #f7edff;\n  --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n  --multi-select-label-bg: #ffffff;\n  --text-color-light: rgba(30, 22, 31, 0.5019607843);\n  --radio-button-border: #b5b5b5;\n  --radio-button-hover: #d3d3d3;\n  --menu-variant-dark-icon-color: #ffffff;\n  --menu-option-icon-color: #ffffff;\n  --menu-option-icon-clicked: #71347b;\n  --delete-text-color: #c50303;\n  --status-success-bg-color: #c6efcd;\n  --status-success-text-color: #016102;\n  --status-warning-bg-color: #ffe380;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-bg-color: #c4c3c3;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --status-button-bg-passed: #c6efcd;\n  --status-button-bg-failed: #f7d9d9;\n  --status-button-bg-running: #ecedf8;\n  --status-button-bg-skipped: #c4c3c3;\n  --status-button-bg-warning: #ffb803;\n  --status-button-bg-terminated: #f7d9d9;\n  --status-button-bg-partiallyExecuted: #dee7f1;\n  --status-button-bg-aborted: #f7d9d9;\n  --status-button-bg-notExecuted: #f7d9d9;\n  --status-button-text-passed: #016102;\n  --status-button-text-failed: #c50303;\n  --status-button-text-running: #434db8;\n  --status-button-text-skipped: #3c3838;\n  --status-button-text-warning: #ffffff;\n  --status-button-text-terminated: #c50303;\n  --status-button-text-partiallyExecuted: #0d69d4;\n  --status-button-text-aborted: #c50303;\n  --status-button-text-notExecuted: #c50303;\n  --ff-select-option-border-color: #ded1e5;\n  --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n  --ff-select-background-color: #ffffff;\n  --ff-select-scroll-thumb-color: #d9d9d9;\n  --ff-select-scroll-track-bg: #f1f1f1;\n  --ff-select-scroll-thumb-hover: #b8b8b8;\n  --ff-select-text-color: #14041c;\n  --ff-select-option-hover-color: #f7ebff;\n  --ff-select-default-color: #747474;\n  --ff-select-border-color: #a3a3a3;\n  --ff-select-brand-color: #71347b;\n  --ff-select-text-hover-color: #1e161f;\n  --ff-search-filed-clear-text: #71347b;\n  --ff-search-filed-placeholder-text: #a3a3a3;\n  --ff-search-filed-close-Icon: #14041c;\n  --ff-paper-background-color: #f5f5f5;\n  --ff-paper-dark-background-color: #d1c4e9;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --disabled-primary-color: #f9f9f9;\n  --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n  --license_expireSoon_color: #ba7422;\n  --license_active_color: #268735;\n  --license_expired_color: #e34242;\n  --license_header_text_color: #592f7c;\n  --license_active_status_color: #518e18;\n  --license_expired_status_color: #ab3425;\n  --pie-chart-border-color: #b6b6b6;\n  --modal-header-text-color: #ffc600;\n  --switch-license-text-color: #61296a;\n  --switch-license-header-text-color: #610b86;\n  --dotted-border-color: #000000;\n  --select-license-header-text-color: #5f2868;\n  --in-active-button-color: #808080;\n  --button-background-gradient-color: #9c1ebb;\n  --details-page-value-color: #808080;\n  --ff-machine-input-field-border-color: #f1ebf2;\n  --ff-machine-input-field-text-color: #1e161f;\n  --ff-connecting-branch-color: #71347b;\n  --ff-connecting-branch-modal-header: #71347b;\n  --ff-connecting-branch-modal-border: #e0e0e0;\n  --ff-connecting-branch-scope-color: #079455;\n  --ff-connecting-branch-delete-color: #e42525;\n  --ff-app-header-menu-border-bottom-color: #ffffff;\n  --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592f7c 0%, #741ebb 100%);\n  --ff-delete-button-attachment: #a91224;\n  --email-table-border-color: #959595;\n  --ff-icon-hover-fill-color: #f7ebff;\n}\n\n:root {\n  --brand-color: #71347b;\n  --text-color: #e8e0e9;\n  --description-text: #d9d9d9;\n  --click-able-text-color: #e8e0e9;\n  --icons-default-color: #e8e0e9;\n  --border-color: #333234;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --hover-color: #f7ebff;\n  --pop-up-background-blur: rgba(18, 18, 18, 0.6);\n  --slider-table-color: #272428;\n  --drawer-footer-bg: rgba(27, 24, 28, 0.6);\n  --drawer-footer-border: #333234;\n  --text-bg-highlight: #f5fb00;\n  --tooltip-bg-color: #2a2a2a;\n  --tooltip-text-color: #ffffff;\n  --toggle-strip-color: #cfd1e2;\n  --toggle-strip-active-color: #71347b;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-button-bg-color: #ffffff;\n  --toggle-disable-icon-color: #767994;\n  --text-area-default-color: #747474;\n  --add-icon-hover-color: #431b4a;\n  --arrow-button-bg-color: #ffffff;\n  --arrows-button-border-color: #ded1e5;\n  --overlay-bg: rgba(18, 18, 18, 0.6);\n  --chip-fill-color: #f9d5ff;\n  --chip-text-color: #1e161f;\n  --file-drop-zone-default-fill-color: rgba(113, 52, 123, 0.1019607843);\n  --file-drop-zone-default-text-color: #1e161f;\n  --file-drop-zone-selected-fill-color: rgba(113, 52, 123, 0.2);\n  --file-drop-zone-selected-text-color: #1e161f;\n  --icon-color: #71347b;\n  --tree-connecting-lines-color: #d7b5e3;\n  --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-hover: linear-gradient(188.79deg, #7c4685 2.94%, #582d5f 93.09%);\n  --primary-button-disable: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-text-color: #ffffff;\n  --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n  --secondary-button-border: linear-gradient(360deg, #46164d 0%, #71347b 100%);\n  --secondary-button-text-color: #71347b;\n  --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-color: linear-gradient(180deg, rgba(70, 22, 77, 0.05) 0%, rgba(113, 52, 123, 0.05) 100%);\n  --tertiary-button-hover: linear-gradient(180deg, rgba(70, 22, 77, 0.1) 0%, rgba(113, 52, 123, 0.1) 100%);\n  --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n  --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n  --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n  --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n  --drawer-title-color: #252c37;\n  --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n  --error_light: #e42525;\n  --ff-success: #079455;\n  --ff-warning: #f79009;\n  --ff-header-text-color: #fdfaff;\n  --ff-header-submenu-text-color: #666468;\n  --ff-header-submenu-highlight-text-color: #170328;\n  --default-icon-color: #a3a3a3;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --ff-mini-modal-border: #ffffff;\n  --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n  --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n  --ff-error-light: #e42525;\n  --ff-chips-fill-color: #f9d5ff;\n  --ff-chips-blur-color: #575757;\n  --ff-chip-bg: #ffffff;\n  --ff-chip-text-color: #1e161f;\n  --ff-mini-modal-footer-background: #aeb0c0;\n  --input-default-border-color: #a3a3a3;\n  --input-hover-border-color: #1e161f;\n  --input-default-label-color: #747474;\n  --input-label-bg-color: #ffffff;\n  --input-active-text-color: #71347b;\n  --input-error-text-color: #e42525;\n  --tabs-label-default-color: #7a7a7a;\n  --tabs-label-active-color: #71347b;\n  --tabs-border-color: #f1ebf2;\n  --tabs-bg-color: #ede6f2;\n  --tab-bg-color: #ffffff;\n  --toast-close-icon-wrapper-bg: #fafafa;\n  --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n  --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n  --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n  --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n  --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n  --option-card-border-color: #ded1e5;\n  --option-card-bg-color: #ffffff;\n  --checkbox-bg-color: #fbfdff;\n  --checkbox-border-color: #b5b5b5;\n  --checkbox-partial-color: #ffffff;\n  --checkbox-hover-color: #f7edff;\n  --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n  --multi-select-label-bg: #ffffff;\n  --text-color-light: rgba(30, 22, 31, 0.5019607843);\n  --radio-button-border: #b5b5b5;\n  --radio-button-hover: #d3d3d3;\n  --menu-variant-dark-icon-color: #ffffff;\n  --menu-option-icon-color: #ffffff;\n  --menu-option-icon-clicked: #71347b;\n  --delete-text-color: #c50303;\n  --status-success-bg-color: #c6efcd;\n  --status-success-text-color: #016102;\n  --status-warning-bg-color: #ffe380;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-bg-color: #c4c3c3;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --status-button-bg-passed: #c6efcd;\n  --status-button-bg-failed: #f7d9d9;\n  --status-button-bg-running: #ecedf8;\n  --status-button-bg-skipped: #c4c3c3;\n  --status-button-bg-warning: #ffb803;\n  --status-button-bg-terminated: #f7d9d9;\n  --status-button-bg-partiallyExecuted: #dee7f1;\n  --status-button-bg-aborted: #f7d9d9;\n  --status-button-bg-notExecuted: #f7d9d9;\n  --status-button-text-passed: #016102;\n  --status-button-text-failed: #c50303;\n  --status-button-text-running: #434db8;\n  --status-button-text-skipped: #3c3838;\n  --status-button-text-warning: #ffffff;\n  --status-button-text-terminated: #c50303;\n  --status-button-text-partiallyExecuted: #0d69d4;\n  --status-button-text-aborted: #c50303;\n  --status-button-text-notExecuted: #c50303;\n  --ff-select-option-border-color: #ded1e5;\n  --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n  --ff-select-background-color: #ffffff;\n  --ff-select-scroll-thumb-color: #d9d9d9;\n  --ff-select-scroll-track-bg: #f1f1f1;\n  --ff-select-scroll-thumb-hover: #b8b8b8;\n  --ff-select-text-color: #14041c;\n  --ff-select-option-hover-color: #f7ebff;\n  --ff-select-default-color: #747474;\n  --ff-select-border-color: #a3a3a3;\n  --ff-select-brand-color: #71347b;\n  --ff-select-text-hover-color: #1e161f;\n  --ff-search-filed-clear-text: #71347b;\n  --ff-search-filed-placeholder-text: #a3a3a3;\n  --ff-search-filed-close-Icon: #14041c;\n  --ff-paper-background-color: #f5f5f5;\n  --ff-paper-dark-background-color: #d1c4e9;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --disabled-primary-color: #f9f9f9;\n  --license_expireSoon_color: #ba7422;\n  --license_active_color: #268735;\n  --license_expired_color: #e34242;\n  --license_header_text_color: #592f7c;\n  --license_active_status_color: #518e18;\n  --license_expired_status_color: #ab3425;\n  --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n  --pie-chart-border-color: #b6b6b6;\n  --button-bg-color: #f6ebff;\n  --modal-header-text-color: #ffc600;\n  --switch-license-text-color: #61296a;\n  --switch-license-header-text-color: #610b86;\n  --dotted-border-color: #000000;\n  --select-license-header-text-color: #5F2868;\n  --in-active-button-color: #808080;\n  --button-background-gradient-color: #9C1EBB;\n  --ff-app-header-menu-border-bottom-color: #FFFFFF;\n  --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592F7C 0%, #741EBB 100%);\n  --details-page-value-color: #808080;\n  --ff-delete-button-attachment: #a91224;\n  --email-table-border-color: #959595;\n  --ff-icon-hover-fill-color: #F7ECF8;\n}\n\n.ff-light-theme {\n  --button-bg-color: #f6ebff;\n  --brand-color: #71347b;\n  --text-color: #1e161f;\n  --description-text: #7a7a7a;\n  --click-able-text-color: #71347b;\n  --icons-default-color: #71347b;\n  --border-color: #f0e7f4;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --hover-color: #f7ebff;\n  --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n  --slider-table-color: rgba(212, 176, 228, 0.1490196078);\n  --drawer-footer-bg: #ffffff;\n  --drawer-footer-border: #f0e7f4;\n  --text-bg-highlight: #f5fb00;\n  --tooltip-bg-color: #1e161f;\n  --tooltip-text-color: #ffffff;\n  --toggle-strip-color: #cfd1e2;\n  --toggle-strip-active: #71347b;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-button-bg-color: #ffffff;\n  --toggle-disable-icon-color: #767994;\n  --text-area-default-color: #747474;\n  --add-icon-hover-color: #431b4a;\n  --arrow-button-bg-color: #ffffff;\n  --arrows-button-border-color: #ded1e5;\n  --overlay-bg: rgba(30, 22, 31, 0.1019607843);\n  --chip-fill-color: #f9d5ff;\n  --chip-text-color: #1e161f;\n  --file-drop-zone-default-fill-color: rgba(113, 52, 123, 0.1019607843);\n  --file-drop-zone-default-text-color: #1e161f;\n  --file-drop-zone-selected-fill-color: rgba(113, 52, 123, 0.2);\n  --file-drop-zone-selected-text-color: #1e161f;\n  --icon-color: #71347b;\n  --default-icon-color: #a3a3a3;\n  --tree-connecting-lines-color: #d7b5e3;\n  --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-hover: linear-gradient(179.06deg, #8d3b9a 3.49%, #781f86 99.22%);\n  --primary-button-disable: linear-gradient(180deg, #46164d 0%, #71347b 100%);\n  --primary-button-text-color: #ffffff;\n  --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n  --secondary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-text-color: #46164d;\n  --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-color: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.1019607843) 3.49%, rgba(70, 22, 77, 0.1019607843) 99.22%);\n  --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n  --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n  --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n  --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n  --error: #e42525;\n  --drawer-title-color: #252c37;\n  --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n  --error_light: #e42525;\n  --ff-success: #079455;\n  --ff-warning: #f79009;\n  --ff-header-text-color: #fdfaff;\n  --ff-header-submenu-text-color: #666468;\n  --ff-header-submenu-highlight-text-color: #170328;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --ff-mini-modal-border: #ffffff;\n  --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n  --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n  --ff-error-light: #e42525;\n  --ff-chips-fill-color: #f9d5ff;\n  --ff-chips-blur-color: #575757;\n  --ff-chip-bg: #ffffff;\n  --ff-chip-text-color: #1e161f;\n  --ff-mini-modal-footer-background: #aeb0c0;\n  --input-default-border-color: #a3a3a3;\n  --input-hover-border-color: #1e161f;\n  --input-default-label-color: #747474;\n  --input-label-bg-color: #ffffff;\n  --input-active-text-color: #71347b;\n  --input-error-text-color: #e42525;\n  --tabs-label-default-color: #7a7a7a;\n  --tabs-label-active-color: #71347b;\n  --tabs-border-color: #f1ebf2;\n  --tabs-bg-color: #ede6f2;\n  --tab-bg-color: #ffffff;\n  --toast-close-icon-wrapper-bg: #fafafa;\n  --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n  --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n  --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n  --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n  --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n  --option-card-border-color: #ded1e5;\n  --option-card-bg-color: #ffffff;\n  --checkbox-bg-color: #fbfdff;\n  --checkbox-border-color: #b5b5b5;\n  --checkbox-partial-color: #ffffff;\n  --checkbox-hover-color: #f7edff;\n  --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n  --multi-select-label-bg: #ffffff;\n  --text-color-light: rgba(30, 22, 31, 0.5019607843);\n  --radio-button-border: #b5b5b5;\n  --radio-button-hover: #d3d3d3;\n  --menu-variant-dark-icon-color: #ffffff;\n  --menu-option-icon-color: #ffffff;\n  --menu-option-icon-clicked: #71347b;\n  --delete-text-color: #c50303;\n  --status-success-bg-color: #c6efcd;\n  --status-success-text-color: #016102;\n  --status-warning-bg-color: #ffe380;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-bg-color: #c4c3c3;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --status-button-bg-passed: #c6efcd;\n  --status-button-bg-failed: #f7d9d9;\n  --status-button-bg-running: #ecedf8;\n  --status-button-bg-skipped: #c4c3c3;\n  --status-button-bg-warning: #ffb803;\n  --status-button-bg-terminated: #f7d9d9;\n  --status-button-bg-partiallyExecuted: #dee7f1;\n  --status-button-bg-aborted: #f7d9d9;\n  --status-button-bg-notExecuted: #f7d9d9;\n  --status-button-text-passed: #016102;\n  --status-button-text-failed: #c50303;\n  --status-button-text-running: #434db8;\n  --status-button-text-skipped: #3c3838;\n  --status-button-text-warning: #ffffff;\n  --status-button-text-terminated: #c50303;\n  --status-button-text-partiallyExecuted: #0d69d4;\n  --status-button-text-aborted: #c50303;\n  --status-button-text-notExecuted: #c50303;\n  --ff-select-option-border-color: #ded1e5;\n  --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n  --ff-select-background-color: #ffffff;\n  --ff-select-scroll-thumb-color: #d9d9d9;\n  --ff-select-scroll-track-bg: #f1f1f1;\n  --ff-select-scroll-thumb-hover: #b8b8b8;\n  --ff-select-text-color: #14041c;\n  --ff-select-option-hover-color: #f7ebff;\n  --ff-select-default-color: #747474;\n  --ff-select-border-color: #a3a3a3;\n  --ff-select-brand-color: #71347b;\n  --ff-select-text-hover-color: #1e161f;\n  --ff-search-filed-clear-text: #71347b;\n  --ff-search-filed-placeholder-text: #a3a3a3;\n  --ff-search-filed-close-Icon: #14041c;\n  --ff-paper-background-color: #f5f5f5;\n  --ff-paper-dark-background-color: #d1c4e9;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --disabled-primary-color: #f9f9f9;\n  --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n  --license_expireSoon_color: #ba7422;\n  --license_active_color: #268735;\n  --license_expired_color: #e34242;\n  --license_header_text_color: #592f7c;\n  --license_active_status_color: #518e18;\n  --license_expired_status_color: #ab3425;\n  --pie-chart-border-color: #b6b6b6;\n  --modal-header-text-color: #ffc600;\n  --switch-license-text-color: #61296a;\n  --switch-license-header-text-color: #610b86;\n  --dotted-border-color: #000000;\n  --select-license-header-text-color: #5f2868;\n  --in-active-button-color: #808080;\n  --button-background-gradient-color: #9c1ebb;\n  --details-page-value-color: #808080;\n  --ff-machine-input-field-border-color: #f1ebf2;\n  --ff-machine-input-field-text-color: #1e161f;\n  --ff-connecting-branch-color: #71347b;\n  --ff-connecting-branch-modal-header: #71347b;\n  --ff-connecting-branch-modal-border: #e0e0e0;\n  --ff-connecting-branch-scope-color: #079455;\n  --ff-connecting-branch-delete-color: #e42525;\n  --ff-app-header-menu-border-bottom-color: #ffffff;\n  --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592f7c 0%, #741ebb 100%);\n  --ff-delete-button-attachment: #a91224;\n  --email-table-border-color: #959595;\n  --ff-icon-hover-fill-color: #f7ebff;\n}\n\n.ff-dark-theme {\n  --brand-color: #71347b;\n  --text-color: #e8e0e9;\n  --description-text: #d9d9d9;\n  --click-able-text-color: #e8e0e9;\n  --icons-default-color: #e8e0e9;\n  --border-color: #333234;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --hover-color: #f7ebff;\n  --pop-up-background-blur: rgba(18, 18, 18, 0.6);\n  --slider-table-color: #272428;\n  --drawer-footer-bg: rgba(27, 24, 28, 0.6);\n  --drawer-footer-border: #333234;\n  --text-bg-highlight: #f5fb00;\n  --tooltip-bg-color: #2a2a2a;\n  --tooltip-text-color: #ffffff;\n  --toggle-strip-color: #cfd1e2;\n  --toggle-strip-active-color: #71347b;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-button-bg-color: #ffffff;\n  --toggle-disable-icon-color: #767994;\n  --text-area-default-color: #747474;\n  --add-icon-hover-color: #431b4a;\n  --arrow-button-bg-color: #ffffff;\n  --arrows-button-border-color: #ded1e5;\n  --overlay-bg: rgba(18, 18, 18, 0.6);\n  --chip-fill-color: #f9d5ff;\n  --chip-text-color: #1e161f;\n  --file-drop-zone-default-fill-color: rgba(113, 52, 123, 0.1019607843);\n  --file-drop-zone-default-text-color: #1e161f;\n  --file-drop-zone-selected-fill-color: rgba(113, 52, 123, 0.2);\n  --file-drop-zone-selected-text-color: #1e161f;\n  --icon-color: #71347b;\n  --tree-connecting-lines-color: #d7b5e3;\n  --primary-button-color: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-hover: linear-gradient(188.79deg, #7c4685 2.94%, #582d5f 93.09%);\n  --primary-button-disable: linear-gradient(188.79deg, #71347b 2.94%, #46164d 93.09%);\n  --primary-button-text-color: #ffffff;\n  --primary-button-border: linear-gradient(180deg, #46164d 3.04%, #71347b 100%);\n  --secondary-button-color-text: linear-gradient(179.06deg, #71347b 3.49%, #46164d 99.22%);\n  --secondary-button-border: linear-gradient(360deg, #46164d 0%, #71347b 100%);\n  --secondary-button-text-color: #71347b;\n  --secondary-button-hover: linear-gradient(179.06deg, rgba(113, 52, 123, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n  --tertiary-button-color: linear-gradient(180deg, rgba(70, 22, 77, 0.05) 0%, rgba(113, 52, 123, 0.05) 100%);\n  --tertiary-button-hover: linear-gradient(180deg, rgba(70, 22, 77, 0.1) 0%, rgba(113, 52, 123, 0.1) 100%);\n  --delete-button-color: linear-gradient(179.06deg, #e42525 3.49%, #c90000 99.22%);\n  --delete-button-border: linear-gradient(180deg, #a90707 3.04%, #e42525 100%);\n  --delete-button-hover: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --delete-button-disable: linear-gradient(179.06deg, #e95151 3.49%, #d43434 99.22%);\n  --warning-button-color: linear-gradient(179.06deg, #ffc600 3.49%, #ffc600 99.22%);\n  --warning-button-border: linear-gradient(180deg, #eeba08 3.04%, #f1bc04 100%);\n  --drawer-title-color: #252c37;\n  --toast-msg-icon-bg: linear-gradient(180deg, #079455 0%, #00693a 100%);\n  --error_light: #e42525;\n  --ff-success: #079455;\n  --ff-warning: #f79009;\n  --ff-header-text-color: #fdfaff;\n  --ff-header-submenu-text-color: #666468;\n  --ff-header-submenu-highlight-text-color: #170328;\n  --default-icon-color: #a3a3a3;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --ff-mini-modal-border: #ffffff;\n  --ff-mini-modal-box-shadow: rgba(55, 19, 85, 0.2392156863);\n  --ff-mini-modal-arrow-shadow: rgba(0, 0, 0, 0.2509803922);\n  --ff-error-light: #e42525;\n  --ff-chips-fill-color: #f9d5ff;\n  --ff-chips-blur-color: #575757;\n  --ff-chip-bg: #ffffff;\n  --ff-chip-text-color: #1e161f;\n  --ff-mini-modal-footer-background: #aeb0c0;\n  --input-default-border-color: #a3a3a3;\n  --input-hover-border-color: #1e161f;\n  --input-default-label-color: #747474;\n  --input-label-bg-color: #ffffff;\n  --input-active-text-color: #71347b;\n  --input-error-text-color: #e42525;\n  --tabs-label-default-color: #7a7a7a;\n  --tabs-label-active-color: #71347b;\n  --tabs-border-color: #f1ebf2;\n  --tabs-bg-color: #ede6f2;\n  --tab-bg-color: #ffffff;\n  --toast-close-icon-wrapper-bg: #fafafa;\n  --toaster-boxshadow: rgba(30, 22, 31, 0.2392156863);\n  --toaster-success-border: linear-gradient(rgba(7, 148, 85, 0.4), rgba(0, 105, 58, 0.4));\n  --toaster-warning-border: linear-gradient(rgba(247, 144, 9, 0.4), rgba(214, 122, 0, 0.4));\n  --toaster-info-border: linear-gradient(rgba(37, 145, 228, 0.4), rgba(23, 105, 176, 0.4));\n  --toaster-danger_confirm-border: linear-gradient(rgba(228, 37, 37, 0.4), rgba(201, 0, 0, 0.4));\n  --option-card-border-color: #ded1e5;\n  --option-card-bg-color: #ffffff;\n  --checkbox-bg-color: #fbfdff;\n  --checkbox-border-color: #b5b5b5;\n  --checkbox-partial-color: #ffffff;\n  --checkbox-hover-color: #f7edff;\n  --multi-select-border: rgba(163, 163, 163, 0.5019607843);\n  --multi-select-label-bg: #ffffff;\n  --text-color-light: rgba(30, 22, 31, 0.5019607843);\n  --radio-button-border: #b5b5b5;\n  --radio-button-hover: #d3d3d3;\n  --menu-variant-dark-icon-color: #ffffff;\n  --menu-option-icon-color: #ffffff;\n  --menu-option-icon-clicked: #71347b;\n  --delete-text-color: #c50303;\n  --status-success-bg-color: #c6efcd;\n  --status-success-text-color: #016102;\n  --status-warning-bg-color: #ffe380;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-bg-color: #c4c3c3;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --status-button-bg-passed: #c6efcd;\n  --status-button-bg-failed: #f7d9d9;\n  --status-button-bg-running: #ecedf8;\n  --status-button-bg-skipped: #c4c3c3;\n  --status-button-bg-warning: #ffb803;\n  --status-button-bg-terminated: #f7d9d9;\n  --status-button-bg-partiallyExecuted: #dee7f1;\n  --status-button-bg-aborted: #f7d9d9;\n  --status-button-bg-notExecuted: #f7d9d9;\n  --status-button-text-passed: #016102;\n  --status-button-text-failed: #c50303;\n  --status-button-text-running: #434db8;\n  --status-button-text-skipped: #3c3838;\n  --status-button-text-warning: #ffffff;\n  --status-button-text-terminated: #c50303;\n  --status-button-text-partiallyExecuted: #0d69d4;\n  --status-button-text-aborted: #c50303;\n  --status-button-text-notExecuted: #c50303;\n  --ff-select-option-border-color: #ded1e5;\n  --ff-select-option-wrapper-box-shadow: rgba(89, 47, 124, 0.2);\n  --ff-select-background-color: #ffffff;\n  --ff-select-scroll-thumb-color: #d9d9d9;\n  --ff-select-scroll-track-bg: #f1f1f1;\n  --ff-select-scroll-thumb-hover: #b8b8b8;\n  --ff-select-text-color: #14041c;\n  --ff-select-option-hover-color: #f7ebff;\n  --ff-select-default-color: #747474;\n  --ff-select-border-color: #a3a3a3;\n  --ff-select-brand-color: #71347b;\n  --ff-select-text-hover-color: #1e161f;\n  --ff-search-filed-clear-text: #71347b;\n  --ff-search-filed-placeholder-text: #a3a3a3;\n  --ff-search-filed-close-Icon: #14041c;\n  --ff-paper-background-color: #f5f5f5;\n  --ff-paper-dark-background-color: #d1c4e9;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --disabled-primary-color: #f9f9f9;\n  --license_expireSoon_color: #ba7422;\n  --license_active_color: #268735;\n  --license_expired_color: #e34242;\n  --license_header_text_color: #592f7c;\n  --license_active_status_color: #518e18;\n  --license_expired_status_color: #ab3425;\n  --background-modal-color: rgba(17, 17, 17, 0.0666666667);\n  --pie-chart-border-color: #b6b6b6;\n  --button-bg-color: #f6ebff;\n  --modal-header-text-color: #ffc600;\n  --switch-license-text-color: #61296a;\n  --switch-license-header-text-color: #610b86;\n  --dotted-border-color: #000000;\n  --select-license-header-text-color: #5F2868;\n  --in-active-button-color: #808080;\n  --button-background-gradient-color: #9C1EBB;\n  --ff-app-header-menu-border-bottom-color: #FFFFFF;\n  --ff-app-header-submenu-border-bottom-color: linear-gradient(90deg, #592F7C 0%, #741EBB 100%);\n  --details-page-value-color: #808080;\n  --ff-delete-button-attachment: #a91224;\n  --email-table-border-color: #959595;\n  --ff-icon-hover-fill-color: #F7ECF8;\n}";
+styleInject(css_248z$R);
 
 const ThemeContext = /*#__PURE__*/React.createContext(undefined);
 const ThemeProvider = ({
@@ -668,14 +754,14 @@ const Drawer = ({
   }), document.body);
 };
 
-var css_248z$O = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-accordion {\n  border: 1px solid var(--border-color);\n  border-radius: 4px;\n  min-width: fit-content;\n}\n.ff-accordion .accordion-header {\n  display: flex;\n  justify-content: space-between;\n  min-height: 32px;\n}\n.ff-accordion .accordion-header .header-title {\n  padding: 8px;\n}\n.ff-accordion .accordion-header .accordion-arrow {\n  display: flex;\n  padding: 8px;\n  align-items: center;\n  transition: transform 0.3s ease;\n}\n.ff-accordion .accordion-header .accordion-arrow.expanded {\n  transform: rotate(180deg);\n}\n.ff-accordion .accordion-header .accordion-arrow:hover {\n  color: var(--tooltip-bg-color);\n}\n.ff-accordion .accordion-header.expanded {\n  background-color: var(--hover-color);\n  border-bottom: 1px solid var(--hover-color);\n}\n.ff-accordion .accordion-header:hover {\n  background-color: var(--hover-color);\n}\n.ff-accordion .accordion-content {\n  padding: 4px;\n}";
-styleInject(css_248z$O);
+var css_248z$Q = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-accordion {\n  border: 1px solid var(--border-color);\n  border-radius: 4px;\n  min-width: fit-content;\n}\n.ff-accordion .accordion-header {\n  display: flex;\n  justify-content: space-between;\n  min-height: 32px;\n}\n.ff-accordion .accordion-header .header-title {\n  padding: 8px;\n}\n.ff-accordion .accordion-header .accordion-arrow {\n  display: flex;\n  padding: 8px;\n  align-items: center;\n  transition: transform 0.3s ease;\n}\n.ff-accordion .accordion-header .accordion-arrow.expanded {\n  transform: rotate(180deg);\n}\n.ff-accordion .accordion-header .accordion-arrow:hover {\n  color: var(--tooltip-bg-color);\n}\n.ff-accordion .accordion-header.expanded {\n  background-color: var(--hover-color);\n  border-bottom: 1px solid var(--hover-color);\n}\n.ff-accordion .accordion-header:hover {\n  background-color: var(--hover-color);\n}\n.ff-accordion .accordion-content {\n  padding: 4px;\n}";
+styleInject(css_248z$Q);
 
-var css_248z$N = "";
-styleInject(css_248z$N);
+var css_248z$P = "";
+styleInject(css_248z$P);
 
-var css_248z$M = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-tooltip {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-tooltip-container {\n  cursor: auto;\n  display: inline-block;\n}\n\n.ff-tooltip {\n  position: fixed;\n  width: max-content;\n  max-width: 60vw;\n  word-wrap: break-word;\n  background-color: var(--tooltip-bg-color);\n  line-height: 18px;\n  color: var(--tooltip-text-color);\n  text-align: center;\n  border-radius: 5px;\n  padding: 6px 12px;\n  opacity: 0;\n}\n.ff-tooltip--visible {\n  opacity: 1;\n  transition: opacity 0.3s;\n}";
-styleInject(css_248z$M);
+var css_248z$O = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-tooltip {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-tooltip-container {\n  cursor: auto;\n  display: inline-block;\n}\n\n.ff-tooltip {\n  position: fixed;\n  width: max-content;\n  max-width: 60vw;\n  word-wrap: break-word;\n  background-color: var(--tooltip-bg-color);\n  line-height: 18px;\n  color: var(--tooltip-text-color);\n  text-align: center;\n  border-radius: 5px;\n  padding: 6px 12px;\n  opacity: 0;\n}\n.ff-tooltip--visible {\n  opacity: 1;\n  transition: opacity 0.3s;\n}";
+styleInject(css_248z$O);
 
 const checkEmpty = value => {
   // Check for null or undefined
@@ -844,8 +930,8 @@ const Tooltip = ({
   });
 };
 
-var css_248z$L = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.ff-text {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n.ff-text--regular {\n  font-weight: 400;\n}\n.ff-text--medium {\n  font-weight: 500;\n}\n.ff-text--semi-bold {\n  font-weight: 600;\n}\n.ff-text--bold {\n  font-weight: 700;\n}";
-styleInject(css_248z$L);
+var css_248z$N = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.ff-text {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n.ff-text--regular {\n  font-weight: 400;\n}\n.ff-text--medium {\n  font-weight: 500;\n}\n.ff-text--semi-bold {\n  font-weight: 600;\n}\n.ff-text--bold {\n  font-weight: 700;\n}";
+styleInject(css_248z$N);
 
 const Typography = ({
   fontWeight = 'regular',
@@ -930,8 +1016,8 @@ const Accordion = ({
   });
 };
 
-var css_248z$K = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label, .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-more-chip {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-multiselect-wrapper .ff-multiselect__main .default-label {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-multiselect-wrapper .ff-multiselect__main .active-default-label, .ff-multiselect-wrapper .error-text {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-multiselect-wrapper {\n  box-sizing: border-box;\n  transition: all 0.3s ease;\n  cursor: pointer;\n  position: relative;\n  border: 1px solid var(--default-icon-color);\n  border-radius: 8px;\n  background: var(--drawer-footer-bg);\n  min-width: 150px;\n  width: 100%;\n  height: 32px;\n}\n.ff-multiselect-wrapper .ff-multiselect {\n  position: relative;\n  padding: 6px;\n  border: none;\n  border-radius: 8px;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n.ff-multiselect-wrapper .ff-multiselect__main {\n  display: flex;\n  flex: 1;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .default-label {\n  font-family: Poppins;\n  font-weight: 400;\n  letter-spacing: 0.5px;\n  transition: all 0.3s ease;\n  color: var(--default-icon-color);\n  line-height: 18px;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .active-default-label {\n  font-family: Poppins;\n  font-weight: 400;\n  letter-spacing: 0.5px;\n  transition: all 0.3s ease;\n  background-color: var(--multi-select-label-bg);\n  line-height: 12px;\n  color: var(--default-icon-color);\n  padding: 0 4px;\n  position: absolute;\n  left: 8px;\n  top: -6px;\n  pointer-events: none;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 5px;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  box-sizing: border-box;\n  border: 0.5px solid #f1ebf2;\n  padding: 0 1px 0 4px;\n  gap: 4px;\n  border-radius: 15px;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label {\n  line-height: 14px;\n  color: var(--tooltip-bg-color);\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-close-icon {\n  cursor: pointer;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container {\n  flex: 1;\n  min-width: 20px;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container input {\n  width: 100%;\n  min-width: 30px;\n  max-width: calc(100% - 0px);\n  padding: 2px;\n  box-sizing: border-box;\n  border: none;\n  font-size: 12px;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container input:focus {\n  outline: none;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-more-chip {\n  width: 1rem;\n  font-weight: 600;\n  line-height: 16px;\n  color: var(--brand-color);\n}\n.ff-multiselect-wrapper .ff-multiselect__toggle {\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n}\n.ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow {\n  transition: transform 0.3s ease;\n  transform: rotate(360deg);\n}\n.ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow svg path {\n  transition: all 0.3s ease;\n}\n.ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow--opened-dropdown {\n  transform: rotate(180deg);\n  transition: transform 0.3s ease;\n}\n.ff-multiselect-wrapper:hover {\n  border: 1px solid var(--tooltip-bg-color);\n}\n.ff-multiselect-wrapper:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-wrapper:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--tooltip-bg-color);\n}\n.ff-multiselect-wrapper:hover .ff-select-arrow svg path {\n  fill: var(--tooltip-bg-color);\n  transition: all 0.3s ease;\n}\n.ff-multiselect-wrapper--with-options {\n  height: fit-content;\n}\n.ff-multiselect-wrapper--opened-dropdown {\n  border: 1px solid var(--brand-color);\n  height: fit-content;\n  cursor: default;\n}\n.ff-multiselect-wrapper--opened-dropdown .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--brand-color);\n}\n.ff-multiselect-wrapper--opened-dropdown:hover {\n  border: 1px solid var(--brand-color);\n}\n.ff-multiselect-wrapper--opened-dropdown:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-wrapper--opened-dropdown:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--brand-color);\n}\n.ff-multiselect-wrapper--error {\n  border: 1px solid var(--error-light);\n}\n.ff-multiselect-wrapper--error .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--error-light);\n}\n.ff-multiselect-wrapper--error:hover {\n  border: 1px solid var(--error-light);\n}\n.ff-multiselect-wrapper--error:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-wrapper--error:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--error-light);\n}\n.ff-multiselect-wrapper--disabled {\n  pointer-events: none;\n  border: 1px solid var(--multi-select-border);\n}\n.ff-multiselect-wrapper--disabled .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--multi-select-border);\n}\n.ff-multiselect-wrapper--disabled:hover {\n  border: 1px solid var(--multi-select-border);\n}\n.ff-multiselect-wrapper--disabled:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-wrapper--disabled:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--multi-select-border);\n}\n.ff-multiselect-wrapper--disabled .ff-select-arrow svg path {\n  fill: var(--multi-select-border);\n  transition: all 0.3s ease;\n}\n.ff-multiselect-wrapper--disabled:hover .ff-select-arrow svg path {\n  fill: var(--multi-select-border);\n  transition: all 0.3s ease;\n}\n.ff-multiselect-wrapper--disabled .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label {\n  color: var(--text-color-light);\n}\n.ff-multiselect-wrapper .error-text {\n  position: absolute;\n  margin-top: 0.25rem;\n  left: 12px;\n  color: var(--error-light);\n  letter-spacing: 0.5px;\n}";
-styleInject(css_248z$K);
+var css_248z$M = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-multiselect-wrapper .ff-multiselect__main .default-label, .ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-more-chip {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-multiselect-wrapper .ff-multiselect__main .active-default-label, .ff-multiselect-wrapper .error-text {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-multiselect-wrapper {\n  box-sizing: border-box;\n  transition: all 0.3s ease;\n  cursor: pointer;\n  position: relative;\n  border: 1px solid var(--default-icon-color);\n  border-radius: 8px;\n  background: var(--drawer-footer-bg);\n  min-width: 150px;\n  width: 100%;\n  height: 32px;\n}\n.ff-multiselect-wrapper .ff-multiselect {\n  position: relative;\n  padding: 6px;\n  border: none;\n  border-radius: 8px;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n.ff-multiselect-wrapper .ff-multiselect__main {\n  display: flex;\n  flex: 1;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .default-label {\n  font-family: Poppins;\n  font-weight: 400;\n  letter-spacing: 0.5px;\n  transition: all 0.3s ease;\n  color: var(--default-icon-color);\n  line-height: 18px;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .active-default-label {\n  font-family: Poppins;\n  font-weight: 400;\n  letter-spacing: 0.5px;\n  transition: all 0.3s ease;\n  background-color: var(--multi-select-label-bg);\n  line-height: 12px;\n  color: var(--default-icon-color);\n  padding: 0 4px;\n  position: absolute;\n  left: 8px;\n  top: -6px;\n  pointer-events: none;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 5px;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  box-sizing: border-box;\n  border: 0.5px solid #f1ebf2;\n  padding: 0 1px 0 4px;\n  gap: 4px;\n  border-radius: 15px;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label {\n  line-height: 14px;\n  color: var(--tooltip-bg-color);\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-close-icon {\n  cursor: pointer;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container {\n  flex: 1;\n  min-width: 20px;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container input {\n  width: 100%;\n  min-width: 30px;\n  max-width: calc(100% - 0px);\n  padding: 2px;\n  box-sizing: border-box;\n  border: none;\n  font-size: 12px;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-input-container input:focus {\n  outline: none;\n}\n.ff-multiselect-wrapper .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-more-chip {\n  width: 1.2rem;\n  font-weight: 600;\n  line-height: 16px;\n  color: var(--brand-color);\n}\n.ff-multiselect-wrapper .ff-multiselect__toggle {\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n}\n.ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow {\n  transition: transform 0.3s ease;\n  transform: rotate(360deg);\n}\n.ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow svg path {\n  transition: all 0.3s ease;\n}\n.ff-multiselect-wrapper .ff-multiselect__toggle .ff-select-arrow--opened-dropdown {\n  transform: rotate(180deg);\n  transition: transform 0.3s ease;\n}\n.ff-multiselect-wrapper:hover {\n  border: 1px solid var(--tooltip-bg-color);\n}\n.ff-multiselect-wrapper:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-wrapper:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--tooltip-bg-color);\n}\n.ff-multiselect-wrapper:hover .ff-select-arrow svg path {\n  fill: var(--tooltip-bg-color);\n  transition: all 0.3s ease;\n}\n.ff-multiselect-wrapper--with-options {\n  height: fit-content;\n}\n.ff-multiselect-wrapper--opened-dropdown {\n  border: 1px solid var(--brand-color);\n  height: fit-content;\n  cursor: default;\n}\n.ff-multiselect-wrapper--opened-dropdown .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--brand-color);\n}\n.ff-multiselect-wrapper--opened-dropdown:hover {\n  border: 1px solid var(--brand-color);\n}\n.ff-multiselect-wrapper--opened-dropdown:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-wrapper--opened-dropdown:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--brand-color);\n}\n.ff-multiselect-wrapper--error {\n  border: 1px solid var(--error-light);\n}\n.ff-multiselect-wrapper--error .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--error-light);\n}\n.ff-multiselect-wrapper--error:hover {\n  border: 1px solid var(--error-light);\n}\n.ff-multiselect-wrapper--error:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-wrapper--error:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--error-light);\n}\n.ff-multiselect-wrapper--disabled {\n  pointer-events: none;\n  border: 1px solid var(--multi-select-border);\n}\n.ff-multiselect-wrapper--disabled .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--multi-select-border);\n}\n.ff-multiselect-wrapper--disabled:hover {\n  border: 1px solid var(--multi-select-border);\n}\n.ff-multiselect-wrapper--disabled:hover .ff-multiselect .ff-multiselect__main .default-label,\n.ff-multiselect-wrapper--disabled:hover .ff-multiselect .ff-multiselect__main .active-default-label {\n  color: var(--multi-select-border);\n}\n.ff-multiselect-wrapper--disabled .ff-select-arrow svg path {\n  fill: var(--multi-select-border);\n  transition: all 0.3s ease;\n}\n.ff-multiselect-wrapper--disabled:hover .ff-select-arrow svg path {\n  fill: var(--multi-select-border);\n  transition: all 0.3s ease;\n}\n.ff-multiselect-wrapper--disabled .ff-multiselect__main .ff-multiselect-chip-container .ff-multiselect-chip .ff-multiselect-chip-label {\n  color: var(--text-color-light);\n}\n.ff-multiselect-wrapper .error-text {\n  position: absolute;\n  margin-top: 0.25rem;\n  left: 12px;\n  color: var(--error-light);\n  letter-spacing: 0.5px;\n}";
+styleInject(css_248z$M);
 
 const dropdownDefaultCSSData$1 = {
   verticalMargin: 4,
@@ -939,8 +1025,8 @@ const dropdownDefaultCSSData$1 = {
   maxDropdownHeight: 160
 };
 
-var css_248z$J = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd, .ff-multiselect-dropdown-container .no-options, .ff-multiselect-dropdown-container .dropdown-option-container .dropdown-option-label {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-multiselect-dropdown-container {\n  position: absolute;\n  background: var(--drawer-footer-bg);\n  z-index: 1000;\n  box-shadow: 0px 1px 4px 0px var(--ff-select-option-wrapper-box-shadow);\n  border: 0.5px solid var(--ff-select-option-border-color);\n  border-radius: 4px;\n  box-sizing: border-box;\n  margin-block: 4px;\n  max-height: 160px;\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper {\n  max-height: 128px;\n  overflow-y: auto;\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar {\n  width: 4px;\n  height: 40px;\n  border-radius: 12px 0px 0px 0px;\n  background: var(--description-text);\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar-track {\n  background: var(--ff-select-scroll-track-bg);\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar-thumb {\n  background: var(--ff-select-scroll-thumb-color);\n  border-radius: 10px;\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar-thumb:hover {\n  background: var(--ff-select-scroll-thumb-hover);\n}\n.ff-multiselect-dropdown-container .no-options {\n  color: var(--pop-up-background-blur);\n  text-align: center;\n  margin: 0;\n  padding: 10px;\n  line-height: 12px;\n}\n.ff-multiselect-dropdown-container .dropdown-option-container {\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  height: 32px;\n  padding: 4px 8px;\n  gap: 4px;\n  border-radius: 4px 0px 0px 0px;\n  background-color: white;\n}\n.ff-multiselect-dropdown-container .dropdown-option-container .dropdown-option-label {\n  color: var(--ff-select-text-color);\n}\n.ff-multiselect-dropdown-container .dropdown-option-container:hover {\n  background-color: var(--hover-color);\n}\n.ff-multiselect-dropdown-container:focus {\n  outline: none;\n}\n.ff-multiselect-dropdown-container .select-button-container {\n  box-sizing: border-box;\n  width: 100%;\n  border-top: 1px solid var(--slider-table-color);\n  height: 30px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}";
-styleInject(css_248z$J);
+var css_248z$L = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd, .ff-multiselect-dropdown-container .no-options, .ff-multiselect-dropdown-container .dropdown-option-container .dropdown-option-label {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-multiselect-dropdown-container {\n  position: absolute;\n  background: var(--drawer-footer-bg);\n  z-index: 1000;\n  box-shadow: 0px 1px 4px 0px var(--ff-select-option-wrapper-box-shadow);\n  border: 0.5px solid var(--ff-select-option-border-color);\n  border-radius: 4px;\n  box-sizing: border-box;\n  margin-block: 4px;\n  max-height: 160px;\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper {\n  max-height: 128px;\n  overflow-y: auto;\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar {\n  width: 4px;\n  height: 40px;\n  border-radius: 12px 0px 0px 0px;\n  background: var(--description-text);\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar-track {\n  background: var(--ff-select-scroll-track-bg);\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar-thumb {\n  background: var(--ff-select-scroll-thumb-color);\n  border-radius: 10px;\n}\n.ff-multiselect-dropdown-container .ff-multiselect-options-wrapper::-webkit-scrollbar-thumb:hover {\n  background: var(--ff-select-scroll-thumb-hover);\n}\n.ff-multiselect-dropdown-container .no-options {\n  color: var(--pop-up-background-blur);\n  text-align: center;\n  margin: 0;\n  padding: 10px;\n  line-height: 12px;\n}\n.ff-multiselect-dropdown-container .dropdown-option-container {\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  height: 32px;\n  padding: 4px 8px;\n  gap: 4px;\n  border-radius: 4px 0px 0px 0px;\n  background-color: white;\n}\n.ff-multiselect-dropdown-container .dropdown-option-container .dropdown-option-label {\n  color: var(--ff-select-text-color);\n}\n.ff-multiselect-dropdown-container .dropdown-option-container:hover {\n  background-color: var(--hover-color);\n}\n.ff-multiselect-dropdown-container:focus {\n  outline: none;\n}\n.ff-multiselect-dropdown-container .select-button-container {\n  box-sizing: border-box;\n  width: 100%;\n  border-top: 1px solid var(--slider-table-color);\n  height: 30px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}";
+styleInject(css_248z$L);
 
 const Dropdown$2 = /*#__PURE__*/React.forwardRef(({
   options,
@@ -1279,8 +1365,8 @@ const MultiSelect = ({
   });
 };
 
-var css_248z$I = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-toaster-overlay {\n  position: fixed;\n  bottom: 0;\n  right: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  pointer-events: none;\n  justify-content: flex-end;\n  align-items: flex-end;\n}\n.ff-toaster-overlay .ff-toaster {\n  background-color: var(--drawer-footer-bg);\n  display: flex;\n  border-radius: 10px;\n  margin: 16px;\n  pointer-events: auto;\n  min-width: 320px;\n  max-width: 600px;\n  gap: 8px;\n  box-shadow: 0px 1px 4px 0px var(--toaster-boxshadow);\n  animation: slideInToasterBottomRight 0.5s forwards;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container {\n  padding: 8px;\n  display: flex;\n  border-radius: 10px;\n  gap: 8px;\n  width: 100%;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container::before {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  border-radius: 8px;\n  padding: 1px;\n  -webkit-mask: linear-gradient(var(--drawer-footer-bg) 0 0) content-box, linear-gradient(var(--drawer-footer-bg) 0 0);\n  -webkit-mask-composite: xor;\n  mask-composite: exclude;\n  z-index: -1;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center;\n  gap: 4px;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content__title {\n  max-width: 500px;\n  word-wrap: break-word;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content__message {\n  max-width: 500px;\n  word-wrap: break-word;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content__prompt {\n  margin-top: 4px;\n  display: flex;\n  gap: 10px;\n}\n.ff-toaster-overlay .ff-toaster--success::before {\n  background: var(--toaster-success-border);\n}\n.ff-toaster-overlay .ff-toaster--warning::before {\n  background: var(--toaster-warning-border);\n}\n.ff-toaster-overlay .ff-toaster--info::before {\n  background: var(--toaster-info-border);\n}\n.ff-toaster-overlay .ff-toaster--danger::before, .ff-toaster-overlay .ff-toaster--confirm::before {\n  background: var(--toaster-danger_confirm-border);\n}\n.ff-toaster-overlay .ff-toaster .ff-close-icon-wrapper {\n  box-sizing: border-box;\n  cursor: pointer;\n  height: fit-content;\n  width: fit-content;\n  border-radius: 8px;\n  padding: 8px;\n  background: var(--toast-close-icon-wrapper-bg);\n  margin-left: auto;\n}\n.ff-toaster-overlay.exiting {\n  animation: slideOutToasterBottomRight 0.5s forwards;\n}\n\n@keyframes slideOutToasterBottomRight {\n  from {\n    transform: translateX(0%);\n  }\n  to {\n    transform: translateX(100%);\n  }\n}\n@keyframes slideInToasterBottomRight {\n  from {\n    transform: translateX(100%);\n  }\n  to {\n    transform: translateX(0%);\n  }\n}\n.fireflink-stories-toaster-container .fireflink-stories-toaster-container-row {\n  display: flex;\n  gap: 5px;\n  margin: 15px;\n}";
-styleInject(css_248z$I);
+var css_248z$K = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-toaster-overlay {\n  position: fixed;\n  bottom: 0;\n  right: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  pointer-events: none;\n  justify-content: flex-end;\n  align-items: flex-end;\n}\n.ff-toaster-overlay .ff-toaster {\n  background-color: var(--drawer-footer-bg);\n  display: flex;\n  border-radius: 10px;\n  margin: 16px;\n  pointer-events: auto;\n  min-width: 320px;\n  max-width: 600px;\n  gap: 8px;\n  box-shadow: 0px 1px 4px 0px var(--toaster-boxshadow);\n  animation: slideInToasterBottomRight 0.5s forwards;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container {\n  padding: 8px;\n  display: flex;\n  border-radius: 10px;\n  gap: 8px;\n  width: 100%;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container::before {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  border-radius: 8px;\n  padding: 1px;\n  -webkit-mask: linear-gradient(var(--drawer-footer-bg) 0 0) content-box, linear-gradient(var(--drawer-footer-bg) 0 0);\n  -webkit-mask-composite: xor;\n  mask-composite: exclude;\n  z-index: -1;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center;\n  gap: 4px;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content__title {\n  max-width: 500px;\n  word-wrap: break-word;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content__message {\n  max-width: 500px;\n  word-wrap: break-word;\n}\n.ff-toaster-overlay .ff-toaster .ff-toaster-container .ff-toaster-content__prompt {\n  margin-top: 4px;\n  display: flex;\n  gap: 10px;\n}\n.ff-toaster-overlay .ff-toaster--success::before {\n  background: var(--toaster-success-border);\n}\n.ff-toaster-overlay .ff-toaster--warning::before {\n  background: var(--toaster-warning-border);\n}\n.ff-toaster-overlay .ff-toaster--info::before {\n  background: var(--toaster-info-border);\n}\n.ff-toaster-overlay .ff-toaster--danger::before, .ff-toaster-overlay .ff-toaster--confirm::before {\n  background: var(--toaster-danger_confirm-border);\n}\n.ff-toaster-overlay .ff-toaster .ff-close-icon-wrapper {\n  box-sizing: border-box;\n  cursor: pointer;\n  height: fit-content;\n  width: fit-content;\n  border-radius: 8px;\n  padding: 8px;\n  background: var(--toast-close-icon-wrapper-bg);\n  margin-left: auto;\n}\n.ff-toaster-overlay.exiting {\n  animation: slideOutToasterBottomRight 0.5s forwards;\n}\n\n@keyframes slideOutToasterBottomRight {\n  from {\n    transform: translateX(0%);\n  }\n  to {\n    transform: translateX(100%);\n  }\n}\n@keyframes slideInToasterBottomRight {\n  from {\n    transform: translateX(100%);\n  }\n  to {\n    transform: translateX(0%);\n  }\n}\n.fireflink-stories-toaster-container .fireflink-stories-toaster-container-row {\n  display: flex;\n  gap: 5px;\n  margin: 15px;\n}";
+styleInject(css_248z$K);
 
 const Toaster = ({
   isOpen = false,
@@ -1388,8 +1474,8 @@ const Toaster = ({
   }), document.body);
 };
 
-var css_248z$H = "/* Container */\n.ff-container {\n  margin-right: auto;\n  margin-left: auto;\n  width: 90%;\n  display: grid;\n}\n\n.ff-container-fluid {\n  width: 100%;\n  margin-right: auto;\n  margin-left: auto;\n  display: grid;\n}\n\n/* Row */\n.ff-row {\n  display: grid;\n  grid-template-columns: repeat(12, 1fr);\n}\n\n/* Column sizes based on a 12-column layout */\n.ff-col {\n  grid-column: span 12;\n}\n\n.ff-col-1 {\n  grid-column: span 1;\n}\n\n.ff-col-2 {\n  grid-column: span 2;\n}\n\n.ff-col-3 {\n  grid-column: span 3;\n}\n\n.ff-col-4 {\n  grid-column: span 4;\n}\n\n.ff-col-5 {\n  grid-column: span 5;\n}\n\n.ff-col-6 {\n  grid-column: span 6;\n}\n\n.ff-col-7 {\n  grid-column: span 7;\n}\n\n.ff-col-8 {\n  grid-column: span 8;\n}\n\n.ff-col-9 {\n  grid-column: span 9;\n}\n\n.ff-col-10 {\n  grid-column: span 10;\n}\n\n.ff-col-11 {\n  grid-column: span 11;\n}\n\n.ff-col-12 {\n  grid-column: span 12;\n}\n\n@media (max-width: 768px) {\n  /* Stacking columns on small screens */\n  .ff-col {\n    grid-column: span 12;\n  }\n}";
-styleInject(css_248z$H);
+var css_248z$J = "/* Container */\n.ff-container {\n  margin-right: auto;\n  margin-left: auto;\n  width: 90%;\n  display: grid;\n}\n\n.ff-container-fluid {\n  width: 100%;\n  margin-right: auto;\n  margin-left: auto;\n  display: grid;\n}\n\n/* Row */\n.ff-row {\n  display: grid;\n  grid-template-columns: repeat(12, 1fr);\n}\n\n/* Column sizes based on a 12-column layout */\n.ff-col {\n  grid-column: span 12;\n}\n\n.ff-col-1 {\n  grid-column: span 1;\n}\n\n.ff-col-2 {\n  grid-column: span 2;\n}\n\n.ff-col-3 {\n  grid-column: span 3;\n}\n\n.ff-col-4 {\n  grid-column: span 4;\n}\n\n.ff-col-5 {\n  grid-column: span 5;\n}\n\n.ff-col-6 {\n  grid-column: span 6;\n}\n\n.ff-col-7 {\n  grid-column: span 7;\n}\n\n.ff-col-8 {\n  grid-column: span 8;\n}\n\n.ff-col-9 {\n  grid-column: span 9;\n}\n\n.ff-col-10 {\n  grid-column: span 10;\n}\n\n.ff-col-11 {\n  grid-column: span 11;\n}\n\n.ff-col-12 {\n  grid-column: span 12;\n}\n\n@media (max-width: 768px) {\n  /* Stacking columns on small screens */\n  .ff-col {\n    grid-column: span 12;\n  }\n}";
+styleInject(css_248z$J);
 
 const Container = ({
   children,
@@ -1431,8 +1517,8 @@ const Col = ({
   });
 };
 
-var css_248z$G = ".ff--switch-container {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n.ff--switch-container .ff--switch-checkbox {\n  height: 0;\n  width: 0;\n  display: none;\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label .ff--switch-button {\n  right: -1px;\n  border: 1px solid var(--brand-color);\n  background: var(--toggle-button-bg-color);\n  transition: all 0.3s;\n  box-shadow: 0px 0px 2px 0px var(--toggle-strip-shadow);\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label .ff--switch-button .ff-checked-icon--primary svg path {\n  fill: var(--brand-color);\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label--primary {\n  background: var(--brand-color);\n  transition: all 0.3s;\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label:disabled {\n  cursor: default;\n  color: var(--disable-color);\n  background: var(--disable-color);\n}\n.ff--switch-container .ff--switch-checkbox:disabled {\n  cursor: no-drop;\n}\n.ff--switch-container .ff--switch-label {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  cursor: pointer;\n  border-radius: 8px;\n  position: relative;\n  background: var(--toggle-strip-color);\n  transition: all 0.3s;\n}\n.ff--switch-container .ff--switch-label--disabled {\n  opacity: 0.5;\n  cursor: no-drop;\n}\n.ff--switch-container .ff--switch-label .ff--switch-button {\n  position: absolute;\n  left: 0;\n  border: 1px solid var(--toggle-strip-color);\n  display: flex;\n  background: var(--toggle-button-bg-color);\n  border-radius: 50%;\n  box-shadow: 0px 0px 2px 0px var(--toggle-strip-shadow);\n  transition: all 0.3s;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n}\n.ff--switch-container .ff--switch-label .ff--switch-button .ff-unchecked-icon--primary svg path {\n  fill: var(--toggle-disable-icon-color);\n}\n.ff--switch-container .default--small {\n  width: 24px;\n  height: 10px;\n}\n.ff--switch-container .default--small .ff--switch-button {\n  width: 16px;\n  height: 16px;\n  transform: translateX(0);\n}\n.ff--switch-container .default--small .ff--switch-button.checked {\n  transform: translateX(10px);\n}\n.ff--switch-container .default--medium {\n  width: 32px;\n  height: 14px;\n}\n.ff--switch-container .default--medium .ff--switch-button {\n  width: 20px;\n  height: 20px;\n  transform: translateX(0);\n}\n.ff--switch-container .default--medium .ff--switch-button.checked {\n  transform: translateX(14px);\n}\n.ff--switch-container .default--large {\n  width: 40px;\n  height: 16px;\n}\n.ff--switch-container .default--large .ff--switch-button {\n  width: 24px;\n  height: 24px;\n  transform: translateX(0);\n}\n.ff--switch-container .default--large .ff--switch-button.checked {\n  transform: translateX(16px);\n}";
-styleInject(css_248z$G);
+var css_248z$I = ".ff--switch-container {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n.ff--switch-container .ff--switch-checkbox {\n  height: 0;\n  width: 0;\n  display: none;\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label .ff--switch-button {\n  right: -1px;\n  border: 1px solid var(--brand-color);\n  background: var(--toggle-button-bg-color);\n  transition: all 0.3s;\n  box-shadow: 0px 0px 2px 0px var(--toggle-strip-shadow);\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label .ff--switch-button .ff-checked-icon--primary svg path {\n  fill: var(--brand-color);\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label--primary {\n  background: var(--brand-color);\n  transition: all 0.3s;\n}\n.ff--switch-container .ff--switch-checkbox:checked + .ff--switch-label:disabled {\n  cursor: default;\n  color: var(--disable-color);\n  background: var(--disable-color);\n}\n.ff--switch-container .ff--switch-checkbox:disabled {\n  cursor: no-drop;\n}\n.ff--switch-container .ff--switch-label {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  cursor: pointer;\n  border-radius: 8px;\n  position: relative;\n  background: var(--toggle-strip-color);\n  transition: all 0.3s;\n}\n.ff--switch-container .ff--switch-label--disabled {\n  opacity: 0.5;\n  cursor: no-drop;\n}\n.ff--switch-container .ff--switch-label .ff--switch-button {\n  position: absolute;\n  left: 0;\n  border: 1px solid var(--toggle-strip-color);\n  display: flex;\n  background: var(--toggle-button-bg-color);\n  border-radius: 50%;\n  box-shadow: 0px 0px 2px 0px var(--toggle-strip-shadow);\n  transition: all 0.3s;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n}\n.ff--switch-container .ff--switch-label .ff--switch-button .ff-unchecked-icon--primary svg path {\n  fill: var(--toggle-disable-icon-color);\n}\n.ff--switch-container .default--small {\n  width: 24px;\n  height: 10px;\n}\n.ff--switch-container .default--small .ff--switch-button {\n  width: 16px;\n  height: 16px;\n  transform: translateX(0);\n}\n.ff--switch-container .default--small .ff--switch-button.checked {\n  transform: translateX(10px);\n}\n.ff--switch-container .default--medium {\n  width: 32px;\n  height: 14px;\n}\n.ff--switch-container .default--medium .ff--switch-button {\n  width: 20px;\n  height: 20px;\n  transform: translateX(0);\n}\n.ff--switch-container .default--medium .ff--switch-button.checked {\n  transform: translateX(14px);\n}\n.ff--switch-container .default--large {\n  width: 40px;\n  height: 16px;\n}\n.ff--switch-container .default--large .ff--switch-button {\n  width: 24px;\n  height: 24px;\n  transform: translateX(0);\n}\n.ff--switch-container .default--large .ff--switch-button.checked {\n  transform: translateX(16px);\n}";
+styleInject(css_248z$I);
 
 const Toggle = ({
   onChange,
@@ -1510,8 +1596,8 @@ const Toggle = ({
   });
 };
 
-var css_248z$F = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-chip-wrapper .ff-default-chip-style {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-chip-wrapper .ff-default-chip-style--custom {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-chip-wrapper {\n  display: inline-flex;\n  margin: 5px;\n  justify-content: center;\n  align-items: center;\n}\n.ff-chip-wrapper .ff-default-chip-style {\n  display: flex;\n  align-items: center;\n  justify-content: space-around;\n  width: fit-content;\n  gap: 5px;\n  height: 17px;\n  border-radius: 25px;\n  padding: 1px 6px;\n  line-height: 15px;\n  border: none;\n  transition: transform 0.5s ease, box-shadow 0.5s ease, padding 1s ease;\n  box-shadow: 1px 1px 6px 0px var(--ff-chips-blur-color) inset, -1px -1px 2px 0px var(--ff-chip-bg) inset, 1px -1px 2px 0px var(--ff-chips-blur-color) inset, 1px 1px 2px 0px var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--fullText:hover {\n  box-shadow: 1px 1px 6px 0px var(--ff-chips-blur-color) inset, -1px -1px 2px 0px var(--ff-chip-bg) inset, 1px -1px 2px 0px var(--ff-chips-blur-color) inset, 1px 1px 2px 0px var(--ff-chip-bg);\n  padding-right: 12px;\n}\n.ff-chip-wrapper .ff-default-chip-style--primary {\n  background-color: var(--ff-chips-fill-color);\n  color: var(--ff-chip-bg);\n  color: var(--ff-chip-text-color);\n}\n.ff-chip-wrapper .ff-default-chip-style--success {\n  background-color: var(--ff-success);\n  color: var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--error {\n  background-color: var(--ff-error-light);\n  color: var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--warning {\n  background-color: var(--ff-warning);\n  color: var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--custom {\n  background: rgba(97, 11, 134, 0.1019607843);\n  color: #610b86;\n  padding: 2px 8px;\n  border-radius: 12px;\n  cursor: pointer;\n  white-space: nowrap;\n  box-shadow: none;\n  transition: background-color 0.3s ease, color 0.3s ease;\n}\n.ff-chip-wrapper .ff-default-chip-style--custom:hover {\n  background-color: #610b86;\n  color: #fdfaff;\n}";
-styleInject(css_248z$F);
+var css_248z$H = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-chip-wrapper .ff-default-chip-style {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-chip-wrapper .ff-default-chip-style--custom {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-chip-wrapper {\n  display: inline-flex;\n  margin: 5px;\n  justify-content: center;\n  align-items: center;\n}\n.ff-chip-wrapper .ff-default-chip-style {\n  display: flex;\n  align-items: center;\n  justify-content: space-around;\n  width: fit-content;\n  gap: 5px;\n  height: 17px;\n  border-radius: 25px;\n  padding: 1px 6px;\n  line-height: 15px;\n  border: none;\n  transition: transform 0.5s ease, box-shadow 0.5s ease, padding 1s ease;\n  box-shadow: 1px 1px 6px 0px var(--ff-chips-blur-color) inset, -1px -1px 2px 0px var(--ff-chip-bg) inset, 1px -1px 2px 0px var(--ff-chips-blur-color) inset, 1px 1px 2px 0px var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--fullText:hover {\n  box-shadow: 1px 1px 6px 0px var(--ff-chips-blur-color) inset, -1px -1px 2px 0px var(--ff-chip-bg) inset, 1px -1px 2px 0px var(--ff-chips-blur-color) inset, 1px 1px 2px 0px var(--ff-chip-bg);\n  padding-right: 12px;\n}\n.ff-chip-wrapper .ff-default-chip-style--primary {\n  background-color: var(--ff-chips-fill-color);\n  color: var(--ff-chip-bg);\n  color: var(--ff-chip-text-color);\n}\n.ff-chip-wrapper .ff-default-chip-style--success {\n  background-color: var(--ff-success);\n  color: var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--error {\n  background-color: var(--ff-error-light);\n  color: var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--warning {\n  background-color: var(--ff-warning);\n  color: var(--ff-chip-bg);\n}\n.ff-chip-wrapper .ff-default-chip-style--custom {\n  background: rgba(97, 11, 134, 0.1019607843);\n  color: #610b86;\n  padding: 2px 8px;\n  border-radius: 12px;\n  cursor: pointer;\n  white-space: nowrap;\n  box-shadow: none;\n  transition: background-color 0.3s ease, color 0.3s ease;\n}\n.ff-chip-wrapper .ff-default-chip-style--custom:hover {\n  background-color: #610b86;\n  color: #fdfaff;\n}";
+styleInject(css_248z$H);
 
 const Chip = ({
   label = '',
@@ -1540,8 +1626,8 @@ const Chip = ({
   });
 };
 
-var css_248z$E = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-input-container .ff-input, .ff-input-container .ff-input-label-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-input-container:focus-within .ff-input-label-container, .ff-input-container:focus-within .ff-input::placeholder, .ff-input-container:focus-within .ff-input-label-container::placeholder, .ff-input-container .ff-input-message, .ff-input-container--float .ff-input-label-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-input-container {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n}\n.ff-input-container .ff-input, .ff-input-container .ff-input-label-container {\n  padding: 6px 8px;\n  border: 1px solid var(--input-default-border-color);\n  border-radius: 4px;\n  outline: none;\n  line-height: 18px;\n}\n.ff-input-container .ff-input--medium {\n  padding: 10px 9px;\n}\n.ff-input-container .ff-input:disabled, .ff-input-container .ff-input-label-container:disabled {\n  cursor: not-allowed;\n}\n.ff-input-container .ff-input::placeholder, .ff-input-container .ff-input-label-container::placeholder {\n  opacity: 0;\n  line-height: 18px;\n}\n.ff-input-container .ff-input--disabled {\n  background: transparent;\n  border-color: var(--input-default-border-color);\n}\n.ff-input-container .ff-input--danger {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-container .ff-input--transparentBackground {\n  background: transparent;\n}\n.ff-input-container .ff-input--no-border {\n  border: none;\n}\n.ff-input-container .ff-input-label-container {\n  display: flex;\n  gap: 2px;\n  position: absolute;\n  border: none;\n  outline: none;\n  line-height: 18px;\n  margin-top: 1px;\n  transition: all 0.3s ease-in-out;\n}\n.ff-input-container .ff-input-label-container--medium {\n  line-height: 25px;\n}\n.ff-input-container .ff-input-label-container .ff-input-label {\n  color: var(--input-default-label-color);\n}\n.ff-input-container .ff-input-label-container .ff-input-label--danger {\n  color: var(--input-error-text-color);\n}\n.ff-input-container .ff-input-label-container .ff-input-label--disabled {\n  color: var(--input-default-border-color);\n  background-color: var(--input-label-bg-color);\n}\n.ff-input-container .ff-input-label-container .required-asterisk {\n  color: var(--input-error-text-color);\n}\n.ff-input-container:hover .ff-input-label {\n  color: var(--input-hover-border-color);\n}\n.ff-input-container:hover .ff-input-label--no-hover {\n  color: var(--input-default-label-color);\n}\n.ff-input-container:hover .ff-input-label--disabled {\n  color: var(--input-default-border-color);\n}\n.ff-input-container:hover .ff-input-label--danger {\n  color: var(--input-error-text-color);\n}\n.ff-input-container:hover .ff-input, .ff-input-container:hover .ff-input-label-container {\n  border-color: var(--input-hover-border-color);\n}\n.ff-input-container:hover .ff-input--no-hover {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-container:hover .ff-input--disabled {\n  background: transparent;\n  border-color: var(--input-default-border-color);\n}\n.ff-input-container:hover .ff-input--danger {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-container:focus-within .ff-input-label-container {\n  top: -6px;\n  background-color: var(--input-label-bg-color);\n  line-height: 12px;\n  padding: 0px 2px;\n  margin-left: 10px;\n}\n.ff-input-container:focus-within .ff-input-label--primary {\n  color: var(--brand-color);\n}\n.ff-input-container:focus-within .ff-input-label--danger {\n  color: var(--input-error-text-color);\n}\n.ff-input-container:focus-within .ff-input--primary {\n  border-color: var(--brand-color);\n}\n.ff-input-container:focus-within .ff-input--danger {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-container:focus-within .ff-input::placeholder, .ff-input-container:focus-within .ff-input-label-container::placeholder {\n  opacity: 1;\n  margin-bottom: 1px;\n}\n.ff-input-container .ff-input-message {\n  padding: 0px 4px;\n  margin-left: 8px;\n  line-height: 12px;\n}\n.ff-input-container .ff-input-message--danger {\n  color: var(--input-error-text-color);\n}\n.ff-input-container--float .ff-input-label-container {\n  top: -6px;\n  background-color: var(--input-label-bg-color);\n  line-height: 12px;\n  padding: 0px 2px;\n  margin-left: 10px;\n}\n.ff-input-container--float--disabled {\n  cursor: not-allowed;\n}\n.ff-input-container--float--disabled .ff-input-label-container {\n  cursor: not-allowed;\n}";
-styleInject(css_248z$E);
+var css_248z$G = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-input-container .ff-input, .ff-input-container .ff-input-label-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-input-container:focus-within .ff-input-label-container, .ff-input-container:focus-within .ff-input::placeholder, .ff-input-container:focus-within .ff-input-label-container::placeholder, .ff-input-container .ff-input-message, .ff-input-container--float .ff-input-label-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-input-container {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n}\n.ff-input-container .ff-input, .ff-input-container .ff-input-label-container {\n  padding: 6px 8px;\n  border: 1px solid var(--input-default-border-color);\n  border-radius: 4px;\n  outline: none;\n  line-height: 18px;\n}\n.ff-input-container .ff-input--medium {\n  padding: 10px 9px;\n}\n.ff-input-container .ff-input:disabled, .ff-input-container .ff-input-label-container:disabled {\n  cursor: not-allowed;\n}\n.ff-input-container .ff-input::placeholder, .ff-input-container .ff-input-label-container::placeholder {\n  opacity: 0;\n  line-height: 18px;\n}\n.ff-input-container .ff-input--disabled {\n  background: transparent;\n  border-color: var(--input-default-border-color);\n}\n.ff-input-container .ff-input--danger {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-container .ff-input--transparentBackground {\n  background: transparent;\n}\n.ff-input-container .ff-input--no-border {\n  border: none;\n}\n.ff-input-container .ff-input-label-container {\n  display: flex;\n  gap: 2px;\n  position: absolute;\n  border: none;\n  outline: none;\n  line-height: 18px;\n  margin-top: 1px;\n  transition: all 0.3s ease-in-out;\n}\n.ff-input-container .ff-input-label-container--medium {\n  line-height: 25px;\n}\n.ff-input-container .ff-input-label-container .ff-input-label {\n  color: var(--input-default-label-color);\n}\n.ff-input-container .ff-input-label-container .ff-input-label--danger {\n  color: var(--input-error-text-color);\n}\n.ff-input-container .ff-input-label-container .ff-input-label--disabled {\n  color: var(--input-default-border-color);\n  background-color: var(--input-label-bg-color);\n}\n.ff-input-container .ff-input-label-container .required-asterisk {\n  color: var(--input-error-text-color);\n}\n.ff-input-container:hover .ff-input-label {\n  color: var(--input-hover-border-color);\n}\n.ff-input-container:hover .ff-input-label--no-hover {\n  color: var(--input-default-label-color);\n}\n.ff-input-container:hover .ff-input-label--disabled {\n  color: var(--input-default-border-color);\n}\n.ff-input-container:hover .ff-input-label--danger {\n  color: var(--input-error-text-color);\n}\n.ff-input-container:hover .ff-input, .ff-input-container:hover .ff-input-label-container {\n  border-color: var(--input-hover-border-color);\n}\n.ff-input-container:hover .ff-input--no-hover {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-container:hover .ff-input--disabled {\n  background: transparent;\n  border-color: var(--input-default-border-color);\n}\n.ff-input-container:hover .ff-input--danger {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-container:focus-within .ff-input-label-container {\n  top: -6px;\n  background-color: var(--input-label-bg-color);\n  line-height: 12px;\n  padding: 0px 2px;\n  margin-left: 10px;\n}\n.ff-input-container:focus-within .ff-input-label--primary {\n  color: var(--brand-color);\n}\n.ff-input-container:focus-within .ff-input-label--danger {\n  color: var(--input-error-text-color);\n}\n.ff-input-container:focus-within .ff-input--primary {\n  border-color: var(--brand-color);\n}\n.ff-input-container:focus-within .ff-input--danger {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-container:focus-within .ff-input::placeholder, .ff-input-container:focus-within .ff-input-label-container::placeholder {\n  opacity: 1;\n  margin-bottom: 1px;\n}\n.ff-input-container .ff-input-message {\n  padding: 0px 4px;\n  margin-left: 8px;\n  line-height: 12px;\n}\n.ff-input-container .ff-input-message--danger {\n  color: var(--input-error-text-color);\n}\n.ff-input-container--float .ff-input-label-container {\n  top: -6px;\n  background-color: var(--input-label-bg-color);\n  line-height: 12px;\n  padding: 0px 2px;\n  margin-left: 10px;\n}\n.ff-input-container--float--disabled {\n  cursor: not-allowed;\n}\n.ff-input-container--float--disabled .ff-input-label-container {\n  cursor: not-allowed;\n}";
+styleInject(css_248z$G);
 
 const Input = ({
   type = 'text',
@@ -1619,8 +1705,8 @@ const Input = ({
   });
 };
 
-var css_248z$D = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-radial-chart-container svg text {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-radial-chart-container {\n  cursor: pointer;\n}\n.ff-radial-chart-container svg text {\n  font-size: var(--fontSize) !important;\n  font-weight: 400;\n}";
-styleInject(css_248z$D);
+var css_248z$F = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-radial-chart-container svg text {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-radial-chart-container {\n  cursor: pointer;\n}\n.ff-radial-chart-container svg text {\n  font-size: var(--fontSize) !important;\n  font-weight: 400;\n}";
+styleInject(css_248z$F);
 
 const useColorMappings$1 = () => React.useMemo(() => {
   return {
@@ -1762,8 +1848,8 @@ const RadialChart = ({
   });
 };
 
-var css_248z$C = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-expandable-chip-menu--medium, .ff-expandable-chip-menu .ff-sub-chip--medium {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-expandable-chip-menu {\n  display: inline-flex;\n  gap: 16px;\n  align-items: center;\n  border-radius: 16px;\n  cursor: pointer;\n  overflow: hidden;\n  width: auto;\n  padding: 4px 8px;\n  transition: all 0.3s ease;\n}\n.ff-expandable-chip-menu--primary {\n  border: 0.5px solid var(--brand-color);\n  background-color: var(--expandable-menu-default-bg);\n}\n.ff-expandable-chip-menu .ff-label-chip {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 4px;\n  white-space: nowrap;\n  padding: 2px 0;\n}\n.ff-expandable-chip-menu .ff-label-chip .arrow-icon {\n  height: 14px;\n  width: 14px;\n  display: grid;\n  place-items: center;\n}\n.ff-expandable-chip-menu .ff-label-chip--primary {\n  color: var(--brand-color);\n}\n.ff-expandable-chip-menu--disabled {\n  opacity: 0.5;\n}\n.ff-expandable-chip-menu--disabled:disabled {\n  pointer-events: none;\n}\n.ff-expandable-chip-menu--medium {\n  line-height: 18px;\n}\n.ff-expandable-chip-menu .ff-sub-chips {\n  display: flex;\n  gap: 8px;\n  max-width: 500px;\n  overflow-x: auto;\n  -ms-overflow-style: none;\n  transform: scaleX(0);\n  transform-origin: left;\n  transition: transform 0.3s ease, opacity 0.3s ease;\n  opacity: 0;\n}\n.ff-expandable-chip-menu .ff-sub-chips::-webkit-scrollbar {\n  display: none;\n}\n.ff-expandable-chip-menu.expanded .ff-sub-chips {\n  transform: scaleX(1);\n  opacity: 1;\n}\n.ff-expandable-chip-menu .ff-sub-chip {\n  padding: 2px 8px;\n  border-radius: 12px;\n  white-space: nowrap;\n  transition: background-color 0.3s ease, color 0.3s ease;\n  opacity: 0;\n  transform: translateX(-10px);\n  animation: fadeIn 0.5s ease forwards;\n}\n.ff-expandable-chip-menu .ff-sub-chip--primary {\n  background: var(--expandable-menu-option-bg);\n  color: var(--brand-color);\n}\n.ff-expandable-chip-menu .ff-sub-chip--primary:hover, .ff-expandable-chip-menu .ff-sub-chip--primary.selected {\n  background-color: var(--brand-color);\n  color: var(--expandable-menu-default-bg);\n}\n.ff-expandable-chip-menu .ff-sub-chip--medium {\n  line-height: 18px;\n}\n@keyframes fadeIn {\n  0% {\n    opacity: 0;\n    transform: translateX(-10px);\n  }\n  100% {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n.ff-expandable-chip-menu.expanded .ff-sub-chip {\n  animation: fadeIn 0.5s ease forwards;\n}";
-styleInject(css_248z$C);
+var css_248z$E = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-expandable-chip-menu--medium, .ff-expandable-chip-menu .ff-sub-chip--medium {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-expandable-chip-menu {\n  display: inline-flex;\n  gap: 16px;\n  align-items: center;\n  border-radius: 16px;\n  cursor: pointer;\n  overflow: hidden;\n  width: auto;\n  padding: 4px 8px;\n  transition: all 0.3s ease;\n}\n.ff-expandable-chip-menu--primary {\n  border: 0.5px solid var(--brand-color);\n  background-color: var(--expandable-menu-default-bg);\n}\n.ff-expandable-chip-menu .ff-label-chip {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 4px;\n  white-space: nowrap;\n  padding: 2px 0;\n}\n.ff-expandable-chip-menu .ff-label-chip .arrow-icon {\n  height: 14px;\n  width: 14px;\n  display: grid;\n  place-items: center;\n}\n.ff-expandable-chip-menu .ff-label-chip--primary {\n  color: var(--brand-color);\n}\n.ff-expandable-chip-menu--disabled {\n  opacity: 0.5;\n}\n.ff-expandable-chip-menu--disabled:disabled {\n  pointer-events: none;\n}\n.ff-expandable-chip-menu--medium {\n  line-height: 18px;\n}\n.ff-expandable-chip-menu .ff-sub-chips {\n  display: flex;\n  gap: 8px;\n  max-width: 500px;\n  overflow-x: auto;\n  -ms-overflow-style: none;\n  transform: scaleX(0);\n  transform-origin: left;\n  transition: transform 0.3s ease, opacity 0.3s ease;\n  opacity: 0;\n}\n.ff-expandable-chip-menu .ff-sub-chips::-webkit-scrollbar {\n  display: none;\n}\n.ff-expandable-chip-menu.expanded .ff-sub-chips {\n  transform: scaleX(1);\n  opacity: 1;\n}\n.ff-expandable-chip-menu .ff-sub-chip {\n  padding: 2px 8px;\n  border-radius: 12px;\n  white-space: nowrap;\n  transition: background-color 0.3s ease, color 0.3s ease;\n  opacity: 0;\n  transform: translateX(-10px);\n  animation: fadeIn 0.5s ease forwards;\n}\n.ff-expandable-chip-menu .ff-sub-chip--primary {\n  background: var(--expandable-menu-option-bg);\n  color: var(--brand-color);\n}\n.ff-expandable-chip-menu .ff-sub-chip--primary:hover, .ff-expandable-chip-menu .ff-sub-chip--primary.selected {\n  background-color: var(--brand-color);\n  color: var(--expandable-menu-default-bg);\n}\n.ff-expandable-chip-menu .ff-sub-chip--medium {\n  line-height: 18px;\n}\n@keyframes fadeIn {\n  0% {\n    opacity: 0;\n    transform: translateX(-10px);\n  }\n  100% {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n.ff-expandable-chip-menu.expanded .ff-sub-chip {\n  animation: fadeIn 0.5s ease forwards;\n}";
+styleInject(css_248z$E);
 
 const ExpandableMenu = ({
   label = '',
@@ -1852,8 +1938,8 @@ const useClickOutside = (ref, callback, ignoreRefs = []) => {
   }, [ref, callback, ignoreRefs]);
 };
 
-var css_248z$B = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-select-dropdown-wrapper .ff-select-options-wrapper {\n  max-height: 160px;\n  z-index: 100;\n  position: absolute;\n  min-width: 100px;\n  border: 1px solid var(--ff-select-option-border-color);\n  box-sizing: border-box;\n  margin-top: 4px;\n  border-radius: 4px;\n  background-color: var(--ff-select-background-color);\n  box-shadow: 0px 1px 4px 0px var(--ff-select-option-wrapper-box-shadow);\n  overflow: hidden auto;\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper::-webkit-scrollbar {\n  width: 4px;\n  height: 12px;\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper::-webkit-scrollbar-thumb {\n  background-color: var(--ff-select-scroll-thumb-color);\n  border-radius: 4px;\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper::-webkit-scrollbar-track {\n  background-color: transparent;\n  border-radius: 4px;\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper .ff-select-option {\n  width: calc(100% - 18px);\n  border: 1px solid transparent;\n  border-radius: 4px;\n  padding: 0px 8px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  cursor: pointer;\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper .ff-select-option:hover {\n  border-color: var(--ff-select-background-color);\n  background-color: var(--ff-select-option-hover-color);\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper .ff-select-no-option {\n  width: calc(100% - 16px);\n  margin: 0;\n  overflow: hidden;\n  padding: 0px 8px;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  cursor: not-allowed;\n}";
-styleInject(css_248z$B);
+var css_248z$D = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-select-dropdown-wrapper .ff-select-options-wrapper {\n  max-height: 160px;\n  z-index: 100;\n  position: absolute;\n  min-width: 100px;\n  border: 1px solid var(--ff-select-option-border-color);\n  box-sizing: border-box;\n  margin-top: 4px;\n  border-radius: 4px;\n  background-color: var(--ff-select-background-color);\n  box-shadow: 0px 1px 4px 0px var(--ff-select-option-wrapper-box-shadow);\n  overflow: hidden auto;\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper::-webkit-scrollbar {\n  width: 4px;\n  height: 12px;\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper::-webkit-scrollbar-thumb {\n  background-color: var(--ff-select-scroll-thumb-color);\n  border-radius: 4px;\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper::-webkit-scrollbar-track {\n  background-color: transparent;\n  border-radius: 4px;\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper .ff-select-option {\n  width: calc(100% - 18px);\n  border: 1px solid transparent;\n  border-radius: 4px;\n  padding: 0px 8px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  cursor: pointer;\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper .ff-select-option:hover {\n  border-color: var(--ff-select-background-color);\n  background-color: var(--ff-select-option-hover-color);\n}\n.ff-select-dropdown-wrapper .ff-select-options-wrapper .ff-select-no-option {\n  width: calc(100% - 16px);\n  margin: 0;\n  overflow: hidden;\n  padding: 0px 8px;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  cursor: not-allowed;\n}";
+styleInject(css_248z$D);
 
 const ffid = () => 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, char => ((char === 'x' ? Math.random() * 16 : Math.random() * 16 & 0x3 | 0x8) | 0).toString(16));
 
@@ -1931,8 +2017,8 @@ const Dropdown$1 = ({
   });
 };
 
-var css_248z$A = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-select-wrapper .ff-select, .ff-select-wrapper .ff-select-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-select-wrapper .ff-select-fieldset .ff-select-legend, .ff-select-wrapper .ff-select-label--active {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-select-wrapper {\n  position: relative;\n}\n.ff-select-wrapper .ff-select {\n  margin: 0;\n  padding: 0;\n  box-sizing: border-box;\n  min-height: 32px;\n  min-width: 100px;\n  display: flex;\n  align-items: end;\n  position: relative;\n}\n.ff-select-wrapper .ff-select-fieldset {\n  margin: 0;\n  padding: 25px 0px 0px 8px;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  height: 100%;\n  width: 100%;\n  border-radius: 4px;\n  display: block;\n}\n.ff-select-wrapper .ff-select-fieldset--border-radius {\n  border-radius: 0px 4px 4px 0px;\n}\n.ff-select-wrapper .ff-select-fieldset--no-label {\n  padding: 30px 0px 0px 8px;\n}\n.ff-select-wrapper .ff-select-fieldset--default {\n  opacity: 0;\n  border-color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select-fieldset--active {\n  opacity: 1;\n  border-color: var(--ff-select-brand-color);\n}\n.ff-select-wrapper .ff-select-fieldset--option {\n  opacity: 1;\n}\n.ff-select-wrapper .ff-select-fieldset--no-border {\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-fieldset--error {\n  border-color: var(--error-light);\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend {\n  padding: 0 2px;\n  letter-spacing: 0.5px;\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend--default {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 0;\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend--active {\n  transition: opacity 0.25s ease-out, transform 0.25s ease-out, font-size 0.25s ease-out, padding 0.25s ease-out;\n  opacity: 1;\n  color: var(--ff-select-brand-color);\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend--option {\n  opacity: 1;\n  color: var(--ff-select-default-color);\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend--error {\n  color: var(--error-light);\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend--required {\n  margin-right: 2px;\n}\n.ff-select-wrapper .ff-select-input {\n  position: absolute;\n  top: 6px;\n  right: auto;\n  bottom: auto;\n  left: auto;\n  width: calc(100% - 38px);\n  min-height: calc(100% - 8px);\n  padding: 0 28px 0 8px;\n  border-radius: 4px;\n  border: 1px solid transparent;\n  z-index: 100;\n  background: transparent;\n  outline: none;\n  color: var(--ff-select-text-color);\n}\n.ff-select-wrapper .ff-select-input:hover ~ .ff-select-label {\n  color: var(--ff-select-text-hover-color);\n}\n.ff-select-wrapper .ff-select-input--border-radius {\n  border-radius: 0px 4px 4px 0px;\n}\n.ff-select-wrapper .ff-select-input--default {\n  opacity: 1;\n  border-color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select-input--default:hover {\n  border-color: var(--ff-select-text-color);\n}\n.ff-select-wrapper .ff-select-input--default:hover ~ .ff-select-fieldset--option {\n  border-color: var(--ff-select-text-color);\n}\n.ff-select-wrapper .ff-select-input--default:hover ~ .ff-select-fieldset--option .ff-select-legend--option {\n  color: var(--ff-select-text-color);\n}\n.ff-select-wrapper .ff-select-input--no-label {\n  min-height: calc(100% - 2px);\n  margin-top: 0px;\n  top: 0px;\n}\n.ff-select-wrapper .ff-select-input--active {\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-input--active:hover {\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-input--no-border {\n  border: none;\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-input--no-border:hover {\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-input--no-border:hover ~ .ff-select-fieldset--no-border {\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-input--disable {\n  border-color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select-input--disable:hover {\n  border-color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select-input--disable:hover ~ .ff-select-label--default {\n  color: var(--ff-select-default-color);\n}\n.ff-select-wrapper .ff-select-input--error {\n  border-color: var(--error-light);\n}\n.ff-select-wrapper .ff-select-input--error:hover {\n  border-color: var(--error-light);\n}\n.ff-select-wrapper .ff-select-label {\n  position: absolute;\n  top: 13px;\n  right: auto;\n  bottom: auto;\n  left: 8px;\n  z-index: 1;\n  font-size: 12px;\n  top: 60%;\n  padding-left: 8px;\n}\n.ff-select-wrapper .ff-select-label--default {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 1;\n  color: var(--ff-select-default-color);\n  transform: translateY(-50%);\n}\n.ff-select-wrapper .ff-select-label--active {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 0;\n  transform: translateY(-150%);\n  padding: 0 6px;\n}\n.ff-select-wrapper .ff-select-label--required {\n  margin-right: 2px;\n}\n.ff-select-wrapper .ff-select-arrow {\n  position: absolute;\n  top: 60%;\n  height: 100%;\n  right: 10px;\n  transform: rotateX(180deg) translateY(50%);\n  cursor: pointer;\n}\n.ff-select-wrapper .ff-select-arrow--no-label {\n  top: 50%;\n}\n.ff-select-wrapper .ff-select-arrow--down {\n  transform: rotateX(0deg) translateY(-50%);\n  z-index: 101;\n}\n.ff-select-wrapper-error-text {\n  position: absolute;\n  top: auto;\n  right: auto;\n  bottom: -14px;\n  left: 12px;\n  white-space: nowrap;\n}";
-styleInject(css_248z$A);
+var css_248z$C = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-select-wrapper .ff-select, .ff-select-wrapper .ff-select-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-select-wrapper .ff-select-fieldset .ff-select-legend, .ff-select-wrapper .ff-select-label--active {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-select-wrapper {\n  position: relative;\n}\n.ff-select-wrapper .ff-select {\n  margin: 0;\n  padding: 0;\n  box-sizing: border-box;\n  min-height: 32px;\n  min-width: 100px;\n  display: flex;\n  align-items: end;\n  position: relative;\n}\n.ff-select-wrapper .ff-select-fieldset {\n  margin: 0;\n  padding: 25px 0px 0px 8px;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  height: 100%;\n  width: 100%;\n  border-radius: 4px;\n  display: block;\n}\n.ff-select-wrapper .ff-select-fieldset--border-radius {\n  border-radius: 0px 4px 4px 0px;\n}\n.ff-select-wrapper .ff-select-fieldset--no-label {\n  padding: 30px 0px 0px 8px;\n}\n.ff-select-wrapper .ff-select-fieldset--default {\n  opacity: 0;\n  border-color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select-fieldset--active {\n  opacity: 1;\n  border-color: var(--ff-select-brand-color);\n}\n.ff-select-wrapper .ff-select-fieldset--option {\n  opacity: 1;\n}\n.ff-select-wrapper .ff-select-fieldset--no-border {\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-fieldset--error {\n  border-color: var(--error-light);\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend {\n  padding: 0 2px;\n  letter-spacing: 0.5px;\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend--default {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 0;\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend--active {\n  transition: opacity 0.25s ease-out, transform 0.25s ease-out, font-size 0.25s ease-out, padding 0.25s ease-out;\n  opacity: 1;\n  color: var(--ff-select-brand-color);\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend--option {\n  opacity: 1;\n  color: var(--ff-select-default-color);\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend--error {\n  color: var(--error-light);\n}\n.ff-select-wrapper .ff-select-fieldset .ff-select-legend--required {\n  margin-right: 2px;\n}\n.ff-select-wrapper .ff-select-input {\n  position: absolute;\n  top: 6px;\n  right: auto;\n  bottom: auto;\n  left: auto;\n  width: 100%;\n  min-height: calc(100% - 8px);\n  padding: 0 28px 0 8px;\n  border-radius: 4px;\n  border: 1px solid transparent;\n  z-index: 100;\n  background: transparent;\n  outline: none;\n}\n.ff-select-wrapper .ff-select-input:hover ~ .ff-select-label {\n  color: var(--ff-select-text-hover-color);\n}\n.ff-select-wrapper .ff-select-input--border-radius {\n  border-radius: 0px 4px 4px 0px;\n}\n.ff-select-wrapper .ff-select-input--default {\n  opacity: 1;\n  border-color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select-input--default:hover {\n  border-color: var(--ff-select-text-color);\n}\n.ff-select-wrapper .ff-select-input--default:hover ~ .ff-select-fieldset--option {\n  border-color: var(--ff-select-text-color);\n}\n.ff-select-wrapper .ff-select-input--default:hover ~ .ff-select-fieldset--option .ff-select-legend--option {\n  color: var(--ff-select-text-color);\n}\n.ff-select-wrapper .ff-select-input--no-label {\n  min-height: calc(100% - 2px);\n  margin-top: 0px;\n  top: 0px;\n}\n.ff-select-wrapper .ff-select-input--active {\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-input--active:hover {\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-input--no-border {\n  border: none;\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-input--no-border:hover {\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-input--no-border:hover ~ .ff-select-fieldset--no-border {\n  border-color: transparent;\n}\n.ff-select-wrapper .ff-select-input--disable {\n  border-color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select-input--disable:hover {\n  border-color: var(--ff-select-border-color);\n}\n.ff-select-wrapper .ff-select-input--disable:hover ~ .ff-select-label--default {\n  color: var(--ff-select-default-color);\n}\n.ff-select-wrapper .ff-select-input--error {\n  border-color: var(--error-light);\n}\n.ff-select-wrapper .ff-select-input--error:hover {\n  border-color: var(--error-light);\n}\n.ff-select-wrapper .ff-select-label {\n  position: absolute;\n  top: 13px;\n  right: auto;\n  bottom: auto;\n  left: 8px;\n  z-index: 1;\n  font-size: 12px;\n  top: 60%;\n  padding-left: 8px;\n}\n.ff-select-wrapper .ff-select-label--default {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 1;\n  color: var(--ff-select-default-color);\n  transform: translateY(-50%);\n}\n.ff-select-wrapper .ff-select-label--active {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 0;\n  transform: translateY(-150%);\n  padding: 0 6px;\n}\n.ff-select-wrapper .ff-select-label--required {\n  margin-right: 2px;\n}\n.ff-select-wrapper .ff-select-arrow {\n  position: absolute;\n  top: 60%;\n  height: 100%;\n  right: 10px;\n  transform: rotateX(180deg) translateY(50%);\n  cursor: pointer;\n}\n.ff-select-wrapper .ff-select-arrow--no-label {\n  top: 50%;\n}\n.ff-select-wrapper .ff-select-arrow--down {\n  transform: rotateX(0deg) translateY(-50%);\n  z-index: 101;\n}\n.ff-select-wrapper-error-text {\n  position: absolute;\n  top: auto;\n  right: auto;\n  bottom: -14px;\n  left: 12px;\n  white-space: nowrap;\n}";
+styleInject(css_248z$C);
 
 const portalPosition = {
   positionX: 0,
@@ -2073,7 +2159,8 @@ const Select$1 = ({
   borderRadius = true,
   showBorder = true,
   required = false,
-  optionsRequired = true
+  optionsRequired = true,
+  selectedOptionColor = 'var(--ff-select-text-color)'
 }) => {
   const initialState = React.useMemo(() => ({
     isInputFocused: false,
@@ -2218,7 +2305,8 @@ const Select$1 = ({
         }),
         // inline css required due to multiple overlay scenarios are present
         style: {
-          zIndex: optionZIndex
+          zIndex: optionZIndex,
+          color: selectedOptionColor
         },
         onFocus: () => handleSelectAction('FOCUS_INPUT'),
         onMouseEnter: () => handleSelectAction('MOUSE_ENTER'),
@@ -2293,8 +2381,8 @@ const Select$1 = ({
   });
 };
 
-var css_248z$z = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-textarea-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-textarea-container .msg-character-count, .ff-textarea-container:focus-within .ff-textarea-label-container, .ff-textarea-container:focus-within .ff-textarea::placeholder, .ff-textarea-container:focus-within .ff-textarea-label-container::placeholder, .ff-textarea-container .ff-textarea-message, .ff-textarea-container--float .ff-textarea-label-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-textarea-container {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  gap: 5px;\n}\n.ff-textarea-container .msg-character-count {\n  display: flex;\n  color: var(--text-area-default-color);\n  justify-content: flex-end;\n}\n.ff-textarea-container .ff-textarea, .ff-textarea-container .ff-textarea-label-container {\n  padding: 8px;\n  width: 100%;\n  min-height: 80px;\n  gap: 0px;\n  border: 1px solid var(--default-icon-color);\n  border-radius: 4px;\n  outline: none;\n  line-height: 18px;\n  font-weight: 400;\n}\n.ff-textarea-container .ff-textarea--resize {\n  resize: none;\n}\n.ff-textarea-container .ff-textarea:disabled, .ff-textarea-container .ff-textarea-label-container:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.ff-textarea-container .ff-textarea:disabled:hover, .ff-textarea-container .ff-textarea-label-container:disabled:hover {\n  border-color: var(--default-icon-color);\n  color: inherit;\n}\n.ff-textarea-container .ff-textarea::placeholder, .ff-textarea-container .ff-textarea-label-container::placeholder {\n  opacity: 0;\n}\n.ff-textarea-container .ff-textarea--danger {\n  border-color: var(--error_light);\n}\n.ff-textarea-container .ff-textarea--transparentBackground {\n  background: transparent;\n}\n.ff-textarea-container .ff-textarea-label-container {\n  display: flex;\n  position: absolute;\n  border: none;\n  outline: none;\n  margin-top: 1px;\n  transition: all 0.3s ease-in-out;\n}\n.ff-textarea-container .ff-textarea-label-container .ff-textarea-label {\n  padding: 1px;\n  height: 10px;\n  width: auto;\n  background-color: var(--drawer-footer-bg);\n  color: var(--text-area-default-color);\n}\n.ff-textarea-container .ff-textarea-label-container .ff-textarea-label--danger {\n  color: var(--error_light);\n}\n.ff-textarea-container .ff-textarea-label-container .required-asterisk {\n  color: var(--error_light);\n}\n.ff-textarea-container:hover .ff-textarea-label {\n  color: var(--text-color);\n}\n.ff-textarea-container:hover .ff-textarea, .ff-textarea-container:hover .ff-textarea-label-container {\n  border-color: var(--text-color);\n}\n.ff-textarea-container:focus-within .ff-textarea-label-container {\n  font-weight: 400;\n  line-height: 12px;\n  letter-spacing: 0.5px;\n  text-align: left;\n  top: -6px;\n  background-color: transparent;\n  padding: 0px 2px;\n  margin-left: 7px;\n}\n.ff-textarea-container:focus-within .ff-textarea-label--primary {\n  color: var(--brand-color);\n}\n.ff-textarea-container:focus-within .ff-textarea--primary {\n  border-color: var(--brand-color);\n}\n.ff-textarea-container:focus-within .ff-textarea::placeholder, .ff-textarea-container:focus-within .ff-textarea-label-container::placeholder {\n  opacity: 1;\n  margin-bottom: 1px;\n}\n.ff-textarea-container .ff-textarea-message {\n  padding: 0px 4px;\n  margin-left: 8px;\n  line-height: 12px;\n}\n.ff-textarea-container .ff-textarea-message--danger {\n  color: var(--error_light);\n}\n.ff-textarea-container--float .ff-textarea-label-container {\n  letter-spacing: 0.5px;\n  top: -6px;\n  background-color: transparent;\n  line-height: 12px;\n  padding: 0px 2px;\n  margin-left: 7px;\n}\n.ff-textarea-container--disabled {\n  cursor: not-allowed;\n}\n.ff-textarea-container--disabled:hover .ff-textarea-label {\n  color: var(--text-area-default-color);\n}\n.ff-textarea-container--disabled:hover .ff-textarea, .ff-textarea-container--disabled:hover .ff-textarea-container .ff-textarea-label-container, .ff-textarea-container .ff-textarea-container--disabled:hover .ff-textarea-label-container {\n  border-color: var(--default-icon-color);\n}\n.ff-textarea-container--disabled .ff-textarea-label-container {\n  cursor: not-allowed;\n}";
-styleInject(css_248z$z);
+var css_248z$B = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-textarea-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-textarea-container .msg-character-count, .ff-textarea-container:focus-within .ff-textarea-label-container, .ff-textarea-container:focus-within .ff-textarea::placeholder, .ff-textarea-container:focus-within .ff-textarea-label-container::placeholder, .ff-textarea-container .ff-textarea-message, .ff-textarea-container--float .ff-textarea-label-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-textarea-container {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  gap: 5px;\n}\n.ff-textarea-container .msg-character-count {\n  display: flex;\n  color: var(--text-area-default-color);\n  justify-content: flex-end;\n}\n.ff-textarea-container .ff-textarea, .ff-textarea-container .ff-textarea-label-container {\n  padding: 8px;\n  width: 100%;\n  min-height: 80px;\n  gap: 0px;\n  border: 1px solid var(--default-icon-color);\n  border-radius: 4px;\n  outline: none;\n  line-height: 18px;\n  font-weight: 400;\n}\n.ff-textarea-container .ff-textarea--resize {\n  resize: none;\n}\n.ff-textarea-container .ff-textarea:disabled, .ff-textarea-container .ff-textarea-label-container:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.ff-textarea-container .ff-textarea:disabled:hover, .ff-textarea-container .ff-textarea-label-container:disabled:hover {\n  border-color: var(--default-icon-color);\n  color: inherit;\n}\n.ff-textarea-container .ff-textarea::placeholder, .ff-textarea-container .ff-textarea-label-container::placeholder {\n  opacity: 0;\n}\n.ff-textarea-container .ff-textarea--danger {\n  border-color: var(--error_light);\n}\n.ff-textarea-container .ff-textarea--transparentBackground {\n  background: transparent;\n}\n.ff-textarea-container .ff-textarea-label-container {\n  display: flex;\n  position: absolute;\n  border: none;\n  outline: none;\n  margin-top: 1px;\n  transition: all 0.3s ease-in-out;\n}\n.ff-textarea-container .ff-textarea-label-container .ff-textarea-label {\n  padding: 1px;\n  height: 10px;\n  width: auto;\n  background-color: var(--drawer-footer-bg);\n  color: var(--text-area-default-color);\n}\n.ff-textarea-container .ff-textarea-label-container .ff-textarea-label--danger {\n  color: var(--error_light);\n}\n.ff-textarea-container .ff-textarea-label-container .required-asterisk {\n  color: var(--error_light);\n}\n.ff-textarea-container:hover .ff-textarea-label {\n  color: var(--text-color);\n}\n.ff-textarea-container:hover .ff-textarea, .ff-textarea-container:hover .ff-textarea-label-container {\n  border-color: var(--text-color);\n}\n.ff-textarea-container:focus-within .ff-textarea-label-container {\n  font-weight: 400;\n  line-height: 12px;\n  letter-spacing: 0.5px;\n  text-align: left;\n  top: -6px;\n  background-color: transparent;\n  padding: 0px 2px;\n  margin-left: 7px;\n}\n.ff-textarea-container:focus-within .ff-textarea-label--primary {\n  color: var(--brand-color);\n}\n.ff-textarea-container:focus-within .ff-textarea--primary {\n  border-color: var(--brand-color);\n}\n.ff-textarea-container:focus-within .ff-textarea::placeholder, .ff-textarea-container:focus-within .ff-textarea-label-container::placeholder {\n  opacity: 1;\n  margin-bottom: 1px;\n}\n.ff-textarea-container .ff-textarea-message {\n  padding: 0px 4px;\n  margin-left: 8px;\n  line-height: 12px;\n}\n.ff-textarea-container .ff-textarea-message--danger {\n  color: var(--error_light);\n}\n.ff-textarea-container--float .ff-textarea-label-container {\n  letter-spacing: 0.5px;\n  top: -6px;\n  background-color: transparent;\n  line-height: 12px;\n  padding: 0px 2px;\n  margin-left: 7px;\n}\n.ff-textarea-container--disabled {\n  cursor: not-allowed;\n}\n.ff-textarea-container--disabled:hover .ff-textarea-label {\n  color: var(--text-area-default-color);\n}\n.ff-textarea-container--disabled:hover .ff-textarea, .ff-textarea-container--disabled:hover .ff-textarea-container .ff-textarea-label-container, .ff-textarea-container .ff-textarea-container--disabled:hover .ff-textarea-label-container {\n  border-color: var(--default-icon-color);\n}\n.ff-textarea-container--disabled .ff-textarea-label-container {\n  cursor: not-allowed;\n}";
+styleInject(css_248z$B);
 
 const truncateText = (text, maxLength) => {
   if (!text || maxLength <= 0) return '';
@@ -2369,8 +2457,8 @@ const Textarea = ({
   });
 };
 
-var css_248z$y = ".ff-status-button {\n  border: none;\n  border-radius: 4px;\n  padding: 0 4px;\n  cursor: pointer;\n  width: 76px;\n  height: 16px;\n}\n.ff-status-button__text {\n  color: inherit;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 76px;\n  text-transform: capitalize;\n}\n.ff-status-button--passed {\n  background-color: var(--status-button-bg-passed);\n  color: var(--status-button-text-passed);\n}\n.ff-status-button--failed {\n  background-color: var(--status-button-bg-failed);\n  color: var(--status-button-text-failed);\n}\n.ff-status-button--running {\n  background-color: var(--status-button-bg-running);\n  color: var(--status-button-text-running);\n}\n.ff-status-button--skipped {\n  background-color: var(--status-button-bg-skipped);\n  color: var(--status-button-text-skipped);\n}\n.ff-status-button--warning {\n  background-color: var(--status-button-bg-warning);\n  color: var(--status-button-text-warning);\n}\n.ff-status-button--terminated {\n  background-color: var(--status-button-bg-terminated);\n  color: var(--status-button-text-terminated);\n}\n.ff-status-button--partially-executed {\n  background-color: var(--status-button-bg-partiallyExecuted);\n  color: var(--status-button-text-partiallyExecuted);\n}\n.ff-status-button--aborted {\n  background-color: var(--status-button-bg-aborted);\n  color: var(--status-button-text-aborted);\n}\n.ff-status-button--not-executed {\n  background-color: var(--status-button-bg-notExecuted);\n  color: var(--status-button-text-notExecuted);\n}\n.ff-status-button:disabled {\n  opacity: 50%;\n  cursor: not-allowed;\n}";
-styleInject(css_248z$y);
+var css_248z$A = ".ff-status-button {\n  border: none;\n  border-radius: 4px;\n  padding: 0 4px;\n  cursor: pointer;\n  width: 76px;\n  height: 16px;\n}\n.ff-status-button__text {\n  color: inherit;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 76px;\n  text-transform: capitalize;\n}\n.ff-status-button--passed {\n  background-color: var(--status-button-bg-passed);\n  color: var(--status-button-text-passed);\n}\n.ff-status-button--failed {\n  background-color: var(--status-button-bg-failed);\n  color: var(--status-button-text-failed);\n}\n.ff-status-button--running {\n  background-color: var(--status-button-bg-running);\n  color: var(--status-button-text-running);\n}\n.ff-status-button--skipped {\n  background-color: var(--status-button-bg-skipped);\n  color: var(--status-button-text-skipped);\n}\n.ff-status-button--warning {\n  background-color: var(--status-button-bg-warning);\n  color: var(--status-button-text-warning);\n}\n.ff-status-button--terminated {\n  background-color: var(--status-button-bg-terminated);\n  color: var(--status-button-text-terminated);\n}\n.ff-status-button--partially-executed {\n  background-color: var(--status-button-bg-partiallyExecuted);\n  color: var(--status-button-text-partiallyExecuted);\n}\n.ff-status-button--aborted {\n  background-color: var(--status-button-bg-aborted);\n  color: var(--status-button-text-aborted);\n}\n.ff-status-button--not-executed {\n  background-color: var(--status-button-bg-notExecuted);\n  color: var(--status-button-text-notExecuted);\n}\n.ff-status-button:disabled {\n  opacity: 50%;\n  cursor: not-allowed;\n}";
+styleInject(css_248z$A);
 
 const StatusButton = ({
   status = 'passed',
@@ -2398,8 +2486,8 @@ const StatusButton = ({
   });
 };
 
-var css_248z$x = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-menu-option-container .ff-option-card .ff-options {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-menu-option-container {\n  cursor: pointer;\n  position: relative;\n}\n.ff-menu-option-container .ff-icon-label {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container:hover {\n  background-color: var(--hover-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container.dark {\n  background-color: var(--brand-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container.dark:hover {\n  background-color: var(--menu-variant-dark-icon-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container.dark:hover svg path {\n  fill: var(--brand-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container-clicked {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: var(--brand-color);\n  cursor: pointer;\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container-clicked:hover {\n  background-color: var(--brand-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container-clicked.dark {\n  background-color: var(--menu-variant-dark-icon-color);\n}\n.ff-menu-option-container .ff-option-card {\n  position: absolute;\n  border: 1px solid var(--option-card-border-color);\n  background: var(--option-card-bg-color);\n  border-radius: 4px;\n  margin: 2px;\n  min-height: 32px;\n  min-width: 111px;\n  z-index: 100000;\n  white-space: nowrap;\n}\n.ff-menu-option-container .ff-option-card .ff-options {\n  cursor: pointer;\n  border-radius: 4px;\n  display: flex;\n  align-items: center;\n  padding: 8px;\n  line-height: 16px;\n  gap: 8px;\n}\n.ff-menu-option-container .ff-option-card .ff-options:hover {\n  background-color: var(--hover-color);\n}\n.ff-menu-option-container .ff-option-card .ff-options label {\n  cursor: pointer;\n}\n.ff-menu-option-container .ff-option-card .ff-disable-option {\n  opacity: 0.5;\n  cursor: no-drop;\n}\n.ff-menu-option-container .ff-option-card .ff-disable-option label {\n  cursor: no-drop;\n}";
-styleInject(css_248z$x);
+var css_248z$z = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-menu-option-container .ff-option-card .ff-options {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-menu-option-container {\n  cursor: pointer;\n  position: relative;\n}\n.ff-menu-option-container .ff-icon-label {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container:hover {\n  background-color: var(--hover-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container.dark {\n  background-color: var(--brand-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container.dark:hover {\n  background-color: var(--menu-variant-dark-icon-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container.dark:hover svg path {\n  fill: var(--brand-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container-clicked {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: var(--brand-color);\n  cursor: pointer;\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container-clicked:hover {\n  background-color: var(--brand-color);\n}\n.ff-menu-option-container .ff-icon-label .ff-menuicon-container-clicked.dark {\n  background-color: var(--menu-variant-dark-icon-color);\n}\n.ff-menu-option-container .ff-option-card {\n  position: absolute;\n  border: 1px solid var(--option-card-border-color);\n  background: var(--option-card-bg-color);\n  border-radius: 4px;\n  margin: 2px;\n  min-height: 32px;\n  min-width: 111px;\n  z-index: 100000;\n  white-space: nowrap;\n}\n.ff-menu-option-container .ff-option-card .ff-options {\n  cursor: pointer;\n  border-radius: 4px;\n  display: flex;\n  align-items: center;\n  padding: 8px;\n  line-height: 16px;\n  gap: 8px;\n}\n.ff-menu-option-container .ff-option-card .ff-options:hover {\n  background-color: var(--hover-color);\n}\n.ff-menu-option-container .ff-option-card .ff-options label {\n  cursor: pointer;\n}\n.ff-menu-option-container .ff-option-card .ff-disable-option {\n  opacity: 0.5;\n  cursor: no-drop;\n}\n.ff-menu-option-container .ff-option-card .ff-disable-option label {\n  cursor: no-drop;\n}";
+styleInject(css_248z$z);
 
 const Option$1 = ({
   option,
@@ -2522,8 +2610,8 @@ const MenuOption = ({
   });
 };
 
-var css_248z$w = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-table tbody tr td {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd, .ff-table thead tr th {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-fixed-header-table {\n  overflow-y: auto;\n}\n\n.ff-table th,\n.ff-table td {\n  text-align: left;\n  font-size: 12px;\n  padding: 9px 8px;\n}\n.ff-table thead tr th {\n  color: var(--text-color);\n  border-bottom: 1px solid var(--slider-table-color);\n  text-transform: uppercase;\n}\n.ff-table thead tr th:first-child div {\n  display: flex;\n  align-items: center;\n}\n.ff-table thead tr th:first-child div .ff-table-checkbox {\n  padding-right: 8px;\n}\n.ff-table tbody tr .action-column {\n  opacity: 0;\n}\n.ff-table tbody tr .icon-container {\n  padding-left: 10px;\n  opacity: 0;\n  display: flex;\n  justify-content: flex-end;\n  transition: opacity 0.3s ease, transform 0.3s ease;\n  transform: translateX(20px);\n}\n.ff-table tbody tr:hover {\n  background-color: var(--hover-color);\n}\n.ff-table tbody tr:hover .icon-container {\n  opacity: 1;\n  transform: translateX(0);\n}\n.ff-table tbody tr td {\n  position: relative;\n  color: var(--text-color);\n}\n.ff-table tbody tr td.clickable-cell {\n  cursor: pointer;\n}\n.ff-table tbody tr td:first-child div {\n  display: flex;\n  align-items: center;\n}\n.ff-table tbody tr td:first-child div .ff-table-checkbox {\n  padding-right: 8px;\n}\n.ff-table .primary-bg {\n  background-color: var(--brand-color);\n}\n.ff-table .secondary-bg {\n  background-color: var(--slider-table-color);\n}\n.ff-table .default-bg {\n  background-color: transparent;\n}\n\n.border-borderRadius {\n  border: 1px solid var(--slider-table-color);\n  border-radius: 5px;\n  border-collapse: none !important;\n}\n\n.ff-fixed-header {\n  position: sticky !important;\n  top: 0;\n  z-index: 99;\n  background-color: Var(--file-details-bg);\n}\n\n.no-data-content {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n}\n\ntbody tr.disabled-row {\n  opacity: 0.5;\n  cursor: not-allowed;\n}";
-styleInject(css_248z$w);
+var css_248z$y = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-table tbody tr td {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd, .ff-table thead tr th {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-fixed-header-table {\n  overflow-y: auto;\n}\n\n.ff-table {\n  width: 100%;\n}\n.ff-table th,\n.ff-table td {\n  text-align: left;\n  font-size: 12px;\n  padding: 9px 8px;\n}\n.ff-table thead tr th {\n  color: var(--text-color);\n  border-bottom: 1px solid var(--slider-table-color);\n  text-transform: uppercase;\n}\n.ff-table thead tr th:first-child div {\n  display: flex;\n  align-items: center;\n}\n.ff-table thead tr th:first-child div .ff-table-checkbox {\n  padding-right: 8px;\n}\n.ff-table tbody tr .action-column {\n  opacity: 0;\n}\n.ff-table tbody tr .icon-container {\n  padding-left: 10px;\n  opacity: 0;\n  display: flex;\n  justify-content: flex-end;\n  transition: opacity 0.3s ease, transform 0.3s ease;\n  transform: translateX(20px);\n}\n.ff-table tbody tr:hover {\n  background-color: var(--hover-color);\n}\n.ff-table tbody tr:hover .icon-container {\n  opacity: 1;\n  transform: translateX(0);\n}\n.ff-table tbody tr td {\n  position: relative;\n  color: var(--text-color);\n}\n.ff-table tbody tr td.clickable-cell {\n  cursor: pointer;\n}\n.ff-table tbody tr td:first-child div {\n  display: flex;\n  align-items: center;\n}\n.ff-table tbody tr td:first-child div .ff-table-checkbox {\n  padding-right: 8px;\n}\n.ff-table .primary-bg {\n  background-color: var(--brand-color);\n}\n.ff-table .secondary-bg {\n  background-color: var(--slider-table-color);\n}\n.ff-table .default-bg {\n  background-color: transparent;\n}\n\n.border-borderRadius {\n  border: 1px solid var(--slider-table-color);\n  border-radius: 5px;\n  border-collapse: none !important;\n}\n\n.ff-fixed-header {\n  position: sticky !important;\n  top: 0;\n  z-index: 99;\n  background-color: Var(--file-details-bg);\n}\n\n.no-data-content {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n}\n\ntbody tr.disabled-row {\n  opacity: 0.5;\n  cursor: not-allowed;\n}";
+styleInject(css_248z$y);
 
 const isFunction$1 = functionToCheck => {
   return functionToCheck && {}.toString.call(functionToCheck) === '[object Function]';
@@ -2571,8 +2659,8 @@ const prepareData = (dataObj, columnObj) => {
   }
 };
 
-var css_248z$v = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-checkbox--overlay {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  cursor: pointer;\n  position: relative;\n}\n.ff-checkbox--overlay .ff-checkbox-input {\n  display: none;\n}\n.ff-checkbox--overlay .ff-checkbox-custom {\n  width: 16px;\n  height: 16px;\n  border: 1px solid var(--checkbox-border-color);\n  box-sizing: border-box;\n  border-radius: 2px;\n  margin-right: 8px;\n  background-color: var(--checkbox-bg-color);\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  transition: border-color background-color;\n}\n.ff-checkbox--overlay .ff-checkbox-custom::before {\n  content: \"\";\n  width: 9px;\n  height: 2px;\n  background-color: var(--checkbox-partial-color);\n  border-radius: 2px;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%) rotate(180deg);\n  opacity: 0;\n  transition: border-color background-color;\n}\n.ff-checkbox--overlay .ff-checkbox-custom::after {\n  content: \"\";\n  width: 16px;\n  height: 16px;\n  border: 4px solid var(--checkbox-hover-color);\n  border-radius: 4px;\n  position: absolute;\n  opacity: 0;\n  background-color: var(--checkbox-hover-color);\n  z-index: -1;\n  transition: border-color background-color;\n}\n.ff-checkbox--overlay .ff-checkbox-custom:hover {\n  border-color: var(--brand-color);\n}\n.ff-checkbox--overlay .ff-checkbox-custom:hover::after {\n  opacity: 1;\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked + .ff-checkbox-custom {\n  background: var(--brand-color);\n  border-color: var(--brand-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked:hover + .ff-checkbox-custom {\n  background: var(--brand-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked:hover + .ff-checkbox-custom::after {\n  opacity: 1;\n}\n.ff-checkbox--overlay .ff-checkbox-input:disabled + .ff-checkbox-custom {\n  opacity: 0.5;\n  cursor: not-allowed;\n  border: 1px solid var(--checkbox-border-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:disabled + .ff-checkbox-custom::after {\n  opacity: 0;\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial {\n  background-color: var(--brand-color);\n  border: none;\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial::before {\n  opacity: 1;\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial:hover {\n  background-color: var(--brand-color);\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial:hover::after {\n  opacity: 1;\n}";
-styleInject(css_248z$v);
+var css_248z$x = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-checkbox--overlay {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  cursor: pointer;\n  position: relative;\n}\n.ff-checkbox--overlay .ff-checkbox-input {\n  display: none;\n}\n.ff-checkbox--overlay .ff-checkbox-custom {\n  width: 16px;\n  height: 16px;\n  border: 1px solid var(--checkbox-border-color);\n  box-sizing: border-box;\n  border-radius: 2px;\n  margin-right: 8px;\n  background-color: var(--checkbox-bg-color);\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  transition: border-color background-color;\n}\n.ff-checkbox--overlay .ff-checkbox-custom::before {\n  content: \"\";\n  width: 9px;\n  height: 2px;\n  background-color: var(--checkbox-partial-color);\n  border-radius: 2px;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%) rotate(180deg);\n  opacity: 0;\n  transition: border-color background-color;\n}\n.ff-checkbox--overlay .ff-checkbox-custom::after {\n  content: \"\";\n  width: 16px;\n  height: 16px;\n  border: 4px solid var(--checkbox-hover-color);\n  border-radius: 4px;\n  position: absolute;\n  opacity: 0;\n  background-color: var(--checkbox-hover-color);\n  z-index: -1;\n  transition: border-color background-color;\n}\n.ff-checkbox--overlay .ff-checkbox-custom:hover {\n  border-color: var(--brand-color);\n}\n.ff-checkbox--overlay .ff-checkbox-custom:hover::after {\n  opacity: 1;\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked + .ff-checkbox-custom {\n  background: var(--brand-color);\n  border-color: var(--brand-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked:hover + .ff-checkbox-custom {\n  background: var(--brand-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:checked:hover + .ff-checkbox-custom::after {\n  opacity: 1;\n}\n.ff-checkbox--overlay .ff-checkbox-input:disabled + .ff-checkbox-custom {\n  opacity: 0.5;\n  cursor: not-allowed;\n  border: 1px solid var(--checkbox-border-color);\n}\n.ff-checkbox--overlay .ff-checkbox-input:disabled + .ff-checkbox-custom::after {\n  opacity: 0;\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial {\n  background-color: var(--brand-color);\n  border: none;\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial::before {\n  opacity: 1;\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial:hover {\n  background-color: var(--brand-color);\n}\n.ff-checkbox--overlay .ff-storybook-checkbox--partial:hover::after {\n  opacity: 1;\n}";
+styleInject(css_248z$x);
 
 const Checkbox = ({
   id,
@@ -2637,7 +2725,9 @@ const Table = ({
   // noDataImage,
   // noDataImageSize,
   height = '100%',
-  className = ''
+  className = '',
+  tableHeadClass = '',
+  tableBodyRowClass = ''
 }) => {
   const hanleOnclick = (column, row) => {
     let {
@@ -2668,7 +2758,7 @@ const Table = ({
       children: [jsxRuntime.jsx("thead", {
         className: classNames({
           'ff-fixed-header': withFixedHeader
-        }),
+        }, tableHeadClass),
         children: jsxRuntime.jsx("tr", {
           children: columns.map((column, index) => jsxRuntime.jsx("th", {
             className: headerType && `${headerType}-bg`,
@@ -2694,7 +2784,7 @@ const Table = ({
         })
       }), jsxRuntime.jsx("tbody", {
         children: data.length > 0 && data.map((row, index) => jsxRuntime.jsx("tr", {
-          className: classNames(className, {
+          className: classNames(tableBodyRowClass, {
             'disabled-row': row.disabled
           }),
           children: columns.map((column, i) => {
@@ -2723,11 +2813,11 @@ const Table = ({
   });
 };
 
-var css_248z$u = ".ff-add-button-container {\n  position: relative;\n  border: none;\n  width: 24px;\n  height: 24px;\n  border-radius: 4px;\n  background-color: transparent;\n}\n.ff-add-button-container.ff-hovered-add-button--primary {\n  background-color: var(--hover-color);\n}\n.ff-add-button-container .ff-hovered-add-icon--primary svg path {\n  fill: var(--add-icon-hover-color);\n}\n.ff-add-button-container .ff-add-icon--primary svg path {\n  fill: var(--brand-color);\n}\n.ff-add-button-container .ff-add-button {\n  position: absolute;\n  border: none;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 4px;\n  background: none;\n}";
-styleInject(css_248z$u);
+var css_248z$w = ".ff-add-button-container {\n  position: relative;\n  border: none;\n  width: 24px;\n  height: 24px;\n  border-radius: 4px;\n  background-color: transparent;\n}\n.ff-add-button-container.ff-hovered-add-button--primary {\n  background-color: var(--hover-color);\n}\n.ff-add-button-container .ff-hovered-add-icon--primary svg path {\n  fill: var(--add-icon-hover-color);\n}\n.ff-add-button-container .ff-add-icon--primary svg path {\n  fill: var(--brand-color);\n}\n.ff-add-button-container .ff-add-button {\n  position: absolute;\n  border: none;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 4px;\n  background: none;\n}";
+styleInject(css_248z$w);
 
-var css_248z$t = ".ff-arrow-buttons-container {\n  position: absolute;\n  transition: opacity 0.3s ease;\n}\n.ff-arrow-buttons-container.ff-down-right-top, .ff-arrow-buttons-container.ff-down-top {\n  height: 80px;\n  width: 52px;\n  transform: translateY(calc(-50% + 12px));\n}\n.ff-arrow-buttons-container.ff-down-right-top .ff-arrow-button--right, .ff-arrow-buttons-container.ff-down-top .ff-arrow-button--right {\n  top: 28px;\n  right: 2px;\n  animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right-top .ff-arrow-button--top, .ff-arrow-buttons-container.ff-down-top .ff-arrow-button--top {\n  top: 2px;\n  animation: slideTop 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right-top .ff-arrow-button--down, .ff-arrow-buttons-container.ff-down-top .ff-arrow-button--down {\n  bottom: 2px;\n  animation: slideDown 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-right-top {\n  height: 52px;\n  width: 52px;\n  transform: translateY(-54%);\n}\n.ff-arrow-buttons-container.ff-right-top .ff-arrow-button--right {\n  top: 28px;\n  right: 2px;\n  animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-right-top .ff-arrow-button--top {\n  top: 2px;\n  animation: slideTop 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right {\n  height: 52px;\n  width: 52px;\n}\n.ff-arrow-buttons-container.ff-down-right .ff-arrow-button--right {\n  top: 0px;\n  right: 2px;\n  animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right .ff-arrow-button--down {\n  bottom: 2px;\n  animation: slideDown 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-top {\n  height: 52px;\n  width: 24px;\n  transform: translateY(-54%);\n}\n.ff-arrow-buttons-container.ff-top .ff-arrow-button--top {\n  top: 2px;\n  animation: slideTop 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-right {\n  height: 24px;\n  width: 52px;\n}\n.ff-arrow-buttons-container.ff-right .ff-arrow-button--right {\n  right: 2px;\n  animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down {\n  height: 52px;\n  width: 24px;\n}\n.ff-arrow-buttons-container.ff-down .ff-arrow-button--down {\n  bottom: 2px;\n  animation: slideDown 0.4s ease-out;\n}\n.ff-arrow-buttons-container .ff-arrow-button {\n  background: var(--arrow-button-bg-color);\n  border: 0.5px solid var(--arrows-button-border-color);\n  padding: 0;\n  cursor: pointer;\n  width: 24px;\n  height: 24px;\n  display: flex;\n  border-radius: 4px;\n  justify-content: center;\n  align-items: center;\n  transition: all 0.3s ease;\n  position: absolute;\n}\n.ff-arrow-buttons-container .ff-arrow-button--top {\n  top: 0px;\n  left: 0;\n}\n.ff-arrow-buttons-container .ff-arrow-button--down {\n  bottom: 0px;\n  left: 0;\n}\n@keyframes slideTop {\n  from {\n    transform: translateY(20px);\n    opacity: 0;\n  }\n  50% {\n    transform: translateY(-10px);\n    opacity: 0.5;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}\n@keyframes slideRight {\n  from {\n    transform: translateX(-20px);\n    opacity: 0;\n  }\n  50% {\n    transform: translateX(10px);\n    opacity: 0.5;\n  }\n  to {\n    transform: translateX(0);\n    opacity: 1;\n  }\n}\n@keyframes slideDown {\n  from {\n    transform: translateY(-20px);\n    opacity: 0;\n  }\n  50% {\n    transform: translateY(10px);\n    opacity: 0.5;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}";
-styleInject(css_248z$t);
+var css_248z$v = ".ff-arrow-buttons-container {\n  position: absolute;\n  transition: opacity 0.3s ease;\n}\n.ff-arrow-buttons-container.ff-down-right-top, .ff-arrow-buttons-container.ff-down-top {\n  height: 80px;\n  width: 52px;\n  transform: translateY(calc(-50% + 12px));\n}\n.ff-arrow-buttons-container.ff-down-right-top .ff-arrow-button--right, .ff-arrow-buttons-container.ff-down-top .ff-arrow-button--right {\n  top: 28px;\n  right: 2px;\n  animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right-top .ff-arrow-button--top, .ff-arrow-buttons-container.ff-down-top .ff-arrow-button--top {\n  top: 2px;\n  animation: slideTop 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right-top .ff-arrow-button--down, .ff-arrow-buttons-container.ff-down-top .ff-arrow-button--down {\n  bottom: 2px;\n  animation: slideDown 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-right-top {\n  height: 52px;\n  width: 52px;\n  transform: translateY(-54%);\n}\n.ff-arrow-buttons-container.ff-right-top .ff-arrow-button--right {\n  top: 28px;\n  right: 2px;\n  animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-right-top .ff-arrow-button--top {\n  top: 2px;\n  animation: slideTop 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right {\n  height: 52px;\n  width: 52px;\n}\n.ff-arrow-buttons-container.ff-down-right .ff-arrow-button--right {\n  top: 0px;\n  right: 2px;\n  animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down-right .ff-arrow-button--down {\n  bottom: 2px;\n  animation: slideDown 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-top {\n  height: 52px;\n  width: 24px;\n  transform: translateY(-54%);\n}\n.ff-arrow-buttons-container.ff-top .ff-arrow-button--top {\n  top: 2px;\n  animation: slideTop 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-right {\n  height: 24px;\n  width: 52px;\n}\n.ff-arrow-buttons-container.ff-right .ff-arrow-button--right {\n  right: 2px;\n  animation: slideRight 0.4s ease-out;\n}\n.ff-arrow-buttons-container.ff-down {\n  height: 52px;\n  width: 24px;\n}\n.ff-arrow-buttons-container.ff-down .ff-arrow-button--down {\n  bottom: 2px;\n  animation: slideDown 0.4s ease-out;\n}\n.ff-arrow-buttons-container .ff-arrow-button {\n  background: var(--arrow-button-bg-color);\n  border: 0.5px solid var(--arrows-button-border-color);\n  padding: 0;\n  cursor: pointer;\n  width: 24px;\n  height: 24px;\n  display: flex;\n  border-radius: 4px;\n  justify-content: center;\n  align-items: center;\n  transition: all 0.3s ease;\n  position: absolute;\n}\n.ff-arrow-buttons-container .ff-arrow-button--top {\n  top: 0px;\n  left: 0;\n}\n.ff-arrow-buttons-container .ff-arrow-button--down {\n  bottom: 0px;\n  left: 0;\n}\n@keyframes slideTop {\n  from {\n    transform: translateY(20px);\n    opacity: 0;\n  }\n  50% {\n    transform: translateY(-10px);\n    opacity: 0.5;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}\n@keyframes slideRight {\n  from {\n    transform: translateX(-20px);\n    opacity: 0;\n  }\n  50% {\n    transform: translateX(10px);\n    opacity: 0.5;\n  }\n  to {\n    transform: translateX(0);\n    opacity: 1;\n  }\n}\n@keyframes slideDown {\n  from {\n    transform: translateY(-20px);\n    opacity: 0;\n  }\n  50% {\n    transform: translateY(10px);\n    opacity: 0.5;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}";
+styleInject(css_248z$v);
 
 const ArrowsButton = ({
   direction,
@@ -2864,8 +2954,8 @@ const AddButton = ({
   });
 };
 
-var css_248z$s = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-donut-chart-svg-container svg text:nth-of-type(1), .ff-status-item {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL, .ff-donut-chart-svg-container svg text:nth-of-type(2) {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-donut-chart-svg-container svg text:nth-of-type(3) {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-donut-chart-section {\n  display: flex;\n  align-items: center;\n  padding: 8px;\n}\n\n.ff-donut-chart-svg-container {\n  display: flex;\n}\n.ff-donut-chart-svg-container svg text:nth-of-type(1) {\n  font-weight: 600;\n}\n.ff-donut-chart-svg-container svg text:nth-of-type(2) {\n  font-weight: 600;\n}\n.ff-donut-chart-svg-container svg text:nth-of-type(3) {\n  font-weight: 500;\n}\n\n.ff-status-container {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\n.ff-status-item {\n  display: flex;\n  gap: 40px;\n  justify-content: space-between;\n  opacity: 1;\n}\n.ff-status-item.ff-highlighted {\n  opacity: 1;\n}\n.ff-status-item.ff-fade {\n  opacity: 10%;\n}\n.ff-status-item .ff-status-text {\n  font-weight: 500;\n  color: var(--status-skipped-text-color);\n}\n.ff-status-item .ff-status-details-script-count {\n  display: flex;\n  gap: 4px;\n  font-weight: 600;\n}\n.ff-status-item .ff-status-details-script-percentage {\n  font-weight: 400;\n  color: var(--brand2-color);\n}\n\n.ff-status-label {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.ff-status-details {\n  display: flex;\n  gap: 4px;\n}\n\n.ff-status-color {\n  width: 16px;\n  height: 16px;\n  border-radius: 4px;\n  opacity: 80%;\n}";
-styleInject(css_248z$s);
+var css_248z$u = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-donut-chart-svg-container svg text:nth-of-type(1), .ff-status-item {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL, .ff-donut-chart-svg-container svg text:nth-of-type(2) {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-donut-chart-svg-container svg text:nth-of-type(3) {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-donut-chart-section {\n  display: flex;\n  align-items: center;\n  padding: 8px;\n}\n\n.ff-donut-chart-svg-container {\n  display: flex;\n}\n.ff-donut-chart-svg-container svg text:nth-of-type(1) {\n  font-weight: 600;\n}\n.ff-donut-chart-svg-container svg text:nth-of-type(2) {\n  font-weight: 600;\n}\n.ff-donut-chart-svg-container svg text:nth-of-type(3) {\n  font-weight: 500;\n}\n\n.ff-status-container {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\n.ff-status-item {\n  display: flex;\n  gap: 40px;\n  justify-content: space-between;\n  opacity: 1;\n}\n.ff-status-item.ff-highlighted {\n  opacity: 1;\n}\n.ff-status-item.ff-fade {\n  opacity: 10%;\n}\n.ff-status-item .ff-status-text {\n  font-weight: 500;\n  color: var(--status-skipped-text-color);\n}\n.ff-status-item .ff-status-details-script-count {\n  display: flex;\n  gap: 4px;\n  font-weight: 600;\n}\n.ff-status-item .ff-status-details-script-percentage {\n  font-weight: 400;\n  color: var(--brand2-color);\n}\n\n.ff-status-label {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n}\n\n.ff-status-details {\n  display: flex;\n  gap: 4px;\n}\n\n.ff-status-color {\n  width: 16px;\n  height: 16px;\n  border-radius: 4px;\n  opacity: 80%;\n}";
+styleInject(css_248z$u);
 
 const calculateArc$2 = (x, y, radius, startAngle, endAngle) => {
   const startX = x + radius * Math.cos(startAngle);
@@ -3217,8 +3307,8 @@ const useFileDropzone = options => {
   };
 };
 
-var css_248z$r = ".ff-file-dropzone-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone {\n  width: 640px;\n  height: 188px;\n  padding: 16px 0;\n  border-radius: 8px;\n  background: var(--file-dropzone-default-color);\n  border: 1px dashed var(--brand-color);\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n  text-align: center;\n  gap: 8px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone--active {\n  background-color: var(--file-dropzone-selected-color);\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__icon {\n  height: 80px;\n  width: 80px;\n  display: grid;\n  place-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn {\n  margin: 0 auto;\n  position: relative;\n  font-weight: 600;\n  line-height: 15px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn input {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  width: 640px;\n  max-height: 300px;\n  overflow-y: auto;\n  scroll-behavior: smooth;\n  padding: 2px;\n  -ms-overflow-style: none;\n  scrollbar-width: thin;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper ::-webkit-scrollbar {\n  width: 2px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 4px;\n  border-radius: 4px;\n  background-color: var(--file-details-bg);\n  box-shadow: 0px 0px 4px 0px var(--file-details-container-shadow);\n  overflow: hidden;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  width: 60%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info .ff-file-info__icon {\n  display: grid;\n  place-items: center;\n  height: 24px;\n  width: 24px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  justify-content: center;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  width: 100%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper__name {\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  display: block;\n  color: var(--text-color);\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions {\n  display: flex;\n  align-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-replace, .ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-remove {\n  height: 24px;\n  width: 24px;\n  display: grid;\n  place-items: center;\n  cursor: pointer;\n}";
-styleInject(css_248z$r);
+var css_248z$t = ".ff-file-dropzone-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone {\n  width: 640px;\n  height: 188px;\n  padding: 16px 0;\n  border-radius: 8px;\n  background: var(--file-dropzone-default-color);\n  border: 1px dashed var(--brand-color);\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n  text-align: center;\n  gap: 8px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone--active {\n  background-color: var(--file-dropzone-selected-color);\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__icon {\n  height: 80px;\n  width: 80px;\n  display: grid;\n  place-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn {\n  margin: 0 auto;\n  position: relative;\n  font-weight: 600;\n  line-height: 15px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn input {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  width: 640px;\n  max-height: 300px;\n  overflow-y: auto;\n  scroll-behavior: smooth;\n  padding: 2px;\n  -ms-overflow-style: none;\n  scrollbar-width: thin;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper ::-webkit-scrollbar {\n  width: 2px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 4px;\n  border-radius: 4px;\n  background-color: var(--file-details-bg);\n  box-shadow: 0px 0px 4px 0px var(--file-details-container-shadow);\n  overflow: hidden;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  width: 60%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info .ff-file-info__icon {\n  display: grid;\n  place-items: center;\n  height: 24px;\n  width: 24px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n  justify-content: center;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  width: 100%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper__name {\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  display: block;\n  color: var(--text-color);\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions {\n  display: flex;\n  align-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-replace, .ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-remove {\n  height: 24px;\n  width: 24px;\n  display: grid;\n  place-items: center;\n  cursor: pointer;\n}";
+styleInject(css_248z$t);
 
 const Dropzone = ({
   icon,
@@ -7192,8 +7282,8 @@ function useForm(props = {}) {
     return _formControl.current;
 }
 
-var css_248z$q = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-form-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-form-container {\n  background-color: var(--hover-color);\n  border: 1px solid var(--arrows-button-border-color);\n  border-radius: 8px;\n  padding: 20px;\n  width: 400px;\n  margin: 0 auto;\n}\n.ff-form-container .ff-form-group {\n  margin-bottom: 16px;\n}\n.ff-form-container .ff-form-group .ff-label {\n  display: block;\n  margin-bottom: 4px;\n  font-weight: bold;\n}\n.ff-form-container .ff-form-group input {\n  width: 94%;\n  padding: 10px;\n  border: 1px solid var(--arrows-button-border-color);\n  border-radius: 8px;\n}\n.ff-form-container .ff-form-group input:focus {\n  border-color: var(--brand-color);\n}\n.ff-form-container .ff-form-group input.ff-error {\n  border-color: var(--ff-error-light);\n}\n.ff-form-container .ff-form-group .ff-error {\n  color: var(--error-light);\n  margin-top: 4px;\n}\n.ff-form-container .ff-form-group {\n  margin-bottom: 16px;\n}\n.ff-form-container .ff-form-group .ff-label {\n  display: block;\n  margin-bottom: 4px;\n  font-weight: bold;\n}\n.ff-form-container .ff-form-group input,\n.ff-form-container .ff-form-group select {\n  width: 94%;\n  padding: 10px;\n  border: 1px solid var(--arrows-button-border-color);\n  border-radius: 8px;\n}\n.ff-form-container .ff-form-group input:focus,\n.ff-form-container .ff-form-group select:focus {\n  border-color: var(--brand-color);\n}\n.ff-form-container .ff-form-group input.ff-error,\n.ff-form-container .ff-form-group select.ff-error {\n  border-color: var(--ff-error-light);\n}\n.ff-form-container .ff-form-radio-group {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  margin-bottom: 16px;\n}\n.ff-form-container .ff-form-radio-group .ff-radio-group-wrapper {\n  display: flex;\n}\n.ff-form-container .ff-form-radio-group .ff-radio-gender {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n.ff-form-container .ff-form-radio-group .ff-radio-gender input[type=radio] {\n  margin-right: 0.5rem;\n}\n.ff-form-container .ff-form-radio-group .ff-error {\n  padding-left: 12px;\n  color: var(--error-light);\n  margin-top: 4px;\n}\n.ff-form-container .ff-button-layout {\n  width: 99%;\n  display: flex;\n  gap: 12px;\n  margin-top: 24px;\n}\n.ff-form-container .ff-button-layout button {\n  width: 50%;\n  background-color: var(--brand-color);\n  color: var(--primary-button-text-color);\n  border: none;\n  border-radius: 8px;\n  padding: 10px;\n  cursor: pointer;\n}";
-styleInject(css_248z$q);
+var css_248z$s = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-form-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-form-container {\n  background-color: var(--hover-color);\n  border: 1px solid var(--arrows-button-border-color);\n  border-radius: 8px;\n  padding: 20px;\n  width: 400px;\n  margin: 0 auto;\n}\n.ff-form-container .ff-form-group {\n  margin-bottom: 16px;\n}\n.ff-form-container .ff-form-group .ff-label {\n  display: block;\n  margin-bottom: 4px;\n  font-weight: bold;\n}\n.ff-form-container .ff-form-group input {\n  width: 94%;\n  padding: 10px;\n  border: 1px solid var(--arrows-button-border-color);\n  border-radius: 8px;\n}\n.ff-form-container .ff-form-group input:focus {\n  border-color: var(--brand-color);\n}\n.ff-form-container .ff-form-group input.ff-error {\n  border-color: var(--ff-error-light);\n}\n.ff-form-container .ff-form-group .ff-error {\n  color: var(--error-light);\n  margin-top: 4px;\n}\n.ff-form-container .ff-form-group {\n  margin-bottom: 16px;\n}\n.ff-form-container .ff-form-group .ff-label {\n  display: block;\n  margin-bottom: 4px;\n  font-weight: bold;\n}\n.ff-form-container .ff-form-group input,\n.ff-form-container .ff-form-group select {\n  width: 94%;\n  padding: 10px;\n  border: 1px solid var(--arrows-button-border-color);\n  border-radius: 8px;\n}\n.ff-form-container .ff-form-group input:focus,\n.ff-form-container .ff-form-group select:focus {\n  border-color: var(--brand-color);\n}\n.ff-form-container .ff-form-group input.ff-error,\n.ff-form-container .ff-form-group select.ff-error {\n  border-color: var(--ff-error-light);\n}\n.ff-form-container .ff-form-radio-group {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  margin-bottom: 16px;\n}\n.ff-form-container .ff-form-radio-group .ff-radio-group-wrapper {\n  display: flex;\n}\n.ff-form-container .ff-form-radio-group .ff-radio-gender {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n.ff-form-container .ff-form-radio-group .ff-radio-gender input[type=radio] {\n  margin-right: 0.5rem;\n}\n.ff-form-container .ff-form-radio-group .ff-error {\n  padding-left: 12px;\n  color: var(--error-light);\n  margin-top: 4px;\n}\n.ff-form-container .ff-button-layout {\n  width: 99%;\n  display: flex;\n  gap: 12px;\n  margin-top: 24px;\n}\n.ff-form-container .ff-button-layout button {\n  width: 50%;\n  background-color: var(--brand-color);\n  color: var(--primary-button-text-color);\n  border: none;\n  border-radius: 8px;\n  padding: 10px;\n  cursor: pointer;\n}";
+styleInject(css_248z$s);
 
 const Form = ({
   onSubmit,
@@ -7227,8 +7317,8 @@ const Form = ({
   });
 };
 
-var css_248z$p = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-input-with-dropdown-container .ff-helper-text {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-input-with-dropdown-container {\n  display: flex;\n  flex-direction: column;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown {\n  display: flex;\n  border: 1px solid var(--input-default-border-color);\n  border-radius: 4px;\n  padding: 0;\n  position: relative;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label {\n  position: absolute;\n  z-index: 9;\n  color: var(--input-default-border-color);\n  top: 7px;\n  left: 7px;\n  transition: all 0.3s ease-in-out;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label .ff-required-asterisk {\n  color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--filled {\n  color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--no-hover {\n  color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--error {\n  color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input {\n  position: relative;\n  padding: 6px 7px;\n  line-height: 18px;\n  border: none;\n  outline: none;\n  border-right: 1px solid var(--input-default-border-color);\n  border-radius: 4px 0 0 4px;\n  top: 1px;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::-webkit-outer-spin-button, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::placeholder {\n  opacity: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input:disabled {\n  cursor: not-allowed;\n  background: transparent;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--no-hover {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown {\n  min-width: 120px;\n  border: none;\n  outline: none;\n  margin: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown:disabled {\n  cursor: not-allowed;\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown {\n  border-color: var(--input-hover-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--filled {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--disabled {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-label {\n  color: var(--input-hover-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-label--filled {\n  color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-label--disabled {\n  color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-label--error {\n  color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input {\n  border-color: var(--input-hover-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--filled {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--disabled {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown {\n  border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-label {\n  top: -6px;\n  background-color: var(--input-label-bg-color);\n  padding: 0px 2px;\n  color: var(--input-active-text-color);\n  line-height: 12px;\n  font-size: 8px !important;\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-label--error {\n  color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input {\n  border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input::placeholder {\n  opacity: 1;\n}\n.ff-input-with-dropdown-container--filled .ff-input-with-dropdown .ff-floating-label-input-container {\n  border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container--filled .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label {\n  top: -6px;\n  background-color: var(--input-label-bg-color);\n  padding: 0px 2px;\n  line-height: 12px;\n  font-size: 8px !important;\n}\n.ff-input-with-dropdown-container--filled span {\n  font-size: 8px;\n}\n.ff-input-with-dropdown-container--filled .required-asterisk {\n  color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-helper-text {\n  color: var(--input-error-text-color);\n  padding: 0 11px;\n}";
-styleInject(css_248z$p);
+var css_248z$r = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-input-with-dropdown-container .ff-helper-text {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-input-with-dropdown-container {\n  display: flex;\n  flex-direction: column;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown {\n  display: flex;\n  border: 1px solid var(--input-default-border-color);\n  border-radius: 4px;\n  padding: 0;\n  position: relative;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label {\n  position: absolute;\n  z-index: 9;\n  color: var(--input-default-border-color);\n  top: 7px;\n  left: 7px;\n  transition: all 0.3s ease-in-out;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label .ff-required-asterisk {\n  color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--filled {\n  color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--no-hover {\n  color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label--error {\n  color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input {\n  position: relative;\n  padding: 6px 7px;\n  line-height: 18px;\n  border: none;\n  outline: none;\n  border-right: 1px solid var(--input-default-border-color);\n  border-radius: 4px 0 0 4px;\n  top: 1px;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::-webkit-outer-spin-button, .ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input::placeholder {\n  opacity: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input:disabled {\n  cursor: not-allowed;\n  background: transparent;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-input--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--no-hover {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown {\n  min-width: 120px;\n  border: none;\n  outline: none;\n  margin: 0;\n}\n.ff-input-with-dropdown-container .ff-input-with-dropdown .ff-floating-dropdown:disabled {\n  cursor: not-allowed;\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown {\n  border-color: var(--input-hover-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--filled {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--disabled {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-label {\n  color: var(--input-hover-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-label--filled {\n  color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-label--disabled {\n  color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-label--error {\n  color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input {\n  border-color: var(--input-hover-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--filled {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--disabled {\n  border-color: var(--input-default-border-color);\n}\n.ff-input-with-dropdown-container:hover .ff-input-with-dropdown .ff-floating-input--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown {\n  border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-label {\n  top: -6px;\n  background-color: var(--input-label-bg-color);\n  padding: 0px 2px;\n  color: var(--input-active-text-color);\n  line-height: 12px;\n  font-size: 8px !important;\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-label--error {\n  color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input {\n  border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input--error {\n  border-color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container:focus-within .ff-input-with-dropdown .ff-floating-input::placeholder {\n  opacity: 1;\n}\n.ff-input-with-dropdown-container--filled .ff-input-with-dropdown .ff-floating-label-input-container {\n  border-color: var(--input-active-text-color);\n}\n.ff-input-with-dropdown-container--filled .ff-input-with-dropdown .ff-floating-label-input-container .ff-floating-label {\n  top: -6px;\n  background-color: var(--input-label-bg-color);\n  padding: 0px 2px;\n  line-height: 12px;\n  font-size: 8px !important;\n}\n.ff-input-with-dropdown-container--filled span {\n  font-size: 8px;\n}\n.ff-input-with-dropdown-container--filled .required-asterisk {\n  color: var(--input-error-text-color);\n}\n.ff-input-with-dropdown-container .ff-helper-text {\n  color: var(--input-error-text-color);\n  padding: 0 11px;\n}";
+styleInject(css_248z$r);
 
 const InputWithDropdown = ({
   name = '',
@@ -7308,8 +7398,8 @@ const InputWithDropdown = ({
   });
 };
 
-var css_248z$o = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-radio {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-radio {\n  position: relative;\n  color: var(--text-color);\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n}\n.ff-radio .ff-radio-input {\n  display: none;\n}\n.ff-radio .ff-radio-custom {\n  box-sizing: content-box;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  border: 1px solid var(--radio-button-border);\n  position: relative;\n  margin-right: 8px;\n  transition: border-color background-color;\n}\n.ff-radio .ff-radio-custom::before {\n  content: \"\";\n  width: 12px;\n  height: 12px;\n  border-radius: 50%;\n  background: #fbfdff;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  transition: background-color 0.3s;\n}\n.ff-radio .ff-radio-custom::after {\n  content: \"\";\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  border: 4px solid #f7edff;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  opacity: 0;\n  transition: opacity 0.3s;\n}\n.ff-radio:hover .ff-radio-custom {\n  border: 1px solid var(--brand-color);\n}\n.ff-radio:hover .ff-radio-custom::before {\n  background-color: var(--drawer-footer-bg);\n}\n.ff-radio:hover .ff-radio-custom::after {\n  opacity: 1;\n  transition: opacity 0.3s;\n}\n.ff-radio .ff-radio-input:checked + .ff-radio-custom {\n  border-color: var(--brand-color);\n}\n.ff-radio .ff-radio-input:checked + .ff-radio-custom::before {\n  background: var(--brand-color);\n  height: 12px;\n  width: 12px;\n}\n.ff-radio .ff-radio-input:disabled + .ff-radio-custom {\n  border: 1px solid var(--radio-button-border);\n}\n.ff-radio .ff-radio-input:disabled + .ff-radio-custom::before {\n  background: var(--drawer-footer-bg);\n}\n.ff-radio .ff-radio-input:disabled + .ff-radio-custom::after {\n  border: 4px solid var(--radio-button-hover);\n  opacity: 0;\n  transition: opacity 0.3s;\n}\n.ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom {\n  border-color: var(--brand-color);\n  background-color: var(--drawer-footer-bg);\n}\n.ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom::before {\n  background: var(--brand-color);\n}\n.ff-radio--disabled {\n  cursor: default;\n  opacity: 0.5;\n}";
-styleInject(css_248z$o);
+var css_248z$q = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-radio-wrapper .ff-radio {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-radio-wrapper {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n.ff-radio-wrapper .ff-radio {\n  position: relative;\n  color: var(--text-color);\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input {\n  display: none;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom {\n  box-sizing: content-box;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  border: 1px solid var(--radio-button-border);\n  position: relative;\n  margin-right: 8px;\n  transition: border-color background-color;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom::before {\n  content: \"\";\n  width: 12px;\n  height: 12px;\n  border-radius: 50%;\n  background: #fbfdff;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  transition: background-color 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom::after {\n  content: \"\";\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  border: 4px solid #f7edff;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  opacity: 0;\n  transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom {\n  border: 1px solid var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom::before {\n  background-color: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom::after {\n  opacity: 1;\n  transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked + .ff-radio-custom {\n  border-color: var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked + .ff-radio-custom::before {\n  background: var(--brand-color);\n  height: 12px;\n  width: 12px;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom {\n  border: 1px solid var(--radio-button-border);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom::before {\n  background: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom::after {\n  border: 4px solid var(--radio-button-hover);\n  opacity: 0;\n  transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom {\n  border-color: var(--brand-color);\n  background-color: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom::before {\n  background: var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio--disabled {\n  cursor: default;\n  opacity: 0.5;\n}";
+styleInject(css_248z$q);
 
 const RadioButton = ({
   label,
@@ -7317,28 +7407,37 @@ const RadioButton = ({
   checked,
   onChange,
   value,
-  disabled = false
+  disabled = false,
+  showTooltip = false,
+  tooltipChildren = 'Custom JSX',
+  tooltipTitle = 'Custom JSX'
 }) => {
-  return jsxRuntime.jsxs("label", {
-    className: classNames('ff-radio', {
-      'ff-radio--disabled': disabled
-    }),
-    children: [jsxRuntime.jsx("input", {
-      disabled: disabled,
-      type: "radio",
-      name: name,
-      value: value,
-      checked: checked,
-      onChange: onChange,
-      className: "ff-radio-input"
-    }), jsxRuntime.jsx("span", {
-      className: "ff-radio-custom"
-    }), label]
+  return jsxRuntime.jsxs("div", {
+    className: "ff-radio-wrapper",
+    children: [jsxRuntime.jsxs("label", {
+      className: classNames('ff-radio', {
+        'ff-radio--disabled': disabled
+      }),
+      children: [jsxRuntime.jsx("input", {
+        disabled: disabled,
+        type: "radio",
+        name: name,
+        value: value,
+        checked: checked,
+        onChange: onChange,
+        className: "ff-radio-input"
+      }), jsxRuntime.jsx("span", {
+        className: "ff-radio-custom"
+      }), label]
+    }), showTooltip && jsxRuntime.jsx(Tooltip, {
+      title: tooltipTitle,
+      children: tooltipChildren
+    })]
   });
 };
 
-var css_248z$n = ".ff-radio-group {\n  display: flex;\n  flex-direction: row;\n  gap: 12px;\n}";
-styleInject(css_248z$n);
+var css_248z$p = ".ff-radio-group {\n  display: flex;\n  flex-direction: row;\n  gap: 12px;\n}";
+styleInject(css_248z$p);
 
 const RadioGroup = ({
   options,
@@ -7351,6 +7450,9 @@ const RadioGroup = ({
     className: classNames('ff-radio-group', className),
     children: options.map(option => jsxRuntime.jsx(RadioButton, {
       label: option.label,
+      showTooltip: option?.showTooltip,
+      tooltipChildren: option?.tooltipChildren,
+      tooltipTitle: option?.tooltipTitle,
       name: name,
       value: option.value,
       checked: selectedValue === option.value,
@@ -7360,8 +7462,8 @@ const RadioGroup = ({
   });
 };
 
-var css_248z$m = ".ff-mini-edit-modal-container {\n  width: fit-content;\n  padding: 0;\n  position: absolute;\n  visibility: hidden;\n}\n.ff-mini-edit-modal-container.modalVisible {\n  visibility: visible;\n}\n.ff-mini-edit-modal-container.animatedModal {\n  animation: slideDown 0.5s ease, opacity 0.5s ease;\n}\n.ff-mini-edit-modal-container .popover-arrow {\n  position: absolute;\n  width: 0;\n  height: 0;\n  border-style: solid;\n  z-index: 5;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-top {\n  bottom: 100%;\n  left: 30px;\n  border-width: 0 10px 10px 10px;\n  padding: 0 3px 0 0;\n  border-color: transparent transparent var(--ff-mini-modal-border) transparent;\n  filter: drop-shadow(0 -1px 1px var(--ff-mini-modal-arrow-shadow));\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-top::before {\n  content: \"\";\n  position: absolute;\n  width: 3px;\n  height: 4px;\n  border-radius: 50px;\n  background-color: var(--ff-mini-modal-border);\n  top: -0.5px;\n  left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-left {\n  left: -15px;\n  border-width: 10px 10px 10px 0;\n  border-color: transparent var(--ff-mini-modal-border) transparent transparent;\n  filter: drop-shadow(-1px 0 1px var(--ff-mini-modal-arrow-shadow));\n  padding: 3px 1px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-left::before {\n  content: \"\";\n  position: absolute;\n  width: 4px;\n  height: 3px;\n  border-radius: 50px;\n  background-color: var(--ff-mini-modal-border);\n  top: 0;\n  left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-bottom {\n  top: 100%;\n  left: 30px;\n  border-width: 10px 10px 0 10px;\n  border-color: var(--ff-mini-modal-border) transparent transparent transparent;\n  filter: drop-shadow(0 2px 1px var(--ff-mini-modal-arrow-shadow));\n  padding: 0 3px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-bottom::before {\n  content: \"\";\n  position: absolute;\n  width: 3px;\n  height: 3px;\n  border-radius: 50px;\n  background-color: var(--ff-mini-modal-border);\n  top: -2px;\n  left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-right {\n  right: -10px;\n  top: 66px;\n  border-width: 10px 0 10px 10px;\n  border-color: transparent transparent transparent var(--ff-mini-modal-border);\n  filter: drop-shadow(2px 0 1px var(--ff-mini-modal-arrow-shadow));\n  padding: 3px 1px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-right::before {\n  content: \"\";\n  position: absolute;\n  width: 3px;\n  height: 3px;\n  border-radius: 50px;\n  background-color: var(--ff-mini-modal-border);\n  top: 0;\n  left: -2px;\n}\n.ff-mini-edit-modal-container .popover-arrow.left-top-arrow {\n  top: 10%;\n}\n.ff-mini-edit-modal-container .popover-arrow.left-middle-arrow {\n  top: 45%;\n}\n.ff-mini-edit-modal-container .wrapped-div {\n  width: 35px;\n  height: 35px;\n  background-color: transparent;\n  outline: 8px solid var(--ff-mini-modal-border);\n  outline-offset: -8px;\n  position: absolute;\n  top: -34px;\n  z-index: 10;\n  border-radius: 7px 7px 0 0;\n  box-shadow: 0px -3px 4px 0px var(--ff-mini-modal-box-shadow);\n}\n.ff-mini-edit-modal-container .wrapped-div::before, .ff-mini-edit-modal-container .wrapped-div::after {\n  position: absolute;\n  content: \"\";\n  width: 13px;\n  height: 13px;\n  background: transparent;\n  border-radius: 50%;\n  bottom: 0;\n  box-shadow: 8px 4px 0 var(--ff-mini-modal-border);\n}\n.ff-mini-edit-modal-container .wrapped-div::before {\n  left: -13px;\n  clip-path: polygon(100% 100%, 110% 45%, 0% 70%, 0% 100%);\n}\n.ff-mini-edit-modal-container .wrapped-div::after {\n  right: -13px;\n  clip-path: polygon(-5% 100%, 0% 40%, 100% 70%, 100% 100%);\n  box-shadow: -8px 4px 0 var(--ff-mini-modal-border);\n}\n.ff-mini-edit-modal-container .mini-edit-modal {\n  background: var(--ff-mini-modal-border);\n  position: relative;\n  max-height: fit-content;\n  z-index: 2;\n  padding: 4px;\n  width: 100%;\n  border-radius: 7px;\n  margin: 0 0 0 -5px;\n  height: 100%;\n  box-shadow: 0px 4px 8px var(--ff-mini-modal-arrow-shadow);\n}\n.ff-mini-edit-modal-container .mini-edit-modal.mini-edit-modal-wrapper-shadow {\n  box-shadow: 0px 0px 4px 0px var(--ff-mini-modal-box-shadow);\n}\n.ff-mini-edit-modal-container .mini-edit-modal.mini-edit-modal-arrow-shadow {\n  box-shadow: 0px 0px 16px 0px var(--ff-mini-modal-arrow-shadow);\n}\n.ff-mini-edit-modal-container .mini-edit-modal header {\n  border-radius: 4px 4px 0 0;\n}\n.ff-mini-edit-modal-container .mini-edit-modal footer {\n  border-radius: 0 0 4px 4px;\n}\n.ff-mini-edit-modal-container .modal-content {\n  max-height: 250px;\n  overflow-y: auto;\n}\n.ff-mini-edit-modal-container .modal-footer {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 5px;\n  background-color: var(--ff-mini-modal-footer-background);\n  height: 24px;\n  padding: 0 10px 0 0;\n  transition: transform 0.3s ease-in-out;\n}\n@keyframes slideDown {\n  0% {\n    transform: translateY(-50px);\n    opacity: 0;\n  }\n  100% {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}\n\n.ff-mini-modal-buttons-flex {\n  display: flex;\n}\n\n.ff-mini-modal-gap-10 {\n  gap: 10px;\n}";
-styleInject(css_248z$m);
+var css_248z$o = ".ff-mini-edit-modal-container {\n  width: fit-content;\n  padding: 0;\n  position: absolute;\n  visibility: hidden;\n}\n.ff-mini-edit-modal-container.modalVisible {\n  visibility: visible;\n}\n.ff-mini-edit-modal-container.animatedModal {\n  animation: slideDown 0.5s ease, opacity 0.5s ease;\n}\n.ff-mini-edit-modal-container .popover-arrow {\n  position: absolute;\n  width: 0;\n  height: 0;\n  border-style: solid;\n  z-index: 5;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-top {\n  bottom: 100%;\n  left: 30px;\n  border-width: 0 10px 10px 10px;\n  padding: 0 3px 0 0;\n  border-color: transparent transparent var(--ff-mini-modal-border) transparent;\n  filter: drop-shadow(0 -1px 1px var(--ff-mini-modal-arrow-shadow));\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-top::before {\n  content: \"\";\n  position: absolute;\n  width: 3px;\n  height: 4px;\n  border-radius: 50px;\n  background-color: var(--ff-mini-modal-border);\n  top: -0.5px;\n  left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-left {\n  left: -15px;\n  border-width: 10px 10px 10px 0;\n  border-color: transparent var(--ff-mini-modal-border) transparent transparent;\n  filter: drop-shadow(-1px 0 1px var(--ff-mini-modal-arrow-shadow));\n  padding: 3px 1px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-left::before {\n  content: \"\";\n  position: absolute;\n  width: 4px;\n  height: 3px;\n  border-radius: 50px;\n  background-color: var(--ff-mini-modal-border);\n  top: 0;\n  left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-bottom {\n  top: 100%;\n  left: 30px;\n  border-width: 10px 10px 0 10px;\n  border-color: var(--ff-mini-modal-border) transparent transparent transparent;\n  filter: drop-shadow(0 2px 1px var(--ff-mini-modal-arrow-shadow));\n  padding: 0 3px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-bottom::before {\n  content: \"\";\n  position: absolute;\n  width: 3px;\n  height: 3px;\n  border-radius: 50px;\n  background-color: var(--ff-mini-modal-border);\n  top: -2px;\n  left: 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-right {\n  right: -10px;\n  top: 66px;\n  border-width: 10px 0 10px 10px;\n  border-color: transparent transparent transparent var(--ff-mini-modal-border);\n  filter: drop-shadow(2px 0 1px var(--ff-mini-modal-arrow-shadow));\n  padding: 3px 1px 0 0;\n}\n.ff-mini-edit-modal-container .popover-arrow.popover-arrow-right::before {\n  content: \"\";\n  position: absolute;\n  width: 3px;\n  height: 3px;\n  border-radius: 50px;\n  background-color: var(--ff-mini-modal-border);\n  top: 0;\n  left: -2px;\n}\n.ff-mini-edit-modal-container .popover-arrow.left-top-arrow {\n  top: 10%;\n}\n.ff-mini-edit-modal-container .popover-arrow.left-middle-arrow {\n  top: 45%;\n}\n.ff-mini-edit-modal-container .wrapped-div {\n  width: 35px;\n  height: 35px;\n  background-color: transparent;\n  outline: 8px solid var(--ff-mini-modal-border);\n  outline-offset: -8px;\n  position: absolute;\n  top: -34px;\n  z-index: 10;\n  border-radius: 7px 7px 0 0;\n  box-shadow: 0px -3px 4px 0px var(--ff-mini-modal-box-shadow);\n}\n.ff-mini-edit-modal-container .wrapped-div::before, .ff-mini-edit-modal-container .wrapped-div::after {\n  position: absolute;\n  content: \"\";\n  width: 13px;\n  height: 13px;\n  background: transparent;\n  border-radius: 50%;\n  bottom: 0;\n  box-shadow: 8px 4px 0 var(--ff-mini-modal-border);\n}\n.ff-mini-edit-modal-container .wrapped-div::before {\n  left: -13px;\n  clip-path: polygon(100% 100%, 110% 45%, 0% 70%, 0% 100%);\n}\n.ff-mini-edit-modal-container .wrapped-div::after {\n  right: -13px;\n  clip-path: polygon(-5% 100%, 0% 40%, 100% 70%, 100% 100%);\n  box-shadow: -8px 4px 0 var(--ff-mini-modal-border);\n}\n.ff-mini-edit-modal-container .mini-edit-modal {\n  background: var(--ff-mini-modal-border);\n  position: relative;\n  max-height: fit-content;\n  z-index: 2;\n  padding: 4px;\n  width: 100%;\n  border-radius: 7px;\n  margin: 0 0 0 -5px;\n  height: 100%;\n  box-shadow: 0px 4px 8px var(--ff-mini-modal-arrow-shadow);\n}\n.ff-mini-edit-modal-container .mini-edit-modal.mini-edit-modal-wrapper-shadow {\n  box-shadow: 0px 0px 4px 0px var(--ff-mini-modal-box-shadow);\n}\n.ff-mini-edit-modal-container .mini-edit-modal.mini-edit-modal-arrow-shadow {\n  box-shadow: 0px 0px 16px 0px var(--ff-mini-modal-arrow-shadow);\n}\n.ff-mini-edit-modal-container .mini-edit-modal header {\n  border-radius: 4px 4px 0 0;\n}\n.ff-mini-edit-modal-container .mini-edit-modal footer {\n  border-radius: 0 0 4px 4px;\n}\n.ff-mini-edit-modal-container .modal-content {\n  max-height: 250px;\n  overflow-y: auto;\n}\n.ff-mini-edit-modal-container .modal-footer {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 5px;\n  background-color: var(--ff-mini-modal-footer-background);\n  height: 24px;\n  padding: 0 10px 0 0;\n  transition: transform 0.3s ease-in-out;\n}\n@keyframes slideDown {\n  0% {\n    transform: translateY(-50px);\n    opacity: 0;\n  }\n  100% {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}\n\n.ff-mini-modal-buttons-flex {\n  display: flex;\n}\n\n.ff-mini-modal-gap-10 {\n  gap: 10px;\n}";
+styleInject(css_248z$o);
 
 const MiniModal = /*#__PURE__*/React.forwardRef(({
   anchorRef,
@@ -7577,8 +7679,8 @@ const MiniModal = /*#__PURE__*/React.forwardRef(({
   }), document.body);
 });
 
-var css_248z$l = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-tree-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-tree-container {\n  width: 100%;\n  font-size: 12px;\n  color: var(--brand-color);\n  transition: all 0.3s ease;\n}\n.ff-tree-container table {\n  border-collapse: collapse;\n  width: 100%;\n  text-align: left;\n}\n.ff-tree-container .ff-toggle-arrow-icon {\n  height: 12px;\n  width: 12px;\n  margin-left: 8px;\n  display: grid;\n  place-items: center;\n  transform: rotate(0deg);\n}\n.ff-tree-container .ff-toggle-arrow-icon svg path {\n  fill: var(--brand-color);\n}\n.ff-tree-container .ff-toggle-arrow-icon.ff-expanded {\n  transform: rotate(0deg);\n}\n.ff-tree-container .ff-toggle-arrow-icon.ff-collapsed {\n  transform: rotate(-90deg);\n}\n.ff-tree-container th,\n.ff-tree-container td {\n  padding: 0 8px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.ff-tree-container th {\n  vertical-align: middle;\n  height: 32px;\n  background-color: var(--slider-table-color);\n  color: var(--text-color);\n  font-weight: 600;\n  text-transform: uppercase;\n}\n.ff-tree-container tr .ff-action-section {\n  display: none;\n}\n.ff-tree-container tr:hover {\n  background-color: var(--hover-color);\n}\n.ff-tree-container tr:hover .ff-action-section {\n  display: block;\n}\n.ff-tree-container .ff-title-container {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n.ff-tree-container .ff-title-container .ff-toggle-folder {\n  display: flex;\n  cursor: pointer;\n}\n.ff-tree-container .ff-title-container.ff-folder {\n  font-weight: 600;\n}\n.ff-tree-container .ff-title-container.ff-file {\n  font-weight: 400;\n}\n.ff-tree-container .ff-title-container .ff-title {\n  display: flex;\n  gap: 4px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  font-weight: 400;\n  cursor: pointer;\n}\n.ff-tree-container .ff-title-container .ff-title .ff-hover-icon {\n  display: none;\n  position: absolute;\n  right: 10px;\n}\n.ff-tree-container .ff-node-li {\n  position: relative;\n  --indent-size: 16px;\n  --total-children-height: var(--node-height);\n}\n.ff-tree-container .ff-node-li td:first-child {\n  padding-left: calc(var(--level) * var(--indent-size));\n  height: 32px;\n}\n.ff-tree-container .ff-node-li::before {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  left: calc(var(--level) * var(--indent-size) - 4px);\n  width: 1px;\n  height: calc(var(--total-children-height));\n  background-color: var(--tree-connecting-lines-color);\n  z-index: 1;\n}\n.ff-tree-container .ff-node-li::after {\n  content: \"\";\n  position: absolute;\n  top: 50%;\n  left: calc(var(--level) * var(--indent-size) - 4px);\n  width: 12px;\n  height: 1px;\n  background-color: var(--tree-connecting-lines-color);\n  z-index: 1;\n}\n.ff-tree-container .ff-node-li.ff-is-last::before {\n  height: calc(var(--node-height) / 2);\n}\n.ff-tree-container .ff-node-li[style*=\"--level: 0\"]::before, .ff-tree-container .ff-node-li[style*=\"--level: 0\"]::after {\n  content: none;\n}";
-styleInject(css_248z$l);
+var css_248z$n = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-tree-container {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-tree-container {\n  width: 100%;\n  font-size: 12px;\n  color: var(--brand-color);\n  transition: all 0.3s ease;\n}\n.ff-tree-container table {\n  border-collapse: collapse;\n  width: 100%;\n  text-align: left;\n}\n.ff-tree-container .ff-toggle-arrow-icon {\n  height: 12px;\n  width: 12px;\n  margin-left: 8px;\n  display: grid;\n  place-items: center;\n  transform: rotate(0deg);\n}\n.ff-tree-container .ff-toggle-arrow-icon svg path {\n  fill: var(--brand-color);\n}\n.ff-tree-container .ff-toggle-arrow-icon.ff-expanded {\n  transform: rotate(0deg);\n}\n.ff-tree-container .ff-toggle-arrow-icon.ff-collapsed {\n  transform: rotate(-90deg);\n}\n.ff-tree-container th,\n.ff-tree-container td {\n  padding: 0 8px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.ff-tree-container th {\n  vertical-align: middle;\n  height: 32px;\n  background-color: var(--slider-table-color);\n  color: var(--text-color);\n  font-weight: 600;\n  text-transform: uppercase;\n}\n.ff-tree-container tr .ff-action-section {\n  display: none;\n}\n.ff-tree-container tr:hover {\n  background-color: var(--hover-color);\n}\n.ff-tree-container tr:hover .ff-title-action-container {\n  display: flex;\n}\n.ff-tree-container .ff-title-container {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n.ff-tree-container .ff-title-container .ff-toggle-folder {\n  display: flex;\n  cursor: pointer;\n}\n.ff-tree-container .ff-title-container.ff-folder {\n  font-weight: 600;\n}\n.ff-tree-container .ff-title-container.ff-file {\n  font-weight: 400;\n}\n.ff-tree-container .ff-title-container .ff-title {\n  display: flex;\n  gap: 4px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  font-weight: 400;\n  cursor: pointer;\n}\n.ff-tree-container .ff-title-container .ff-title .ff-title-label {\n  display: flex;\n  align-items: center;\n}\n.ff-tree-container .ff-title-container .ff-title .ff-hover-icon {\n  display: none;\n  position: absolute;\n  right: 10px;\n}\n.ff-tree-container .ff-node-li {\n  position: relative;\n  --indent-size: 16px;\n  --total-children-height: var(--node-height);\n}\n.ff-tree-container .ff-node-li td:first-child {\n  padding-left: calc(var(--level) * var(--indent-size));\n  height: 32px;\n}\n.ff-tree-container .ff-node-li::before {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  left: calc(var(--level) * var(--indent-size) - 4px);\n  width: 1px;\n  height: calc(var(--total-children-height));\n  background-color: var(--tree-connecting-lines-color);\n  z-index: 1;\n}\n.ff-tree-container .ff-node-li::after {\n  content: \"\";\n  position: absolute;\n  top: 50%;\n  left: calc(var(--level) * var(--indent-size) - 4px);\n  width: 12px;\n  height: 1px;\n  background-color: var(--tree-connecting-lines-color);\n  z-index: 1;\n}\n.ff-tree-container .ff-node-li.ff-is-last::before {\n  height: calc(var(--node-height) / 2);\n}\n.ff-tree-container .ff-node-li[style*=\"--level: 0\"]::before, .ff-tree-container .ff-node-li[style*=\"--level: 0\"]::after {\n  content: none;\n}\n\n.ff-title-action-container {\n  display: none;\n  align-items: center;\n}";
+styleInject(css_248z$n);
 
 const TableTree = ({
   columnsData,
@@ -7690,10 +7792,21 @@ const TableTree = ({
               children: [select === 'checkbox' && jsxRuntime.jsx(Checkbox, {
                 checked: selected.includes(node.key),
                 onChange: e => handleCheckBoxChange(e, node)
-              }), select === 'radio' && jsxRuntime.jsx(RadioButton, {
-                checked: selected.includes(node.key),
+              }), select === 'radio' && jsxRuntime.jsx(RadioButton
+              // checked={selected.includes(node.key)}
+              , {
+                // checked={selected.includes(node.key)}
+                name: node.title,
+                value: node.key,
                 onChange: e => handleCheckBoxChange(e, node)
-              }), prepareData(node, column)]
+              }), jsxRuntime.jsx(Typography, {
+                className: "ff-title-label",
+                fontWeight: "medium",
+                children: prepareData(node, column)
+              }), column.actions && jsxRuntime.jsx("div", {
+                className: "ff-title-action-container",
+                children: column.actions(node)
+              })]
             })]
           });
         } else if (column.accessor) {
@@ -7750,8 +7863,8 @@ const TableTree = ({
   });
 };
 
-var css_248z$k = ":root {\n  --tooltip-bg-color: #1e161f;\n  --status-approved-text-color: #016102;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-text-color: #3c3838;\n  --status-approved-bg-color: #c6efcd;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-warning-bg-color: #fae2c6;\n  --status-skipped-bg-color: #c4c3c3;\n  --brand-color: #71347b;\n  --icons-default-color: #71347b;\n  --default-icon-color: #a3a3a3;\n  --default-color: #747474;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --system-color--error: #c50303;\n  --hover-color: #f7ebff;\n  --brand2-color: #610b86;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --description-text-color: #d9d9d9;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --text-color: #1e161f;\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --error-light: #e42525;\n  --tabs-label-default-color: tabs-label-default-color;\n  --tabs-label-active-color: tabs-label-active-color;\n  --tabs-border-color: tabs-border-color;\n  --tabs-bg-color: tabs-bg-color;\n  --tab-bg-color: tab-bg-color;\n  --toggle-button-bg-color: #ffffff;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-strip-color: #cfd1e2;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --toggle-strip-color: #cfd1e2;\n  --add-icon-hover-color: #431b4a;\n  --arrows-button-border-color: #ded1e5;\n  --arrow-button-bg-color: #ffffff;\n  --text-bg-highlight: #f5fb00;\n  --slider-table-color: #efe1f9;\n  --button-close-color: button-close-color;\n  --button-bg-color: button-bg-color;\n}\n\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-tabs-container {\n  box-sizing: border-box;\n}\n.ff-tabs-container .ff-tab-row--default {\n  display: flex;\n  gap: 8px;\n  border: 1px solid var(--tabs-border-color);\n  border-radius: 8px 8px 0 0;\n  padding: 7px 8px 0;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default {\n  border: none;\n  background: none;\n  padding: 0 4px;\n  display: flex;\n  flex-direction: column;\n  cursor: pointer;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .ff-tab-label {\n  padding-bottom: 4px;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .ff-tab-bar {\n  width: 100%;\n  border-radius: 2px 2px 0 0;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .ff-tab-bar--active {\n  border-top: 2px solid var(--tabs-label-active-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default.disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.ff-tabs-container .ff-tab-row--capsule {\n  display: flex;\n  gap: 8px;\n  border: 1px solid var(--tabs-border-color);\n  border-radius: 8px;\n  padding: 3px 4px;\n  background-color: var(--tabs-bg-color);\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule {\n  background: transparent;\n  border: none;\n  padding: 3px 4px;\n  border-radius: 4px;\n  cursor: pointer;\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule.active {\n  background-color: var(--tab-bg-color);\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule .ff-tab-bar {\n  display: none;\n}\n.ff-tabs-container .ff-tab-row--no-border {\n  border: none;\n}\n.ff-tabs-container .ff-tab-content {\n  width: inherit;\n}";
-styleInject(css_248z$k);
+var css_248z$m = ":root {\n  --tooltip-bg-color: #1e161f;\n  --status-approved-text-color: #016102;\n  --status-warning-text-color: #ff8b00;\n  --status-rejected-text-color: #c60202;\n  --status-skipped-text-color: #3c3838;\n  --status-approved-bg-color: #c6efcd;\n  --status-rejected-bg-color: #f7d9d9;\n  --status-warning-bg-color: #fae2c6;\n  --status-skipped-bg-color: #c4c3c3;\n  --brand-color: #71347b;\n  --icons-default-color: #71347b;\n  --default-icon-color: #a3a3a3;\n  --default-color: #747474;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --system-color--error: #c50303;\n  --hover-color: #f7ebff;\n  --brand2-color: #610b86;\n  --status-warning-hover-bg-color: #fcd8ac;\n  --status-percentage-growth-bg-color: #ecedf8;\n  --primary-icon-color: #ffffff;\n  --secondary-icon-color: #71347b;\n  --description-text-color: #d9d9d9;\n  --expandable-menu-default-bg: #fdfaff;\n  --expandable-menu-option-bg: rgba(97, 11, 134, 0.1019607843);\n  --text-color: #1e161f;\n  --file-dropzone-default-color: rgba(113, 52, 123, 0.1019607843);\n  --file-dropzone-selected-color: rgba(113, 52, 123, 0.2);\n  --file-details-container-shadow: rgba(30, 22, 31, 0.1607843137);\n  --file-details-bg: #ffffff;\n  --error-light: #e42525;\n  --tabs-label-default-color: tabs-label-default-color;\n  --tabs-label-active-color: tabs-label-active-color;\n  --tabs-border-color: tabs-border-color;\n  --tabs-bg-color: tabs-bg-color;\n  --tab-bg-color: tab-bg-color;\n  --toggle-button-bg-color: #ffffff;\n  --toggle-strip-shadow: rgba(0, 0, 0, 0.2509803922);\n  --toggle-strip-color: #cfd1e2;\n  --disable-color: rgba(113, 52, 123, 0.5019607843);\n  --toggle-strip-color: #cfd1e2;\n  --add-icon-hover-color: #431b4a;\n  --arrows-button-border-color: #ded1e5;\n  --arrow-button-bg-color: #ffffff;\n  --text-bg-highlight: #f5fb00;\n  --slider-table-color: #efe1f9;\n  --button-close-color: button-close-color;\n  --button-bg-color: button-bg-color;\n}\n\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-tabs-container {\n  box-sizing: border-box;\n}\n.ff-tabs-container .ff-tab-row--default {\n  display: flex;\n  gap: 8px;\n  border: 1px solid var(--tabs-border-color);\n  border-radius: 8px 8px 0 0;\n  padding: 7px 8px 0;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default {\n  border: none;\n  background: none;\n  padding: 0 4px;\n  display: flex;\n  flex-direction: column;\n  cursor: pointer;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .ff-tab-label {\n  padding-bottom: 4px;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .ff-tab-bar {\n  width: 100%;\n  border-radius: 2px 2px 0 0;\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default .ff-tab-bar--active {\n  border-top: 2px solid var(--tabs-label-active-color);\n}\n.ff-tabs-container .ff-tab-row--default .ff-tab-button--default.disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.ff-tabs-container .ff-tab-row--capsule {\n  display: flex;\n  gap: 8px;\n  border: 1px solid var(--tabs-border-color);\n  border-radius: 8px;\n  padding: 3px 4px;\n  background-color: var(--tabs-bg-color);\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule {\n  background: transparent;\n  border: none;\n  padding: 3px 4px;\n  border-radius: 4px;\n  cursor: pointer;\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule.active {\n  background-color: var(--tab-bg-color);\n}\n.ff-tabs-container .ff-tab-row--capsule .ff-tab-button--capsule .ff-tab-bar {\n  display: none;\n}\n.ff-tabs-container .ff-tab-row--no-border {\n  border: none;\n}\n.ff-tabs-container .ff-tab-content {\n  width: inherit;\n}";
+styleInject(css_248z$m);
 
 const Tabs = ({
   variant = 'default',
@@ -7796,8 +7909,8 @@ const Tabs = ({
   });
 };
 
-var css_248z$j = ".ff-highlight-bg {\n  background-color: var(--text-bg-highlight);\n}";
-styleInject(css_248z$j);
+var css_248z$l = ".ff-highlight-bg {\n  background-color: var(--text-bg-highlight);\n}";
+styleInject(css_248z$l);
 
 // Function to escape special characters in the search term
 const escapeRegExp = text => {
@@ -7820,8 +7933,8 @@ const HighlightText = ({
   });
 };
 
-var css_248z$i = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-search-container .ff-search-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-search-container {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n.ff-search-container .ff-search-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  border: 1px solid var(--border-color);\n  border-radius: 4px;\n  padding: 4px;\n}\n.ff-search-container .ff-search-icon .ff-icon-container svg path {\n  fill: var(--brand-color);\n}\n.ff-search-container .ff-search-input {\n  border: none;\n  color: var(--tooltip-bg-color);\n  line-height: 12px;\n  visibility: hidden;\n  transition: width 0.4s ease;\n}\n.ff-search-container .ff-search-input:focus {\n  outline: none;\n  border: none;\n}\n.ff-search-container .ff-search-input:hover {\n  border: none;\n}\n.ff-search-container.disabled {\n  opacity: 0.5;\n}\n.ff-search-container.expanded {\n  border: 1px solid var(--border-color);\n  border-radius: 4px;\n}\n.ff-search-container.expanded .ff-vertical-line {\n  height: 8px;\n  width: 1px;\n  position: relative;\n  right: 2px;\n  border-radius: 1px;\n  margin: 8px 0px;\n  background-color: var(--border-color);\n}\n.ff-search-container.expanded .ff-search-input {\n  visibility: visible;\n}\n.ff-search-container.expanded .ff-search-input::placeholder {\n  color: var(--ff-search-filed-placeholder-text);\n}\n.ff-search-container.expanded .ff-search-icon {\n  padding: 4px;\n  border: none;\n  cursor: default;\n}\n.ff-search-container.expanded .ff-search-clear-button {\n  display: grid;\n  place-items: center;\n  cursor: pointer;\n  width: 22px;\n}\n.ff-search-container.expanded .ff-search-close-icon {\n  margin: 4px;\n  cursor: pointer;\n}\n.ff-search-container.expanded .ff-search-close-icon .ff-icon-container svg path {\n  fill: var(--ff-search-filed-close-Icon);\n}";
-styleInject(css_248z$i);
+var css_248z$k = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-search-container .ff-search-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-search-container {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n.ff-search-container .ff-search-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  border: 1px solid var(--border-color);\n  border-radius: 4px;\n  padding: 4px;\n}\n.ff-search-container .ff-search-icon .ff-icon-container svg path {\n  fill: var(--brand-color);\n}\n.ff-search-container .ff-search-input {\n  border: none;\n  color: var(--tooltip-bg-color);\n  line-height: 12px;\n  visibility: hidden;\n  transition: width 0.4s ease;\n}\n.ff-search-container .ff-search-input:focus {\n  outline: none;\n  border: none;\n}\n.ff-search-container .ff-search-input:hover {\n  border: none;\n}\n.ff-search-container.disabled {\n  opacity: 0.5;\n}\n.ff-search-container.expanded {\n  border: 1px solid var(--border-color);\n  border-radius: 4px;\n}\n.ff-search-container.expanded .ff-vertical-line {\n  height: 8px;\n  width: 1px;\n  position: relative;\n  right: 2px;\n  border-radius: 1px;\n  margin: 8px 0px;\n  background-color: var(--border-color);\n}\n.ff-search-container.expanded .ff-search-input {\n  visibility: visible;\n}\n.ff-search-container.expanded .ff-search-input::placeholder {\n  color: var(--ff-search-filed-placeholder-text);\n}\n.ff-search-container.expanded .ff-search-icon {\n  padding: 4px;\n  border: none;\n  cursor: default;\n}\n.ff-search-container.expanded .ff-search-clear-button {\n  display: grid;\n  place-items: center;\n  cursor: pointer;\n  width: 22px;\n}\n.ff-search-container.expanded .ff-search-close-icon {\n  margin: 4px;\n  cursor: pointer;\n}\n.ff-search-container.expanded .ff-search-close-icon .ff-icon-container svg path {\n  fill: var(--ff-search-filed-close-Icon);\n}";
+styleInject(css_248z$k);
 
 const Search = ({
   placeholder = 'Search',
@@ -15825,8 +15938,8 @@ const TimePicker = ({
   });
 };
 
-var css_248z$h = "@import 'react-day-picker/style.css';\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n/* Custom date picker styling */\n.ff-date-picker {\n  position: relative;\n}\n.ff-date-picker .rdp-root {\n  --rdp-accent-color: var(--brand-color);\n  --rdp-day-height: 24px;\n  --rdp-day-width: 36px;\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n  --rdp-font-family: \"Poppins\", sans-serif;\n}\n.ff-date-picker .ff-cursor-pointer {\n  cursor: pointer;\n}\n.ff-date-picker .ff-datepicker-input-container {\n  display: flex;\n  gap: 10px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input {\n  padding: 4px 8px;\n  padding-left: 2rem;\n  height: 32px;\n  border-radius: 5px;\n  border: 1px solid var(--border-color);\n  color: var(--status-skipped-text-color);\n  line-height: 15px;\n  box-sizing: border-box;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input:focus,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input:focus {\n  outline: none;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-calendar-icon,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-clock-icon {\n  position: absolute;\n  transform: translate(50%, 50%);\n  display: flex;\n  align-items: center;\n  pointer-events: none;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field {\n  flex: 1;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input {\n  width: 100%;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message {\n  padding: 0px 4px;\n  margin-left: 8px;\n  line-height: 12px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message--danger {\n  color: var(--input-error-text-color);\n}\n.ff-date-picker .ff-datepicker-input-container .ff-time-input-field {\n  flex: 0 0 120px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-time-input-field .ff-time-input {\n  width: 100%;\n}\n.ff-date-picker .ff-date-picker-container {\n  display: flex;\n  flex-direction: column;\n  position: absolute;\n  border-radius: 8px;\n  padding: 4px;\n  box-sizing: border-box;\n  background-color: var(--tab-bg-color);\n  box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.2);\n  gap: 8px;\n  z-index: 10;\n}\n.ff-date-picker .ff-date-picker-container .ff-calendar-container {\n  display: flex;\n  align-items: flex-start;\n  gap: 4px;\n  height: 240px;\n}\n.ff-date-picker .ff-date-picker-container .ff-date-picker-controls {\n  padding: 4px;\n  display: flex;\n  justify-content: end;\n  gap: 8px;\n  border-top: 1px solid var(--border-color);\n}\n.ff-date-picker .ff-date-picker-container .ff-date-picker-controls .ff-date-picker-button {\n  font-weight: 600;\n  line-height: 15px;\n}\n.ff-date-picker .ff-calendar .ff-calendar-nav-button {\n  margin: 0 5px;\n  border: 1px solid var(--border-color);\n  background-color: var(--toggle-button-bg-color);\n  box-shadow: 0 -2px 2px 0 var(--ff-mini-modal-box-shadow);\n  padding: 4px;\n  border-radius: 30%;\n  cursor: pointer;\n}\n.ff-date-picker .ff-calendar .ff-calendar-nav-button:disabled {\n  cursor: auto;\n  opacity: 0.5;\n}\n.ff-date-picker .ff-calendar .ff-calendar-haeder {\n  display: flex;\n  align-items: center;\n  gap: 5px;\n  color: var(--text-color);\n}\n.ff-date-picker .ff-calendar .ff-custom-year_grid,\n.ff-date-picker .ff-calendar .ff-custom-month_grid {\n  width: calc((var(--rdp-day-width) + 4px) * 7);\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 10px;\n  padding: 5px;\n  max-width: 100%;\n}\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-year,\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-month,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-year,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-month {\n  padding: 10px 0;\n  text-align: center;\n  cursor: pointer;\n  border-radius: 8px;\n  background-color: #f9f9f9;\n}\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-year--selected,\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-month--selected,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-year--selected,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-month--selected {\n  background-color: var(--brand-color);\n  color: var(--primary-button-text-color);\n}\n.ff-date-picker .ff-calendar .rdp-weekdays th {\n  color: #6f7c8e;\n  font-weight: 400;\n}\n.ff-date-picker .ff-calendar .rdp-day {\n  padding: 2px;\n  font-weight: 500;\n}\n.ff-date-picker .ff-calendar .rdp-day_button {\n  border-radius: 4px;\n  padding: 3px 9px;\n}\n.ff-date-picker .ff-calendar .rdp-day_button:hover {\n  background-color: var(--hover-color);\n}\n.ff-date-picker .ff-calendar .rdp-selected {\n  font: inherit;\n}\n.ff-date-picker .ff-calendar .rdp-selected .rdp-day_button {\n  background: var(--rdp-accent-color);\n  color: var(--drawer-footer-bg);\n  border: none;\n}\n.ff-date-picker .ff-calendar .rdp-today:not(.rdp-outside) .rdp-day_button {\n  border: 2px solid var(--rdp-accent-color);\n}\n.ff-date-picker .ff-time-picker-container {\n  position: relative;\n  width: 150px;\n  height: 100%;\n  overflow-y: hidden;\n  border-left: 1px solid #ccc;\n  padding: 10px 5px;\n  box-sizing: border-box;\n}\n.ff-date-picker .ff-time-picker-container::-webkit-scrollbar {\n  display: none;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields {\n  display: flex;\n  height: 14%;\n  width: 100%;\n  margin-bottom: 5px;\n  box-sizing: border-box;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container {\n  display: flex;\n  border: 1px solid var(--border-color);\n  border-right: 0;\n  border-radius: 4px 0 0 4px;\n  width: 55%;\n  position: relative;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input {\n  border: none;\n  padding: 5px;\n  width: 100%;\n  text-align: center;\n  border-radius: 4px 0 0 4px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input::placeholder {\n  opacity: 0;\n  line-height: 18px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input-label {\n  position: absolute;\n  left: 10px;\n  top: 50%;\n  transform: translateY(-50%);\n  transition: 0.2s ease all;\n  color: var(--input-default-label-color);\n  pointer-events: none;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--float .ff-time-input-label {\n  top: 0;\n  left: 5px;\n  color: var(--brand-color);\n  background-color: var(--input-label-bg-color);\n  line-height: 12px;\n  padding: 0 2px;\n  font-size: 8px !important;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--float .ff-time-input-label--danger {\n  color: var(--input-error-text-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:hover {\n  border-color: var(--input-hover-border-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within {\n  border-color: var(--brand-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input-label {\n  top: 0;\n  left: 5px;\n  color: var(--brand-color);\n  background-color: var(--input-label-bg-color);\n  line-height: 12px;\n  padding: 0 2px;\n  font-size: 8px !important;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input-label--danger {\n  color: var(--input-error-text-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input::placeholder {\n  opacity: 1;\n  margin-bottom: 1px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--danger {\n  border-color: var(--input-error-text-color) !important;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input:focus {\n  outline: none;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container {\n  position: relative;\n  width: 45%;\n  display: flex;\n  border: 1px solid var(--border-color);\n  border-radius: 0 4px 4px 0;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-select {\n  display: flex;\n  align-items: center;\n  padding: 0 5px;\n  width: 100%;\n  border-radius: 4px;\n  background-color: white;\n  cursor: pointer;\n  border: none;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container--active {\n  border-color: var(--brand-color) !important;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container:hover {\n  border-color: var(--input-hover-border-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-icon {\n  margin-left: auto;\n  pointer-events: none;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-options {\n  position: fixed;\n  z-index: 100;\n  min-width: 60px;\n  margin: 4px 0 0;\n  padding: 0;\n  list-style: none;\n  border: 1px solid var(--ff-select-background-color);\n  border-radius: 4px;\n  background-color: var(--primary-button-text-color);\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-option-item {\n  padding: 8px;\n  color: var(--text-color);\n  border-radius: 4px;\n  cursor: pointer;\n  transition: background-color 0.2s ease;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-option-item:hover {\n  background-color: var(--ff-select-option-hover-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options {\n  height: 86%;\n  overflow-y: auto;\n  padding-right: 5px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar {\n  width: 4px;\n  height: 12px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar-thumb {\n  background-color: var(--ff-select-scroll-thumb-color);\n  border-radius: 4px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar-track {\n  background-color: var(--hover-color);\n  border-radius: 4px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options .ff-time-option {\n  padding: 10px 12px;\n  cursor: pointer;\n  text-align: center;\n  border-radius: 8px;\n  background-color: rgb(249, 249, 249);\n  margin: 10px 0;\n}";
-styleInject(css_248z$h);
+var css_248z$j = "@import 'react-day-picker/style.css';\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n/* Custom date picker styling */\n.ff-date-picker {\n  position: relative;\n}\n.ff-date-picker .rdp-root {\n  --rdp-accent-color: var(--brand-color);\n  --rdp-day-height: 24px;\n  --rdp-day-width: 36px;\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n  --rdp-font-family: \"Poppins\", sans-serif;\n}\n.ff-date-picker .ff-cursor-pointer {\n  cursor: pointer;\n}\n.ff-date-picker .ff-datepicker-input-container {\n  display: flex;\n  gap: 10px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input {\n  padding: 4px 8px;\n  padding-left: 2rem;\n  height: 32px;\n  border-radius: 5px;\n  border: 1px solid var(--border-color);\n  color: var(--status-skipped-text-color);\n  line-height: 15px;\n  box-sizing: border-box;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-date-input:focus,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-time-input:focus {\n  outline: none;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-calendar-icon,\n.ff-date-picker .ff-datepicker-input-container .ff-input-with-icon .ff-clock-icon {\n  position: absolute;\n  transform: translate(50%, 50%);\n  display: flex;\n  align-items: center;\n  pointer-events: none;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field {\n  flex: 1;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input {\n  width: 100%;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message {\n  padding: 0px 4px;\n  margin-left: 8px;\n  line-height: 12px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-date-input-field .ff-date-input-message--danger {\n  color: var(--input-error-text-color);\n}\n.ff-date-picker .ff-datepicker-input-container .ff-time-input-field {\n  flex: 0 0 120px;\n}\n.ff-date-picker .ff-datepicker-input-container .ff-time-input-field .ff-time-input {\n  width: 100%;\n}\n.ff-date-picker .ff-date-picker-container {\n  display: flex;\n  flex-direction: column;\n  position: absolute;\n  border-radius: 8px;\n  padding: 4px;\n  box-sizing: border-box;\n  background-color: var(--tab-bg-color);\n  box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.2);\n  gap: 8px;\n  z-index: 10;\n}\n.ff-date-picker .ff-date-picker-container .ff-calendar-container {\n  display: flex;\n  align-items: flex-start;\n  gap: 4px;\n  height: 240px;\n}\n.ff-date-picker .ff-date-picker-container .ff-date-picker-controls {\n  padding: 4px;\n  display: flex;\n  justify-content: end;\n  gap: 8px;\n  border-top: 1px solid var(--border-color);\n}\n.ff-date-picker .ff-date-picker-container .ff-date-picker-controls .ff-date-picker-button {\n  font-weight: 600;\n  line-height: 15px;\n}\n.ff-date-picker .ff-calendar .ff-calendar-nav-button {\n  margin: 0 5px;\n  border: 1px solid var(--border-color);\n  background-color: var(--toggle-button-bg-color);\n  box-shadow: 0 -2px 2px 0 var(--ff-mini-modal-box-shadow);\n  padding: 4px;\n  border-radius: 30%;\n  cursor: pointer;\n}\n.ff-date-picker .ff-calendar .ff-calendar-nav-button:disabled {\n  cursor: auto;\n  opacity: 0.5;\n}\n.ff-date-picker .ff-calendar .ff-calendar-haeder {\n  display: flex;\n  align-items: center;\n  gap: 5px;\n  color: var(--text-color);\n}\n.ff-date-picker .ff-calendar .ff-custom-year_grid,\n.ff-date-picker .ff-calendar .ff-custom-month_grid {\n  width: calc((var(--rdp-day-width) + 4px) * 7);\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 10px;\n  padding: 5px;\n  max-width: 100%;\n}\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-year,\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-month,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-year,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-month {\n  padding: 10px 0;\n  text-align: center;\n  cursor: pointer;\n  border-radius: 8px;\n  background-color: #f9f9f9;\n}\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-year--selected,\n.ff-date-picker .ff-calendar .ff-custom-year_grid .ff-custom-month--selected,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-year--selected,\n.ff-date-picker .ff-calendar .ff-custom-month_grid .ff-custom-month--selected {\n  background-color: var(--brand-color);\n  color: var(--primary-button-text-color);\n}\n.ff-date-picker .ff-calendar .rdp-weekdays th {\n  color: #6f7c8e;\n  font-weight: 400;\n}\n.ff-date-picker .ff-calendar .rdp-day {\n  padding: 2px;\n  font-weight: 500;\n}\n.ff-date-picker .ff-calendar .rdp-day_button {\n  border-radius: 4px;\n  padding: 3px 9px;\n}\n.ff-date-picker .ff-calendar .rdp-day_button:hover {\n  background-color: var(--hover-color);\n}\n.ff-date-picker .ff-calendar .rdp-selected {\n  font: inherit;\n}\n.ff-date-picker .ff-calendar .rdp-selected .rdp-day_button {\n  background: var(--rdp-accent-color);\n  color: var(--drawer-footer-bg);\n  border: none;\n}\n.ff-date-picker .ff-calendar .rdp-today:not(.rdp-outside) .rdp-day_button {\n  border: 2px solid var(--rdp-accent-color);\n}\n.ff-date-picker .ff-time-picker-container {\n  position: relative;\n  width: 150px;\n  height: 100%;\n  overflow-y: hidden;\n  border-left: 1px solid #ccc;\n  padding: 10px 5px;\n  box-sizing: border-box;\n}\n.ff-date-picker .ff-time-picker-container::-webkit-scrollbar {\n  display: none;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields {\n  display: flex;\n  height: 14%;\n  width: 100%;\n  margin-bottom: 5px;\n  box-sizing: border-box;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container {\n  display: flex;\n  border: 1px solid var(--border-color);\n  border-right: 0;\n  border-radius: 4px 0 0 4px;\n  width: 55%;\n  position: relative;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input {\n  border: none;\n  padding: 5px;\n  width: 100%;\n  text-align: center;\n  border-radius: 4px 0 0 4px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input::placeholder {\n  opacity: 0;\n  line-height: 18px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input-label {\n  position: absolute;\n  left: 10px;\n  top: 50%;\n  transform: translateY(-50%);\n  transition: 0.2s ease all;\n  color: var(--input-default-label-color);\n  pointer-events: none;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--float .ff-time-input-label {\n  top: 0;\n  left: 5px;\n  color: var(--brand-color);\n  background-color: var(--input-label-bg-color);\n  line-height: 12px;\n  padding: 0 2px;\n  font-size: 8px !important;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--float .ff-time-input-label--danger {\n  color: var(--input-error-text-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:hover {\n  border-color: var(--input-hover-border-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within {\n  border-color: var(--brand-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input-label {\n  top: 0;\n  left: 5px;\n  color: var(--brand-color);\n  background-color: var(--input-label-bg-color);\n  line-height: 12px;\n  padding: 0 2px;\n  font-size: 8px !important;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input-label--danger {\n  color: var(--input-error-text-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container:focus-within .ff-time-input::placeholder {\n  opacity: 1;\n  margin-bottom: 1px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container--danger {\n  border-color: var(--input-error-text-color) !important;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-input-container .ff-time-input:focus {\n  outline: none;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container {\n  position: relative;\n  width: 45%;\n  display: flex;\n  border: 1px solid var(--border-color);\n  border-radius: 0 4px 4px 0;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-select {\n  display: flex;\n  align-items: center;\n  padding: 0 5px;\n  width: 100%;\n  border-radius: 4px;\n  background-color: white;\n  cursor: pointer;\n  border: none;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container--active {\n  border-color: var(--brand-color) !important;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container:hover {\n  border-color: var(--input-hover-border-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-icon {\n  margin-left: auto;\n  pointer-events: none;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-time-period-options {\n  position: fixed;\n  z-index: 100;\n  min-width: 60px;\n  margin: 4px 0 0;\n  padding: 0;\n  list-style: none;\n  border: 1px solid var(--ff-select-background-color);\n  border-radius: 4px;\n  background-color: var(--primary-button-text-color);\n  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-option-item {\n  padding: 8px;\n  color: var(--text-color);\n  border-radius: 4px;\n  cursor: pointer;\n  transition: background-color 0.2s ease;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-fields .ff-time-period-container .ff-option-item:hover {\n  background-color: var(--ff-select-option-hover-color);\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options {\n  height: 86%;\n  overflow-y: auto;\n  padding-right: 5px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar {\n  width: 4px;\n  height: 12px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar-thumb {\n  background-color: var(--ff-select-scroll-thumb-color);\n  border-radius: 4px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options::-webkit-scrollbar-track {\n  background-color: var(--hover-color);\n  border-radius: 4px;\n}\n.ff-date-picker .ff-time-picker-container .ff-time-picker-options .ff-time-option {\n  padding: 10px 12px;\n  cursor: pointer;\n  text-align: center;\n  border-radius: 8px;\n  background-color: rgb(249, 249, 249);\n  margin: 10px 0;\n}";
+styleInject(css_248z$j);
 
 const CustomDatePicker = ({
   minDate,
@@ -16346,8 +16459,8 @@ const StateDropdown = ({
   });
 };
 
-var css_248z$g = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-plus-icon {\n  border-radius: 16px;\n  border-style: none;\n  text-align: center;\n  text-decoration: none;\n  cursor: pointer;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  gap: 8px;\n  background-color: var(--secondary-icon-color);\n  padding: 2px 8px 2px 2px;\n  border: 1px solid transparent;\n}\n.ff-plus-icon .button-icon {\n  width: 20px;\n  height: 20px;\n  border: 1px solid transparent;\n  border-radius: 50%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  background-color: var(--hover-color);\n}\n.ff-plus-icon .button-icon .ff-icon-color path {\n  color: var(--secondary-icon-color);\n}\n.ff-plus-icon .icon-name {\n  color: var(--primary-icon-color);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n}\n.ff-plus-icon:hover {\n  border: 1px solid var(--secondary-icon-color);\n  background-color: var(--hover-color);\n}\n.ff-plus-icon:hover .icon-name {\n  font-weight: 600;\n  color: var(--secondary-icon-color);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n}\n.ff-plus-icon:hover .button-icon {\n  width: 20px;\n  height: 20px;\n  border: 1px solid transparent;\n  border-radius: 50%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  background-color: var(--secondary-icon-color);\n}\n.ff-plus-icon:hover .button-icon .ff-icon-color path {\n  color: var(--primary-icon-color);\n}";
-styleInject(css_248z$g);
+var css_248z$i = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-plus-icon {\n  border-radius: 16px;\n  border-style: none;\n  text-align: center;\n  text-decoration: none;\n  cursor: pointer;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  gap: 8px;\n  background-color: var(--secondary-icon-color);\n  padding: 2px 8px 2px 2px;\n  border: 1px solid transparent;\n}\n.ff-plus-icon .button-icon {\n  width: 20px;\n  height: 20px;\n  border: 1px solid transparent;\n  border-radius: 50%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  background-color: var(--hover-color);\n}\n.ff-plus-icon .button-icon .ff-icon-color path {\n  color: var(--secondary-icon-color);\n}\n.ff-plus-icon .icon-name {\n  color: var(--primary-icon-color);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n}\n.ff-plus-icon:hover {\n  border: 1px solid var(--secondary-icon-color);\n  background-color: var(--hover-color);\n}\n.ff-plus-icon:hover .icon-name {\n  font-weight: 600;\n  color: var(--secondary-icon-color);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n}\n.ff-plus-icon:hover .button-icon {\n  width: 20px;\n  height: 20px;\n  border: 1px solid transparent;\n  border-radius: 50%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  background-color: var(--secondary-icon-color);\n}\n.ff-plus-icon:hover .button-icon .ff-icon-color path {\n  color: var(--primary-icon-color);\n}";
+styleInject(css_248z$i);
 
 const IconButton = ({
   label,
@@ -16374,8 +16487,8 @@ const IconButton = ({
   });
 };
 
-var css_248z$f = ".ff-modal-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background: var(--background-modal-color);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  flex-direction: column;\n}\n\n.ff-modal-content {\n  background: var(--ff-mini-modal-border);\n  position: relative;\n  max-width: 100%;\n  border-radius: 12px 12px 0 0;\n  padding: 8px;\n}\n.ff-modal-content .ff-modal-header {\n  height: 32px;\n  width: 100%;\n}\n\n.ff-modal-footer {\n  background-color: var(--expandable-menu-option-bg);\n  max-width: 100%;\n  width: 100%;\n  height: 32px;\n  border-radius: 0 0 12px 12px;\n  display: flex;\n  flex-direction: row;\n  justify-content: end;\n  align-items: center;\n  gap: 8px;\n  padding: 4px 16px;\n}";
-styleInject(css_248z$f);
+var css_248z$h = ".ff-modal-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background: var(--background-modal-color);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  flex-direction: column;\n}\n\n.ff-modal-content {\n  background: var(--ff-mini-modal-border);\n  position: relative;\n  max-width: 100%;\n  border-radius: 12px;\n  padding: 8px;\n}\n.ff-modal-content .ff-modal-header {\n  height: 32px;\n  width: 100%;\n}\n\n.ff-modal-footer {\n  background-color: var(--expandable-menu-option-bg);\n  max-width: 100%;\n  width: 100%;\n  height: 32px;\n  border-radius: 0 0 12px 12px;\n  display: flex;\n  flex-direction: row;\n  justify-content: end;\n  align-items: center;\n  gap: 8px;\n  padding: 4px 16px;\n}";
+styleInject(css_248z$h);
 
 const Modal = ({
   isOpen,
@@ -21058,8 +21171,8 @@ const DragAndDrop = {
   DNDUtilities
 };
 
-var css_248z$e = ".ff_variable_input_container .ff_label_container {\n  display: flex;\n  align-items: center;\n  margin-bottom: 4px;\n}\n.ff_variable_input_container .ff_label_container.ff_danger_label .ff_input_label {\n  color: var(--error);\n}\n.ff_variable_input_container .ff_label_container.ff_danger_label .ff_required_asterisk {\n  color: var(--error);\n}\n.ff_variable_input_container .ff_required_asterisk {\n  color: var(--input-error-text-color);\n  font-size: 1.1em;\n  margin-right: 4px;\n}\n.ff_variable_input_container .ff_input_label {\n  font-size: 14px;\n  font-weight: 500;\n  color: var(--text-color);\n}\n.ff_variable_input_container .ff_input_label.ff_no_hover {\n  color: var(--toggle-disable-icon-color);\n}\n.ff_variable_input_container .ff_input_label.ff_disabled_label {\n  color: var(--toggle-disable-icon-color);\n  cursor: not-allowed;\n}\n.ff_variable_input_container .ff_input_label.ff_danger_label {\n  color: var(--error);\n}\n.ff_variable_input_container .ff_content_editable {\n  min-width: 8rem;\n  border: 1px solid var(--input-default-border-color);\n  padding: 8px;\n  min-height: 30px;\n  border-radius: 4px;\n  font-family: Arial, sans-serif;\n  font-size: 14px;\n  line-height: 20px;\n  transition: border-color 0.2s ease;\n  position: relative;\n  text-align: left;\n  display: flex;\n  align-items: center;\n  overflow: auto;\n}\n.ff_variable_input_container .ff_content_editable .ff_var_red {\n  color: var(--status-rejected-text-color);\n}\n.ff_variable_input_container .ff_content_editable .ff_var_def_color {\n  color: var(--text-color);\n}\n.ff_variable_input_container .ff_content_editable .ff_var_green {\n  color: var(--status-success-text-color);\n}\n.ff_variable_input_container .ff_content_editable::after {\n  content: \"*\";\n  color: var(--input-error-text-color);\n  font-size: 1.2em;\n  position: absolute;\n  top: 2px;\n  right: 2px;\n  display: none;\n}\n.ff_variable_input_container .ff_content_editable.ff_required::after {\n  display: inline;\n}\n.ff_variable_input_container .ff_content_editable.ff_required_empty:focus-within, .ff_variable_input_container .ff_content_editable.ff_required_empty:focus {\n  border-color: var(--input-error-text-color);\n}\n.ff_variable_input_container .ff_content_editable:empty::before {\n  content: attr(data-placeholder);\n  color: var(--ff-search-filed-placeholder-text);\n  position: absolute;\n  user-select: none;\n  pointer-events: none;\n  font-size: medium;\n}\n.ff_variable_input_container .ff_content_editable.ff_disabled {\n  pointer-events: none;\n  opacity: 0.5;\n  background-color: var(--input-default-border-color);\n}\n.ff_variable_input_container .ff_content_editable.ff_invalid_input {\n  border: 1px solid var(--input-error-text-color);\n}\n.ff_variable_input_container .ff_suggestions {\n  border: 1px solid var(--input-default-border-color);\n  margin-top: 4px;\n  padding: 4px;\n  border-radius: 4px;\n  list-style-type: none;\n  background-color: var(--ff-select-background-color);\n  max-height: 150px;\n  overflow-y: auto;\n}\n.ff_variable_input_container .ff_suggestion_item {\n  padding: 4px;\n  cursor: pointer;\n}\n.ff_variable_input_container .ff_suggestion_item:hover {\n  background-color: var(--ff-select-background-color);\n}";
-styleInject(css_248z$e);
+var css_248z$g = ".ff_variable_input_container .ff_label_container {\n  display: flex;\n  align-items: center;\n  margin-bottom: 4px;\n}\n.ff_variable_input_container .ff_label_container.ff_danger_label .ff_input_label {\n  color: var(--error);\n}\n.ff_variable_input_container .ff_label_container.ff_danger_label .ff_required_asterisk {\n  color: var(--error);\n}\n.ff_variable_input_container .ff_required_asterisk {\n  color: var(--input-error-text-color);\n  font-size: 1.1em;\n  margin-right: 4px;\n}\n.ff_variable_input_container .ff_input_label {\n  font-size: 14px;\n  font-weight: 500;\n  color: var(--text-color);\n}\n.ff_variable_input_container .ff_input_label.ff_no_hover {\n  color: var(--toggle-disable-icon-color);\n}\n.ff_variable_input_container .ff_input_label.ff_disabled_label {\n  color: var(--toggle-disable-icon-color);\n  cursor: not-allowed;\n}\n.ff_variable_input_container .ff_input_label.ff_danger_label {\n  color: var(--error);\n}\n.ff_variable_input_container .ff_content_editable {\n  min-width: 8rem;\n  border: 1px solid var(--input-default-border-color);\n  padding: 8px;\n  min-height: 30px;\n  border-radius: 4px;\n  font-family: Arial, sans-serif;\n  font-size: 14px;\n  line-height: 20px;\n  transition: border-color 0.2s ease;\n  position: relative;\n  text-align: left;\n  display: flex;\n  align-items: center;\n  overflow: auto;\n}\n.ff_variable_input_container .ff_content_editable .ff_var_red {\n  color: var(--status-rejected-text-color);\n}\n.ff_variable_input_container .ff_content_editable .ff_var_def_color {\n  color: var(--text-color);\n}\n.ff_variable_input_container .ff_content_editable .ff_var_green {\n  color: var(--status-success-text-color);\n}\n.ff_variable_input_container .ff_content_editable::after {\n  content: \"*\";\n  color: var(--input-error-text-color);\n  font-size: 1.2em;\n  position: absolute;\n  top: 2px;\n  right: 2px;\n  display: none;\n}\n.ff_variable_input_container .ff_content_editable.ff_required::after {\n  display: inline;\n}\n.ff_variable_input_container .ff_content_editable.ff_required_empty:focus-within, .ff_variable_input_container .ff_content_editable.ff_required_empty:focus {\n  border-color: var(--input-error-text-color);\n}\n.ff_variable_input_container .ff_content_editable:empty::before {\n  content: attr(data-placeholder);\n  color: var(--ff-search-filed-placeholder-text);\n  position: absolute;\n  user-select: none;\n  pointer-events: none;\n  font-size: medium;\n}\n.ff_variable_input_container .ff_content_editable.ff_disabled {\n  pointer-events: none;\n  opacity: 0.5;\n  background-color: var(--input-default-border-color);\n}\n.ff_variable_input_container .ff_content_editable.ff_invalid_input {\n  border: 1px solid var(--input-error-text-color);\n}\n.ff_variable_input_container .ff_suggestions {\n  border: 1px solid var(--input-default-border-color);\n  margin-top: 4px;\n  padding: 4px;\n  border-radius: 4px;\n  list-style-type: none;\n  background-color: var(--ff-select-background-color);\n  max-height: 150px;\n  overflow-y: auto;\n}\n.ff_variable_input_container .ff_suggestion_item {\n  padding: 4px;\n  cursor: pointer;\n}\n.ff_variable_input_container .ff_suggestion_item:hover {\n  background-color: var(--ff-select-background-color);\n}";
+styleInject(css_248z$g);
 
 const VariableInput = ({
   type = 'url',
@@ -21337,8 +21450,8 @@ const VariableInput = ({
   });
 };
 
-var css_248z$d = ".ff-all-project {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n}\n.ff-all-project .ff-all-project-dropdown {\n  background-color: var(--secondary-icon-color);\n  color: var(--expandable-menu-default-bg);\n  height: 24px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  gap: 10px;\n  padding: 4px;\n}\n.ff-all-project .ff-all-project-dropdown .label-icon {\n  height: 16px;\n  width: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n}\n.ff-all-project .ff-dropdown {\n  position: absolute;\n  top: 50px;\n  padding: 1px;\n  border: 0.5px solid var(--expandable-menu-default-bg);\n  border-radius: 4px;\n  background-color: var(--secondary-icon-color);\n  color: var(--primary-icon-color);\n}\n.ff-all-project .ff-dropdown .ff-search {\n  margin-bottom: 1px;\n}\n.ff-all-project .ff-dropdown .ff-search input {\n  height: 30px;\n  width: inherit;\n  border-radius: 4px;\n  border-style: none;\n}\n.ff-all-project .ff-dropdown .ff-search input::placeholder {\n  padding-left: 28px;\n  font-size: 8px;\n  line-height: 12px;\n}\n.ff-all-project .ff-dropdown .ff-search span {\n  position: absolute;\n  top: 15px;\n  left: 18px;\n}\n.ff-all-project .ff-dropdown .scroll {\n  max-height: 124px;\n  overflow-y: scroll;\n}\n.ff-all-project .ff-dropdown .option-card .projects-options {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  justify-content: flex-start;\n  gap: 4px;\n}\n.ff-all-project .ff-dropdown .option-card .projects-options .projects-icons {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  height: 24px;\n  width: 24px;\n}\n.ff-all-project .ff-dropdown .option-card .all-projects-option {\n  background-color: var(--primary-icon-color);\n  color: var(--secondary-icon-color);\n  border-radius: 4px;\n}";
-styleInject(css_248z$d);
+var css_248z$f = ".ff-all-project {\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n}\n.ff-all-project .ff-all-project-dropdown {\n  background-color: var(--secondary-icon-color);\n  color: var(--expandable-menu-default-bg);\n  height: 24px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  gap: 10px;\n  padding: 4px;\n}\n.ff-all-project .ff-all-project-dropdown .label-icon {\n  height: 16px;\n  width: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n}\n.ff-all-project .ff-dropdown {\n  position: absolute;\n  top: 50px;\n  padding: 1px;\n  border: 0.5px solid var(--expandable-menu-default-bg);\n  border-radius: 4px;\n  background-color: var(--secondary-icon-color);\n  color: var(--primary-icon-color);\n}\n.ff-all-project .ff-dropdown .ff-search {\n  margin-bottom: 1px;\n}\n.ff-all-project .ff-dropdown .ff-search input {\n  height: 30px;\n  width: inherit;\n  border-radius: 4px;\n  border-style: none;\n}\n.ff-all-project .ff-dropdown .ff-search input::placeholder {\n  padding-left: 28px;\n  font-size: 8px;\n  line-height: 12px;\n}\n.ff-all-project .ff-dropdown .ff-search span {\n  position: absolute;\n  top: 15px;\n  left: 18px;\n}\n.ff-all-project .ff-dropdown .scroll {\n  max-height: 124px;\n  overflow-y: scroll;\n}\n.ff-all-project .ff-dropdown .option-card .projects-options {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  justify-content: flex-start;\n  gap: 4px;\n}\n.ff-all-project .ff-dropdown .option-card .projects-options .projects-icons {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  align-content: center;\n  height: 24px;\n  width: 24px;\n}\n.ff-all-project .ff-dropdown .option-card .all-projects-option {\n  background-color: var(--primary-icon-color);\n  color: var(--secondary-icon-color);\n  border-radius: 4px;\n}";
+styleInject(css_248z$f);
 
 const AllProjectsDropdown = ({
   onClick = () => {},
@@ -21428,8 +21541,8 @@ const AllProjectsDropdown = ({
   });
 };
 
-var css_248z$c = ".ff-pie-chart-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  font-size: var(--fontSize);\n}\n.ff-pie-chart-container .ff-pie-chart-border {\n  display: inline-block;\n  border: 2px solid var(--pie-chart-border-color);\n  border-radius: 50%;\n}\n.ff-pie-chart-container .ff-pie-chart-tooltip {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -100%);\n  padding: 8px;\n  border-radius: 4px;\n  background-color: var(--tooltip-bg-color);\n  color: var(--primary-icon-color);\n  border: 10px solid;\n  font-size: 14px;\n  font-weight: 400;\n  pointer-events: none;\n  opacity: 0.8;\n}\n.ff-pie-chart-container .ff-pie-chart-legend {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 16px;\n}\n.ff-pie-chart-container .ff-pie-chart-legend .ff-pie-chart-legend-item {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  text-align: center;\n}";
-styleInject(css_248z$c);
+var css_248z$e = ".ff-pie-chart-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  font-size: var(--fontSize);\n}\n.ff-pie-chart-container .ff-pie-chart-border {\n  display: inline-block;\n  border: 2px solid var(--pie-chart-border-color);\n  border-radius: 50%;\n}\n.ff-pie-chart-container .ff-pie-chart-tooltip {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -100%);\n  padding: 8px;\n  border-radius: 4px;\n  background-color: var(--tooltip-bg-color);\n  color: var(--primary-icon-color);\n  border: 10px solid;\n  font-size: 14px;\n  font-weight: 400;\n  pointer-events: none;\n  opacity: 0.8;\n}\n.ff-pie-chart-container .ff-pie-chart-legend {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 16px;\n}\n.ff-pie-chart-container .ff-pie-chart-legend .ff-pie-chart-legend-item {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  text-align: center;\n}";
+styleInject(css_248z$e);
 
 const calculateArc$1 = ({
   x,
@@ -21584,8 +21697,8 @@ const PieChart = ({
   });
 };
 
-var css_248z$b = ".ff-app-header {\n  display: flex;\n  justify-content: space-between;\n  background-color: var(--brand-color);\n  padding-left: 8px;\n  border-top-left-radius: 8px;\n  border-top-right-radius: 8px;\n}\n.ff-app-header .ff-app-header-logo-icon {\n  padding: 8px;\n  height: 24px;\n}\n.ff-app-header .ff-app-header-nav-bar {\n  display: flex;\n  align-items: center;\n  background-color: var(--brand-color);\n  transform: translateY(12px);\n  border-radius: 20px;\n  padding: 5px;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items {\n  display: flex;\n  align-items: center;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item {\n  margin-left: 8px;\n  padding: 7px;\n  color: var(--ff-header-text-color);\n  cursor: pointer;\n  display: flex;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected {\n  padding: 3px 6px 3px 3px;\n  background-color: var(--primary-icon-color);\n  border-radius: 20px;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected .ff-app-header-nav-bar-item-label {\n  background-color: var(--brand-color);\n  border-radius: 20px;\n  padding: 4px 8px;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container {\n  display: flex;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item {\n  color: var(--ff-header-submenu-text-color);\n  align-content: center;\n  padding-left: 8px;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected {\n  color: var(--ff-header-submenu-highlight-text-color);\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container {\n  display: flex;\n  align-items: center;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-more-icon svg {\n  cursor: pointer;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-more-icon svg path {\n  fill: var(--primary-icon-color);\n}\n.ff-app-header .ff-app-header-right-content {\n  height: 24px;\n  padding: 8px;\n}";
-styleInject(css_248z$b);
+var css_248z$d = ".ff-app-header {\n  display: flex;\n  justify-content: space-between;\n  background-color: var(--brand-color);\n  padding-left: 8px;\n  border-top-left-radius: 8px;\n  border-top-right-radius: 8px;\n}\n.ff-app-header .ff-app-header-left-container {\n  display: flex;\n}\n.ff-app-header .ff-app-header-left-container .ff-app-header-logo-icon {\n  padding: 8px;\n  height: 24px;\n}\n.ff-app-header .ff-app-header-nav-bar {\n  display: flex;\n  align-items: center;\n  background-color: var(--brand-color);\n  transform: translateY(12px);\n  border-radius: 20px;\n  padding: 5px;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items {\n  display: flex;\n  align-items: center;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item {\n  margin-left: 8px;\n  padding: 7px;\n  color: var(--ff-header-text-color);\n  cursor: pointer;\n  display: flex;\n  position: relative;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item:not(.ff-app-header-nav-bar-item--selected):hover::after {\n  animation: oscillate-border-width 0.5s ease-in-out forwards;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item::after {\n  content: \"\";\n  position: absolute;\n  bottom: 0;\n  left: 25%;\n  width: 0%;\n  height: 2px;\n  background: var(--ff-app-header-menu-border-bottom-color);\n  border-radius: 4px;\n  transition: width 0.15s ease-in-out;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected {\n  padding: 3px 6px 3px 3px;\n  background-color: var(--primary-icon-color);\n  border-radius: 20px;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected .ff-app-header-nav-bar-item-label {\n  background-color: var(--brand-color);\n  border-radius: 20px;\n  padding: 4px 8px;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container {\n  display: flex;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item {\n  color: var(--ff-header-submenu-text-color);\n  align-content: center;\n  position: relative;\n  padding-left: 8px;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item:not(.ff-app-header-nav-bar-submenu-item--selected):hover::after {\n  animation: oscillate-border-width 0.5s ease-in-out forwards;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item::after {\n  content: \"\";\n  position: absolute;\n  bottom: 0;\n  left: 25%;\n  width: 0%;\n  height: 2px;\n  background: var(--ff-app-header-submenu-border-bottom-color);\n  border-radius: 4px;\n  transition: width 0.15s ease-in-out;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected {\n  color: var(--ff-header-submenu-highlight-text-color);\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected::after {\n  content: \"\";\n  position: absolute;\n  bottom: 0;\n  left: 10%;\n  width: 90%;\n  height: 2px;\n  border-radius: 4px;\n  box-shadow: 0px 1px 0.2px 0px rgba(0, 0, 0, 0.1607843137);\n  background: var(--ff-app-header-submenu-border-bottom-color);\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container {\n  display: flex;\n  align-items: center;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-more-icon svg {\n  cursor: pointer;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-more-icon svg path {\n  fill: var(--primary-icon-color);\n}\n.ff-app-header .ff-app-header-left-content,\n.ff-app-header .ff-app-header-right-content {\n  height: 24px;\n  padding: 8px;\n  align-content: center;\n}\n\n@keyframes oscillate-border-width {\n  0% {\n    width: 50%;\n    left: 25%;\n  }\n  50% {\n    width: 70%;\n    left: 15%;\n  }\n  100% {\n    width: 50%;\n    left: 25%;\n  }\n}";
+styleInject(css_248z$d);
 
 // import AllProjectsDropdown from '../AllProjectsDropdown';
 const AppHeader = ({
@@ -21604,17 +21717,20 @@ const AppHeader = ({
   return jsxRuntime.jsx(jsxRuntime.Fragment, {
     children: jsxRuntime.jsxs("div", {
       className: "ff-app-header",
-      children: [jsxRuntime.jsx("div", {
-        className: "ff-app-header-logo-icon",
-        children: jsxRuntime.jsx(Icon, {
-          color: "",
-          name: logoIconName,
-          height: 24,
-          width: 21
-        })
-      }), leftContent && jsxRuntime.jsx("div", {
-        className: "ff-app-header-left-content",
-        children: leftContent
+      children: [jsxRuntime.jsxs("div", {
+        className: 'ff-app-header-left-container',
+        children: [jsxRuntime.jsx("div", {
+          className: "ff-app-header-logo-icon",
+          children: jsxRuntime.jsx(Icon, {
+            color: "",
+            name: logoIconName,
+            height: 24,
+            width: 21
+          })
+        }), leftContent && jsxRuntime.jsx("div", {
+          className: "ff-app-header-left-content",
+          children: leftContent
+        })]
       }), jsxRuntime.jsxs("div", {
         className: "ff-app-header-nav-bar",
         children: [checkEmpty(projectsList) && jsxRuntime.jsx("div", {}), jsxRuntime.jsx("div", {
@@ -21681,8 +21797,8 @@ const AppHeader = ({
   });
 };
 
-var css_248z$a = ".ff_rounded_lg {\n  border-radius: 8px;\n}\n\n.ff_paper_basic_style {\n  padding: 20px;\n  background-color: var(--ff-paper-dark-background-color);\n}\n\n.ff_paper_default_style {\n  padding: 20px;\n  background-color: var(--ff-paper-background-color);\n}";
-styleInject(css_248z$a);
+var css_248z$c = ".ff_rounded_lg {\n  border-radius: 8px;\n}\n\n.ff_paper_basic_style {\n  padding: 20px;\n  background-color: var(--ff-paper-dark-background-color);\n}\n\n.ff_paper_default_style {\n  padding: 20px;\n  background-color: var(--ff-paper-background-color);\n}";
+styleInject(css_248z$c);
 
 const Paper = ({
   children,
@@ -21698,8 +21814,8 @@ const Paper = ({
   });
 };
 
-var css_248z$9 = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header, .ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(2) {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(1) {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-dashboard-donut-chart-section {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n.ff-dashboard-donut-chart-section-table-legend {\n  flex-direction: row;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container {\n  text-align: center;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(1) {\n  font-weight: 600;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(2) {\n  font-weight: 500;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container .ff-donut-chart-tooltip {\n  position: fixed;\n  padding: 5px;\n  border-radius: 4px;\n  pointer-events: none;\n  background-color: var(--tooltip-bg-color);\n  color: var(--tooltip-text-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container {\n  display: grid;\n  gap: 10px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.numberLegend {\n  grid-template-columns: repeat(3, 1fr);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.numberLegend .ff-legend-item {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.pillLegend {\n  grid-template-columns: repeat(2, 1fr);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.pillLegend .ff-legend-item {\n  display: flex;\n  align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.pillLegend .ff-legend-item .ff-legend-capsule {\n  background-color: var(--status-success-text-color);\n  color: var(--tooltip-text-color);\n  border-radius: 15px;\n  min-width: 25px;\n  height: 18px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.pillLegend .ff-legend-item .ff-legend-key {\n  margin-left: 8px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.memoryLegend {\n  grid-template-columns: repeat(2, 1fr);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.memoryLegend .ff-legend-item {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  width: 100%;\n  padding-right: 10px;\n  border-right: 1px solid var(--border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.memoryLegend .ff-legend-item:nth-child(2n) {\n  border-right: none;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table-wrapper {\n  overflow: hidden;\n  border: 1px solid var(--border-color);\n  border-radius: 4px;\n  margin-left: 1rem;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table {\n  width: 100%;\n  min-width: 300px;\n  border-collapse: collapse;\n  text-align: left;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header {\n  font-weight: bold;\n  background-color: var(--tabs-bg-color);\n  color: var(--input-hover-border-color);\n  padding: 0.5rem;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header:last-child {\n  text-align: right;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-capsule {\n  background-color: var(--status-success-text-color);\n  color: var(--tooltip-text-color);\n  border-radius: 1rem;\n  min-width: 22px;\n  height: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n  padding: 0.5rem;\n  color: var(--input-hover-border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name {\n  display: flex;\n  align-items: baseline;\n  gap: 5px;\n  color: var(--input-hover-border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n  text-align: right;\n}";
-styleInject(css_248z$9);
+var css_248z$b = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs, .ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header, .ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(2) {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(1) {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-dashboard-donut-chart-section {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n.ff-dashboard-donut-chart-section-table-legend {\n  flex-direction: row;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container {\n  text-align: center;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(1) {\n  font-weight: 600;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(2) {\n  font-weight: 500;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container .ff-donut-chart-tooltip {\n  position: fixed;\n  padding: 5px;\n  border-radius: 4px;\n  pointer-events: none;\n  background-color: var(--tooltip-bg-color);\n  color: var(--tooltip-text-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container {\n  display: grid;\n  gap: 10px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.numberLegend {\n  grid-template-columns: repeat(3, 1fr);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.numberLegend .ff-legend-item {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.pillLegend {\n  grid-template-columns: repeat(2, 1fr);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.pillLegend .ff-legend-item {\n  display: flex;\n  align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.pillLegend .ff-legend-item .ff-legend-capsule {\n  background-color: var(--status-success-text-color);\n  color: var(--tooltip-text-color);\n  border-radius: 15px;\n  min-width: 25px;\n  height: 18px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.pillLegend .ff-legend-item .ff-legend-key {\n  margin-left: 8px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.memoryLegend {\n  grid-template-columns: repeat(2, 1fr);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.memoryLegend .ff-legend-item {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  width: 100%;\n  padding-right: 10px;\n  border-right: 1px solid var(--border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.memoryLegend .ff-legend-item:nth-child(2n) {\n  border-right: none;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table-wrapper {\n  overflow: hidden;\n  border: 1px solid var(--border-color);\n  border-radius: 4px;\n  margin-left: 1rem;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table {\n  width: 100%;\n  min-width: 300px;\n  border-collapse: collapse;\n  text-align: left;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header {\n  font-weight: bold;\n  background-color: var(--tabs-bg-color);\n  color: var(--input-hover-border-color);\n  padding: 0.5rem;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header:last-child {\n  text-align: right;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-capsule {\n  background-color: var(--status-success-text-color);\n  color: var(--tooltip-text-color);\n  border-radius: 1rem;\n  min-width: 22px;\n  height: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n  padding: 0.5rem;\n  color: var(--input-hover-border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name {\n  display: flex;\n  align-items: baseline;\n  gap: 5px;\n  color: var(--input-hover-border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n  text-align: right;\n}";
+styleInject(css_248z$b);
 
 const calculateArc = (x, y, radius, startAngle, endAngle) => {
   const startX = x + radius * Math.cos(startAngle);
@@ -23992,8 +24108,8 @@ var RecaptchaWrapper = makeAsyncScript(getURL, {
   } : {}
 })(ReCAPTCHA);
 
-var css_248z$8 = ".ff-recaptcha-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.ff-recaptcha-wrapper .ff-recaptcha-error {\n  color: var(--input-error-text-color);\n  font-size: 12px;\n  margin-top: 4px;\n}";
-styleInject(css_248z$8);
+var css_248z$a = ".ff-recaptcha-wrapper {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n.ff-recaptcha-wrapper .ff-recaptcha-error {\n  color: var(--input-error-text-color);\n  font-size: 12px;\n  margin-top: 4px;\n}";
+styleInject(css_248z$a);
 
 const Recaptcha = /*#__PURE__*/React.forwardRef(({
   onVerify,
@@ -24036,8 +24152,8 @@ const nlpDropdownDefaultCSSData = {
   dropDownWrapperPadding: 0
 };
 
-var css_248z$7 = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper {\n  max-height: 160px;\n  z-index: 100;\n  position: absolute;\n  min-width: 100px;\n  border: 1px solid var(--ff-select-option-border-color);\n  box-sizing: border-box;\n  margin-top: 4px;\n  border-radius: 4px;\n  background-color: var(--ff-select-background-color);\n  box-shadow: 0px 1px 4px 0px var(--ff-select-option-wrapper-box-shadow);\n  overflow: hidden auto;\n  display: flex;\n  justify-content: space-between;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-options-wrapper1 {\n  max-height: 160px;\n  z-index: 100;\n  min-width: auto;\n  box-sizing: border-box;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper::-webkit-scrollbar {\n  width: 4px;\n  height: 12px;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper::-webkit-scrollbar-thumb {\n  background-color: var(--ff-select-scroll-thumb-color);\n  border-radius: 4px;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper::-webkit-scrollbar-track {\n  background-color: transparent;\n  border-radius: 4px;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-option {\n  width: calc(100% - 18px);\n  border: 1px solid transparent;\n  border-radius: 4px;\n  padding: 0px 8px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  cursor: pointer;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-option:hover {\n  border-color: var(--ff-select-background-color);\n  background-color: var(--ff-select-option-hover-color);\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-no-option {\n  width: calc(100% - 16px);\n  margin: 0;\n  overflow: hidden;\n  padding: 0px 8px;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  cursor: not-allowed;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-data {\n  width: 200px;\n  height: 134px;\n  border: 1px solid transparent;\n  border-radius: 5px;\n  box-shadow: 0px 1px 4px 0px var(--ff-select-option-wrapper-box-shadow);\n  overflow: scroll;\n}";
-styleInject(css_248z$7);
+var css_248z$9 = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper {\n  max-height: 160px;\n  z-index: 100;\n  position: absolute;\n  min-width: 100px;\n  border: 1px solid var(--ff-select-option-border-color);\n  box-sizing: border-box;\n  margin-top: 4px;\n  border-radius: 4px;\n  background-color: var(--ff-select-background-color);\n  box-shadow: 0px 1px 4px 0px var(--ff-select-option-wrapper-box-shadow);\n  overflow: hidden auto;\n  display: flex;\n  justify-content: space-between;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-options-wrapper1 {\n  max-height: 160px;\n  z-index: 100;\n  min-width: auto;\n  box-sizing: border-box;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper::-webkit-scrollbar {\n  width: 4px;\n  height: 12px;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper::-webkit-scrollbar-thumb {\n  background-color: var(--ff-select-scroll-thumb-color);\n  border-radius: 4px;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper::-webkit-scrollbar-track {\n  background-color: transparent;\n  border-radius: 4px;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-option {\n  width: calc(100% - 18px);\n  border: 1px solid transparent;\n  border-radius: 4px;\n  padding: 0px 8px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  cursor: pointer;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-option:hover {\n  border-color: var(--ff-select-background-color);\n  background-color: var(--ff-select-option-hover-color);\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-options-wrapper .ff-nlp-no-option {\n  width: calc(100% - 16px);\n  margin: 0;\n  overflow: hidden;\n  padding: 0px 8px;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  cursor: not-allowed;\n}\n.ff-nlp-dropdown-wrapper .ff-nlp-data {\n  width: 200px;\n  height: 134px;\n  border: 1px solid transparent;\n  border-radius: 5px;\n  box-shadow: 0px 1px 4px 0px var(--ff-select-option-wrapper-box-shadow);\n  overflow: scroll;\n}";
+styleInject(css_248z$9);
 
 const NlpDropdown = ({
   onSelectBlur,
@@ -24201,8 +24317,8 @@ const NlpDropdown = ({
   });
 };
 
-var css_248z$6 = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-nlp-input-wrapper .ff-nlp-input, .ff-nlp-input-wrapper .ff-nlp-input-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend, .ff-nlp-input-wrapper .ff-nlp-input-label--active {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-nlp-input-wrapper {\n  position: relative;\n}\n.ff-nlp-input-wrapper .ff-nlp-input {\n  margin: 0;\n  padding: 0;\n  box-sizing: border-box;\n  min-height: 32px;\n  min-width: 489px;\n  display: flex;\n  align-items: end;\n  position: relative;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset {\n  margin: 0;\n  padding: 25px 0px 0px 8px;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  height: 100%;\n  width: 100%;\n  border-radius: 4px;\n  display: block;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--border-radius {\n  border-radius: 0px 4px 4px 0px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--no-label {\n  padding: 30px 0px 0px 8px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--default {\n  opacity: 0;\n  border-color: var(--ff-nlp-input-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--active {\n  opacity: 1;\n  border-color: var(--ff-nlp-input-brand-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--option {\n  opacity: 1;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--no-border {\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--error {\n  border-color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend {\n  padding: 0 2px;\n  letter-spacing: 0.5px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--default {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 0;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--active {\n  transition: opacity 0.25s ease-out, transform 0.25s ease-out, font-size 0.25s ease-out, padding 0.25s ease-out;\n  opacity: 1;\n  color: var(--ff-nlp-input-brand-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--option {\n  opacity: 1;\n  color: var(--ff-nlp-input-default-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--error {\n  color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--required {\n  margin-right: 2px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input {\n  position: absolute;\n  top: 6px;\n  right: auto;\n  bottom: auto;\n  left: auto;\n  width: calc(100% - 38px);\n  min-height: calc(100% - 8px);\n  padding: 0 28px 0 8px;\n  border-radius: 4px;\n  border: 1px solid transparent;\n  z-index: 100;\n  background: transparent;\n  outline: none;\n  color: var(--ff-nlp-input-text-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input:hover ~ .ff-nlp-input-label {\n  color: var(--ff-nlp-input-text-hover-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--border-radius {\n  border-radius: 0px 4px 4px 0px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--default {\n  opacity: 1;\n  border-color: var(--ff-nlp-input-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--default:hover {\n  border-color: var(--ff-nlp-input-text-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--default:hover ~ .ff-nlp-input-fieldset--option {\n  border-color: var(--ff-nlp-input-text-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--default:hover ~ .ff-nlp-input-fieldset--option .ff-nlp-input-legend--option {\n  color: var(--ff-nlp-input-text-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--no-label {\n  min-height: calc(100% - 2px);\n  margin-top: 0px;\n  top: 0px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--active {\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--active:hover {\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--no-border {\n  border: none;\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--no-border:hover {\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--no-border:hover ~ .ff-nlp-input-fieldset--no-border {\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--disable {\n  border-color: var(--ff-nlp-input-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--disable:hover {\n  border-color: var(--ff-nlp-input-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--disable:hover ~ .ff-nlp-input-label--default {\n  color: var(--ff-nlp-input-default-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--error {\n  border-color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--error:hover {\n  border-color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label {\n  position: absolute;\n  top: 13px;\n  right: auto;\n  bottom: auto;\n  left: 8px;\n  z-index: 1;\n  font-size: 12px;\n  top: 60%;\n  padding-left: 8px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label--default {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 1;\n  color: var(--ff-nlp-input-default-color);\n  transform: translateY(-50%);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label--active {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 0;\n  transform: translateY(-150%);\n  padding: 0 6px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label--required {\n  margin-right: 2px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-arrow {\n  position: absolute;\n  top: 60%;\n  height: 100%;\n  right: 10px;\n  transform: rotateX(180deg) translateY(50%);\n  cursor: pointer;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-arrow--no-label {\n  top: 50%;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-arrow--down {\n  transform: rotateX(0deg) translateY(-50%);\n  z-index: 101;\n}\n.ff-nlp-input-wrapper-error-text {\n  position: absolute;\n  top: auto;\n  right: auto;\n  bottom: -14px;\n  left: 12px;\n  white-space: nowrap;\n}";
-styleInject(css_248z$6);
+var css_248z$8 = "@font-face {\n  font-family: \"Poppins\";\n  font-weight: 400;\n  src: local(\"Poppins-Regular\"), url(../../fonts/Poppins/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 500;\n  src: local(\"Poppins-Medium\"), url(../../fonts/Poppins/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 600;\n  src: local(\"Poppins-SemiBold\"), url(../../fonts/Poppins/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n  font-family: \"Poppins\";\n  font-weight: 700;\n  src: local(\"Poppins-Bold\"), url(../../fonts/Poppins/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 10px;\n}\n\n.fontSm, .ff-nlp-input-wrapper .ff-nlp-input, .ff-nlp-input-wrapper .ff-nlp-input-input {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n}\n\n.fontMd {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 14px;\n}\n\n.fontLg {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 16px;\n}\n\n.fontXL {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 18px;\n}\n\n.font2Xl {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 24px;\n}\n\n.font-size-8, .ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend, .ff-nlp-input-wrapper .ff-nlp-input-label--active {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 8px;\n}\n\n.font-size-32 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 32px;\n}\n\n.font-size-80 {\n  font-family: \"Poppins\", sans-serif;\n  font-size: 80px;\n}\n\n.ff-nlp-input-wrapper {\n  position: relative;\n}\n.ff-nlp-input-wrapper .ff-nlp-input {\n  margin: 0;\n  padding: 0;\n  box-sizing: border-box;\n  min-height: 32px;\n  min-width: 489px;\n  display: flex;\n  align-items: end;\n  position: relative;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset {\n  margin: 0;\n  padding: 25px 0px 0px 8px;\n  border: 1px solid transparent;\n  box-sizing: border-box;\n  height: 100%;\n  width: 100%;\n  border-radius: 4px;\n  display: block;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--border-radius {\n  border-radius: 0px 4px 4px 0px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--no-label {\n  padding: 30px 0px 0px 8px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--default {\n  opacity: 0;\n  border-color: var(--ff-nlp-input-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--active {\n  opacity: 1;\n  border-color: var(--ff-nlp-input-brand-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--option {\n  opacity: 1;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--no-border {\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset--error {\n  border-color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend {\n  padding: 0 2px;\n  letter-spacing: 0.5px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--default {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 0;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--active {\n  transition: opacity 0.25s ease-out, transform 0.25s ease-out, font-size 0.25s ease-out, padding 0.25s ease-out;\n  opacity: 1;\n  color: var(--ff-nlp-input-brand-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--option {\n  opacity: 1;\n  color: var(--ff-nlp-input-default-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--error {\n  color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-fieldset .ff-nlp-input-legend--required {\n  margin-right: 2px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input {\n  position: absolute;\n  top: 6px;\n  right: auto;\n  bottom: auto;\n  left: auto;\n  width: calc(100% - 38px);\n  min-height: calc(100% - 8px);\n  padding: 0 28px 0 8px;\n  border-radius: 4px;\n  border: 1px solid transparent;\n  z-index: 100;\n  background: transparent;\n  outline: none;\n  color: var(--ff-nlp-input-text-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input:hover ~ .ff-nlp-input-label {\n  color: var(--ff-nlp-input-text-hover-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--border-radius {\n  border-radius: 0px 4px 4px 0px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--default {\n  opacity: 1;\n  border-color: var(--ff-nlp-input-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--default:hover {\n  border-color: var(--ff-nlp-input-text-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--default:hover ~ .ff-nlp-input-fieldset--option {\n  border-color: var(--ff-nlp-input-text-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--default:hover ~ .ff-nlp-input-fieldset--option .ff-nlp-input-legend--option {\n  color: var(--ff-nlp-input-text-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--no-label {\n  min-height: calc(100% - 2px);\n  margin-top: 0px;\n  top: 0px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--active {\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--active:hover {\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--no-border {\n  border: none;\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--no-border:hover {\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--no-border:hover ~ .ff-nlp-input-fieldset--no-border {\n  border-color: transparent;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--disable {\n  border-color: var(--ff-nlp-input-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--disable:hover {\n  border-color: var(--ff-nlp-input-border-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--disable:hover ~ .ff-nlp-input-label--default {\n  color: var(--ff-nlp-input-default-color);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--error {\n  border-color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-input--error:hover {\n  border-color: var(--error-light);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label {\n  position: absolute;\n  top: 13px;\n  right: auto;\n  bottom: auto;\n  left: 8px;\n  z-index: 1;\n  font-size: 12px;\n  top: 60%;\n  padding-left: 8px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label--default {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 1;\n  color: var(--ff-nlp-input-default-color);\n  transform: translateY(-50%);\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label--active {\n  transition: opacity 0.3s ease-out, transform 0.3s ease-out, font-size 0.3s ease-out, padding 0.3s ease-out;\n  opacity: 0;\n  transform: translateY(-150%);\n  padding: 0 6px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-label--required {\n  margin-right: 2px;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-arrow {\n  position: absolute;\n  top: 60%;\n  height: 100%;\n  right: 10px;\n  transform: rotateX(180deg) translateY(50%);\n  cursor: pointer;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-arrow--no-label {\n  top: 50%;\n}\n.ff-nlp-input-wrapper .ff-nlp-input-arrow--down {\n  transform: rotateX(0deg) translateY(-50%);\n  z-index: 101;\n}\n.ff-nlp-input-wrapper-error-text {\n  position: absolute;\n  top: auto;\n  right: auto;\n  bottom: -14px;\n  left: 12px;\n  white-space: nowrap;\n}";
+styleInject(css_248z$8);
 
 const nlpInputReducer = (state, action) => {
   switch (action.type) {
@@ -24513,8 +24629,59 @@ const NlpInput = ({
   });
 };
 
-var css_248z$5 = ".ff-machine-input-field-wrapper {\n  min-width: 100px;\n  height: 32px;\n  position: relative;\n  cursor: pointer;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse {\n  height: 100%;\n  width: 100%;\n  border: 1px solid var(--ff-machine-input-field-border-color);\n  border-radius: 4px;\n  display: flex;\n  align-items: center;\n  justify-content: space-around;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse {\n  display: flex;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse .ff-machine-icon {\n  margin-right: 8px;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse {\n  flex-direction: row-reverse;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse {\n  flex-direction: row-reverse;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-label {\n  position: absolute;\n  top: -6px;\n  left: 8px;\n  background-color: var(--ff-machine-input-field-border-color);\n  border-radius: 4px;\n  padding: 1px 2px;\n  height: 10px;\n}";
-styleInject(css_248z$5);
+var css_248z$7 = ".ff-icon-radio-group {\n  width: 237px;\n  height: 24px;\n  display: flex;\n  align-items: center;\n  gap: 47px;\n  position: relative;\n}\n\n.ff-icon-radio-button {\n  width: 24px;\n  height: 24px;\n  border-radius: 4px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  position: relative;\n}\n.ff-icon-radio-button.selected {\n  background-color: var(--brand-color);\n}\n.ff-icon-radio-button.disabled {\n  opacity: 50%;\n  cursor: not-allowed;\n}\n.ff-icon-radio-button .icon-container {\n  width: 24px;\n  height: 24px;\n  border-radius: 4px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border: 1px solid var(--border-color);\n  background: var(--drawer-footer-bg);\n}\n.ff-icon-radio-button .icon-container.selected {\n  background-color: var(--brand-color);\n}\n.ff-icon-radio-button .icon-container .icon {\n  width: 14px;\n  height: 14px;\n}\n\n.line-connector {\n  position: absolute;\n  top: 50%;\n  left: 0;\n  right: 0;\n  height: 1px;\n  background-color: var(--border-color);\n  z-index: -1;\n  border-radius: 2px 0px 0px 0px;\n  opacity: 0px;\n}";
+styleInject(css_248z$7);
+
+const IconRadioGroup = ({
+  items,
+  onButtonClick,
+  selectedValue: initialSelectedValue = null,
+  onChange,
+  className = ''
+}) => {
+  const [selectedValue, setSelectedValue] = React.useState(initialSelectedValue);
+  React.useEffect(() => {
+    if (initialSelectedValue !== selectedValue) {
+      setSelectedValue(initialSelectedValue);
+    }
+  }, [initialSelectedValue, selectedValue]);
+  const handleButtonClick = item => {
+    if (item.disabled) return;
+    const newSelectedValue = item.iconName;
+    setSelectedValue(newSelectedValue);
+    if (onChange) {
+      onChange(newSelectedValue);
+    }
+    onButtonClick(item);
+  };
+  return jsxRuntime.jsxs("div", {
+    className: classNames('ff-icon-radio-group', className),
+    children: [items.map(item => jsxRuntime.jsx("div", {
+      className: classNames('ff-icon-radio-button', {
+        selected: selectedValue === item.iconName,
+        disabled: item.disabled
+      }),
+      onClick: () => handleButtonClick(item),
+      children: jsxRuntime.jsx("div", {
+        className: classNames('icon-container', {
+          selected: selectedValue === item.iconName
+        }),
+        children: jsxRuntime.jsx(Icon, {
+          name: item.iconName,
+          height: 14,
+          width: 14,
+          hoverEffect: false,
+          color: selectedValue === item.iconName ? 'var(--drawer-footer-bg)' : 'var(--brand-color)'
+        })
+      })
+    }, item.iconName)), jsxRuntime.jsx("div", {
+      className: "line-connector"
+    })]
+  });
+};
+
+var css_248z$6 = ".ff-machine-input-field-wrapper {\n  min-width: 100px;\n  height: 32px;\n  position: relative;\n  cursor: pointer;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse {\n  height: 100%;\n  width: 100%;\n  border: 1px solid var(--ff-machine-input-field-border-color);\n  border-radius: 4px;\n  display: flex;\n  align-items: center;\n  justify-content: space-around;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse {\n  display: flex;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse .ff-machine-icon {\n  margin-right: 8px;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse {\n  flex-direction: row-reverse;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse {\n  flex-direction: row-reverse;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-label {\n  position: absolute;\n  top: -6px;\n  left: 8px;\n  background-color: var(--ff-machine-input-field-border-color);\n  border-radius: 4px;\n  padding: 1px 2px;\n  height: 10px;\n}";
+styleInject(css_248z$6);
 
 const MachineInputField = /*#__PURE__*/React.forwardRef(({
   width = '',
@@ -24567,11 +24734,11 @@ const MachineInputField = /*#__PURE__*/React.forwardRef(({
 });
 MachineInputField.displayName = 'MachineInputField';
 
-var css_248z$4 = ".ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper {\n  height: 66px;\n  box-sizing: border-box;\n  width: fit-content;\n  margin-bottom: 16px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper {\n  position: relative;\n  display: flex;\n  box-sizing: border-box;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-sequential-select-branch {\n  width: 240px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-branch-arrow-wrapper {\n  width: 40px;\n  border-top: 1px solid var(--ff-connecting-branch-color);\n  margin-top: 4px;\n  position: relative;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-branch-arrow-wrapper .ff-branch-arrow {\n  width: 6px;\n  height: 6px;\n  background-color: var(--ff-connecting-branch-color);\n  clip-path: polygon(100% 50%, 0 100%, 0 0);\n  position: absolute;\n  right: -1px;\n  top: -3px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-select-branch-point {\n  width: 5px;\n  height: 5px;\n  border-radius: 50%;\n  background-color: var(--ff-connecting-branch-color);\n  position: absolute;\n  left: -3px;\n  z-index: 102;\n  top: 50%;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .branch-button {\n  margin-top: 4px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down {\n  position: absolute;\n  height: 38px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down .ff-select-branch-point {\n  position: absolute;\n  height: 5px;\n  width: 5px;\n  background-color: var(--ff-connecting-branch-color);\n  border-radius: 50%;\n  top: 50%;\n  left: -2px;\n  z-index: 102;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down .ff-select-branch-arrow {\n  width: 0px;\n  height: 62px;\n  top: calc(50% + 1px);\n  border-left: 1px solid var(--ff-connecting-branch-color);\n  z-index: 102;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist {\n  box-sizing: border-box;\n  width: 240px;\n  margin-top: 4px;\n  padding: 0px 4px;\n  display: flex;\n  justify-content: space-between;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-scope-wrapper {\n  display: flex;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-scope-wrapper .ff-scope-text {\n  margin-left: 4px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper {\n  display: flex;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-dataset-icon,\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-run-delete-icon,\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-datalist-text {\n  cursor: pointer;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-datalist-text {\n  margin: 0px 12px 0px 4px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-sequential-branches-wrapper {\n  box-sizing: border-box;\n  width: fit-content;\n  height: fit-content;\n}";
-styleInject(css_248z$4);
+var css_248z$5 = ".ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper {\n  height: 66px;\n  box-sizing: border-box;\n  width: fit-content;\n  margin-bottom: 16px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper {\n  position: relative;\n  display: flex;\n  box-sizing: border-box;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-sequential-select-branch {\n  width: 240px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-branch-arrow-wrapper {\n  width: 40px;\n  border-top: 1px solid var(--ff-connecting-branch-color);\n  margin-top: 4px;\n  position: relative;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-branch-arrow-wrapper .ff-branch-arrow {\n  width: 6px;\n  height: 6px;\n  background-color: var(--ff-connecting-branch-color);\n  clip-path: polygon(100% 50%, 0 100%, 0 0);\n  position: absolute;\n  right: -1px;\n  top: -3px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-select-branch-point {\n  width: 5px;\n  height: 5px;\n  border-radius: 50%;\n  background-color: var(--ff-connecting-branch-color);\n  position: absolute;\n  left: -3px;\n  z-index: 102;\n  top: 50%;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .branch-button {\n  margin-top: 4px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down {\n  position: absolute;\n  height: 38px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down .ff-select-branch-point {\n  position: absolute;\n  height: 5px;\n  width: 5px;\n  background-color: var(--ff-connecting-branch-color);\n  border-radius: 50%;\n  top: 50%;\n  left: -2px;\n  z-index: 102;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down .ff-select-branch-arrow {\n  width: 0px;\n  height: 62px;\n  top: calc(50% + 1px);\n  border-left: 1px solid var(--ff-connecting-branch-color);\n  z-index: 102;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist {\n  box-sizing: border-box;\n  width: 240px;\n  margin-top: 4px;\n  padding: 0px 4px;\n  display: flex;\n  justify-content: space-between;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-scope-wrapper {\n  display: flex;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-scope-wrapper .ff-scope-text {\n  margin-left: 4px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper {\n  display: flex;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-dataset-icon,\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-run-delete-icon,\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-datalist-text {\n  cursor: pointer;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-datalist-text {\n  margin: 0px 12px 0px 4px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-sequential-branches-wrapper {\n  box-sizing: border-box;\n  width: fit-content;\n  height: fit-content;\n}";
+styleInject(css_248z$5);
 
-var css_248z$3 = ".ff-connecting-branch-grid,\n.ff-connecting-branch-grid-reverse {\n  box-sizing: border-box;\n  display: grid;\n  grid-template-columns: 24px 180px 40px 180px 24px;\n  height: 66px;\n  margin-bottom: 16px;\n  position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper {\n  position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow {\n  position: absolute;\n  height: 7px;\n  width: 7px;\n  background-color: var(--ff-connecting-branch-color);\n  z-index: 2;\n  clip-path: polygon(0 0, 0% 100%, 100% 50%);\n  top: calc(25% - 3px);\n  right: -2px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow-reverse {\n  position: absolute;\n  height: 7px;\n  width: 7px;\n  background-color: var(--ff-connecting-branch-color);\n  z-index: 2;\n  left: -2px;\n  top: calc(25% - 3px);\n  clip-path: polygon(0 50%, 100% 100%, 100% 0);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-container,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-container {\n  width: 100%;\n  height: 25%;\n  border: 1px solid var(--ff-connecting-branch-color);\n  border-top: none;\n  border-right: none;\n  border-bottom-left-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-container-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-container-reverse {\n  width: 100%;\n  height: 25%;\n  border: 1px solid var(--ff-connecting-branch-color);\n  border-top: none;\n  border-left: none;\n  border-bottom-right-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist {\n  display: flex;\n  padding-top: 4px;\n  height: 24px;\n  justify-content: flex-end;\n  width: 100%;\n  align-items: center;\n  flex-direction: row;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-icon {\n  margin-right: 4px;\n  cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-text,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-text {\n  margin-right: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-delete-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-delete-icon {\n  cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse {\n  display: flex;\n  padding-top: 4px;\n  height: 24px;\n  justify-content: flex-end;\n  width: 100%;\n  align-items: center;\n  flex-direction: row-reverse;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-icon {\n  margin-right: 4px;\n  cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-text,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-text {\n  margin-right: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-delete-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-delete-icon {\n  cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper {\n  position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point {\n  position: absolute;\n  height: 5px;\n  width: 5px;\n  background-color: var(--ff-connecting-branch-color);\n  border-radius: 50%;\n  z-index: 2;\n  right: -4px;\n  top: calc(50% - 1px);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point-reverse {\n  position: absolute;\n  height: 5px;\n  width: 5px;\n  background-color: var(--ff-connecting-branch-color);\n  border-radius: 50%;\n  z-index: 2;\n  left: -4px;\n  top: calc(50% - 1px);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow {\n  height: 0px;\n  width: 100%;\n  margin-top: calc(50% - 3px);\n  position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow {\n  position: absolute;\n  height: 7px;\n  width: 7px;\n  background-color: var(--ff-connecting-branch-color);\n  clip-path: polygon(0 0, 0% 100%, 100% 50%);\n  top: calc(25% - 4px);\n  right: -1px;\n  z-index: 2;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow-reverse {\n  position: absolute;\n  height: 7px;\n  width: 7px;\n  background-color: var(--ff-connecting-branch-color);\n  clip-path: polygon(0 50%, 100% 100%, 100% 0);\n  top: calc(25% - 4px);\n  left: -1px;\n  z-index: 2;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-end-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-end-arrow {\n  width: 100%;\n  height: 100%;\n  margin-top: 17px;\n  border-top: 1px solid var(--ff-connecting-branch-color);\n  border-right: 1px solid var(--ff-connecting-branch-color);\n  border-top-right-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-end-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-end-arrow-reverse {\n  width: 100%;\n  height: 100%;\n  margin-top: 17px;\n  border-top: 1px solid var(--ff-connecting-branch-color);\n  border-left: 1px solid var(--ff-connecting-branch-color);\n  border-top-left-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-browser-button,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-browser-button {\n  height: 32px;\n  display: flex;\n  align-items: center;\n}\n\n.ff-connecting-branch-grid-reverse {\n  direction: rtl;\n  margin-left: 1px;\n}";
-styleInject(css_248z$3);
+var css_248z$4 = ".ff-connecting-branch-grid,\n.ff-connecting-branch-grid-reverse {\n  box-sizing: border-box;\n  display: grid;\n  grid-template-columns: 24px 180px 40px 180px 24px;\n  height: 66px;\n  margin-bottom: 16px;\n  position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper {\n  position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow {\n  position: absolute;\n  height: 6px;\n  width: 6px;\n  background-color: var(--ff-connecting-branch-color);\n  z-index: 2;\n  clip-path: polygon(0 0, 0% 100%, 100% 50%);\n  top: calc(25% - 3px);\n  right: -2px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow-reverse {\n  position: absolute;\n  height: 6px;\n  width: 6px;\n  background-color: var(--ff-connecting-branch-color);\n  z-index: 2;\n  left: -2px;\n  top: calc(25% - 3px);\n  clip-path: polygon(0 50%, 100% 100%, 100% 0);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-container,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-container {\n  width: 100%;\n  height: 25%;\n  border: 1px solid var(--ff-connecting-branch-color);\n  border-top: none;\n  border-right: none;\n  border-bottom-left-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-container-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-container-reverse {\n  width: 100%;\n  height: 25%;\n  border: 1px solid var(--ff-connecting-branch-color);\n  border-top: none;\n  border-left: none;\n  border-bottom-right-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist {\n  display: flex;\n  padding-top: 4px;\n  height: 24px;\n  justify-content: flex-end;\n  width: 100%;\n  align-items: center;\n  flex-direction: row;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-icon {\n  margin-right: 4px;\n  cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-text,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-text {\n  margin-right: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-delete-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-delete-icon {\n  cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse {\n  display: flex;\n  padding-top: 4px;\n  height: 24px;\n  justify-content: flex-end;\n  width: 100%;\n  align-items: center;\n  flex-direction: row-reverse;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-icon {\n  margin-right: 4px;\n  cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-text,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-text {\n  margin-right: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-delete-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-delete-icon {\n  cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper {\n  position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point {\n  position: absolute;\n  height: 5px;\n  width: 5px;\n  background-color: var(--ff-connecting-branch-color);\n  border-radius: 50%;\n  z-index: 2;\n  right: -2px;\n  top: calc(50% - 1px);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point-reverse {\n  position: absolute;\n  height: 5px;\n  width: 5px;\n  background-color: var(--ff-connecting-branch-color);\n  border-radius: 50%;\n  z-index: 2;\n  left: -4px;\n  top: calc(50% - 1px);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow {\n  height: 0px;\n  width: 100%;\n  margin-top: calc(50% - 3px);\n  position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow {\n  position: absolute;\n  height: 5px;\n  width: 5px;\n  background-color: var(--ff-connecting-branch-color);\n  clip-path: polygon(0 0, 0% 100%, 100% 50%);\n  top: calc(25% - 4px);\n  right: -1px;\n  z-index: 2;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow-reverse {\n  position: absolute;\n  height: 5px;\n  width: 5px;\n  background-color: var(--ff-connecting-branch-color);\n  clip-path: polygon(0 50%, 100% 100%, 100% 0);\n  top: calc(25% - 4px);\n  left: -1px;\n  z-index: 2;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-end-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-end-arrow {\n  width: 100%;\n  height: 100%;\n  margin-top: 17px;\n  border-top: 1px solid var(--ff-connecting-branch-color);\n  border-right: 1px solid var(--ff-connecting-branch-color);\n  border-top-right-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-end-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-end-arrow-reverse {\n  width: 100%;\n  height: 100%;\n  margin-top: 17px;\n  border-top: 1px solid var(--ff-connecting-branch-color);\n  border-left: 1px solid var(--ff-connecting-branch-color);\n  border-top-left-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-browser-button,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-browser-button {\n  height: 32px;\n  display: flex;\n  align-items: center;\n}\n\n.ff-connecting-branch-grid-reverse {\n  direction: rtl;\n  margin: 0px 0px 16px 0px;\n}";
+styleInject(css_248z$4);
 
 const Branches = ({
   machineInstances,
@@ -24644,7 +24811,7 @@ const Branches = ({
                 'ff-connecting-branch-point-reverse': !evenRow
               })
             }), jsxRuntime.jsx(MachineInputField, {
-              width: "180px",
+              width: `${machineColumnWidth}px`,
               runCount: runCount,
               options: [{
                 label: executionEnv,
@@ -24718,8 +24885,8 @@ const Branches = ({
   });
 };
 
-var css_248z$2 = ".ff-connecting-branch-grid-wrapper {\n  box-sizing: border-box;\n}";
-styleInject(css_248z$2);
+var css_248z$3 = ".ff-connecting-branch-grid-wrapper {\n  box-sizing: border-box;\n}";
+styleInject(css_248z$3);
 
 const ConnectingBranches = ({
   machineBranchInstances,
@@ -24759,8 +24926,8 @@ const ConnectingBranches = ({
   });
 };
 
-var css_248z$1 = ".ff-datalist-modal-header-wrapper,\n.ff-datalist-modal-child-wrapper,\n.ff-datalist-modal-footer-wrapper {\n  margin: 0 8px;\n}\n\n.ff-datalist-modal-header-wrapper {\n  width: 255px;\n  border-bottom: 1px solid var(--ff-connecting-branch-modal-border);\n  display: flex;\n  align-items: center;\n}\n\n.ff-datalist-modal-child-wrapper .variable {\n  margin: 8px 0;\n}\n\n.ff-datalist-modal-footer-wrapper {\n  display: flex;\n  justify-content: space-between;\n  border-top: 1px solid var(--ff-connecting-branch-modal-border);\n}\n.ff-datalist-modal-footer-wrapper .datalist-button-wrapper {\n  display: flex;\n  gap: 10px;\n  margin-top: 4px;\n  justify-content: flex-end;\n}";
-styleInject(css_248z$1);
+var css_248z$2 = ".ff-datalist-modal-header-wrapper,\n.ff-datalist-modal-child-wrapper,\n.ff-datalist-modal-footer-wrapper {\n  margin: 0 8px;\n}\n\n.ff-datalist-modal-header-wrapper {\n  width: 255px;\n  border-bottom: 1px solid var(--ff-connecting-branch-modal-border);\n  display: flex;\n  align-items: center;\n}\n\n.ff-datalist-modal-child-wrapper .variable {\n  margin: 8px 0;\n}\n\n.ff-datalist-modal-footer-wrapper {\n  display: flex;\n  justify-content: space-between;\n  border-top: 1px solid var(--ff-connecting-branch-modal-border);\n}\n.ff-datalist-modal-footer-wrapper .datalist-button-wrapper {\n  display: flex;\n  gap: 10px;\n  margin-top: 4px;\n  justify-content: flex-end;\n}";
+styleInject(css_248z$2);
 
 const DatasetListModal = /*#__PURE__*/React.forwardRef((props, ref) => {
   const selectOptions = [{
@@ -24837,8 +25004,8 @@ const DatasetListModal = /*#__PURE__*/React.forwardRef((props, ref) => {
   });
 });
 
-var css_248z = ".ff-connecting-datalist-modal-header-wrapper,\n.ff-connecting-modal-child-wrapper {\n  width: 534px;\n  padding: 0 4px;\n}\n\n.ff-connecting-datalist-modal-header-wrapper {\n  border-bottom: 1px solid var(--ff-connecting-branch-modal-border);\n  margin-bottom: 4px;\n}\n\n.ff-connecting-modal-child-wrapper .ff-branch-select-input-wrapper {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n.ff-connecting-modal-child-wrapper .ff-branch-select-input-wrapper .ff-select-browser {\n  width: 263px;\n}\n.ff-connecting-modal-child-wrapper .ff-branch-select-input-wrapper .ff-branch-input-wrapper {\n  display: flex;\n  align-items: flex-end;\n  height: 38px;\n}\n.ff-connecting-modal-child-wrapper .ff-branch-select-input-wrapper .ff-branch-input-wrapper .ff-input-browser {\n  width: 245px;\n}\n\n.ff-connecting-modal-footer-wrapper {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 0 8px;\n  margin-top: 8px;\n  border-top: 1px solid var(--ff-connecting-branch-modal-border);\n}\n.ff-connecting-modal-footer-wrapper .ff-branch-toggle-wrapper,\n.ff-connecting-modal-footer-wrapper .ff-datalist-button-wrapper {\n  display: flex;\n  gap: 8px;\n}\n.ff-connecting-modal-footer-wrapper .ff-branch-toggle-wrapper {\n  gap: 4px;\n}";
-styleInject(css_248z);
+var css_248z$1 = ".ff-connecting-datalist-modal-header-wrapper,\n.ff-connecting-modal-child-wrapper {\n  width: 534px;\n  padding: 0 4px;\n}\n\n.ff-connecting-datalist-modal-header-wrapper {\n  border-bottom: 1px solid var(--ff-connecting-branch-modal-border);\n  margin-bottom: 4px;\n}\n\n.ff-connecting-modal-child-wrapper .ff-branch-select-input-wrapper {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n.ff-connecting-modal-child-wrapper .ff-branch-select-input-wrapper .ff-select-browser {\n  width: 263px;\n}\n.ff-connecting-modal-child-wrapper .ff-branch-select-input-wrapper .ff-branch-input-wrapper {\n  display: flex;\n  align-items: flex-end;\n  height: 38px;\n}\n.ff-connecting-modal-child-wrapper .ff-branch-select-input-wrapper .ff-branch-input-wrapper .ff-input-browser {\n  width: 245px;\n}\n\n.ff-connecting-modal-footer-wrapper {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 0 8px;\n  margin-top: 8px;\n  border-top: 1px solid var(--ff-connecting-branch-modal-border);\n}\n.ff-connecting-modal-footer-wrapper .ff-branch-toggle-wrapper,\n.ff-connecting-modal-footer-wrapper .ff-datalist-button-wrapper {\n  display: flex;\n  gap: 8px;\n}\n.ff-connecting-modal-footer-wrapper .ff-branch-toggle-wrapper {\n  gap: 4px;\n}";
+styleInject(css_248z$1);
 
 const AddBrowserModal = /*#__PURE__*/React.forwardRef((props, ref) => {
   // TODO: WILL BE REMOVE IN THE FUTURE
@@ -25101,6 +25268,96 @@ const SequentialConnectingBranch = ({
   });
 };
 
+var css_248z = ".ff-input-field {\n  display: none;\n}\n\n.ff-attachment-files {\n  padding: 9px;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}";
+styleInject(css_248z);
+
+const AttachmentButton = ({
+  label,
+  selectedFiles,
+  onFilesChange,
+  disabled = false,
+  maxFileSizeMB = 5,
+  // Default to 5 MB if not provided
+  maxFiles = 10 // Default to 10 files if not provided
+}) => {
+  const fileInputRef = React.useRef(null);
+  const [fileError, setFileError] = React.useState('');
+  const maxFileSizeBytes = maxFileSizeMB * 1024 * 1024;
+  const handleAttachmentClick = () => {
+    fileInputRef.current?.click();
+  };
+  const handleFileChange = () => {
+    setFileError('');
+    if (fileInputRef.current?.files) {
+      const files = Array.from(fileInputRef.current.files);
+      const duplicateFiles = files.filter(file => selectedFiles.some(selectedFile => selectedFile.name === file.name));
+      if (duplicateFiles.length > 0) {
+        setFileError('This file is already selected.');
+        fileInputRef.current.value = '';
+        return;
+      }
+      if (selectedFiles.length + files.length > maxFiles) {
+        setFileError(`You can only select up to ${maxFiles} files.`);
+        fileInputRef.current.value = '';
+        return;
+      }
+      const oversizedFiles = files.filter(file => file.size > maxFileSizeBytes);
+      if (oversizedFiles.length > 0) {
+        setFileError(`Each file must be less than ${maxFileSizeMB} MB.`);
+        fileInputRef.current.value = '';
+        return;
+      }
+      onFilesChange([...selectedFiles, ...files]);
+      fileInputRef.current.value = '';
+    }
+  };
+  const handleDeleteFile = index => {
+    const updatedFiles = [...selectedFiles];
+    updatedFiles.splice(index, 1);
+    onFilesChange(updatedFiles);
+  };
+  return jsxRuntime.jsxs("div", {
+    children: [jsxRuntime.jsx(Typography, {
+      fontWeight: "semi-bold",
+      children: label
+    }), selectedFiles.length === 0 && jsxRuntime.jsx(Button$1, {
+      variant: "primary",
+      label: "Select Files",
+      size: "medium",
+      onClick: handleAttachmentClick,
+      disabled: disabled
+    }), jsxRuntime.jsx("input", {
+      type: "file",
+      ref: fileInputRef,
+      className: "ff-input-field",
+      onChange: handleFileChange,
+      multiple: true,
+      accept: "*"
+    }), fileError && jsxRuntime.jsx(Toaster, {
+      isOpen: !!fileError,
+      variant: "info",
+      toastTitle: "Error",
+      toastMessage: fileError,
+      zIndex: 10000000
+    }), selectedFiles.map((file, index) => jsxRuntime.jsxs("div", {
+      className: "ff-attachment-files",
+      children: [jsxRuntime.jsx(Typography, {
+        color: "var(--brand-color)",
+        children: file.name
+      }), jsxRuntime.jsx(Icon, {
+        name: "delete",
+        color: "var(--ff-delete-button-attachment)",
+        onClick: () => handleDeleteFile(index)
+      }), index === selectedFiles.length - 1 && selectedFiles.length < maxFiles && jsxRuntime.jsx(Icon, {
+        name: "add_file",
+        height: 24,
+        width: 24,
+        onClick: handleAttachmentClick
+      })]
+    }, file.name))]
+  });
+};
+
 function findAndInsert(data, key, targetId, newEntry, insertPosition, childrenKey = 'children' // Allow dynamic key for nested children
 ) {
   function recursiveSearch(items) {
@@ -30452,6 +30709,7 @@ exports.Accordion = Accordion;
 exports.AddResourceButton = AddButton;
 exports.AllProjectsDropdown = AllProjectsDropdown;
 exports.AppHeader = AppHeader;
+exports.AttachmentButton = AttachmentButton;
 exports.Button = Button$1;
 exports.Checkbox = Checkbox;
 exports.Chip = Chip;
@@ -30468,6 +30726,7 @@ exports.Form = Form;
 exports.HighlightText = HighlightText;
 exports.Icon = Icon;
 exports.IconButton = IconButton;
+exports.IconRadioGroup = IconRadioGroup;
 exports.Input = Input;
 exports.InputWithDropdown = InputWithDropdown;
 exports.LazyLoad = LazyLoad;