pixel-react-excel-sheet 1.0.30 → 1.0.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/lib/components/Charts/BarChart/BarChart.d.ts +1 -0
  2. package/lib/components/Charts/DashboardDonutChart/types.d.ts +1 -0
  3. package/lib/components/ConditionalDropdown/types.d.ts +1 -1
  4. package/lib/components/ConnectingBranch/ConnectingBranch.d.ts +2 -1
  5. package/lib/components/ConnectingBranch/data.d.ts +19 -33
  6. package/lib/components/ConnectingBranch/types.d.ts +10 -0
  7. package/lib/components/Excel/ExcelFile/ExcelFileComponents/actions.d.ts +7 -1
  8. package/lib/components/FileDropzone/types.d.ts +12 -4
  9. package/lib/components/MachineInputField/MachineInputField.d.ts +4 -1
  10. package/lib/components/MenuOption/types.d.ts +1 -1
  11. package/lib/components/PopUpModal/types.d.ts +2 -1
  12. package/lib/components/Select/types.d.ts +1 -1
  13. package/lib/components/StatusCard/types.d.ts +7 -1
  14. package/lib/components/TextArea/Textarea.d.ts +1 -1
  15. package/lib/components/TextArea/Types.d.ts +1 -0
  16. package/lib/components/ThemeProvider/types.d.ts +1 -1
  17. package/lib/index.d.ts +99 -69
  18. package/lib/index.esm.js +241 -137
  19. package/lib/index.esm.js.map +1 -1
  20. package/lib/index.js +241 -137
  21. package/lib/index.js.map +1 -1
  22. package/lib/tsconfig.tsbuildinfo +1 -1
  23. package/lib/utils/validateFile/validateFile.d.ts +2 -0
  24. package/package.json +2 -2
  25. package/src/assets/Themes/BaseTheme.scss +1 -0
  26. package/src/assets/Themes/BlueTheme.scss +279 -0
  27. package/src/assets/Themes/DarkTheme.scss +1 -0
  28. package/src/assets/Themes/Theme.scss +5 -0
  29. package/src/components/AppHeader/AppHeader.tsx +4 -2
  30. package/src/components/Charts/BarChart/BarChart.stories.tsx +3 -0
  31. package/src/components/Charts/BarChart/BarChart.tsx +7 -0
  32. package/src/components/Charts/DashboardDonutChart/DashboardDonutChart.scss +4 -0
  33. package/src/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.tsx +1 -0
  34. package/src/components/Charts/DashboardDonutChart/DashboardDonutChart.tsx +4 -2
  35. package/src/components/Charts/DashboardDonutChart/types.ts +1 -0
  36. package/src/components/ConditionalDropdown/ConditionalDropdown.stories.tsx +1 -1
  37. package/src/components/ConditionalDropdown/types.ts +1 -1
  38. package/src/components/ConnectingBranch/BranchComponents/MachineInstances.tsx +94 -79
  39. package/src/components/ConnectingBranch/ConnectingBranch.scss +31 -45
  40. package/src/components/ConnectingBranch/ConnectingBranch.stories.tsx +33 -1
  41. package/src/components/ConnectingBranch/ConnectingBranch.tsx +36 -23
  42. package/src/components/ConnectingBranch/{data.ts → data.tsx} +106 -17
  43. package/src/components/ConnectingBranch/types.ts +21 -0
  44. package/src/components/Excel/ExcelFile/ExcelFile.tsx +1 -1
  45. package/src/components/Excel/ExcelFile/ExcelFileComponents/ActiveCell.tsx +7 -5
  46. package/src/components/Excel/ExcelFile/ExcelFileComponents/FloatingRect.tsx +6 -1
  47. package/src/components/Excel/ExcelFile/ExcelFileComponents/Spreadsheet.scss +30 -11
  48. package/src/components/Excel/ExcelFile/ExcelFileComponents/Spreadsheet.tsx +65 -19
  49. package/src/components/Excel/ExcelFile/ExcelFileComponents/actions.ts +14 -0
  50. package/src/components/Excel/ExcelFile/ExcelFileComponents/reducer.ts +16 -0
  51. package/src/components/Excel/ExcelToolBar/ExcelToolBar.tsx +41 -32
  52. package/src/components/FileDropzone/Dropzone.tsx +3 -0
  53. package/src/components/FileDropzone/FileDropzone.scss +18 -0
  54. package/src/components/FileDropzone/FileDropzone.stories.tsx +75 -7
  55. package/src/components/FileDropzone/FileDropzone.tsx +2 -0
  56. package/src/components/FileDropzone/RadioFilePreview.tsx +7 -3
  57. package/src/components/FileDropzone/types.ts +13 -4
  58. package/src/components/Icon/iconList.ts +2 -2
  59. package/src/components/InputWithDropdown/InputWithDropdown.tsx +1 -1
  60. package/src/components/MachineInputField/MachineInputField.tsx +67 -70
  61. package/src/components/MenuOption/MenuOption.stories.tsx +2 -3
  62. package/src/components/MenuOption/MenuOption.tsx +9 -2
  63. package/src/components/MenuOption/types.ts +1 -1
  64. package/src/components/PopUpModal/types.ts +4 -3
  65. package/src/components/Search/Search.stories.tsx +1 -2
  66. package/src/components/Select/types.ts +1 -1
  67. package/src/components/SequentialConnectingBranch/components/Branches/Branches.scss +1 -0
  68. package/src/components/SequentialConnectingBranch/components/Branches/Branches.tsx +2 -8
  69. package/src/components/StatusCard/StatusCard.scss +47 -4
  70. package/src/components/StatusCard/StatusCard.stories.tsx +1 -0
  71. package/src/components/StatusCard/StatusCard.tsx +28 -5
  72. package/src/components/StatusCard/types.ts +15 -10
  73. package/src/components/TextArea/Textarea.tsx +2 -0
  74. package/src/components/TextArea/Types.ts +3 -0
  75. package/src/components/ThemeProvider/types.ts +1 -1
  76. package/src/components/Toastify/Toastify.tsx +1 -0
  77. package/src/utils/validateFile/validateFile.stories.tsx +49 -0
  78. package/src/utils/validateFile/validateFile.ts +39 -0
  79. package/src/components/SequentialConnectingBranch/components/AddBrowserModal/AddBrowserModal.scss +0 -51
  80. package/src/components/SequentialConnectingBranch/components/AddBrowserModal/AddBrowserModal.tsx +0 -107
  81. package/src/components/SequentialConnectingBranch/components/AddBrowserModal/types.ts +0 -5
  82. package/src/components/SequentialConnectingBranch/components/DatasetListModal/DatasetListModal.scss +0 -31
  83. package/src/components/SequentialConnectingBranch/components/DatasetListModal/DatasetListModal.tsx +0 -85
  84. package/src/components/SequentialConnectingBranch/components/DatasetListModal/types.ts +0 -4
  85. /package/src/assets/icons/{impactList.svg → impact_list.svg} +0 -0
package/lib/index.js CHANGED
@@ -682,7 +682,7 @@ Components['run_icon'] = SvgRunIcon;
682
682
  Components['license'] = SvgActiveLicenseIcon;
683
683
  Components['delete'] = SvgDelete;
684
684
  Components['details'] = SvgDetails;
685
- Components['impactList'] = SvgImpactList;
685
+ Components['impact_list'] = SvgImpactList;
686
686
  Components['beautify_icon'] = SvgBeautifyIcon;
687
687
  Components['add_variable_icon'] = SvgAddVariableIcon;
688
688
  Components['replace_file'] = SvgReplaceFile;
@@ -1063,7 +1063,7 @@ function useEscapeKey(key) {
1063
1063
  };
1064
1064
  }
1065
1065
 
1066
- var css_248z$1d = ":root {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\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-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\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 --warning-modal-border-color: rgba(231, 155, 8, 0.4);\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 --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3C3838;\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: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\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 --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --ff-progress-bar-bg-color: #F0F0F0;\n --ff-machine-partial-public-status-color: #ea850e;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(10, 13, 39, 0.1647058824);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #71347b 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}\n\n:root {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\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: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\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 --ff-progress-bar-bg-color: #F0F0F0;\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 --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3C3838;\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 --warning-modal-border-color: rgba(231, 155, 8, 0.4);\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-danger-variant: rgba(169, 18, 36, 0.1019607843);\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 --excel-sheet-border: rgba(207, 209, 226, 0.4431372549);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\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-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\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 --ff-machine-inactive-status-color: #c50303;\n --ff-machine-active-status-color: #4caf50;\n --ff-machine-running-status-color: #2055de;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}\n\n.ff-light-theme {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\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-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\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 --warning-modal-border-color: rgba(231, 155, 8, 0.4);\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 --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3C3838;\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: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\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 --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --ff-progress-bar-bg-color: #F0F0F0;\n --ff-machine-partial-public-status-color: #ea850e;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(10, 13, 39, 0.1647058824);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #71347b 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}\n\n.ff-dark-theme {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\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: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\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 --ff-progress-bar-bg-color: #F0F0F0;\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 --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3C3838;\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 --warning-modal-border-color: rgba(231, 155, 8, 0.4);\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-danger-variant: rgba(169, 18, 36, 0.1019607843);\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 --excel-sheet-border: rgba(207, 209, 226, 0.4431372549);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\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-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\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 --ff-machine-inactive-status-color: #c50303;\n --ff-machine-active-status-color: #4caf50;\n --ff-machine-running-status-color: #2055de;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}";
1066
+ var css_248z$1d = ":root {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\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-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\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 --warning-modal-border-color: rgba(231, 155, 8, 0.4);\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 --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3C3838;\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: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\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 --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --ff-progress-bar-bg-color: #F0F0F0;\n --ff-machine-partial-public-status-color: #ea850e;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(10, 13, 39, 0.1647058824);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #71347b 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}\n\n:root {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\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: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\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 --ff-progress-bar-bg-color: #F0F0F0;\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 --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3C3838;\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 --warning-modal-border-color: rgba(231, 155, 8, 0.4);\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-danger-variant: rgba(169, 18, 36, 0.1019607843);\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 --excel-sheet-border: rgba(207, 209, 226, 0.4431372549);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\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-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\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 --ff-machine-inactive-status-color: #c50303;\n --ff-machine-active-status-color: #4caf50;\n --ff-machine-running-status-color: #2055de;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}\n\n:root {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #434db8;\n --text-color: #3c3838;\n --description-text: #7a7a7a;\n --click-able-text-color: #434db8;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #434db8;\n --border-color: #c2d2fb;\n --disable-color: rgba(67, 77, 184, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n --slider-table-color: #e9ebfb;\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: #434db8;\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: #434db8;\n --default-icon-color: #a3a3a3;\n --tree-connecting-lines-color: #434db8;\n --primary-button-color: linear-gradient(188.79deg, #434db8 2.94%, #434db8 93.09%);\n --primary-button-hover: linear-gradient(179.06deg, #434db8 3.49%, #434db8 99.22%);\n --primary-button-disable: linear-gradient(180deg, #46164d 0%, #434db8 100%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #434db8 3.04%, #434db8 100%);\n --secondary-button-color-text: #6f7070;\n --secondary-button-border: #6f7070;\n --secondary-button-text-color: #46164d;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 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: #1e161f;\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(67, 77, 184, 0.1019607843);\n --file-dropzone-selected-color: rgba(67, 77, 184, 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-comment-input-border-color: #434db8;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #434db8;\n --ff-chips-blur-color: #575757;\n --ff-chip-bg: #ffffff;\n --ff-chip-text-color: #ffffff;\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: #434db8;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #434db8;\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: #434db8;\n --delete-text-color: #c50303;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\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: #fcce46;\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: #808080;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #434db8;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #434db8;\n --ff-search-field-hover-color: #edecf8;\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: #434db8;\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: #434db8;\n --details-page-value-color: #808080;\n --table-header-text-color: #252c37;\n --table-column-text-color: #1e161f;\n --ff-machine-input-field-border-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #434db8;\n --ff-connecting-branch-modal-header: #434db8;\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, #434db8 0%, #434db8 100%);\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --label-edit-text-label-color: #434db8;\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: #edecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-avatar-background-color: #434db8;\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 --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\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 --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #434db8 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}\n\n.ff-light-theme {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\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-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #f9d5ff;\n --ff-chips-blur-color: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\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 --warning-modal-border-color: rgba(231, 155, 8, 0.4);\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 --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3C3838;\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: #f7ecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\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 --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\n --ff-progress-bar-bg-color: #F0F0F0;\n --ff-machine-partial-public-status-color: #ea850e;\n --excel-sheet-button-color: #e9b5ff;\n --excel-sheet-border: rgba(10, 13, 39, 0.1647058824);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\n --icon-hover-color: #f7ecf8;\n --ff-search-icon-hover-color: #f7ecf8;\n --ff-search-filed-bg-color: #ffffff;\n --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #71347b 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}\n\n.ff-dark-theme {\n --base-bg-color: #1e1a22;\n --brand-color: #71347b;\n --dropdown-bg-color: rgba(113, 52, 123, 0.1529411765);\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: rgba(87, 87, 87, 0.1019607843);\n --ff-chip-bg: rgba(255, 255, 255, 0.8980392157);\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 --ff-progress-bar-bg-color: #F0F0F0;\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 --nlp-border-color: #efefef;\n --nlp-input-placeholder-color: #9a90a1;\n --nlp-background-color: rgba(89, 47, 124, 0.0588235294);\n --nlp-color: #592f7c;\n --nlp-pe-background: rgba(46, 158, 232, 0.0588235294);\n --nlp-pe-color: #2e9ee8;\n --nlp-step-group-background: rgba(238, 103, 13, 0.0588235294);\n --nlp-step-group-color: #ee670d;\n --nlp-hover-color: #f7ebff;\n --nlp-button-color: #efe1f9;\n --nlp-option-color: #3C3838;\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 --warning-modal-border-color: rgba(231, 155, 8, 0.4);\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-danger-variant: rgba(169, 18, 36, 0.1019607843);\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 --excel-sheet-border: rgba(207, 209, 226, 0.4431372549);\n --excel-toolbar-bg: rgba(212, 176, 228, 0.1490196078);\n --excel-header-bg: #f4ecf8;\n --excel-header-border: #d8d4da;\n --excel-toolbar-divider: rgba(87, 87, 87, 0.2);\n --excel-sheet-header-background-color: #f3f0f5;\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-comment-input-border-color: #71347b;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\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 --ff-machine-inactive-status-color: #c50303;\n --ff-machine-active-status-color: #4caf50;\n --ff-machine-running-status-color: #2055de;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --dynamic-card-border-color: #eeeaf2;\n --card-header-bg-color: rgba(89, 47, 124, 0.1019607843);\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}\n\n.ff-blue-theme {\n --base-bg-color: #ffffff;\n --button-bg-color: #f6ebff;\n --brand-color: #434db8;\n --text-color: #3c3838;\n --description-text: #7a7a7a;\n --click-able-text-color: #434db8;\n --custom-table-header-bg-color: #efe1f9;\n --icons-default-color: #434db8;\n --border-color: #c2d2fb;\n --disable-color: rgba(67, 77, 184, 0.5019607843);\n --hover-color: #f7ebff;\n --pop-up-background-blur: rgba(20, 4, 28, 0.1019607843);\n --slider-table-color: #e9ebfb;\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: #434db8;\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: #434db8;\n --default-icon-color: #a3a3a3;\n --tree-connecting-lines-color: #434db8;\n --primary-button-color: linear-gradient(188.79deg, #434db8 2.94%, #434db8 93.09%);\n --primary-button-hover: linear-gradient(179.06deg, #434db8 3.49%, #434db8 99.22%);\n --primary-button-disable: linear-gradient(180deg, #46164d 0%, #434db8 100%);\n --primary-button-text-color: #ffffff;\n --primary-button-border: linear-gradient(180deg, #434db8 3.04%, #434db8 100%);\n --secondary-button-color-text: #6f7070;\n --secondary-button-border: #6f7070;\n --secondary-button-text-color: #46164d;\n --secondary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-color: linear-gradient(179.06deg, rgba(67, 77, 184, 0.0509803922) 3.49%, rgba(70, 22, 77, 0.0509803922) 99.22%);\n --tertiary-button-hover: linear-gradient(179.06deg, rgba(67, 77, 184, 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: #1e161f;\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(67, 77, 184, 0.1019607843);\n --file-dropzone-selected-color: rgba(67, 77, 184, 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-comment-input-border-color: #434db8;\n --ff-comment-avatar-text-color: #ffffff;\n --ff-comment-border-color: #d9d9d9;\n --ff-comment-text-color: #727272;\n --ff-error-light: #e42525;\n --ff-chips-fill-color: #434db8;\n --ff-chips-blur-color: #575757;\n --ff-chip-bg: #ffffff;\n --ff-chip-text-color: #ffffff;\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: #434db8;\n --input-error-text-color: #e42525;\n --tabs-label-default-color: #7a7a7a;\n --tabs-label-active-color: #434db8;\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: #434db8;\n --delete-text-color: #c50303;\n --confirm-tick-icon-color: #5ca700;\n --warning-modal-border-color: rgba(231, 155, 8, 0.4);\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: #fcce46;\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: #808080;\n --ff-select-option-hover-color: #f7ebff;\n --ff-select-default-color: #747474;\n --ff-select-border-color: #a3a3a3;\n --ff-select-brand-color: #434db8;\n --ff-select-text-hover-color: #1e161f;\n --ff-search-filed-clear-text: #434db8;\n --ff-search-field-hover-color: #edecf8;\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: #434db8;\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: #434db8;\n --details-page-value-color: #808080;\n --table-header-text-color: #252c37;\n --table-column-text-color: #1e161f;\n --ff-machine-input-field-border-color: #f1ebf2;\n --ff-machine-input-field-text-color: #1e161f;\n --ff-connecting-branch-color: #434db8;\n --ff-connecting-branch-modal-header: #434db8;\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, #434db8 0%, #434db8 100%);\n --ff-delete-button-attachment: #a91224;\n --email-table-border-color: #959595;\n --label-edit-text-label-color: #434db8;\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: #edecf8;\n --ff-icon-color-dark-variant: #ffffff;\n --ff-icon-color-danger-variant: rgba(169, 18, 36, 0.1019607843);\n --ff-avatar-background-color: #434db8;\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 --ff-machine-inactive-status-color: #c50303;\n --ff-machine-running-status-color: #2055de;\n --ff-machine-active-status-color: #4caf50;\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 --ff-filter-toggle-button-bg-primary: linear-gradient(90deg, #434db8 0%, #9c1ebb 100%);\n --download-client-border-color: #f0e7f4;\n --download-client-header-bg-color: #ede6f2;\n --download-client-content-text-color: #592f7c;\n --download-client-choose-os-text-color: #000000;\n --download-client-icon-container-border-color: #f0e7f4;\n --download-client-icon-container-bg-color: #ffffff;\n --download-client-icon-container-box-shadow-color: rgba(89, 47, 124, 0.3019607843);\n --public-chip-bg-color: #f9d5ff;\n --partial-public-chip-bg-color: #fcc27d;\n --private-chip-bg-color: #dbc3ef;\n --disabled-chip-bg-color: #c4c3c3;\n --impact-list-text-color: #14041c;\n --impact-list-chip-text-color: #3d3c3e;\n --impact-list-chip-bg-color: #e3ccf5;\n --table-with-accordion-header-primary-bg: rgba(212, 176, 228, 0.1490196078);\n --table-with-accordion-icon-color: #1e161f;\n}";
1067
1067
  styleInject(css_248z$1d);
1068
1068
 
1069
1069
  const ThemeContext = /*#__PURE__*/React.createContext(undefined);
@@ -3073,6 +3073,7 @@ const Textarea = ({
3073
3073
  onChange,
3074
3074
  onBlur,
3075
3075
  onFocus,
3076
+ onPaste,
3076
3077
  rows = 4,
3077
3078
  cols = 40,
3078
3079
  resize = false,
@@ -3111,6 +3112,7 @@ const Textarea = ({
3111
3112
  onChange: onChange,
3112
3113
  onBlur: onBlur,
3113
3114
  onFocus: onFocus,
3115
+ onPaste: onPaste,
3114
3116
  required: required,
3115
3117
  rows: rows,
3116
3118
  cols: cols,
@@ -3286,8 +3288,14 @@ const MenuOption = ({
3286
3288
  closeDropDown();
3287
3289
  };
3288
3290
  const calculateDims = () => {
3289
- if (targetRef?.current) {
3290
- const rect = targetRef.current.getBoundingClientRect();
3291
+ let targetElement = null;
3292
+ if (typeof targetRef === 'string') {
3293
+ targetElement = document.getElementById(targetRef);
3294
+ } else if (targetRef && targetRef.current) {
3295
+ targetElement = targetRef.current;
3296
+ }
3297
+ if (targetElement) {
3298
+ const rect = targetElement.getBoundingClientRect();
3291
3299
  setMenuPosition({
3292
3300
  top: rect.top + window.scrollY,
3293
3301
  left: rect.left + window.scrollX,
@@ -4058,7 +4066,7 @@ const useFileDropzone = options => {
4058
4066
  };
4059
4067
  };
4060
4068
 
4061
- var css_248z$S = ".ff-file-dropzone-wrapper {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone {\n padding: 16px 0;\n border-radius: 8px;\n background: var(--file-dropzone-default-color);\n border: 1px dashed var(--brand-color);\n display: flex;\n align-items: center;\n flex-direction: column;\n text-align: center;\n gap: 8px;\n transition: background-color 0.2s ease;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone .ff-radio-group-wrapper {\n position: relative;\n bottom: 8px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone:hover, .ff-file-dropzone-wrapper .ff-file-dropzone--active {\n background-color: var(--file-dropzone-selected-color);\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone--webservice-file {\n display: grid;\n place-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone--webservice-container {\n display: grid;\n place-items: center;\n padding: 16px 0 40px 0;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__icon {\n height: 80px;\n width: 80px;\n display: grid;\n place-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn {\n margin: 0 auto;\n position: relative;\n font-weight: 600;\n line-height: 15px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__webservice-file {\n padding: 4px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper {\n display: flex;\n flex-direction: column;\n gap: 10px;\n max-height: 300px;\n overflow-y: auto;\n scroll-behavior: smooth;\n padding: 2px;\n -ms-overflow-style: none;\n scrollbar-width: thin;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper ::-webkit-scrollbar {\n width: 2px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 4px;\n border-radius: 4px;\n background-color: var(--file-details-bg);\n box-shadow: 0px 0px 4px 0px var(--file-details-container-shadow);\n overflow: hidden;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info {\n display: flex;\n align-items: center;\n gap: 4px;\n width: 87%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info .ff-file-info__icon {\n display: grid;\n place-items: center;\n height: 24px;\n width: 24px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper {\n display: flex;\n flex-direction: column;\n gap: 2px;\n justify-content: center;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n width: 100%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper__name {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n display: block;\n color: var(--text-color);\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-replace, .ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-remove {\n height: 24px;\n width: 24px;\n display: grid;\n place-items: center;\n cursor: pointer;\n}\n\n.ff-webservice-file-wrapper {\n display: flex;\n gap: 8px;\n}\n.ff-webservice-file-wrapper .ff-webservice-file-name {\n position: relative;\n bottom: 2px;\n}\n\n.ff-input-ref {\n display: none;\n}\n\n.ff-disable-file-dropzone-wrapper {\n opacity: 0.5;\n cursor: not-allowed;\n}";
4069
+ var css_248z$S = ".ff-file-dropzone-wrapper {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone {\n padding: 16px 0;\n border-radius: 8px;\n background: var(--file-dropzone-default-color);\n border: 1px dashed var(--brand-color);\n display: flex;\n align-items: center;\n flex-direction: column;\n text-align: center;\n gap: 8px;\n transition: background-color 0.2s ease;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone .ff-radio-group-wrapper {\n position: relative;\n bottom: 8px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone:hover, .ff-file-dropzone-wrapper .ff-file-dropzone--active {\n background-color: var(--file-dropzone-selected-color);\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone--webservice-file {\n display: grid;\n place-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone--webservice-container {\n display: grid;\n place-items: center;\n padding: 16px 0 40px 0;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__icon {\n height: 80px;\n width: 80px;\n display: grid;\n place-items: center;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn {\n margin: 0 auto;\n position: relative;\n font-weight: 600;\n line-height: 15px;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__labels .choose-file-btn input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n}\n.ff-file-dropzone-wrapper .ff-file-dropzone-content__webservice-file {\n padding: 4px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper {\n display: flex;\n flex-direction: column;\n gap: 10px;\n max-height: 300px;\n overflow-y: auto;\n scroll-behavior: smooth;\n padding: 2px;\n -ms-overflow-style: none;\n scrollbar-width: thin;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper ::-webkit-scrollbar {\n width: 2px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 4px;\n border-radius: 4px;\n background-color: var(--file-details-bg);\n box-shadow: 0px 0px 4px 0px var(--file-details-container-shadow);\n overflow: hidden;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info {\n display: flex;\n align-items: center;\n gap: 4px;\n width: 87%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info .ff-file-info__icon {\n display: grid;\n place-items: center;\n height: 24px;\n width: 24px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper {\n display: flex;\n flex-direction: column;\n gap: 2px;\n justify-content: center;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n width: 100%;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-info__name-wrapper__name {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n display: block;\n color: var(--text-color);\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-replace, .ff-file-dropzone-wrapper .ff-file-details-wrapper .ff-file-details__item .ff-file-actions__icon-remove {\n height: 24px;\n width: 24px;\n display: grid;\n place-items: center;\n cursor: pointer;\n}\n\n.ff-webservice-file-wrapper {\n display: flex;\n gap: 8px;\n}\n.ff-webservice-file-wrapper .ff-webservice-file-name {\n position: relative;\n bottom: 2px;\n}\n\n.ff-input-ref {\n display: none;\n}\n\n.ff-disable-file-dropzone-wrapper {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.footer_basic_button {\n width: 100%;\n position: absolute;\n bottom: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n justify-content: flex-end;\n gap: 16px;\n border-top: 1px solid var(--border-color);\n padding: 4px 8px;\n background-color: var(--primary-icon-color);\n}";
4062
4070
  styleInject(css_248z$S);
4063
4071
 
4064
4072
  var css_248z$R = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm, .ff-radio-wrapper .ff-radio {\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-20 {\n font-family: \"Poppins\";\n font-size: 20px;\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-radio-wrapper {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n.ff-radio-wrapper .ff-radio {\n position: relative;\n color: var(--text-color);\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input {\n display: none;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom {\n box-sizing: content-box;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n border: 1px solid var(--radio-button-border);\n position: relative;\n margin-right: 8px;\n transition: border-color background-color;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom::before {\n content: \"\";\n width: 12px;\n height: 12px;\n border-radius: 50%;\n background: #fbfdff;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n transition: background-color 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-custom::after {\n content: \"\";\n width: 16px;\n height: 16px;\n border-radius: 50%;\n border: 4px solid #f7edff;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n opacity: 0;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom {\n border: 1px solid var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom::before {\n background-color: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio:hover .ff-radio-custom::after {\n opacity: 1;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked + .ff-radio-custom {\n border-color: var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked + .ff-radio-custom::before {\n background: var(--brand-color);\n height: 12px;\n width: 12px;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom {\n border: 1px solid var(--radio-button-border);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom::before {\n background: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:disabled + .ff-radio-custom::after {\n border: 4px solid var(--radio-button-hover);\n opacity: 0;\n transition: opacity 0.3s;\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom {\n border-color: var(--brand-color);\n background-color: var(--drawer-footer-bg);\n}\n.ff-radio-wrapper .ff-radio .ff-radio-input:checked:disabled + .ff-radio-custom::before {\n background: var(--brand-color);\n}\n.ff-radio-wrapper .ff-radio--disabled {\n cursor: default;\n}\n.ff-radio-wrapper .ff-radio--disabled .ff-radio-custom {\n opacity: 0.5;\n}";
@@ -4142,13 +4150,17 @@ const RadioGroup = ({
4142
4150
  const RadioFilePreview = ({
4143
4151
  selectedFile,
4144
4152
  onFileRemoveClick,
4145
- onFileReplaceClick
4153
+ onFileReplaceClick,
4154
+ selectedRadioOption,
4155
+ setShowDrawer
4146
4156
  }) => {
4147
4157
  const fileInputRef = React.useRef(null);
4148
4158
  const handleReplaceClick = () => {
4149
- if (fileInputRef.current) {
4150
- fileInputRef.current.click();
4159
+ if (selectedRadioOption?.value === 'Test Data') {
4160
+ setShowDrawer?.(true);
4161
+ return;
4151
4162
  }
4163
+ fileInputRef.current?.click();
4152
4164
  };
4153
4165
  const handleFileChange = event => {
4154
4166
  const file = event.target.files?.[0];
@@ -4220,7 +4232,8 @@ const Dropzone = ({
4220
4232
  selectedFile,
4221
4233
  setSelectedFile,
4222
4234
  handleRemoveFile,
4223
- isDisable
4235
+ isDisable,
4236
+ setShowDrawer
4224
4237
  }) => {
4225
4238
  const isWebServiceFile = selectedFile?.name && isWebServiceFileDropZone;
4226
4239
  return jsxRuntime.jsx("div", {
@@ -4237,7 +4250,9 @@ const Dropzone = ({
4237
4250
  selectedFile: selectedFile.name,
4238
4251
  onFileRemoveClick: handleRemoveFile,
4239
4252
  onFileReplaceClick: setSelectedFile,
4240
- setSelectedFile: setSelectedFile
4253
+ setSelectedFile: setSelectedFile,
4254
+ selectedRadioOption: selectedRadioOption,
4255
+ setShowDrawer: setShowDrawer
4241
4256
  }) : jsxRuntime.jsxs(jsxRuntime.Fragment, {
4242
4257
  children: [jsxRuntime.jsx("div", {
4243
4258
  className: "ff-file-dropzone-content__icon",
@@ -4392,7 +4407,8 @@ const FileDropzone = ({
4392
4407
  handleFileChange,
4393
4408
  handleRemoveFile,
4394
4409
  isApiResponseError = false,
4395
- isDisable = false
4410
+ isDisable = false,
4411
+ setShowDrawer
4396
4412
  }) => {
4397
4413
  const fileInputRef = React.useRef(null);
4398
4414
  const {
@@ -4466,7 +4482,8 @@ const FileDropzone = ({
4466
4482
  handleFileChange: handleFileChange,
4467
4483
  handleRemoveFile: handleRemoveFile,
4468
4484
  setSelectedFile: setSelectedFile,
4469
- isDisable: isDisable
4485
+ isDisable: isDisable,
4486
+ setShowDrawer: setShowDrawer
4470
4487
  }), isWebServiceFileDropZone && jsxRuntime.jsx("input", {
4471
4488
  ref: fileInputRef,
4472
4489
  type: "file",
@@ -9102,7 +9119,10 @@ const InputWithDropdown = /*#__PURE__*/React.forwardRef(({
9102
9119
  error,
9103
9120
  helperText,
9104
9121
  optionsList,
9105
- selectedOption,
9122
+ selectedOption = {
9123
+ label: '',
9124
+ value: ''
9125
+ },
9106
9126
  autoComplete = 'off',
9107
9127
  onDropdownChangeHandler = () => {},
9108
9128
  onInputChangeHandler,
@@ -23769,6 +23789,7 @@ const AppHeader = ({
23769
23789
  onProjectDropdownLabelClick = () => {},
23770
23790
  onMoreMenuOptionClick = () => {}
23771
23791
  }) => {
23792
+ const hiddenMenuref = React.useRef(null);
23772
23793
  return jsxRuntime.jsx("div", {
23773
23794
  className: "ff-app-header-main",
23774
23795
  children: jsxRuntime.jsxs("div", {
@@ -23864,6 +23885,7 @@ const AppHeader = ({
23864
23885
  })
23865
23886
  }), appHeaderHiddenMenuItems && !checkEmpty(appHeaderHiddenMenuItems) && jsxRuntime.jsx("div", {
23866
23887
  className: "more-menu",
23888
+ ref: hiddenMenuref,
23867
23889
  children: jsxRuntime.jsx(MenuOption, {
23868
23890
  iconName: "more",
23869
23891
  options: appHeaderHiddenMenuItems,
@@ -23872,7 +23894,8 @@ const AppHeader = ({
23872
23894
  dropdownPlacement: "down",
23873
23895
  zIndex: 1001,
23874
23896
  tooltipTitle: "More",
23875
- optionCardVariant: "primary"
23897
+ optionCardVariant: "primary",
23898
+ targetRef: hiddenMenuref
23876
23899
  })
23877
23900
  })]
23878
23901
  }), rightContent && jsxRuntime.jsx("div", {
@@ -23900,7 +23923,7 @@ const Paper = ({
23900
23923
  });
23901
23924
  };
23902
23925
 
23903
- var css_248z$B = ".fontXs, .ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header, .ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(2) {\n font-family: \"Poppins\";\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, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(1) {\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-20 {\n font-family: \"Poppins\";\n font-size: 20px;\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-dashboard-donut-chart-section {\n display: flex;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section.legend-position-bottom {\n flex-direction: column;\n}\n.ff-dashboard-donut-chart-section.legend-position-left {\n flex-direction: row-reverse;\n}\n.ff-dashboard-donut-chart-section-table-legend {\n flex-direction: row;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container {\n text-align: center;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg {\n display: block;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(1) {\n font-weight: 600;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(2) {\n font-weight: 500;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container .ff-donut-chart-tooltip {\n position: absolute;\n padding: 5px;\n border-radius: 4px;\n pointer-events: none;\n background-color: var(--tooltip-bg-color);\n color: var(--tooltip-text-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container {\n display: grid;\n grid-auto-rows: 1fr;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-number-legend {\n grid-template-columns: repeat(3, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-number-legend.ff-side-legend {\n grid-template-columns: repeat(2, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-number-legend .ff-legend-item {\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend {\n grid-template-columns: repeat(2, 130px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend .ff-legend-item {\n display: flex;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend .ff-legend-item .ff-legend-capsule {\n background-color: var(--status-success-text-color);\n color: var(--tooltip-text-color);\n border-radius: 15px;\n min-width: 25px;\n height: 18px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend .ff-legend-item .ff-legend-key {\n margin-left: 8px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-memory-legend {\n grid-template-columns: repeat(3, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-memory-legend.ff-side-legend {\n grid-template-columns: repeat(2, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-memory-legend .ff-legend-item {\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table-wrapper {\n overflow: hidden;\n border: 1px solid var(--border-color);\n border-radius: 4px;\n margin-left: 1rem;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table {\n width: 100%;\n min-width: 300px;\n border-collapse: collapse;\n text-align: left;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header {\n font-weight: bold;\n background-color: var(--tabs-bg-color);\n color: var(--input-hover-border-color);\n padding: 0.5rem;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header:last-child {\n text-align: right;\n padding-right: 10px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header:nth-last-child(2) {\n width: 58px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-capsule {\n background-color: var(--status-success-text-color);\n color: var(--tooltip-text-color);\n border-radius: 1rem;\n min-width: 22px;\n height: 16px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n padding: 0.5rem;\n color: var(--input-hover-border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name:last-child,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage:last-child,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count:last-child {\n padding-right: 22px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name {\n display: flex;\n align-items: baseline;\n gap: 5px;\n color: var(--input-hover-border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n text-align: right;\n}";
23926
+ var css_248z$B = ".fontXs, .ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header, .ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(2) {\n font-family: \"Poppins\";\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, .ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(1) {\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-20 {\n font-family: \"Poppins\";\n font-size: 20px;\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-dashboard-donut-chart-section {\n display: flex;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section.legend-position-bottom {\n flex-direction: column;\n}\n.ff-dashboard-donut-chart-section.legend-position-left {\n flex-direction: row-reverse;\n}\n.ff-dashboard-donut-chart-section-table-legend {\n flex-direction: row;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container {\n text-align: center;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg {\n display: block;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(1) {\n font-weight: 600;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container svg text:nth-of-type(2) {\n font-weight: 500;\n}\n.ff-dashboard-donut-chart-section .ff-dashboard-donut-chart-svg-container .ff-donut-chart-tooltip {\n position: absolute;\n padding: 5px;\n border-radius: 4px;\n pointer-events: none;\n background-color: var(--tooltip-bg-color);\n color: var(--tooltip-text-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container {\n display: grid;\n grid-auto-rows: 1fr;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-number-legend {\n grid-template-columns: repeat(3, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-number-legend.ff-side-legend {\n grid-template-columns: repeat(2, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-number-legend .ff-legend-item {\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend {\n grid-template-columns: repeat(2, 130px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend .ff-legend-item {\n display: flex;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend .ff-legend-item .ff-legend-capsule {\n background-color: var(--status-success-text-color);\n color: var(--tooltip-text-color);\n border-radius: 15px;\n min-width: 25px;\n height: 18px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-pill-legend .ff-legend-item .ff-legend-key {\n margin-left: 8px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-memory-legend {\n grid-template-columns: repeat(3, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-memory-legend.ff-side-legend {\n grid-template-columns: repeat(2, 100px);\n}\n.ff-dashboard-donut-chart-section .ff-legend-container.ff-memory-legend .ff-legend-item {\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table-wrapper {\n overflow: hidden;\n border: 1px solid var(--border-color);\n border-radius: 4px;\n margin-left: 1rem;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table {\n width: 100%;\n min-width: 300px;\n border-collapse: collapse;\n text-align: left;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-table-thead {\n position: static;\n top: auto;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header {\n font-weight: bold;\n background-color: var(--tabs-bg-color);\n color: var(--input-hover-border-color);\n padding: 0.5rem;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header:last-child {\n text-align: right;\n padding-right: 10px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-table-header:nth-last-child(2) {\n width: 58px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-capsule {\n background-color: var(--status-success-text-color);\n color: var(--tooltip-text-color);\n border-radius: 1rem;\n min-width: 22px;\n height: 16px;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n padding: 0.5rem;\n color: var(--input-hover-border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name:last-child,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-percentage:last-child,\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count:last-child {\n padding-right: 22px;\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-name {\n display: flex;\n align-items: baseline;\n gap: 5px;\n color: var(--input-hover-border-color);\n}\n.ff-dashboard-donut-chart-section .ff-legend-table .ff-legend-item .ff-legend-count {\n text-align: right;\n}";
23904
23927
  styleInject(css_248z$B);
23905
23928
 
23906
23929
  const calculateArc$2 = (x, y, radius, startAngle, endAngle) => {
@@ -23915,6 +23938,7 @@ const colorMapping = ['var(--status-success-text-color)', 'var(--status-rejected
23915
23938
  const DashboardDonutChart = ({
23916
23939
  radius = 60,
23917
23940
  tableWidth,
23941
+ tableHeight = 190,
23918
23942
  lineWidth = 15,
23919
23943
  statusValues = [],
23920
23944
  gapAngle = 0,
@@ -24143,7 +24167,11 @@ const DashboardDonutChart = ({
24143
24167
  className: "ff-legend-table-wrapper",
24144
24168
  children: jsxRuntime.jsxs("table", {
24145
24169
  className: "ff-legend-table",
24170
+ style: {
24171
+ height: tableHeight
24172
+ },
24146
24173
  children: [jsxRuntime.jsx("thead", {
24174
+ className: 'ff-legend-table-thead',
24147
24175
  children: jsxRuntime.jsxs("tr", {
24148
24176
  children: [jsxRuntime.jsx("th", {
24149
24177
  className: "ff-table-header",
@@ -26705,7 +26733,7 @@ const IconRadioGroup = ({
26705
26733
  var css_248z$w = ".ff-machine-input-field-wrapper {\n min-width: 100px;\n height: 32px;\n position: relative;\n cursor: pointer;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse {\n height: 100%;\n width: 100%;\n border: 1px solid var(--ff-machine-input-field-border-color);\n padding: 0 8px 0 0;\n border-radius: 4px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse {\n display: flex;\n align-items: center;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper .ff-machine-icon,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse .ff-machine-icon {\n margin-left: 4px;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper .ff-machine-text,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse .ff-machine-text,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper .ff-machine-text,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse .ff-machine-text {\n max-width: fit-content;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper .ff-machine-text-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse .ff-machine-text-reverse {\n direction: ltr;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field .ff-machine-icon-text-wrapper-reverse,\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse .ff-machine-icon-text-wrapper-reverse {\n flex-direction: row-reverse;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-field-reverse {\n flex-direction: row-reverse;\n}\n.ff-machine-input-field-wrapper .ff-machine-input-label {\n position: absolute;\n top: -6px;\n left: 8px;\n background-color: var(--ff-machine-input-field-border-color);\n border-radius: 4px;\n padding: 1px 2px;\n height: 12px;\n}";
26706
26734
  styleInject(css_248z$w);
26707
26735
 
26708
- const MachineInputField = /*#__PURE__*/React.forwardRef(({
26736
+ const MachineInputField = ({
26709
26737
  width = '',
26710
26738
  options = [],
26711
26739
  runCount = 0,
@@ -26715,23 +26743,23 @@ const MachineInputField = /*#__PURE__*/React.forwardRef(({
26715
26743
  modalId = ''
26716
26744
  }) => {
26717
26745
  const getIcon = {
26718
- Local: 'local',
26719
- Browserstack: 'browserstack_icon',
26720
- SauceLabs: 'sause_lab',
26721
- LambdaTest: 'lambda_icon',
26746
+ local: 'local',
26747
+ browserstack: 'browserstack_icon',
26748
+ sauceLabs: 'sause_lab',
26749
+ lambdaTest: 'lambda_icon',
26722
26750
  mac: 'mac_icon',
26723
26751
  android: 'android_icon',
26724
26752
  linux: 'linux',
26725
- 'Google Chrome': 'chrome_icon',
26726
- 'Mozilla Firefox': 'fire_fox',
26727
- 'Microsoft Edge': 'edge',
26728
- 'Internet Explorer': 'internet_explorer',
26729
- Safari: 'safari_icon',
26730
- Opera: 'opera',
26753
+ 'google chrome': 'chrome_icon',
26754
+ 'mozilla firefox': 'fire_fox',
26755
+ 'microsoft edge': 'edge',
26756
+ 'internet explorer': 'internet_explorer',
26757
+ safari: 'safari_icon',
26758
+ opera: 'opera',
26731
26759
  windows: 'windows'
26732
26760
  };
26733
26761
  return jsxRuntime.jsxs("div", {
26734
- ref: modalId,
26762
+ id: modalId,
26735
26763
  style: {
26736
26764
  width: width
26737
26765
  },
@@ -26756,7 +26784,7 @@ const MachineInputField = /*#__PURE__*/React.forwardRef(({
26756
26784
  'ff-machine-icon-text-wrapper-reverse': contentReverse
26757
26785
  }),
26758
26786
  children: [jsxRuntime.jsx(Icon, {
26759
- name: getIcon[type] || 'local',
26787
+ name: getIcon[type.toLowerCase()] || 'local',
26760
26788
  className: "ff-machine-icon"
26761
26789
  }), jsxRuntime.jsx(Typography, {
26762
26790
  className: classNames('ff-machine-text', {
@@ -26768,13 +26796,13 @@ const MachineInputField = /*#__PURE__*/React.forwardRef(({
26768
26796
  }, type))
26769
26797
  })]
26770
26798
  });
26771
- });
26799
+ };
26772
26800
  MachineInputField.displayName = 'MachineInputField';
26773
26801
 
26774
26802
  var css_248z$v = ".ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper {\n height: 66px;\n box-sizing: border-box;\n width: fit-content;\n margin-bottom: 16px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper {\n position: relative;\n display: flex;\n box-sizing: border-box;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-sequential-select-branch {\n width: 240px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow {\n display: flex;\n align-items: center;\n position: relative;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-branch-arrow-wrapper {\n margin: 0;\n width: 40px;\n border-top: 1px solid var(--ff-connecting-branch-color);\n position: relative;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-branch-arrow-wrapper .ff-branch-arrow {\n width: 6px;\n height: 6px;\n background-color: var(--ff-connecting-branch-color);\n clip-path: polygon(100% 50%, 0 100%, 0 0);\n position: absolute;\n right: -1px;\n top: -3px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow .ff-select-branch-point {\n width: 5px;\n height: 5px;\n border-radius: 50%;\n background-color: var(--ff-connecting-branch-color);\n position: absolute;\n left: -3px;\n z-index: 102;\n top: 50%;\n transform: translateY(-50%);\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down {\n position: absolute;\n height: 38px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down .ff-select-branch-point {\n width: 5px;\n height: 5px;\n border-radius: 50%;\n background-color: var(--ff-connecting-branch-color);\n position: absolute;\n left: -2px;\n z-index: 102;\n top: 50%;\n transform: translateY(-50%);\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-branch-wrapper .ff-select-branch-arrow-down .ff-select-branch-arrow {\n width: 0;\n height: 62px;\n top: calc(50% + 1px);\n border-left: 1px solid var(--ff-connecting-branch-color);\n z-index: 102;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist {\n box-sizing: border-box;\n width: 240px;\n display: flex;\n justify-content: space-between;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-scope-wrapper {\n display: flex;\n align-items: center;\n margin-right: 12px;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-scope-wrapper .ff-scope-text {\n text-transform: capitalize;\n margin: 0;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper {\n display: flex;\n align-items: center;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper #ff-sequential-machine-datalist {\n display: flex;\n align-items: center;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-dataset-icon,\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-run-delete-icon,\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-datalist-text {\n cursor: pointer;\n}\n.ff-sequential-connecting-branch-wrapper .ff-connecting-select-branch-wrapper .ff-select-scope-datalist .ff-datalist-wrapper .ff-datalist-text {\n margin: 0 12px 0 0;\n}\n.ff-sequential-connecting-branch-wrapper .ff-sequential-branches-wrapper {\n box-sizing: border-box;\n width: fit-content;\n height: fit-content;\n}";
26775
26803
  styleInject(css_248z$v);
26776
26804
 
26777
- var css_248z$u = ".ff-connecting-branch-grid,\n.ff-connecting-branch-grid-reverse {\n box-sizing: border-box;\n display: grid;\n grid-template-columns: 24px 180px 40px 180px 24px;\n height: 66px;\n margin-bottom: 16px;\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper {\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow {\n position: absolute;\n height: 6px;\n width: 6px;\n background-color: var(--ff-connecting-branch-color);\n z-index: 2;\n clip-path: polygon(0 0, 0% 100%, 100% 50%);\n top: calc(25% - 3px);\n right: -2px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow-reverse {\n position: absolute;\n height: 6px;\n width: 6px;\n background-color: var(--ff-connecting-branch-color);\n z-index: 2;\n left: -2px;\n top: calc(25% - 3px);\n clip-path: polygon(0 50%, 100% 100%, 100% 0);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-container,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-container {\n width: 100%;\n height: 25%;\n border: 1px solid var(--ff-connecting-branch-color);\n border-top: none;\n border-right: none;\n border-bottom-left-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-container-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-container-reverse {\n width: 100%;\n height: 25%;\n border: 1px solid var(--ff-connecting-branch-color);\n border-top: none;\n border-left: none;\n border-bottom-right-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist {\n display: flex;\n padding-top: 4px;\n height: 24px;\n justify-content: flex-end;\n width: 100%;\n align-items: center;\n flex-direction: row;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-dataset-list-branch,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-dataset-list-branch {\n display: flex;\n align-items: center;\n flex-direction: row;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-icon {\n margin-right: 4px;\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-text,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-text {\n margin-right: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-delete-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-delete-icon {\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse {\n display: flex;\n padding-top: 4px;\n height: 24px;\n justify-content: flex-end;\n width: 100%;\n align-items: center;\n flex-direction: row-reverse;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-dataset-list-branch,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-dataset-list-branch {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-icon {\n margin-right: 4px;\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-text,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-text {\n margin-right: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-delete-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-delete-icon {\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper {\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n border-radius: 50%;\n z-index: 2;\n right: -2px;\n top: calc(50% - 1px);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point-reverse {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n border-radius: 50%;\n z-index: 2;\n left: -2px;\n top: calc(50% - 1px);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow {\n height: 0;\n width: 100%;\n margin-top: calc(50% - 3px);\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n clip-path: polygon(0 0, 0% 100%, 100% 50%);\n top: calc(25% - 3px);\n right: -2px;\n z-index: 2;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow-reverse {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n clip-path: polygon(0 50%, 100% 100%, 100% 0);\n top: calc(25% - 3px);\n left: -1px;\n z-index: 2;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-end-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-end-arrow {\n width: 100%;\n height: 100%;\n margin-top: 17px;\n border-top: 1px solid var(--ff-connecting-branch-color);\n border-right: 1px solid var(--ff-connecting-branch-color);\n border-top-right-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-end-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-end-arrow-reverse {\n width: 100%;\n height: 100%;\n margin-top: 17px;\n border-top: 1px solid var(--ff-connecting-branch-color);\n border-left: 1px solid var(--ff-connecting-branch-color);\n border-top-left-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-browser-button,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-browser-button {\n height: 32px;\n display: flex;\n align-items: center;\n}\n\n.ff-connecting-branch-grid-reverse {\n direction: rtl;\n margin: 0 0 16px 0;\n}";
26805
+ var css_248z$u = ".ff-connecting-branch-grid,\n.ff-connecting-branch-grid-reverse {\n box-sizing: border-box;\n display: grid;\n grid-template-columns: 24px 180px 40px 180px 24px;\n height: 66px;\n margin-bottom: 16px;\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper {\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow {\n position: absolute;\n height: 6px;\n width: 6px;\n background-color: var(--ff-connecting-branch-color);\n z-index: 2;\n clip-path: polygon(0 0, 0% 100%, 100% 50%);\n top: calc(25% - 3px);\n right: -2px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-arrow-reverse {\n position: absolute;\n height: 6px;\n width: 6px;\n background-color: var(--ff-connecting-branch-color);\n z-index: 2;\n left: -2px;\n top: calc(25% - 3px);\n clip-path: polygon(0 50%, 100% 100%, 100% 0);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-container,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-container {\n width: 100%;\n height: 25%;\n border: 1px solid var(--ff-connecting-branch-color);\n border-top: none;\n border-right: none;\n border-bottom-left-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-start-wrapper .ff-connecting-branch-container-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-start-wrapper .ff-connecting-branch-container-reverse {\n width: 100%;\n height: 25%;\n border: 1px solid var(--ff-connecting-branch-color);\n border-top: none;\n border-left: none;\n border-bottom-right-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist {\n display: flex;\n padding-top: 4px;\n height: 24px;\n justify-content: flex-end;\n width: 100%;\n align-items: center;\n flex-direction: row;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-dataset-list-branch,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-dataset-list-branch {\n display: flex;\n align-items: center;\n flex-direction: row;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-icon {\n margin-right: 4px;\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-text,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-text {\n margin-right: 8px;\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist .ff-connecting-delete-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist .ff-connecting-delete-icon {\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse {\n display: flex;\n padding-top: 4px;\n height: 24px;\n justify-content: flex-end;\n width: 100%;\n align-items: center;\n flex-direction: row-reverse;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-dataset-list-branch,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-dataset-list-branch {\n display: flex;\n align-items: center;\n flex-direction: row-reverse;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-icon {\n margin-right: 4px;\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-text,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-text {\n margin-right: 8px;\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-datalist-reverse .ff-connecting-delete-icon,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-datalist-reverse .ff-connecting-delete-icon {\n cursor: pointer;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper {\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n border-radius: 50%;\n z-index: 2;\n right: -2px;\n top: calc(50% - 1px);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-input-point-wrapper .ff-connecting-branch-point-reverse {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n border-radius: 50%;\n z-index: 2;\n left: -2px;\n top: calc(50% - 1px);\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow {\n height: 0;\n width: 100%;\n margin-top: calc(50% - 3px);\n position: relative;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n clip-path: polygon(0 0, 0% 100%, 100% 50%);\n top: calc(25% - 3px);\n right: -2px;\n z-index: 2;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-middle-arrow .ff-connecting-branch-arrow-reverse {\n position: absolute;\n height: 5px;\n width: 5px;\n background-color: var(--ff-connecting-branch-color);\n clip-path: polygon(0 50%, 100% 100%, 100% 0);\n top: calc(25% - 3px);\n left: -1px;\n z-index: 2;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-end-arrow,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-end-arrow {\n width: 100%;\n height: 100%;\n margin-top: 17px;\n border-top: 1px solid var(--ff-connecting-branch-color);\n border-right: 1px solid var(--ff-connecting-branch-color);\n border-top-right-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-end-arrow-reverse,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-end-arrow-reverse {\n width: 100%;\n height: 100%;\n margin-top: 17px;\n border-top: 1px solid var(--ff-connecting-branch-color);\n border-left: 1px solid var(--ff-connecting-branch-color);\n border-top-left-radius: 8px;\n}\n.ff-connecting-branch-grid .ff-connecting-branch-browser-button,\n.ff-connecting-branch-grid-reverse .ff-connecting-branch-browser-button {\n height: 32px;\n display: flex;\n align-items: center;\n}\n\n.ff-connecting-branch-grid-reverse {\n direction: rtl;\n margin: 0 0 16px 0;\n}";
26778
26806
  styleInject(css_248z$u);
26779
26807
 
26780
26808
  const Branches = ({
@@ -26819,8 +26847,6 @@ const Branches = ({
26819
26847
  },
26820
26848
  deviceInfo
26821
26849
  } = machineInstance;
26822
- // Helper to handle device info safely
26823
- const getDeviceOption = (platform, defaultType = '', index = 0) => deviceInfo?.[index]?.platform?.toLowerCase().includes(platform ?? '') ? defaultType : undefined;
26824
26850
  const getEnvironment = (environment = '') => {
26825
26851
  if (environment.toLowerCase().includes('browserstack')) return 'Browserstack';
26826
26852
  if (environment.toLowerCase().includes('lambdatest')) return 'LambdaTest';
@@ -26843,10 +26869,10 @@ const Branches = ({
26843
26869
  // Mobile-specific options
26844
26870
  const mobileOptions = [{
26845
26871
  label: deviceInfo?.[0]?.name,
26846
- type: getDeviceOption('android', 'android_icon', 0)
26872
+ type: 'android'
26847
26873
  }, {
26848
26874
  label: deviceInfo?.[1]?.name,
26849
- type: getDeviceOption('ios', 'mac_icon', 1)
26875
+ type: 'mac'
26850
26876
  }];
26851
26877
  // Determine options based on the type
26852
26878
  switch (type.toLowerCase()) {
@@ -27343,7 +27369,8 @@ const Toastify = () => {
27343
27369
  isOpen: toastProps.isOpen,
27344
27370
  variant: toastProps.variant,
27345
27371
  toastTitle: toastProps.toastTitle,
27346
- toastMessage: toastProps.toastMessage
27372
+ toastMessage: toastProps.toastMessage,
27373
+ zIndex: 1000000000
27347
27374
  });
27348
27375
  };
27349
27376
  // Utility to trigger toast messages outside of the Toastify component
@@ -27781,6 +27808,7 @@ const EDIT = 'EDIT';
27781
27808
  const VIEW = 'VIEW';
27782
27809
  const CLEAR = 'CLEAR';
27783
27810
  const BLUR = 'BLUR';
27811
+ const KEY_PRESS = 'KEY_PRESS';
27784
27812
  const KEY_DOWN = 'KEY_DOWN';
27785
27813
  const DRAG_START = 'DRAG_START';
27786
27814
  const DRAG_END = 'DRAG_END';
@@ -27949,6 +27977,14 @@ function deleteColumn(data) {
27949
27977
  }
27950
27978
  };
27951
27979
  }
27980
+ function keyPress(event) {
27981
+ return {
27982
+ type: KEY_PRESS,
27983
+ payload: {
27984
+ event
27985
+ }
27986
+ };
27987
+ }
27952
27988
  function setData(data) {
27953
27989
  return {
27954
27990
  type: SET_DATA,
@@ -30305,6 +30341,23 @@ function reducer(state, action) {
30305
30341
  {
30306
30342
  return blur(state);
30307
30343
  }
30344
+ case KEY_PRESS:
30345
+ {
30346
+ const {
30347
+ event
30348
+ } = action.payload;
30349
+ if (isActiveReadOnly(state) || event.metaKey) {
30350
+ return state;
30351
+ }
30352
+ if (state.mode === 'view' && state.active) {
30353
+ const selectedRange = state.selected.toRange(state.model.data);
30354
+ if (selectedRange?.size() === 1) {
30355
+ return edit(clear(state));
30356
+ }
30357
+ return edit(state);
30358
+ }
30359
+ return state;
30360
+ }
30308
30361
  case KEY_DOWN:
30309
30362
  {
30310
30363
  const {
@@ -32036,7 +32089,12 @@ const ActiveCell = props => {
32036
32089
  return hidden ? null : jsxRuntime.jsxs("div", {
32037
32090
  ref: rootRef,
32038
32091
  className: classNames('ff-spreadsheet-active-cell', `ff-spreadsheet-active-cell--${mode}`),
32039
- style: dimensions,
32092
+ style: {
32093
+ top: dimensions?.top || 0,
32094
+ height: (dimensions?.height ?? 0) + 1,
32095
+ left: dimensions?.left || 0,
32096
+ width: (dimensions?.width ?? 0) + 1
32097
+ },
32040
32098
  onClick: mode === 'view' && !readOnly ? edit : undefined,
32041
32099
  tabIndex: 0,
32042
32100
  children: [mode === 'edit' && active && jsxRuntime.jsx(DataEditor, {
@@ -32088,8 +32146,8 @@ const FloatingRect = ({
32088
32146
  'ff-spreadsheet-floating-rect--hidden': hidden
32089
32147
  }),
32090
32148
  style: {
32091
- width: adjustedWidth,
32092
- height: adjustedHeight,
32149
+ width: (adjustedWidth ?? 0) + 1,
32150
+ height: (adjustedHeight ?? 0) + 1,
32093
32151
  top,
32094
32152
  left
32095
32153
  }
@@ -32121,7 +32179,7 @@ const Copied = () => {
32121
32179
  });
32122
32180
  };
32123
32181
 
32124
- var css_248z$n = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\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-20 {\n font-family: \"Poppins\";\n font-size: 20px;\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-excel {\n display: flex;\n flex-direction: column;\n}\n.ff-excel .ff-excel-toolbar-container {\n position: relative;\n top: 0;\n background-color: var(--excel-toolbar-bg);\n padding: 4px 8px;\n margin-bottom: 20px;\n}\n.ff-excel .ff-spreadsheet {\n --background-color: var(--drawer-footer-bg);\n --text-color: var(--text-color);\n --readonly-text-color: var(--toggle-strip-active);\n --outline-color: var(--toggle-strip-active);\n --outline-background-color: var(--overlay-bg);\n --border-color: var(--excel-sheet-border);\n --header-background-color: var(--excel-header-bg);\n --elevation: var(--brand-color);\n position: relative;\n overflow: scroll;\n background: var(--background-color);\n color: var(--text-color);\n scrollbar-width: none;\n display: inline-block;\n}\n.ff-excel .ff-spreadsheet-active-cell {\n position: absolute;\n border: 2px solid var(--outline-color);\n box-sizing: border-box;\n}\n.ff-excel .ff-spreadsheet-active-cell--edit {\n background: var(--background-color);\n box-shadow: var(--elevation);\n}\n.ff-excel .ff-spreadsheet-table {\n overflow: scroll;\n top: 0;\n left: 0;\n margin: 0;\n position: relative;\n border-collapse: collapse;\n table-layout: fixed;\n}\n.ff-excel .ff-spreadsheet-table::-webkit-scrollbar {\n height: 0px;\n}\n.ff-excel .ff-spreadsheet-cell {\n outline: none;\n position: relative;\n z-index: 0;\n}\n.ff-excel .ff-spreadsheet-active-cell .select_dot {\n background-color: var(--elevation);\n height: 10px;\n width: 10px;\n border-radius: 50%;\n position: absolute;\n bottom: -5px;\n right: -5px;\n cursor: crosshair;\n z-index: 1000;\n}\n.ff-excel .ff-spreadsheet-cell--readonly {\n color: var(--readonly-text-color);\n}\n.ff-excel .ff-spreadsheet-cell,\n.ff-excel .ff-spreadsheet-header {\n border: 0.1px solid var(--border-color);\n overflow: hidden;\n word-break: keep-all;\n white-space: nowrap;\n text-align: left;\n box-sizing: border-box;\n user-select: none;\n}\n.ff-excel .ff-spreadsheet-header {\n border: 0.1px solid var(--border-color);\n background-color: var(--header-background-color);\n color: var(--readonly-text-color);\n text-align: center;\n z-index: 1000;\n position: sticky;\n top: 0;\n left: 0;\n}\n.ff-excel .ff-spreadsheet-corner-header {\n position: fixed;\n z-index: 3000;\n}\n.ff-excel .ff-spreadsheet-row-header {\n height: 34px;\n}\n.ff-excel .corner-header {\n border: 1px solid var(--border-color);\n background-color: var(--header-background-color);\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1100;\n top: -1px;\n width: 60px;\n height: 34px;\n left: -1px;\n}\n.ff-excel .ff-spreadsheet-header--selected {\n background: var(--brand-color);\n color: var(--tooltip-text-color);\n}\n.ff-excel .ff-spreadsheet-data-viewer,\n.ff-excel .ff-spreadsheet-data-editor input {\n padding: 4px;\n box-sizing: border-box;\n}\n.ff-excel .ff-spreadsheet-header {\n box-sizing: border-box;\n}\n.ff-excel .ff-spreadsheet-data-viewer--preserve-breaks {\n white-space: pre-wrap;\n}\n.ff-excel .ff-spreadsheet-data-editor,\n.ff-excel .ff-spreadsheet-data-editor input {\n width: 100%;\n height: 100%;\n}\n.ff-excel .ff-spreadsheet-data-editor input {\n font: inherit;\n color: inherit;\n background: none;\n border: none;\n outline: none;\n margin: 0;\n}\n.ff-excel .ff-spreadsheet-data-viewer--boolean {\n text-align: center;\n}\n.ff-excel .ff-spreadsheet-floating-rect {\n position: absolute;\n pointer-events: none;\n box-sizing: border-box;\n}\n.ff-excel .ff-spreadsheet-floating-rect--hidden {\n display: none;\n}\n.ff-excel .ff-spreadsheet-floating-rect--selected {\n background: var(--outline-background-color);\n border: 2px var(--outline-color) solid;\n}\n.ff-excel .ff-spreadsheet-floating-rect--dragging {\n border: none;\n}\n.ff-excel .ff-spreadsheet-floating-rect--copied {\n border: 2px var(--outline-color) dashed;\n}";
32182
+ var css_248z$n = ".fontXs {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\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-20 {\n font-family: \"Poppins\";\n font-size: 20px;\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-excel {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n.ff-excel .ff-excel-toolbar-container {\n position: relative;\n top: 0;\n background-color: var(--excel-toolbar-bg);\n padding: 4px 8px;\n margin-bottom: 20px;\n}\n.ff-excel .ff-excel-spreadsheet {\n --background-color: var(--drawer-footer-bg);\n --text-color: var(--text-color);\n --readonly-text-color: var(--toggle-strip-active);\n --outline-color: var(--toggle-strip-active);\n --outline-background-color: var(--overlay-bg);\n --border-color: var(--excel-sheet-border);\n --header-background-color: var(--excel-header-bg);\n --elevation: var(--brand-color);\n position: relative;\n overflow: scroll;\n background: var(--background-color);\n color: var(--text-color);\n scrollbar-width: none;\n display: inline-block;\n}\n.ff-excel .ff-excel-header-hider {\n position: absolute;\n background-color: var(--excel-header-border);\n z-index: 500;\n left: -1px;\n top: 59px;\n}\n.ff-excel .ff-excel-header-column-hider {\n height: 34px;\n width: 100%;\n}\n.ff-excel .ff-excel-header-row-hider {\n bottom: 0px;\n width: 60px;\n}\n.ff-excel .ff-spreadsheet-active-cell {\n position: absolute;\n border: 1px solid var(--outline-color);\n box-sizing: border-box;\n z-index: 100;\n}\n.ff-excel .ff-spreadsheet-active-cell--edit {\n background: var(--background-color);\n box-shadow: var(--elevation);\n}\n.ff-excel .ff-spreadsheet-table {\n overflow: scroll;\n top: 0;\n left: 0;\n margin: 0;\n position: relative;\n border-collapse: collapse;\n table-layout: fixed;\n}\n.ff-excel .ff-spreadsheet-table::-webkit-scrollbar {\n height: 0px;\n}\n.ff-excel .ff-spreadsheet-cell {\n outline: none;\n position: relative;\n z-index: 0;\n}\n.ff-excel .ff-spreadsheet-active-cell .select_dot {\n background-color: var(--elevation);\n height: 10px;\n width: 10px;\n border-radius: 50%;\n position: absolute;\n bottom: -5px;\n right: -5px;\n cursor: crosshair;\n z-index: 1000;\n}\n.ff-excel .ff-spreadsheet-cell--readonly {\n color: var(--readonly-text-color);\n}\n.ff-excel .ff-spreadsheet-cell,\n.ff-excel .ff-spreadsheet-header {\n border: 0.1px solid var(--border-color);\n overflow: hidden;\n word-break: keep-all;\n white-space: nowrap;\n text-align: left;\n box-sizing: border-box;\n user-select: none;\n}\n.ff-excel .ff-spreadsheet-header {\n background-color: var(--header-background-color);\n color: var(--readonly-text-color);\n text-align: center;\n z-index: 1000;\n position: sticky;\n top: 0;\n left: 0;\n}\n.ff-excel .ff-spreadsheet-corner-header {\n position: fixed;\n z-index: 2000;\n border: 2px solid var(--border-color);\n}\n.ff-excel .ff-spreadsheet-row-header {\n height: 34px;\n}\n.ff-excel .corner-header {\n background-color: var(--header-background-color);\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1500;\n top: -2px;\n width: 58px;\n height: 32px;\n left: -1px;\n}\n.ff-excel .ff-spreadsheet-header--selected {\n background: var(--brand-color);\n color: var(--tooltip-text-color);\n}\n.ff-excel .ff-spreadsheet-data-viewer,\n.ff-excel .ff-spreadsheet-data-editor input {\n padding: 4px;\n box-sizing: border-box;\n}\n.ff-excel .ff-spreadsheet-header {\n box-sizing: border-box;\n}\n.ff-excel .ff-spreadsheet-data-viewer--preserve-breaks {\n white-space: pre-wrap;\n}\n.ff-excel .ff-spreadsheet-data-editor,\n.ff-excel .ff-spreadsheet-data-editor input {\n width: 100%;\n height: 100%;\n}\n.ff-excel .ff-spreadsheet-data-editor input {\n font: inherit;\n color: inherit;\n background: none;\n border: none;\n outline: none;\n margin: 0;\n}\n.ff-excel .ff-spreadsheet-data-viewer--boolean {\n text-align: center;\n}\n.ff-excel .ff-spreadsheet-floating-rect {\n position: absolute;\n pointer-events: none;\n box-sizing: border-box;\n}\n.ff-excel .ff-spreadsheet-floating-rect--hidden {\n display: none;\n}\n.ff-excel .ff-spreadsheet-floating-rect--selected {\n background: var(--outline-background-color);\n border: 1px var(--outline-color) solid;\n}\n.ff-excel .ff-spreadsheet-floating-rect--dragging {\n border: none;\n}\n.ff-excel .ff-spreadsheet-floating-rect--copied {\n border: 1px var(--outline-color) dashed;\n}";
32125
32183
  styleInject(css_248z$n);
32126
32184
 
32127
32185
  var css_248z$m = ".ff-excel-toolbar {\n display: flex;\n height: 32px;\n align-items: center;\n}\n.ff-excel-toolbar .ff-excel-toolbar-divider {\n width: 1px;\n height: 24px;\n background-color: var(--excel-toolbar-divider);\n margin: 0 24px;\n border-radius: 1px;\n z-index: 1000;\n}\n.ff-excel-toolbar .ff-excel-toolbar-font {\n display: flex;\n gap: 8px;\n justify-content: space-between;\n}\n.ff-excel-toolbar .ff-excel-toolbar-font .ff-excel-toolbar-font-family {\n width: 120px;\n}\n.ff-excel-toolbar .ff-excel-toolbar-font .ff-excel-toolbar-font-size {\n width: 56px;\n}\n.ff-excel-toolbar .ff-excel-toolbar-text {\n width: 100px;\n height: 24px;\n display: flex;\n gap: 8px;\n justify-content: space-between;\n}\n.ff-excel-toolbar .ff-excel-toolbar-text .ff-excel-toolbar-icon-underline {\n display: flex;\n align-items: center;\n}\n.ff-excel-toolbar .ff-excel-toolbar-icon {\n width: 88px;\n height: 24px;\n display: flex;\n gap: 8px;\n justify-content: space-between;\n}\n.ff-excel-toolbar .ff-excel-toolbar-icon .ff-excel-toolbar-icon-color {\n width: 24px;\n height: 24px;\n border-radius: 4px;\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.ff-excel-toolbar .ff-excel-toolbar-icon .ff-excel-toolbar-icon-color:hover {\n border-radius: 4px;\n background-color: var(--icon-hover-color);\n}\n.ff-icon-dark .ff-excel-toolbar .ff-excel-toolbar-icon .ff-excel-toolbar-icon-color {\n background-color: var(--brand-color);\n}\n.ff-icon-dark .ff-excel-toolbar .ff-excel-toolbar-icon .ff-excel-toolbar-icon-color.ff-icon-click:hover {\n background-color: var(--primary-button-text-color);\n}\n.ff-icon-dark .ff-excel-toolbar .ff-excel-toolbar-icon .ff-excel-toolbar-icon-color.ff-icon-click:hover svg path {\n fill: var(--brand-color);\n}\n.ff-excel-toolbar .ff-excel-toolbar-icon .ff-excel-toolbar-icon-color:hover {\n border-radius: 4px;\n background-color: var(--icon-hover-color);\n}\n.ff-icon-dark .ff-excel-toolbar .ff-excel-toolbar-icon .ff-excel-toolbar-icon-color {\n background-color: var(--brand-color);\n}\n.ff-icon-dark .ff-excel-toolbar .ff-excel-toolbar-icon .ff-excel-toolbar-icon-color.ff-icon-click:hover {\n background-color: var(--primary-button-text-color);\n}\n.ff-icon-dark .ff-excel-toolbar .ff-excel-toolbar-icon .ff-excel-toolbar-icon-color.ff-icon-click:hover svg path {\n fill: var(--brand-color);\n}\n.ff-excel-toolbar .ff-excel-toolbar-menu {\n display: flex;\n align-items: center;\n width: 36px;\n height: 24px;\n}\n.ff-excel-toolbar .ff-excel-toolbar-menu .ff-excel-toolbar-menu-option {\n display: flex;\n align-items: center;\n}";
@@ -32313,6 +32371,8 @@ const ExcelToolBar = ({
32313
32371
  textAlign: 'center'
32314
32372
  };
32315
32373
  const [cellStyle, setCellStyle] = React.useState(cell?.style || basicStyle);
32374
+ const underLineMenuRef = React.useRef(null);
32375
+ const borderMenuRef = React.useRef(null);
32316
32376
  React.useEffect(() => {
32317
32377
  setCellStyle(cell?.style || basicStyle);
32318
32378
  }, [cell]);
@@ -32370,10 +32430,6 @@ const ExcelToolBar = ({
32370
32430
  value: 'double_border',
32371
32431
  label: 'Double Underline',
32372
32432
  icon: 'double_underline'
32373
- }, {
32374
- value: 'line-through',
32375
- label: 'Strikethrough',
32376
- icon: 'strike_through'
32377
32433
  }];
32378
32434
  const fontFamily = [{
32379
32435
  label: 'Times New Roman',
@@ -32567,18 +32623,22 @@ const ExcelToolBar = ({
32567
32623
  disabled: toolbar === 'disable',
32568
32624
  onClick: () => setUnderlineType(data, underLine, true),
32569
32625
  name: getUnderlineIcon()
32570
- }), jsxRuntime.jsx(MenuOption, {
32571
- iconName: "arrow_down",
32572
- zIndex: 1000,
32573
- iconSize: 12,
32574
- options: underlineTypeIcon,
32575
- tooltipPlacement: "top",
32576
- variant: "light",
32577
- onOptionClick: e => {
32578
- let selectedValue = e.value;
32579
- setUnderlineType(data, selectedValue, true);
32580
- setUnderLine(selectedValue);
32581
- }
32626
+ }), jsxRuntime.jsx("span", {
32627
+ ref: underLineMenuRef,
32628
+ children: jsxRuntime.jsx(MenuOption, {
32629
+ targetRef: underLineMenuRef,
32630
+ iconName: "arrow_down",
32631
+ zIndex: 1000,
32632
+ iconSize: 12,
32633
+ options: underlineTypeIcon,
32634
+ tooltipPlacement: "top",
32635
+ variant: "light",
32636
+ onOptionClick: e => {
32637
+ let selectedValue = e.value;
32638
+ setUnderlineType(data, selectedValue, true);
32639
+ setUnderLine(selectedValue);
32640
+ }
32641
+ })
32582
32642
  })]
32583
32643
  })
32584
32644
  })]
@@ -32649,35 +32709,25 @@ const ExcelToolBar = ({
32649
32709
  disabled: toolbar === 'disable',
32650
32710
  onClick: () => setBorderType(data, border, 'black'),
32651
32711
  name: getBorderIcon()
32652
- }), jsxRuntime.jsx(MenuOption, {
32653
- iconName: "arrow_down",
32654
- iconSize: 12,
32655
- zIndex: 1000,
32656
- options: borderTypeIcon,
32657
- tooltipPlacement: "top",
32658
- variant: "light",
32659
- onOptionClick: e => {
32660
- let selectedValue = e.value;
32661
- setBorderType(data, selectedValue, 'black');
32662
- setBorder(selectedValue);
32663
- }
32712
+ }), jsxRuntime.jsx("span", {
32713
+ ref: borderMenuRef,
32714
+ children: jsxRuntime.jsx(MenuOption, {
32715
+ iconName: "arrow_down",
32716
+ targetRef: borderMenuRef,
32717
+ iconSize: 12,
32718
+ zIndex: 1000,
32719
+ options: borderTypeIcon,
32720
+ tooltipPlacement: "top",
32721
+ variant: "light",
32722
+ onOptionClick: e => {
32723
+ let selectedValue = e.value;
32724
+ setBorderType(data, selectedValue, 'black');
32725
+ setBorder(selectedValue);
32726
+ }
32727
+ })
32664
32728
  })]
32665
32729
  })
32666
32730
  })
32667
- }), jsxRuntime.jsx("div", {
32668
- className: "ff-excel-toolbar-divider"
32669
- }), jsxRuntime.jsx("div", {
32670
- className: "ff-excel-toolbar-menu",
32671
- children: jsxRuntime.jsx(Tooltip, {
32672
- placement: "top",
32673
- title: 'Formula',
32674
- children: jsxRuntime.jsx(Icon, {
32675
- hoverEffect: true,
32676
- disabled: toolbar === 'disable',
32677
- onClick: () => setBorderType(data, border, 'black'),
32678
- name: "formula_icon"
32679
- })
32680
- })
32681
32731
  })]
32682
32732
  });
32683
32733
  };
@@ -32697,6 +32747,8 @@ const Spreadsheet = props => {
32697
32747
  HeaderRow: HeaderRow$1 = HeaderRow,
32698
32748
  DataEditor: DataEditor$1 = DataEditor,
32699
32749
  DataViewer: DataViewer$1 = DataViewer,
32750
+ onSelect = () => {},
32751
+ onActivate = () => {},
32700
32752
  onEvaluatedDataChange = () => {}
32701
32753
  } = props;
32702
32754
  const initialState = React__namespace.useMemo(() => {
@@ -32723,6 +32775,7 @@ const Spreadsheet = props => {
32723
32775
  const copy$1 = useAction(copy);
32724
32776
  const paste$1 = useAction(paste);
32725
32777
  const onKeyDownAction = useAction(keyDown);
32778
+ const onKeyPress = useAction(keyPress);
32726
32779
  const onDragStart = useAction(dragStart);
32727
32780
  const onDragEnd = useAction(dragEnd);
32728
32781
  const setData$1 = useAction(setData);
@@ -32742,6 +32795,21 @@ const Spreadsheet = props => {
32742
32795
  const addColumnLeft$1 = useAction(addColumnLeft);
32743
32796
  const deleteRow$1 = useAction(deleteRow);
32744
32797
  const deleteColumn$1 = useAction(deleteColumn);
32798
+ // Track active
32799
+ const prevActiveRef = React__namespace.useRef(state.active);
32800
+ React__namespace.useEffect(() => {
32801
+ if (state.active !== prevActiveRef.current) {
32802
+ if (state.active) {
32803
+ onActivate(state.active);
32804
+ } else {
32805
+ const root = rootRef.current;
32806
+ if (root && isFocusedWithin(root) && document.activeElement) {
32807
+ document.activeElement.blur();
32808
+ }
32809
+ }
32810
+ }
32811
+ prevActiveRef.current = state.active;
32812
+ }, [onActivate, state.active]);
32745
32813
  const prevEvaluatedDataRef = React__namespace.useRef(state.model.evaluatedData);
32746
32814
  React__namespace.useEffect(() => {
32747
32815
  if (state?.model?.evaluatedData !== prevEvaluatedDataRef?.current) {
@@ -32749,6 +32817,15 @@ const Spreadsheet = props => {
32749
32817
  }
32750
32818
  prevEvaluatedDataRef.current = state.model.evaluatedData;
32751
32819
  }, [state?.model?.evaluatedData, onEvaluatedDataChange]);
32820
+ const prevSelectedRef = React__namespace.useRef(state.selected);
32821
+ React__namespace.useEffect(() => {
32822
+ if (!state.selected.equals(prevSelectedRef.current)) {
32823
+ if (!props.selected || !state.selected.equals(props.selected)) {
32824
+ onSelect(state.selected);
32825
+ }
32826
+ }
32827
+ prevSelectedRef.current = state.selected;
32828
+ }, [state.selected, onSelect, props.selected]);
32752
32829
  // Update selection when props.selected changes
32753
32830
  const prevSelectedPropRef = React__namespace.useRef(props.selected);
32754
32831
  React__namespace.useEffect(() => {
@@ -32900,6 +32977,10 @@ const Spreadsheet = props => {
32900
32977
  const rootNode = React__namespace.useMemo(() => jsxRuntime.jsxs("div", {
32901
32978
  className: "ff-excel",
32902
32979
  children: [jsxRuntime.jsx("div", {
32980
+ className: "ff-excel-header-hider ff-excel-header-column-hider"
32981
+ }), jsxRuntime.jsx("div", {
32982
+ className: "ff-excel-header-hider ff-excel-header-row-hider"
32983
+ }), jsxRuntime.jsx("div", {
32903
32984
  className: "ff-excel-toolbar-container",
32904
32985
  children: jsxRuntime.jsx(ExcelToolBar, {
32905
32986
  onBold: onBold,
@@ -32918,12 +32999,17 @@ const Spreadsheet = props => {
32918
32999
  style: {
32919
33000
  height: sheetHeight
32920
33001
  },
32921
- className: classNames('ff-spreadsheet', className),
32922
- onKeyDown: handleKeyDown,
33002
+ className: classNames('ff-excel-spreadsheet', className),
33003
+ onKeyPress: e => {
33004
+ onKeyPress(e);
33005
+ },
33006
+ onKeyDown: e => {
33007
+ handleKeyDown(e);
33008
+ },
32923
33009
  onMouseMove: handleMouseMove,
32924
33010
  children: [tableNode, activeCellNode, jsxRuntime.jsx(Selected, {}), jsxRuntime.jsx(Copied, {})]
32925
33011
  })]
32926
- }), [className, handleKeyDown, handleMouseMove, tableNode, activeCellNode]);
33012
+ }), [className, onKeyPress, handleKeyDown, handleMouseMove, tableNode, activeCellNode]);
32927
33013
  return jsxRuntime.jsx(context.Provider, {
32928
33014
  value: reducerElements,
32929
33015
  children: rootNode
@@ -33309,7 +33395,7 @@ const ExcelFile = ({
33309
33395
  setContextMenu({
33310
33396
  open: true,
33311
33397
  position: {
33312
- x: event.pageX - 50,
33398
+ x: event.pageX - 200,
33313
33399
  y: event.pageY - 250
33314
33400
  },
33315
33401
  options: options
@@ -33627,17 +33713,28 @@ const AttachImage = ({
33627
33713
  });
33628
33714
  };
33629
33715
 
33630
- var css_248z$f = ".ff-card-container {\n width: 120px;\n height: 93px;\n display: flex;\n align-items: center;\n border: 1px solid var(--border-color);\n border-radius: 4px;\n overflow: hidden;\n cursor: pointer;\n}\n.ff-card-container:hover.passed {\n border-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container:hover.failed {\n border-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container:hover.warning {\n border-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container:hover.skipped {\n border-color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container:hover.flaky {\n border-color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container .ff-status-bar {\n width: 24px;\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: start;\n align-items: center;\n border-right: 1px solid var(--border-color);\n gap: 30px;\n}\n.ff-card-container .ff-status-bar .ff-status-text {\n transform: rotate(-90deg);\n transform-origin: center;\n display: inline-block;\n}\n.ff-card-container.passed .ff-status-bar {\n background-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.failed .ff-status-bar {\n background-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.warning .ff-status-bar {\n background-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.skipped .ff-status-bar {\n background-color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.flaky .ff-status-bar {\n background-color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container .ff-content {\n flex: 1;\n padding: 8px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n}\n.ff-card-container .ff-content .ff-number {\n margin-bottom: 4px;\n color: inherit;\n}\n.ff-card-container.passed .ff-number {\n color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.failed .ff-number {\n color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.warning .ff-number {\n color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.skipped .ff-number {\n color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.flaky .ff-number {\n color: var(--ff-card-flaky-status-bg-color);\n}";
33716
+ var css_248z$f = ".ff-card-container {\n height: 78px;\n display: flex;\n align-items: center;\n border: 1px solid var(--border-color);\n border-radius: 4px;\n overflow: hidden;\n cursor: pointer;\n}\n.ff-card-container:hover.passed {\n border-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container:hover.failed {\n border-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container:hover.warning {\n border-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container:hover.skipped {\n border-color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container:hover.flaky {\n border-color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container .ff-status-bar {\n width: 12%;\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: start;\n align-items: center;\n border-right: 1px solid var(--border-color);\n gap: 17px;\n}\n.ff-card-container .ff-status-bar .ff-status-text {\n transform: rotate(-90deg);\n transform-origin: center;\n display: inline-block;\n}\n.ff-card-container.passed .ff-status-bar {\n background-color: var(--ff-card-passed-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.failed .ff-status-bar {\n background-color: var(--ff-card-failed-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.warning .ff-status-bar {\n background-color: var(--ff-card-warning-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.skipped .ff-status-bar {\n background-color: var(--ff-card-skipped-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container.flaky .ff-status-bar {\n background-color: var(--ff-card-flaky-status-bg-color);\n color: var(--base-bg-color);\n}\n.ff-card-container .ff-content {\n flex: 1;\n padding: 8px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n}\n.ff-card-container .ff-content .ff-number {\n margin-bottom: 4px;\n color: inherit;\n}\n.ff-card-container.passed .ff-number {\n color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.failed .ff-number {\n color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.warning .ff-number {\n color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.skipped .ff-number {\n color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.flaky .ff-number {\n color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container.toggled.passed .ff-status-bar {\n background-color: var(--base-bg-color);\n color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.toggled.failed .ff-status-bar {\n background-color: var(--base-bg-color);\n color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.toggled.warning .ff-status-bar {\n background-color: var(--base-bg-color);\n color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.toggled.skipped .ff-status-bar {\n background-color: var(--base-bg-color);\n color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.toggled.flaky .ff-status-bar {\n background-color: var(--base-bg-color);\n color: var(--ff-card-flaky-status-bg-color);\n}\n.ff-card-container.toggled.passed .ff-content {\n background-color: var(--ff-card-passed-status-bg-color);\n}\n.ff-card-container.toggled.failed .ff-content {\n background-color: var(--ff-card-failed-status-bg-color);\n}\n.ff-card-container.toggled.warning .ff-content {\n background-color: var(--ff-card-warning-status-bg-color);\n}\n.ff-card-container.toggled.skipped .ff-content {\n background-color: var(--ff-card-skipped-status-bg-color);\n}\n.ff-card-container.toggled.flaky .ff-content {\n background-color: var(--ff-card-flaky-status-bg-color);\n}";
33631
33717
  styleInject(css_248z$f);
33632
33718
 
33633
33719
  const StatusCard = ({
33634
33720
  icon,
33635
33721
  status,
33636
33722
  count,
33637
- text
33723
+ text,
33724
+ style = {
33725
+ width: '196.4px'
33726
+ },
33727
+ onSelectedStatus = _status => {}
33638
33728
  }) => {
33729
+ const [isToggled, setIsToggled] = React.useState(false);
33730
+ const handleSelectStatus = status => {
33731
+ setIsToggled(true);
33732
+ onSelectedStatus(status);
33733
+ };
33639
33734
  return jsxRuntime.jsxs("div", {
33640
- className: `ff-card-container ${status.toLowerCase()}`,
33735
+ className: `ff-card-container ${status.toLowerCase()} ${isToggled ? 'toggled' : ''}`,
33736
+ style: style,
33737
+ onClick: () => handleSelectStatus(status),
33641
33738
  children: [jsxRuntime.jsxs("div", {
33642
33739
  className: "ff-status-bar",
33643
33740
  children: [jsxRuntime.jsx("div", {
@@ -33650,7 +33747,6 @@ const StatusCard = ({
33650
33747
  }), jsxRuntime.jsx(Typography, {
33651
33748
  fontWeight: "semi-bold",
33652
33749
  fontSize: "10px",
33653
- color: "var(--ff-status-card-text-color)",
33654
33750
  textAlign: "center",
33655
33751
  lineHeight: "15px",
33656
33752
  className: "ff-status-text",
@@ -33664,13 +33760,14 @@ const StatusCard = ({
33664
33760
  fontSize: "24px",
33665
33761
  className: "ff-number",
33666
33762
  lineHeight: "36px",
33763
+ color: isToggled ? 'var(--base-bg-color)' : '',
33667
33764
  children: count
33668
33765
  }), jsxRuntime.jsx(Typography, {
33669
33766
  fontWeight: "regular",
33670
33767
  fontSize: "10px",
33671
33768
  className: "ff-text",
33672
33769
  lineHeight: "15px",
33673
- color: "var(--ff-card-status-text-color)",
33770
+ color: isToggled ? 'var(--base-bg-color)' : 'var(--ff-card-status-text-color)',
33674
33771
  children: text
33675
33772
  })]
33676
33773
  })]
@@ -39731,7 +39828,8 @@ const BarChart = ({
39731
39828
  icons = [],
39732
39829
  iconSize,
39733
39830
  legendPosition = 'bottom',
39734
- legendGap = 5
39831
+ legendGap = 5,
39832
+ onSelectedBar = _label => {}
39735
39833
  }) => {
39736
39834
  const [tooltip, setTooltip] = React.useState({
39737
39835
  visible: false,
@@ -39789,6 +39887,9 @@ const BarChart = ({
39789
39887
  borderColor: 'transparent'
39790
39888
  });
39791
39889
  };
39890
+ const handleSelectLabel = label => {
39891
+ onSelectedBar(label);
39892
+ };
39792
39893
  return jsxRuntime.jsxs("div", {
39793
39894
  className: "ff-bar-chart-container",
39794
39895
  style: {
@@ -39863,7 +39964,8 @@ const BarChart = ({
39863
39964
  ry: barBorderRadius,
39864
39965
  onMouseEnter: e => handleMouseEnter(e, item.label, item.value, getBorderColor(index)),
39865
39966
  onMouseMove: handleMouseMove,
39866
- onMouseLeave: handleMouseLeave
39967
+ onMouseLeave: handleMouseLeave,
39968
+ onClick: () => handleSelectLabel(item.label)
39867
39969
  }), showXAxisLabels && jsxRuntime.jsx("text", {
39868
39970
  x: barX + barWidth / 2,
39869
39971
  y: height + topPadding + 15,
@@ -45717,7 +45819,7 @@ const getSequentialPayload = data => {
45717
45819
  }));
45718
45820
  };
45719
45821
 
45720
- var css_248z$4 = ".ff-grid-container {\n display: grid;\n grid-template-columns: 1fr 4fr 1fr 6fr;\n padding: 24px 0;\n grid-auto-rows: auto;\n}\n.ff-grid-container .ff-selectedMachines {\n display: contents;\n}\n.ff-grid-container .ff-selectedMachines-input {\n grid-column: 2/3;\n display: grid;\n}\n.ff-grid-container .ff-input-box-container {\n border: 1px solid var(--description-text);\n width: 100%;\n height: 32px;\n}\n.ff-grid-container .ff-machine-instance-row {\n display: contents;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line {\n grid-column: 3/4;\n position: relative;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line .ff-line {\n position: absolute;\n height: 1px;\n background-color: var(--brand-color);\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line .ff-left-icon {\n height: 8px;\n width: 8px;\n background-color: var(--brand-color);\n border-radius: 50%;\n margin-right: 5px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line .ff-selectedMachines-connecting-line-text {\n position: absolute;\n top: -10px;\n left: 50%;\n transform: translateX(-50%);\n background-color: var(--brand-color);\n color: var(--tooltip-text-color);\n padding: 4px;\n border-radius: 12px;\n text-align: center;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line .ff-right-icon {\n width: 0;\n height: 0;\n border-top: 4px solid transparent;\n border-bottom: 4px solid transparent;\n border-left: 8px solid var(--brand-color);\n margin-left: 84px;\n bottom: -4px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line.ff-second-line {\n position: relative;\n margin-left: 20px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line .ff-vertical-line {\n position: absolute;\n left: 22px;\n top: 0;\n width: 1px;\n height: auto;\n background-color: var(--brand-color);\n}\n.ff-grid-container .ff-machine-instance {\n grid-column: 4/5;\n}\n.ff-grid-container .ff-machine-instance .ff-add-browser-device {\n margin-bottom: 16px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line {\n margin-top: 20px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line.ff-no-instance-line {\n margin-top: 20px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line.ff-no-instance-line .ff-line {\n width: 100%;\n background-color: var(--brand-color);\n height: 1px;\n position: relative;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line.ff-no-instance-line .ff-selectedMachines-connecting-line-text {\n position: absolute;\n top: -10px;\n left: 50%;\n transform: translateX(-50%);\n background-color: var(--brand-color);\n color: var(--tooltip-text-color);\n font-weight: bold;\n font-size: 8px;\n padding: 4px;\n border-radius: 12px;\n text-align: center;\n}\n.ff-grid-container .ff-run-level-execution-dataset p {\n margin: 0;\n font-size: 12px;\n}\n.ff-grid-container .ff-run-level-execution-dataset {\n min-height: 70px;\n max-width: 600px;\n border: 1px solid var(--description-text);\n margin-bottom: 8px;\n border-radius: 4px;\n margin-bottom: 16px;\n position: relative;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector {\n position: absolute;\n left: -12%;\n transform: translateX(-50%);\n width: 40px;\n height: 0;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector .ff-curve {\n position: relative;\n width: 88px;\n height: 0;\n border: 1px dashed var(--brand-color);\n border-top: none;\n border-right: none;\n border-bottom-left-radius: 8px;\n display: flex;\n flex-direction: column-reverse;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector .ff-curve .ff-curve-right-icon {\n width: 0;\n height: 0;\n border-top: 4px solid transparent;\n border-bottom: 4px solid transparent;\n border-left: 8px solid var(--brand-color);\n margin-left: 84px;\n position: absolute;\n bottom: -4px;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector .ff-curve .ff-selectedMachines-connecting-line-text {\n position: absolute;\n left: 50%;\n top: 85px;\n transform: translateX(-50%);\n background-color: var(--brand-color);\n color: var(--tooltip-text-color);\n font-weight: 400;\n font-size: 8px;\n padding: 4px;\n border-radius: 12px;\n text-align: center;\n width: 44px;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector .ff-connector-0 {\n bottom: 8px;\n border: none;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector .ff-curve-right-icon-0 {\n display: none;\n}\n.ff-grid-container .ff-select-machine-input {\n grid-column: 2/3;\n}\n.ff-grid-container .ff-select-machine-input input {\n width: 430px;\n height: 32px;\n}\n.ff-grid-container .ff-grid-item.ff-dynamic-item {\n grid-column: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n place-self: first baseline;\n top: 1px;\n left: 20px;\n}\n.ff-grid-container .ff-script-count-container {\n grid-column: 1;\n align-self: center;\n background-color: var(--brand-color);\n color: var(--tooltip-text-color);\n text-align: center;\n border-radius: 4px;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 4px;\n}\n.ff-grid-container .ff-script-count-container .ff-script-count-box {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n}";
45822
+ var css_248z$4 = ".ff-grid-container {\n display: grid;\n grid-template-columns: 1fr 1.5fr 0.8fr 5fr;\n grid-auto-rows: auto;\n}\n.ff-grid-container .ff-selectedMachines {\n display: contents;\n}\n.ff-grid-container .ff-selectedMachines-input {\n grid-column: 2/3;\n display: grid;\n}\n.ff-grid-container .ff-input-box-container {\n margin-bottom: 24px;\n border-radius: 4px;\n width: 100%;\n}\n.ff-grid-container .ff-machine-instance-row {\n display: contents;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line {\n grid-column: 3/4;\n position: relative;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line .ff-line {\n position: absolute;\n height: 1px;\n background-color: var(--brand-color);\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line .ff-left-icon {\n height: 8px;\n width: 8px;\n background-color: var(--brand-color);\n border-radius: 50%;\n margin-right: 5px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line .ff-selectedMachines-connecting-line-text {\n position: absolute;\n top: -10px;\n left: 50%;\n transform: translateX(-50%);\n background-color: var(--brand-color);\n color: var(--tooltip-text-color);\n padding: 4px;\n border-radius: 12px;\n text-align: center;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line .ff-right-icon {\n width: 0;\n height: 0;\n border-top: 4px solid transparent;\n border-bottom: 4px solid transparent;\n border-left: 8px solid var(--brand-color);\n margin-left: 84px;\n bottom: -4px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line.ff-second-line {\n position: relative;\n margin-left: 20px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line .ff-vertical-line {\n position: absolute;\n left: 24px;\n top: 0;\n width: 1px;\n height: auto;\n background-color: var(--brand-color);\n}\n.ff-grid-container .ff-machine-instance {\n grid-column: 4/5;\n}\n.ff-grid-container .ff-machine-env-button {\n padding: 4px 0;\n margin-bottom: 16px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line {\n margin-top: 16px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line.ff-no-instance-line {\n margin-top: 16px;\n}\n.ff-grid-container .ff-selectedMachines-connecting-line.ff-no-instance-line .ff-line {\n width: 100%;\n background-color: var(--brand-color);\n height: 1px;\n position: relative;\n}\n.ff-grid-container .ff-run-level-execution-dataset {\n height: 66px;\n margin-bottom: 8px;\n border-radius: 4px;\n margin-bottom: 16px;\n position: relative;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector {\n position: absolute;\n left: -70px;\n transform: translateX(-50%);\n width: 40px;\n height: 0;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector .ff-curve {\n position: relative;\n width: 80px;\n height: 0;\n border: 1px dashed var(--brand-color);\n border-top: none;\n border-right: none;\n border-bottom-left-radius: 8px;\n display: flex;\n flex-direction: column-reverse;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector .ff-curve .ff-curve-right-icon {\n width: 0;\n height: 0;\n border-top: 4px solid transparent;\n border-bottom: 4px solid transparent;\n border-left: 8px solid var(--brand-color);\n margin-left: 81px;\n position: absolute;\n bottom: -4px;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector .ff-curve .ff-selectedMachines-connecting-line-text {\n position: absolute;\n left: 50%;\n top: 75px;\n transform: translateX(-50%);\n background-color: var(--brand-color);\n color: var(--tooltip-text-color);\n font-weight: 400;\n font-size: 8px;\n padding: 4px;\n border-radius: 12px;\n text-align: center;\n width: 44px;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector .ff-connector-0 {\n border: none;\n bottom: 3px;\n}\n.ff-grid-container .ff-run-level-execution-dataset .ff-curved-connector .ff-curve-right-icon-0 {\n display: none;\n}\n.ff-grid-container .ff-select-machine-input {\n grid-column: 2/3;\n}\n.ff-grid-container .ff-grid-item.ff-dynamic-item {\n grid-column: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n place-self: first baseline;\n top: 1px;\n left: 20px;\n}\n.ff-grid-container .ff-script-count-container {\n grid-column: 1;\n align-self: center;\n background-color: var(--brand-color);\n color: var(--tooltip-text-color);\n text-align: center;\n border-radius: 4px;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 4px;\n}\n.ff-grid-container .ff-script-count-container .ff-script-count-box {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n}\n\n.ff-parent-node-container {\n border: 1px solid green;\n height: 30px;\n border-radius: 10px;\n padding: 2px;\n}\n\n.ff-child-node-container {\n border: 1px solid red;\n height: 40px;\n width: 300px;\n border-radius: 10px;\n padding: 8px;\n}";
45721
45823
  styleInject(css_248z$4);
45722
45824
 
45723
45825
  var reactArcher$1 = {exports: {}};
@@ -47062,6 +47164,8 @@ function requireReactArcher() {
47062
47164
  var reactArcherExports = requireReactArcher();
47063
47165
 
47064
47166
  const MachineInstances = ({
47167
+ getChildNodeComponent,
47168
+ parentNode,
47065
47169
  data,
47066
47170
  verticalLineHeight,
47067
47171
  datasetHeight,
@@ -47082,15 +47186,11 @@ const MachineInstances = ({
47082
47186
  })]
47083
47187
  })
47084
47188
  }), jsxRuntime.jsx("div", {
47085
- className: "ff-machine-instance",
47086
- children: jsxRuntime.jsx(Button$1, {
47087
- className: "ff-add-browser-device",
47088
- variant: "secondary",
47089
- label: "Add Machine"
47090
- })
47189
+ className: "ff-machine-instance ff-machine-env-button",
47190
+ children: getChildNodeComponent(true, data, parentNode)
47091
47191
  })]
47092
- }) : data?.machineInstances?.map((instance, idx) => {
47093
- const isFirstLine = idx === 0;
47192
+ }) : data?.machineInstances?.map((instance, machineInstanceIndex) => {
47193
+ const isFirstLine = machineInstanceIndex === 0;
47094
47194
  return jsxRuntime.jsxs("div", {
47095
47195
  className: "ff-machine-instance-row",
47096
47196
  children: [jsxRuntime.jsxs("div", {
@@ -47110,24 +47210,24 @@ const MachineInstances = ({
47110
47210
  })]
47111
47211
  }), jsxRuntime.jsx("div", {
47112
47212
  className: "ff-machine-instance",
47113
- children: instance.runLevelExecutionDataSets.map((dataSet, index) => jsxRuntime.jsx("div", {
47213
+ children: instance.runLevelExecutionDataSets.map((dataSet, runLevelExecutionDataIndex) => jsxRuntime.jsx("div", {
47114
47214
  className: "ff-run-level-execution-dataset",
47115
- ref: index === 0 ? datasetRef : null,
47215
+ ref: runLevelExecutionDataIndex === 0 ? datasetRef : null,
47116
47216
  children: jsxRuntime.jsxs("div", {
47117
47217
  className: "ff-execution-item",
47118
- ref: el => itemRefs.current[index] = el,
47218
+ ref: element => itemRefs.current[runLevelExecutionDataIndex] = element,
47119
47219
  children: [jsxRuntime.jsx("div", {
47120
47220
  className: "ff-curved-connector",
47121
47221
  style: {
47122
- top: `${-datasetHeight + 5}px`
47222
+ top: `${-datasetHeight}px`
47123
47223
  },
47124
47224
  children: jsxRuntime.jsxs("div", {
47125
- className: `ff-curve ff-connector-${index}`,
47225
+ className: `ff-curve ff-connector-${runLevelExecutionDataIndex}`,
47126
47226
  style: {
47127
- height: `${curveHeights[index]}px`
47227
+ height: `${curveHeights[runLevelExecutionDataIndex]}px`
47128
47228
  },
47129
47229
  children: [jsxRuntime.jsx("div", {
47130
- className: `ff-curve-right-icon ff-curve-right-icon-${index}`
47230
+ className: `ff-curve-right-icon ff-curve-right-icon-${runLevelExecutionDataIndex}`
47131
47231
  }), dataSet?.runScriptCount && jsxRuntime.jsx("div", {
47132
47232
  className: "ff-selectedMachines-connecting-line-text",
47133
47233
  children: jsxRuntime.jsxs(Typography, {
@@ -47138,11 +47238,12 @@ const MachineInstances = ({
47138
47238
  })]
47139
47239
  })
47140
47240
  }), jsxRuntime.jsx("div", {
47141
- className: "ff-run-data-box"
47241
+ className: "ff-run-data-box",
47242
+ children: getChildNodeComponent(false, instance, machineInstanceIndex, dataSet, runLevelExecutionDataIndex, parentNode)
47142
47243
  })]
47143
- }, dataSet.peVariableSetId)
47144
- }, index))
47145
- }), idx === data.machineInstances.length - 1 && jsxRuntime.jsxs(jsxRuntime.Fragment, {
47244
+ }, dataSet.executionDataSetId)
47245
+ }, runLevelExecutionDataIndex))
47246
+ }), machineInstanceIndex === data.machineInstances.length - 1 && jsxRuntime.jsxs(jsxRuntime.Fragment, {
47146
47247
  children: [jsxRuntime.jsx("div", {
47147
47248
  className: "ff-selectedMachines-connecting-line ff-second-line",
47148
47249
  children: jsxRuntime.jsxs("div", {
@@ -47154,21 +47255,21 @@ const MachineInstances = ({
47154
47255
  })]
47155
47256
  })
47156
47257
  }), jsxRuntime.jsx("div", {
47157
- className: "ff-machine-instance",
47158
- children: jsxRuntime.jsx(Button$1, {
47159
- className: "ff-add-browser-device",
47160
- variant: "secondary",
47161
- label: "Browser/Devices"
47162
- })
47258
+ className: "ff-machine-instance ff-machine-env-button",
47259
+ children: getChildNodeComponent(true, data, parentNode, machineInstanceIndex + 1)
47163
47260
  })]
47164
47261
  })]
47165
- }, instance.clientId || idx);
47262
+ }, instance.clientId || machineInstanceIndex);
47166
47263
  })
47167
47264
  });
47168
47265
  };
47169
47266
 
47170
47267
  const ConnectingBranch = ({
47171
- machineData
47268
+ data: machineData,
47269
+ getChildNodeComponent,
47270
+ getParentNodeComponent,
47271
+ getParentNodeComponentActionItems,
47272
+ childNodeCurveHeight = 1.28
47172
47273
  }) => {
47173
47274
  const datasetRef = React.useRef(null);
47174
47275
  const [datasetHeight, setDatasetHeight] = React.useState(0);
@@ -47188,7 +47289,7 @@ const ConnectingBranch = ({
47188
47289
  const calculateCurveHeight = () => {
47189
47290
  const heights = itemRefs.current.map((_, index) => {
47190
47291
  if (index === 0) return 0;
47191
- return datasetHeight * 1.3;
47292
+ return datasetHeight * childNodeCurveHeight;
47192
47293
  });
47193
47294
  setCurveHeights(heights);
47194
47295
  };
@@ -47224,7 +47325,7 @@ const ConnectingBranch = ({
47224
47325
  const verticalLineHeight = calculateVerticalLineHeight(machine?.machineInstances, datasetHeight, gap);
47225
47326
  return jsxRuntime.jsxs(React.Fragment, {
47226
47327
  children: [(!isOddMachineCount && index === middleIndex || isOddMachineCount && index === 0) && jsxRuntime.jsx(reactArcherExports.ArcherElement, {
47227
- id: "rootMachine",
47328
+ id: "rootNode",
47228
47329
  children: jsxRuntime.jsx("div", {
47229
47330
  className: "ff-grid-item ff-dynamic-item",
47230
47331
  style: {
@@ -47253,24 +47354,27 @@ const ConnectingBranch = ({
47253
47354
  },
47254
47355
  children: [jsxRuntime.jsx("div", {
47255
47356
  className: "ff-selectedMachines-input",
47256
- children: jsxRuntime.jsx(reactArcherExports.ArcherElement, {
47257
- id: `machine${index}`,
47258
- relations: [{
47259
- targetId: 'rootMachine',
47260
- targetAnchor: 'left',
47261
- sourceAnchor: 'left'
47262
- }],
47263
- children: jsxRuntime.jsx("div", {
47264
- className: "ff-input-box-container"
47265
- })
47266
- }, index)
47357
+ children: jsxRuntime.jsxs("div", {
47358
+ className: "ff-input-box-container",
47359
+ children: [jsxRuntime.jsx(reactArcherExports.ArcherElement, {
47360
+ id: `parentnode${index}`,
47361
+ relations: [{
47362
+ targetId: 'rootNode',
47363
+ targetAnchor: 'left',
47364
+ sourceAnchor: 'left'
47365
+ }],
47366
+ children: getParentNodeComponent(false, machine, index)
47367
+ }, index), getParentNodeComponentActionItems(machine, index)]
47368
+ })
47267
47369
  }), jsxRuntime.jsx(MachineInstances, {
47370
+ parentNode: index,
47268
47371
  data: machine,
47269
47372
  verticalLineHeight: verticalLineHeight,
47270
47373
  datasetHeight: datasetHeight,
47271
47374
  curveHeights: curveHeights,
47272
47375
  itemRefs: itemRefs,
47273
- datasetRef: datasetRef
47376
+ datasetRef: datasetRef,
47377
+ getChildNodeComponent: getChildNodeComponent
47274
47378
  })]
47275
47379
  })]
47276
47380
  }, index);
@@ -47280,14 +47384,14 @@ const ConnectingBranch = ({
47280
47384
  gridRow: `${currentRow}`
47281
47385
  },
47282
47386
  children: jsxRuntime.jsx(reactArcherExports.ArcherElement, {
47283
- id: "footerInput",
47387
+ id: "lastNode",
47284
47388
  relations: [{
47285
- targetId: 'rootMachine',
47389
+ targetId: 'rootNode',
47286
47390
  targetAnchor: 'left',
47287
47391
  sourceAnchor: 'left'
47288
47392
  }],
47289
47393
  children: jsxRuntime.jsx("div", {
47290
- className: "ff-input-box-container"
47394
+ children: getParentNodeComponent(true)
47291
47395
  })
47292
47396
  })
47293
47397
  })]