pixel-react 1.4.6 → 1.4.7

Sign up to get free protection for your applications and to get access to all the features.
Files changed (166) hide show
  1. package/.yarn/install-state.gz +0 -0
  2. package/lib/StyleGuide/ColorPalette/ColorPalette.stories.d.ts +6 -0
  3. package/lib/StyleGuide/Typography/Typography.stories.d.ts +6 -0
  4. package/lib/components/Accordion/Accordion.stories.d.ts +6 -0
  5. package/lib/components/AddButton/AddButton.d.ts +5 -0
  6. package/lib/components/AddButton/AddButton.stories.d.ts +6 -0
  7. package/lib/components/AddButton/index.d.ts +1 -0
  8. package/lib/components/AddButton/types.d.ts +4 -0
  9. package/lib/components/AddResourceButton/AddButton.stories.d.ts +8 -0
  10. package/lib/components/AllProjectsDropdown/AllProjectsDropdown.d.ts +1 -1
  11. package/lib/components/AllProjectsDropdown/AllProjectsDropdown.stories.d.ts +7 -0
  12. package/lib/components/AllProjectsDropdown/types.d.ts +2 -0
  13. package/lib/components/AppHeader/AppHeader.stories.d.ts +7 -0
  14. package/lib/components/AppHeader/types.d.ts +1 -0
  15. package/lib/components/AttachImage/AttachImage.stories.d.ts +7 -0
  16. package/lib/components/AttachmentButton/AttachmentButton.stories.d.ts +9 -0
  17. package/lib/components/Avatar/Avatar.stories.d.ts +10 -0
  18. package/lib/components/Button/Button.stories.d.ts +13 -0
  19. package/lib/components/Charts/BarChart/BarChart.stories.d.ts +6 -0
  20. package/lib/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.d.ts +7 -0
  21. package/lib/components/Charts/DonutChart/DonutChart.stories.d.ts +6 -0
  22. package/lib/components/Charts/IconRadialChart/IconRadialChart.stories.d.ts +8 -0
  23. package/lib/components/Charts/LineChart/LineChart.stories.d.ts +7 -0
  24. package/lib/components/Charts/MultiRadialChart/MultiRadialChart.stories.d.ts +8 -0
  25. package/lib/components/Charts/PieChart/PieChart.stories.d.ts +7 -0
  26. package/lib/components/Charts/RadialChart/RadialChart.stories.d.ts +6 -0
  27. package/lib/components/Checkbox/Checkbox.stories.d.ts +8 -0
  28. package/lib/components/Chip/Chip.stories.d.ts +14 -0
  29. package/lib/components/ConnectingBranch/ConnectingBranch.stories.d.ts +6 -0
  30. package/lib/components/DatePicker/DatePicker.stories.d.ts +9 -0
  31. package/lib/components/DragAndDrop/DragAndDrop.stories.d.ts +6 -0
  32. package/lib/components/Drawer/Drawer.stories.d.ts +12 -0
  33. package/lib/components/EditTextField/EditTextField.stories.d.ts +10 -0
  34. package/lib/components/Editor/Editor.stories.d.ts +6 -0
  35. package/lib/components/Excel/ExcelFile.stories.d.ts +6 -0
  36. package/lib/components/ExcelFile/ChangeExcelStyles.d.ts +14 -0
  37. package/lib/components/ExcelFile/ColorBarSelector/ColorBarSelector.d.ts +8 -0
  38. package/lib/components/ExcelFile/ContextMenu/ContextMenu.d.ts +4 -0
  39. package/lib/components/ExcelFile/ExcelFile/Excel/ActiveCell.d.ts +7 -0
  40. package/lib/components/ExcelFile/ExcelFile/Excel/Cell.d.ts +4 -0
  41. package/lib/components/ExcelFile/ExcelFile/Excel/ColumnIndicator.d.ts +5 -0
  42. package/lib/components/ExcelFile/ExcelFile/Excel/Copied.d.ts +3 -0
  43. package/lib/components/ExcelFile/ExcelFile/Excel/CornerIndicator.d.ts +5 -0
  44. package/lib/components/ExcelFile/ExcelFile/Excel/DataEditor.d.ts +5 -0
  45. package/lib/components/ExcelFile/ExcelFile/Excel/DataViewer.d.ts +8 -0
  46. package/lib/components/ExcelFile/ExcelFile/Excel/FloatingRect.d.ts +10 -0
  47. package/lib/components/ExcelFile/ExcelFile/Excel/HeaderRow.d.ts +3 -0
  48. package/lib/components/ExcelFile/ExcelFile/Excel/Row.d.ts +3 -0
  49. package/lib/components/ExcelFile/ExcelFile/Excel/RowIndicator.d.ts +5 -0
  50. package/lib/components/ExcelFile/ExcelFile/Excel/Selected.d.ts +3 -0
  51. package/lib/components/ExcelFile/ExcelFile/Excel/Spreadsheet.d.ts +80 -0
  52. package/lib/components/ExcelFile/ExcelFile/Excel/Table.d.ts +3 -0
  53. package/lib/components/ExcelFile/ExcelFile/Excel/actions.d.ts +174 -0
  54. package/lib/components/ExcelFile/ExcelFile/Excel/areModelsEqual.d.ts +1 -0
  55. package/lib/components/ExcelFile/ExcelFile/Excel/context.d.ts +8 -0
  56. package/lib/components/ExcelFile/ExcelFile/Excel/engine/engine.d.ts +22 -0
  57. package/lib/components/ExcelFile/ExcelFile/Excel/engine/formula.d.ts +17 -0
  58. package/lib/components/ExcelFile/ExcelFile/Excel/engine/index.d.ts +2 -0
  59. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-graph.d.ts +21 -0
  60. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-hash.d.ts +3 -0
  61. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-set.d.ts +24 -0
  62. package/lib/components/ExcelFile/ExcelFile/Excel/index.d.ts +13 -0
  63. package/lib/components/ExcelFile/ExcelFile/Excel/matrix.d.ts +67 -0
  64. package/lib/components/ExcelFile/ExcelFile/Excel/point-range.d.ts +22 -0
  65. package/lib/components/ExcelFile/ExcelFile/Excel/point.d.ts +11 -0
  66. package/lib/components/ExcelFile/ExcelFile/Excel/reducer.d.ts +27 -0
  67. package/lib/components/ExcelFile/ExcelFile/Excel/selection.d.ts +95 -0
  68. package/lib/components/ExcelFile/ExcelFile/Excel/types.d.ts +178 -0
  69. package/lib/components/ExcelFile/ExcelFile/Excel/use-dispatch.d.ts +3 -0
  70. package/lib/components/ExcelFile/ExcelFile/Excel/use-selector.d.ts +3 -0
  71. package/lib/components/ExcelFile/ExcelFile/Excel/util.d.ts +44 -0
  72. package/lib/components/ExcelFile/ExcelFile/ExcelFile.d.ts +19 -0
  73. package/lib/components/ExcelFile/ExcelFile.stories.d.ts +6 -0
  74. package/lib/components/ExcelFile/ExcelSheetBar/ExcelSheetBar.d.ts +12 -0
  75. package/lib/components/ExcelFile/ExcelToolBar/ExcelToolBar.d.ts +15 -0
  76. package/lib/components/ExcelFile/ImportExcelStyles.d.ts +24 -0
  77. package/lib/components/ExcelFile/Types.d.ts +129 -0
  78. package/lib/components/ExcelFile/index.d.ts +1 -0
  79. package/lib/components/ExpandableMenu/ExpandableMenu.stories.d.ts +7 -0
  80. package/lib/components/FF_Captcha/captcha.stories.d.ts +8 -0
  81. package/lib/components/FileDropzone/FileDropzone.stories.d.ts +8 -0
  82. package/lib/components/Form/Form.stories.d.ts +7 -0
  83. package/lib/components/GridLayout/GridLayout.stories.d.ts +8 -0
  84. package/lib/components/HighlightText/HighlightText.stories.d.ts +6 -0
  85. package/lib/components/Icon/Icon.stories.d.ts +8 -0
  86. package/lib/components/IconButton/IconButton.stories.d.ts +7 -0
  87. package/lib/components/IconRadioGroup/IconRadioGroup.stories.d.ts +7 -0
  88. package/lib/components/Input/Input.stories.d.ts +9 -0
  89. package/lib/components/InputWithDropdown/InputWithDropdown.stories.d.ts +9 -0
  90. package/lib/components/LabelEditTextField/LabelEditTextField.stories.d.ts +13 -0
  91. package/lib/components/LazyLoad/LazyLoad.stories.d.ts +6 -0
  92. package/lib/components/MachineInputField/MachineInputField.stories.d.ts +6 -0
  93. package/lib/components/MenuOption/MenuOption.stories.d.ts +16 -0
  94. package/lib/components/MenuOption/types.d.ts +1 -1
  95. package/lib/components/MiniModal/MiniModal.stories.d.ts +10 -0
  96. package/lib/components/Modal/Modal.stories.d.ts +7 -0
  97. package/lib/components/Modal/types.d.ts +4 -2
  98. package/lib/components/ModulesChip/ModuleChip.stories.d.ts +6 -0
  99. package/lib/components/MultiSelect/MultiSelect.stories.d.ts +11 -0
  100. package/lib/components/NLPInput/NlpInput.stories.d.ts +7 -0
  101. package/lib/components/Paper/Paper.stories.d.ts +11 -0
  102. package/lib/components/RadioButton/RadioButton.stories.d.ts +10 -0
  103. package/lib/components/RadioGroup/RadioGroup.stories.d.ts +9 -0
  104. package/lib/components/Search/Search.stories.d.ts +6 -0
  105. package/lib/components/Select/Select.stories.d.ts +14 -0
  106. package/lib/components/Select/components/Dropdown/Dropdown.d.ts +4 -0
  107. package/lib/components/Select/components/Dropdown/dropdownTypes.d.ts +17 -0
  108. package/lib/components/SequentialConnectingBranch/SequentialConnectingBranch.stories.d.ts +6 -0
  109. package/lib/components/StateDropdown/StateDropdown.stories.d.ts +10 -0
  110. package/lib/components/StatusButton/StatusButton.stories.d.ts +14 -0
  111. package/lib/components/StatusCard/StatusCard.stories.d.ts +11 -0
  112. package/lib/components/Table/Table.stories.d.ts +13 -0
  113. package/lib/components/TableTree/TableTree.stories.d.ts +7 -0
  114. package/lib/components/Tabs/Tabs.stories.d.ts +9 -0
  115. package/lib/components/TextArea/Textarea.stories.d.ts +9 -0
  116. package/lib/components/Toast/Toast.stories.d.ts +6 -0
  117. package/lib/components/Toastify/Toastify.stories.d.ts +6 -0
  118. package/lib/components/Toggle/Toggle.stories.d.ts +12 -0
  119. package/lib/components/Tooltip/Tooltip.stories.d.ts +15 -0
  120. package/lib/components/Typography/Typography.stories.d.ts +10 -0
  121. package/lib/components/VariableInput/VariableInput.stories.d.ts +6 -0
  122. package/lib/index.d.ts +7 -2
  123. package/lib/index.esm.js +116 -87
  124. package/lib/index.esm.js.map +1 -1
  125. package/lib/index.js +116 -87
  126. package/lib/index.js.map +1 -1
  127. package/lib/tsconfig.tsbuildinfo +1 -1
  128. package/lib/utils/capitalize/capitalize.d.ts +1 -0
  129. package/lib/utils/checkEmpty/checkEmpty.stories.d.ts +6 -0
  130. package/lib/utils/compareArrays/compareArrays.stories.d.ts +6 -0
  131. package/lib/utils/compareObjects/compareObjects.stories.d.ts +6 -0
  132. package/lib/utils/debounce/debounce.stories.d.ts +6 -0
  133. package/lib/utils/ffID/ffID.stories.d.ts +6 -0
  134. package/lib/utils/find/findAndInsert.d.ts +7 -0
  135. package/lib/utils/find/findAndInsert.stories.d.ts +7 -0
  136. package/lib/utils/findAndInsert/findAndInsert.stories.d.ts +7 -0
  137. package/lib/utils/getEncryptedData/getEncryptedData.stories.d.ts +6 -0
  138. package/lib/utils/getExtension/getExtension.stories.d.ts +6 -0
  139. package/lib/utils/getSequentialPayload/getSequentialPayload.stories.d.ts +10 -0
  140. package/lib/utils/throttle/throttle.stories.d.ts +6 -0
  141. package/lib/utils/truncateText/truncateText.stories.d.ts +6 -0
  142. package/package.json +2 -2
  143. package/src/StyleGuide/ColorPalette/colorPaletteList.ts +82 -12
  144. package/src/assets/Themes/BaseTheme.scss +36 -15
  145. package/src/assets/Themes/DarkTheme.scss +15 -1
  146. package/src/assets/icons/hide_access_icon.svg +3 -0
  147. package/src/components/AllProjectsDropdown/AllProjectsDropdown.scss +58 -8
  148. package/src/components/AllProjectsDropdown/AllProjectsDropdown.stories.tsx +83 -75
  149. package/src/components/AllProjectsDropdown/AllProjectsDropdown.tsx +31 -18
  150. package/src/components/AllProjectsDropdown/types.ts +2 -0
  151. package/src/components/AppHeader/AppHeader.scss +2 -2
  152. package/src/components/AppHeader/AppHeader.stories.tsx +5 -1
  153. package/src/components/AppHeader/AppHeader.tsx +107 -101
  154. package/src/components/AppHeader/types.ts +1 -0
  155. package/src/components/EditTextField/EditTextField.tsx +3 -5
  156. package/src/components/Icon/iconList.ts +2 -2
  157. package/src/components/MenuOption/MenuOption.scss +24 -27
  158. package/src/components/MenuOption/MenuOption.stories.tsx +90 -35
  159. package/src/components/MenuOption/MenuOption.tsx +18 -16
  160. package/src/components/MenuOption/types.ts +1 -1
  161. package/src/components/Modal/Modal.stories.tsx +2 -2
  162. package/src/components/Modal/Modal.tsx +6 -2
  163. package/src/components/Modal/modal.scss +2 -3
  164. package/src/components/Modal/types.ts +4 -2
  165. package/src/utils/capitalize/capitalize.stories.tsx +44 -0
  166. package/src/utils/capitalize/capitalize.tsx +4 -0
package/lib/index.js CHANGED
@@ -341,6 +341,8 @@ const SvgFullAccessIcon = (props) => /* @__PURE__ */ React__namespace.createElem
341
341
 
342
342
  const SvgViewAccessIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M14.911 7.18924C14.786 7.01815 11.806 3 7.99994 3C4.19392 3 1.21377 7.01815 1.08884 7.18907C0.970387 7.35139 0.970387 7.57153 1.08884 7.73385C1.21377 7.90494 4.19392 11.9231 7.99994 11.9231C11.806 11.9231 14.786 7.90491 14.911 7.73398C15.0297 7.5717 15.0297 7.35139 14.911 7.18924ZM7.99994 11C5.1964 11 2.76824 8.33309 2.04946 7.46123C2.76731 6.5886 5.19039 3.92307 7.99994 3.92307C10.8033 3.92307 13.2313 6.58953 13.9504 7.46186C13.2326 8.33445 10.8095 11 7.99994 11Z", fill: "currentColor" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M7.99996 4.69238C6.47302 4.69238 5.23071 5.9347 5.23071 7.46163C5.23071 8.98856 6.47302 10.2309 7.99996 10.2309C9.52689 10.2309 10.7692 8.98856 10.7692 7.46163C10.7692 5.9347 9.52689 4.69238 7.99996 4.69238ZM7.99996 9.30778C6.98195 9.30778 6.15381 8.47961 6.15381 7.46163C6.15381 6.44365 6.98198 5.61548 7.99996 5.61548C9.01794 5.61548 9.84611 6.44365 9.84611 7.46163C9.84611 8.47961 9.01797 9.30778 7.99996 9.30778Z", fill: "currentColor" }));
343
343
 
344
+ const SvgHideAccessIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 16 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.71305 9.66393C5.04428 10.4052 6.50768 10.7961 7.94891 10.7961H8.00016C9.00732 10.803 10.0251 10.6177 11.002 10.2561L12.2785 11.5326C12.3944 11.6486 12.5463 11.7067 12.6985 11.7067C12.8507 11.7067 13.0026 11.6486 13.1185 11.5326C13.3504 11.3008 13.3504 10.9248 13.1185 10.693L2.89276 0.467238C2.66089 0.235367 2.28496 0.235367 2.05308 0.467238C1.82121 0.699108 1.82121 1.07504 2.05308 1.30691L2.82682 2.08064C1.84059 2.78094 0.969356 3.67405 0.272807 4.70528C-0.0909357 5.24433 -0.0909357 5.94088 0.272807 6.48025C1.17123 7.81053 2.36089 8.91145 3.71274 9.66424L3.71305 9.66393ZM7.92234 7.17586C7.10986 7.13617 6.45644 6.48274 6.41675 5.67026L7.92234 7.17586ZM1.25716 5.36933C1.91277 4.39841 2.74182 3.56718 3.68024 2.93375L5.39333 4.64684C5.28583 4.94215 5.2274 5.26027 5.2274 5.59214C5.2274 7.12117 6.47144 8.36521 8.00047 8.36521C8.33234 8.36521 8.65045 8.30646 8.94576 8.19896L10.0629 9.31613C9.3995 9.50894 8.72233 9.60831 8.05203 9.60831H8.00484H7.99672C6.7408 9.61675 5.46083 9.27738 4.29117 8.62645C3.10119 7.96397 2.05215 6.9918 1.25779 5.81557C1.16623 5.67995 1.16623 5.50495 1.25779 5.36964L1.25716 5.36933ZM9.58103 5.47651L10.6163 6.51181C10.7179 6.224 10.7732 5.91463 10.7732 5.59245C10.7732 4.06342 9.52916 2.81938 8.00012 2.81938C7.67794 2.81938 7.36857 2.87469 7.08077 2.97625L8.11606 4.01154C8.89792 4.06842 9.52416 4.69465 9.58103 5.47651ZM12.2875 1.52096C13.6394 2.27376 14.8291 3.37468 15.7275 4.70497L15.7272 4.70465C16.0909 5.2437 16.0909 5.94025 15.7272 6.47931C15.0356 7.50335 14.1716 8.39114 13.1938 9.08925L12.341 8.23646C13.2706 7.60491 14.0922 6.77867 14.7431 5.81494C14.8347 5.67963 14.8347 5.50464 14.7431 5.36901C13.9488 4.19279 12.8997 3.22062 11.7097 2.55813C10.5401 1.90721 9.25854 1.5669 8.00419 1.57628H7.99606H7.94888C7.28764 1.57628 6.61953 1.67284 5.96485 1.86033L5.02393 0.919414C5.97673 0.570046 6.96796 0.3888 7.94888 0.3888H8.00013H8.05137C9.49291 0.3888 10.9563 0.779729 12.2875 1.52096Z", fill: "currentColor" }));
345
+
344
346
  const SvgAddLocator = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2.79688 8.32801V2.87501C2.79688 1.29432 4.09013 -0.000244141 5.67169 -0.000244141H11.1247C12.7063 -0.000244141 13.9995 1.29432 13.9995 2.87501V8.32801C13.9995 9.90869 12.7063 11.2033 11.1247 11.2033H5.67169C4.09013 11.2033 2.79688 9.90869 2.79688 8.32801ZM12.1402 1.85963C11.8708 1.59029 11.5056 1.43863 11.1247 1.43782H5.67169C5.29077 1.43874 4.9257 1.59044 4.65631 1.85975C4.38691 2.12907 4.2351 2.49408 4.23406 2.87501V8.32801C4.23522 8.70889 4.38707 9.07384 4.65644 9.34313C4.9258 9.61242 5.2908 9.76415 5.67169 9.76519H11.1247C11.5056 9.76427 11.8707 9.61257 12.1401 9.34326C12.4095 9.07394 12.5613 8.70893 12.5623 8.32801V2.87501C12.5614 2.49405 12.4096 2.12896 12.1402 1.85963ZM0.718813 2.23969C1.11388 2.23969 1.43763 2.56344 1.43763 2.95851V10.7661C1.43763 11.7711 2.26363 12.5625 3.23444 12.5625H11.0416C11.4376 12.5625 11.7609 12.8858 11.7609 13.2813C11.7609 13.6768 11.4371 14.0001 11.0416 14.0001H3.23444C1.43763 14.0001 0 12.5262 0 10.7661V2.95851C0 2.56301 0.323313 2.23969 0.718813 2.23969ZM7.67944 4.88263V3.28576C7.67967 3.09514 7.75537 2.91237 7.88999 2.77742C8.02462 2.64247 8.2072 2.56632 8.39781 2.56563C8.58843 2.56644 8.77099 2.64261 8.90566 2.77752C9.04033 2.91243 9.11617 3.09514 9.11663 3.28576V4.88263H10.7148C11.1112 4.88263 11.4341 5.20682 11.4341 5.60144C11.4341 5.99738 11.1108 6.32026 10.7148 6.32026H9.11663V7.92019C9.11663 8.31569 8.79244 8.63857 8.39781 8.63857C8.00231 8.63857 7.679 8.31569 7.679 7.92019V6.32026H6.08081C5.68531 6.32026 5.362 5.99694 5.362 5.60144C5.362 5.20638 5.68575 4.88263 6.08081 4.88263H7.67944Z", fill: "currentColor" }));
345
347
 
346
348
  const SvgPlusUserIcon = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "1em", height: "1em", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M7 1C7 0.447715 6.55228 0 6 0C5.44772 0 5 0.447715 5 1V2.49994C5 3.88062 3.88074 4.99988 2.50006 4.99988H1C0.447715 4.99988 0 5.44759 0 5.99988C0 6.55216 0.447715 6.99988 1 6.99988H2.5C3.88071 6.99988 5 8.11917 5 9.49988V11C5 11.5523 5.44772 12 6 12C6.55228 12 7 11.5523 7 11V9.49988C7 8.11917 8.11929 6.99988 9.5 6.99988H11C11.5523 6.99988 12 6.55216 12 5.99988C12 5.44759 11.5523 4.99988 11 4.99988H9.49994C8.11926 4.99988 7 3.88062 7 2.49994V1Z", fill: "currentColor" }));
@@ -679,6 +681,7 @@ Components['linked_defects'] = SvgLinkedDefects;
679
681
  Components['no_access_icon'] = SvgNoAccessIcon;
680
682
  Components['full_access_icon'] = SvgFullAccessIcon;
681
683
  Components['view_access_icon'] = SvgViewAccessIcon;
684
+ Components['hide_access_icon'] = SvgHideAccessIcon;
682
685
  Components['eye_closed'] = SvgEyeClosed;
683
686
  Components['attachment_icon'] = SvgAttachmentIcon;
684
687
  Components['authorization_icon'] = SvgAuthorizationIcon;
@@ -913,7 +916,7 @@ function useEscapeKey(key) {
913
916
  };
914
917
  }
915
918
 
916
- var css_248z$14 = ":root {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --text-color: #1e161f;\n --description-text: #7a7a7a;\n --click-able-text-color: #71347b;\n --custom-table-header-bg-color: #EFE1F9;\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 --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 --sub-header-primary: #301349;\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 --variable-dropdown-bg: #ffffff;\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 --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\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 --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #f7ebff;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-avatar-background-color: #71347b;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4B494C;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #F7ECF8;\n --ff-search-filed-bg-color: #ffffff;\n}\n\n:root {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --text-color: #e8e0e9;\n --description-text: #d9d9d9;\n --click-able-text-color: #e8e0e9;\n --custom-table-header-bg-color: #EFE1F9;\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 --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(130, 60, 141, 0.1019607843);\n --file-dropzone-selected-color: rgba(130, 60, 141, 0.2);\n --file-details-container-shadow: rgba(255, 252, 255, 0.6);\n --file-details-bg: #0d0d0d;\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 --sub-header-primary: #301349;\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 --details-page-value-color: #808080;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-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 --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --avatar-background-color: #71347b;\n --avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #333234;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4B494C;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-search-field-hover-color: #F7ECF8;\n --ff-search-filed-bg-color: #ffffff;\n}\n\n.ff-light-theme {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --text-color: #1e161f;\n --description-text: #7a7a7a;\n --click-able-text-color: #71347b;\n --custom-table-header-bg-color: #EFE1F9;\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 --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 --sub-header-primary: #301349;\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 --variable-dropdown-bg: #ffffff;\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 --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\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 --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #f7ebff;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-avatar-background-color: #71347b;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4B494C;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #F7ECF8;\n --ff-search-filed-bg-color: #ffffff;\n}\n\n.ff-dark-theme {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --text-color: #e8e0e9;\n --description-text: #d9d9d9;\n --click-able-text-color: #e8e0e9;\n --custom-table-header-bg-color: #EFE1F9;\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 --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(130, 60, 141, 0.1019607843);\n --file-dropzone-selected-color: rgba(130, 60, 141, 0.2);\n --file-details-container-shadow: rgba(255, 252, 255, 0.6);\n --file-details-bg: #0d0d0d;\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 --sub-header-primary: #301349;\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 --details-page-value-color: #808080;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-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 --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --avatar-background-color: #71347b;\n --avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #333234;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4B494C;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-search-field-hover-color: #F7ECF8;\n --ff-search-filed-bg-color: #ffffff;\n}";
919
+ var css_248z$14 = ":root {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --text-color: #1e161f;\n --description-text: #7a7a7a;\n --click-able-text-color: #71347b;\n --custom-table-header-bg-color: #efe1f9;\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 --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 --confirm-tick-icon-color: #5ca700;\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\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 --sub-header-primary: #301349;\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 --variable-dropdown-bg: #ffffff;\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 --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\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 --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #f7ebff;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-avatar-background-color: #71347b;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4B494C;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n}\n\n:root {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --text-color: #e8e0e9;\n --description-text: #d9d9d9;\n --click-able-text-color: #e8e0e9;\n --custom-table-header-bg-color: #EFE1F9;\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 --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(130, 60, 141, 0.1019607843);\n --file-dropzone-selected-color: rgba(130, 60, 141, 0.2);\n --file-details-container-shadow: rgba(255, 252, 255, 0.6);\n --file-details-bg: #0d0d0d;\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 --sub-header-primary: #301349;\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 --details-page-value-color: #808080;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --confirm-tick-icon-color: #5CA700;\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\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 --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --avatar-background-color: #71347b;\n --avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #333234;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4B494C;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-search-field-hover-color: #F7ECF8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n}\n\n.ff-light-theme {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --text-color: #1e161f;\n --description-text: #7a7a7a;\n --click-able-text-color: #71347b;\n --custom-table-header-bg-color: #efe1f9;\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 --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 --confirm-tick-icon-color: #5ca700;\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\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 --sub-header-primary: #301349;\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 --variable-dropdown-bg: #ffffff;\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 --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\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 --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --ff-icon-hover-fill-color: #f7ebff;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-avatar-background-color: #71347b;\n --ff-avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #f0e7f4;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4B494C;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n}\n\n.ff-dark-theme {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --text-color: #e8e0e9;\n --description-text: #d9d9d9;\n --click-able-text-color: #e8e0e9;\n --custom-table-header-bg-color: #EFE1F9;\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 --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(130, 60, 141, 0.1019607843);\n --file-dropzone-selected-color: rgba(130, 60, 141, 0.2);\n --file-details-container-shadow: rgba(255, 252, 255, 0.6);\n --file-details-bg: #0d0d0d;\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 --sub-header-primary: #301349;\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 --details-page-value-color: #808080;\n --label-edit-text-label-color: #71347b;\n --label-edit-text-background-color: #ffffff;\n --label-edit-error-text: #e42525;\n --label-edit-confirm-icon: #0dad66;\n --label-edit-cancel-icon: #e42525;\n --delete-icon-color: #e42525;\n --confirm-tick-icon-color: #5CA700;\n --brand-color-border: linear-gradient(94.23deg, rgba(113, 52, 123, 0.4) 16.33%, rgba(70, 22, 77, 0.4) 80.07%);\n --alert-modal-background-color: linear-gradient(94.23deg, rgba(228, 37, 37, 0.4) 16.33%, rgba(201, 0, 0, 0.4) 80.07%);\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 --table-header-text-color: #252c37;\n --table-column-text-color: #200624;\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --ff-icon-hover-fill-color: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --avatar-background-color: #71347b;\n --avatar-icon-color: #ffffff;\n --ff-editor-line-bg: #333234;\n --ff-editor-gutter-color: #ded5e5;\n --ff-line-number-bg: #592f7c;\n --ff-line-number-color: #ffffff;\n --excel-sheet-button-color: #e9b5ff;\n --icon-hover-color: #f7ecf8;\n --ff-editor-border-color: #f0e7f4;\n --ff-icon-hover-bg-color: #f7ecf8;\n --modal-background-color: rgba(18, 18, 18, 0.2);\n --modal-alert-header-color: #db1919;\n --ff-status-card-text-color: #ffffff;\n --ff-card-status-text-color: #8a8a8a;\n --ff-card-passed-status-bg-color: #179c5f;\n --ff-card-failed-status-bg-color: #9c1732;\n --ff-card-warning-status-bg-color: #e2750f;\n --ff-card-skipped-status-bg-color: #a83fc4;\n --ff-card-flaky-status-bg-color: #3f5ac4;\n --ff-toggle-switch-off-color: #4B494C;\n --ff-toggle-switch-shadow-color: rgba(87, 87, 87, 0.5019607843);\n --ff-search-field-hover-color: #F7ECF8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-all-projects-default-color: rgba(255, 255, 255, 0.2);\n}";
917
920
  styleInject(css_248z$14);
918
921
 
919
922
  const ThemeContext = /*#__PURE__*/React.createContext(undefined);
@@ -2875,7 +2878,7 @@ const StatusButton = ({
2875
2878
  });
2876
2879
  };
2877
2880
 
2878
- var css_248z$O = "@font-face {\n font-family: \"Poppins\";\n font-weight: 400;\n src: local(\"Poppins-Regular\"), url(../../assets/fonts/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n font-family: \"Poppins\";\n font-weight: 500;\n src: local(\"Poppins-Medium\"), url(../../assets/fonts/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n font-family: \"Poppins\";\n font-weight: 600;\n src: local(\"Poppins-SemiBold\"), url(../../assets/fonts/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n font-family: \"Poppins\";\n font-weight: 700;\n src: local(\"Poppins-Bold\"), url(../../assets/fonts/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-option-card .ff-option-wrapper .ff-options {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\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\n.ff-option-card {\n position: fixed;\n margin: 4px;\n}\n.ff-option-card .ff-option-wrapper {\n border: 1px solid var(--option-card-border-color);\n background: var(--option-card-bg-color);\n overflow: hidden;\n min-height: 32px;\n min-width: 112px;\n width: max-content;\n border-radius: 4px;\n}\n.ff-option-card .ff-option-wrapper .ff-options {\n cursor: pointer;\n border-radius: 3px;\n display: flex;\n align-items: center;\n padding: 8px;\n gap: 8px;\n}\n.ff-option-card .ff-option-wrapper .ff-options:hover {\n background-color: var(--hover-color);\n}\n.ff-option-card .ff-option-wrapper .ff-options label {\n cursor: pointer;\n}\n.ff-option-card .ff-option-wrapper .ff-disable-option {\n opacity: 0.5;\n cursor: no-drop;\n}\n.ff-option-card .ff-option-wrapper .ff-disable-option label {\n cursor: no-drop;\n}";
2881
+ var css_248z$O = "@font-face {\n font-family: \"Poppins\";\n font-weight: 400;\n src: local(\"Poppins-Regular\"), url(../../assets/fonts/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n font-family: \"Poppins\";\n font-weight: 500;\n src: local(\"Poppins-Medium\"), url(../../assets/fonts/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n font-family: \"Poppins\";\n font-weight: 600;\n src: local(\"Poppins-SemiBold\"), url(../../assets/fonts/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n font-family: \"Poppins\";\n font-weight: 700;\n src: local(\"Poppins-Bold\"), url(../../assets/fonts/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-option-card .ff-options {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\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\n.ff-option-card {\n position: fixed;\n margin: 4px;\n border: 1px solid var(--option-card-border-color);\n background: var(--option-card-bg-color);\n overflow: hidden;\n min-height: 32px;\n min-width: 112px;\n width: max-content;\n border-radius: 4px;\n}\n.ff-option-card .ff-options {\n cursor: pointer;\n border-radius: 3px;\n display: flex;\n align-items: center;\n padding: 8px;\n gap: 8px;\n}\n.ff-option-card .ff-options:hover {\n background-color: var(--hover-color);\n}\n.ff-option-card .ff-options label {\n cursor: pointer;\n}\n.ff-option-card .ff-disable-option {\n opacity: 0.5;\n cursor: no-drop;\n}\n.ff-option-card .ff-disable-option label {\n cursor: no-drop;\n}";
2879
2882
  styleInject(css_248z$O);
2880
2883
 
2881
2884
  const Option$1 = ({
@@ -2904,21 +2907,23 @@ const OptionCard = ({
2904
2907
  menuRef,
2905
2908
  closeDropdown,
2906
2909
  zIndex,
2907
- dropdownPosition
2910
+ dropdownPlacement
2908
2911
  }) => {
2909
2912
  const themeContext = React.useContext(ThemeContext);
2910
2913
  const currentTheme = themeContext?.currentTheme;
2911
2914
  const [optionsHeight, setOptionsHeight] = React.useState(0);
2915
+ const [optionsWidth, setOptionsWidth] = React.useState(0);
2912
2916
  const optionCardRef = React.useRef(null);
2913
2917
  React.useEffect(() => {
2914
2918
  if (optionCardRef?.current) {
2915
2919
  const rect = optionCardRef?.current?.getBoundingClientRect();
2916
2920
  setOptionsHeight(rect?.height);
2921
+ setOptionsWidth(rect?.width);
2917
2922
  }
2918
2923
  }, []);
2919
2924
  useClickOutside(menuRef, closeDropdown, [optionCardRef]);
2920
2925
  const style = (() => {
2921
- switch (dropdownPosition) {
2926
+ switch (dropdownPlacement) {
2922
2927
  case 'top':
2923
2928
  return {
2924
2929
  top: menuPosition.top - optionsHeight - 7,
@@ -2926,18 +2931,18 @@ const OptionCard = ({
2926
2931
  };
2927
2932
  case 'down':
2928
2933
  return {
2929
- top: menuPosition.bottom - 5,
2934
+ top: menuPosition.bottom,
2930
2935
  left: menuPosition.rightSpaceAvailable + 12
2931
2936
  };
2932
2937
  case 'left':
2933
2938
  return {
2934
2939
  top: menuPosition.top,
2935
- right: menuPosition.rightSpaceAvailable + 35
2940
+ left: menuPosition.left - optionsWidth - 7
2936
2941
  };
2937
2942
  case 'right':
2938
2943
  return {
2939
2944
  top: menuPosition.top,
2940
- left: menuPosition.rightSpaceAvailable + 35
2945
+ left: menuPosition.left + 20
2941
2946
  };
2942
2947
  default:
2943
2948
  return {
@@ -2948,18 +2953,15 @@ const OptionCard = ({
2948
2953
  })();
2949
2954
  return /*#__PURE__*/reactDom.createPortal(jsxRuntime.jsx("div", {
2950
2955
  className: classNames('ff-option-card', currentTheme),
2951
- ref: optionCardRef,
2952
2956
  style: {
2953
2957
  ...style,
2954
2958
  zIndex
2955
2959
  },
2956
- children: jsxRuntime.jsx("div", {
2957
- className: "ff-option-wrapper",
2958
- children: options.map(opt => jsxRuntime.jsx(Option$1, {
2959
- option: opt,
2960
- onClick: onClick
2961
- }, opt.label))
2962
- })
2960
+ ref: optionCardRef,
2961
+ children: options.map(opt => jsxRuntime.jsx(Option$1, {
2962
+ option: opt,
2963
+ onClick: onClick
2964
+ }, opt.label))
2963
2965
  }), document.body);
2964
2966
  };
2965
2967
  const MenuOption = ({
@@ -2981,10 +2983,11 @@ const MenuOption = ({
2981
2983
  const menuRef = React.useRef(null);
2982
2984
  const [menuPosition, setMenuPosition] = React.useState({
2983
2985
  top: 0,
2984
- bottom: 0,
2986
+ left: 0,
2985
2987
  height: 0,
2986
- fromBottom: 0,
2987
- rightSpaceAvailable: 0
2988
+ right: 0,
2989
+ rightSpaceAvailable: 0,
2990
+ bottomSpaceAvailable: 0
2988
2991
  });
2989
2992
  const closeDropDown = () => setIsClicked(false);
2990
2993
  const onIconClickHandler = () => {
@@ -3001,10 +3004,11 @@ const MenuOption = ({
3001
3004
  const rect = menuRef.current.getBoundingClientRect();
3002
3005
  setMenuPosition({
3003
3006
  top: rect.top,
3007
+ left: rect.left,
3004
3008
  height: rect.height,
3009
+ right: rect.right,
3005
3010
  rightSpaceAvailable: document.body.clientWidth - rect.right,
3006
- bottom: rect.bottom,
3007
- fromBottom: window.innerHeight - rect.bottom
3011
+ bottomSpaceAvailable: window.innerHeight - menuRef.current.offsetTop
3008
3012
  });
3009
3013
  }
3010
3014
  };
@@ -3047,7 +3051,7 @@ const MenuOption = ({
3047
3051
  menuRef: menuRef,
3048
3052
  closeDropdown: closeDropDown,
3049
3053
  zIndex: zIndex,
3050
- dropdownPosition: dropdownPlacement
3054
+ dropdownPlacement: dropdownPlacement
3051
3055
  })]
3052
3056
  });
3053
3057
  };
@@ -7429,7 +7433,7 @@ function createFormControl(props = {}) {
7429
7433
  timer = setTimeout(callback, wait);
7430
7434
  };
7431
7435
  const _updateValid = async (shouldUpdateValid) => {
7432
- if (!_options.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
7436
+ if (!props.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
7433
7437
  const isValid = _options.resolver
7434
7438
  ? isEmptyObject((await _executeSchema()).errors)
7435
7439
  : await executeBuiltInValidation(_fields, true);
@@ -7441,7 +7445,7 @@ function createFormControl(props = {}) {
7441
7445
  }
7442
7446
  };
7443
7447
  const _updateIsValidating = (names, isValidating) => {
7444
- if (!_options.disabled &&
7448
+ if (!props.disabled &&
7445
7449
  (_proxyFormState.isValidating || _proxyFormState.validatingFields)) {
7446
7450
  (names || Array.from(_names.mount)).forEach((name) => {
7447
7451
  if (name) {
@@ -7457,7 +7461,7 @@ function createFormControl(props = {}) {
7457
7461
  }
7458
7462
  };
7459
7463
  const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
7460
- if (args && method && !_options.disabled) {
7464
+ if (args && method && !props.disabled) {
7461
7465
  _state.action = true;
7462
7466
  if (shouldUpdateFieldsAndState && Array.isArray(get$1(_fields, name))) {
7463
7467
  const fieldValues = method(get$1(_fields, name), args.argA, args.argB);
@@ -7521,7 +7525,7 @@ function createFormControl(props = {}) {
7521
7525
  const output = {
7522
7526
  name,
7523
7527
  };
7524
- if (!_options.disabled) {
7528
+ if (!props.disabled) {
7525
7529
  const disabledField = !!(get$1(_fields, name) &&
7526
7530
  get$1(_fields, name)._f &&
7527
7531
  get$1(_fields, name)._f.disabled);
@@ -7657,7 +7661,7 @@ function createFormControl(props = {}) {
7657
7661
  }
7658
7662
  _names.unMount = new Set();
7659
7663
  };
7660
- const _getDirty = (name, data) => !_options.disabled &&
7664
+ const _getDirty = (name, data) => !props.disabled &&
7661
7665
  (name && data && set$1(_formValues, name, data),
7662
7666
  !deepEqual(getValues(), _defaultValues));
7663
7667
  const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
@@ -7973,7 +7977,7 @@ function createFormControl(props = {}) {
7973
7977
  };
7974
7978
  const register = (name, options = {}) => {
7975
7979
  let field = get$1(_fields, name);
7976
- const disabledIsDefined = isBoolean(options.disabled) || isBoolean(_options.disabled);
7980
+ const disabledIsDefined = isBoolean(options.disabled) || isBoolean(props.disabled);
7977
7981
  set$1(_fields, name, {
7978
7982
  ...(field || {}),
7979
7983
  _f: {
@@ -7989,7 +7993,7 @@ function createFormControl(props = {}) {
7989
7993
  field,
7990
7994
  disabled: isBoolean(options.disabled)
7991
7995
  ? options.disabled
7992
- : _options.disabled,
7996
+ : props.disabled,
7993
7997
  name,
7994
7998
  value: options.value,
7995
7999
  });
@@ -7999,7 +8003,7 @@ function createFormControl(props = {}) {
7999
8003
  }
8000
8004
  return {
8001
8005
  ...(disabledIsDefined
8002
- ? { disabled: options.disabled || _options.disabled }
8006
+ ? { disabled: options.disabled || props.disabled }
8003
8007
  : {}),
8004
8008
  ...(_options.progressive
8005
8009
  ? {
@@ -8083,12 +8087,6 @@ function createFormControl(props = {}) {
8083
8087
  e.preventDefault && e.preventDefault();
8084
8088
  e.persist && e.persist();
8085
8089
  }
8086
- if (_options.disabled) {
8087
- if (onInvalid) {
8088
- await onInvalid({ ..._formState.errors }, e);
8089
- }
8090
- return;
8091
- }
8092
8090
  let fieldValues = cloneObject(_formValues);
8093
8091
  _subjects.state.next({
8094
8092
  isSubmitting: true,
@@ -8267,9 +8265,7 @@ function createFormControl(props = {}) {
8267
8265
  : fieldReference.ref;
8268
8266
  if (fieldRef.focus) {
8269
8267
  fieldRef.focus();
8270
- options.shouldSelect &&
8271
- isFunction$1(fieldRef.select) &&
8272
- fieldRef.select();
8268
+ options.shouldSelect && fieldRef.select();
8273
8269
  }
8274
8270
  }
8275
8271
  };
@@ -8470,6 +8466,11 @@ function useForm(props = {}) {
8470
8466
  values: control._getWatch(),
8471
8467
  });
8472
8468
  }, [props.shouldUnregister, control]);
8469
+ React.useEffect(() => {
8470
+ if (_formControl.current) {
8471
+ _formControl.current.watch = _formControl.current.watch.bind({});
8472
+ }
8473
+ }, [formState]);
8473
8474
  _formControl.current.formState = getProxyFormState(formState, control);
8474
8475
  return _formControl.current;
8475
8476
  }
@@ -13565,7 +13566,7 @@ function formatDay(date, options, dateLib) {
13565
13566
  */
13566
13567
  function formatMonthDropdown(/** The month number to format. */
13567
13568
  monthNumber, /** The locale to use for formatting. */
13568
- locale) {
13569
+ locale = enUS) {
13569
13570
  return locale.localize?.month(monthNumber);
13570
13571
  }
13571
13572
 
@@ -13669,7 +13670,7 @@ function getMonthOptions(displayMonth, navStart, navEnd, formatters, dateLib) {
13669
13670
  return a - b;
13670
13671
  });
13671
13672
  const options = sortedMonths.map(value => {
13672
- const label = formatters.formatMonthDropdown(value, dateLib.options.locale ?? enUS);
13673
+ const label = formatters.formatMonthDropdown(value, dateLib.options.locale);
13673
13674
  const month = dateLib.Date ? new dateLib.Date(year, value) : new Date(year, value);
13674
13675
  const disabled = navStart && month < startOfMonth(navStart) || navEnd && month > startOfMonth(navEnd) || false;
13675
13676
  return {
@@ -14283,8 +14284,7 @@ function getDates(displayMonths, maxDate, props, dateLib) {
14283
14284
  // If fixed weeks is enabled, add the extra dates to the array
14284
14285
  const extraDates = NrOfDaysWithFixedWeeks * nOfMonths;
14285
14286
  if (fixedWeeks && dates.length < extraDates) {
14286
- const daysToAdd = extraDates - dates.length;
14287
- for (let i = 0; i < daysToAdd; i++) {
14287
+ for (let i = 0; i < 7; i++) {
14288
14288
  const date = addDays(dates[dates.length - 1], 1);
14289
14289
  dates.push(date);
14290
14290
  }
@@ -14411,10 +14411,9 @@ props, dateLib) {
14411
14411
  const monthDates = dates.filter(date => {
14412
14412
  return date >= firstDateOfFirstWeek && date <= lastDateOfLastWeek;
14413
14413
  });
14414
- if (props.fixedWeeks && monthDates.length < NrOfDaysWithFixedWeeks) {
14414
+ if (props.fixedWeeks && monthDates.length < 42) {
14415
14415
  const extraDates = dates.filter(date => {
14416
- const daysToAdd = NrOfDaysWithFixedWeeks - monthDates.length;
14417
- return date > lastDateOfLastWeek && date <= addDays(lastDateOfLastWeek, daysToAdd);
14416
+ return date > lastDateOfLastWeek && date <= addDays(lastDateOfLastWeek, 7);
14418
14417
  });
14419
14418
  monthDates.push(...extraDates);
14420
14419
  }
@@ -14938,8 +14937,6 @@ function useFocus(props, calendar, getModifiers, isSelected, dateLib) {
14938
14937
  /**
14939
14938
  * Return a function to get the modifiers for a given day.
14940
14939
  *
14941
- * NOTE: this is not an hook, but a factory for `getModifiers`.
14942
- *
14943
14940
  * @private
14944
14941
  */
14945
14942
  function useGetModifiers(days, props, dateLib) {
@@ -14952,14 +14949,8 @@ function useGetModifiers(days, props, dateLib) {
14952
14949
  } = props;
14953
14950
  const {
14954
14951
  isSameDay,
14955
- isSameMonth,
14956
- startOfMonth,
14957
- isBefore,
14958
- endOfMonth,
14959
- isAfter
14952
+ isSameMonth
14960
14953
  } = dateLib;
14961
- const startMonth = props.startMonth && startOfMonth(props.startMonth);
14962
- const endMonth = props.endMonth && endOfMonth(props.endMonth);
14963
14954
  const internalModifiersMap = {
14964
14955
  [DayFlag.focused]: [],
14965
14956
  [DayFlag.outside]: [],
@@ -14968,16 +14959,20 @@ function useGetModifiers(days, props, dateLib) {
14968
14959
  [DayFlag.today]: []
14969
14960
  };
14970
14961
  const customModifiersMap = {};
14962
+ const selectionModifiersMap = {
14963
+ [SelectionState.range_end]: [],
14964
+ [SelectionState.range_middle]: [],
14965
+ [SelectionState.range_start]: [],
14966
+ [SelectionState.selected]: []
14967
+ };
14971
14968
  for (const day of days) {
14972
14969
  const {
14973
14970
  date,
14974
14971
  displayMonth
14975
14972
  } = day;
14976
14973
  const isOutside = Boolean(displayMonth && !isSameMonth(date, displayMonth));
14977
- const isBeforeStartMonth = Boolean(startMonth && isBefore(date, startMonth));
14978
- const isAfterEndMonth = Boolean(endMonth && isAfter(date, endMonth));
14979
14974
  const isDisabled = Boolean(disabled && dateMatchModifiers(date, disabled, dateLib));
14980
- const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) || isBeforeStartMonth || isAfterEndMonth || !showOutsideDays && isOutside;
14975
+ const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) || !showOutsideDays && isOutside;
14981
14976
  const isToday = isSameDay(date, today ?? (props.timeZone ? TZDate.tz(props.timeZone) : dateLib.Date ? new dateLib.Date() : new Date()));
14982
14977
  if (isOutside) internalModifiersMap.outside.push(day);
14983
14978
  if (isDisabled) internalModifiersMap.disabled.push(day);
@@ -15006,16 +15001,27 @@ function useGetModifiers(days, props, dateLib) {
15006
15001
  [DayFlag.outside]: false,
15007
15002
  [DayFlag.today]: false
15008
15003
  };
15004
+ const selectionStates = {
15005
+ [SelectionState.range_end]: false,
15006
+ [SelectionState.range_middle]: false,
15007
+ [SelectionState.range_start]: false,
15008
+ [SelectionState.selected]: false
15009
+ };
15009
15010
  const customModifiers = {};
15010
15011
  // Find the modifiers for the given day
15011
15012
  for (const name in internalModifiersMap) {
15012
15013
  const days = internalModifiersMap[name];
15013
15014
  dayFlags[name] = days.some(d => d === day);
15014
15015
  }
15016
+ for (const name in selectionModifiersMap) {
15017
+ const days = selectionModifiersMap[name];
15018
+ selectionStates[name] = days.some(d => d === day);
15019
+ }
15015
15020
  for (const name in customModifiersMap) {
15016
15021
  customModifiers[name] = customModifiersMap[name].some(d => d === day);
15017
15022
  }
15018
15023
  return {
15024
+ ...selectionStates,
15019
15025
  ...dayFlags,
15020
15026
  // custom modifiers should override all the previous ones
15021
15027
  ...customModifiers
@@ -17754,7 +17760,7 @@ const IconButton = ({
17754
17760
  });
17755
17761
  };
17756
17762
 
17757
- var css_248z$y = ".ff-modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: var(--modal-background-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-container {\n box-shadow: 0px 1px 4px 0px #ffc600;\n border-radius: 12px;\n overflow: hidden;\n}\n\n.ff-modal-content {\n background: var(--ff-mini-modal-border);\n position: relative;\n max-width: 100%;\n padding: 8px;\n}\n.ff-modal-content .ff-modal-header {\n height: 32px;\n width: 100%;\n}\n\n.modal-bottom-border {\n border-bottom-left-radius: 12px;\n border-bottom-right-radius: 12px;\n}\n\n.modal-top-border {\n border-top-left-radius: 12px;\n border-top-right-radius: 12px;\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 display: flex;\n flex-direction: row;\n justify-content: end;\n align-items: center;\n gap: 8px;\n padding: 4px 8px;\n}";
17763
+ var css_248z$y = ".ff-modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: var(--modal-background-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-container {\n border-radius: 12px;\n overflow: hidden;\n}\n\n.ff-modal-content {\n background: var(--ff-mini-modal-border);\n position: relative;\n max-width: 100%;\n padding: 8px;\n}\n.ff-modal-content .ff-modal-header {\n height: 32px;\n width: 100%;\n}\n\n.modal-bottom-border {\n border-bottom-left-radius: 12px;\n border-bottom-right-radius: 12px;\n}\n\n.modal-top-border {\n border-top-left-radius: 12px;\n border-top-right-radius: 12px;\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 display: flex;\n flex-direction: row;\n justify-content: end;\n align-items: center;\n gap: 8px;\n padding: 4px 8px;\n}";
17758
17764
  styleInject(css_248z$y);
17759
17765
 
17760
17766
  const Modal = ({
@@ -17774,7 +17780,9 @@ const Modal = ({
17774
17780
  customHeight = 'auto',
17775
17781
  children,
17776
17782
  zIndex = 999,
17777
- boxShadow = '0px 1px 4px 0px #FFC600'
17783
+ boxShadow = '',
17784
+ border = '',
17785
+ background = ''
17778
17786
  }) => {
17779
17787
  React.useEffect(() => {
17780
17788
  const handleKeyDown = e => {
@@ -17807,7 +17815,9 @@ const Modal = ({
17807
17815
  children: jsxRuntime.jsxs("div", {
17808
17816
  style: {
17809
17817
  boxShadow: boxShadow,
17810
- borderRadius: '12px'
17818
+ border: border,
17819
+ borderRadius: '12px',
17820
+ background: background
17811
17821
  },
17812
17822
  className: "ff-modal-container",
17813
17823
  children: [jsxRuntime.jsxs("div", {
@@ -22726,17 +22736,19 @@ const VariableInput = ({
22726
22736
  });
22727
22737
  };
22728
22738
 
22729
- var css_248z$w = ".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-projects-dropdown {\n width: 202px;\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-projects-dropdown .ff-projects-search {\n width: 99%;\n margin-bottom: 1px;\n}\n.ff-all-project .ff-projects-dropdown .ff-projects-search input {\n height: 30px;\n width: inherit;\n border-radius: 4px;\n border-style: none;\n}\n.ff-all-project .ff-projects-dropdown .ff-projects-search input::placeholder {\n padding-left: 28px;\n font-size: 8px;\n line-height: 12px;\n}\n.ff-all-project .ff-projects-dropdown .ff-projects-search span {\n position: absolute;\n top: 11px;\n left: 8px;\n}\n.ff-all-project .ff-projects-dropdown .scroll {\n max-height: 256px;\n overflow-x: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ff-all-project .ff-projects-dropdown .scroll::-webkit-scrollbar {\n width: 2px;\n}\n.ff-all-project .ff-projects-dropdown .scroll::-webkit-scrollbar-thumb {\n background: var(--primary-icon-color);\n border-radius: 2px;\n}\n.ff-all-project .ff-projects-dropdown .ff-all-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-projects-dropdown .ff-all-projects-options .ff-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-projects-dropdown .ff-all-projects-options .ff-projects-icons svg path {\n fill: var(--primary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .ff-all-projects-options.ff-selected-option,\n.ff-all-project .ff-projects-dropdown .ff-all-projects-options:hover {\n background-color: var(--primary-icon-color);\n color: var(--secondary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .ff-all-projects-options.ff-selected-option svg path,\n.ff-all-project .ff-projects-dropdown .ff-all-projects-options:hover svg path {\n fill: var(--secondary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-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 white-space: nowrap;\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options .ff-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-projects-dropdown .option-card .ff-projects-options .ff-projects-icons svg path {\n fill: var(--primary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options.ff-selected-option,\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options:hover {\n background-color: var(--primary-icon-color);\n color: var(--secondary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options.ff-selected-option svg path,\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options:hover svg path {\n fill: var(--secondary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .ff-selected-option {\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n justify-content: flex-start;\n gap: 4px;\n background-color: var(--primary-icon-color);\n color: var(--secondary-icon-color);\n border-radius: 4px;\n}\n.ff-all-project .ff-projects-dropdown .ff-selected-option .ff-projects-icons svg path {\n fill: var(--secondary-icon-color);\n}";
22739
+ var css_248z$w = ".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 width: fit-content;\n border-radius: 16px;\n background-color: var(--ff-all-projects-default-color);\n color: var(--expandable-menu-default-bg);\n line-height: 18px;\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n padding: 3px;\n cursor: pointer;\n}\n.ff-all-project .ff-all-project-dropdown--selected {\n background-color: var(--primary-icon-color);\n border-radius: 20px;\n}\n.ff-all-project .ff-all-project-dropdown--selected .ff-all-project-container {\n border-radius: 20px;\n background-color: var(--brand-color);\n}\n.ff-all-project .ff-all-project-dropdown:not(.ff-all-project-dropdown--selected):hover .projects-label {\n position: relative;\n white-space: nowrap;\n}\n.ff-all-project .ff-all-project-dropdown:not(.ff-all-project-dropdown--selected):hover .projects-label:hover::after {\n animation: oscillate-border-width 0.5s ease-in-out forwards;\n}\n.ff-all-project .ff-all-project-dropdown:not(.ff-all-project-dropdown--selected):hover .projects-label::after {\n content: \"\";\n position: absolute;\n top: 20px;\n left: 0%;\n width: 0%;\n height: 2px;\n background-color: var(--ff-app-header-menu-border-bottom-color);\n border-radius: 4px;\n transition: width 0.15s ease-in-out;\n}\n.ff-all-project .ff-all-project-dropdown .ff-all-project-container {\n display: flex;\n padding: 4px;\n gap: 4px;\n justify-content: center;\n}\n.ff-all-project .ff-all-project-dropdown .ff-all-project-container .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-projects-dropdown {\n width: 202px;\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-projects-dropdown .ff-projects-search {\n width: 99%;\n margin-bottom: 1px;\n}\n.ff-all-project .ff-projects-dropdown .ff-projects-search input {\n height: 30px;\n width: inherit;\n border-radius: 4px;\n border-style: none;\n}\n.ff-all-project .ff-projects-dropdown .ff-projects-search input::placeholder {\n padding-left: 28px;\n font-size: 8px;\n line-height: 12px;\n}\n.ff-all-project .ff-projects-dropdown .ff-projects-search span {\n position: absolute;\n top: 11px;\n left: 8px;\n}\n.ff-all-project .ff-projects-dropdown .scroll {\n max-height: 256px;\n overflow-x: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ff-all-project .ff-projects-dropdown .scroll::-webkit-scrollbar {\n width: 2px;\n}\n.ff-all-project .ff-projects-dropdown .scroll::-webkit-scrollbar-thumb {\n background: var(--primary-icon-color);\n border-radius: 2px;\n}\n.ff-all-project .ff-projects-dropdown .ff-all-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-projects-dropdown .ff-all-projects-options .ff-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-projects-dropdown .ff-all-projects-options .ff-projects-icons svg path {\n fill: var(--primary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .ff-all-projects-options.ff-selected-option,\n.ff-all-project .ff-projects-dropdown .ff-all-projects-options:hover {\n background-color: var(--primary-icon-color);\n color: var(--secondary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .ff-all-projects-options.ff-selected-option svg path,\n.ff-all-project .ff-projects-dropdown .ff-all-projects-options:hover svg path {\n fill: var(--secondary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-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 white-space: nowrap;\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options .ff-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-projects-dropdown .option-card .ff-projects-options .ff-projects-icons svg path {\n fill: var(--primary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options.ff-selected-option,\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options:hover {\n background-color: var(--primary-icon-color);\n color: var(--secondary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options.ff-selected-option svg path,\n.ff-all-project .ff-projects-dropdown .option-card .ff-projects-options:hover svg path {\n fill: var(--secondary-icon-color);\n}\n.ff-all-project .ff-projects-dropdown .ff-selected-option {\n display: flex;\n justify-content: center;\n align-items: center;\n align-content: center;\n justify-content: flex-start;\n gap: 4px;\n background-color: var(--primary-icon-color);\n color: var(--secondary-icon-color);\n border-radius: 4px;\n}\n.ff-all-project .ff-projects-dropdown .ff-selected-option .ff-projects-icons svg path {\n fill: var(--secondary-icon-color);\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}";
22730
22740
  styleInject(css_248z$w);
22731
22741
 
22732
22742
  const AllProjectsDropdown = ({
22733
22743
  onClick = () => {},
22744
+ onMenuClick = () => {},
22734
22745
  options,
22735
22746
  selectedOption = {
22736
22747
  label: 'All Projects',
22737
22748
  value: 'All Projects',
22738
22749
  iconName: 'all_projects'
22739
- }
22750
+ },
22751
+ selected = false
22740
22752
  }) => {
22741
22753
  const [showOptions, setShowOptions] = React.useState(false);
22742
22754
  const [selectedOptions, setSelectedOptions] = React.useState(selectedOption);
@@ -22765,26 +22777,35 @@ const AllProjectsDropdown = ({
22765
22777
  useClickOutside(optionsRef, closeOptions);
22766
22778
  return jsxRuntime.jsxs("div", {
22767
22779
  className: classNames('ff-all-project'),
22768
- children: [jsxRuntime.jsxs("div", {
22769
- className: classNames('ff-all-project-dropdown'),
22770
- children: [jsxRuntime.jsx(Typography, {
22771
- as: 'div',
22772
- lineHeight: '18px',
22773
- fontSize: 12,
22774
- fontWeight: 'regular',
22775
- className: classNames('projects-label'),
22776
- children: truncateText(selectedOptions?.label, 12)
22777
- }), jsxRuntime.jsx("div", {
22778
- className: classNames('label-icon'),
22779
- onClick: handleShowOption,
22780
- children: jsxRuntime.jsx(Icon, {
22781
- name: "arrows_down_icon",
22782
- color: "var(--primary-icon-color)",
22783
- height: 8,
22784
- width: 8,
22785
- hoverEffect: false
22786
- })
22787
- })]
22780
+ children: [jsxRuntime.jsx("div", {
22781
+ className: classNames('ff-all-project-dropdown', {
22782
+ ['ff-all-project-dropdown--selected']: selected
22783
+ }),
22784
+ children: jsxRuntime.jsxs("div", {
22785
+ className: classNames('ff-all-project-container'),
22786
+ children: [jsxRuntime.jsx(Typography, {
22787
+ as: 'div',
22788
+ lineHeight: '18px',
22789
+ fontSize: 12,
22790
+ fontWeight: 'regular',
22791
+ className: classNames('projects-label'),
22792
+ onClick: onMenuClick,
22793
+ children: jsxRuntime.jsx(Tooltip, {
22794
+ title: selectedOptions?.label,
22795
+ children: selectedOptions.label.length <= 12 ? selectedOptions.label : truncateText(selectedOptions?.label, 8)
22796
+ })
22797
+ }), jsxRuntime.jsx("div", {
22798
+ className: classNames('label-icon'),
22799
+ onClick: handleShowOption,
22800
+ children: jsxRuntime.jsx(Icon, {
22801
+ name: "arrows_down_icon",
22802
+ color: "var(--primary-icon-color)",
22803
+ height: 8,
22804
+ width: 8,
22805
+ hoverEffect: false
22806
+ })
22807
+ })]
22808
+ })
22788
22809
  }), showOptions && jsxRuntime.jsxs("div", {
22789
22810
  className: classNames('ff-projects-dropdown'),
22790
22811
  ref: optionsRef,
@@ -23007,7 +23028,7 @@ const PieChart = ({
23007
23028
  });
23008
23029
  };
23009
23030
 
23010
- var css_248z$u = ".ff-app-header {\n display: flex;\n justify-content: space-between;\n background-color: var(--brand-color);\n padding-left: 8px;\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n}\n.ff-app-header .ff-app-header-left-container {\n display: flex;\n}\n.ff-app-header .ff-app-header-left-container .ff-app-header-logo-icon {\n padding: 4px;\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 z-index: 1000;\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 .ff-app-header-nav-bar-item-label {\n white-space: nowrap;\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;\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--selected :last-child {\n margin-right: 3px;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected :first-child {\n margin: 0;\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 white-space: nowrap;\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 border-radius: 4px;\n transition: width 0.15s ease-in-out;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected {\n color: var(--ff-header-submenu-highlight-text-color);\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 10%;\n width: 90%;\n height: 2px;\n border-radius: 4px;\n box-shadow: 0px 1px 0.2px 0px rgba(0, 0, 0, 0.1607843137);\n background: var(--ff-app-header-submenu-border-bottom-color);\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container {\n display: flex;\n align-items: center;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-more-icon svg {\n cursor: pointer;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-more-icon svg path {\n fill: var(--primary-icon-color);\n}\n.ff-app-header .ff-app-header-left-content,\n.ff-app-header .ff-app-header-right-content {\n height: 24px;\n padding: 8px;\n align-content: center;\n}\n\n@keyframes oscillate-border-width {\n 0% {\n width: 50%;\n left: 25%;\n }\n 50% {\n width: 70%;\n left: 15%;\n }\n 100% {\n width: 50%;\n left: 25%;\n }\n}";
23031
+ var css_248z$u = ".ff-app-header {\n display: flex;\n justify-content: space-between;\n background-color: var(--brand-color);\n padding-left: 8px;\n height: 40px;\n}\n.ff-app-header .ff-app-header-left-container {\n display: flex;\n}\n.ff-app-header .ff-app-header-left-container .ff-app-header-logo-icon {\n padding: 4px;\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 z-index: 1000;\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 .ff-app-header-nav-bar-item-label {\n white-space: nowrap;\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;\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--selected :last-child {\n margin-right: 3px;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected :first-child {\n margin: 0;\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 white-space: nowrap;\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 border-radius: 4px;\n transition: width 0.15s ease-in-out;\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-nav-bar-submenu-item--selected {\n color: var(--ff-header-submenu-highlight-text-color);\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 10%;\n width: 90%;\n height: 2px;\n border-radius: 4px;\n box-shadow: 0px 1px 0.2px 0px rgba(0, 0, 0, 0.1607843137);\n background: var(--ff-app-header-submenu-border-bottom-color);\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container {\n display: flex;\n align-items: center;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-more-icon svg {\n cursor: pointer;\n}\n.ff-app-header .ff-app-header-nav-bar .ff-app-header-more-icon svg path {\n fill: var(--primary-icon-color);\n}\n.ff-app-header .ff-app-header-left-content,\n.ff-app-header .ff-app-header-right-content {\n height: 24px;\n padding: 8px;\n align-content: center;\n}\n\n@keyframes oscillate-border-width {\n 0% {\n width: 50%;\n left: 25%;\n }\n 50% {\n width: 70%;\n left: 15%;\n }\n 100% {\n width: 50%;\n left: 25%;\n }\n}";
23011
23032
  styleInject(css_248z$u);
23012
23033
 
23013
23034
  const AppHeader = ({
@@ -23029,6 +23050,7 @@ const AppHeader = ({
23029
23050
  onSubMenuClick = () => {},
23030
23051
  onQuickMenuClick = () => {},
23031
23052
  onProjectMenuClick = () => {},
23053
+ onProjectDropdownLabelClick = () => {},
23032
23054
  onMoreMenuOptionClick = () => {}
23033
23055
  }) => {
23034
23056
  return jsxRuntime.jsx(jsxRuntime.Fragment, {
@@ -23048,13 +23070,15 @@ const AppHeader = ({
23048
23070
  className: "ff-app-header-left-content",
23049
23071
  children: leftContent
23050
23072
  })]
23051
- }), jsxRuntime.jsxs("div", {
23073
+ }), !checkEmpty(appHeaderMenuItems) && jsxRuntime.jsxs("div", {
23052
23074
  className: "ff-app-header-nav-bar",
23053
23075
  children: [projectsList && !checkEmpty(projectsList) && jsxRuntime.jsx("div", {
23054
23076
  children: jsxRuntime.jsx(AllProjectsDropdown, {
23055
23077
  onClick: onProjectMenuClick,
23056
23078
  options: projectsList,
23057
- selectedOption: selectedProject
23079
+ selectedOption: selectedProject,
23080
+ onMenuClick: onProjectDropdownLabelClick,
23081
+ selected: selectedMenu === 'Projects'
23058
23082
  })
23059
23083
  }), jsxRuntime.jsx("div", {
23060
23084
  className: "ff-app-header-nav-bar-items fontSm",
@@ -23111,7 +23135,7 @@ const AppHeader = ({
23111
23135
  iconName: "more",
23112
23136
  options: appHeaderHiddenMenuItems,
23113
23137
  onOptionClick: onMoreMenuOptionClick,
23114
- variant: 'dark'
23138
+ variant: "dark"
23115
23139
  })
23116
23140
  })]
23117
23141
  }), rightContent && jsxRuntime.jsx("div", {
@@ -26451,6 +26475,11 @@ const LabelEditTextField = ({
26451
26475
  var css_248z$f = "@font-face {\n font-family: \"Poppins\";\n font-weight: 400;\n src: local(\"Poppins-Regular\"), url(../../assets/fonts/Poppins-Regular.ttf) format(\"truetype\");\n}\n@font-face {\n font-family: \"Poppins\";\n font-weight: 500;\n src: local(\"Poppins-Medium\"), url(../../assets/fonts/Poppins-Medium.ttf) format(\"truetype\");\n}\n@font-face {\n font-family: \"Poppins\";\n font-weight: 600;\n src: local(\"Poppins-SemiBold\"), url(../../assets/fonts/Poppins-SemiBold.ttf) format(\"truetype\");\n}\n@font-face {\n font-family: \"Poppins\";\n font-weight: 700;\n src: local(\"Poppins-Bold\"), url(../../assets/fonts/Poppins-Bold.ttf) format(\"truetype\");\n}\n.fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-label-edit-text-field .ff-text-field {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8, .ff-label-edit-text-field .ff-label, .ff-label-edit-text-field .ff-textfield-label {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.ff-label-edit-text-field {\n display: flex;\n flex-direction: column;\n position: relative;\n width: 100%;\n}\n.ff-label-edit-text-field .display-text-container {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.ff-label-edit-text-field .display-text-container .edit-button {\n padding: 4px 8px;\n background-color: var(--button-background-color);\n color: var(--button-text-color);\n border: 1px solid var(--button-border-color);\n border-radius: 4px;\n cursor: pointer;\n font-size: 12px;\n}\n.ff-label-edit-text-field .display-text-container .edit-button:hover {\n background-color: var(--button-hover-background-color);\n}\n.ff-label-edit-text-field .ff-label-text-field {\n display: flex;\n}\n.ff-label-edit-text-field .ff-label-text-field-with-dropdown,\n.ff-label-edit-text-field .ff-label-text-field-without-dropdown {\n position: relative;\n display: flex;\n align-items: center;\n}\n.ff-label-edit-text-field .ff-label, .ff-label-edit-text-field .ff-textfield-label {\n position: absolute;\n top: 0;\n left: 10px;\n transform: translateY(-50%);\n transition: all 0.2s ease;\n color: var(--label-edit-text-label-color);\n background: var(--label-edit-text-background-color);\n padding: 0 4px;\n}\n.ff-label-edit-text-field .ff-textfield-label {\n top: 5px;\n}\n.ff-label-edit-text-field .display-text {\n border-radius: 4px;\n cursor: pointer;\n display: flex;\n align-items: center;\n}\n.ff-label-edit-text-field .ff-text-field {\n outline: none;\n width: fit-content;\n}\n.ff-label-edit-text-field .ff-text-field-error-border {\n border: 1px solid var(--label-edit-error-text);\n}\n.ff-label-edit-text-field .ff-text-field-border {\n border: 1px solid var(--label-edit-text-label-color);\n}\n.ff-label-edit-text-field .ff-text-field-error-text {\n color: var(--label-edit-error-text);\n}\n.ff-label-edit-text-field .ff-text-field-text {\n color: var(--label-edit-text-label-color);\n}\n.ff-label-edit-text-field .ff-text-field {\n padding: 0 4px;\n border-radius: 4px;\n}\n.ff-label-edit-text-field .ff-icon-container {\n display: flex;\n gap: 8px;\n align-items: center;\n}\n.ff-label-edit-text-field .ff-icon-container .confirm-icon,\n.ff-label-edit-text-field .ff-icon-container .cancel-icon {\n cursor: pointer;\n}\n.ff-label-edit-text-field .error-text {\n color: var(--label-edit-error-text);\n margin: 0;\n}";
26452
26476
  styleInject(css_248z$f);
26453
26477
 
26478
+ const capitalize = text => {
26479
+ if (!text) return '';
26480
+ return text.charAt(0).toUpperCase() + text.slice(1);
26481
+ };
26482
+
26454
26483
  const getErrorMessage = (inputValue, text, customError, customErrorCondition) => {
26455
26484
  if (inputValue === text) {
26456
26485
  return 'No changes were made.';
@@ -26576,7 +26605,7 @@ const EditTextField = ({
26576
26605
  highlight: highlightText
26577
26606
  })
26578
26607
  }), jsxRuntime.jsx(Tooltip, {
26579
- title: editIcon?.name ?? 'edit',
26608
+ title: capitalize(editIcon?.name || '') ?? 'Edit',
26580
26609
  children: jsxRuntime.jsx(Icon, {
26581
26610
  color: editIcon?.color ?? 'var(--label-edit-cancel-icon)',
26582
26611
  height: editIcon?.height ?? 20,