pixel-react 1.1.7 → 1.1.8

Sign up to get free protection for your applications and to get access to all the features.
Files changed (60) hide show
  1. package/.yarn/install-state.gz +0 -0
  2. package/lib/components/AttachmentButton/AttachmentButton.d.ts +5 -0
  3. package/lib/components/AttachmentButton/AttachmentButton.stories.d.ts +9 -0
  4. package/lib/components/AttachmentButton/index.d.ts +1 -0
  5. package/lib/components/AttachmentButton/types.d.ts +8 -0
  6. package/lib/components/RadioButton/radioButtonTypes.d.ts +15 -0
  7. package/lib/components/RadioGroup/RadioGroup.stories.d.ts +2 -1
  8. package/lib/components/RadioGroup/radioGroupTypes.d.ts +15 -0
  9. package/lib/components/Select/Select.d.ts +1 -1
  10. package/lib/components/Select/types.d.ts +4 -0
  11. package/lib/components/Table/Table.d.ts +1 -1
  12. package/lib/components/Table/Types.d.ts +8 -0
  13. package/lib/components/TableTree/TableTree.d.ts +1 -0
  14. package/lib/index.d.ts +27 -3
  15. package/lib/index.esm.js +399 -580
  16. package/lib/index.esm.js.map +1 -1
  17. package/lib/index.js +399 -579
  18. package/lib/index.js.map +1 -1
  19. package/lib/tsconfig.tsbuildinfo +1 -1
  20. package/package.json +1 -1
  21. package/src/assets/Themes/BaseTheme.scss +10 -0
  22. package/src/assets/Themes/DarkTheme.scss +9 -0
  23. package/src/assets/icons/add_file.svg +14 -0
  24. package/src/assets/icons/nlp_help_icon.svg +3 -0
  25. package/src/assets/icons/notification_icon.svg +3 -0
  26. package/src/assets/icons/update_icon.svg +3 -0
  27. package/src/components/AppHeader/AppHeader.scss +56 -0
  28. package/src/components/AttachmentButton/AttachmentButton.scss +9 -0
  29. package/src/components/AttachmentButton/AttachmentButton.stories.tsx +76 -0
  30. package/src/components/AttachmentButton/AttachmentButton.tsx +113 -0
  31. package/src/components/AttachmentButton/index.ts +1 -0
  32. package/src/components/AttachmentButton/types.ts +8 -0
  33. package/src/components/Drawer/Drawer.scss +0 -1
  34. package/src/components/Icon/iconList.ts +9 -0
  35. package/src/components/Modal/modal.scss +1 -1
  36. package/src/components/MultiSelect/MultiSelect.scss +2 -2
  37. package/src/components/RadioButton/RadioButton.scss +74 -68
  38. package/src/components/RadioButton/RadioButton.tsx +22 -15
  39. package/src/components/RadioButton/radioButtonTypes.tsx +18 -0
  40. package/src/components/RadioGroup/RadioGroup.stories.tsx +42 -1
  41. package/src/components/RadioGroup/RadioGroup.tsx +3 -0
  42. package/src/components/RadioGroup/radioGroupTypes.tsx +18 -0
  43. package/src/components/Select/Select.scss +1 -2
  44. package/src/components/Select/Select.tsx +3 -2
  45. package/src/components/Select/types.ts +5 -0
  46. package/src/components/SequentialConnectingBranch/components/Branches/Branches.scss +5 -5
  47. package/src/components/SequentialConnectingBranch/components/Branches/Branches.tsx +1 -1
  48. package/src/components/Table/Table.scss +1 -0
  49. package/src/components/Table/Table.tsx +28 -13
  50. package/src/components/Table/Types.ts +8 -0
  51. package/src/components/TableTree/TableTree.scss +18 -2
  52. package/src/components/TableTree/TableTree.stories.tsx +9 -51
  53. package/src/components/TableTree/TableTree.tsx +15 -2
  54. package/src/index.ts +2 -0
  55. package/lib/components/AddButton/AddButton.d.ts +0 -5
  56. package/lib/components/AddButton/AddButton.stories.d.ts +0 -6
  57. package/lib/components/AddButton/index.d.ts +0 -1
  58. package/lib/components/AddButton/types.d.ts +0 -4
  59. package/lib/utils/find/findAndInsert.d.ts +0 -7
  60. package/lib/utils/find/findAndInsert.stories.d.ts +0 -7
package/lib/index.js CHANGED
@@ -48,11 +48,11 @@ function styleInject(css, ref) {
48
48
  }
49
49
  }
50
50
 
51
- 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}";
52
- styleInject(css_248z$T);
51
+ 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}\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}";
52
+ styleInject(css_248z$U);
53
53
 
54
- 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}";
55
- styleInject(css_248z$S);
54
+ 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}";
55
+ styleInject(css_248z$T);
56
56
 
57
57
  function getDefaultExportFromCjs (x) {
58
58
  return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
@@ -301,6 +301,14 @@ const SvgContinueWithoutSign = (props) => /* @__PURE__ */ React__namespace.creat
301
301
 
302
302
  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" }));
303
303
 
304
+ 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" }));
305
+
306
+ 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" }));
307
+
308
+ 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" }));
309
+
310
+ 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" }))));
311
+
304
312
  let Components = {};
305
313
  //icons
306
314
  Components['delete_info'] = SvgDeleteInfo;
@@ -390,9 +398,13 @@ Components['app_switch'] = SvgAppSwitch;
390
398
  Components['user_profile'] = SvgUserProfile;
391
399
  Components['continue_without_signin'] = SvgContinueWithoutSign;
392
400
  Components['cloud_server_host'] = SvgCloudServerHostIcon;
401
+ Components['notification_icon'] = SvgNotificationIcon;
402
+ Components['nlp_help_icon'] = SvgNlpHelpIcon;
403
+ Components['update_icon'] = SvgUpdateIcon;
404
+ Components['add_file'] = SvgAddFile;
393
405
 
394
- 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}";
395
- styleInject(css_248z$R);
406
+ var css_248z$S = ".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}";
407
+ styleInject(css_248z$S);
396
408
 
397
409
  const Icon = /*#__PURE__*/React.forwardRef(({
398
410
  name,
@@ -476,8 +488,8 @@ const Button$1 = /*#__PURE__*/React.forwardRef(({
476
488
  });
477
489
  });
478
490
 
479
- 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}";
480
- styleInject(css_248z$Q);
491
+ 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-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}";
492
+ styleInject(css_248z$R);
481
493
 
482
494
  function useEscapeKey(key) {
483
495
  return callBack => {
@@ -496,8 +508,8 @@ function useEscapeKey(key) {
496
508
  };
497
509
  }
498
510
 
499
- 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}";
500
- styleInject(css_248z$P);
511
+ var css_248z$Q = ":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}\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}\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}\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}";
512
+ styleInject(css_248z$Q);
501
513
 
502
514
  const ThemeContext = /*#__PURE__*/React.createContext(undefined);
503
515
  const ThemeProvider = ({
@@ -668,15 +680,15 @@ const Drawer = ({
668
680
  }), document.body);
669
681
  };
670
682
 
671
- 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}";
683
+ 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 {\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}";
684
+ styleInject(css_248z$P);
685
+
686
+ var css_248z$O = "";
672
687
  styleInject(css_248z$O);
673
688
 
674
- var css_248z$N = "";
689
+ 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-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}";
675
690
  styleInject(css_248z$N);
676
691
 
677
- 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}";
678
- styleInject(css_248z$M);
679
-
680
692
  const checkEmpty = value => {
681
693
  // Check for null or undefined
682
694
  if (value == null) return true;
@@ -844,8 +856,8 @@ const Tooltip = ({
844
856
  });
845
857
  };
846
858
 
847
- 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}";
848
- styleInject(css_248z$L);
859
+ 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.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}";
860
+ styleInject(css_248z$M);
849
861
 
850
862
  const Typography = ({
851
863
  fontWeight = 'regular',
@@ -930,8 +942,8 @@ const Accordion = ({
930
942
  });
931
943
  };
932
944
 
933
- 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}";
934
- styleInject(css_248z$K);
945
+ 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, .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}";
946
+ styleInject(css_248z$L);
935
947
 
936
948
  const dropdownDefaultCSSData$1 = {
937
949
  verticalMargin: 4,
@@ -939,8 +951,8 @@ const dropdownDefaultCSSData$1 = {
939
951
  maxDropdownHeight: 160
940
952
  };
941
953
 
942
- 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}";
943
- styleInject(css_248z$J);
954
+ 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, .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}";
955
+ styleInject(css_248z$K);
944
956
 
945
957
  const Dropdown$2 = /*#__PURE__*/React.forwardRef(({
946
958
  options,
@@ -1279,8 +1291,8 @@ const MultiSelect = ({
1279
1291
  });
1280
1292
  };
1281
1293
 
1282
- 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}";
1283
- styleInject(css_248z$I);
1294
+ 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 {\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}";
1295
+ styleInject(css_248z$J);
1284
1296
 
1285
1297
  const Toaster = ({
1286
1298
  isOpen = false,
@@ -1388,8 +1400,8 @@ const Toaster = ({
1388
1400
  }), document.body);
1389
1401
  };
1390
1402
 
1391
- 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}";
1392
- styleInject(css_248z$H);
1403
+ var css_248z$I = "/* 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}";
1404
+ styleInject(css_248z$I);
1393
1405
 
1394
1406
  const Container = ({
1395
1407
  children,
@@ -1431,8 +1443,8 @@ const Col = ({
1431
1443
  });
1432
1444
  };
1433
1445
 
1434
- 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}";
1435
- styleInject(css_248z$G);
1446
+ var css_248z$H = ".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}";
1447
+ styleInject(css_248z$H);
1436
1448
 
1437
1449
  const Toggle = ({
1438
1450
  onChange,
@@ -1510,8 +1522,8 @@ const Toggle = ({
1510
1522
  });
1511
1523
  };
1512
1524
 
1513
- 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}";
1514
- styleInject(css_248z$F);
1525
+ 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, .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}";
1526
+ styleInject(css_248z$G);
1515
1527
 
1516
1528
  const Chip = ({
1517
1529
  label = '',
@@ -1540,8 +1552,8 @@ const Chip = ({
1540
1552
  });
1541
1553
  };
1542
1554
 
1543
- 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}";
1544
- styleInject(css_248z$E);
1555
+ 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, .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}";
1556
+ styleInject(css_248z$F);
1545
1557
 
1546
1558
  const Input = ({
1547
1559
  type = 'text',
@@ -1619,8 +1631,8 @@ const Input = ({
1619
1631
  });
1620
1632
  };
1621
1633
 
1622
- 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}";
1623
- styleInject(css_248z$D);
1634
+ 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 {\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}";
1635
+ styleInject(css_248z$E);
1624
1636
 
1625
1637
  const useColorMappings$1 = () => React.useMemo(() => {
1626
1638
  return {
@@ -1762,8 +1774,8 @@ const RadialChart = ({
1762
1774
  });
1763
1775
  };
1764
1776
 
1765
- 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}";
1766
- styleInject(css_248z$C);
1777
+ 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, .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}";
1778
+ styleInject(css_248z$D);
1767
1779
 
1768
1780
  const ExpandableMenu = ({
1769
1781
  label = '',
@@ -1852,8 +1864,8 @@ const useClickOutside = (ref, callback, ignoreRefs = []) => {
1852
1864
  }, [ref, callback, ignoreRefs]);
1853
1865
  };
1854
1866
 
1855
- 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}";
1856
- styleInject(css_248z$B);
1867
+ 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 {\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}";
1868
+ styleInject(css_248z$C);
1857
1869
 
1858
1870
  const ffid = () => 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, char => ((char === 'x' ? Math.random() * 16 : Math.random() * 16 & 0x3 | 0x8) | 0).toString(16));
1859
1871
 
@@ -1931,8 +1943,8 @@ const Dropdown$1 = ({
1931
1943
  });
1932
1944
  };
1933
1945
 
1934
- 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}";
1935
- styleInject(css_248z$A);
1946
+ 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-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}";
1947
+ styleInject(css_248z$B);
1936
1948
 
1937
1949
  const portalPosition = {
1938
1950
  positionX: 0,
@@ -2073,7 +2085,8 @@ const Select$1 = ({
2073
2085
  borderRadius = true,
2074
2086
  showBorder = true,
2075
2087
  required = false,
2076
- optionsRequired = true
2088
+ optionsRequired = true,
2089
+ selectedOptionColor = 'var(--ff-select-text-color)'
2077
2090
  }) => {
2078
2091
  const initialState = React.useMemo(() => ({
2079
2092
  isInputFocused: false,
@@ -2218,7 +2231,8 @@ const Select$1 = ({
2218
2231
  }),
2219
2232
  // inline css required due to multiple overlay scenarios are present
2220
2233
  style: {
2221
- zIndex: optionZIndex
2234
+ zIndex: optionZIndex,
2235
+ color: selectedOptionColor
2222
2236
  },
2223
2237
  onFocus: () => handleSelectAction('FOCUS_INPUT'),
2224
2238
  onMouseEnter: () => handleSelectAction('MOUSE_ENTER'),
@@ -2293,8 +2307,8 @@ const Select$1 = ({
2293
2307
  });
2294
2308
  };
2295
2309
 
2296
- 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}";
2297
- styleInject(css_248z$z);
2310
+ 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-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}";
2311
+ styleInject(css_248z$A);
2298
2312
 
2299
2313
  const truncateText = (text, maxLength) => {
2300
2314
  if (!text || maxLength <= 0) return '';
@@ -2369,8 +2383,8 @@ const Textarea = ({
2369
2383
  });
2370
2384
  };
2371
2385
 
2372
- 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}";
2373
- styleInject(css_248z$y);
2386
+ var css_248z$z = ".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}";
2387
+ styleInject(css_248z$z);
2374
2388
 
2375
2389
  const StatusButton = ({
2376
2390
  status = 'passed',
@@ -2398,8 +2412,8 @@ const StatusButton = ({
2398
2412
  });
2399
2413
  };
2400
2414
 
2401
- 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}";
2402
- styleInject(css_248z$x);
2415
+ 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-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}";
2416
+ styleInject(css_248z$y);
2403
2417
 
2404
2418
  const Option$1 = ({
2405
2419
  option,
@@ -2522,8 +2536,8 @@ const MenuOption = ({
2522
2536
  });
2523
2537
  };
2524
2538
 
2525
- 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}";
2526
- styleInject(css_248z$w);
2539
+ 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-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}";
2540
+ styleInject(css_248z$x);
2527
2541
 
2528
2542
  const isFunction$1 = functionToCheck => {
2529
2543
  return functionToCheck && {}.toString.call(functionToCheck) === '[object Function]';
@@ -2571,8 +2585,8 @@ const prepareData = (dataObj, columnObj) => {
2571
2585
  }
2572
2586
  };
2573
2587
 
2574
- 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}";
2575
- styleInject(css_248z$v);
2588
+ 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 {\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}";
2589
+ styleInject(css_248z$w);
2576
2590
 
2577
2591
  const Checkbox = ({
2578
2592
  id,
@@ -2637,7 +2651,9 @@ const Table = ({
2637
2651
  // noDataImage,
2638
2652
  // noDataImageSize,
2639
2653
  height = '100%',
2640
- className = ''
2654
+ className = '',
2655
+ tableHeadClass = '',
2656
+ tableBodyRowClass = ''
2641
2657
  }) => {
2642
2658
  const hanleOnclick = (column, row) => {
2643
2659
  let {
@@ -2668,7 +2684,7 @@ const Table = ({
2668
2684
  children: [jsxRuntime.jsx("thead", {
2669
2685
  className: classNames({
2670
2686
  'ff-fixed-header': withFixedHeader
2671
- }),
2687
+ }, tableHeadClass),
2672
2688
  children: jsxRuntime.jsx("tr", {
2673
2689
  children: columns.map((column, index) => jsxRuntime.jsx("th", {
2674
2690
  className: headerType && `${headerType}-bg`,
@@ -2694,7 +2710,7 @@ const Table = ({
2694
2710
  })
2695
2711
  }), jsxRuntime.jsx("tbody", {
2696
2712
  children: data.length > 0 && data.map((row, index) => jsxRuntime.jsx("tr", {
2697
- className: classNames(className, {
2713
+ className: classNames(tableBodyRowClass, {
2698
2714
  'disabled-row': row.disabled
2699
2715
  }),
2700
2716
  children: columns.map((column, i) => {
@@ -2723,11 +2739,11 @@ const Table = ({
2723
2739
  });
2724
2740
  };
2725
2741
 
2726
- 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}";
2727
- styleInject(css_248z$u);
2742
+ var css_248z$v = ".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}";
2743
+ styleInject(css_248z$v);
2728
2744
 
2729
- 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}";
2730
- styleInject(css_248z$t);
2745
+ var css_248z$u = ".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}";
2746
+ styleInject(css_248z$u);
2731
2747
 
2732
2748
  const ArrowsButton = ({
2733
2749
  direction,
@@ -2864,8 +2880,8 @@ const AddButton = ({
2864
2880
  });
2865
2881
  };
2866
2882
 
2867
- 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}";
2868
- styleInject(css_248z$s);
2883
+ var css_248z$t = "@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}";
2884
+ styleInject(css_248z$t);
2869
2885
 
2870
2886
  const calculateArc$2 = (x, y, radius, startAngle, endAngle) => {
2871
2887
  const startX = x + radius * Math.cos(startAngle);
@@ -3217,8 +3233,8 @@ const useFileDropzone = options => {
3217
3233
  };
3218
3234
  };
3219
3235
 
3220
- 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}";
3221
- styleInject(css_248z$r);
3236
+ var css_248z$s = ".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}";
3237
+ styleInject(css_248z$s);
3222
3238
 
3223
3239
  const Dropzone = ({
3224
3240
  icon,
@@ -7192,8 +7208,8 @@ function useForm(props = {}) {
7192
7208
  return _formControl.current;
7193
7209
  }
7194
7210
 
7195
- 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}";
7196
- styleInject(css_248z$q);
7211
+ 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-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}";
7212
+ styleInject(css_248z$r);
7197
7213
 
7198
7214
  const Form = ({
7199
7215
  onSubmit,
@@ -7227,8 +7243,8 @@ const Form = ({
7227
7243
  });
7228
7244
  };
7229
7245
 
7230
- 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}";
7231
- styleInject(css_248z$p);
7246
+ 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-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}";
7247
+ styleInject(css_248z$q);
7232
7248
 
7233
7249
  const InputWithDropdown = ({
7234
7250
  name = '',
@@ -7308,8 +7324,8 @@ const InputWithDropdown = ({
7308
7324
  });
7309
7325
  };
7310
7326
 
7311
- 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}";
7312
- styleInject(css_248z$o);
7327
+ 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-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}";
7328
+ styleInject(css_248z$p);
7313
7329
 
7314
7330
  const RadioButton = ({
7315
7331
  label,
@@ -7317,28 +7333,37 @@ const RadioButton = ({
7317
7333
  checked,
7318
7334
  onChange,
7319
7335
  value,
7320
- disabled = false
7336
+ disabled = false,
7337
+ showTooltip = false,
7338
+ tooltipChildren = 'Custom JSX',
7339
+ tooltipTitle = 'Custom JSX'
7321
7340
  }) => {
7322
- return jsxRuntime.jsxs("label", {
7323
- className: classNames('ff-radio', {
7324
- 'ff-radio--disabled': disabled
7325
- }),
7326
- children: [jsxRuntime.jsx("input", {
7327
- disabled: disabled,
7328
- type: "radio",
7329
- name: name,
7330
- value: value,
7331
- checked: checked,
7332
- onChange: onChange,
7333
- className: "ff-radio-input"
7334
- }), jsxRuntime.jsx("span", {
7335
- className: "ff-radio-custom"
7336
- }), label]
7341
+ return jsxRuntime.jsxs("div", {
7342
+ className: "ff-radio-wrapper",
7343
+ children: [jsxRuntime.jsxs("label", {
7344
+ className: classNames('ff-radio', {
7345
+ 'ff-radio--disabled': disabled
7346
+ }),
7347
+ children: [jsxRuntime.jsx("input", {
7348
+ disabled: disabled,
7349
+ type: "radio",
7350
+ name: name,
7351
+ value: value,
7352
+ checked: checked,
7353
+ onChange: onChange,
7354
+ className: "ff-radio-input"
7355
+ }), jsxRuntime.jsx("span", {
7356
+ className: "ff-radio-custom"
7357
+ }), label]
7358
+ }), showTooltip && jsxRuntime.jsx(Tooltip, {
7359
+ title: tooltipTitle,
7360
+ children: tooltipChildren
7361
+ })]
7337
7362
  });
7338
7363
  };
7339
7364
 
7340
- var css_248z$n = ".ff-radio-group {\n display: flex;\n flex-direction: row;\n gap: 12px;\n}";
7341
- styleInject(css_248z$n);
7365
+ var css_248z$o = ".ff-radio-group {\n display: flex;\n flex-direction: row;\n gap: 12px;\n}";
7366
+ styleInject(css_248z$o);
7342
7367
 
7343
7368
  const RadioGroup = ({
7344
7369
  options,
@@ -7351,6 +7376,9 @@ const RadioGroup = ({
7351
7376
  className: classNames('ff-radio-group', className),
7352
7377
  children: options.map(option => jsxRuntime.jsx(RadioButton, {
7353
7378
  label: option.label,
7379
+ showTooltip: option?.showTooltip,
7380
+ tooltipChildren: option?.tooltipChildren,
7381
+ tooltipTitle: option?.tooltipTitle,
7354
7382
  name: name,
7355
7383
  value: option.value,
7356
7384
  checked: selectedValue === option.value,
@@ -7360,8 +7388,8 @@ const RadioGroup = ({
7360
7388
  });
7361
7389
  };
7362
7390
 
7363
- 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}";
7364
- styleInject(css_248z$m);
7391
+ var css_248z$n = ".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}";
7392
+ styleInject(css_248z$n);
7365
7393
 
7366
7394
  const MiniModal = /*#__PURE__*/React.forwardRef(({
7367
7395
  anchorRef,
@@ -7577,8 +7605,8 @@ const MiniModal = /*#__PURE__*/React.forwardRef(({
7577
7605
  }), document.body);
7578
7606
  });
7579
7607
 
7580
- 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}";
7581
- styleInject(css_248z$l);
7608
+ 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-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}";
7609
+ styleInject(css_248z$m);
7582
7610
 
7583
7611
  const TableTree = ({
7584
7612
  columnsData,
@@ -7690,10 +7718,21 @@ const TableTree = ({
7690
7718
  children: [select === 'checkbox' && jsxRuntime.jsx(Checkbox, {
7691
7719
  checked: selected.includes(node.key),
7692
7720
  onChange: e => handleCheckBoxChange(e, node)
7693
- }), select === 'radio' && jsxRuntime.jsx(RadioButton, {
7694
- checked: selected.includes(node.key),
7721
+ }), select === 'radio' && jsxRuntime.jsx(RadioButton
7722
+ // checked={selected.includes(node.key)}
7723
+ , {
7724
+ // checked={selected.includes(node.key)}
7725
+ name: node.title,
7726
+ value: node.key,
7695
7727
  onChange: e => handleCheckBoxChange(e, node)
7696
- }), prepareData(node, column)]
7728
+ }), jsxRuntime.jsx(Typography, {
7729
+ className: "ff-title-label",
7730
+ fontWeight: "medium",
7731
+ children: prepareData(node, column)
7732
+ }), column.actions && jsxRuntime.jsx("div", {
7733
+ className: "ff-title-action-container",
7734
+ children: column.actions(node)
7735
+ })]
7697
7736
  })]
7698
7737
  });
7699
7738
  } else if (column.accessor) {
@@ -7750,8 +7789,8 @@ const TableTree = ({
7750
7789
  });
7751
7790
  };
7752
7791
 
7753
- 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}";
7754
- styleInject(css_248z$k);
7792
+ var css_248z$l = ":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}";
7793
+ styleInject(css_248z$l);
7755
7794
 
7756
7795
  const Tabs = ({
7757
7796
  variant = 'default',
@@ -7796,8 +7835,8 @@ const Tabs = ({
7796
7835
  });
7797
7836
  };
7798
7837
 
7799
- var css_248z$j = ".ff-highlight-bg {\n background-color: var(--text-bg-highlight);\n}";
7800
- styleInject(css_248z$j);
7838
+ var css_248z$k = ".ff-highlight-bg {\n background-color: var(--text-bg-highlight);\n}";
7839
+ styleInject(css_248z$k);
7801
7840
 
7802
7841
  // Function to escape special characters in the search term
7803
7842
  const escapeRegExp = text => {
@@ -7820,8 +7859,8 @@ const HighlightText = ({
7820
7859
  });
7821
7860
  };
7822
7861
 
7823
- 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}";
7824
- styleInject(css_248z$i);
7862
+ 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, .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}";
7863
+ styleInject(css_248z$j);
7825
7864
 
7826
7865
  const Search = ({
7827
7866
  placeholder = 'Search',
@@ -15825,8 +15864,8 @@ const TimePicker = ({
15825
15864
  });
15826
15865
  };
15827
15866
 
15828
- 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}";
15829
- styleInject(css_248z$h);
15867
+ var css_248z$i = "@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}";
15868
+ styleInject(css_248z$i);
15830
15869
 
15831
15870
  const CustomDatePicker = ({
15832
15871
  minDate,
@@ -16346,8 +16385,8 @@ const StateDropdown = ({
16346
16385
  });
16347
16386
  };
16348
16387
 
16349
- 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}";
16350
- styleInject(css_248z$g);
16388
+ 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 {\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}";
16389
+ styleInject(css_248z$h);
16351
16390
 
16352
16391
  const IconButton = ({
16353
16392
  label,
@@ -16374,8 +16413,8 @@ const IconButton = ({
16374
16413
  });
16375
16414
  };
16376
16415
 
16377
- 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}";
16378
- styleInject(css_248z$f);
16416
+ var css_248z$g = ".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}";
16417
+ styleInject(css_248z$g);
16379
16418
 
16380
16419
  const Modal = ({
16381
16420
  isOpen,
@@ -21058,8 +21097,8 @@ const DragAndDrop = {
21058
21097
  DNDUtilities
21059
21098
  };
21060
21099
 
21061
- 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}";
21062
- styleInject(css_248z$e);
21100
+ var css_248z$f = ".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}";
21101
+ styleInject(css_248z$f);
21063
21102
 
21064
21103
  const VariableInput = ({
21065
21104
  type = 'url',
@@ -21337,8 +21376,8 @@ const VariableInput = ({
21337
21376
  });
21338
21377
  };
21339
21378
 
21340
- 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}";
21341
- styleInject(css_248z$d);
21379
+ var css_248z$e = ".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}";
21380
+ styleInject(css_248z$e);
21342
21381
 
21343
21382
  const AllProjectsDropdown = ({
21344
21383
  onClick = () => {},
@@ -21428,8 +21467,8 @@ const AllProjectsDropdown = ({
21428
21467
  });
21429
21468
  };
21430
21469
 
21431
- 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}";
21432
- styleInject(css_248z$c);
21470
+ var css_248z$d = ".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}";
21471
+ styleInject(css_248z$d);
21433
21472
 
21434
21473
  const calculateArc$1 = ({
21435
21474
  x,
@@ -21584,8 +21623,8 @@ const PieChart = ({
21584
21623
  });
21585
21624
  };
21586
21625
 
21587
- 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}";
21588
- styleInject(css_248z$b);
21626
+ var css_248z$c = ".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 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-right-content {\n height: 24px;\n padding: 8px;\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}";
21627
+ styleInject(css_248z$c);
21589
21628
 
21590
21629
  // import AllProjectsDropdown from '../AllProjectsDropdown';
21591
21630
  const AppHeader = ({
@@ -21681,8 +21720,8 @@ const AppHeader = ({
21681
21720
  });
21682
21721
  };
21683
21722
 
21684
- 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}";
21685
- styleInject(css_248z$a);
21723
+ var css_248z$b = ".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}";
21724
+ styleInject(css_248z$b);
21686
21725
 
21687
21726
  const Paper = ({
21688
21727
  children,
@@ -21698,8 +21737,8 @@ const Paper = ({
21698
21737
  });
21699
21738
  };
21700
21739
 
21701
- 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}";
21702
- styleInject(css_248z$9);
21740
+ 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, .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}";
21741
+ styleInject(css_248z$a);
21703
21742
 
21704
21743
  const calculateArc = (x, y, radius, startAngle, endAngle) => {
21705
21744
  const startX = x + radius * Math.cos(startAngle);
@@ -21967,9 +22006,9 @@ const DashboardDonutChart = ({
21967
22006
 
21968
22007
  var propTypes = {exports: {}};
21969
22008
 
21970
- var reactIs$1 = {exports: {}};
22009
+ var reactIs = {exports: {}};
21971
22010
 
21972
- var reactIs_production_min$1 = {};
22011
+ var reactIs_production_min = {};
21973
22012
 
21974
22013
  /** @license React v16.13.1
21975
22014
  * react-is.production.min.js
@@ -21979,10 +22018,10 @@ var reactIs_production_min$1 = {};
21979
22018
  * This source code is licensed under the MIT license found in the
21980
22019
  * LICENSE file in the root directory of this source tree.
21981
22020
  */
21982
- var hasRequiredReactIs_production_min$1;
21983
- function requireReactIs_production_min$1() {
21984
- if (hasRequiredReactIs_production_min$1) return reactIs_production_min$1;
21985
- hasRequiredReactIs_production_min$1 = 1;
22021
+ var hasRequiredReactIs_production_min;
22022
+ function requireReactIs_production_min() {
22023
+ if (hasRequiredReactIs_production_min) return reactIs_production_min;
22024
+ hasRequiredReactIs_production_min = 1;
21986
22025
  var b = "function" === typeof Symbol && Symbol.for,
21987
22026
  c = b ? Symbol.for("react.element") : 60103,
21988
22027
  d = b ? Symbol.for("react.portal") : 60106,
@@ -22035,64 +22074,64 @@ function requireReactIs_production_min$1() {
22035
22074
  function A(a) {
22036
22075
  return z(a) === m;
22037
22076
  }
22038
- reactIs_production_min$1.AsyncMode = l;
22039
- reactIs_production_min$1.ConcurrentMode = m;
22040
- reactIs_production_min$1.ContextConsumer = k;
22041
- reactIs_production_min$1.ContextProvider = h;
22042
- reactIs_production_min$1.Element = c;
22043
- reactIs_production_min$1.ForwardRef = n;
22044
- reactIs_production_min$1.Fragment = e;
22045
- reactIs_production_min$1.Lazy = t;
22046
- reactIs_production_min$1.Memo = r;
22047
- reactIs_production_min$1.Portal = d;
22048
- reactIs_production_min$1.Profiler = g;
22049
- reactIs_production_min$1.StrictMode = f;
22050
- reactIs_production_min$1.Suspense = p;
22051
- reactIs_production_min$1.isAsyncMode = function (a) {
22077
+ reactIs_production_min.AsyncMode = l;
22078
+ reactIs_production_min.ConcurrentMode = m;
22079
+ reactIs_production_min.ContextConsumer = k;
22080
+ reactIs_production_min.ContextProvider = h;
22081
+ reactIs_production_min.Element = c;
22082
+ reactIs_production_min.ForwardRef = n;
22083
+ reactIs_production_min.Fragment = e;
22084
+ reactIs_production_min.Lazy = t;
22085
+ reactIs_production_min.Memo = r;
22086
+ reactIs_production_min.Portal = d;
22087
+ reactIs_production_min.Profiler = g;
22088
+ reactIs_production_min.StrictMode = f;
22089
+ reactIs_production_min.Suspense = p;
22090
+ reactIs_production_min.isAsyncMode = function (a) {
22052
22091
  return A(a) || z(a) === l;
22053
22092
  };
22054
- reactIs_production_min$1.isConcurrentMode = A;
22055
- reactIs_production_min$1.isContextConsumer = function (a) {
22093
+ reactIs_production_min.isConcurrentMode = A;
22094
+ reactIs_production_min.isContextConsumer = function (a) {
22056
22095
  return z(a) === k;
22057
22096
  };
22058
- reactIs_production_min$1.isContextProvider = function (a) {
22097
+ reactIs_production_min.isContextProvider = function (a) {
22059
22098
  return z(a) === h;
22060
22099
  };
22061
- reactIs_production_min$1.isElement = function (a) {
22100
+ reactIs_production_min.isElement = function (a) {
22062
22101
  return "object" === typeof a && null !== a && a.$$typeof === c;
22063
22102
  };
22064
- reactIs_production_min$1.isForwardRef = function (a) {
22103
+ reactIs_production_min.isForwardRef = function (a) {
22065
22104
  return z(a) === n;
22066
22105
  };
22067
- reactIs_production_min$1.isFragment = function (a) {
22106
+ reactIs_production_min.isFragment = function (a) {
22068
22107
  return z(a) === e;
22069
22108
  };
22070
- reactIs_production_min$1.isLazy = function (a) {
22109
+ reactIs_production_min.isLazy = function (a) {
22071
22110
  return z(a) === t;
22072
22111
  };
22073
- reactIs_production_min$1.isMemo = function (a) {
22112
+ reactIs_production_min.isMemo = function (a) {
22074
22113
  return z(a) === r;
22075
22114
  };
22076
- reactIs_production_min$1.isPortal = function (a) {
22115
+ reactIs_production_min.isPortal = function (a) {
22077
22116
  return z(a) === d;
22078
22117
  };
22079
- reactIs_production_min$1.isProfiler = function (a) {
22118
+ reactIs_production_min.isProfiler = function (a) {
22080
22119
  return z(a) === g;
22081
22120
  };
22082
- reactIs_production_min$1.isStrictMode = function (a) {
22121
+ reactIs_production_min.isStrictMode = function (a) {
22083
22122
  return z(a) === f;
22084
22123
  };
22085
- reactIs_production_min$1.isSuspense = function (a) {
22124
+ reactIs_production_min.isSuspense = function (a) {
22086
22125
  return z(a) === p;
22087
22126
  };
22088
- reactIs_production_min$1.isValidElementType = function (a) {
22127
+ reactIs_production_min.isValidElementType = function (a) {
22089
22128
  return "string" === typeof a || "function" === typeof a || a === e || a === m || a === g || a === f || a === p || a === q || "object" === typeof a && null !== a && (a.$$typeof === t || a.$$typeof === r || a.$$typeof === h || a.$$typeof === k || a.$$typeof === n || a.$$typeof === w || a.$$typeof === x || a.$$typeof === y || a.$$typeof === v);
22090
22129
  };
22091
- reactIs_production_min$1.typeOf = z;
22092
- return reactIs_production_min$1;
22130
+ reactIs_production_min.typeOf = z;
22131
+ return reactIs_production_min;
22093
22132
  }
22094
22133
 
22095
- var reactIs_development$1 = {};
22134
+ var reactIs_development = {};
22096
22135
 
22097
22136
  /** @license React v16.13.1
22098
22137
  * react-is.development.js
@@ -22102,10 +22141,10 @@ var reactIs_development$1 = {};
22102
22141
  * This source code is licensed under the MIT license found in the
22103
22142
  * LICENSE file in the root directory of this source tree.
22104
22143
  */
22105
- var hasRequiredReactIs_development$1;
22106
- function requireReactIs_development$1() {
22107
- if (hasRequiredReactIs_development$1) return reactIs_development$1;
22108
- hasRequiredReactIs_development$1 = 1;
22144
+ var hasRequiredReactIs_development;
22145
+ function requireReactIs_development() {
22146
+ if (hasRequiredReactIs_development) return reactIs_development;
22147
+ hasRequiredReactIs_development = 1;
22109
22148
  if (process.env.NODE_ENV !== "production") {
22110
22149
  (function () {
22111
22150
 
@@ -22232,49 +22271,49 @@ function requireReactIs_development$1() {
22232
22271
  function isSuspense(object) {
22233
22272
  return typeOf(object) === REACT_SUSPENSE_TYPE;
22234
22273
  }
22235
- reactIs_development$1.AsyncMode = AsyncMode;
22236
- reactIs_development$1.ConcurrentMode = ConcurrentMode;
22237
- reactIs_development$1.ContextConsumer = ContextConsumer;
22238
- reactIs_development$1.ContextProvider = ContextProvider;
22239
- reactIs_development$1.Element = Element;
22240
- reactIs_development$1.ForwardRef = ForwardRef;
22241
- reactIs_development$1.Fragment = Fragment;
22242
- reactIs_development$1.Lazy = Lazy;
22243
- reactIs_development$1.Memo = Memo;
22244
- reactIs_development$1.Portal = Portal;
22245
- reactIs_development$1.Profiler = Profiler;
22246
- reactIs_development$1.StrictMode = StrictMode;
22247
- reactIs_development$1.Suspense = Suspense;
22248
- reactIs_development$1.isAsyncMode = isAsyncMode;
22249
- reactIs_development$1.isConcurrentMode = isConcurrentMode;
22250
- reactIs_development$1.isContextConsumer = isContextConsumer;
22251
- reactIs_development$1.isContextProvider = isContextProvider;
22252
- reactIs_development$1.isElement = isElement;
22253
- reactIs_development$1.isForwardRef = isForwardRef;
22254
- reactIs_development$1.isFragment = isFragment;
22255
- reactIs_development$1.isLazy = isLazy;
22256
- reactIs_development$1.isMemo = isMemo;
22257
- reactIs_development$1.isPortal = isPortal;
22258
- reactIs_development$1.isProfiler = isProfiler;
22259
- reactIs_development$1.isStrictMode = isStrictMode;
22260
- reactIs_development$1.isSuspense = isSuspense;
22261
- reactIs_development$1.isValidElementType = isValidElementType;
22262
- reactIs_development$1.typeOf = typeOf;
22274
+ reactIs_development.AsyncMode = AsyncMode;
22275
+ reactIs_development.ConcurrentMode = ConcurrentMode;
22276
+ reactIs_development.ContextConsumer = ContextConsumer;
22277
+ reactIs_development.ContextProvider = ContextProvider;
22278
+ reactIs_development.Element = Element;
22279
+ reactIs_development.ForwardRef = ForwardRef;
22280
+ reactIs_development.Fragment = Fragment;
22281
+ reactIs_development.Lazy = Lazy;
22282
+ reactIs_development.Memo = Memo;
22283
+ reactIs_development.Portal = Portal;
22284
+ reactIs_development.Profiler = Profiler;
22285
+ reactIs_development.StrictMode = StrictMode;
22286
+ reactIs_development.Suspense = Suspense;
22287
+ reactIs_development.isAsyncMode = isAsyncMode;
22288
+ reactIs_development.isConcurrentMode = isConcurrentMode;
22289
+ reactIs_development.isContextConsumer = isContextConsumer;
22290
+ reactIs_development.isContextProvider = isContextProvider;
22291
+ reactIs_development.isElement = isElement;
22292
+ reactIs_development.isForwardRef = isForwardRef;
22293
+ reactIs_development.isFragment = isFragment;
22294
+ reactIs_development.isLazy = isLazy;
22295
+ reactIs_development.isMemo = isMemo;
22296
+ reactIs_development.isPortal = isPortal;
22297
+ reactIs_development.isProfiler = isProfiler;
22298
+ reactIs_development.isStrictMode = isStrictMode;
22299
+ reactIs_development.isSuspense = isSuspense;
22300
+ reactIs_development.isValidElementType = isValidElementType;
22301
+ reactIs_development.typeOf = typeOf;
22263
22302
  })();
22264
22303
  }
22265
- return reactIs_development$1;
22304
+ return reactIs_development;
22266
22305
  }
22267
22306
 
22268
- var hasRequiredReactIs$1;
22269
- function requireReactIs$1() {
22270
- if (hasRequiredReactIs$1) return reactIs$1.exports;
22271
- hasRequiredReactIs$1 = 1;
22307
+ var hasRequiredReactIs;
22308
+ function requireReactIs() {
22309
+ if (hasRequiredReactIs) return reactIs.exports;
22310
+ hasRequiredReactIs = 1;
22272
22311
  if (process.env.NODE_ENV === 'production') {
22273
- reactIs$1.exports = requireReactIs_production_min$1();
22312
+ reactIs.exports = requireReactIs_production_min();
22274
22313
  } else {
22275
- reactIs$1.exports = requireReactIs_development$1();
22314
+ reactIs.exports = requireReactIs_development();
22276
22315
  }
22277
- return reactIs$1.exports;
22316
+ return reactIs.exports;
22278
22317
  }
22279
22318
 
22280
22319
  /*
@@ -22489,7 +22528,7 @@ var hasRequiredFactoryWithTypeCheckers;
22489
22528
  function requireFactoryWithTypeCheckers() {
22490
22529
  if (hasRequiredFactoryWithTypeCheckers) return factoryWithTypeCheckers;
22491
22530
  hasRequiredFactoryWithTypeCheckers = 1;
22492
- var ReactIs = requireReactIs$1();
22531
+ var ReactIs = requireReactIs();
22493
22532
  var assign = requireObjectAssign();
22494
22533
  var ReactPropTypesSecret = /*@__PURE__*/requireReactPropTypesSecret();
22495
22534
  var has = /*@__PURE__*/requireHas();
@@ -23102,7 +23141,7 @@ function requirePropTypes() {
23102
23141
  if (hasRequiredPropTypes) return propTypes.exports;
23103
23142
  hasRequiredPropTypes = 1;
23104
23143
  if (process.env.NODE_ENV !== 'production') {
23105
- var ReactIs = requireReactIs$1();
23144
+ var ReactIs = requireReactIs();
23106
23145
 
23107
23146
  // By explicitly using `prop-types` you are opting into new development behavior.
23108
23147
  // http://fb.me/prop-types-in-prod
@@ -23337,372 +23376,62 @@ ReCAPTCHA.defaultProps = {
23337
23376
  badge: "bottomright"
23338
23377
  };
23339
23378
 
23340
- var reactIs = {exports: {}};
23379
+ var hoistNonReactStatics_cjs;
23380
+ var hasRequiredHoistNonReactStatics_cjs;
23381
+ function requireHoistNonReactStatics_cjs() {
23382
+ if (hasRequiredHoistNonReactStatics_cjs) return hoistNonReactStatics_cjs;
23383
+ hasRequiredHoistNonReactStatics_cjs = 1;
23384
+ var reactIs = requireReactIs();
23341
23385
 
23342
- var reactIs_production_min = {};
23343
-
23344
- /** @license React v16.13.1
23345
- * react-is.production.min.js
23346
- *
23347
- * Copyright (c) Facebook, Inc. and its affiliates.
23348
- *
23349
- * This source code is licensed under the MIT license found in the
23350
- * LICENSE file in the root directory of this source tree.
23351
- */
23352
- var hasRequiredReactIs_production_min;
23353
- function requireReactIs_production_min() {
23354
- if (hasRequiredReactIs_production_min) return reactIs_production_min;
23355
- hasRequiredReactIs_production_min = 1;
23356
- var b = "function" === typeof Symbol && Symbol.for,
23357
- c = b ? Symbol.for("react.element") : 60103,
23358
- d = b ? Symbol.for("react.portal") : 60106,
23359
- e = b ? Symbol.for("react.fragment") : 60107,
23360
- f = b ? Symbol.for("react.strict_mode") : 60108,
23361
- g = b ? Symbol.for("react.profiler") : 60114,
23362
- h = b ? Symbol.for("react.provider") : 60109,
23363
- k = b ? Symbol.for("react.context") : 60110,
23364
- l = b ? Symbol.for("react.async_mode") : 60111,
23365
- m = b ? Symbol.for("react.concurrent_mode") : 60111,
23366
- n = b ? Symbol.for("react.forward_ref") : 60112,
23367
- p = b ? Symbol.for("react.suspense") : 60113,
23368
- q = b ? Symbol.for("react.suspense_list") : 60120,
23369
- r = b ? Symbol.for("react.memo") : 60115,
23370
- t = b ? Symbol.for("react.lazy") : 60116,
23371
- v = b ? Symbol.for("react.block") : 60121,
23372
- w = b ? Symbol.for("react.fundamental") : 60117,
23373
- x = b ? Symbol.for("react.responder") : 60118,
23374
- y = b ? Symbol.for("react.scope") : 60119;
23375
- function z(a) {
23376
- if ("object" === typeof a && null !== a) {
23377
- var u = a.$$typeof;
23378
- switch (u) {
23379
- case c:
23380
- switch (a = a.type, a) {
23381
- case l:
23382
- case m:
23383
- case e:
23384
- case g:
23385
- case f:
23386
- case p:
23387
- return a;
23388
- default:
23389
- switch (a = a && a.$$typeof, a) {
23390
- case k:
23391
- case n:
23392
- case t:
23393
- case r:
23394
- case h:
23395
- return a;
23396
- default:
23397
- return u;
23398
- }
23399
- }
23400
- case d:
23401
- return u;
23402
- }
23403
- }
23404
- }
23405
- function A(a) {
23406
- return z(a) === m;
23407
- }
23408
- reactIs_production_min.AsyncMode = l;
23409
- reactIs_production_min.ConcurrentMode = m;
23410
- reactIs_production_min.ContextConsumer = k;
23411
- reactIs_production_min.ContextProvider = h;
23412
- reactIs_production_min.Element = c;
23413
- reactIs_production_min.ForwardRef = n;
23414
- reactIs_production_min.Fragment = e;
23415
- reactIs_production_min.Lazy = t;
23416
- reactIs_production_min.Memo = r;
23417
- reactIs_production_min.Portal = d;
23418
- reactIs_production_min.Profiler = g;
23419
- reactIs_production_min.StrictMode = f;
23420
- reactIs_production_min.Suspense = p;
23421
- reactIs_production_min.isAsyncMode = function (a) {
23422
- return A(a) || z(a) === l;
23423
- };
23424
- reactIs_production_min.isConcurrentMode = A;
23425
- reactIs_production_min.isContextConsumer = function (a) {
23426
- return z(a) === k;
23427
- };
23428
- reactIs_production_min.isContextProvider = function (a) {
23429
- return z(a) === h;
23430
- };
23431
- reactIs_production_min.isElement = function (a) {
23432
- return "object" === typeof a && null !== a && a.$$typeof === c;
23433
- };
23434
- reactIs_production_min.isForwardRef = function (a) {
23435
- return z(a) === n;
23436
- };
23437
- reactIs_production_min.isFragment = function (a) {
23438
- return z(a) === e;
23439
- };
23440
- reactIs_production_min.isLazy = function (a) {
23441
- return z(a) === t;
23442
- };
23443
- reactIs_production_min.isMemo = function (a) {
23444
- return z(a) === r;
23445
- };
23446
- reactIs_production_min.isPortal = function (a) {
23447
- return z(a) === d;
23448
- };
23449
- reactIs_production_min.isProfiler = function (a) {
23450
- return z(a) === g;
23451
- };
23452
- reactIs_production_min.isStrictMode = function (a) {
23453
- return z(a) === f;
23454
- };
23455
- reactIs_production_min.isSuspense = function (a) {
23456
- return z(a) === p;
23457
- };
23458
- reactIs_production_min.isValidElementType = function (a) {
23459
- return "string" === typeof a || "function" === typeof a || a === e || a === m || a === g || a === f || a === p || a === q || "object" === typeof a && null !== a && (a.$$typeof === t || a.$$typeof === r || a.$$typeof === h || a.$$typeof === k || a.$$typeof === n || a.$$typeof === w || a.$$typeof === x || a.$$typeof === y || a.$$typeof === v);
23460
- };
23461
- reactIs_production_min.typeOf = z;
23462
- return reactIs_production_min;
23463
- }
23464
-
23465
- var reactIs_development = {};
23466
-
23467
- /** @license React v16.13.1
23468
- * react-is.development.js
23469
- *
23470
- * Copyright (c) Facebook, Inc. and its affiliates.
23471
- *
23472
- * This source code is licensed under the MIT license found in the
23473
- * LICENSE file in the root directory of this source tree.
23474
- */
23475
- var hasRequiredReactIs_development;
23476
- function requireReactIs_development() {
23477
- if (hasRequiredReactIs_development) return reactIs_development;
23478
- hasRequiredReactIs_development = 1;
23479
- if (process.env.NODE_ENV !== "production") {
23480
- (function () {
23481
-
23482
- // The Symbol used to tag the ReactElement-like types. If there is no native Symbol
23483
- // nor polyfill, then a plain number is used for performance.
23484
- var hasSymbol = typeof Symbol === 'function' && Symbol.for;
23485
- var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
23486
- var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
23487
- var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
23488
- var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
23489
- var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
23490
- var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
23491
- var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace; // TODO: We don't use AsyncMode or ConcurrentMode anymore. They were temporary
23492
- // (unstable) APIs that have been removed. Can we remove the symbols?
23493
-
23494
- var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
23495
- var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
23496
- var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
23497
- var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
23498
- var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for('react.suspense_list') : 0xead8;
23499
- var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
23500
- var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
23501
- var REACT_BLOCK_TYPE = hasSymbol ? Symbol.for('react.block') : 0xead9;
23502
- var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for('react.fundamental') : 0xead5;
23503
- var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for('react.responder') : 0xead6;
23504
- var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for('react.scope') : 0xead7;
23505
- function isValidElementType(type) {
23506
- return typeof type === 'string' || typeof type === 'function' ||
23507
- // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
23508
- type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE || type.$$typeof === REACT_BLOCK_TYPE);
23509
- }
23510
- function typeOf(object) {
23511
- if (typeof object === 'object' && object !== null) {
23512
- var $$typeof = object.$$typeof;
23513
- switch ($$typeof) {
23514
- case REACT_ELEMENT_TYPE:
23515
- var type = object.type;
23516
- switch (type) {
23517
- case REACT_ASYNC_MODE_TYPE:
23518
- case REACT_CONCURRENT_MODE_TYPE:
23519
- case REACT_FRAGMENT_TYPE:
23520
- case REACT_PROFILER_TYPE:
23521
- case REACT_STRICT_MODE_TYPE:
23522
- case REACT_SUSPENSE_TYPE:
23523
- return type;
23524
- default:
23525
- var $$typeofType = type && type.$$typeof;
23526
- switch ($$typeofType) {
23527
- case REACT_CONTEXT_TYPE:
23528
- case REACT_FORWARD_REF_TYPE:
23529
- case REACT_LAZY_TYPE:
23530
- case REACT_MEMO_TYPE:
23531
- case REACT_PROVIDER_TYPE:
23532
- return $$typeofType;
23533
- default:
23534
- return $$typeof;
23535
- }
23536
- }
23537
- case REACT_PORTAL_TYPE:
23538
- return $$typeof;
23539
- }
23540
- }
23541
- return undefined;
23542
- } // AsyncMode is deprecated along with isAsyncMode
23543
-
23544
- var AsyncMode = REACT_ASYNC_MODE_TYPE;
23545
- var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
23546
- var ContextConsumer = REACT_CONTEXT_TYPE;
23547
- var ContextProvider = REACT_PROVIDER_TYPE;
23548
- var Element = REACT_ELEMENT_TYPE;
23549
- var ForwardRef = REACT_FORWARD_REF_TYPE;
23550
- var Fragment = REACT_FRAGMENT_TYPE;
23551
- var Lazy = REACT_LAZY_TYPE;
23552
- var Memo = REACT_MEMO_TYPE;
23553
- var Portal = REACT_PORTAL_TYPE;
23554
- var Profiler = REACT_PROFILER_TYPE;
23555
- var StrictMode = REACT_STRICT_MODE_TYPE;
23556
- var Suspense = REACT_SUSPENSE_TYPE;
23557
- var hasWarnedAboutDeprecatedIsAsyncMode = false; // AsyncMode should be deprecated
23558
-
23559
- function isAsyncMode(object) {
23560
- {
23561
- if (!hasWarnedAboutDeprecatedIsAsyncMode) {
23562
- hasWarnedAboutDeprecatedIsAsyncMode = true; // Using console['warn'] to evade Babel and ESLint
23563
-
23564
- console['warn']('The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
23565
- }
23566
- }
23567
- return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
23568
- }
23569
- function isConcurrentMode(object) {
23570
- return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
23571
- }
23572
- function isContextConsumer(object) {
23573
- return typeOf(object) === REACT_CONTEXT_TYPE;
23574
- }
23575
- function isContextProvider(object) {
23576
- return typeOf(object) === REACT_PROVIDER_TYPE;
23577
- }
23578
- function isElement(object) {
23579
- return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
23580
- }
23581
- function isForwardRef(object) {
23582
- return typeOf(object) === REACT_FORWARD_REF_TYPE;
23583
- }
23584
- function isFragment(object) {
23585
- return typeOf(object) === REACT_FRAGMENT_TYPE;
23586
- }
23587
- function isLazy(object) {
23588
- return typeOf(object) === REACT_LAZY_TYPE;
23589
- }
23590
- function isMemo(object) {
23591
- return typeOf(object) === REACT_MEMO_TYPE;
23592
- }
23593
- function isPortal(object) {
23594
- return typeOf(object) === REACT_PORTAL_TYPE;
23595
- }
23596
- function isProfiler(object) {
23597
- return typeOf(object) === REACT_PROFILER_TYPE;
23598
- }
23599
- function isStrictMode(object) {
23600
- return typeOf(object) === REACT_STRICT_MODE_TYPE;
23601
- }
23602
- function isSuspense(object) {
23603
- return typeOf(object) === REACT_SUSPENSE_TYPE;
23604
- }
23605
- reactIs_development.AsyncMode = AsyncMode;
23606
- reactIs_development.ConcurrentMode = ConcurrentMode;
23607
- reactIs_development.ContextConsumer = ContextConsumer;
23608
- reactIs_development.ContextProvider = ContextProvider;
23609
- reactIs_development.Element = Element;
23610
- reactIs_development.ForwardRef = ForwardRef;
23611
- reactIs_development.Fragment = Fragment;
23612
- reactIs_development.Lazy = Lazy;
23613
- reactIs_development.Memo = Memo;
23614
- reactIs_development.Portal = Portal;
23615
- reactIs_development.Profiler = Profiler;
23616
- reactIs_development.StrictMode = StrictMode;
23617
- reactIs_development.Suspense = Suspense;
23618
- reactIs_development.isAsyncMode = isAsyncMode;
23619
- reactIs_development.isConcurrentMode = isConcurrentMode;
23620
- reactIs_development.isContextConsumer = isContextConsumer;
23621
- reactIs_development.isContextProvider = isContextProvider;
23622
- reactIs_development.isElement = isElement;
23623
- reactIs_development.isForwardRef = isForwardRef;
23624
- reactIs_development.isFragment = isFragment;
23625
- reactIs_development.isLazy = isLazy;
23626
- reactIs_development.isMemo = isMemo;
23627
- reactIs_development.isPortal = isPortal;
23628
- reactIs_development.isProfiler = isProfiler;
23629
- reactIs_development.isStrictMode = isStrictMode;
23630
- reactIs_development.isSuspense = isSuspense;
23631
- reactIs_development.isValidElementType = isValidElementType;
23632
- reactIs_development.typeOf = typeOf;
23633
- })();
23634
- }
23635
- return reactIs_development;
23636
- }
23637
-
23638
- var hasRequiredReactIs;
23639
- function requireReactIs() {
23640
- if (hasRequiredReactIs) return reactIs.exports;
23641
- hasRequiredReactIs = 1;
23642
- if (process.env.NODE_ENV === 'production') {
23643
- reactIs.exports = requireReactIs_production_min();
23644
- } else {
23645
- reactIs.exports = requireReactIs_development();
23646
- }
23647
- return reactIs.exports;
23648
- }
23649
-
23650
- var hoistNonReactStatics_cjs;
23651
- var hasRequiredHoistNonReactStatics_cjs;
23652
- function requireHoistNonReactStatics_cjs() {
23653
- if (hasRequiredHoistNonReactStatics_cjs) return hoistNonReactStatics_cjs;
23654
- hasRequiredHoistNonReactStatics_cjs = 1;
23655
- var reactIs = requireReactIs();
23656
-
23657
- /**
23658
- * Copyright 2015, Yahoo! Inc.
23659
- * Copyrights licensed under the New BSD License. See the accompanying LICENSE file for terms.
23660
- */
23661
- var REACT_STATICS = {
23662
- childContextTypes: true,
23663
- contextType: true,
23664
- contextTypes: true,
23665
- defaultProps: true,
23666
- displayName: true,
23667
- getDefaultProps: true,
23668
- getDerivedStateFromError: true,
23669
- getDerivedStateFromProps: true,
23670
- mixins: true,
23671
- propTypes: true,
23672
- type: true
23673
- };
23674
- var KNOWN_STATICS = {
23675
- name: true,
23676
- length: true,
23677
- prototype: true,
23678
- caller: true,
23679
- callee: true,
23680
- arguments: true,
23681
- arity: true
23682
- };
23683
- var FORWARD_REF_STATICS = {
23684
- '$$typeof': true,
23685
- render: true,
23686
- defaultProps: true,
23687
- displayName: true,
23688
- propTypes: true
23689
- };
23690
- var MEMO_STATICS = {
23691
- '$$typeof': true,
23692
- compare: true,
23693
- defaultProps: true,
23694
- displayName: true,
23695
- propTypes: true,
23696
- type: true
23697
- };
23698
- var TYPE_STATICS = {};
23699
- TYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS;
23700
- TYPE_STATICS[reactIs.Memo] = MEMO_STATICS;
23701
- function getStatics(component) {
23702
- // React v16.11 and below
23703
- if (reactIs.isMemo(component)) {
23704
- return MEMO_STATICS;
23705
- } // React v16.12 and above
23386
+ /**
23387
+ * Copyright 2015, Yahoo! Inc.
23388
+ * Copyrights licensed under the New BSD License. See the accompanying LICENSE file for terms.
23389
+ */
23390
+ var REACT_STATICS = {
23391
+ childContextTypes: true,
23392
+ contextType: true,
23393
+ contextTypes: true,
23394
+ defaultProps: true,
23395
+ displayName: true,
23396
+ getDefaultProps: true,
23397
+ getDerivedStateFromError: true,
23398
+ getDerivedStateFromProps: true,
23399
+ mixins: true,
23400
+ propTypes: true,
23401
+ type: true
23402
+ };
23403
+ var KNOWN_STATICS = {
23404
+ name: true,
23405
+ length: true,
23406
+ prototype: true,
23407
+ caller: true,
23408
+ callee: true,
23409
+ arguments: true,
23410
+ arity: true
23411
+ };
23412
+ var FORWARD_REF_STATICS = {
23413
+ '$$typeof': true,
23414
+ render: true,
23415
+ defaultProps: true,
23416
+ displayName: true,
23417
+ propTypes: true
23418
+ };
23419
+ var MEMO_STATICS = {
23420
+ '$$typeof': true,
23421
+ compare: true,
23422
+ defaultProps: true,
23423
+ displayName: true,
23424
+ propTypes: true,
23425
+ type: true
23426
+ };
23427
+ var TYPE_STATICS = {};
23428
+ TYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS;
23429
+ TYPE_STATICS[reactIs.Memo] = MEMO_STATICS;
23430
+ function getStatics(component) {
23431
+ // React v16.11 and below
23432
+ if (reactIs.isMemo(component)) {
23433
+ return MEMO_STATICS;
23434
+ } // React v16.12 and above
23706
23435
 
23707
23436
  return TYPE_STATICS[component['$$typeof']] || REACT_STATICS;
23708
23437
  }
@@ -23992,8 +23721,8 @@ var RecaptchaWrapper = makeAsyncScript(getURL, {
23992
23721
  } : {}
23993
23722
  })(ReCAPTCHA);
23994
23723
 
23995
- 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}";
23996
- styleInject(css_248z$8);
23724
+ var css_248z$9 = ".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}";
23725
+ styleInject(css_248z$9);
23997
23726
 
23998
23727
  const Recaptcha = /*#__PURE__*/React.forwardRef(({
23999
23728
  onVerify,
@@ -24036,8 +23765,8 @@ const nlpDropdownDefaultCSSData = {
24036
23765
  dropDownWrapperPadding: 0
24037
23766
  };
24038
23767
 
24039
- 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}";
24040
- styleInject(css_248z$7);
23768
+ 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 {\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}";
23769
+ styleInject(css_248z$8);
24041
23770
 
24042
23771
  const NlpDropdown = ({
24043
23772
  onSelectBlur,
@@ -24201,8 +23930,8 @@ const NlpDropdown = ({
24201
23930
  });
24202
23931
  };
24203
23932
 
24204
- 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}";
24205
- styleInject(css_248z$6);
23933
+ 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, .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}";
23934
+ styleInject(css_248z$7);
24206
23935
 
24207
23936
  const nlpInputReducer = (state, action) => {
24208
23937
  switch (action.type) {
@@ -24513,8 +24242,8 @@ const NlpInput = ({
24513
24242
  });
24514
24243
  };
24515
24244
 
24516
- 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}";
24517
- styleInject(css_248z$5);
24245
+ 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}";
24246
+ styleInject(css_248z$6);
24518
24247
 
24519
24248
  const MachineInputField = /*#__PURE__*/React.forwardRef(({
24520
24249
  width = '',
@@ -24567,11 +24296,11 @@ const MachineInputField = /*#__PURE__*/React.forwardRef(({
24567
24296
  });
24568
24297
  MachineInputField.displayName = 'MachineInputField';
24569
24298
 
24570
- 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}";
24571
- styleInject(css_248z$4);
24299
+ 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}";
24300
+ styleInject(css_248z$5);
24572
24301
 
24573
- 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}";
24574
- styleInject(css_248z$3);
24302
+ 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}";
24303
+ styleInject(css_248z$4);
24575
24304
 
24576
24305
  const Branches = ({
24577
24306
  machineInstances,
@@ -24644,7 +24373,7 @@ const Branches = ({
24644
24373
  'ff-connecting-branch-point-reverse': !evenRow
24645
24374
  })
24646
24375
  }), jsxRuntime.jsx(MachineInputField, {
24647
- width: "180px",
24376
+ width: `${machineColumnWidth}px`,
24648
24377
  runCount: runCount,
24649
24378
  options: [{
24650
24379
  label: executionEnv,
@@ -24718,8 +24447,8 @@ const Branches = ({
24718
24447
  });
24719
24448
  };
24720
24449
 
24721
- var css_248z$2 = ".ff-connecting-branch-grid-wrapper {\n box-sizing: border-box;\n}";
24722
- styleInject(css_248z$2);
24450
+ var css_248z$3 = ".ff-connecting-branch-grid-wrapper {\n box-sizing: border-box;\n}";
24451
+ styleInject(css_248z$3);
24723
24452
 
24724
24453
  const ConnectingBranches = ({
24725
24454
  machineBranchInstances,
@@ -24759,8 +24488,8 @@ const ConnectingBranches = ({
24759
24488
  });
24760
24489
  };
24761
24490
 
24762
- 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}";
24763
- styleInject(css_248z$1);
24491
+ 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}";
24492
+ styleInject(css_248z$2);
24764
24493
 
24765
24494
  const DatasetListModal = /*#__PURE__*/React.forwardRef((props, ref) => {
24766
24495
  const selectOptions = [{
@@ -24837,8 +24566,8 @@ const DatasetListModal = /*#__PURE__*/React.forwardRef((props, ref) => {
24837
24566
  });
24838
24567
  });
24839
24568
 
24840
- 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}";
24841
- styleInject(css_248z);
24569
+ 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}";
24570
+ styleInject(css_248z$1);
24842
24571
 
24843
24572
  const AddBrowserModal = /*#__PURE__*/React.forwardRef((props, ref) => {
24844
24573
  // TODO: WILL BE REMOVE IN THE FUTURE
@@ -25101,6 +24830,96 @@ const SequentialConnectingBranch = ({
25101
24830
  });
25102
24831
  };
25103
24832
 
24833
+ 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}";
24834
+ styleInject(css_248z);
24835
+
24836
+ const AttachmentButton = ({
24837
+ label,
24838
+ selectedFiles,
24839
+ onFilesChange,
24840
+ disabled = false,
24841
+ maxFileSizeMB = 5,
24842
+ // Default to 5 MB if not provided
24843
+ maxFiles = 10 // Default to 10 files if not provided
24844
+ }) => {
24845
+ const fileInputRef = React.useRef(null);
24846
+ const [fileError, setFileError] = React.useState('');
24847
+ const maxFileSizeBytes = maxFileSizeMB * 1024 * 1024;
24848
+ const handleAttachmentClick = () => {
24849
+ fileInputRef.current?.click();
24850
+ };
24851
+ const handleFileChange = () => {
24852
+ setFileError('');
24853
+ if (fileInputRef.current?.files) {
24854
+ const files = Array.from(fileInputRef.current.files);
24855
+ const duplicateFiles = files.filter(file => selectedFiles.some(selectedFile => selectedFile.name === file.name));
24856
+ if (duplicateFiles.length > 0) {
24857
+ setFileError('This file is already selected.');
24858
+ fileInputRef.current.value = '';
24859
+ return;
24860
+ }
24861
+ if (selectedFiles.length + files.length > maxFiles) {
24862
+ setFileError(`You can only select up to ${maxFiles} files.`);
24863
+ fileInputRef.current.value = '';
24864
+ return;
24865
+ }
24866
+ const oversizedFiles = files.filter(file => file.size > maxFileSizeBytes);
24867
+ if (oversizedFiles.length > 0) {
24868
+ setFileError(`Each file must be less than ${maxFileSizeMB} MB.`);
24869
+ fileInputRef.current.value = '';
24870
+ return;
24871
+ }
24872
+ onFilesChange([...selectedFiles, ...files]);
24873
+ fileInputRef.current.value = '';
24874
+ }
24875
+ };
24876
+ const handleDeleteFile = index => {
24877
+ const updatedFiles = [...selectedFiles];
24878
+ updatedFiles.splice(index, 1);
24879
+ onFilesChange(updatedFiles);
24880
+ };
24881
+ return jsxRuntime.jsxs("div", {
24882
+ children: [jsxRuntime.jsx(Typography, {
24883
+ fontWeight: "semi-bold",
24884
+ children: label
24885
+ }), selectedFiles.length === 0 && jsxRuntime.jsx(Button$1, {
24886
+ variant: "primary",
24887
+ label: "Select Files",
24888
+ size: "medium",
24889
+ onClick: handleAttachmentClick,
24890
+ disabled: disabled
24891
+ }), jsxRuntime.jsx("input", {
24892
+ type: "file",
24893
+ ref: fileInputRef,
24894
+ className: "ff-input-field",
24895
+ onChange: handleFileChange,
24896
+ multiple: true,
24897
+ accept: "*"
24898
+ }), fileError && jsxRuntime.jsx(Toaster, {
24899
+ isOpen: !!fileError,
24900
+ variant: "info",
24901
+ toastTitle: "Error",
24902
+ toastMessage: fileError,
24903
+ zIndex: 10000000
24904
+ }), selectedFiles.map((file, index) => jsxRuntime.jsxs("div", {
24905
+ className: "ff-attachment-files",
24906
+ children: [jsxRuntime.jsx(Typography, {
24907
+ color: "var(--brand-color)",
24908
+ children: file.name
24909
+ }), jsxRuntime.jsx(Icon, {
24910
+ name: "delete",
24911
+ color: "var(--ff-delete-button-attachment)",
24912
+ onClick: () => handleDeleteFile(index)
24913
+ }), index === selectedFiles.length - 1 && selectedFiles.length < maxFiles && jsxRuntime.jsx(Icon, {
24914
+ name: "add_file",
24915
+ height: 24,
24916
+ width: 24,
24917
+ onClick: handleAttachmentClick
24918
+ })]
24919
+ }, file.name))]
24920
+ });
24921
+ };
24922
+
25104
24923
  function findAndInsert(data, key, targetId, newEntry, insertPosition, childrenKey = 'children' // Allow dynamic key for nested children
25105
24924
  ) {
25106
24925
  function recursiveSearch(items) {
@@ -30452,6 +30271,7 @@ exports.Accordion = Accordion;
30452
30271
  exports.AddResourceButton = AddButton;
30453
30272
  exports.AllProjectsDropdown = AllProjectsDropdown;
30454
30273
  exports.AppHeader = AppHeader;
30274
+ exports.AttachmentButton = AttachmentButton;
30455
30275
  exports.Button = Button$1;
30456
30276
  exports.Checkbox = Checkbox;
30457
30277
  exports.Chip = Chip;