carbon-react 158.34.1 → 158.35.1

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 (38) hide show
  1. package/esm/__internal__/label/label.component.js +1 -1
  2. package/esm/components/button/__next__/button.component.js +1 -1
  3. package/esm/components/date/date.component.js +1 -1
  4. package/esm/components/draggable/__internal__/drag-drop-provider.js +1 -1
  5. package/esm/components/heading/heading.component.js +1 -1
  6. package/esm/components/menu/__internal__/submenu/submenu.component.js +1 -1
  7. package/esm/components/message/message.component.js +1 -1
  8. package/esm/components/message/message.style.js +1 -1
  9. package/esm/components/popover-container/popover-container.component.js +1 -1
  10. package/esm/components/radio-button/radio-button.component.js +1 -1
  11. package/esm/components/select/filterable-select/filterable-select.component.js +1 -1
  12. package/esm/components/select/multi-select/multi-select.component.js +1 -1
  13. package/esm/components/split-button/split-button.component.js +1 -1
  14. package/esm/components/tabs/__next__/tabs.component.js +1 -1
  15. package/esm/components/text-editor/__internal__/__nodes__/mention.node.js +1 -1
  16. package/esm/components/text-editor/__internal__/__ui__/Toolbar/toolbar.component.js +1 -1
  17. package/esm/components/textarea/index.js +1 -1
  18. package/esm/components/tokens-wrapper/__internal__/static-tokens/index.d.ts +1 -1
  19. package/esm/components/tokens-wrapper/__internal__/static-tokens/index.js +1 -1
  20. package/esm/components/tooltip/tooltip.component.js +1 -1
  21. package/esm/components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu-item/responsive-vertical-menu-item.component.js +1 -1
  22. package/esm/components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu.context.js +1 -1
  23. package/esm/hooks/__internal__/useStableCallback/index.js +1 -1
  24. package/esm/hooks/use-multi-input/index.js +1 -1
  25. package/esm/index.js +1 -1
  26. package/lib/components/button/__next__/button.component.js +1 -1
  27. package/lib/components/menu/__internal__/submenu/submenu.component.js +1 -1
  28. package/lib/components/message/message.component.js +1 -1
  29. package/lib/components/message/message.style.js +1 -1
  30. package/lib/components/select/filterable-select/filterable-select.component.js +1 -1
  31. package/lib/components/select/multi-select/multi-select.component.js +1 -1
  32. package/lib/components/textarea/index.js +1 -1
  33. package/lib/components/tokens-wrapper/__internal__/static-tokens/index.d.ts +1 -1
  34. package/lib/components/tokens-wrapper/__internal__/static-tokens/index.js +1 -1
  35. package/lib/hooks/__internal__/useStableCallback/index.js +1 -1
  36. package/lib/hooks/use-multi-input/index.js +1 -1
  37. package/lib/index.js +1 -1
  38. package/package.json +3 -4
package/esm/components/tokens-wrapper/__internal__/static-tokens/index.js CHANGED
@@ -1 +1 @@
1
- var e="\n --global-borderwidth-none: 0;\n --global-borderwidth-xs: 1px;\n --global-borderwidth-s: 2px;\n --global-borderwidth-m: 3px;\n --global-borderwidth-l: 4px;\n --global-borderwidth-xl: 6px;\n --global-borderwidth-xxl: 8px;\n --global-breakpoint-xs: 320px;\n --global-breakpoint-s: 600px;\n --global-breakpoint-m: 960px;\n --global-breakpoint-l: 1260px;\n --global-breakpoint-xl: 1600px;\n --global-breakpoint-xxl: 1920px;\n --global-font-fluid-heading-s: 500 clamp(1.1646rem, 1.1207rem + 0.2195vw, 1.2964rem)/1.25 Sage UI;\n --global-font-fluid-heading-m: 700 clamp(1.2811rem, 1.2155rem + 0.3279vw, 1.4778rem)/1.25 Sage UI;\n --global-font-fluid-heading-l: 700 clamp(1.5869rem, 1.417rem + 0.8494vw, 2.4363rem)/1.25 Sage UI;\n --global-font-fluid-subheading-m: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;\n --global-font-fluid-subheading-l: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.25 Sage UI;\n --global-font-fluid-section-heading-s: 700 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;\n --global-font-fluid-section-heading-m: 700 clamp(1.1646rem, 1.1207rem + 0.2195vw, 1.2964rem)/1.25 Sage UI;\n --global-font-fluid-body-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-body-regular-m: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-body-regular-l: 400 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;\n --global-font-fluid-body-medium-s: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-body-medium-m: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-body-medium-l: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;\n --global-font-fluid-comp-medium-xs: 500 clamp(0.7675rem, 0.8048rem + -0.0465vw, 0.7955rem)/1.5 Sage UI;\n --global-font-fluid-comp-medium-s: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-medium-m: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-medium-l: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-comp-regular-xs: 400 clamp(0.7675rem, 0.8048rem + -0.0465vw, 0.7955rem)/1.5 Sage UI;\n --global-font-fluid-comp-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-regular-m: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-regular-l: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-comp-icon-s: 20px sage-icons;\n --global-font-fluid-comp-icon-m: 20px sage-icons;\n --global-font-fluid-comp-icon-l: 20px sage-icons;\n --global-font-fluid-comp-lined-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-lined-regular-m: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-lined-regular-l: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-comp-lined-medium-s: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-lined-medium-m: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-lined-medium-l: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-xs: 500 clamp(0.6733rem, 0.7398rem + -0.0831vw, 0.7231rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-s: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-m: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-ml: 500 clamp(1.2811rem, 1.2155rem + 0.3279vw, 1.4778rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-l: 500 clamp(1.5869rem, 1.417rem + 0.8494vw, 2.4363rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-xl: 500 clamp(1.8756rem, 1.6688rem + 1.034vw, 2.496rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-xxl: 500 clamp(2.2695rem, 1.9448rem + 1.6238vw, 3.2438rem)/1.5 Sage UI;\n --global-font-static-heading-s: 500 21px/1.25 Sage UI;\n --global-font-static-heading-m: 700 24px/1.25 Sage UI;\n --global-font-static-heading-l: 700 30px/1.25 Sage UI;\n --global-font-static-subheading-m: 500 16px/1.25 Sage UI;\n --global-font-static-subheading-l: 500 18px/1.25 Sage UI;\n --global-font-static-section-heading-s: 700 16px/1.25 Sage UI;\n --global-font-static-section-heading-m: 700 21px/1.25 Sage UI;\n --global-font-static-body-regular-s: 400 14px/1.5 Sage UI;\n --global-font-static-body-regular-m: 400 14px/1.5 Sage UI;\n --global-font-static-body-regular-l: 400 16px/1.5 Sage UI;\n --global-font-static-body-medium-s: 500 14px/1.5 Sage UI;\n --global-font-static-body-medium-m: 500 14px/1.5 Sage UI;\n --global-font-static-body-medium-l: 500 16px/1.5 Sage UI;\n --global-font-static-comp-medium-xs: 500 13px/1.5 Sage UI;\n --global-font-static-comp-medium-s: 500 14px/1.5 Sage UI;\n --global-font-static-comp-medium-m: 500 14px/1.5 Sage UI;\n --global-font-static-comp-medium-l: 500 16px/1.5 Sage UI;\n --global-font-static-comp-regular-xs: 400 13px/1.5 Sage UI;\n --global-font-static-comp-regular-s: 400 14px/1.5 Sage UI;\n --global-font-static-comp-regular-m: 400 14px/1.5 Sage UI;\n --global-font-static-comp-regular-l: 400 16px/1.5 Sage UI;\n --global-font-static-comp-icon-s: 20px sage-icons;\n --global-font-static-comp-icon-m: 20px sage-icons;\n --global-font-static-comp-icon-l: 20px sage-icons;\n --global-font-static-comp-lined-regular-s: 400 14px/1.5 Sage UI;\n --global-font-static-comp-lined-regular-m: 400 14px/1.5 Sage UI;\n --global-font-static-comp-lined-regular-l: 400 16px/1.5 Sage UI;\n --global-font-static-comp-lined-medium-s: 500 14px/1.5 Sage UI;\n --global-font-static-comp-lined-medium-m: 500 14px/1.5 Sage UI;\n --global-font-static-comp-lined-medium-l: 500 16px/1.5 Sage UI;\n --global-font-static-comp-placeholder-xs: 500 12px/1.5 Sage UI;\n --global-font-static-comp-placeholder-s: 500 14px/1.5 Sage UI;\n --global-font-static-comp-placeholder-m: 500 18px/1.5 Sage UI;\n --global-font-static-comp-placeholder-ml: 500 24px/1.5 Sage UI;\n --global-font-static-comp-placeholder-l: 500 30px/1.5 Sage UI;\n --global-font-static-comp-placeholder-xl: 500 40px/1.5 Sage UI;\n --global-font-static-comp-placeholder-xxl: 500 52px/1.5 Sage UI;\n --global-modifier-button-active: 0.30;\n --global-modifier-button-active-alt: 0.15;\n --global-modifier-button-hover: 0.15;\n --global-modifier-button-hover-alt: 0.10;\n --global-modifier-input-disabled-fg: 0.3;\n --global-modifier-input-disabled-bg: 0.05;\n --global-radius-none: 0;\n --global-radius-container-3-xs: 1px;\n --global-radius-container-2-xs: 2px;\n --global-radius-container-xs: 4px;\n --global-radius-container-s: 6px;\n --global-radius-container-m: 8px;\n --global-radius-container-l: 16px;\n --global-radius-container-xl: 24px;\n --global-radius-container-2-xl: 32px;\n --global-radius-container-3-xl: 40px;\n --global-radius-container-4-xl: 80px;\n --global-radius-container-circle: 999px;\n --global-radius-action-2-xs: 1px;\n --global-radius-action-xs: 2px;\n --global-radius-action-s: 4px;\n --global-radius-action-m: 8px;\n --global-radius-action-l: 16px;\n --global-radius-action-xl: 20px;\n --global-radius-action-2-xl: 24px;\n --global-radius-action-circle: 999px;\n --global-depth-none: 0 0 0 0 rgba(0,0,0,0);\n --global-depth-lvl1: 0 1px 2px 0 #0000001A, 2px 2px 10px 0 #00000033;\n --global-depth-lvl2: 0 2px 3px 0 #0000001A, 6px 6px 30px 0 #00000026;\n --global-depth-lvl3: 0 3px 4px 0 #0000001A, 10px 10px 60px 0 #0000001A;\n --global-depth-sticky-b: 0 -1px 2px 0 #0000001A, 2px -2px 10px 0 #00000033;\n --global-depth-sticky-l: -2px 0 2px 0 #0000001A, -5px 0 5px 0 #0000001A;\n --global-depth-sticky-r: 2px 0 2px 0 #0000001A, 5px 0 5px 0 #0000001A;\n --global-size-none: 0px;\n --global-size-6-xs: 2px;\n --global-size-5-xs: 4px;\n --global-size-4-xs: 8px;\n --global-size-3-xs: 16px;\n --global-size-2-xs: 20px;\n --global-size-xs: 24px;\n --global-size-s: 32px;\n --global-size-m: 40px;\n --global-size-l: 48px;\n --global-size-xl: 56px;\n --global-size-2-xl: 64px;\n --global-size-3-xl: 72px;\n --global-size-4-xl: 80px;\n --global-space-none: 0px;\n --global-space-layout-3-xs: 8px;\n --global-space-layout-2-xs: 16px;\n --global-space-layout-xs: 24px;\n --global-space-layout-s: 32px;\n --global-space-layout-m: 40px;\n --global-space-layout-l: 48px;\n --global-space-layout-xl: 56px;\n --global-space-layout-2-xl: 64px;\n --global-space-layout-3-xl: 72px;\n --global-space-layout-4-xl: 80px;\n --global-space-comp-2-xs: 2px;\n --global-space-comp-xs: 4px;\n --global-space-comp-s: 8px;\n --global-space-comp-m: 12px;\n --global-space-comp-l: 16px;\n --global-space-comp-xl: 24px;\n --global-space-comp-2-xl: 32px;\n --mode-color-none: #fff0;\n --mode-color-ai-stop-1: #13a038;\n --mode-color-ai-stop-2: #149197;\n --mode-color-ai-stop-3: #a87cfb;\n --mode-color-ai-alt-stop-1: #00d639;\n --mode-color-ai-alt-stop-2: #00d6de;\n --mode-color-ai-alt-stop-3: #9d60ff;\n --mode-color-brand-default: #000000;\n --mode-color-brand-default-alt: #000000;\n --mode-color-brand-with-default-alt: #FFFFFF;\n --mode-color-brand-inverse-default: #00d639;\n --mode-color-brand-inverse-default-alt: #FFFFFF;\n --mode-color-brand-inverse-with-default-alt: #000000;\n --mode-color-brand-copilot-default: #000000;\n --mode-color-brand-copilot-monochrome: #000000;\n --mode-color-brand-copilot-with-default: #00d639;\n --mode-color-brand-copilot-inverse-default: #FFFFFF;\n --mode-color-brand-copilot-inverse-monochrome: #FFFFFF;\n --mode-color-brand-copilot-inverse-with-default: #00d639;\n --mode-color-colorcode-blue-deep: #0071c3;\n --mode-color-colorcode-blue-muted: #e4eeff;\n --mode-color-colorcode-teal-deep: #007C7B;\n --mode-color-colorcode-teal-muted: #C8F5F5;\n --mode-color-colorcode-green-deep: #00811F;\n --mode-color-colorcode-green-muted: #D1F6D6;\n --mode-color-colorcode-lime-deep: #627600;\n --mode-color-colorcode-lime-muted: #e8f1d4;\n --mode-color-colorcode-orange-deep: #d64309;\n --mode-color-colorcode-orange-muted: #ffeaca;\n --mode-color-colorcode-red-deep: #db004e;\n --mode-color-colorcode-red-muted: #ffe8ea;\n --mode-color-colorcode-pink-deep: #c72699;\n --mode-color-colorcode-pink-muted: #fee8f5;\n --mode-color-colorcode-purple-deep: #8f4bd7;\n --mode-color-colorcode-purple-muted: #F3EBFE;\n --mode-color-colorcode-slate-deep: #527386;\n --mode-color-colorcode-slate-muted: #e4eff5;\n --mode-color-colorcode-gray-severe: #304658;\n --mode-color-colorcode-gray-deep: #6a7986;\n --mode-color-colorcode-gray-muted: #e8eaec;\n --mode-color-generic-bg-nought: #FFFFFF;\n --mode-color-generic-bg-faint: #f4f5f6;\n --mode-color-generic-bg-delicate: #e8eaec;\n --mode-color-generic-bg-soft: #dde0e3;\n --mode-color-generic-bg-moderate: #d1d6da;\n --mode-color-generic-bg-firm: #c6ccd1;\n --mode-color-generic-bg-harsh: #bac1c7;\n --mode-color-generic-bg-severe: #afb7be;\n --mode-color-generic-bg-extreme: #000000;\n --mode-color-generic-bg-inverse-nought: #000000;\n --mode-color-generic-bg-inverse-faint: #ffffff0d;\n --mode-color-generic-bg-inverse-delicate: #ffffff1a;\n --mode-color-generic-bg-inverse-soft: #ffffff26;\n --mode-color-generic-bg-inverse-moderate: #fff3;\n --mode-color-generic-bg-inverse-firm: #ffffff40;\n --mode-color-generic-bg-inverse-harsh: #ffffff4d;\n --mode-color-generic-bg-inverse-severe: #ffffff59;\n --mode-color-generic-bg-inverse-extreme: #FFFFFF;\n --mode-color-generic-txt-extreme: #000000;\n --mode-color-generic-txt-severe: #000000f2;\n --mode-color-generic-txt-moderate: #000000a6;\n --mode-color-generic-txt-soft: #0000008c;\n --mode-color-generic-txt-delicate: #0000006b;\n --mode-color-generic-txt-faint: #0000004d;\n --mode-color-generic-txt-nought: #FFFFFF;\n --mode-color-generic-txt-inverse-extreme: #FFFFFF;\n --mode-color-generic-txt-inverse-severe: #fffffff2;\n --mode-color-generic-txt-inverse-moderate: #ffffffab;\n --mode-color-generic-txt-inverse-soft: #ffffff8c;\n --mode-color-generic-txt-inverse-delicate: #ffffff6b;\n --mode-color-generic-txt-inverse-faint: #ffffff4d;\n --mode-color-generic-txt-inverse-nought: #000000;\n --mode-color-generic-fg-nought: #FFFFFF;\n --mode-color-generic-fg-delicate: #e8eaec;\n --mode-color-generic-fg-soft: #a3adb5;\n --mode-color-generic-fg-moderate: #8c98a2;\n --mode-color-generic-fg-firm: #75838f;\n --mode-color-generic-fg-extreme: #000000;\n --mode-color-generic-fg-inverse-nought: #000000;\n --mode-color-generic-fg-inverse-delicate: #181818;\n --mode-color-generic-fg-inverse-soft: #505050;\n --mode-color-generic-fg-inverse-moderate: #616161;\n --mode-color-generic-fg-inverse-firm: #6f6f6f;\n --mode-color-generic-fg-inverse-extreme: #FFFFFF;\n --mode-color-generic-surface-nought: #FFFFFF;\n --mode-color-generic-surface-faint: #f4f5f6;\n --mode-color-generic-surface-harsh: #475a6a;\n --mode-color-generic-surface-severe: #304658;\n --mode-color-action-ai-grad-active: linear-gradient(90deg, #13a03826 0%, #14919726 40%, #a87cfb26 90%);\n --mode-color-action-ai-grad-hover: linear-gradient(90deg, #13a03814 0%, #14919714 40%, #a87cfb14 90%);\n --mode-color-action-ai-grad-default: linear-gradient(90deg, #13a038 0%, #149197 40%, #a87cfb 90%);\n --mode-color-action-ai-active-stop-1: #13a03826;\n --mode-color-action-ai-active-stop-2: #14919726;\n --mode-color-action-ai-active-stop-3: #a87cfb26;\n --mode-color-action-ai-hover-stop-1: #13a03814;\n --mode-color-action-ai-hover-stop-2: #14919714;\n --mode-color-action-ai-hover-stop-3: #a87cfb14;\n --mode-color-action-danger-active: #a30037;\n --mode-color-action-danger-default: #db004e;\n --mode-color-action-danger-default-alt: #c40044;\n --mode-color-action-danger-hover: #c40044;\n --mode-color-action-danger-hover-alt: #db004e26;\n --mode-color-action-danger-hover-alt2: #a30037;\n --mode-color-action-danger-with-active: #FFFFFF;\n --mode-color-action-danger-with-default: #FFFFFF;\n --mode-color-action-danger-inverse-active: #ff728d;\n --mode-color-action-danger-inverse-default: #f50059;\n --mode-color-action-danger-inverse-default-alt: #ff3e6a;\n --mode-color-action-danger-inverse-hover: #ff3e6a;\n --mode-color-action-danger-inverse-hover-alt: #f5005926;\n --mode-color-action-danger-inverse-hover-alt2: #ff728d;\n --mode-color-action-danger-inverse-with-active: #000000;\n --mode-color-action-danger-inverse-with-default: #000000;\n --mode-color-action-data-entry-default: #FFFFFF;\n --mode-color-action-data-entry-with-active: #000000;\n --mode-color-action-data-entry-with-active-alt: #FFFFFF;\n --mode-color-action-data-entry-with-hover: #000000;\n --mode-color-action-data-entry-hover-alt: #f4f5f6;\n --mode-color-action-data-entry-with-default: #75838f;\n --mode-color-action-data-entry-default-alt: #e8eaec;\n --mode-color-action-data-entry-txt: #000000f2;\n --mode-color-action-data-entry-txt-alt: #0000008c;\n --mode-color-action-data-entry-inverse-default: #000000;\n --mode-color-action-data-entry-inverse-with-default: #a3adb5;\n --mode-color-action-data-entry-inverse-txt: #fffffff2;\n --mode-color-action-data-entry-inverse-txt-alt: #ffffff8c;\n --mode-color-action-focus-default: #000000;\n --mode-color-action-focus-txt: #000000;\n --mode-color-action-focus-with-default: #FFB500;\n --mode-color-action-focus-with-default-alt: #ffd274;\n --mode-color-action-focus-inverse-default: #FFB500;\n --mode-color-action-focus-inverse-txt: #FFFFFF;\n --mode-color-action-focus-inverse-with-default: #000000;\n --mode-color-action-focus-inverse-with-default-alt: #885e00;\n --mode-color-action-inactive-default: #0000004d;\n --mode-color-action-inactive-mask: #0006;\n --mode-color-action-inactive-default-alt: #eeeeee;\n --mode-color-action-inactive-txt: #0000006b;\n --mode-color-action-inactive-txt-alt: #FFFFFF;\n --mode-color-action-inactive-icon: #0000006b;\n --mode-color-action-inactive-icon-alt: #0000008c;\n --mode-color-action-inactive-inverse-default: #ffffff4d;\n --mode-color-action-inactive-inverse-txt: #ffffff6b;\n --mode-color-action-inactive-inverse-txt-alt: #000000;\n --mode-color-action-grayscale-active: #000000;\n --mode-color-action-grayscale-active-alt: #00000026;\n --mode-color-action-grayscale-default: #000000e6;\n --mode-color-action-grayscale-default-alt: #000000ab;\n --mode-color-action-grayscale-hover-alt: #0000001a;\n --mode-color-action-grayscale-hover: #00000026;\n --mode-color-action-grayscale-with-active: #FFFFFF;\n --mode-color-action-grayscale-with-active-alt: #000000;\n --mode-color-action-grayscale-with-default: #FFFFFF;\n --mode-color-action-grayscale-with-hover: #000000;\n --mode-color-action-grayscale-inverse-active: #FFFFFF;\n --mode-color-action-grayscale-inverse-active-alt: #ffffff26;\n --mode-color-action-grayscale-inverse-default: #ffffffe6;\n --mode-color-action-grayscale-inverse-default-alt: #ffffffab;\n --mode-color-action-grayscale-inverse-hover-alt: #ffffff1a;\n --mode-color-action-grayscale-inverse-hover: #ffffff26;\n --mode-color-action-grayscale-inverse-with-active: #000000;\n --mode-color-action-grayscale-inverse-with-active-alt: #FFFFFF;\n --mode-color-action-grayscale-inverse-with-default: #000000;\n --mode-color-action-grayscale-inverse-with-hover: #FFFFFF;\n --mode-color-action-nav-active: #253b4e26;\n --mode-color-action-nav-default: #FFFFFF;\n --mode-color-action-nav-default-alt: #f4f5f6;\n --mode-color-action-nav-hover: #253b4e1a;\n --mode-color-action-nav-with-active: #000000;\n --mode-color-action-nav-with-default: #000000f2;\n --mode-color-action-nav-with-hover: #000000;\n --mode-color-action-nav-inverse-active: #ffffff26;\n --mode-color-action-nav-inverse-default: #000000;\n --mode-color-action-nav-inverse-default-alt: #0b0b0b;\n --mode-color-action-nav-inverse-hover: #ffffff1a;\n --mode-color-action-nav-inverse-with-active: #FFFFFF;\n --mode-color-action-nav-inverse-with-default: #fffffff2;\n --mode-color-action-nav-inverse-with-hover: #FFFFFF;\n --mode-color-action-main-active: #005e14;\n --mode-color-action-main-active-alt: #00811f4d;\n --mode-color-action-main-default: #00811f;\n --mode-color-action-main-default-alt: #00811fcc;\n --mode-color-action-main-default-alt2: #007219;\n --mode-color-action-main-default-alt3: #00811f08;\n --mode-color-action-main-hover: #007219;\n --mode-color-action-main-hover-alt: #00811f26;\n --mode-color-action-main-hover-alt2: #005e14;\n --mode-color-action-main-with-active: #FFFFFF;\n --mode-color-action-main-with-default: #FFFFFF;\n --mode-color-action-main-with-hover: #FFFFFF;\n --mode-color-action-main-inverse-active: #8fff98;\n --mode-color-action-main-inverse-active-alt: #00f1424d;\n --mode-color-action-main-inverse-default: #00f142;\n --mode-color-action-main-inverse-default-alt: #00f142cc;\n --mode-color-action-main-inverse-default-alt2: #46fb5e;\n --mode-color-action-main-inverse-default-alt3: #00f14208;\n --mode-color-action-main-inverse-hover: #46fb5e;\n --mode-color-action-main-inverse-hover-alt: #00f14226;\n --mode-color-action-main-inverse-hover-alt2: #8fff98;\n --mode-color-action-main-inverse-with-active: #000000;\n --mode-color-action-main-inverse-with-default: #000000;\n --mode-color-action-main-inverse-with-hover: #000000;\n --mode-color-status-ai-default: #FFFFFF;\n --mode-color-status-ai-default-alt: #000000;\n --mode-color-status-ai-default-horizontal: linear-gradient(90deg, #13a038 0%, #149197 40%, #a87cfb 90%);\n --mode-color-status-ai-default-vertical: linear-gradient(180deg, #13a038 0%, #149197 40%, #a87cfb 90%);\n --mode-color-status-ai-inverse-default-horizontal: linear-gradient(90deg, #00d639 0%, #00d6de 40%, #9d60ff 90%);\n --mode-color-status-ai-inverse-default-vertical: linear-gradient(180deg, #00d639 0%, #00d6de 40%, #9d60ff 90%);\n --mode-color-status-callout-default-alt: #e0ffe2;\n --mode-color-status-callout-hover-alt: #b7ffbd;\n --mode-color-status-skeleton-stop-1: #75838f;\n --mode-color-status-skeleton-stop-2: #d1d6da;\n --mode-color-status-warning-default: #d64309;\n --mode-color-status-warning-default-alt: #fff7eb;\n --mode-color-status-warning-hover: #b33400;\n --mode-color-status-warning-hover-alt: #ffeaca;\n --mode-color-status-warning-txt: #b33400;\n --mode-color-status-warning-inverse-default: #e24300;\n --mode-color-status-warning-inverse-default-alt: #1d0300;\n --mode-color-status-warning-inverse-hover: #e5631c;\n --mode-color-status-warning-inverse-hover-alt: #360900;\n --mode-color-status-warning-inverse-txt: #e5631c;\n --mode-color-status-txt-with-default: #FFFFFF;\n --mode-color-status-txt-with-default-alt: #000000f2;\n --mode-color-status-txt-with-hover: #FFFFFF;\n --mode-color-status-txt-with-hover-alt: #000000;\n --mode-color-status-txt-loading: #747474;\n --mode-color-status-txt-inverse-with-default: #000000;\n --mode-color-status-txt-inverse-with-default-alt: #fffffff2;\n --mode-color-status-txt-inverse-with-hover: #000000;\n --mode-color-status-txt-inverse-with-hover-alt: #FFFFFF;\n --mode-color-status-custom-blue-default: #0071c3;\n --mode-color-status-custom-blue-default-alt: #f5f8ff;\n --mode-color-status-custom-blue-hover: #0063ad;\n --mode-color-status-custom-blue-hover-alt: #e4eeff;\n --mode-color-status-custom-teal-default: #007C7B;\n --mode-color-status-custom-teal-default-alt: #E8FCFC;\n --mode-color-status-custom-teal-hover: #006D6C;\n --mode-color-status-custom-teal-hover-alt: #C8F5F5;\n --mode-color-status-custom-green-default: #00811F;\n --mode-color-status-custom-green-default-alt: #EEFCEF;\n --mode-color-status-custom-green-hover: #007219;\n --mode-color-status-custom-green-hover-alt: #D1F6D6;\n --mode-color-status-custom-lime-default: #627600;\n --mode-color-status-custom-lime-default-alt: #f6f9f0;\n --mode-color-status-custom-lime-hover: #576900;\n --mode-color-status-custom-lime-hover-alt: #e8f1d4;\n --mode-color-status-custom-orange-default: #d64309;\n --mode-color-status-custom-orange-default-alt: #fff7eb;\n --mode-color-status-custom-orange-hover: #b33400;\n --mode-color-status-custom-orange-hover-alt: #ffeaca;\n --mode-color-status-custom-orange-txt: #b33400;\n --mode-color-status-custom-red-default: #db004e;\n --mode-color-status-custom-red-default-alt: #fff5f6;\n --mode-color-status-custom-red-hover: #c40044;\n --mode-color-status-custom-red-hover-alt: #ffe8ea;\n --mode-color-status-custom-pink-default: #c72699;\n --mode-color-status-custom-pink-default-alt: #fff5fa;\n --mode-color-status-custom-pink-hover: #b02086;\n --mode-color-status-custom-pink-hover-alt: #fee8f5;\n --mode-color-status-custom-purple-default: #8f4bd7;\n --mode-color-status-custom-purple-default-alt: #f9f6ff;\n --mode-color-status-custom-purple-hover: #803ec5;\n --mode-color-status-custom-purple-hover-alt: #F3EBFE;\n --mode-color-status-custom-gray-default: #6f6f6f;\n --mode-color-status-custom-gray-default-alt: #f8f8f8;\n --mode-color-status-custom-gray-hover: #616161;\n --mode-color-status-custom-gray-hover-alt: #eeeeee;\n --mode-color-status-custom-slate-default: #536574;\n --mode-color-status-custom-slate-default-alt: #f4f5f6;\n --mode-color-status-custom-slate-hover: #475a6a;\n --mode-color-status-custom-slate-hover-alt: #e8eaec;\n --mode-color-status-priority-default: #8f4bd7;\n --mode-color-status-priority-default-alt: #f9f6ff;\n --mode-color-status-priority-hover: #803ec5;\n --mode-color-status-priority-hover-alt: #F3EBFE;\n --mode-color-status-priority-inverse-default: #9463d7;\n --mode-color-status-priority-inverse-default-alt: #10041f;\n --mode-color-status-priority-inverse-hover: #a375dd;\n --mode-color-status-priority-inverse-hover-alt: #220c3a;\n --mode-color-status-inactive-default: #75838f;\n --mode-color-status-inactive-with-default: #0000008c;\n --mode-color-status-inactive-inverse-default: #6f6f6f;\n --mode-color-status-inactive-inverse-with-default: #ffffff8c;\n --mode-color-status-info-default: #0071c3;\n --mode-color-status-info-default-alt: #f5f8ff;\n --mode-color-status-info-hover: #0063ad;\n --mode-color-status-info-hover-alt: #e4eeff;\n --mode-color-status-info-inverse-default: #007fd9;\n --mode-color-status-info-inverse-default-alt: #000b1c;\n --mode-color-status-info-inverse-hover: #008ef4;\n --mode-color-status-info-inverse-hover-alt: #001932;\n --mode-color-status-negative-default: #db004e;\n --mode-color-status-negative-default-alt: #fff5f6;\n --mode-color-status-negative-hover: #c40044;\n --mode-color-status-negative-hover-alt: #ffe8ea;\n --mode-color-status-negative-inverse-default: #f50059;\n --mode-color-status-negative-inverse-default-alt: #1e0005;\n --mode-color-status-negative-inverse-hover: #ff3e6a;\n --mode-color-status-negative-inverse-hover-alt: #3c000f;\n --mode-color-status-neutral-default: #6f6f6f;\n --mode-color-status-neutral-default-alt: #f8f8f8;\n --mode-color-status-neutral-hover: #616161;\n --mode-color-status-neutral-hover-alt: #eeeeee;\n --mode-color-status-neutral-inverse-default: #7c7c7c;\n --mode-color-status-neutral-inverse-default-alt: #0b0b0b;\n --mode-color-status-neutral-inverse-hover: #8b8b8b;\n --mode-color-status-neutral-inverse-hover-alt: #181818;\n --mode-color-status-positive-default: #00811F;\n --mode-color-status-positive-default-alt: #EEFCEF;\n --mode-color-status-positive-hover: #007219;\n --mode-color-status-positive-hover-alt: #D1F6D6;\n --mode-color-status-positive-inverse-default: #019127;\n --mode-color-status-positive-inverse-default-alt: #001001;\n --mode-color-status-positive-inverse-hover: #007219;\n --mode-color-status-positive-inverse-hover-alt: #001f03;\n --badge-none: var(--mode-color-none);\n --badge-bg-default: var(--mode-color-status-negative-default);\n --badge-border-default: var(--mode-color-generic-bg-nought);\n --badge-bg-alt: var(--mode-color-status-info-default);\n --badge-label-default: var(--mode-color-generic-txt-inverse-extreme);\n --badge-label-alt: var(--mode-color-generic-txt-inverse-extreme);\n --badge-inverse-bg-default: var(--mode-color-status-negative-inverse-default);\n --badge-inverse-border-default: var(--mode-color-generic-bg-inverse-nought);\n --badge-inverse-bg-alt: var(--mode-color-status-info-inverse-default);\n --badge-inverse-label-default: var(--mode-color-generic-txt-extreme);\n --badge-inverse-label-alt: var(--mode-color-generic-txt-extreme);\n --button-none: var(--mode-color-none);\n --button-ai-bg-active: var(--mode-color-action-ai-grad-active);\n --button-ai-bg-hover: var(--mode-color-action-ai-grad-hover);\n --button-ai-border-active: linear-gradient(90deg, var(--mode-color-ai-stop-1) 0%, var(--mode-color-ai-stop-2) 40%, var(--mode-color-ai-stop-3) 90%);\n --button-ai-border-disabled: var(--mode-color-action-inactive-default);\n --button-ai-border-default: linear-gradient(90deg, var(--mode-color-ai-stop-1) 0%, var(--mode-color-ai-stop-2) 40%, var(--mode-color-ai-stop-3) 90%);\n --button-ai-border-hover: linear-gradient(90deg, var(--mode-color-ai-stop-1) 0%, var(--mode-color-ai-stop-2) 40%, var(--mode-color-ai-stop-3) 90%);\n --button-ai-label-active: var(--mode-color-action-grayscale-with-active-alt);\n --button-ai-label-disabled: var(--mode-color-action-inactive-txt);\n --button-ai-label-default: var(--mode-color-action-grayscale-default);\n --button-ai-label-hover: var(--mode-color-action-grayscale-with-hover);\n --button-destructive-primary-bg-disabled: var(--mode-color-action-inactive-default);\n --button-destructive-primary-bg-default: var(--mode-color-action-danger-default);\n --button-destructive-primary-bg-hover: var(--mode-color-action-danger-hover);\n --button-destructive-primary-label-disabled: var(--mode-color-action-inactive-txt-alt);\n --button-destructive-primary-label-default: var(--mode-color-action-danger-with-default);\n --button-destructive-primary-label-hover: var(--mode-color-action-danger-with-default);\n --button-destructive-secondary-bg-hover: var(--mode-color-action-danger-hover-alt);\n --button-destructive-secondary-border-disabled: var(--mode-color-action-inactive-default);\n --button-destructive-secondary-border-default: var(--mode-color-action-danger-default);\n --button-destructive-secondary-border-hover: var(--mode-color-action-danger-hover);\n --button-destructive-secondary-label-disabled: var(--mode-color-action-inactive-txt);\n --button-destructive-secondary-label-default: var(--mode-color-action-danger-default);\n --button-destructive-secondary-label-hover: var(--mode-color-action-danger-hover);\n --button-typical-primary-bg-active: var(--mode-color-action-main-active);\n --button-typical-primary-border-default: var(--mode-color-action-main-with-default);\n --button-typical-primary-bg-disabled: var(--mode-color-action-inactive-default);\n --button-typical-primary-bg-default: var(--mode-color-action-main-default);\n --button-typical-primary-bg-hover: var(--mode-color-action-main-hover);\n --button-typical-primary-label-active: var(--mode-color-action-main-with-active);\n --button-typical-primary-label-disabled: var(--mode-color-action-inactive-txt-alt);\n --button-typical-primary-label-default: var(--mode-color-action-main-with-default);\n --button-typical-primary-label-hover: var(--mode-color-action-main-with-default);\n --button-typical-primary-inverse-bg-active: var(--mode-color-action-main-inverse-active);\n --button-typical-primary-inverse-border-default: var(--mode-color-action-main-inverse-with-default);\n --button-typical-primary-inverse-bg-disabled: var(--mode-color-action-inactive-inverse-default);\n --button-typical-primary-inverse-bg-default: var(--mode-color-action-main-inverse-default);\n --button-typical-primary-inverse-bg-hover: var(--mode-color-action-main-inverse-hover);\n --button-typical-primary-inverse-label-active: var(--mode-color-action-main-inverse-with-active);\n --button-typical-primary-inverse-label-disabled: var(--mode-color-action-inactive-inverse-txt-alt);\n --button-typical-primary-inverse-label-default: var(--mode-color-action-main-inverse-with-default);\n --button-typical-primary-inverse-label-hover: var(--mode-color-action-main-inverse-with-default);\n --button-typical-secondary-bg-active: var(--mode-color-action-main-active-alt);\n --button-typical-secondary-bg-default: var(--mode-color-action-main-default-alt3);\n --button-typical-secondary-bg-hover: var(--mode-color-action-main-hover-alt);\n --button-typical-secondary-border-active: var(--mode-color-action-main-active);\n --button-typical-secondary-border-disabled: var(--mode-color-action-inactive-default);\n --button-typical-secondary-border-default: var(--mode-color-action-main-default-alt);\n --button-typical-secondary-border-hover: var(--mode-color-action-main-hover);\n --button-typical-secondary-label-active: var(--mode-color-action-grayscale-with-active-alt);\n --button-typical-secondary-label-disabled: var(--mode-color-action-inactive-txt);\n --button-typical-secondary-label-default: var(--mode-color-action-grayscale-default);\n --button-typical-secondary-label-hover: var(--mode-color-action-grayscale-with-hover);\n --button-typical-secondary-inverse-bg-active: var(--mode-color-action-main-inverse-active-alt);\n --button-typical-secondary-inverse-bg-default: var(--mode-color-action-main-inverse-default-alt3);\n --button-typical-secondary-inverse-bg-hover: var(--mode-color-action-main-inverse-hover-alt);\n --button-typical-secondary-inverse-border-active: var(--mode-color-action-main-inverse-active);\n --button-typical-secondary-inverse-border-disabled: var(--mode-color-action-inactive-inverse-default);\n --button-typical-secondary-inverse-border-default: var(--mode-color-action-main-inverse-default-alt);\n --button-typical-secondary-inverse-border-hover: var(--mode-color-action-main-inverse-hover);\n --button-typical-secondary-inverse-label-active: var(--mode-color-action-grayscale-inverse-with-active-alt);\n --button-typical-secondary-inverse-label-disabled: var(--mode-color-action-inactive-inverse-txt);\n --button-typical-secondary-inverse-label-default: var(--mode-color-action-grayscale-inverse-default);\n --button-typical-secondary-inverse-label-hover: var(--mode-color-action-grayscale-inverse-with-hover);\n --button-typical-tertiary-bg-active: var(--mode-color-action-main-active-alt);\n --button-typical-tertiary-bg-default: var(--button-none);\n --button-typical-tertiary-bg-hover: var(--mode-color-action-main-hover-alt);\n --button-typical-tertiary-border-active: var(--mode-color-action-main-active);\n --button-typical-tertiary-border-disabled: var(--mode-color-action-inactive-default);\n --button-typical-tertiary-border-default: var(--mode-color-action-main-default-alt);\n --button-typical-tertiary-border-hover: var(--mode-color-action-main-hover);\n --button-typical-tertiary-label-active: var(--mode-color-action-grayscale-with-active-alt);\n --button-typical-tertiary-label-disabled: var(--mode-color-action-inactive-txt);\n --button-typical-tertiary-label-default: var(--mode-color-action-grayscale-default);\n --button-typical-tertiary-label-hover: var(--mode-color-action-grayscale-with-hover);\n --button-typical-tertiary-inverse-bg-active: var(--mode-color-action-main-inverse-active-alt);\n --button-typical-tertiary-inverse-bg-default: var(--button-none);\n --button-typical-tertiary-inverse-bg-hover: var(--mode-color-action-main-inverse-hover-alt);\n --button-typical-tertiary-inverse-border-active: var(--mode-color-action-main-inverse-active);\n --button-typical-tertiary-inverse-border-disabled: var(--mode-color-action-inactive-inverse-default);\n --button-typical-tertiary-inverse-border-default: var(--mode-color-action-main-inverse-default-alt);\n --button-typical-tertiary-inverse-border-hover: var(--mode-color-action-main-inverse-hover);\n --button-typical-tertiary-inverse-label-active: var(--mode-color-action-grayscale-inverse-with-active-alt);\n --button-typical-tertiary-inverse-label-disabled: var(--mode-color-action-inactive-inverse-txt);\n --button-typical-tertiary-inverse-label-default: var(--mode-color-action-grayscale-inverse-default);\n --button-typical-tertiary-inverse-label-hover: var(--mode-color-action-grayscale-inverse-with-hover);\n --button-typical-subtle-bg-active: var(--mode-color-action-grayscale-active-alt);\n --button-typical-subtle-bg-hover: var(--mode-color-action-grayscale-hover-alt);\n --button-typical-subtle-label-active: var(--mode-color-action-grayscale-with-active-alt);\n --button-typical-subtle-label-disabled: var(--mode-color-action-inactive-txt);\n --button-typical-subtle-label-default: var(--mode-color-action-grayscale-default);\n --button-typical-subtle-label-hover: var(--mode-color-action-grayscale-with-hover);\n --button-typical-subtle-inverse-bg-active: var(--mode-color-action-grayscale-inverse-active-alt);\n --button-typical-subtle-inverse-bg-hover: var(--mode-color-action-grayscale-inverse-hover-alt);\n --button-typical-subtle-inverse-label-active: var(--mode-color-action-grayscale-inverse-with-active-alt);\n --button-typical-subtle-inverse-label-disabled: var(--mode-color-action-inactive-inverse-txt);\n --button-typical-subtle-inverse-label-default: var(--mode-color-action-grayscale-inverse-default);\n --button-typical-subtle-inverse-label-hover: var(--mode-color-action-grayscale-inverse-with-hover);\n --button-typical-toggle-bg-active-disabled: var(--mode-color-action-inactive-default);\n --button-typical-toggle-label-active-disabled: var(--mode-color-action-inactive-txt-alt);\n --button-typical-toggle-bg-active: var(--mode-color-action-grayscale-active);\n --button-typical-toggle-bg-hover: var(--mode-color-action-grayscale-hover-alt);\n --button-typical-toggle-border-default: var(--mode-color-action-grayscale-default);\n --button-typical-toggle-border-disabled: var(--mode-color-action-inactive-default);\n --button-typical-toggle-label-active: var(--mode-color-action-grayscale-with-active);\n --button-typical-toggle-label-disabled: var(--mode-color-action-inactive-txt);\n --button-typical-toggle-label-default: var(--mode-color-action-grayscale-default-alt);\n --button-typical-toggle-label-hover: var(--mode-color-action-grayscale-with-hover);\n --button-video-bg-blur: var(--mode-color-action-grayscale-hover-alt);\n --button-video-primary-bg-default: var(--mode-color-action-grayscale-with-default);\n --button-video-primary-bg-hover: var(--mode-color-action-grayscale-with-default);\n --button-video-primary-label-default: var(--mode-color-action-grayscale-default);\n --button-video-primary-label-hover: var(--mode-color-action-grayscale-default);\n --button-video-secondary-bg-hover: var(--mode-color-action-grayscale-with-default);\n --button-video-secondary-border-default: var(--mode-color-action-grayscale-with-default);\n --button-video-secondary-border-hover: var(--mode-color-action-grayscale-with-default);\n --button-video-secondary-label-default: var(--mode-color-action-grayscale-with-default);\n --button-video-secondary-label-hover: var(--mode-color-action-grayscale-default);\n --container-action-bg-footer-activated: var(--mode-color-status-positive-default);\n --container-action-bg-footer-active: var(--mode-color-action-grayscale-active);\n --container-action-border-activated: var(--mode-color-status-positive-default);\n --container-action-bg-footer-default: var(--mode-color-generic-bg-nought);\n --container-action-bg-default: var(--mode-color-generic-bg-nought);\n --container-action-bg-disabled: var(--mode-color-action-inactive-default-alt);\n --container-action-bg-hover: var(--mode-color-action-grayscale-hover-alt);\n --container-action-border-active: var(--mode-color-action-grayscale-active);\n --container-action-border-alt: var(--mode-color-generic-fg-moderate);\n --container-action-borderalt-hover: var(--mode-color-action-grayscale-default);\n --container-action-border-inactive: var(--mode-color-generic-fg-firm);\n --container-action-border-default: var(--mode-color-generic-fg-firm);\n --container-action-icon-active: var(--mode-color-action-grayscale-active);\n --container-action-icon-default: var(--mode-color-action-grayscale-default);\n --container-action-icon-alt-default: var(--mode-color-action-grayscale-default-alt);\n --container-action-icon-hover: var(--mode-color-action-grayscale-default);\n --container-action-label-footer-active: var(--mode-color-action-grayscale-with-active);\n --container-action-label-footer-activated: var(--mode-color-action-grayscale-with-active);\n --container-action-txt-active: var(--mode-color-action-grayscale-active);\n --container-action-txt-disabled: var(--mode-color-action-inactive-txt);\n --container-action-txt-default: var(--mode-color-generic-txt-severe);\n --container-action-txt-alt-default: var(--mode-color-generic-txt-moderate);\n --container-action-txt-hover: var(--mode-color-action-grayscale-default);\n --container-action-detailedicon-bg: var(--mode-color-status-custom-green-default);\n --container-action-target-bg-default: var(--mode-color-status-info-default);\n --container-scrollbar-bg-default: var(--mode-color-generic-bg-faint);\n --container-scrollbar-fg-default: var(--mode-color-generic-fg-firm);\n --container-scrollbar-inverse-bg-default: var(--mode-color-generic-bg-inverse-soft);\n --container-scrollbar-inverse-fg-default: var(--mode-color-generic-fg-inverse-firm);\n --container-standard-bg-alt: var(--mode-color-generic-bg-faint);\n --container-standard-bg-default: var(--mode-color-generic-bg-nought);\n --container-standard-bg-footer-default: var(--mode-color-generic-bg-faint);\n --container-standard-border-active: var(--mode-color-action-grayscale-active);\n --container-standard-border-ai-h: var(--mode-color-status-ai-inverse-default-horizontal);\n --container-standard-border-ai-v: var(--mode-color-status-ai-inverse-default-vertical);\n --container-standard-border-alt: var(--mode-color-generic-fg-firm);\n --container-standard-border-default: var(--mode-color-generic-fg-soft);\n --container-standard-dimmer: var(--mode-color-action-inactive-mask);\n --container-standard-icon: var(--mode-color-generic-fg-firm);\n --container-standard-txt-alt: var(--mode-color-generic-txt-moderate);\n --container-standard-txt-default: var(--mode-color-generic-txt-severe);\n --container-standard-inverse-bg-alt: var(--mode-color-generic-bg-inverse-delicate);\n --container-standard-inverse-border-alt: var(--mode-color-generic-fg-inverse-firm);\n --container-standard-inverse-bg-default: var(--mode-color-generic-bg-inverse-nought);\n --container-standard-inverse-border-default: var(--mode-color-generic-fg-inverse-soft);\n --container-standard-inverse-txt-alt: var(--mode-color-generic-txt-inverse-moderate);\n --container-standard-inverse-txt-default: var(--mode-color-generic-txt-inverse-severe);\n --container-standard-priority-bg-ai: var(--mode-color-status-ai-inverse-default-vertical);\n --container-standard-priority-bg-caution: var(--mode-color-status-warning-default);\n --container-standard-priority-bg-negative: var(--mode-color-status-negative-default);\n --container-standard-priority-bg-prio: var(--mode-color-status-priority-default);\n --container-standard-priority-bg-info: var(--mode-color-status-info-default);\n --container-standard-priority-bg-neutral: var(--mode-color-status-neutral-default);\n --container-standard-priority-bg-positive: var(--mode-color-status-positive-default);\n --container-standard-priority-inverse-bg-ai: var(--mode-color-status-ai-inverse-default-vertical);\n --container-standard-priority-inverse-bg-caution: var(--mode-color-status-warning-inverse-default);\n --container-standard-priority-inverse-bg-negative: var(--mode-color-status-negative-inverse-default);\n --container-standard-priority-inverse-bg-prio: var(--mode-color-status-priority-inverse-default);\n --container-standard-priority-inverse-bg-info: var(--mode-color-status-info-inverse-default);\n --container-standard-priority-inverse-bg-neutral: var(--mode-color-status-neutral-inverse-default);\n --container-standard-priority-inverse-bg-positive: var(--mode-color-status-positive-inverse-default);\n --container-quote-border: var(--mode-color-action-main-default);\n --container-size-bubble-max-w: 600px;\n --container-size-copilot-emptystate-illustration: 200px;\n --container-size-copilot-emptystate-txt-max-w: 600px;\n --container-size-copilot-overlay-max-h: 960px;\n --container-size-dialog-max-w-s: 540px;\n --container-size-dialog-max-w-m: 850px;\n --container-size-dialog-max-w-l: 1080px;\n --container-size-dialog-min-w: 288px;\n --container-size-empty-state-primary-s: 200px;\n --container-size-empty-state-primary-m: 240px;\n --container-size-empty-state-primary-l: 320px;\n --container-size-fluid-items-2-xs: 80px;\n --container-size-fluid-items-xs: 128px;\n --container-size-fluid-items-s: 160px;\n --container-size-fluid-items-m: 200px;\n --container-size-fluid-items-l: 240px;\n --container-size-fluid-items-xl: 288px;\n --container-size-fluid-items-2-xl: 320px;\n --container-size-fluid-items-3-xl: 560px;\n --container-size-fluid-items-4-xl: 760px;\n --container-size-sidebar-max-w-s: 760px;\n --container-size-sidebar-max-w-m: 1000px;\n --container-size-sidebar-min-w: 288px;\n --focus-bg: var(--mode-color-action-focus-with-default-alt);\n --focus-borderalt: var(--mode-color-action-focus-default);\n --focus-border: var(--mode-color-action-focus-with-default);\n --focus-label: var(--mode-color-action-focus-txt);\n --focus-inverse-bg: var(--mode-color-action-focus-inverse-with-default-alt);\n --focus-inverse-borderalt: var(--mode-color-action-focus-inverse-default);\n --focus-inverse-border: var(--mode-color-action-focus-inverse-with-default);\n --focus-inverse-label: var(--mode-color-action-focus-inverse-txt);\n --dataviz-chart-line-bg-default: var(--mode-color-colorcode-green-deep);\n --dataviz-chart-line-border: var(--mode-color-colorcode-green-deep);\n --dataviz-chart-bar-gray-bg-alt: var(--mode-color-colorcode-gray-muted);\n --dataviz-chart-bar-gray-bg-default: var(--mode-color-colorcode-gray-severe);\n --dataviz-chart-bar-gray-border: var(--mode-color-colorcode-gray-severe);\n --dataviz-chart-bar-gray-pattern: var(--mode-color-colorcode-gray-severe);\n --dataviz-chart-bar-green-bg-alt: var(--mode-color-colorcode-green-muted);\n --dataviz-chart-bar-green-bg-default: var(--mode-color-colorcode-green-deep);\n --dataviz-chart-bar-green-border: var(--mode-color-colorcode-green-deep);\n --dataviz-chart-bar-green-pattern: var(--mode-color-colorcode-green-deep);\n --dataviz-chart-bar-orange-bg-alt: var(--mode-color-colorcode-orange-muted);\n --dataviz-chart-bar-orange-bg-default: var(--mode-color-colorcode-orange-deep);\n --dataviz-chart-bar-orange-border: var(--mode-color-colorcode-orange-deep);\n --dataviz-chart-bar-orange-pattern: var(--mode-color-colorcode-orange-deep);\n --dataviz-chart-donut-gray-bg-alt: var(--mode-color-colorcode-gray-muted);\n --dataviz-chart-donut-gray-bg-default: var(--mode-color-colorcode-gray-severe);\n --dataviz-chart-donut-gray-border: var(--mode-color-colorcode-gray-severe);\n --dataviz-chart-donut-gray-pattern: var(--mode-color-colorcode-gray-severe);\n --dataviz-chart-donut-green-bg-alt: var(--mode-color-colorcode-green-muted);\n --dataviz-chart-donut-green-bg-default: var(--mode-color-colorcode-green-deep);\n --dataviz-chart-donut-green-border: var(--mode-color-colorcode-green-deep);\n --dataviz-chart-donut-green-pattern: var(--mode-color-colorcode-green-deep);\n --dataviz-chart-donut-orange-bg-alt: var(--mode-color-colorcode-orange-muted);\n --dataviz-chart-donut-orange-bg-default: var(--mode-color-colorcode-orange-deep);\n --dataviz-chart-donut-orange-border: var(--mode-color-colorcode-orange-deep);\n --dataviz-chart-donut-orange-pattern: var(--mode-color-colorcode-orange-deep);\n --dataviz-generic-label-alt: var(--mode-color-generic-txt-inverse-extreme);\n --dataviz-generic-label-default: var(--mode-color-generic-txt-extreme);\n --dataviz-generic-blue-bg-alt: var(--mode-color-colorcode-blue-deep);\n --dataviz-generic-blue-bg-default: var(--mode-color-colorcode-blue-muted);\n --dataviz-generic-blue-border: var(--mode-color-colorcode-blue-deep);\n --dataviz-generic-blue-pattern: var(--mode-color-colorcode-blue-deep);\n --dataviz-generic-teal-bg-alt: var(--mode-color-colorcode-teal-deep);\n --dataviz-generic-teal-bg-default: var(--mode-color-colorcode-teal-muted);\n --dataviz-generic-teal-border: var(--mode-color-colorcode-teal-deep);\n --dataviz-generic-teal-pattern: var(--mode-color-colorcode-teal-deep);\n --dataviz-generic-green-bg-alt: var(--mode-color-colorcode-green-deep);\n --dataviz-generic-green-bg-default: var(--mode-color-colorcode-green-muted);\n --dataviz-generic-green-border: var(--mode-color-colorcode-green-deep);\n --dataviz-generic-green-pattern: var(--mode-color-colorcode-green-deep);\n --dataviz-generic-lime-bg-alt: var(--mode-color-colorcode-lime-deep);\n --dataviz-generic-lime-bg-default: var(--mode-color-colorcode-lime-muted);\n --dataviz-generic-lime-border: var(--mode-color-colorcode-lime-deep);\n --dataviz-generic-lime-pattern: var(--mode-color-colorcode-lime-deep);\n --dataviz-generic-orange-bg-alt: var(--mode-color-colorcode-orange-deep);\n --dataviz-generic-orange-bg-default: var(--mode-color-colorcode-orange-muted);\n --dataviz-generic-orange-border: var(--mode-color-colorcode-orange-deep);\n --dataviz-generic-orange-pattern: var(--mode-color-colorcode-orange-deep);\n --dataviz-generic-red-bg-alt: var(--mode-color-colorcode-red-deep);\n --dataviz-generic-red-bg-default: var(--mode-color-colorcode-red-muted);\n --dataviz-generic-red-border: var(--mode-color-colorcode-red-deep);\n --dataviz-generic-red-pattern: var(--mode-color-colorcode-red-deep);\n --dataviz-generic-pink-bg-alt: var(--mode-color-colorcode-pink-deep);\n --dataviz-generic-pink-bg-default: var(--mode-color-colorcode-pink-muted);\n --dataviz-generic-pink-border: var(--mode-color-colorcode-pink-deep);\n --dataviz-generic-pink-pattern: var(--mode-color-colorcode-pink-deep);\n --dataviz-generic-purple-bg-alt: var(--mode-color-colorcode-purple-deep);\n --dataviz-generic-purple-bg-default: var(--mode-color-colorcode-purple-muted);\n --dataviz-generic-purple-border: var(--mode-color-colorcode-purple-deep);\n --dataviz-generic-purple-pattern: var(--mode-color-colorcode-purple-deep);\n --dataviz-generic-gray-bg-alt: var(--mode-color-colorcode-gray-deep);\n --dataviz-generic-gray-bg-default: var(--mode-color-colorcode-gray-muted);\n --dataviz-generic-gray-border: var(--mode-color-colorcode-gray-deep);\n --dataviz-generic-gray-pattern: var(--mode-color-colorcode-gray-deep);\n --dataviz-generic-slate-bg-alt: var(--mode-color-colorcode-slate-deep);\n --dataviz-generic-slate-bg-default: var(--mode-color-colorcode-slate-muted);\n --dataviz-generic-slate-border: var(--mode-color-colorcode-slate-deep);\n --dataviz-generic-slate-pattern: var(--mode-color-colorcode-slate-deep);\n --input-calendar-bg-active: var(--mode-color-action-grayscale-active);\n --input-calendar-bg-disabled: var(--mode-color-action-inactive-default-alt);\n --input-calendar-bg-duration: var(--mode-color-action-data-entry-hover-alt);\n --input-calendar-bg-hover: var(--mode-color-action-data-entry-hover-alt);\n --input-calendar-border-duration: var(--mode-color-action-grayscale-active);\n --input-calendar-txt-active: var(--mode-color-action-grayscale-with-active);\n --input-calendar-txt-alt: var(--mode-color-action-data-entry-txt-alt);\n --input-calendar-txt-disabled: var(--mode-color-action-inactive-txt);\n --input-calendar-txt-duration: var(--mode-color-action-data-entry-txt);\n --input-calendar-txt-default: var(--mode-color-action-data-entry-txt);\n --input-calendar-txt-hover: var(--mode-color-action-grayscale-with-hover);\n --input-calendar-txt-alt-default: var(--mode-color-action-data-entry-txt-alt);\n --input-dropdown-bg-hover: var(--mode-color-action-data-entry-hover-alt);\n --input-dropdown-label-active: var(--mode-color-action-grayscale-with-active);\n --input-dropdown-label-alt: var(--mode-color-action-data-entry-txt);\n --input-dropdown-label-disabled: var(--mode-color-action-inactive-txt);\n --input-dropdown-label-default: var(--mode-color-action-data-entry-txt-alt);\n --input-dropdown-label-hover: var(--mode-color-action-grayscale-with-hover);\n --input-dropdown-label-subtxt: var(--mode-color-action-data-entry-txt-alt);\n --input-labelset-label-required: var(--mode-color-action-danger-default);\n --input-labelset-label-default: var(--mode-color-action-data-entry-txt);\n --input-labelset-label-alt: var(--mode-color-action-data-entry-txt-alt);\n --input-labelset-label-disabled: var(--mode-color-action-inactive-txt);\n --input-labelset-label-read-only: var(--mode-color-action-data-entry-txt);\n --input-labelset-inverse-label-required: var(--mode-color-action-danger-inverse-default);\n --input-labelset-inverse-label-default: var(--mode-color-action-data-entry-inverse-txt);\n --input-labelset-inverse-label-alt: var(--mode-color-action-data-entry-inverse-txt-alt);\n --input-typical-bg-alt: var(--mode-color-action-data-entry-default-alt);\n --input-typical-bg-disabled: var(--mode-color-action-inactive-default-alt);\n --input-typical-bg-default: var(--mode-color-action-data-entry-default);\n --input-typical-bg-hover: var(--mode-color-action-data-entry-hover-alt);\n --input-typical-bg-read-only: var(--mode-color-action-inactive-default-alt);\n --input-typical-border-alt: var(--mode-color-action-inactive-default);\n --input-typical-border-default: var(--mode-color-action-data-entry-with-default);\n --input-typical-border-disabled: var(--mode-color-action-inactive-default);\n --input-typical-border-hover: var(--mode-color-action-data-entry-with-hover);\n --input-typical-border-read-only: var(--mode-color-action-inactive-default);\n --input-typical-icon-active: var(--mode-color-action-data-entry-with-active);\n --input-typical-icon-default: var(--mode-color-action-data-entry-txt);\n --input-typical-icon-disabled: var(--mode-color-action-inactive-icon);\n --input-typical-icon-hover: var(--mode-color-action-data-entry-with-hover);\n --input-typical-icon-read-only: var(--mode-color-action-inactive-icon-alt);\n --input-typical-icon-alt-active: var(--mode-color-action-data-entry-with-active-alt);\n --input-typical-txt-active: var(--mode-color-action-data-entry-txt);\n --input-typical-txt-alt: var(--mode-color-action-data-entry-txt-alt);\n --input-typical-txt-default: var(--mode-color-action-data-entry-txt);\n --input-typical-txt-disabled: var(--mode-color-action-inactive-txt);\n --input-typical-txt-hover: var(--mode-color-action-data-entry-with-hover);\n --input-typical-txt-read-only: var(--mode-color-generic-txt-severe);\n --input-typical-inverse-bg-default: var(--mode-color-action-data-entry-inverse-default);\n --input-typical-inverse-border-default: var(--mode-color-action-data-entry-inverse-with-default);\n --input-typical-inverse-txt-default: var(--mode-color-action-data-entry-inverse-txt);\n --input-switch-bg-active: var(--mode-color-action-grayscale-active);\n --input-switch-bg-activate-disabled: var(--mode-color-action-inactive-default);\n --input-switch-bg-disabled: var(--mode-color-action-inactive-default-alt);\n --input-switch-bg-default: var(--mode-color-action-data-entry-default);\n --input-switch-border-active: transparent;\n --input-switch-border-active-disabled: transparent;\n --input-switch-border-disabled: var(--mode-color-action-inactive-default);\n --input-switch-border-default: var(--mode-color-action-data-entry-with-default);\n --input-switch-fg-active: var(--mode-color-action-grayscale-with-active);\n --input-switch-fg-activate-disabled: var(--mode-color-action-inactive-txt-alt);\n --input-switch-fg-disabled: var(--mode-color-action-inactive-default);\n --input-switch-fg-default: var(--mode-color-action-data-entry-with-default);\n --input-switch-label-active: var(--mode-color-action-data-entry-txt);\n --input-switch-label-activate-disabled: var(--mode-color-action-inactive-default);\n --input-switch-label-disabled: var(--mode-color-action-inactive-default);\n --input-switch-label-default: var(--mode-color-action-data-entry-txt-alt);\n --input-validation-border-error: var(--mode-color-status-negative-default);\n --input-validation-bar-error: var(--mode-color-status-negative-default);\n --input-validation-bar-warn: var(--mode-color-status-warning-default);\n --input-validation-label-error: var(--mode-color-status-negative-default);\n --input-validation-label-success: var(--mode-color-status-positive-default);\n --input-validation-label-warn: var(--mode-color-status-warning-txt);\n --input-validation-inverse-border-error: var(--mode-color-status-negative-inverse-default);\n --input-validation-inverse-bar-error: var(--mode-color-status-negative-inverse-default);\n --input-validation-inverse-label-error: var(--mode-color-status-negative-inverse-default);\n --input-size-generic-min-w: 288px;\n --logo-sage-bg-default: var(--mode-color-brand-default);\n --logo-sage-bg-alt: var(--mode-color-brand-default-alt);\n --logo-sage-inverse-bg-default: var(--mode-color-brand-inverse-default);\n --logo-sage-inverse-bg-alt: var(--mode-color-brand-inverse-default-alt);\n --logo-copilot-no-bg-fg-default: var(--mode-color-brand-copilot-monochrome);\n --logo-ai-sparkle-bg-dot: var(--mode-color-brand-copilot-with-default);\n --logo-ai-sparkle-bg-star: var(--mode-color-brand-copilot-default);\n --logo-ai-sparkle-outline: var(--mode-color-brand-copilot-default);\n --logo-ai-sparkle-inverse-bg-dot: var(--mode-color-brand-copilot-inverse-with-default);\n --logo-ai-sparkle-inverse-bg-star: var(--mode-color-brand-copilot-inverse-default);\n --logo-ai-sparkle-inverse-outline: var(--mode-color-brand-copilot-inverse-default);\n --link-destructive-label-default: var(--mode-color-action-danger-default-alt);\n --link-destructive-label-hover: var(--mode-color-action-danger-hover-alt2);\n --link-destructive-inverse-label-default: var(--mode-color-action-danger-inverse-default-alt);\n --link-destructive-inverse-label-hover: var(--mode-color-action-danger-inverse-hover-alt2);\n --link-typical-label-default: var(--mode-color-action-main-default-alt2);\n --link-typical-label-hover: var(--mode-color-action-main-hover-alt2);\n --link-typical-inverse-label-default: var(--mode-color-action-main-inverse-default-alt2);\n --link-typical-inverse-label-hover: var(--mode-color-action-main-inverse-hover-alt2);\n --link-subtle-label-default: var(--mode-color-action-grayscale-default);\n --link-subtle-label-hover: var(--mode-color-action-grayscale-active);\n --link-subtle-inverse-label-default: var(--mode-color-action-grayscale-inverse-default);\n --link-subtle-inverse-label-hover: var(--mode-color-action-grayscale-inverse-active);\n --message-none: var(--mode-color-none);\n --message-contextual-bg: var(--mode-color-generic-bg-nought);\n --message-contextual-icon: var(--mode-color-generic-bg-nought);\n --message-contextual-icon-alt: var(--mode-color-status-neutral-default);\n --message-contextual-txt: var(--mode-color-status-txt-with-hover-alt);\n --message-contextual-ai-bg-default: var(--mode-color-status-ai-default-alt);\n --message-contextual-ai-bg-alt: var(--mode-color-status-neutral-default-alt);\n --message-contextual-ai-border-default: var(--mode-color-status-ai-default-alt);\n --message-contextual-callout-bg-alt: var(--mode-color-status-callout-default-alt);\n --message-contextual-callout-icon: var(--mode-color-status-txt-with-default-alt);\n --message-contextual-error-bg-default: var(--mode-color-status-negative-default);\n --message-contextual-error-bg-alt: var(--mode-color-status-negative-default-alt);\n --message-contextual-error-border-default: var(--mode-color-status-negative-default);\n --message-contextual-error-icon: var(--mode-color-status-negative-default);\n --message-contextual-info-bg-default: var(--mode-color-status-info-default);\n --message-contextual-info-bg-alt: var(--mode-color-status-info-default-alt);\n --message-contextual-info-border-default: var(--mode-color-status-info-default);\n --message-contextual-info-icon: var(--mode-color-status-info-default);\n --message-contextual-success-bg-default: var(--mode-color-status-positive-default);\n --message-contextual-success-bg-alt: var(--mode-color-status-positive-default-alt);\n --message-contextual-success-border-default: var(--mode-color-status-positive-default);\n --message-contextual-success-icon: var(--mode-color-status-positive-default);\n --message-contextual-warning-bg-default: var(--mode-color-status-warning-default);\n --message-contextual-warning-bg-alt: var(--mode-color-status-warning-default-alt);\n --message-contextual-warning-border-default: var(--mode-color-status-warning-default);\n --message-contextual-warning-icon: var(--mode-color-status-warning-default);\n --message-global-label-default: var(--mode-color-status-txt-with-default-alt);\n --message-global-label-hover: var(--mode-color-action-grayscale-with-hover);\n --message-global-callout-bg-default: var(--mode-color-status-callout-default-alt);\n --message-global-callout-bg-hover: var(--mode-color-status-callout-hover-alt);\n --message-global-callout-icon: var(--mode-color-status-txt-with-default-alt);\n --message-global-info-bg-default: var(--mode-color-status-info-default-alt);\n --message-global-info-bg-hover: var(--mode-color-status-info-hover-alt);\n --message-global-info-icon: var(--mode-color-status-info-default);\n --message-global-warning-bg-default: var(--mode-color-status-warning-default-alt);\n --message-global-warning-bg-hover: var(--mode-color-status-warning-hover-alt);\n --message-global-warning-icon: var(--mode-color-status-warning-default);\n --nav-bg-default: var(--mode-color-generic-bg-nought);\n --nav-leftnav-container-bg-default: var(--mode-color-generic-bg-inverse-nought);\n --nav-leftnav-container-bg-default-alt: var(--mode-color-action-nav-inverse-default-alt);\n --nav-leftnav-container-border-default: var(--mode-color-generic-fg-inverse-firm);\n --nav-leftnav-item-bg-active: var(--mode-color-action-nav-inverse-active);\n --nav-leftnav-item-bg-default: var(--mode-color-none);\n --nav-leftnav-item-bg-hover: var(--mode-color-action-nav-inverse-hover);\n --nav-leftnav-item-label-active: var(--mode-color-action-nav-inverse-with-active);\n --nav-leftnav-item-label-default: var(--mode-color-action-nav-inverse-with-default);\n --nav-leftnav-item-label-hover: var(--mode-color-action-nav-inverse-with-hover);\n --nav-modal-container-bg-default: var(--mode-color-generic-bg-nought);\n --nav-modal-container-bg-default-alt: var(--mode-color-generic-surface-faint);\n --nav-modal-container-border-default: var(--mode-color-generic-fg-firm);\n --nav-modal-item-bg-active: var(--mode-color-action-nav-active);\n --nav-modal-item-bg-default: var(--mode-color-none);\n --nav-modal-item-bg-hover: var(--mode-color-action-nav-hover);\n --nav-modal-item-label-active: var(--mode-color-action-nav-with-active);\n --nav-modal-item-label-default: var(--mode-color-action-nav-with-default);\n --nav-modal-item-label-hover: var(--mode-color-action-nav-with-hover);\n --nav-modal-headeritem-label-default: var(--mode-color-generic-txt-soft);\n --nav-topnav-container-bg-default: var(--mode-color-generic-bg-nought);\n --nav-topnav-container-border-default: var(--mode-color-generic-fg-firm);\n --nav-topnav-item-bg-active: var(--mode-color-action-nav-active);\n --nav-topnav-item-bg-default: var(--mode-color-none);\n --nav-topnav-item-bg-hover: var(--mode-color-action-nav-hover);\n --nav-topnav-item-label-active: var(--mode-color-action-nav-with-active);\n --nav-topnav-item-label-default: var(--mode-color-action-nav-with-default);\n --nav-topnav-item-label-hover: var(--mode-color-action-nav-with-hover);\n --page-bg-default: var(--mode-color-generic-surface-nought);\n --page-bg-alt: var(--mode-color-generic-surface-faint);\n --page-txt-alt: var(--mode-color-generic-txt-moderate);\n --page-txt-default: var(--mode-color-generic-txt-severe);\n --popover-size-menu-minwidth-s: calc(var(--container-size-fluid-items-m) / 2);\n --popover-size-menu-minwidth-m: var(--container-size-fluid-items-xs);\n --popover-size-menu-minwidth-l: var(--container-size-fluid-items-s);\n --popover-size-menu-maxwidth-s: var(--container-size-fluid-items-m);\n --popover-size-menu-maxwidth-m: var(--container-size-fluid-items-l);\n --popover-size-menu-maxwidth-l: var(--container-size-fluid-items-xl);\n --popover-bg-active: var(--mode-color-action-grayscale-active);\n --popover-bg-active-alt: var(--mode-color-action-grayscale-hover-alt);\n --popover-bg-default: var(--mode-color-generic-bg-nought);\n --popover-bg-hover: var(--mode-color-action-grayscale-hover-alt);\n --popover-label-active: var(--mode-color-action-grayscale-with-active);\n --popover-label-active-alt: var(--mode-color-action-grayscale-with-hover);\n --popover-label-disabled: var(--mode-color-action-inactive-txt);\n --popover-label-hover: var(--mode-color-action-grayscale-with-hover);\n --popover-label-default: var(--mode-color-action-grayscale-default-alt);\n --popover-submenu-bg-default: var(--mode-color-generic-bg-faint);\n --profile-size-outside-xs: var(--global-size-xs);\n --profile-size-outside-s: var(--global-size-s);\n --profile-size-outside-m: var(--global-size-m);\n --profile-size-outside-ml: 56px;\n --profile-size-outside-l: var(--global-size-4-xl);\n --profile-size-outside-xl: 104px;\n --profile-size-outside-xxl: 128px;\n --profile-size-inside-xs: var(--global-size-3-xs);\n --profile-size-inside-s: var(--global-size-2-xs);\n --profile-size-inside-m: var(--global-size-xs);\n --profile-size-inside-ml: var(--global-size-s);\n --profile-size-inside-l: var(--global-size-l);\n --profile-size-inside-xl: var(--global-size-2-xl);\n --profile-size-inside-xxl: var(--global-size-4-xl);\n --profile-bg-alt: var(--mode-color-generic-txt-severe);\n --profile-bg-def: var(--mode-color-generic-bg-nought);\n --profile-border-default: var(--mode-color-generic-fg-moderate);\n --profile-label-default: var(--mode-color-generic-txt-severe);\n --profile-swatches-blue-bg-default: var(--mode-color-status-custom-blue-default-alt);\n --profile-swatches-blue-label-default: var(--mode-color-status-custom-blue-default);\n --profile-swatches-teal-bg-default: var(--mode-color-status-custom-teal-default-alt);\n --profile-swatches-teal-label-default: var(--mode-color-status-custom-teal-default);\n --profile-swatches-green-bg-default: var(--mode-color-status-custom-green-default-alt);\n --profile-swatches-green-label-default: var(--mode-color-status-custom-green-default);\n --profile-swatches-lime-bg-default: var(--mode-color-status-custom-lime-default-alt);\n --profile-swatches-lime-label-default: var(--mode-color-status-custom-lime-default);\n --profile-swatches-orange-bg-default: var(--mode-color-status-custom-orange-default-alt);\n --profile-swatches-orange-label-default: var(--mode-color-status-custom-orange-txt);\n --profile-swatches-red-bg-default: var(--mode-color-status-custom-red-default-alt);\n --profile-swatches-red-label-default: var(--mode-color-status-custom-red-default);\n --profile-swatches-pink-bg-default: var(--mode-color-status-custom-pink-default-alt);\n --profile-swatches-pink-label-default: var(--mode-color-status-custom-pink-default);\n --profile-swatches-purple-bg-default: var(--mode-color-status-custom-purple-default-alt);\n --profile-swatches-purple-label-default: var(--mode-color-status-custom-purple-default);\n --profile-swatches-slate-bg-default: var(--mode-color-status-custom-slate-default-alt);\n --profile-swatches-slate-label-default: var(--mode-color-status-custom-slate-default);\n --profile-swatches-gray-bg-default: var(--mode-color-status-custom-gray-default-alt);\n --profile-swatches-gray-label-default: var(--mode-color-status-custom-gray-default);\n --profile-font-initials-xs: var(--global-font-static-comp-placeholder-xs);\n --profile-font-initials-s: var(--global-font-static-comp-placeholder-s);\n --profile-font-initials-m: var(--global-font-static-comp-placeholder-m);\n --profile-font-initials-ml: var(--global-font-static-comp-placeholder-ml);\n --profile-font-initials-l: var(--global-font-static-comp-placeholder-l);\n --profile-font-initials-xl: var(--global-font-static-comp-placeholder-xl);\n --profile-font-initials-xxl: var(--global-font-static-comp-placeholder-xxl);\n --profile-font-def-xs: var(--global-font-static-comp-regular-s);\n --profile-font-def-s: var(--global-font-static-comp-regular-m);\n --profile-font-def-m: var(--global-font-static-comp-regular-m);\n --profile-font-def-ml: var(--global-font-static-comp-regular-m);\n --profile-font-def-l: var(--global-font-static-comp-regular-l);\n --profile-font-def-xl: var(--global-font-static-comp-regular-l);\n --profile-font-def-xxl: var(--global-font-static-comp-regular-l);\n --profile-font-heading-xs: var(--global-font-static-comp-medium-s);\n --profile-font-heading-s: var(--global-font-static-comp-medium-m);\n --profile-font-heading-m: var(--global-font-static-subheading-l);\n --profile-font-heading-ml: var(--global-font-static-subheading-l);\n --profile-font-heading-l: var(--global-font-static-subheading-l);\n --profile-font-heading-xl: var(--global-font-static-heading-m);\n --profile-font-heading-xxl: var(--global-font-static-heading-l);\n --profile-font-fluid-initials-xs: var(--global-font-fluid-comp-placeholder-xs);\n --profile-font-fluid-initials-s: var(--global-font-fluid-comp-placeholder-s);\n --profile-font-fluid-initials-m: var(--global-font-fluid-comp-placeholder-m);\n --profile-font-fluid-initials-ml: var(--global-font-fluid-comp-placeholder-ml);\n --profile-font-fluid-initials-l: var(--global-font-fluid-comp-placeholder-l);\n --profile-font-fluid-initials-xl: var(--global-font-fluid-comp-placeholder-xl);\n --profile-font-fluid-initials-xxl: var(--global-font-fluid-comp-placeholder-xxl);\n --profile-font-fluid-def-xs: var(--global-font-fluid-comp-regular-s);\n --profile-font-fluid-def-s: var(--global-font-fluid-comp-regular-m);\n --profile-font-fluid-def-m: var(--global-font-fluid-comp-regular-m);\n --profile-font-fluid-def-ml: var(--global-font-fluid-comp-regular-m);\n --profile-font-fluid-def-l: var(--global-font-fluid-comp-regular-l);\n --profile-font-fluid-def-xl: var(--global-font-fluid-comp-regular-l);\n --profile-font-fluid-def-xxl: var(--global-font-fluid-comp-regular-l);\n --profile-font-fluid-heading-xs: var(--global-font-fluid-comp-medium-s);\n --profile-font-fluid-heading-s: var(--global-font-fluid-comp-medium-m);\n --profile-font-fluid-heading-m: var(--global-font-fluid-subheading-l);\n --profile-font-fluid-heading-ml: var(--global-font-fluid-subheading-l);\n --profile-font-fluid-heading-l: var(--global-font-fluid-subheading-l);\n --profile-font-fluid-heading-xl: var(--global-font-fluid-heading-m);\n --profile-font-fluid-heading-xxl: var(--global-font-fluid-heading-l);\n --progress-none: var(--mode-color-none);\n --progress-bg-default: var(--mode-color-generic-bg-delicate);\n --progress-border-default: var(--mode-color-generic-fg-firm);\n --progress-fg-alt: var(--mode-color-status-positive-default);\n --progress-fg-alt2: var(--mode-color-generic-txt-soft);\n --progress-fg-caution: var(--mode-color-status-warning-default);\n --progress-fg-default: var(--mode-color-action-grayscale-active);\n --progress-fg-error: var(--mode-color-status-negative-default);\n --progress-fg-info: var(--mode-color-status-info-default);\n --progress-label-alt: var(--mode-color-generic-txt-moderate);\n --progress-label-default: var(--mode-color-generic-txt-severe);\n --progress-dataviz-fg-default: var(--mode-color-status-custom-teal-default);\n --progress-inverse-label-alt: var(--mode-color-generic-txt-inverse-soft);\n --progress-loader-bg-default: var(--mode-color-generic-bg-delicate);\n --progress-loader-bg-skeleton: linear-gradient(135deg, var(--mode-color-status-skeleton-stop-1) 15%, var(--mode-color-status-skeleton-stop-2) 85%);\n --progress-loader-fg-default: var(--mode-color-generic-fg-inverse-nought);\n --progress-loader-fg-ai: var(--mode-color-status-ai-default-horizontal);\n --progress-loader-fg-error: var(--mode-color-status-negative-default);\n --progress-loader-fg-complete: var(--mode-color-status-positive-default);\n --progress-loader-inverse-bg-default: var(--mode-color-generic-bg-inverse-delicate);\n --progress-loader-inverse-fg-default: var(--mode-color-generic-fg-inverse-extreme);\n --progress-loader-inverse-fg-ai: var(--mode-color-status-ai-inverse-default-horizontal);\n --progress-stepflow-bg-active: var(--mode-color-action-grayscale-active);\n --progress-stepflow-bg-complete: var(--mode-color-status-positive-default);\n --progress-stepflow-bg-default: var(--mode-color-generic-fg-nought);\n --progress-stepflow-border-active-inner: var(--mode-color-generic-fg-nought);\n --progress-stepflow-border-active-outer: var(--mode-color-action-grayscale-active);\n --progress-stepflow-border-default: var(--mode-color-generic-fg-firm);\n --progress-stepflow-label-alt: var(--mode-color-generic-txt-soft);\n --progress-stepflow-label-default: var(--mode-color-generic-txt-severe);\n --progress-stepindicator-bg-active: var(--mode-color-action-grayscale-active);\n --progress-stepindicator-bg-complete: var(--mode-color-status-positive-default);\n --progress-stepindicator-border-active-outer: var(--mode-color-action-grayscale-active);\n --progress-stepindicator-border-default: var(--mode-color-generic-fg-firm);\n --progress-stepindicator-border-success: var(--mode-color-status-positive-default);\n --progress-stepindicator-label-active: var(--mode-color-action-grayscale-with-active);\n --progress-stepindicator-label-complete: var(--mode-color-action-grayscale-with-active);\n --progress-stepindicator-label-default: var(--mode-color-generic-txt-severe);\n --pill-generic-none: var(--mode-color-none);\n --pill-generic-label-default: var(--mode-color-status-txt-with-default);\n --pill-generic-label-hover: var(--mode-color-status-txt-with-hover);\n --pill-generic-label-alt-default: var(--mode-color-status-txt-with-default-alt);\n --pill-generic-label-alt-hover: var(--mode-color-status-txt-with-default-alt);\n --pill-generic-inverse-label-default: var(--mode-color-status-txt-inverse-with-default);\n --pill-generic-inverse-label-hover: var(--mode-color-status-txt-inverse-with-hover);\n --pill-generic-inverse-label-alt-default: var(--mode-color-status-txt-inverse-with-default-alt);\n --pill-generic-inverse-label-alt-hover: var(--mode-color-status-txt-inverse-with-default-alt);\n --pill-swatches-teal-bg-default: var(--mode-color-status-custom-teal-default);\n --pill-swatches-teal-bg-alt-default: var(--mode-color-status-custom-teal-default-alt);\n --pill-swatches-teal-bg-alt-hover: var(--mode-color-status-custom-teal-hover-alt);\n --pill-swatches-teal-bg-hover: var(--mode-color-status-custom-teal-hover);\n --pill-swatches-teal-border-default: var(--mode-color-status-custom-teal-default);\n --pill-swatches-lime-bg-default: var(--mode-color-status-custom-lime-default);\n --pill-swatches-lime-bg-alt-default: var(--mode-color-status-custom-lime-default-alt);\n --pill-swatches-lime-bg-alt-hover: var(--mode-color-status-custom-lime-hover-alt);\n --pill-swatches-lime-bg-hover: var(--mode-color-status-custom-lime-hover);\n --pill-swatches-lime-border-default: var(--mode-color-status-custom-lime-default);\n --pill-swatches-pink-bg-default: var(--mode-color-status-custom-pink-default);\n --pill-swatches-pink-bg-alt-default: var(--mode-color-status-custom-pink-default-alt);\n --pill-swatches-pink-bg-alt-hover: var(--mode-color-status-custom-pink-hover-alt);\n --pill-swatches-pink-bg-hover: var(--mode-color-status-custom-pink-hover);\n --pill-swatches-pink-border-default: var(--mode-color-status-custom-pink-default);\n --pill-swatches-slate-bg-default: var(--mode-color-status-custom-slate-default);\n --pill-swatches-slate-bg-alt-default: var(--mode-color-status-custom-slate-default-alt);\n --pill-swatches-slate-bg-alt-hover: var(--mode-color-status-custom-slate-hover-alt);\n --pill-swatches-slate-bg-hover: var(--mode-color-status-custom-slate-hover);\n --pill-swatches-slate-border-default: var(--mode-color-status-custom-slate-default);\n --pill-swatches-orange-bg-default: var(--mode-color-status-warning-default);\n --pill-swatches-orange-bg-alt-default: var(--mode-color-status-warning-default-alt);\n --pill-swatches-orange-bg-alt-hover: var(--mode-color-status-warning-hover-alt);\n --pill-swatches-orange-bg-hover: var(--mode-color-status-warning-hover);\n --pill-swatches-orange-border-default: var(--mode-color-status-warning-default);\n --pill-swatches-red-bg-default: var(--mode-color-status-negative-default);\n --pill-swatches-red-bg-alt-default: var(--mode-color-status-negative-default-alt);\n --pill-swatches-red-bg-alt-hover: var(--mode-color-status-negative-hover-alt);\n --pill-swatches-red-bg-hover: var(--mode-color-status-negative-hover);\n --pill-swatches-red-border-default: var(--mode-color-status-negative-default);\n --pill-swatches-gray-bg-default: var(--mode-color-status-neutral-default);\n --pill-swatches-gray-bg-alt-default: var(--mode-color-status-neutral-default-alt);\n --pill-swatches-gray-bg-alt-hover: var(--mode-color-status-neutral-hover-alt);\n --pill-swatches-gray-bg-hover: var(--mode-color-status-neutral-hover);\n --pill-swatches-gray-border-default: var(--mode-color-status-neutral-default);\n --pill-swatches-purple-bg-default: var(--mode-color-status-priority-default);\n --pill-swatches-purple-bg-alt-default: var(--mode-color-status-priority-default-alt);\n --pill-swatches-purple-bg-alt-hover: var(--mode-color-status-priority-hover-alt);\n --pill-swatches-purple-bg-hover: var(--mode-color-status-priority-hover);\n --pill-swatches-purple-border-default: var(--mode-color-status-priority-default);\n --pill-swatches-green-bg-default: var(--mode-color-status-positive-default);\n --pill-swatches-green-bg-alt-hover: var(--mode-color-status-positive-hover-alt);\n --pill-swatches-green-bg-alt-default: var(--mode-color-status-positive-default-alt);\n --pill-swatches-green-bg-hover: var(--mode-color-status-positive-hover);\n --pill-swatches-green-border-default: var(--mode-color-status-positive-default);\n --pill-swatches-blue-bg-default: var(--mode-color-status-info-default);\n --pill-swatches-blue-bg-alt-default: var(--mode-color-status-info-default-alt);\n --pill-swatches-blue-bg-alt-hover: var(--mode-color-status-info-hover-alt);\n --pill-swatches-blue-bg-hover: var(--mode-color-status-info-hover);\n --pill-swatches-blue-border-default: var(--mode-color-status-info-default);\n --pill-error-bg-default: var(--mode-color-status-negative-default);\n --pill-error-bg-alt-default: var(--mode-color-status-negative-default-alt);\n --pill-error-bg-alt-hover: var(--mode-color-status-negative-hover-alt);\n --pill-error-bg-hover: var(--mode-color-status-negative-hover);\n --pill-error-border-default: var(--mode-color-status-negative-default);\n --pill-error-inverse-bg-default: var(--mode-color-status-negative-inverse-default);\n --pill-error-inverse-bg-alt-default: var(--mode-color-status-negative-inverse-default-alt);\n --pill-error-inverse-bg-alt-hover: var(--mode-color-status-negative-inverse-hover-alt);\n --pill-error-inverse-bg-hover: var(--mode-color-status-negative-inverse-hover);\n --pill-error-inverse-border-default: var(--mode-color-status-negative-inverse-default);\n --pill-priority-bg-default: var(--mode-color-status-priority-default);\n --pill-priority-bg-alt-default: var(--mode-color-status-priority-default-alt);\n --pill-priority-bg-alt-hover: var(--mode-color-status-priority-hover-alt);\n --pill-priority-bg-hover: var(--mode-color-status-priority-hover);\n --pill-priority-border-default: var(--mode-color-status-priority-default);\n --pill-priority-inverse-bg-default: var(--mode-color-status-priority-default);\n --pill-priority-inverse-bg-alt-default: var(--mode-color-status-priority-inverse-default-alt);\n --pill-priority-inverse-bg-alt-hover: var(--mode-color-status-priority-inverse-hover-alt);\n --pill-priority-inverse-bg-hover: var(--mode-color-status-priority-hover);\n --pill-priority-inverse-border-default: var(--mode-color-status-priority-default);\n --pill-info-bg-default: var(--mode-color-status-info-default);\n --pill-info-bg-alt-default: var(--mode-color-status-info-default-alt);\n --pill-info-bg-alt-hover: var(--mode-color-status-info-hover-alt);\n --pill-info-bg-hover: var(--mode-color-status-info-hover);\n --pill-info-border-default: var(--mode-color-status-info-default);\n --pill-info-inverse-bg-default: var(--mode-color-status-info-inverse-default);\n --pill-info-inverse-bg-alt-default: var(--mode-color-status-info-inverse-default-alt);\n --pill-info-inverse-bg-alt-hover: var(--mode-color-status-info-inverse-hover-alt);\n --pill-info-inverse-bg-hover: var(--mode-color-status-info-inverse-hover);\n --pill-info-inverse-border-default: var(--mode-color-status-info-inverse-default);\n --pill-neutral-bg-default: var(--mode-color-status-neutral-default);\n --pill-neutral-bg-alt-default: var(--mode-color-status-neutral-default-alt);\n --pill-neutral-bg-alt-hover: var(--mode-color-status-neutral-hover-alt);\n --pill-neutral-bg-hover: var(--mode-color-status-neutral-hover);\n --pill-neutral-border-default: var(--mode-color-status-neutral-default);\n --pill-neutral-inverse-bg-default: var(--mode-color-status-neutral-inverse-default);\n --pill-neutral-inverse-bg-alt-default: var(--mode-color-status-neutral-inverse-default-alt);\n --pill-neutral-inverse-bg-alt-hover: var(--mode-color-status-neutral-inverse-hover-alt);\n --pill-neutral-inverse-bg-hover: var(--mode-color-status-neutral-inverse-hover);\n --pill-neutral-inverse-border-default: var(--mode-color-status-neutral-inverse-default);\n --pill-readonly-bg-default: var(--mode-color-status-inactive-default);\n --pill-readonly-border-default: var(--mode-color-status-inactive-default);\n --pill-readonly-label: var(--mode-color-generic-txt-soft);\n --pill-positive-bg-default: var(--mode-color-status-positive-default);\n --pill-positive-bg-alt-default: var(--mode-color-status-positive-default-alt);\n --pill-positive-bg-alt-hover: var(--mode-color-status-positive-hover-alt);\n --pill-positive-bg-hover: var(--mode-color-status-positive-hover);\n --pill-positive-border-default: var(--mode-color-status-positive-default);\n --pill-positive-inverse-bg-default: var(--mode-color-status-positive-inverse-default);\n --pill-positive-inverse-bg-alt-default: var(--mode-color-status-positive-inverse-default-alt);\n --pill-positive-inverse-bg-alt-hover: var(--mode-color-status-positive-inverse-hover-alt);\n --pill-positive-inverse-bg-hover: var(--mode-color-status-positive-inverse-hover);\n --pill-positive-inverse-border-default: var(--mode-color-status-positive-inverse-default);\n --pill-warn-bg-default: var(--mode-color-status-warning-default);\n --pill-warn-bg-alt-default: var(--mode-color-status-warning-default-alt);\n --pill-warn-bg-alt-hover: var(--mode-color-status-warning-hover-alt);\n --pill-warn-bg-hover: var(--mode-color-status-warning-hover);\n --pill-warn-border-default: var(--mode-color-status-warning-default);\n --pill-warn-inverse-bg-default: var(--mode-color-status-warning-inverse-default);\n --pill-warn-inverse-bg-alt-default: var(--mode-color-status-warning-inverse-default-alt);\n --pill-warn-inverse-bg-alt-hover: var(--mode-color-status-warning-inverse-hover-alt);\n --pill-warn-inverse-bg-hover: var(--mode-color-status-warning-inverse-hover);\n --pill-warn-inverse-border-default: var(--mode-color-status-warning-inverse-default);\n --pill-blue-bg-default: var(--mode-color-status-info-default);\n --pill-blue-bg-alt-default: var(--mode-color-status-info-default-alt);\n --pill-blue-bg-alt-hover: var(--mode-color-status-info-hover-alt);\n --pill-blue-bg-hover: var(--mode-color-status-info-hover);\n --pill-blue-border-default: var(--mode-color-status-info-default);\n --pill-blue-inverse-bg-default: var(--mode-color-status-info-inverse-default);\n --pill-blue-inverse-bg-alt-default: var(--mode-color-status-info-inverse-default-alt);\n --pill-blue-inverse-bg-alt-hover: var(--mode-color-status-info-inverse-hover-alt);\n --pill-blue-inverse-bg-hover: var(--mode-color-status-info-inverse-hover);\n --pill-blue-inverse-border-default: var(--mode-color-status-info-inverse-default);\n --pill-green-bg-default: var(--mode-color-status-positive-default);\n --pill-green-bg-alt-default: var(--mode-color-status-positive-default-alt);\n --pill-green-bg-alt-hover: var(--mode-color-status-positive-hover-alt);\n --pill-green-bg-hover: var(--mode-color-status-positive-hover);\n --pill-green-border-default: var(--mode-color-status-positive-default);\n --pill-green-inverse-bg-default: var(--mode-color-status-positive-inverse-default);\n --pill-green-inverse-bg-alt-default: var(--mode-color-status-positive-inverse-default-alt);\n --pill-green-inverse-bg-alt-hover: var(--mode-color-status-positive-inverse-hover-alt);\n --pill-green-inverse-bg-hover: var(--mode-color-status-positive-inverse-hover);\n --pill-green-inverse-border-default: var(--mode-color-status-positive-inverse-default);\n --pill-gray-bg-default: var(--mode-color-status-neutral-default);\n --pill-gray-bg-alt-default: var(--mode-color-status-neutral-default-alt);\n --pill-gray-bg-alt-hover: var(--mode-color-status-neutral-hover-alt);\n --pill-gray-bg-hover: var(--mode-color-status-neutral-hover);\n --pill-gray-border-default: var(--mode-color-status-neutral-default);\n --pill-gray-inverse-bg-default: var(--mode-color-status-neutral-inverse-default);\n --pill-gray-inverse-bg-alt-default: var(--mode-color-status-neutral-inverse-default-alt);\n --pill-gray-inverse-bg-alt-hover: var(--mode-color-status-neutral-inverse-hover-alt);\n --pill-gray-inverse-bg-hover: var(--mode-color-status-neutral-inverse-hover);\n --pill-gray-inverse-border-default: var(--mode-color-status-neutral-inverse-default);\n --pill-lime-bg-default: var(--mode-color-status-custom-lime-default);\n --pill-lime-bg-alt-default: var(--mode-color-status-custom-lime-default-alt);\n --pill-lime-bg-alt-hover: var(--mode-color-status-custom-lime-hover-alt);\n --pill-lime-bg-hover: var(--mode-color-status-custom-lime-hover);\n --pill-lime-border-default: var(--mode-color-status-custom-lime-default);\n --pill-orange-bg-default: var(--mode-color-status-warning-default);\n --pill-orange-bg-alt-default: var(--mode-color-status-warning-default-alt);\n --pill-orange-bg-alt-hover: var(--mode-color-status-warning-hover-alt);\n --pill-orange-bg-hover: var(--mode-color-status-warning-hover);\n --pill-orange-border-default: var(--mode-color-status-warning-default);\n --pill-orange-inverse-bg-default: var(--mode-color-status-warning-inverse-default);\n --pill-orange-inverse-bg-alt-default: var(--mode-color-status-warning-inverse-default-alt);\n --pill-orange-inverse-bg-alt-hover: var(--mode-color-status-warning-inverse-hover-alt);\n --pill-orange-inverse-bg-hover: var(--mode-color-status-warning-inverse-hover);\n --pill-orange-inverse-border-default: var(--mode-color-status-warning-inverse-default);\n --pill-pink-bg-default: var(--mode-color-status-custom-pink-default);\n --pill-pink-bg-alt-default: var(--mode-color-status-custom-pink-default-alt);\n --pill-pink-bg-alt-hover: var(--mode-color-status-custom-pink-hover-alt);\n --pill-pink-bg-hover: var(--mode-color-status-custom-pink-hover);\n --pill-pink-border-default: var(--mode-color-status-custom-pink-default);\n --pill-purple-bg-default: var(--mode-color-status-priority-default);\n --pill-purple-bg-alt-default: var(--mode-color-status-priority-default-alt);\n --pill-purple-bg-alt-hover: var(--mode-color-status-priority-hover-alt);\n --pill-purple-bg-hover: var(--mode-color-status-priority-hover);\n --pill-purple-border-default: var(--mode-color-status-priority-default);\n --pill-purple-inverse-bg-default: var(--mode-color-status-priority-default);\n --pill-purple-inverse-bg-alt-default: var(--mode-color-status-priority-inverse-default-alt);\n --pill-purple-inverse-bg-alt-hover: var(--mode-color-status-priority-inverse-hover-alt);\n --pill-purple-inverse-bg-hover: var(--mode-color-status-priority-hover);\n --pill-purple-inverse-border-default: var(--mode-color-status-priority-default);\n --pill-red-bg-default: var(--mode-color-status-negative-default);\n --pill-red-bg-alt-default: var(--mode-color-status-negative-default-alt);\n --pill-red-bg-alt-hover: var(--mode-color-status-negative-hover-alt);\n --pill-red-bg-hover: var(--mode-color-status-negative-hover);\n --pill-red-border-default: var(--mode-color-status-negative-default);\n --pill-red-inverse-bg-default: var(--mode-color-status-negative-inverse-default);\n --pill-red-inverse-bg-alt-default: var(--mode-color-status-negative-inverse-default-alt);\n --pill-red-inverse-bg-alt-hover: var(--mode-color-status-negative-inverse-hover-alt);\n --pill-red-inverse-bg-hover: var(--mode-color-status-negative-inverse-hover);\n --pill-red-inverse-border-default: var(--mode-color-status-negative-inverse-default);\n --pill-slate-bg-default: var(--mode-color-status-custom-slate-default);\n --pill-slate-bg-alt-default: var(--mode-color-status-custom-slate-default-alt);\n --pill-slate-bg-alt-hover: var(--mode-color-status-custom-slate-hover-alt);\n --pill-slate-bg-hover: var(--mode-color-status-custom-slate-hover);\n --pill-slate-border-default: var(--mode-color-status-custom-slate-default);\n --pill-teal-bg-default: var(--mode-color-status-custom-teal-default);\n --pill-teal-bg-alt-default: var(--mode-color-status-custom-teal-default-alt);\n --pill-teal-bg-alt-hover: var(--mode-color-status-custom-teal-hover-alt);\n --pill-teal-bg-hover: var(--mode-color-status-custom-teal-hover);\n --pill-teal-border-default: var(--mode-color-status-custom-teal-default);\n --tab-bg-active: var(--mode-color-action-grayscale-with-active);\n --tab-bg-default: var(--mode-color-none);\n --tab-bg-hover: var(--mode-color-action-grayscale-hover-alt);\n --tab-border-active-alt: var(--mode-color-generic-fg-moderate);\n --tab-border-active: var(--mode-color-action-grayscale-active);\n --tab-border-default: var(--mode-color-generic-fg-moderate);\n --tab-border-hover: var(--mode-color-generic-fg-firm);\n --tab-icon-default: var(--mode-color-action-grayscale-default-alt);\n --tab-icon-hover: var(--mode-color-action-grayscale-with-hover);\n --tab-label-active: var(--mode-color-action-grayscale-active);\n --tab-icon-active: var(--mode-color-action-grayscale-active);\n --tab-label-default: var(--mode-color-action-grayscale-default);\n --tab-label-hover: var(--mode-color-action-grayscale-with-hover);\n --tab-nav-bg-default: var(--mode-color-generic-bg-nought);\n --tab-validation-border-warning: var(--mode-color-status-warning-default);\n --tab-validation-border-error: var(--mode-color-status-negative-default);\n --tab-validation-icon-error: var(--mode-color-status-negative-default);\n --tab-validation-icon-warning: var(--mode-color-status-warning-default);\n --tab-validation-label-error: var(--mode-color-status-negative-default);\n --tab-validation-label-warning: var(--mode-color-status-warning-txt);\n --table-header-subtle-bg-alt: var(--mode-color-generic-bg-faint);\n --table-header-subtle-bg-default: var(--mode-color-none);\n --table-header-subtle-border-default: var(--mode-color-generic-fg-soft);\n --table-header-subtle-label-default: var(--mode-color-generic-txt-severe);\n --table-header-harsh-bg-alt: var(--mode-color-generic-surface-severe);\n --table-header-harsh-bg-default: var(--mode-color-generic-surface-harsh);\n --table-header-harsh-border-default: var(--mode-color-generic-fg-soft);\n --table-header-harsh-label-default: var(--mode-color-generic-txt-inverse-severe);\n --table-row-bg-default: var(--mode-color-generic-bg-nought);\n --table-row-bg-alt: var(--mode-color-generic-bg-delicate);\n --table-row-bg-alt2: var(--mode-color-generic-bg-faint);\n --table-row-bg-alt3: var(--mode-color-generic-bg-soft);\n --table-row-bg-selected: var(--mode-color-generic-bg-soft);\n --table-row-border-default: var(--mode-color-generic-fg-soft);\n --table-row-label-default: var(--mode-color-generic-txt-severe);\n --table-row-label-selected: var(--mode-color-generic-txt-extreme);\n --table-footer-bg-default: var(--mode-color-generic-bg-soft);\n --table-footer-border-default: var(--mode-color-generic-fg-soft);\n --table-footer-label-default: var(--mode-color-generic-txt-severe);\n";export{e as default};
1
+ var o="\n --global-borderwidth-none: 0;\n --global-borderwidth-xs: 1px;\n --global-borderwidth-s: 2px;\n --global-borderwidth-m: 3px;\n --global-borderwidth-l: 4px;\n --global-borderwidth-xl: 6px;\n --global-borderwidth-xxl: 8px;\n --global-breakpoint-xs: 320px;\n --global-breakpoint-s: 600px;\n --global-breakpoint-m: 960px;\n --global-breakpoint-l: 1260px;\n --global-breakpoint-xl: 1600px;\n --global-breakpoint-xxl: 1920px;\n --global-font-fluid-heading-s: 500 clamp(1.1646rem, 1.1207rem + 0.2195vw, 1.2964rem)/1.25 Sage UI;\n --global-font-fluid-heading-m: 700 clamp(1.2811rem, 1.2155rem + 0.3279vw, 1.4778rem)/1.25 Sage UI;\n --global-font-fluid-heading-l: 700 clamp(1.5869rem, 1.417rem + 0.8494vw, 2.4363rem)/1.25 Sage UI;\n --global-font-fluid-subheading-m: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;\n --global-font-fluid-subheading-l: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.25 Sage UI;\n --global-font-fluid-section-heading-s: 700 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.25 Sage UI;\n --global-font-fluid-section-heading-m: 700 clamp(1.1646rem, 1.1207rem + 0.2195vw, 1.2964rem)/1.25 Sage UI;\n --global-font-fluid-body-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-body-regular-m: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-body-regular-l: 400 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;\n --global-font-fluid-body-medium-s: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-body-medium-m: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-body-medium-l: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;\n --global-font-fluid-comp-medium-xs: 500 clamp(0.7675rem, 0.8048rem + -0.0465vw, 0.7955rem)/1.5 Sage UI;\n --global-font-fluid-comp-medium-s: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-medium-m: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-medium-l: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-comp-regular-xs: 400 clamp(0.7675rem, 0.8048rem + -0.0465vw, 0.7955rem)/1.5 Sage UI;\n --global-font-fluid-comp-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-regular-m: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-regular-l: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-comp-icon-s: 20px sage-icons;\n --global-font-fluid-comp-icon-m: 20px sage-icons;\n --global-font-fluid-comp-icon-l: 20px sage-icons;\n --global-font-fluid-comp-lined-regular-s: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-lined-regular-m: 400 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-lined-regular-l: 400 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-comp-lined-medium-s: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-lined-medium-m: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-lined-medium-l: 500 clamp(0.9625rem, 0.9508rem + 0.0583vw, 0.9975rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-xs: 500 clamp(0.6733rem, 0.7398rem + -0.0831vw, 0.7231rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-s: 500 clamp(0.875rem, 0.875rem + 0vw, 0.875rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-m: 500 clamp(1.0588rem, 1.0326rem + 0.1307vw, 1.1372rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-ml: 500 clamp(1.2811rem, 1.2155rem + 0.3279vw, 1.4778rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-l: 500 clamp(1.5869rem, 1.417rem + 0.8494vw, 2.4363rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-xl: 500 clamp(1.8756rem, 1.6688rem + 1.034vw, 2.496rem)/1.5 Sage UI;\n --global-font-fluid-comp-placeholder-xxl: 500 clamp(2.2695rem, 1.9448rem + 1.6238vw, 3.2438rem)/1.5 Sage UI;\n --global-font-static-heading-s: 500 21px/1.25 Sage UI;\n --global-font-static-heading-m: 700 24px/1.25 Sage UI;\n --global-font-static-heading-l: 700 30px/1.25 Sage UI;\n --global-font-static-subheading-m: 500 16px/1.25 Sage UI;\n --global-font-static-subheading-l: 500 18px/1.25 Sage UI;\n --global-font-static-section-heading-s: 700 16px/1.25 Sage UI;\n --global-font-static-section-heading-m: 700 21px/1.25 Sage UI;\n --global-font-static-body-regular-s: 400 14px/1.5 Sage UI;\n --global-font-static-body-regular-m: 400 14px/1.5 Sage UI;\n --global-font-static-body-regular-l: 400 16px/1.5 Sage UI;\n --global-font-static-body-medium-s: 500 14px/1.5 Sage UI;\n --global-font-static-body-medium-m: 500 14px/1.5 Sage UI;\n --global-font-static-body-medium-l: 500 16px/1.5 Sage UI;\n --global-font-static-comp-medium-xs: 500 13px/1.5 Sage UI;\n --global-font-static-comp-medium-s: 500 14px/1.5 Sage UI;\n --global-font-static-comp-medium-m: 500 14px/1.5 Sage UI;\n --global-font-static-comp-medium-l: 500 16px/1.5 Sage UI;\n --global-font-static-comp-regular-xs: 400 13px/1.5 Sage UI;\n --global-font-static-comp-regular-s: 400 14px/1.5 Sage UI;\n --global-font-static-comp-regular-m: 400 14px/1.5 Sage UI;\n --global-font-static-comp-regular-l: 400 16px/1.5 Sage UI;\n --global-font-static-comp-icon-s: 20px sage-icons;\n --global-font-static-comp-icon-m: 20px sage-icons;\n --global-font-static-comp-icon-l: 20px sage-icons;\n --global-font-static-comp-lined-regular-s: 400 14px/1.5 Sage UI;\n --global-font-static-comp-lined-regular-m: 400 14px/1.5 Sage UI;\n --global-font-static-comp-lined-regular-l: 400 16px/1.5 Sage UI;\n --global-font-static-comp-lined-medium-s: 500 14px/1.5 Sage UI;\n --global-font-static-comp-lined-medium-m: 500 14px/1.5 Sage UI;\n --global-font-static-comp-lined-medium-l: 500 16px/1.5 Sage UI;\n --global-font-static-comp-placeholder-xs: 500 12px/1.5 Sage UI;\n --global-font-static-comp-placeholder-s: 500 14px/1.5 Sage UI;\n --global-font-static-comp-placeholder-m: 500 18px/1.5 Sage UI;\n --global-font-static-comp-placeholder-ml: 500 24px/1.5 Sage UI;\n --global-font-static-comp-placeholder-l: 500 30px/1.5 Sage UI;\n --global-font-static-comp-placeholder-xl: 500 40px/1.5 Sage UI;\n --global-font-static-comp-placeholder-xxl: 500 52px/1.5 Sage UI;\n --global-modifier-button-active: 0.30;\n --global-modifier-button-active-alt: 0.15;\n --global-modifier-button-hover: 0.15;\n --global-modifier-button-hover-alt: 0.10;\n --global-modifier-input-disabled-fg: 0.3;\n --global-modifier-input-disabled-bg: 0.05;\n --global-radius-none: 0;\n --global-radius-container-3-xs: 1px;\n --global-radius-container-2-xs: 2px;\n --global-radius-container-xs: 4px;\n --global-radius-container-s: 6px;\n --global-radius-container-m: 8px;\n --global-radius-container-l: 16px;\n --global-radius-container-xl: 24px;\n --global-radius-container-2-xl: 32px;\n --global-radius-container-3-xl: 40px;\n --global-radius-container-4-xl: 80px;\n --global-radius-container-circle: 999px;\n --global-radius-action-2-xs: 1px;\n --global-radius-action-xs: 2px;\n --global-radius-action-s: 4px;\n --global-radius-action-m: 8px;\n --global-radius-action-l: 16px;\n --global-radius-action-xl: 20px;\n --global-radius-action-2-xl: 24px;\n --global-radius-action-circle: 999px;\n --global-depth-none: 0 0 0 0 rgba(0,0,0,0);\n --global-depth-lvl1: 0 1px 2px 0 #0000001A, 2px 2px 10px 0 #00000033;\n --global-depth-lvl2: 0 2px 3px 0 #0000001A, 6px 6px 30px 0 #00000026;\n --global-depth-lvl3: 0 3px 4px 0 #0000001A, 10px 10px 60px 0 #0000001A;\n --global-depth-sticky-b: 0 -1px 2px 0 #0000001A, 2px -2px 10px 0 #00000033;\n --global-depth-sticky-l: -2px 0 2px 0 #0000001A, -5px 0 5px 0 #0000001A;\n --global-depth-sticky-r: 2px 0 2px 0 #0000001A, 5px 0 5px 0 #0000001A;\n --global-size-none: 0px;\n --global-size-6-xs: 2px;\n --global-size-5-xs: 4px;\n --global-size-4-xs: 8px;\n --global-size-3-xs: 16px;\n --global-size-2-xs: 20px;\n --global-size-xs: 24px;\n --global-size-s: 32px;\n --global-size-m: 40px;\n --global-size-l: 48px;\n --global-size-xl: 56px;\n --global-size-2-xl: 64px;\n --global-size-3-xl: 72px;\n --global-size-4-xl: 80px;\n --global-space-none: 0px;\n --global-space-layout-3-xs: 8px;\n --global-space-layout-2-xs: 16px;\n --global-space-layout-xs: 24px;\n --global-space-layout-s: 32px;\n --global-space-layout-m: 40px;\n --global-space-layout-l: 48px;\n --global-space-layout-xl: 56px;\n --global-space-layout-2-xl: 64px;\n --global-space-layout-3-xl: 72px;\n --global-space-layout-4-xl: 80px;\n --global-space-comp-2-xs: 2px;\n --global-space-comp-xs: 4px;\n --global-space-comp-s: 8px;\n --global-space-comp-m: 12px;\n --global-space-comp-l: 16px;\n --global-space-comp-xl: 24px;\n --global-space-comp-2-xl: 32px;\n --mode-color-none: #fff0;\n --mode-color-ai-stop-1: #13a038;\n --mode-color-ai-stop-2: #149197;\n --mode-color-ai-stop-3: #a87cfb;\n --mode-color-ai-alt-stop-1: #00d639;\n --mode-color-ai-alt-stop-2: #00d6de;\n --mode-color-ai-alt-stop-3: #9d60ff;\n --mode-color-brand-default: #000000;\n --mode-color-brand-default-alt: #000000;\n --mode-color-brand-with-default-alt: #FFFFFF;\n --mode-color-brand-inverse-default: #00d639;\n --mode-color-brand-inverse-default-alt: #FFFFFF;\n --mode-color-brand-inverse-with-default-alt: #000000;\n --mode-color-brand-copilot-default: #000000;\n --mode-color-brand-copilot-monochrome: #000000;\n --mode-color-brand-copilot-with-default: #00d639;\n --mode-color-brand-copilot-inverse-default: #FFFFFF;\n --mode-color-brand-copilot-inverse-monochrome: #FFFFFF;\n --mode-color-brand-copilot-inverse-with-default: #00d639;\n --mode-color-colorcode-blue-intense: #00528f;\n --mode-color-colorcode-blue-harsh: #0071c3;\n --mode-color-colorcode-blue-soft: #008ef4;\n --mode-color-colorcode-blue-faint: #e4eeff;\n --mode-color-colorcode-teal-intense: #005A59;\n --mode-color-colorcode-teal-harsh: #007C7B;\n --mode-color-colorcode-teal-soft: #009B99;\n --mode-color-colorcode-teal-faint: #C8F5F5;\n --mode-color-colorcode-green-intense: #005e14;\n --mode-color-colorcode-green-harsh: #00811F;\n --mode-color-colorcode-green-soft: #1BA12B;\n --mode-color-colorcode-green-faint: #D1F6D6;\n --mode-color-colorcode-lime-intense: #475600;\n --mode-color-colorcode-lime-harsh: #627600;\n --mode-color-colorcode-lime-soft: #7d9428;\n --mode-color-colorcode-lime-faint: #e8f1d4;\n --mode-color-colorcode-orange-intense: #952a00;\n --mode-color-colorcode-orange-harsh: #d64309;\n --mode-color-colorcode-orange-soft: #e5631c;\n --mode-color-colorcode-orange-faint: #ffeaca;\n --mode-color-colorcode-red-intense: #a30037;\n --mode-color-colorcode-red-harsh: #db004e;\n --mode-color-colorcode-red-soft: #ff3e6a;\n --mode-color-colorcode-red-faint: #ffe8ea;\n --mode-color-colorcode-pink-intense: #921a6e;\n --mode-color-colorcode-pink-harsh: #c72699;\n --mode-color-colorcode-pink-soft: #E84DB5;\n --mode-color-colorcode-pink-faint: #fee8f5;\n --mode-color-colorcode-purple-intense: #6a32a6;\n --mode-color-colorcode-purple-harsh: #8f4bd7;\n --mode-color-colorcode-purple-soft: #a375dd;\n --mode-color-colorcode-purple-faint: #F3EBFE;\n --mode-color-colorcode-slate-intense: #304658;\n --mode-color-colorcode-slate-harsh: #5e6f7d;\n --mode-color-colorcode-slate-soft: #8c98a2;\n --mode-color-colorcode-slate-faint: #e4eff5;\n --mode-color-colorcode-gray-intense: #505050;\n --mode-color-colorcode-gray-harsh: #6f6f6f;\n --mode-color-colorcode-gray-soft: #8b8b8b;\n --mode-color-colorcode-gray-faint: #eeeeee;\n --mode-color-colorcode-yellow-intense: #885e00;\n --mode-color-colorcode-yellow-harsh: #9f7000;\n --mode-color-colorcode-yellow-soft: #ffca35;\n --mode-color-colorcode-yellow-faint: #ffedb8;\n --mode-color-generic-bg-nought: #FFFFFF;\n --mode-color-generic-bg-faint: #f4f5f6;\n --mode-color-generic-bg-delicate: #e8eaec;\n --mode-color-generic-bg-soft: #dde0e3;\n --mode-color-generic-bg-inverse-nought: #000000;\n --mode-color-generic-bg-inverse-faint: #ffffff0d;\n --mode-color-generic-bg-inverse-delicate: #ffffff1a;\n --mode-color-generic-bg-inverse-soft: #ffffff26;\n --mode-color-generic-txt-extreme: #000000;\n --mode-color-generic-txt-severe: #000000f2;\n --mode-color-generic-txt-moderate: #000000a6;\n --mode-color-generic-txt-soft: #0000008c;\n --mode-color-generic-txt-delicate: #0000006b;\n --mode-color-generic-txt-inverse-extreme: #FFFFFF;\n --mode-color-generic-txt-inverse-severe: #fffffff2;\n --mode-color-generic-txt-inverse-moderate: #ffffffab;\n --mode-color-generic-txt-inverse-soft: #ffffff8c;\n --mode-color-generic-txt-inverse-delicate: #ffffff6b;\n --mode-color-generic-fg-nought: #FFFFFF;\n --mode-color-generic-fg-soft: #a3adb5;\n --mode-color-generic-fg-moderate: #8c98a2;\n --mode-color-generic-fg-firm: #75838f;\n --mode-color-generic-fg-inverse-nought: #000000;\n --mode-color-generic-fg-inverse-soft: #505050;\n --mode-color-generic-fg-inverse-moderate: #616161;\n --mode-color-generic-fg-inverse-firm: #6f6f6f;\n --mode-color-generic-surface-nought: #FFFFFF;\n --mode-color-generic-surface-faint: #f4f5f6;\n --mode-color-generic-surface-harsh: #475a6a;\n --mode-color-generic-surface-severe: #304658;\n --mode-color-action-ai-grad-active: linear-gradient(90deg, #13a03826 0%, #14919726 40%, #a87cfb26 90%);\n --mode-color-action-ai-grad-hover: linear-gradient(90deg, #13a03814 0%, #14919714 40%, #a87cfb14 90%);\n --mode-color-action-ai-grad-default: linear-gradient(90deg, #13a038 0%, #149197 40%, #a87cfb 90%);\n --mode-color-action-ai-active-stop-1: #13a03826;\n --mode-color-action-ai-active-stop-2: #14919726;\n --mode-color-action-ai-active-stop-3: #a87cfb26;\n --mode-color-action-ai-hover-stop-1: #13a03814;\n --mode-color-action-ai-hover-stop-2: #14919714;\n --mode-color-action-ai-hover-stop-3: #a87cfb14;\n --mode-color-action-danger-active: #a30037;\n --mode-color-action-danger-default: #db004e;\n --mode-color-action-danger-default-alt: #c40044;\n --mode-color-action-danger-hover: #c40044;\n --mode-color-action-danger-hover-alt: #db004e26;\n --mode-color-action-danger-hover-alt2: #a30037;\n --mode-color-action-danger-with-active: #FFFFFF;\n --mode-color-action-danger-with-default: #FFFFFF;\n --mode-color-action-danger-inverse-active: #ff728d;\n --mode-color-action-danger-inverse-default: #f50059;\n --mode-color-action-danger-inverse-default-alt: #ff3e6a;\n --mode-color-action-danger-inverse-hover: #ff3e6a;\n --mode-color-action-danger-inverse-hover-alt: #f5005926;\n --mode-color-action-danger-inverse-hover-alt2: #ff728d;\n --mode-color-action-danger-inverse-with-active: #000000;\n --mode-color-action-danger-inverse-with-default: #000000;\n --mode-color-action-data-entry-default: #FFFFFF;\n --mode-color-action-data-entry-with-active: #000000;\n --mode-color-action-data-entry-with-active-alt: #FFFFFF;\n --mode-color-action-data-entry-with-hover: #000000;\n --mode-color-action-data-entry-hover-alt: #f4f5f6;\n --mode-color-action-data-entry-with-default: #75838f;\n --mode-color-action-data-entry-default-alt: #e8eaec;\n --mode-color-action-data-entry-txt: #000000f2;\n --mode-color-action-data-entry-txt-alt: #0000008c;\n --mode-color-action-data-entry-inverse-default: #000000;\n --mode-color-action-data-entry-inverse-with-default: #a3adb5;\n --mode-color-action-data-entry-inverse-txt: #fffffff2;\n --mode-color-action-data-entry-inverse-txt-alt: #ffffff8c;\n --mode-color-action-focus-default: #000000;\n --mode-color-action-focus-txt: #000000;\n --mode-color-action-focus-with-default: #FFB500;\n --mode-color-action-focus-with-default-alt: #ffd274;\n --mode-color-action-focus-inverse-default: #FFB500;\n --mode-color-action-focus-inverse-txt: #FFFFFF;\n --mode-color-action-focus-inverse-with-default: #000000;\n --mode-color-action-focus-inverse-with-default-alt: #885e00;\n --mode-color-action-inactive-default: #0000004d;\n --mode-color-action-inactive-mask: #0006;\n --mode-color-action-inactive-default-alt: #eeeeee;\n --mode-color-action-inactive-txt: #0000006b;\n --mode-color-action-inactive-txt-alt: #FFFFFF;\n --mode-color-action-inactive-icon: #0000006b;\n --mode-color-action-inactive-icon-alt: #0000008c;\n --mode-color-action-inactive-inverse-default: #ffffff4d;\n --mode-color-action-inactive-inverse-txt: #ffffff6b;\n --mode-color-action-inactive-inverse-txt-alt: #000000;\n --mode-color-action-grayscale-active: #000000;\n --mode-color-action-grayscale-active-alt: #00000026;\n --mode-color-action-grayscale-default: #000000e6;\n --mode-color-action-grayscale-default-alt: #000000ab;\n --mode-color-action-grayscale-hover-alt: #0000001a;\n --mode-color-action-grayscale-hover: #00000026;\n --mode-color-action-grayscale-with-active: #FFFFFF;\n --mode-color-action-grayscale-with-active-alt: #000000;\n --mode-color-action-grayscale-with-default: #FFFFFF;\n --mode-color-action-grayscale-with-hover: #000000;\n --mode-color-action-grayscale-inverse-active: #FFFFFF;\n --mode-color-action-grayscale-inverse-active-alt: #ffffff26;\n --mode-color-action-grayscale-inverse-default: #ffffffe6;\n --mode-color-action-grayscale-inverse-default-alt: #ffffffab;\n --mode-color-action-grayscale-inverse-hover-alt: #ffffff1a;\n --mode-color-action-grayscale-inverse-hover: #ffffff26;\n --mode-color-action-grayscale-inverse-with-active: #000000;\n --mode-color-action-grayscale-inverse-with-active-alt: #FFFFFF;\n --mode-color-action-grayscale-inverse-with-default: #000000;\n --mode-color-action-grayscale-inverse-with-hover: #FFFFFF;\n --mode-color-action-nav-active: #005e14;\n --mode-color-action-nav-default: #FFFFFF;\n --mode-color-action-nav-default-alt: #f4f5f6;\n --mode-color-action-nav-child: #FFFFFF;\n --mode-color-action-nav-child-alt: #e8eaec;\n --mode-color-action-nav-hover: #007219;\n --mode-color-action-nav-with-active: #FFFFFF;\n --mode-color-action-nav-with-default: #000000f2;\n --mode-color-action-nav-with-hover: #FFFFFF;\n --mode-color-action-nav-inverse-active: #005e14;\n --mode-color-action-nav-inverse-default: #000000;\n --mode-color-action-nav-inverse-default-alt: #181818;\n --mode-color-action-nav-inverse-child: #505050;\n --mode-color-action-nav-inverse-child-alt: #616161;\n --mode-color-action-nav-inverse-hover: #007219;\n --mode-color-action-nav-inverse-with-active: #FFFFFF;\n --mode-color-action-nav-inverse-with-default: #fffffff2;\n --mode-color-action-nav-inverse-with-hover: #FFFFFF;\n --mode-color-action-main-active: #005e14;\n --mode-color-action-main-active-alt: #00811f4d;\n --mode-color-action-main-default: #00811f;\n --mode-color-action-main-default-alt: #00811fcc;\n --mode-color-action-main-default-alt2: #007219;\n --mode-color-action-main-default-alt3: #00811f08;\n --mode-color-action-main-hover: #007219;\n --mode-color-action-main-hover-alt: #00811f26;\n --mode-color-action-main-hover-alt2: #005e14;\n --mode-color-action-main-with-active: #FFFFFF;\n --mode-color-action-main-with-default: #FFFFFF;\n --mode-color-action-main-with-hover: #FFFFFF;\n --mode-color-action-main-inverse-active: #8fff98;\n --mode-color-action-main-inverse-active-alt: #00f1424d;\n --mode-color-action-main-inverse-default: #00f142;\n --mode-color-action-main-inverse-default-alt: #00f142cc;\n --mode-color-action-main-inverse-default-alt2: #46fb5e;\n --mode-color-action-main-inverse-default-alt3: #00f14208;\n --mode-color-action-main-inverse-hover: #46fb5e;\n --mode-color-action-main-inverse-hover-alt: #00f14226;\n --mode-color-action-main-inverse-hover-alt2: #8fff98;\n --mode-color-action-main-inverse-with-active: #000000;\n --mode-color-action-main-inverse-with-default: #000000;\n --mode-color-action-main-inverse-with-hover: #000000;\n --mode-color-status-ai-default: #FFFFFF;\n --mode-color-status-ai-default-alt: #000000;\n --mode-color-status-ai-default-horizontal: linear-gradient(90deg, #13a038 0%, #149197 40%, #a87cfb 90%);\n --mode-color-status-ai-default-vertical: linear-gradient(180deg, #13a038 0%, #149197 40%, #a87cfb 90%);\n --mode-color-status-ai-inverse-default-horizontal: linear-gradient(90deg, #00d639 0%, #00d6de 40%, #9d60ff 90%);\n --mode-color-status-ai-inverse-default-vertical: linear-gradient(180deg, #00d639 0%, #00d6de 40%, #9d60ff 90%);\n --mode-color-status-callout-default-alt: #e0ffe2;\n --mode-color-status-callout-hover-alt: #b7ffbd;\n --mode-color-status-skeleton-stop-1: #75838f;\n --mode-color-status-skeleton-stop-2: #d1d6da;\n --mode-color-status-warning-default: #d64309;\n --mode-color-status-warning-default-alt: #fff7eb;\n --mode-color-status-warning-hover: #b33400;\n --mode-color-status-warning-hover-alt: #ffeaca;\n --mode-color-status-warning-txt: #b33400;\n --mode-color-status-warning-inverse-default: #e24300;\n --mode-color-status-warning-inverse-default-alt: #1d0300;\n --mode-color-status-warning-inverse-hover: #e5631c;\n --mode-color-status-warning-inverse-hover-alt: #360900;\n --mode-color-status-warning-inverse-txt: #e5631c;\n --mode-color-status-txt-with-default: #FFFFFF;\n --mode-color-status-txt-with-default-alt: #000000f2;\n --mode-color-status-txt-with-hover: #FFFFFF;\n --mode-color-status-txt-with-hover-alt: #000000;\n --mode-color-status-txt-loading: #747474;\n --mode-color-status-txt-inverse-with-default: #000000;\n --mode-color-status-txt-inverse-with-default-alt: #FFFFFF;\n --mode-color-status-txt-inverse-with-hover: #000000;\n --mode-color-status-txt-inverse-with-hover-alt: #FFFFFF;\n --mode-color-status-custom-blue-default: #0071c3;\n --mode-color-status-custom-blue-default-alt: #f5f8ff;\n --mode-color-status-custom-blue-hover: #0063ad;\n --mode-color-status-custom-blue-hover-alt: #e4eeff;\n --mode-color-status-custom-teal-default: #007C7B;\n --mode-color-status-custom-teal-default-alt: #E8FCFC;\n --mode-color-status-custom-teal-hover: #006D6C;\n --mode-color-status-custom-teal-hover-alt: #C8F5F5;\n --mode-color-status-custom-green-default: #00811F;\n --mode-color-status-custom-green-default-alt: #EEFCEF;\n --mode-color-status-custom-green-hover: #007219;\n --mode-color-status-custom-green-hover-alt: #D1F6D6;\n --mode-color-status-custom-lime-default: #627600;\n --mode-color-status-custom-lime-default-alt: #f6f9f0;\n --mode-color-status-custom-lime-hover: #576900;\n --mode-color-status-custom-lime-hover-alt: #e8f1d4;\n --mode-color-status-custom-orange-default: #d64309;\n --mode-color-status-custom-orange-default-alt: #fff7eb;\n --mode-color-status-custom-orange-hover: #b33400;\n --mode-color-status-custom-orange-hover-alt: #ffeaca;\n --mode-color-status-custom-orange-txt: #b33400;\n --mode-color-status-custom-red-default: #db004e;\n --mode-color-status-custom-red-default-alt: #fff5f6;\n --mode-color-status-custom-red-hover: #c40044;\n --mode-color-status-custom-red-hover-alt: #ffe8ea;\n --mode-color-status-custom-pink-default: #c72699;\n --mode-color-status-custom-pink-default-alt: #fff5fa;\n --mode-color-status-custom-pink-hover: #b02086;\n --mode-color-status-custom-pink-hover-alt: #fee8f5;\n --mode-color-status-custom-purple-default: #8f4bd7;\n --mode-color-status-custom-purple-default-alt: #f9f6ff;\n --mode-color-status-custom-purple-hover: #803ec5;\n --mode-color-status-custom-purple-hover-alt: #F3EBFE;\n --mode-color-status-custom-gray-default: #6f6f6f;\n --mode-color-status-custom-gray-default-alt: #f8f8f8;\n --mode-color-status-custom-gray-hover: #616161;\n --mode-color-status-custom-gray-hover-alt: #eeeeee;\n --mode-color-status-custom-slate-default: #536574;\n --mode-color-status-custom-slate-default-alt: #f4f5f6;\n --mode-color-status-custom-slate-hover: #475a6a;\n --mode-color-status-custom-slate-hover-alt: #e8eaec;\n --mode-color-status-priority-default: #8f4bd7;\n --mode-color-status-priority-default-alt: #f9f6ff;\n --mode-color-status-priority-hover: #803ec5;\n --mode-color-status-priority-hover-alt: #F3EBFE;\n --mode-color-status-priority-inverse-default: #9463d7;\n --mode-color-status-priority-inverse-default-alt: #10041f;\n --mode-color-status-priority-inverse-hover: #a375dd;\n --mode-color-status-priority-inverse-hover-alt: #220c3a;\n --mode-color-status-inactive-default: #75838f;\n --mode-color-status-inactive-with-default: #0000008c;\n --mode-color-status-inactive-inverse-default: #6f6f6f;\n --mode-color-status-inactive-inverse-with-default: #ffffff8c;\n --mode-color-status-info-default: #0071c3;\n --mode-color-status-info-default-alt: #f5f8ff;\n --mode-color-status-info-hover: #0063ad;\n --mode-color-status-info-hover-alt: #e4eeff;\n --mode-color-status-info-inverse-default: #007fd9;\n --mode-color-status-info-inverse-default-alt: #000b1c;\n --mode-color-status-info-inverse-hover: #008ef4;\n --mode-color-status-info-inverse-hover-alt: #001932;\n --mode-color-status-negative-default: #db004e;\n --mode-color-status-negative-default-alt: #fff5f6;\n --mode-color-status-negative-hover: #c40044;\n --mode-color-status-negative-hover-alt: #ffe8ea;\n --mode-color-status-negative-inverse-default: #f50059;\n --mode-color-status-negative-inverse-default-alt: #1e0005;\n --mode-color-status-negative-inverse-hover: #ff3e6a;\n --mode-color-status-negative-inverse-hover-alt: #3c000f;\n --mode-color-status-neutral-default: #6f6f6f;\n --mode-color-status-neutral-default-alt: #f8f8f8;\n --mode-color-status-neutral-hover: #616161;\n --mode-color-status-neutral-hover-alt: #eeeeee;\n --mode-color-status-neutral-inverse-default: #7c7c7c;\n --mode-color-status-neutral-inverse-default-alt: #0b0b0b;\n --mode-color-status-neutral-inverse-hover: #8b8b8b;\n --mode-color-status-neutral-inverse-hover-alt: #181818;\n --mode-color-status-positive-default: #00811F;\n --mode-color-status-positive-default-alt: #EEFCEF;\n --mode-color-status-positive-hover: #007219;\n --mode-color-status-positive-hover-alt: #D1F6D6;\n --mode-color-status-positive-inverse-default: #019127;\n --mode-color-status-positive-inverse-default-alt: #001001;\n --mode-color-status-positive-inverse-hover: #007219;\n --mode-color-status-positive-inverse-hover-alt: #001f03;\n --badge-none: var(--mode-color-none);\n --badge-bg-default: var(--mode-color-status-negative-default);\n --badge-border-default: var(--mode-color-generic-bg-nought);\n --badge-bg-alt: var(--mode-color-status-info-default);\n --badge-label-default: var(--mode-color-generic-txt-inverse-extreme);\n --badge-label-alt: var(--mode-color-generic-txt-inverse-extreme);\n --badge-inverse-bg-default: var(--mode-color-status-negative-inverse-default);\n --badge-inverse-border-default: var(--mode-color-generic-bg-inverse-nought);\n --badge-inverse-bg-alt: var(--mode-color-status-info-inverse-default);\n --badge-inverse-label-default: var(--mode-color-generic-txt-extreme);\n --badge-inverse-label-alt: var(--mode-color-generic-txt-extreme);\n --button-none: var(--mode-color-none);\n --button-ai-bg-active: var(--mode-color-action-ai-grad-active);\n --button-ai-bg-hover: var(--mode-color-action-ai-grad-hover);\n --button-ai-border-active: linear-gradient(90deg, var(--mode-color-ai-stop-1) 0%, var(--mode-color-ai-stop-2) 40%, var(--mode-color-ai-stop-3) 90%);\n --button-ai-border-disabled: var(--mode-color-action-inactive-default);\n --button-ai-border-default: linear-gradient(90deg, var(--mode-color-ai-stop-1) 0%, var(--mode-color-ai-stop-2) 40%, var(--mode-color-ai-stop-3) 90%);\n --button-ai-border-hover: linear-gradient(90deg, var(--mode-color-ai-stop-1) 0%, var(--mode-color-ai-stop-2) 40%, var(--mode-color-ai-stop-3) 90%);\n --button-ai-label-active: var(--mode-color-action-grayscale-with-active-alt);\n --button-ai-label-disabled: var(--mode-color-action-inactive-txt);\n --button-ai-label-default: var(--mode-color-action-grayscale-default);\n --button-ai-label-hover: var(--mode-color-action-grayscale-with-hover);\n --button-destructive-primary-bg-disabled: var(--mode-color-action-inactive-default);\n --button-destructive-primary-bg-default: var(--mode-color-action-danger-default);\n --button-destructive-primary-bg-hover: var(--mode-color-action-danger-hover);\n --button-destructive-primary-label-disabled: var(--mode-color-action-inactive-txt-alt);\n --button-destructive-primary-label-default: var(--mode-color-action-danger-with-default);\n --button-destructive-primary-label-hover: var(--mode-color-action-danger-with-default);\n --button-destructive-secondary-bg-hover: var(--mode-color-action-danger-hover-alt);\n --button-destructive-secondary-border-disabled: var(--mode-color-action-inactive-default);\n --button-destructive-secondary-border-default: var(--mode-color-action-danger-default);\n --button-destructive-secondary-border-hover: var(--mode-color-action-danger-hover);\n --button-destructive-secondary-label-disabled: var(--mode-color-action-inactive-txt);\n --button-destructive-secondary-label-default: var(--mode-color-action-danger-default);\n --button-destructive-secondary-label-hover: var(--mode-color-action-danger-hover);\n --button-typical-primary-bg-active: var(--mode-color-action-main-active);\n --button-typical-primary-border-default: var(--mode-color-action-main-with-default);\n --button-typical-primary-bg-disabled: var(--mode-color-action-inactive-default);\n --button-typical-primary-bg-default: var(--mode-color-action-main-default);\n --button-typical-primary-bg-hover: var(--mode-color-action-main-hover);\n --button-typical-primary-label-active: var(--mode-color-action-main-with-active);\n --button-typical-primary-label-disabled: var(--mode-color-action-inactive-txt-alt);\n --button-typical-primary-label-default: var(--mode-color-action-main-with-default);\n --button-typical-primary-label-hover: var(--mode-color-action-main-with-default);\n --button-typical-primary-inverse-bg-active: var(--mode-color-action-main-inverse-active);\n --button-typical-primary-inverse-border-default: var(--mode-color-action-main-inverse-with-default);\n --button-typical-primary-inverse-bg-disabled: var(--mode-color-action-inactive-inverse-default);\n --button-typical-primary-inverse-bg-default: var(--mode-color-action-main-inverse-default);\n --button-typical-primary-inverse-bg-hover: var(--mode-color-action-main-inverse-hover);\n --button-typical-primary-inverse-label-active: var(--mode-color-action-main-inverse-with-active);\n --button-typical-primary-inverse-label-disabled: var(--mode-color-action-inactive-inverse-txt-alt);\n --button-typical-primary-inverse-label-default: var(--mode-color-action-main-inverse-with-default);\n --button-typical-primary-inverse-label-hover: var(--mode-color-action-main-inverse-with-default);\n --button-typical-secondary-bg-active: var(--mode-color-action-main-active-alt);\n --button-typical-secondary-bg-default: var(--mode-color-action-main-default-alt3);\n --button-typical-secondary-bg-hover: var(--mode-color-action-main-hover-alt);\n --button-typical-secondary-border-active: var(--mode-color-action-main-active);\n --button-typical-secondary-border-disabled: var(--mode-color-action-inactive-default);\n --button-typical-secondary-border-default: var(--mode-color-action-main-default-alt);\n --button-typical-secondary-border-hover: var(--mode-color-action-main-hover);\n --button-typical-secondary-label-active: var(--mode-color-action-grayscale-with-active-alt);\n --button-typical-secondary-label-disabled: var(--mode-color-action-inactive-txt);\n --button-typical-secondary-label-default: var(--mode-color-action-grayscale-default);\n --button-typical-secondary-label-hover: var(--mode-color-action-grayscale-with-hover);\n --button-typical-secondary-inverse-bg-active: var(--mode-color-action-main-inverse-active-alt);\n --button-typical-secondary-inverse-bg-default: var(--mode-color-action-main-inverse-default-alt3);\n --button-typical-secondary-inverse-bg-hover: var(--mode-color-action-main-inverse-hover-alt);\n --button-typical-secondary-inverse-border-active: var(--mode-color-action-main-inverse-active);\n --button-typical-secondary-inverse-border-disabled: var(--mode-color-action-inactive-inverse-default);\n --button-typical-secondary-inverse-border-default: var(--mode-color-action-main-inverse-default-alt);\n --button-typical-secondary-inverse-border-hover: var(--mode-color-action-main-inverse-hover);\n --button-typical-secondary-inverse-label-active: var(--mode-color-action-grayscale-inverse-with-active-alt);\n --button-typical-secondary-inverse-label-disabled: var(--mode-color-action-inactive-inverse-txt);\n --button-typical-secondary-inverse-label-default: var(--mode-color-action-grayscale-inverse-default);\n --button-typical-secondary-inverse-label-hover: var(--mode-color-action-grayscale-inverse-with-hover);\n --button-typical-tertiary-bg-active: var(--mode-color-action-main-active-alt);\n --button-typical-tertiary-bg-default: var(--button-none);\n --button-typical-tertiary-bg-hover: var(--mode-color-action-main-hover-alt);\n --button-typical-tertiary-border-active: var(--mode-color-action-main-active);\n --button-typical-tertiary-border-disabled: var(--mode-color-action-inactive-default);\n --button-typical-tertiary-border-default: var(--mode-color-action-main-default-alt);\n --button-typical-tertiary-border-hover: var(--mode-color-action-main-hover);\n --button-typical-tertiary-label-active: var(--mode-color-action-grayscale-with-active-alt);\n --button-typical-tertiary-label-disabled: var(--mode-color-action-inactive-txt);\n --button-typical-tertiary-label-default: var(--mode-color-action-grayscale-default);\n --button-typical-tertiary-label-hover: var(--mode-color-action-grayscale-with-hover);\n --button-typical-tertiary-inverse-bg-active: var(--mode-color-action-main-inverse-active-alt);\n --button-typical-tertiary-inverse-bg-default: var(--button-none);\n --button-typical-tertiary-inverse-bg-hover: var(--mode-color-action-main-inverse-hover-alt);\n --button-typical-tertiary-inverse-border-active: var(--mode-color-action-main-inverse-active);\n --button-typical-tertiary-inverse-border-disabled: var(--mode-color-action-inactive-inverse-default);\n --button-typical-tertiary-inverse-border-default: var(--mode-color-action-main-inverse-default-alt);\n --button-typical-tertiary-inverse-border-hover: var(--mode-color-action-main-inverse-hover);\n --button-typical-tertiary-inverse-label-active: var(--mode-color-action-grayscale-inverse-with-active-alt);\n --button-typical-tertiary-inverse-label-disabled: var(--mode-color-action-inactive-inverse-txt);\n --button-typical-tertiary-inverse-label-default: var(--mode-color-action-grayscale-inverse-default);\n --button-typical-tertiary-inverse-label-hover: var(--mode-color-action-grayscale-inverse-with-hover);\n --button-typical-subtle-bg-active: var(--mode-color-action-grayscale-active-alt);\n --button-typical-subtle-bg-hover: var(--mode-color-action-grayscale-hover-alt);\n --button-typical-subtle-label-active: var(--mode-color-action-grayscale-with-active-alt);\n --button-typical-subtle-label-disabled: var(--mode-color-action-inactive-txt);\n --button-typical-subtle-label-default: var(--mode-color-action-grayscale-default);\n --button-typical-subtle-label-hover: var(--mode-color-action-grayscale-with-hover);\n --button-typical-subtle-inverse-bg-active: var(--mode-color-action-grayscale-inverse-active-alt);\n --button-typical-subtle-inverse-bg-hover: var(--mode-color-action-grayscale-inverse-hover-alt);\n --button-typical-subtle-inverse-label-active: var(--mode-color-action-grayscale-inverse-with-active-alt);\n --button-typical-subtle-inverse-label-disabled: var(--mode-color-action-inactive-inverse-txt);\n --button-typical-subtle-inverse-label-default: var(--mode-color-action-grayscale-inverse-default);\n --button-typical-subtle-inverse-label-hover: var(--mode-color-action-grayscale-inverse-with-hover);\n --button-typical-toggle-bg-active-disabled: var(--mode-color-action-inactive-default);\n --button-typical-toggle-label-active-disabled: var(--mode-color-action-inactive-txt-alt);\n --button-typical-toggle-bg-active: var(--mode-color-action-grayscale-active);\n --button-typical-toggle-bg-hover: var(--mode-color-action-grayscale-hover-alt);\n --button-typical-toggle-border-default: var(--mode-color-action-grayscale-default);\n --button-typical-toggle-border-disabled: var(--mode-color-action-inactive-default);\n --button-typical-toggle-label-active: var(--mode-color-action-grayscale-with-active);\n --button-typical-toggle-label-disabled: var(--mode-color-action-inactive-txt);\n --button-typical-toggle-label-default: var(--mode-color-action-grayscale-default-alt);\n --button-typical-toggle-label-hover: var(--mode-color-action-grayscale-with-hover);\n --button-video-bg-blur: var(--mode-color-action-grayscale-hover-alt);\n --button-video-primary-bg-default: var(--mode-color-action-grayscale-with-default);\n --button-video-primary-bg-hover: var(--mode-color-action-grayscale-with-default);\n --button-video-primary-label-default: var(--mode-color-action-grayscale-default);\n --button-video-primary-label-hover: var(--mode-color-action-grayscale-default);\n --button-video-secondary-bg-hover: var(--mode-color-action-grayscale-with-default);\n --button-video-secondary-border-default: var(--mode-color-action-grayscale-with-default);\n --button-video-secondary-border-hover: var(--mode-color-action-grayscale-with-default);\n --button-video-secondary-label-default: var(--mode-color-action-grayscale-with-default);\n --button-video-secondary-label-hover: var(--mode-color-action-grayscale-default);\n --container-action-bg-footer-activated: var(--mode-color-status-positive-default);\n --container-action-bg-footer-active: var(--mode-color-action-grayscale-active);\n --container-action-border-activated: var(--mode-color-status-positive-default);\n --container-action-bg-footer-default: var(--mode-color-generic-bg-nought);\n --container-action-bg-default: var(--mode-color-generic-bg-nought);\n --container-action-bg-disabled: var(--mode-color-action-inactive-default-alt);\n --container-action-bg-hover: var(--mode-color-action-grayscale-hover-alt);\n --container-action-border-active: var(--mode-color-action-grayscale-active);\n --container-action-border-alt: var(--mode-color-generic-fg-moderate);\n --container-action-borderalt-hover: var(--mode-color-action-grayscale-default);\n --container-action-border-inactive: var(--mode-color-generic-fg-firm);\n --container-action-border-default: var(--mode-color-generic-fg-firm);\n --container-action-icon-active: var(--mode-color-action-grayscale-active);\n --container-action-icon-default: var(--mode-color-action-grayscale-default);\n --container-action-icon-alt-default: var(--mode-color-action-grayscale-default-alt);\n --container-action-icon-hover: var(--mode-color-action-grayscale-default);\n --container-action-label-footer-active: var(--mode-color-action-grayscale-with-active);\n --container-action-label-footer-activated: var(--mode-color-action-grayscale-with-active);\n --container-action-txt-active: var(--mode-color-action-grayscale-active);\n --container-action-txt-disabled: var(--mode-color-action-inactive-txt);\n --container-action-txt-default: var(--mode-color-generic-txt-severe);\n --container-action-txt-alt-default: var(--mode-color-generic-txt-moderate);\n --container-action-txt-hover: var(--mode-color-action-grayscale-default);\n --container-action-detailedicon-bg: var(--mode-color-status-custom-green-default);\n --container-action-target-bg-default: var(--mode-color-status-info-default);\n --container-scrollbar-bg-default: var(--mode-color-generic-bg-faint);\n --container-scrollbar-fg-default: var(--mode-color-generic-fg-firm);\n --container-scrollbar-inverse-bg-default: var(--mode-color-generic-bg-inverse-soft);\n --container-scrollbar-inverse-fg-default: var(--mode-color-generic-fg-inverse-firm);\n --container-standard-bg-alt: var(--mode-color-generic-bg-faint);\n --container-standard-bg-default: var(--mode-color-generic-bg-nought);\n --container-standard-bg-footer-default: var(--mode-color-generic-bg-faint);\n --container-standard-border-active: var(--mode-color-action-grayscale-active);\n --container-standard-border-ai-h: var(--mode-color-status-ai-inverse-default-horizontal);\n --container-standard-border-ai-v: var(--mode-color-status-ai-inverse-default-vertical);\n --container-standard-border-alt: var(--mode-color-generic-fg-firm);\n --container-standard-border-default: var(--mode-color-generic-fg-soft);\n --container-standard-dimmer: var(--mode-color-action-inactive-mask);\n --container-standard-icon: var(--mode-color-generic-fg-firm);\n --container-standard-txt-alt: var(--mode-color-generic-txt-moderate);\n --container-standard-txt-default: var(--mode-color-generic-txt-severe);\n --container-standard-inverse-bg-alt: var(--mode-color-generic-bg-inverse-delicate);\n --container-standard-inverse-border-alt: var(--mode-color-generic-fg-inverse-firm);\n --container-standard-inverse-bg-default: var(--mode-color-generic-bg-inverse-nought);\n --container-standard-inverse-border-default: var(--mode-color-generic-fg-inverse-soft);\n --container-standard-inverse-txt-alt: var(--mode-color-generic-txt-inverse-moderate);\n --container-standard-inverse-txt-default: var(--mode-color-generic-txt-inverse-severe);\n --container-standard-priority-bg-ai: var(--mode-color-status-ai-inverse-default-vertical);\n --container-standard-priority-bg-caution: var(--mode-color-status-warning-default);\n --container-standard-priority-bg-negative: var(--mode-color-status-negative-default);\n --container-standard-priority-bg-prio: var(--mode-color-status-priority-default);\n --container-standard-priority-bg-info: var(--mode-color-status-info-default);\n --container-standard-priority-bg-neutral: var(--mode-color-status-neutral-default);\n --container-standard-priority-bg-positive: var(--mode-color-status-positive-default);\n --container-standard-priority-inverse-bg-ai: var(--mode-color-status-ai-inverse-default-vertical);\n --container-standard-priority-inverse-bg-caution: var(--mode-color-status-warning-inverse-default);\n --container-standard-priority-inverse-bg-negative: var(--mode-color-status-negative-inverse-default);\n --container-standard-priority-inverse-bg-prio: var(--mode-color-status-priority-inverse-default);\n --container-standard-priority-inverse-bg-info: var(--mode-color-status-info-inverse-default);\n --container-standard-priority-inverse-bg-neutral: var(--mode-color-status-neutral-inverse-default);\n --container-standard-priority-inverse-bg-positive: var(--mode-color-status-positive-inverse-default);\n --container-quote-border: var(--mode-color-action-main-default);\n --container-size-fluid-items-2-xs: 80px;\n --container-size-fluid-items-xs: 128px;\n --container-size-fluid-items-s: 160px;\n --container-size-fluid-items-m: 200px;\n --container-size-fluid-items-l: 240px;\n --container-size-fluid-items-xl: 288px;\n --container-size-fluid-items-2-xl: 320px;\n --container-size-fluid-items-3-xl: 560px;\n --container-size-fluid-items-4-xl: 760px;\n --focus-bg: var(--mode-color-action-focus-with-default-alt);\n --focus-borderalt: var(--mode-color-action-focus-default);\n --focus-border: var(--mode-color-action-focus-with-default);\n --focus-label: var(--mode-color-action-focus-txt);\n --focus-inverse-bg: var(--mode-color-action-focus-inverse-with-default-alt);\n --focus-inverse-borderalt: var(--mode-color-action-focus-inverse-default);\n --focus-inverse-border: var(--mode-color-action-focus-inverse-with-default);\n --focus-inverse-label: var(--mode-color-action-focus-inverse-txt);\n --dataviz-chart-bar-fuchsia-bg-alt: var(--mode-color-colorcode-pink-faint);\n --dataviz-chart-bar-fuchsia-bg-default: var(--mode-color-colorcode-pink-intense);\n --dataviz-chart-bar-fuchsia-border: var(--mode-color-colorcode-pink-intense);\n --dataviz-chart-bar-fuchsia-pattern: var(--mode-color-colorcode-pink-intense);\n --dataviz-chart-bar-red-bg-alt: var(--mode-color-colorcode-red-faint);\n --dataviz-chart-bar-red-bg-default: var(--mode-color-colorcode-red-intense);\n --dataviz-chart-bar-red-border: var(--mode-color-colorcode-red-intense);\n --dataviz-chart-bar-red-pattern: var(--mode-color-colorcode-red-intense);\n --dataviz-chart-bar-pink-bg-alt: var(--mode-color-colorcode-red-faint);\n --dataviz-chart-bar-pink-bg-default: var(--mode-color-colorcode-red-soft);\n --dataviz-chart-bar-pink-border: var(--mode-color-colorcode-red-soft);\n --dataviz-chart-bar-pink-pattern: var(--mode-color-colorcode-red-soft);\n --dataviz-chart-bar-orange-bg-alt: var(--mode-color-colorcode-orange-faint);\n --dataviz-chart-bar-orange-bg-default: var(--mode-color-colorcode-orange-harsh);\n --dataviz-chart-bar-orange-border: var(--mode-color-colorcode-orange-harsh);\n --dataviz-chart-bar-orange-pattern: var(--mode-color-colorcode-orange-harsh);\n --dataviz-chart-bar-gold-bg-alt: var(--mode-color-colorcode-yellow-faint);\n --dataviz-chart-bar-gold-bg-default: var(--mode-color-colorcode-yellow-soft);\n --dataviz-chart-bar-gold-border: var(--mode-color-colorcode-yellow-harsh);\n --dataviz-chart-bar-gold-pattern: var(--mode-color-colorcode-yellow-harsh);\n --dataviz-chart-bar-lime-bg-alt: var(--mode-color-colorcode-lime-faint);\n --dataviz-chart-bar-lime-bg-default: var(--mode-color-colorcode-lime-harsh);\n --dataviz-chart-bar-lime-border: var(--mode-color-colorcode-lime-harsh);\n --dataviz-chart-bar-lime-pattern: var(--mode-color-colorcode-lime-harsh);\n --dataviz-chart-bar-green-bg-alt: var(--mode-color-colorcode-green-faint);\n --dataviz-chart-bar-green-bg-default: var(--mode-color-colorcode-green-harsh);\n --dataviz-chart-bar-green-border: var(--mode-color-colorcode-green-harsh);\n --dataviz-chart-bar-green-pattern: var(--mode-color-colorcode-green-harsh);\n --dataviz-chart-bar-teal-bg-alt: var(--mode-color-colorcode-teal-faint);\n --dataviz-chart-bar-teal-bg-default: var(--mode-color-colorcode-teal-soft);\n --dataviz-chart-bar-teal-border: var(--mode-color-colorcode-teal-soft);\n --dataviz-chart-bar-teal-pattern: var(--mode-color-colorcode-teal-soft);\n --dataviz-chart-bar-blue-bg-alt: var(--mode-color-colorcode-blue-faint);\n --dataviz-chart-bar-blue-bg-default: var(--mode-color-colorcode-blue-soft);\n --dataviz-chart-bar-blue-border: var(--mode-color-colorcode-blue-soft);\n --dataviz-chart-bar-blue-pattern: var(--mode-color-colorcode-blue-soft);\n --dataviz-chart-bar-navy-bg-alt: var(--mode-color-colorcode-blue-faint);\n --dataviz-chart-bar-navy-bg-default: var(--mode-color-colorcode-blue-intense);\n --dataviz-chart-bar-navy-border: var(--mode-color-colorcode-blue-intense);\n --dataviz-chart-bar-navy-pattern: var(--mode-color-colorcode-blue-intense);\n --dataviz-chart-bar-purple-bg-alt: var(--mode-color-colorcode-purple-faint);\n --dataviz-chart-bar-purple-bg-default: var(--mode-color-colorcode-purple-intense);\n --dataviz-chart-bar-purple-border: var(--mode-color-colorcode-purple-intense);\n --dataviz-chart-bar-purple-pattern: var(--mode-color-colorcode-purple-intense);\n --dataviz-chart-bar-slate-bg-alt: var(--mode-color-colorcode-slate-faint);\n --dataviz-chart-bar-slate-bg-default: var(--mode-color-colorcode-slate-intense);\n --dataviz-chart-bar-slate-border: var(--mode-color-colorcode-slate-intense);\n --dataviz-chart-bar-slate-pattern: var(--mode-color-colorcode-slate-intense);\n --dataviz-chart-donut-fuchsia-bg-alt: var(--mode-color-colorcode-pink-faint);\n --dataviz-chart-donut-fuchsia-bg-default: var(--mode-color-colorcode-pink-intense);\n --dataviz-chart-donut-fuchsia-border: var(--mode-color-colorcode-pink-intense);\n --dataviz-chart-donut-fuchsia-pattern: var(--mode-color-colorcode-pink-intense);\n --dataviz-chart-donut-red-bg-alt: var(--mode-color-colorcode-red-faint);\n --dataviz-chart-donut-red-bg-default: var(--mode-color-colorcode-red-intense);\n --dataviz-chart-donut-red-border: var(--mode-color-colorcode-red-intense);\n --dataviz-chart-donut-red-pattern: var(--mode-color-colorcode-red-intense);\n --dataviz-chart-donut-pink-bg-alt: var(--mode-color-colorcode-red-faint);\n --dataviz-chart-donut-pink-bg-default: var(--mode-color-colorcode-red-soft);\n --dataviz-chart-donut-pink-border: var(--mode-color-colorcode-red-soft);\n --dataviz-chart-donut-pink-pattern: var(--mode-color-colorcode-red-soft);\n --dataviz-chart-donut-orange-bg-alt: var(--mode-color-colorcode-orange-faint);\n --dataviz-chart-donut-orange-bg-default: var(--mode-color-colorcode-orange-harsh);\n --dataviz-chart-donut-orange-border: var(--mode-color-colorcode-orange-harsh);\n --dataviz-chart-donut-orange-pattern: var(--mode-color-colorcode-orange-harsh);\n --dataviz-chart-donut-gold-bg-alt: var(--mode-color-colorcode-yellow-faint);\n --dataviz-chart-donut-gold-bg-default: var(--mode-color-colorcode-yellow-soft);\n --dataviz-chart-donut-gold-border: var(--mode-color-colorcode-yellow-harsh);\n --dataviz-chart-donut-gold-pattern: var(--mode-color-colorcode-yellow-harsh);\n --dataviz-chart-donut-lime-bg-alt: var(--mode-color-colorcode-lime-faint);\n --dataviz-chart-donut-lime-bg-default: var(--mode-color-colorcode-lime-harsh);\n --dataviz-chart-donut-lime-border: var(--mode-color-colorcode-lime-harsh);\n --dataviz-chart-donut-lime-pattern: var(--mode-color-colorcode-lime-harsh);\n --dataviz-chart-donut-green-bg-alt: var(--mode-color-colorcode-green-faint);\n --dataviz-chart-donut-green-bg-default: var(--mode-color-colorcode-green-harsh);\n --dataviz-chart-donut-green-border: var(--mode-color-colorcode-green-harsh);\n --dataviz-chart-donut-green-pattern: var(--mode-color-colorcode-green-harsh);\n --dataviz-chart-donut-teal-bg-alt: var(--mode-color-colorcode-teal-faint);\n --dataviz-chart-donut-teal-bg-default: var(--mode-color-colorcode-teal-soft);\n --dataviz-chart-donut-teal-border: var(--mode-color-colorcode-teal-soft);\n --dataviz-chart-donut-teal-pattern: var(--mode-color-colorcode-teal-soft);\n --dataviz-chart-donut-blue-bg-alt: var(--mode-color-colorcode-blue-faint);\n --dataviz-chart-donut-blue-bg-default: var(--mode-color-colorcode-blue-soft);\n --dataviz-chart-donut-blue-border: var(--mode-color-colorcode-blue-soft);\n --dataviz-chart-donut-blue-pattern: var(--mode-color-colorcode-blue-soft);\n --dataviz-chart-donut-navy-bg-alt: var(--mode-color-colorcode-blue-faint);\n --dataviz-chart-donut-navy-bg-default: var(--mode-color-colorcode-blue-intense);\n --dataviz-chart-donut-navy-border: var(--mode-color-colorcode-blue-intense);\n --dataviz-chart-donut-navy-pattern: var(--mode-color-colorcode-blue-intense);\n --dataviz-chart-donut-purple-bg-alt: var(--mode-color-colorcode-purple-faint);\n --dataviz-chart-donut-purple-bg-default: var(--mode-color-colorcode-purple-intense);\n --dataviz-chart-donut-purple-border: var(--mode-color-colorcode-purple-intense);\n --dataviz-chart-donut-purple-pattern: var(--mode-color-colorcode-purple-intense);\n --dataviz-chart-donut-slate-bg-alt: var(--mode-color-colorcode-slate-faint);\n --dataviz-chart-donut-slate-bg-default: var(--mode-color-colorcode-slate-intense);\n --dataviz-chart-donut-slate-border: var(--mode-color-colorcode-slate-intense);\n --dataviz-chart-donut-slate-pattern: var(--mode-color-colorcode-slate-intense);\n --dataviz-chart-line-fuchsia: var(--mode-color-colorcode-pink-intense);\n --dataviz-chart-line-red: var(--mode-color-colorcode-red-intense);\n --dataviz-chart-line-pink: var(--mode-color-colorcode-red-soft);\n --dataviz-chart-line-orange: var(--mode-color-colorcode-orange-harsh);\n --dataviz-chart-line-gold: var(--mode-color-colorcode-yellow-harsh);\n --dataviz-chart-line-lime: var(--mode-color-colorcode-lime-harsh);\n --dataviz-chart-line-green: var(--mode-color-colorcode-green-harsh);\n --dataviz-chart-line-teal: var(--mode-color-colorcode-teal-soft);\n --dataviz-chart-line-blue: var(--mode-color-colorcode-blue-soft);\n --dataviz-chart-line-navy: var(--mode-color-colorcode-blue-intense);\n --dataviz-chart-line-purple: var(--mode-color-colorcode-purple-intense);\n --dataviz-chart-line-slate: var(--mode-color-colorcode-slate-intense);\n --dataviz-generic-label-alt: var(--mode-color-generic-txt-inverse-extreme);\n --dataviz-generic-label-default: var(--mode-color-generic-txt-extreme);\n --dataviz-generic-pending-bg-default: var(--mode-color-generic-bg-nought);\n --dataviz-generic-blue-bg-alt: var(--mode-color-colorcode-blue-harsh);\n --dataviz-generic-blue-bg-default: var(--mode-color-colorcode-blue-faint);\n --dataviz-generic-blue-border: var(--mode-color-colorcode-blue-harsh);\n --dataviz-generic-blue-pattern: var(--mode-color-colorcode-blue-harsh);\n --dataviz-generic-teal-bg-alt: var(--mode-color-colorcode-teal-harsh);\n --dataviz-generic-teal-bg-default: var(--mode-color-colorcode-teal-faint);\n --dataviz-generic-teal-border: var(--mode-color-colorcode-teal-harsh);\n --dataviz-generic-teal-pattern: var(--mode-color-colorcode-teal-harsh);\n --dataviz-generic-green-bg-alt: var(--mode-color-colorcode-green-harsh);\n --dataviz-generic-green-bg-default: var(--mode-color-colorcode-green-faint);\n --dataviz-generic-green-border: var(--mode-color-colorcode-green-harsh);\n --dataviz-generic-green-pattern: var(--mode-color-colorcode-green-harsh);\n --dataviz-generic-lime-bg-alt: var(--mode-color-colorcode-lime-harsh);\n --dataviz-generic-lime-bg-default: var(--mode-color-colorcode-lime-faint);\n --dataviz-generic-lime-border: var(--mode-color-colorcode-lime-harsh);\n --dataviz-generic-lime-pattern: var(--mode-color-colorcode-lime-harsh);\n --dataviz-generic-orange-bg-alt: var(--mode-color-colorcode-orange-harsh);\n --dataviz-generic-orange-bg-default: var(--mode-color-colorcode-orange-faint);\n --dataviz-generic-orange-border: var(--mode-color-colorcode-orange-harsh);\n --dataviz-generic-orange-pattern: var(--mode-color-colorcode-orange-harsh);\n --dataviz-generic-red-bg-alt: var(--mode-color-colorcode-red-harsh);\n --dataviz-generic-red-bg-default: var(--mode-color-colorcode-red-faint);\n --dataviz-generic-red-border: var(--mode-color-colorcode-red-harsh);\n --dataviz-generic-red-pattern: var(--mode-color-colorcode-red-harsh);\n --dataviz-generic-pink-bg-alt: var(--mode-color-colorcode-pink-harsh);\n --dataviz-generic-pink-bg-default: var(--mode-color-colorcode-pink-faint);\n --dataviz-generic-pink-border: var(--mode-color-colorcode-pink-harsh);\n --dataviz-generic-pink-pattern: var(--mode-color-colorcode-pink-harsh);\n --dataviz-generic-purple-bg-alt: var(--mode-color-colorcode-purple-harsh);\n --dataviz-generic-purple-bg-default: var(--mode-color-colorcode-purple-faint);\n --dataviz-generic-purple-border: var(--mode-color-colorcode-purple-harsh);\n --dataviz-generic-purple-pattern: var(--mode-color-colorcode-purple-harsh);\n --dataviz-generic-gray-bg-alt: var(--mode-color-colorcode-gray-harsh);\n --dataviz-generic-gray-bg-default: var(--mode-color-colorcode-gray-faint);\n --dataviz-generic-gray-border: var(--mode-color-colorcode-gray-harsh);\n --dataviz-generic-gray-pattern: var(--mode-color-colorcode-gray-harsh);\n --dataviz-generic-slate-bg-alt: var(--mode-color-colorcode-slate-harsh);\n --dataviz-generic-slate-bg-default: var(--mode-color-colorcode-slate-faint);\n --dataviz-generic-slate-border: var(--mode-color-colorcode-slate-harsh);\n --dataviz-generic-slate-pattern: var(--mode-color-colorcode-slate-harsh);\n --input-calendar-bg-active: var(--mode-color-action-grayscale-active);\n --input-calendar-bg-disabled: var(--mode-color-action-inactive-default-alt);\n --input-calendar-bg-duration: var(--mode-color-action-data-entry-hover-alt);\n --input-calendar-bg-hover: var(--mode-color-action-data-entry-hover-alt);\n --input-calendar-border-duration: var(--mode-color-action-grayscale-active);\n --input-calendar-txt-active: var(--mode-color-action-grayscale-with-active);\n --input-calendar-txt-alt: var(--mode-color-action-data-entry-txt-alt);\n --input-calendar-txt-disabled: var(--mode-color-action-inactive-txt);\n --input-calendar-txt-duration: var(--mode-color-action-data-entry-txt);\n --input-calendar-txt-default: var(--mode-color-action-data-entry-txt);\n --input-calendar-txt-hover: var(--mode-color-action-grayscale-with-hover);\n --input-calendar-txt-alt-default: var(--mode-color-action-data-entry-txt-alt);\n --input-dropdown-bg-hover: var(--mode-color-action-data-entry-hover-alt);\n --input-dropdown-label-active: var(--mode-color-action-grayscale-with-active);\n --input-dropdown-label-alt: var(--mode-color-action-data-entry-txt);\n --input-dropdown-label-disabled: var(--mode-color-action-inactive-txt);\n --input-dropdown-label-default: var(--mode-color-action-data-entry-txt-alt);\n --input-dropdown-label-hover: var(--mode-color-action-grayscale-with-hover);\n --input-dropdown-label-subtxt: var(--mode-color-action-data-entry-txt-alt);\n --input-labelset-label-required: var(--mode-color-action-danger-default);\n --input-labelset-label-default: var(--mode-color-action-data-entry-txt);\n --input-labelset-label-alt: var(--mode-color-action-data-entry-txt-alt);\n --input-labelset-label-disabled: var(--mode-color-action-inactive-txt);\n --input-labelset-label-read-only: var(--mode-color-action-data-entry-txt);\n --input-labelset-inverse-label-required: var(--mode-color-action-danger-inverse-default);\n --input-labelset-inverse-label-default: var(--mode-color-action-data-entry-inverse-txt);\n --input-labelset-inverse-label-alt: var(--mode-color-action-data-entry-inverse-txt-alt);\n --input-typical-bg-alt: var(--mode-color-action-data-entry-default-alt);\n --input-typical-bg-disabled: var(--mode-color-action-inactive-default-alt);\n --input-typical-bg-default: var(--mode-color-action-data-entry-default);\n --input-typical-bg-hover: var(--mode-color-action-data-entry-hover-alt);\n --input-typical-bg-read-only: var(--mode-color-action-inactive-default-alt);\n --input-typical-border-alt: var(--mode-color-action-inactive-default);\n --input-typical-border-default: var(--mode-color-action-data-entry-with-default);\n --input-typical-border-disabled: var(--mode-color-action-inactive-default);\n --input-typical-border-hover: var(--mode-color-action-data-entry-with-hover);\n --input-typical-border-read-only: var(--mode-color-action-inactive-default);\n --input-typical-icon-active: var(--mode-color-action-data-entry-with-active);\n --input-typical-icon-default: var(--mode-color-action-data-entry-txt);\n --input-typical-icon-disabled: var(--mode-color-action-inactive-icon);\n --input-typical-icon-hover: var(--mode-color-action-data-entry-with-hover);\n --input-typical-icon-read-only: var(--mode-color-action-inactive-icon-alt);\n --input-typical-icon-alt-active: var(--mode-color-action-data-entry-with-active-alt);\n --input-typical-txt-active: var(--mode-color-action-data-entry-txt);\n --input-typical-txt-alt: var(--mode-color-action-data-entry-txt-alt);\n --input-typical-txt-default: var(--mode-color-action-data-entry-txt);\n --input-typical-txt-disabled: var(--mode-color-action-inactive-txt);\n --input-typical-txt-hover: var(--mode-color-action-data-entry-with-hover);\n --input-typical-txt-read-only: var(--mode-color-generic-txt-severe);\n --input-typical-inverse-bg-default: var(--mode-color-action-data-entry-inverse-default);\n --input-typical-inverse-border-default: var(--mode-color-action-data-entry-inverse-with-default);\n --input-typical-inverse-txt-default: var(--mode-color-action-data-entry-inverse-txt);\n --input-switch-bg-active: var(--mode-color-action-grayscale-active);\n --input-switch-bg-activate-disabled: var(--mode-color-action-inactive-default);\n --input-switch-bg-disabled: var(--mode-color-action-inactive-default-alt);\n --input-switch-bg-default: var(--mode-color-action-data-entry-default);\n --input-switch-border-active: transparent;\n --input-switch-border-active-disabled: transparent;\n --input-switch-border-disabled: var(--mode-color-action-inactive-default);\n --input-switch-border-default: var(--mode-color-action-data-entry-with-default);\n --input-switch-fg-active: var(--mode-color-action-grayscale-with-active);\n --input-switch-fg-activate-disabled: var(--mode-color-action-inactive-txt-alt);\n --input-switch-fg-disabled: var(--mode-color-action-inactive-default);\n --input-switch-fg-default: var(--mode-color-action-data-entry-with-default);\n --input-switch-label-active: var(--mode-color-action-data-entry-txt);\n --input-switch-label-activate-disabled: var(--mode-color-action-inactive-default);\n --input-switch-label-disabled: var(--mode-color-action-inactive-default);\n --input-switch-label-default: var(--mode-color-action-data-entry-txt-alt);\n --input-validation-border-error: var(--mode-color-status-negative-default);\n --input-validation-bar-error: var(--mode-color-status-negative-default);\n --input-validation-bar-warn: var(--mode-color-status-warning-default);\n --input-validation-label-error: var(--mode-color-status-negative-default);\n --input-validation-label-success: var(--mode-color-status-positive-default);\n --input-validation-label-warn: var(--mode-color-status-warning-txt);\n --input-validation-inverse-border-error: var(--mode-color-status-negative-inverse-default);\n --input-validation-inverse-bar-error: var(--mode-color-status-negative-inverse-default);\n --input-validation-inverse-label-error: var(--mode-color-status-negative-inverse-default);\n --logo-sage-bg-default: var(--mode-color-brand-default);\n --logo-sage-bg-alt: var(--mode-color-brand-default-alt);\n --logo-sage-inverse-bg-default: var(--mode-color-brand-inverse-default);\n --logo-sage-inverse-bg-alt: var(--mode-color-brand-inverse-default-alt);\n --logo-copilot-no-bg-fg-default: var(--mode-color-brand-copilot-monochrome);\n --logo-ai-sparkle-bg-dot: var(--mode-color-brand-copilot-with-default);\n --logo-ai-sparkle-bg-star: var(--mode-color-brand-copilot-default);\n --logo-ai-sparkle-outline: var(--mode-color-brand-copilot-default);\n --logo-ai-sparkle-inverse-bg-dot: var(--mode-color-brand-copilot-inverse-with-default);\n --logo-ai-sparkle-inverse-bg-star: var(--mode-color-brand-copilot-inverse-default);\n --logo-ai-sparkle-inverse-outline: var(--mode-color-brand-copilot-inverse-default);\n --link-destructive-label-default: var(--mode-color-action-danger-default-alt);\n --link-destructive-label-hover: var(--mode-color-action-danger-hover-alt2);\n --link-destructive-inverse-label-default: var(--mode-color-action-danger-inverse-default-alt);\n --link-destructive-inverse-label-hover: var(--mode-color-action-danger-inverse-hover-alt2);\n --link-typical-label-default: var(--mode-color-action-main-default-alt2);\n --link-typical-label-hover: var(--mode-color-action-main-hover-alt2);\n --link-typical-inverse-label-default: var(--mode-color-action-main-inverse-default-alt2);\n --link-typical-inverse-label-hover: var(--mode-color-action-main-inverse-hover-alt2);\n --link-subtle-label-default: var(--mode-color-action-grayscale-default);\n --link-subtle-label-hover: var(--mode-color-action-grayscale-active);\n --link-subtle-inverse-label-default: var(--mode-color-action-grayscale-inverse-default);\n --link-subtle-inverse-label-hover: var(--mode-color-action-grayscale-inverse-active);\n --message-none: var(--mode-color-none);\n --message-contextual-bg: var(--mode-color-generic-bg-nought);\n --message-contextual-icon: var(--mode-color-generic-bg-nought);\n --message-contextual-icon-alt: var(--mode-color-status-neutral-default);\n --message-contextual-txt: var(--mode-color-status-txt-with-hover-alt);\n --message-contextual-ai-bg-default: var(--mode-color-status-ai-default-alt);\n --message-contextual-ai-bg-alt: var(--mode-color-status-neutral-default-alt);\n --message-contextual-ai-border-default: var(--mode-color-status-ai-default-alt);\n --message-contextual-callout-bg-alt: var(--mode-color-status-callout-default-alt);\n --message-contextual-callout-icon: var(--mode-color-status-txt-with-default-alt);\n --message-contextual-error-bg-default: var(--mode-color-status-negative-default);\n --message-contextual-error-bg-alt: var(--mode-color-status-negative-default-alt);\n --message-contextual-error-border-default: var(--mode-color-status-negative-default);\n --message-contextual-error-icon: var(--mode-color-status-negative-default);\n --message-contextual-info-bg-default: var(--mode-color-status-info-default);\n --message-contextual-info-bg-alt: var(--mode-color-status-info-default-alt);\n --message-contextual-info-border-default: var(--mode-color-status-info-default);\n --message-contextual-info-icon: var(--mode-color-status-info-default);\n --message-contextual-success-bg-default: var(--mode-color-status-positive-default);\n --message-contextual-success-bg-alt: var(--mode-color-status-positive-default-alt);\n --message-contextual-success-border-default: var(--mode-color-status-positive-default);\n --message-contextual-success-icon: var(--mode-color-status-positive-default);\n --message-contextual-warning-bg-default: var(--mode-color-status-warning-default);\n --message-contextual-warning-bg-alt: var(--mode-color-status-warning-default-alt);\n --message-contextual-warning-border-default: var(--mode-color-status-warning-default);\n --message-contextual-warning-icon: var(--mode-color-status-warning-default);\n --message-global-label-default: var(--mode-color-status-txt-with-default-alt);\n --message-global-label-hover: var(--mode-color-action-grayscale-with-hover);\n --message-global-callout-bg-default: var(--mode-color-status-callout-default-alt);\n --message-global-callout-bg-hover: var(--mode-color-status-callout-hover-alt);\n --message-global-callout-icon: var(--mode-color-status-txt-with-default-alt);\n --message-global-info-bg-default: var(--mode-color-status-info-default-alt);\n --message-global-info-bg-hover: var(--mode-color-status-info-hover-alt);\n --message-global-info-icon: var(--mode-color-status-info-default);\n --message-global-warning-bg-default: var(--mode-color-status-warning-default-alt);\n --message-global-warning-bg-hover: var(--mode-color-status-warning-hover-alt);\n --message-global-warning-icon: var(--mode-color-status-warning-default);\n --nav-primary-bg-active: var(--mode-color-action-nav-active);\n --nav-primary-bg-default: var(--mode-color-generic-bg-inverse-nought);\n --nav-primary-bg-hover: var(--mode-color-action-nav-hover);\n --nav-primary-bg-child: var(--mode-color-action-nav-inverse-child);\n --nav-primary-bg-child-alt: var(--mode-color-action-nav-inverse-child-alt);\n --nav-primary-bg-selected: var(--mode-color-generic-fg-soft);\n --nav-primary-border-default: var(--mode-color-generic-fg-inverse-soft);\n --nav-primary-divider: var(--mode-color-generic-fg-inverse-firm);\n --nav-primary-label-active: var(--mode-color-action-nav-with-active);\n --nav-primary-label-default: var(--mode-color-action-nav-inverse-with-default);\n --nav-primary-label-default-alt: var(--mode-color-generic-txt-inverse-moderate);\n --nav-primary-label-hover: var(--mode-color-action-nav-with-hover);\n --nav-secondary-bg-active: var(--mode-color-action-nav-active);\n --nav-secondary-bg-default: var(--mode-color-action-nav-inverse-default-alt);\n --nav-secondary-bg-hover: var(--mode-color-action-nav-hover);\n --nav-secondary-bg-selected: var(--mode-color-generic-fg-soft);\n --nav-secondary-label-active: var(--mode-color-action-nav-with-active);\n --nav-secondary-label-default: var(--mode-color-action-nav-inverse-with-default);\n --nav-secondary-label-default-alt: var(--mode-color-generic-txt-inverse-moderate);\n --nav-secondary-label-hover: var(--mode-color-action-nav-with-hover);\n --nav-tertiary-bg-active: var(--mode-color-action-nav-active);\n --nav-tertiary-bg-default: var(--mode-color-generic-bg-nought);\n --nav-tertiary-bg-hover: var(--mode-color-action-nav-hover);\n --nav-tertiary-bg-child: var(--mode-color-action-nav-child);\n --nav-tertiary-bg-child-alt: var(--mode-color-action-nav-child-alt);\n --nav-tertiary-bg-selected: var(--mode-color-generic-fg-firm);\n --nav-tertiary-border-default: var(--mode-color-generic-fg-soft);\n --nav-tertiary-divider: var(--mode-color-generic-bg-soft);\n --nav-tertiary-label-active: var(--mode-color-action-nav-with-active);\n --nav-tertiary-label-default: var(--mode-color-action-nav-with-default);\n --nav-tertiary-label-default-alt: var(--mode-color-generic-txt-moderate);\n --nav-tertiary-label-hover: var(--mode-color-action-nav-with-hover);\n --page-bg-default: var(--mode-color-generic-surface-nought);\n --page-bg-alt: var(--mode-color-generic-surface-faint);\n --page-txt-alt: var(--mode-color-generic-txt-moderate);\n --page-txt-default: var(--mode-color-generic-txt-severe);\n --popover-bg-active: var(--mode-color-action-grayscale-active);\n --popover-bg-active-alt: var(--mode-color-action-grayscale-hover-alt);\n --popover-bg-default: var(--mode-color-generic-bg-nought);\n --popover-bg-hover: var(--mode-color-action-grayscale-hover-alt);\n --popover-label-active: var(--mode-color-action-grayscale-with-active);\n --popover-label-active-alt: var(--mode-color-action-grayscale-with-hover);\n --popover-label-disabled: var(--mode-color-action-inactive-txt);\n --popover-label-hover: var(--mode-color-action-grayscale-with-hover);\n --popover-label-default: var(--mode-color-action-grayscale-default-alt);\n --popover-submenu-bg-default: var(--mode-color-generic-bg-faint);\n --profile-size-outside-xs: var(--global-size-xs);\n --profile-size-outside-s: var(--global-size-s);\n --profile-size-outside-m: var(--global-size-m);\n --profile-size-outside-ml: 56px;\n --profile-size-outside-l: var(--global-size-4-xl);\n --profile-size-outside-xl: 104px;\n --profile-size-outside-xxl: 128px;\n --profile-size-inside-xs: var(--global-size-3-xs);\n --profile-size-inside-s: var(--global-size-2-xs);\n --profile-size-inside-m: var(--global-size-xs);\n --profile-size-inside-ml: var(--global-size-s);\n --profile-size-inside-l: var(--global-size-l);\n --profile-size-inside-xl: var(--global-size-2-xl);\n --profile-size-inside-xxl: var(--global-size-4-xl);\n --profile-bg-alt: var(--mode-color-generic-txt-severe);\n --profile-bg-def: var(--mode-color-generic-bg-nought);\n --profile-border-default: var(--mode-color-generic-fg-moderate);\n --profile-label-default: var(--mode-color-generic-txt-severe);\n --profile-swatches-blue-bg-default: var(--mode-color-status-custom-blue-default-alt);\n --profile-swatches-blue-label-default: var(--mode-color-status-custom-blue-default);\n --profile-swatches-teal-bg-default: var(--mode-color-status-custom-teal-default-alt);\n --profile-swatches-teal-label-default: var(--mode-color-status-custom-teal-default);\n --profile-swatches-green-bg-default: var(--mode-color-status-custom-green-default-alt);\n --profile-swatches-green-label-default: var(--mode-color-status-custom-green-default);\n --profile-swatches-lime-bg-default: var(--mode-color-status-custom-lime-default-alt);\n --profile-swatches-lime-label-default: var(--mode-color-status-custom-lime-default);\n --profile-swatches-orange-bg-default: var(--mode-color-status-custom-orange-default-alt);\n --profile-swatches-orange-label-default: var(--mode-color-status-custom-orange-txt);\n --profile-swatches-red-bg-default: var(--mode-color-status-custom-red-default-alt);\n --profile-swatches-red-label-default: var(--mode-color-status-custom-red-default);\n --profile-swatches-pink-bg-default: var(--mode-color-status-custom-pink-default-alt);\n --profile-swatches-pink-label-default: var(--mode-color-status-custom-pink-default);\n --profile-swatches-purple-bg-default: var(--mode-color-status-custom-purple-default-alt);\n --profile-swatches-purple-label-default: var(--mode-color-status-custom-purple-default);\n --profile-swatches-slate-bg-default: var(--mode-color-status-custom-slate-default-alt);\n --profile-swatches-slate-label-default: var(--mode-color-status-custom-slate-default);\n --profile-swatches-gray-bg-default: var(--mode-color-status-custom-gray-default-alt);\n --profile-swatches-gray-label-default: var(--mode-color-status-custom-gray-default);\n --profile-font-initials-xs: var(--global-font-static-comp-placeholder-xs);\n --profile-font-initials-s: var(--global-font-static-comp-placeholder-s);\n --profile-font-initials-m: var(--global-font-static-comp-placeholder-m);\n --profile-font-initials-ml: var(--global-font-static-comp-placeholder-ml);\n --profile-font-initials-l: var(--global-font-static-comp-placeholder-l);\n --profile-font-initials-xl: var(--global-font-static-comp-placeholder-xl);\n --profile-font-initials-xxl: var(--global-font-static-comp-placeholder-xxl);\n --profile-font-heading-xs: var(--global-font-static-comp-medium-s);\n --profile-font-heading-s: var(--global-font-static-comp-medium-m);\n --profile-font-heading-m: var(--global-font-static-subheading-l);\n --profile-font-heading-ml: var(--global-font-static-subheading-l);\n --profile-font-heading-l: var(--global-font-static-subheading-l);\n --profile-font-heading-xl: var(--global-font-static-heading-m);\n --profile-font-heading-xxl: var(--global-font-static-heading-l);\n --profile-font-fluid-initials-xs: var(--global-font-fluid-comp-placeholder-xs);\n --profile-font-fluid-initials-s: var(--global-font-fluid-comp-placeholder-s);\n --profile-font-fluid-initials-m: var(--global-font-fluid-comp-placeholder-m);\n --profile-font-fluid-initials-ml: var(--global-font-fluid-comp-placeholder-ml);\n --profile-font-fluid-initials-l: var(--global-font-fluid-comp-placeholder-l);\n --profile-font-fluid-initials-xl: var(--global-font-fluid-comp-placeholder-xl);\n --profile-font-fluid-initials-xxl: var(--global-font-fluid-comp-placeholder-xxl);\n --profile-font-fluid-heading-xs: var(--global-font-fluid-comp-medium-s);\n --profile-font-fluid-heading-s: var(--global-font-fluid-comp-medium-m);\n --profile-font-fluid-heading-m: var(--global-font-fluid-subheading-l);\n --profile-font-fluid-heading-ml: var(--global-font-fluid-subheading-l);\n --profile-font-fluid-heading-l: var(--global-font-fluid-subheading-l);\n --profile-font-fluid-heading-xl: var(--global-font-fluid-heading-m);\n --profile-font-fluid-heading-xxl: var(--global-font-fluid-heading-l);\n --progress-none: var(--mode-color-none);\n --progress-bg-default: var(--mode-color-generic-bg-delicate);\n --progress-border-default: var(--mode-color-generic-fg-firm);\n --progress-fg-alt: var(--mode-color-status-positive-default);\n --progress-fg-alt2: var(--mode-color-generic-txt-soft);\n --progress-fg-caution: var(--mode-color-status-warning-default);\n --progress-fg-default: var(--mode-color-action-grayscale-active);\n --progress-fg-error: var(--mode-color-status-negative-default);\n --progress-fg-info: var(--mode-color-status-info-default);\n --progress-label-alt: var(--mode-color-generic-txt-moderate);\n --progress-label-default: var(--mode-color-generic-txt-severe);\n --progress-dataviz-fg-default: var(--mode-color-status-custom-teal-default);\n --progress-inverse-label-alt: var(--mode-color-generic-txt-inverse-soft);\n --progress-loader-bg-default: var(--mode-color-generic-bg-delicate);\n --progress-loader-bg-skeleton: linear-gradient(135deg, var(--mode-color-status-skeleton-stop-1) 15%, var(--mode-color-status-skeleton-stop-2) 85%);\n --progress-loader-fg-default: var(--mode-color-generic-fg-inverse-nought);\n --progress-loader-fg-error: var(--mode-color-status-negative-default);\n --progress-loader-fg-complete: var(--mode-color-status-positive-default);\n --progress-loader-inverse-bg-default: var(--mode-color-generic-bg-inverse-delicate);\n --progress-loader-inverse-fg-default: var(--mode-color-generic-fg-nought);\n --progress-stepflow-bg-active: var(--mode-color-action-grayscale-active);\n --progress-stepflow-bg-complete: var(--mode-color-status-positive-default);\n --progress-stepflow-bg-default: var(--mode-color-generic-fg-nought);\n --progress-stepflow-border-active-inner: var(--mode-color-generic-fg-nought);\n --progress-stepflow-border-active-outer: var(--mode-color-action-grayscale-active);\n --progress-stepflow-border-default: var(--mode-color-generic-fg-firm);\n --progress-stepflow-label-alt: var(--mode-color-generic-txt-soft);\n --progress-stepflow-label-default: var(--mode-color-generic-txt-severe);\n --progress-stepindicator-bg-active: var(--mode-color-action-grayscale-active);\n --progress-stepindicator-bg-complete: var(--mode-color-status-positive-default);\n --progress-stepindicator-border-active-outer: var(--mode-color-action-grayscale-active);\n --progress-stepindicator-border-default: var(--mode-color-generic-fg-firm);\n --progress-stepindicator-border-success: var(--mode-color-status-positive-default);\n --progress-stepindicator-label-active: var(--mode-color-action-grayscale-with-active);\n --progress-stepindicator-label-complete: var(--mode-color-action-grayscale-with-active);\n --progress-stepindicator-label-default: var(--mode-color-generic-txt-severe);\n --pill-generic-none: var(--mode-color-none);\n --pill-generic-label-default: var(--mode-color-status-txt-with-default);\n --pill-generic-label-hover: var(--mode-color-status-txt-with-hover);\n --pill-generic-label-alt-default: var(--mode-color-status-txt-with-default-alt);\n --pill-generic-label-alt-hover: var(--mode-color-status-txt-with-default-alt);\n --pill-generic-inverse-label-default: var(--mode-color-status-txt-inverse-with-default);\n --pill-generic-inverse-label-hover: var(--mode-color-status-txt-inverse-with-hover);\n --pill-generic-inverse-label-alt-default: var(--mode-color-status-txt-inverse-with-default-alt);\n --pill-generic-inverse-label-alt-hover: var(--mode-color-status-txt-inverse-with-default-alt);\n --pill-blue-bg-default: var(--mode-color-status-info-default);\n --pill-blue-bg-alt-default: var(--mode-color-status-info-default-alt);\n --pill-blue-bg-alt-hover: var(--mode-color-status-info-hover-alt);\n --pill-blue-bg-hover: var(--mode-color-status-info-hover);\n --pill-blue-border-default: var(--mode-color-status-info-default);\n --pill-blue-inverse-bg-default: var(--mode-color-status-info-inverse-default);\n --pill-blue-inverse-bg-alt-default: var(--mode-color-status-info-inverse-default-alt);\n --pill-blue-inverse-bg-alt-hover: var(--mode-color-status-info-inverse-hover-alt);\n --pill-blue-inverse-bg-hover: var(--mode-color-status-info-inverse-hover);\n --pill-blue-inverse-border-default: var(--mode-color-status-info-inverse-default);\n --pill-green-bg-default: var(--mode-color-status-positive-default);\n --pill-green-bg-alt-default: var(--mode-color-status-positive-default-alt);\n --pill-green-bg-alt-hover: var(--mode-color-status-positive-hover-alt);\n --pill-green-bg-hover: var(--mode-color-status-positive-hover);\n --pill-green-border-default: var(--mode-color-status-positive-default);\n --pill-green-inverse-bg-default: var(--mode-color-status-positive-inverse-default);\n --pill-green-inverse-bg-alt-default: var(--mode-color-status-positive-inverse-default-alt);\n --pill-green-inverse-bg-alt-hover: var(--mode-color-status-positive-inverse-hover-alt);\n --pill-green-inverse-bg-hover: var(--mode-color-status-positive-inverse-hover);\n --pill-green-inverse-border-default: var(--mode-color-status-positive-inverse-default);\n --pill-gray-bg-default: var(--mode-color-status-neutral-default);\n --pill-gray-bg-alt-default: var(--mode-color-status-neutral-default-alt);\n --pill-gray-bg-alt-hover: var(--mode-color-status-neutral-hover-alt);\n --pill-gray-bg-hover: var(--mode-color-status-neutral-hover);\n --pill-gray-border-default: var(--mode-color-status-neutral-default);\n --pill-gray-inverse-bg-default: var(--mode-color-status-neutral-inverse-default);\n --pill-gray-inverse-bg-alt-default: var(--mode-color-status-neutral-inverse-default-alt);\n --pill-gray-inverse-bg-alt-hover: var(--mode-color-status-neutral-inverse-hover-alt);\n --pill-gray-inverse-bg-hover: var(--mode-color-status-neutral-inverse-hover);\n --pill-gray-inverse-border-default: var(--mode-color-status-neutral-inverse-default);\n --pill-lime-bg-default: var(--mode-color-status-custom-lime-default);\n --pill-lime-bg-alt-default: var(--mode-color-status-custom-lime-default-alt);\n --pill-lime-bg-alt-hover: var(--mode-color-status-custom-lime-hover-alt);\n --pill-lime-bg-hover: var(--mode-color-status-custom-lime-hover);\n --pill-lime-border-default: var(--mode-color-status-custom-lime-default);\n --pill-orange-bg-default: var(--mode-color-status-warning-default);\n --pill-orange-bg-alt-default: var(--mode-color-status-warning-default-alt);\n --pill-orange-bg-alt-hover: var(--mode-color-status-warning-hover-alt);\n --pill-orange-bg-hover: var(--mode-color-status-warning-hover);\n --pill-orange-border-default: var(--mode-color-status-warning-default);\n --pill-orange-inverse-bg-default: var(--mode-color-status-warning-inverse-default);\n --pill-orange-inverse-bg-alt-default: var(--mode-color-status-warning-inverse-default-alt);\n --pill-orange-inverse-bg-alt-hover: var(--mode-color-status-warning-inverse-hover-alt);\n --pill-orange-inverse-bg-hover: var(--mode-color-status-warning-inverse-hover);\n --pill-orange-inverse-border-default: var(--mode-color-status-warning-inverse-default);\n --pill-pink-bg-default: var(--mode-color-status-custom-pink-default);\n --pill-pink-bg-alt-default: var(--mode-color-status-custom-pink-default-alt);\n --pill-pink-bg-alt-hover: var(--mode-color-status-custom-pink-hover-alt);\n --pill-pink-bg-hover: var(--mode-color-status-custom-pink-hover);\n --pill-pink-border-default: var(--mode-color-status-custom-pink-default);\n --pill-purple-bg-default: var(--mode-color-status-priority-default);\n --pill-purple-bg-alt-default: var(--mode-color-status-priority-default-alt);\n --pill-purple-bg-alt-hover: var(--mode-color-status-priority-hover-alt);\n --pill-purple-bg-hover: var(--mode-color-status-priority-hover);\n --pill-purple-border-default: var(--mode-color-status-priority-default);\n --pill-purple-inverse-bg-default: var(--mode-color-status-priority-default);\n --pill-purple-inverse-bg-alt-default: var(--mode-color-status-priority-inverse-default-alt);\n --pill-purple-inverse-bg-alt-hover: var(--mode-color-status-priority-inverse-hover-alt);\n --pill-purple-inverse-bg-hover: var(--mode-color-status-priority-hover);\n --pill-purple-inverse-border-default: var(--mode-color-status-priority-default);\n --pill-red-bg-default: var(--mode-color-status-negative-default);\n --pill-red-bg-alt-default: var(--mode-color-status-negative-default-alt);\n --pill-red-bg-alt-hover: var(--mode-color-status-negative-hover-alt);\n --pill-red-bg-hover: var(--mode-color-status-negative-hover);\n --pill-red-border-default: var(--mode-color-status-negative-default);\n --pill-red-inverse-bg-default: var(--mode-color-status-negative-inverse-default);\n --pill-red-inverse-bg-alt-default: var(--mode-color-status-negative-inverse-default-alt);\n --pill-red-inverse-bg-alt-hover: var(--mode-color-status-negative-inverse-hover-alt);\n --pill-red-inverse-bg-hover: var(--mode-color-status-negative-inverse-hover);\n --pill-red-inverse-border-default: var(--mode-color-status-negative-inverse-default);\n --pill-slate-bg-default: var(--mode-color-status-custom-slate-default);\n --pill-slate-bg-alt-default: var(--mode-color-status-custom-slate-default-alt);\n --pill-slate-bg-alt-hover: var(--mode-color-status-custom-slate-hover-alt);\n --pill-slate-bg-hover: var(--mode-color-status-custom-slate-hover);\n --pill-slate-border-default: var(--mode-color-status-custom-slate-default);\n --pill-teal-bg-default: var(--mode-color-status-custom-teal-default);\n --pill-teal-bg-alt-default: var(--mode-color-status-custom-teal-default-alt);\n --pill-teal-bg-alt-hover: var(--mode-color-status-custom-teal-hover-alt);\n --pill-teal-bg-hover: var(--mode-color-status-custom-teal-hover);\n --pill-teal-border-default: var(--mode-color-status-custom-teal-default);\n --tab-bg-active: var(--mode-color-action-grayscale-with-active);\n --tab-bg-default: var(--mode-color-none);\n --tab-bg-hover: var(--mode-color-action-grayscale-hover-alt);\n --tab-border-active-alt: var(--mode-color-generic-fg-moderate);\n --tab-border-active: var(--mode-color-action-grayscale-active);\n --tab-border-default: var(--mode-color-generic-fg-moderate);\n --tab-border-hover: var(--mode-color-generic-fg-firm);\n --tab-icon-default: var(--mode-color-action-grayscale-default-alt);\n --tab-icon-hover: var(--mode-color-action-grayscale-with-hover);\n --tab-label-active: var(--mode-color-action-grayscale-active);\n --tab-icon-active: var(--mode-color-action-grayscale-active);\n --tab-label-default: var(--mode-color-action-grayscale-default);\n --tab-label-hover: var(--mode-color-action-grayscale-with-hover);\n --tab-nav-bg-default: var(--mode-color-generic-bg-nought);\n --tab-validation-border-warning: var(--mode-color-status-warning-default);\n --tab-validation-border-error: var(--mode-color-status-negative-default);\n --tab-validation-icon-error: var(--mode-color-status-negative-default);\n --tab-validation-icon-warning: var(--mode-color-status-warning-default);\n --tab-validation-label-error: var(--mode-color-status-negative-default);\n --tab-validation-label-warning: var(--mode-color-status-warning-txt);\n --table-header-subtle-bg-alt: var(--mode-color-generic-bg-faint);\n --table-header-subtle-bg-default: var(--mode-color-none);\n --table-header-subtle-border-default: var(--mode-color-generic-fg-soft);\n --table-header-subtle-label-default: var(--mode-color-generic-txt-severe);\n --table-header-harsh-bg-alt: var(--mode-color-generic-surface-severe);\n --table-header-harsh-bg-default: var(--mode-color-generic-surface-harsh);\n --table-header-harsh-border-default: var(--mode-color-generic-fg-soft);\n --table-header-harsh-label-default: var(--mode-color-generic-txt-inverse-severe);\n --table-row-bg-default: var(--mode-color-generic-bg-nought);\n --table-row-bg-alt: var(--mode-color-generic-bg-delicate);\n --table-row-bg-alt2: var(--mode-color-generic-bg-faint);\n --table-row-bg-selected: var(--mode-color-generic-bg-soft);\n --table-row-border-default: var(--mode-color-generic-fg-soft);\n --table-row-label-default: var(--mode-color-generic-txt-severe);\n --table-row-label-selected: var(--mode-color-generic-txt-extreme);\n --table-footer-bg-default: var(--mode-color-generic-bg-soft);\n --table-footer-border-default: var(--mode-color-generic-fg-soft);\n --table-footer-label-default: var(--mode-color-generic-txt-severe);\n";export{o as default};
package/esm/components/tooltip/tooltip.component.js CHANGED
@@ -1 +1 @@
1
- import{jsxs as e,Fragment as t,jsx as r}from"react/jsx-runtime";import o,{useRef as n,useState as i,useEffect as l,useCallback as c,useMemo as p}from"react";import s from"invariant";import{offset as a,flip as u,shift as f,arrow as m,limitShift as b,useFloating as d,autoUpdate as y}from"@floating-ui/react-dom";import O from"./tooltip.style.js";import g from"./tooltip-pointer.style.js";import{TOOLTIP_POSITIONS as j}from"./tooltip.config.js";import h from"../../__internal__/utils/helpers/tags/tags.js";import v from"../portal/portal.js";function w(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function P(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},o=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),o.forEach((function(t){w(e,t,r[t])}))}return e}function x(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}function E(e,t){e&&("function"==typeof e&&e(t),"object"==typeof e&&"current"in e&&(e.current=t))}const S=o.forwardRef(((w,S)=>{var{children:C,isVisible:T,position:z="top",message:D,type:k,size:A="medium",isPartOfInput:I,inputSize:_="medium",id:L,bgColor:V,fontColor:M,flipOverrides:N,target:R}=w,q=function(e,t){if(null==e)return{};var r,o,n=function(e,t){if(null==e)return{};var r,o,n={},i=Object.keys(e);for(o=0;o<i.length;o++)r=i[o],t.indexOf(r)>=0||(n[r]=e[r]);return n}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(o=0;o<i.length;o++)r=i[o],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}(w,["children","isVisible","position","message","type","size","isPartOfInput","inputSize","id","bgColor","fontColor","flipOverrides","target"]);const B=n(null),F=void 0!==T,[G,H]=i(!1);let J=G;F&&(J=T);const K=n(void 0),Q=n(void 0);l((()=>()=>{clearTimeout(K.current),clearTimeout(Q.current)}),[]);const U=c((()=>H(!0)),[]),W=c((()=>H(!1)),[]),X=c((()=>{K.current=window.setTimeout(U,100)}),[U]),Y=c((()=>{Q.current=window.setTimeout(W,100)}),[W]);l((()=>{const e={mouseenter:X,mouseleave:Y,focus:U,blur:W},t=R||B.current;return F||Object.entries(e).forEach((([e,r])=>{null==t||t.addEventListener(e,r)})),()=>{F||Object.entries(e).forEach((([e,r])=>{null==t||t.removeEventListener(e,r)}))}}),[C,U,X,W,Y,F,R]);const Z=n(N);Z.current=N;const $=n(null),ee=c((e=>{let t=9;return I&&(t={small:5,medium:["top","bottom"].includes(e)?6:8,large:["top","bottom"].includes(e)?10:12}[_]),t}),[_,I]),te=p((()=>[a((({placement:e})=>({mainAxis:ee(e)}))),u({fallbackPlacements:Z.current}),f({padding:5,limiter:b({offset:({rects:e})=>({mainAxis:e.reference.height})})}),m({element:$})]),[ee,$]),{x:re,y:oe,reference:ne,floating:ie,strategy:le,placement:ce,middlewareData:pe}=d({placement:z,middleware:te,whileElementsMounted:y}),se={position:le,top:null!=oe?oe:0,left:null!=re?re:0},ae=c((e=>{ne(R||e),B.current=e,E(C.ref,e)}),[ne,C,R]),ue=c((e=>{ie(e),E(S,e)}),[ie,S]),fe={top:"bottom",right:"left",bottom:"top",left:"right"}[ce.split("-")[0]],{x:me,y:be}=pe.arrow||{},de={left:me,top:be,[fe]:"-6px"},ye=!N||Array.isArray(N)&&N.every((e=>j.includes(e)));return s(ye,'The flipOverrides prop supplied to Tooltip must be an array containing some or all of ["top", "bottom", "left", "right"].'),e(t,{children:[o.cloneElement(C,{ref:ae}),J?r(v,{children:e(O,x(P({"data-element":"tooltip","data-role":"tooltip",role:"tooltip",tabIndex:-1,type:k,size:A,id:L},h("tooltip",q)),{ref:ue,bgColor:V,fontColor:M,style:se,"data-placement":ce,children:[r(g,{type:k,ref:$,"data-element":"tooltip-pointer","data-role":"tooltip-pointer",bgColor:V,style:de}),D]}))}):null]})}));S.displayName="Tooltip";export{S as Tooltip,S as default};
1
+ import{jsxs as e,Fragment as t,jsx as r}from"react/jsx-runtime";import o,{useRef as n,useState as i,useEffect as l,useCallback as c,useMemo as p}from"react";import s from"invariant";import{offset as a,flip as u,shift as f,limitShift as m,arrow as b,useFloating as d,autoUpdate as y}from"@floating-ui/react-dom";import O from"./tooltip.style.js";import g from"./tooltip-pointer.style.js";import{TOOLTIP_POSITIONS as j}from"./tooltip.config.js";import h from"../../__internal__/utils/helpers/tags/tags.js";import v from"../portal/portal.js";function w(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function P(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},o=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),o.forEach((function(t){w(e,t,r[t])}))}return e}function x(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}function E(e,t){e&&("function"==typeof e&&e(t),"object"==typeof e&&"current"in e&&(e.current=t))}const S=o.forwardRef(((w,S)=>{var{children:C,isVisible:T,position:z="top",message:D,type:k,size:A="medium",isPartOfInput:I,inputSize:_="medium",id:L,bgColor:V,fontColor:M,flipOverrides:N,target:R}=w,q=function(e,t){if(null==e)return{};var r,o,n=function(e,t){if(null==e)return{};var r,o,n={},i=Object.keys(e);for(o=0;o<i.length;o++)r=i[o],t.indexOf(r)>=0||(n[r]=e[r]);return n}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(o=0;o<i.length;o++)r=i[o],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(n[r]=e[r])}return n}(w,["children","isVisible","position","message","type","size","isPartOfInput","inputSize","id","bgColor","fontColor","flipOverrides","target"]);const B=n(null),F=void 0!==T,[G,H]=i(!1);let J=G;F&&(J=T);const K=n(void 0),Q=n(void 0);l((()=>()=>{clearTimeout(K.current),clearTimeout(Q.current)}),[]);const U=c((()=>H(!0)),[]),W=c((()=>H(!1)),[]),X=c((()=>{K.current=window.setTimeout(U,100)}),[U]),Y=c((()=>{Q.current=window.setTimeout(W,100)}),[W]);l((()=>{const e={mouseenter:X,mouseleave:Y,focus:U,blur:W},t=R||B.current;return F||Object.entries(e).forEach((([e,r])=>{null==t||t.addEventListener(e,r)})),()=>{F||Object.entries(e).forEach((([e,r])=>{null==t||t.removeEventListener(e,r)}))}}),[C,U,X,W,Y,F,R]);const Z=n(N);Z.current=N;const $=n(null),ee=c((e=>{let t=9;return I&&(t={small:5,medium:["top","bottom"].includes(e)?6:8,large:["top","bottom"].includes(e)?10:12}[_]),t}),[_,I]),te=p((()=>[a((({placement:e})=>({mainAxis:ee(e)}))),u({fallbackPlacements:Z.current}),f({padding:5,limiter:m({offset:({rects:e})=>({mainAxis:e.reference.height})})}),b({element:$})]),[ee,$]),{x:re,y:oe,reference:ne,floating:ie,strategy:le,placement:ce,middlewareData:pe}=d({placement:z,middleware:te,whileElementsMounted:y}),se={position:le,top:null!=oe?oe:0,left:null!=re?re:0},ae=c((e=>{ne(R||e),B.current=e,E(C.ref,e)}),[ne,C,R]),ue=c((e=>{ie(e),E(S,e)}),[ie,S]),fe={top:"bottom",right:"left",bottom:"top",left:"right"}[ce.split("-")[0]],{x:me,y:be}=pe.arrow||{},de={left:me,top:be,[fe]:"-6px"},ye=!N||Array.isArray(N)&&N.every((e=>j.includes(e)));return s(ye,'The flipOverrides prop supplied to Tooltip must be an array containing some or all of ["top", "bottom", "left", "right"].'),e(t,{children:[o.cloneElement(C,{ref:ae}),J?r(v,{children:e(O,x(P({"data-element":"tooltip","data-role":"tooltip",role:"tooltip",tabIndex:-1,type:k,size:A,id:L},h("tooltip",q)),{ref:ue,bgColor:V,fontColor:M,style:se,"data-placement":ce,children:[r(g,{type:k,ref:$,"data-element":"tooltip-pointer","data-role":"tooltip-pointer",bgColor:V,style:de}),D]}))}):null]})}));S.displayName="Tooltip";export{S as Tooltip,S as default};
package/esm/components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu-item/responsive-vertical-menu-item.component.js CHANGED
@@ -1 +1 @@
1
- import{jsx as e,jsxs as n,Fragment as r}from"react/jsx-runtime";import t,{useRef as i,forwardRef as o,createContext as c,useMemo as l,useState as s}from"react";import{StyledResponsiveMenu as a}from"../responsive-vertical-menu.style.js";import{StyledResponsiveMenuListItem as d,StyledResponsiveMenuItem as p,StyledIcon as u,StyledNestedMenuWrapper as m,StyledNestedMenu as v,StyledMenuItemContent as h,StyledResponsiveMenuActionButton as f,StyledResponsiveMenuActionLink as y}from"./responsive-vertical-menu-item.style.js";import"../../../../style/utils/filter-styled-system-padding-props.js";import b from"../../../../style/utils/filter-styled-system-margin-props.js";import{useDepth as O,IncreaseDepth as j}from"../__internal__/depth.context.js";import{useResponsiveVerticalMenu as g}from"../responsive-vertical-menu.context.js";import w from"../../../icon/icon.component.js";import _ from"../../../../__internal__/utils/helpers/guid/index.js";import P from"../../../../__internal__/utils/helpers/events/events.js";function x(e,n,r){return n in e?Object.defineProperty(e,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[n]=r,e}function I(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{},t=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),t.forEach((function(n){x(e,n,r[n])}))}return e}function C(e,n){return n=null!=n?n:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):function(e){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n.push.apply(n,r)}return n}(Object(n)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})),e}function $(e,n){if(null==e)return{};var r,t,i=function(e,n){if(null==e)return{};var r,t,i={},o=Object.keys(e);for(t=0;t<o.length;t++)r=o[t],n.indexOf(r)>=0||(i[r]=e[r]);return i}(e,n);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(t=0;t<o.length;t++)r=o[t],n.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r])}return i}const k=c(void 0),D=({customIcon:r,depth:t,hasChildren:i,icon:o,label:c,responsive:l})=>n(h,r?{"data-component":"responsive-vertical-menu-custom-icon","data-role":"responsive-vertical-menu-custom-icon",depth:t,hasChildren:i,icon:!0,responsive:l,children:[r,c]}:{"data-component":"responsive-vertical-menu-icon","data-role":"responsive-vertical-menu-icon",depth:t,hasChildren:i,icon:!!o,responsive:l,children:[o&&e(w,{type:o}),c]}),S=o(((o,c)=>{var{children:h,customIcon:j,icon:w,id:_,href:x,label:S,onClick:M,rel:K,target:E,ariaCurrent:A}=o,q=$(o,["children","customIcon","icon","id","href","label","onClick","rel","target","ariaCurrent"]);const{activeMenuItem:z,responsiveMode:B,setActive:F,setActiveMenuItem:G,reducedMotion:H,left:J,top:L,width:N,height:Q}=g(),R=O(),T=(null==z?void 0:z.id)===_,U=t.Children.count(h)>0,V=i(null),W=l((()=>B&&0===R),[R,B]),[X,Y]=s(W&&U||R>=2),Z=e=>{if(P.isEnterKey(e)||P.isSpaceKey(e)){if(U&&e.preventDefault(),!M&&P.isSpaceKey(e)&&e.preventDefault(),W)return;if(U)if(0!==R||B)Y(!X);else{const e=(null==z?void 0:z.id)===_;G(e?null:{id:_,label:S,children:h})}}},ee=e=>{null==M||M(e),F(!1)};return e(d,C(I({},b(q)),{children:U?n(r,{children:[n(p,C(I({active:T,"aria-expanded":B&&0===R?void 0:T||X,"aria-controls":T||X?B?0===R?void 0:`${_}-nested-menu-wrapper`:"responsive-vertical-menu-secondary":void 0,"data-component":`responsive-vertical-menu-item-${_}`,"data-depth":R,"data-role":`responsive-vertical-menu-item-${_}`,depth:R,hasIcon:!!w||!!j,id:_,onClick:()=>{if(!W)if(0!==R||B)Y(!X);else{const e=(null==z?void 0:z.id)===_;G(e?null:{id:_,label:S,children:h})}},onKeyDown:e=>{B||Z(e)},ref:c,responsive:B,tabIndex:W?-1:0,type:"button"},q),{children:[e(D,{customIcon:j,depth:R,hasChildren:!0,icon:w,label:S,responsive:B}),!W&&e(u,{"data-component":"responsive-vertical-menu-expander-icon","data-role":"responsive-vertical-menu-expander-icon",depth:R,expanded:X||T,reduceMotion:!!H,type:R>=1?"chevron_down_thick":"chevron_right_thick"})]})),X&&e(m,{"data-component":`${_}-nested-menu-wrapper`,"data-role":`${_}-nested-menu-wrapper`,depth:R,hasIcon:!!w||!!j,id:`${_}-nested-menu-wrapper`,responsive:B,children:e(v,{"data-component":`${_}-nested-menu`,"data-role":`${_}-nested-menu`,depth:R,hasIcon:!!w||!!j,id:`${_}-nested-menu`,responsive:B,children:e(k.Provider,{value:_,children:h})})}),T&&!B&&e(a,{"data-component":"responsive-vertical-menu-secondary","data-role":"responsive-vertical-menu-secondary",height:Q||"100%",id:"responsive-vertical-menu-secondary",left:J,menu:"secondary",reduceMotion:!1,ref:V,responsive:!1,tabIndex:-1,top:L,width:N,children:z.children})]}):(()=>{const n=I({"data-component":`responsive-vertical-menu-item-${_}`,"data-depth":R,"data-role":`responsive-vertical-menu-item-${_}`,"aria-current":A,depth:R,href:x,id:_,onClick:ee,onKeyDown:e=>{B||Z(e)},rel:K,responsive:B,tabIndex:0,target:E},q),r=e(D,{customIcon:j,depth:R,hasChildren:!1,icon:w,label:S,responsive:B});return e(M&&!x?f:y,C(I({ref:c},n),{children:r}))})()}))})),M=n=>{var{children:r,id:t,label:o}=n,c=$(n,["children","id","label"]);const l=O(),s=i(null),a=i(t||_());return e(S,C(I({id:a.current,label:o},c),{"data-depth":l,ref:s,children:r&&e(k.Provider,{value:t,children:e(j,{children:r})})}))};export{M as ResponsiveVerticalMenuItem,M as default};
1
+ import{jsx as e,jsxs as n,Fragment as r}from"react/jsx-runtime";import t,{useRef as i,forwardRef as o,useMemo as c,useState as l,createContext as s}from"react";import{StyledResponsiveMenu as a}from"../responsive-vertical-menu.style.js";import{StyledResponsiveMenuListItem as d,StyledResponsiveMenuItem as p,StyledIcon as u,StyledNestedMenuWrapper as m,StyledNestedMenu as v,StyledMenuItemContent as h,StyledResponsiveMenuActionButton as f,StyledResponsiveMenuActionLink as y}from"./responsive-vertical-menu-item.style.js";import"../../../../style/utils/filter-styled-system-padding-props.js";import b from"../../../../style/utils/filter-styled-system-margin-props.js";import{useDepth as O,IncreaseDepth as j}from"../__internal__/depth.context.js";import{useResponsiveVerticalMenu as g}from"../responsive-vertical-menu.context.js";import w from"../../../icon/icon.component.js";import _ from"../../../../__internal__/utils/helpers/guid/index.js";import P from"../../../../__internal__/utils/helpers/events/events.js";function x(e,n,r){return n in e?Object.defineProperty(e,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[n]=r,e}function I(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{},t=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(t=t.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),t.forEach((function(n){x(e,n,r[n])}))}return e}function C(e,n){return n=null!=n?n:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):function(e){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n.push.apply(n,r)}return n}(Object(n)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(n,r))})),e}function $(e,n){if(null==e)return{};var r,t,i=function(e,n){if(null==e)return{};var r,t,i={},o=Object.keys(e);for(t=0;t<o.length;t++)r=o[t],n.indexOf(r)>=0||(i[r]=e[r]);return i}(e,n);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(t=0;t<o.length;t++)r=o[t],n.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(i[r]=e[r])}return i}const k=s(void 0),D=({customIcon:r,depth:t,hasChildren:i,icon:o,label:c,responsive:l})=>n(h,r?{"data-component":"responsive-vertical-menu-custom-icon","data-role":"responsive-vertical-menu-custom-icon",depth:t,hasChildren:i,icon:!0,responsive:l,children:[r,c]}:{"data-component":"responsive-vertical-menu-icon","data-role":"responsive-vertical-menu-icon",depth:t,hasChildren:i,icon:!!o,responsive:l,children:[o&&e(w,{type:o}),c]}),S=o(((o,s)=>{var{children:h,customIcon:j,icon:w,id:_,href:x,label:S,onClick:M,rel:K,target:E,ariaCurrent:A}=o,q=$(o,["children","customIcon","icon","id","href","label","onClick","rel","target","ariaCurrent"]);const{activeMenuItem:z,responsiveMode:B,setActive:F,setActiveMenuItem:G,reducedMotion:H,left:J,top:L,width:N,height:Q}=g(),R=O(),T=(null==z?void 0:z.id)===_,U=t.Children.count(h)>0,V=i(null),W=c((()=>B&&0===R),[R,B]),[X,Y]=l(W&&U||R>=2),Z=e=>{if(P.isEnterKey(e)||P.isSpaceKey(e)){if(U&&e.preventDefault(),!M&&P.isSpaceKey(e)&&e.preventDefault(),W)return;if(U)if(0!==R||B)Y(!X);else{const e=(null==z?void 0:z.id)===_;G(e?null:{id:_,label:S,children:h})}}},ee=e=>{null==M||M(e),F(!1)};return e(d,C(I({},b(q)),{children:U?n(r,{children:[n(p,C(I({active:T,"aria-expanded":B&&0===R?void 0:T||X,"aria-controls":T||X?B?0===R?void 0:`${_}-nested-menu-wrapper`:"responsive-vertical-menu-secondary":void 0,"data-component":`responsive-vertical-menu-item-${_}`,"data-depth":R,"data-role":`responsive-vertical-menu-item-${_}`,depth:R,hasIcon:!!w||!!j,id:_,onClick:()=>{if(!W)if(0!==R||B)Y(!X);else{const e=(null==z?void 0:z.id)===_;G(e?null:{id:_,label:S,children:h})}},onKeyDown:e=>{B||Z(e)},ref:s,responsive:B,tabIndex:W?-1:0,type:"button"},q),{children:[e(D,{customIcon:j,depth:R,hasChildren:!0,icon:w,label:S,responsive:B}),!W&&e(u,{"data-component":"responsive-vertical-menu-expander-icon","data-role":"responsive-vertical-menu-expander-icon",depth:R,expanded:X||T,reduceMotion:!!H,type:R>=1?"chevron_down_thick":"chevron_right_thick"})]})),X&&e(m,{"data-component":`${_}-nested-menu-wrapper`,"data-role":`${_}-nested-menu-wrapper`,depth:R,hasIcon:!!w||!!j,id:`${_}-nested-menu-wrapper`,responsive:B,children:e(v,{"data-component":`${_}-nested-menu`,"data-role":`${_}-nested-menu`,depth:R,hasIcon:!!w||!!j,id:`${_}-nested-menu`,responsive:B,children:e(k.Provider,{value:_,children:h})})}),T&&!B&&e(a,{"data-component":"responsive-vertical-menu-secondary","data-role":"responsive-vertical-menu-secondary",height:Q||"100%",id:"responsive-vertical-menu-secondary",left:J,menu:"secondary",reduceMotion:!1,ref:V,responsive:!1,tabIndex:-1,top:L,width:N,children:z.children})]}):(()=>{const n=I({"data-component":`responsive-vertical-menu-item-${_}`,"data-depth":R,"data-role":`responsive-vertical-menu-item-${_}`,"aria-current":A,depth:R,href:x,id:_,onClick:ee,onKeyDown:e=>{B||Z(e)},rel:K,responsive:B,tabIndex:0,target:E},q),r=e(D,{customIcon:j,depth:R,hasChildren:!1,icon:w,label:S,responsive:B});return e(M&&!x?f:y,C(I({ref:s},n),{children:r}))})()}))})),M=n=>{var{children:r,id:t,label:o}=n,c=$(n,["children","id","label"]);const l=O(),s=i(null),a=i(t||_());return e(S,C(I({id:a.current,label:o},c),{"data-depth":l,ref:s,children:r&&e(k.Provider,{value:t,children:e(j,{children:r})})}))};export{M as ResponsiveVerticalMenuItem,M as default};
package/esm/components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu.context.js CHANGED
@@ -1 +1 @@
1
- import{jsx as e}from"react/jsx-runtime";import{createContext as t,useContext as n,useState as i,useRef as r}from"react";import o from"../../../__internal__/utils/logger/index.js";const s=t(null),u=()=>{const e=n(s);if(null===e)throw new Error("useResponsiveVerticalMenu must be used within a ResponsiveVerticalMenuProvider");return e};let l=!1;const c=({children:t,width:u,height:c})=>{const d=n(s);!l&&null!==d&&(l=!0,o.deprecate("`ResponsiveVerticalMenuProvider` is deprecated and no longer needed for `ResponsiveVerticalMenu`. You can use `ResponsiveVerticalMenu` directly without wrapping it in a provider."));const[a,p]=i(!1),[v,h]=i(null),m=r(null),M=r(null),f=r(null),[R,w]=i(!1),[g,V]=i(!1),[_,x]=i("auto"),[P,b]=i("auto");return e(s.Provider,{value:{active:a,activeMenuItem:v,buttonRef:m,containerRef:M,menuRef:f,reducedMotion:g,responsiveMode:R,left:_,top:P,width:u,height:c,setActive:p,setActiveMenuItem:h,setReducedMotion:V,setResponsiveMode:w,setLeft:x,setTop:b},children:t})};export{s as ResponsiveVerticalMenuContext,c as ResponsiveVerticalMenuProvider,u as useResponsiveVerticalMenu};
1
+ import{jsx as e}from"react/jsx-runtime";import{useContext as t,useState as n,useRef as i,createContext as r}from"react";import o from"../../../__internal__/utils/logger/index.js";const s=r(null),u=()=>{const e=t(s);if(null===e)throw new Error("useResponsiveVerticalMenu must be used within a ResponsiveVerticalMenuProvider");return e};let l=!1;const c=({children:r,width:u,height:c})=>{const d=t(s);!l&&null!==d&&(l=!0,o.deprecate("`ResponsiveVerticalMenuProvider` is deprecated and no longer needed for `ResponsiveVerticalMenu`. You can use `ResponsiveVerticalMenu` directly without wrapping it in a provider."));const[a,p]=n(!1),[v,h]=n(null),m=i(null),M=i(null),f=i(null),[R,w]=n(!1),[g,V]=n(!1),[_,x]=n("auto"),[P,b]=n("auto");return e(s.Provider,{value:{active:a,activeMenuItem:v,buttonRef:m,containerRef:M,menuRef:f,reducedMotion:g,responsiveMode:R,left:_,top:P,width:u,height:c,setActive:p,setActiveMenuItem:h,setReducedMotion:V,setResponsiveMode:w,setLeft:x,setTop:b},children:r})};export{s as ResponsiveVerticalMenuContext,c as ResponsiveVerticalMenuProvider,u as useResponsiveVerticalMenu};
package/esm/hooks/__internal__/useStableCallback/index.js CHANGED
@@ -1 +1 @@
1
- export{useStableCallback as default}from"./useStableCallback.js";
1
+ export{default}from"./useStableCallback.js";
package/esm/hooks/use-multi-input/index.js CHANGED
@@ -1 +1 @@
1
- export{useMultiInput as default}from"./use-multi-input.js";
1
+ export{default}from"./use-multi-input.js";
package/esm/index.js CHANGED
@@ -1 +1 @@
1
- export{Accordion}from"./components/accordion/accordion.component.js";export{AccordionGroup}from"./components/accordion/accordion-group/accordion-group.component.js";export{ActionPopover}from"./components/action-popover/action-popover.component.js";export{default as ActionPopoverMenu}from"./components/action-popover/action-popover-menu/action-popover-menu.component.js";export{ActionPopoverItem}from"./components/action-popover/action-popover-item/action-popover-item.component.js";export{ActionPopoverMenuButton}from"./components/action-popover/action-popover-menu-button/action-popover-menu-button.component.js";import"./components/action-popover/action-popover-divider/action-popover-divider.component.js";export{AdaptiveSidebar}from"./components/adaptive-sidebar/adaptive-sidebar.component.js";export{AdvancedColorPicker}from"./components/advanced-color-picker/advanced-color-picker.component.js";export{Alert}from"./components/alert/alert.component.js";export{default as AnchorNavigation}from"./components/anchor-navigation/anchor-navigation.component.js";export{default as AnchorNavigationItem}from"./components/anchor-navigation/anchor-navigation-item/anchor-navigation-item.component.js";export{default as AnchorSectionDivider}from"./components/anchor-navigation/anchor-section-divider.component.js";export{Badge}from"./components/badge/badge.component.js";export{BatchSelection}from"./components/batch-selection/batch-selection.component.js";export{Box}from"./components/box/box.component.js";export{Breadcrumbs}from"./components/breadcrumbs/breadcrumbs.component.js";export{Crumb}from"./components/breadcrumbs/crumb/crumb.component.js";export{ButtonBar}from"./components/button-bar/button-bar.component.js";export{ButtonMinor}from"./components/button-minor/button-minor.component.js";export{ButtonToggle}from"./components/button-toggle/button-toggle.component.js";export{default as ButtonToggleGroup}from"./components/button-toggle/button-toggle-group/button-toggle-group.component.js";export{default as Button}from"./components/button/button.component.js";export{CarbonProvider}from"./components/carbon-provider/carbon-provider.component.js";export{default as Card}from"./components/card/card.component.js";export{default as CardColumn}from"./components/card/card-column/card-column.component.js";export{default as CardFooter}from"./components/card/card-footer/card-footer.component.js";export{default as CardRow}from"./components/card/card-row/card-row.component.js";export{CheckboxGroup}from"./components/checkbox/checkbox-group/checkbox-group.component.js";export{Checkbox}from"./components/checkbox/checkbox.component.js";export{Confirm}from"./components/confirm/confirm.component.js";export{Content}from"./components/content/content.component.js";export{DateRange}from"./components/date-range/date-range.component.js";export{DateInput}from"./components/date/date.component.js";export{Decimal}from"./components/decimal/decimal.component.js";export{default as Dl}from"./components/definition-list/dl.component.js";export{default as Dt}from"./components/definition-list/dt/dt.component.js";export{default as Dd}from"./components/definition-list/dd/dd.component.js";export{Detail}from"./components/detail/detail.component.js";export{Dialog}from"./components/dialog/dialog.component.js";export{DismissibleBox}from"./components/dismissible-box/dismissible-box.component.js";export{default as DraggableContainer}from"./components/draggable/draggable-container.component.js";export{default as DraggableItem}from"./components/draggable/draggable-item/draggable-item.component.js";export{Drawer}from"./components/drawer/drawer.component.js";export{DuellingPicklist}from"./components/duelling-picklist/duelling-picklist.component.js";export{default as PicklistDivider}from"./components/duelling-picklist/picklist-divider/picklist-divider.component.js";export{PicklistItem}from"./components/duelling-picklist/picklist-item/picklist-item.component.js";export{Picklist}from"./components/duelling-picklist/picklist/picklist.component.js";export{PicklistPlaceholder}from"./components/duelling-picklist/picklist-placeholder/picklist-placeholder.component.js";export{PicklistGroup}from"./components/duelling-picklist/picklist-group/picklist-group.component.js";export{Fieldset}from"./components/fieldset/fieldset.component.js";export{FileInput}from"./components/file-input/file-input.component.js";export{FlatTable}from"./components/flat-table/flat-table.component.js";export{FlatTableHead}from"./components/flat-table/flat-table-head/flat-table-head.component.js";export{FlatTableHeader}from"./components/flat-table/flat-table-header/flat-table-header.component.js";export{FlatTableBody}from"./components/flat-table/flat-table-body/flat-table-body.component.js";export{FlatTableRow}from"./components/flat-table/flat-table-row/flat-table-row.component.js";export{FlatTableRowHeader}from"./components/flat-table/flat-table-row-header/flat-table-row-header.component.js";export{FlatTableCell}from"./components/flat-table/flat-table-cell/flat-table-cell.component.js";export{FlatTableCheckbox}from"./components/flat-table/flat-table-checkbox/flat-table-checkbox.component.js";export{FlatTableBodyDraggable}from"./components/flat-table/flat-table-body-draggable/flat-table-body-draggable.component.js";export{Sort}from"./components/flat-table/sort/sort.component.js";export{Form}from"./components/form/form.component.js";export{default as RequiredFieldsIndicator}from"./components/form/required-fields-indicator/required-fields-indicator.component.js";export{default as GlobalHeader}from"./components/global-header/global-header.component.js";export{GridContainer}from"./components/grid/grid-container/grid-container.component.js";export{GridItem}from"./components/grid/grid-item/grid-item.component.js";export{GroupedCharacter}from"./components/grouped-character/grouped-character.component.js";export{Heading}from"./components/heading/heading.component.js";export{Help}from"./components/help/help.component.js";export{Hr}from"./components/hr/hr.component.js";export{I18nProvider}from"./components/i18n-provider/i18n-provider.component.js";export{default as IconButton}from"./components/icon-button/icon-button.component.js";export{default as Icon}from"./components/icon/icon.component.js";export{Image}from"./components/image/image.component.js";export{default as InlineInputs}from"./components/inline-inputs/inline-inputs.component.js";export{LinkPreview}from"./components/link-preview/link-preview.component.js";export{Link}from"./components/link/link.component.js";export{Loader}from"./components/loader/loader.component.js";export{LoaderBar}from"./components/loader-bar/loader-bar.component.js";export{LoaderSpinner}from"./components/loader-spinner/loader-spinner.component.js";export{default as LoaderStar}from"./components/loader-star/loader-star.component.js";export{Loader as NextLoader}from"./components/loader/__next__/loader.component.js";export{Menu}from"./components/menu/menu.component.js";export{MenuItem}from"./components/menu/menu-item/menu-item.component.js";export{default as MenuDivider}from"./components/menu/menu-divider/menu-divider.component.js";export{default as MenuSegmentTitle}from"./components/menu/menu-segment-title/menu-segment-title.component.js";export{MenuFullscreen}from"./components/menu/menu-full-screen/menu-full-screen.component.js";export{ScrollableBlock}from"./components/menu/scrollable-block/scrollable-block.component.js";export{Message}from"./components/message/message.component.js";export{default as Modal}from"./components/modal/index.js";export{MultiActionButton}from"./components/multi-action-button/multi-action-button.component.js";export{NavigationBar}from"./components/navigation-bar/navigation-bar.component.js";export{Note}from"./components/note/note.component.js";export{Number}from"./components/number/number.component.js";export{NumeralDate}from"./components/numeral-date/numeral-date.component.js";export{Pager}from"./components/pager/pager.component.js";export{default as Pages}from"./components/pages/pages.component.js";export{default as Page}from"./components/pages/page/page.component.js";export{Password}from"./components/password/password.component.js";export{Pill}from"./components/pill/pill.component.js";export{default as Pod}from"./components/pod/pod.component.js";export{PopoverContainer}from"./components/popover-container/popover-container.component.js";export{default as Portal}from"./components/portal/portal.js";export{Portrait}from"./components/portrait/portrait.component.js";export{Preview}from"./components/preview/preview.component.js";export{Profile}from"./components/profile/profile.component.js";export{default as ProgressTracker}from"./components/progress-tracker/progress-tracker.component.js";export{default as RadioButton}from"./components/radio-button/radio-button.component.js";export{RadioButtonGroup}from"./components/radio-button/radio-button-group/radio-button-group.component.js";export{Search}from"./components/search/search.component.js";export{default as Option}from"./components/select/option/option.component.js";export{default as OptionRow}from"./components/select/option-row/option-row.component.js";export{default as OptionGroupHeader}from"./components/select/option-group-header/option-group-header.component.js";export{SimpleSelect as Select}from"./components/select/simple-select/simple-select.component.js";export{FilterableSelect}from"./components/select/filterable-select/filterable-select.component.js";export{MultiSelect}from"./components/select/multi-select/multi-select.component.js";export{default as setupSelectMocks}from"./components/select/setup-select-mocks.js";export{SettingsRow}from"./components/settings-row/settings-row.component.js";export{Sidebar}from"./components/sidebar/sidebar.component.js";export{SimpleColorPicker}from"./components/simple-color-picker/simple-color-picker.component.js";export{SimpleColor}from"./components/simple-color-picker/simple-color/simple-color.component.js";export{SplitButton}from"./components/split-button/split-button.component.js";export{StepFlowTitle}from"./components/step-flow/step-flow-title/step-flow-title.component.js";export{StepFlow}from"./components/step-flow/step-flow.component.js";export{StepSequence}from"./components/step-sequence/step-sequence.component.js";export{StepSequenceItem}from"./components/step-sequence/step-sequence-item/step-sequence-item.component.js";export{Switch}from"./components/switch/switch.component.js";export{Tabs}from"./components/tabs/tabs.component.js";export{Tab}from"./components/tabs/tab/tab.component.js";export{TextEditor}from"./components/text-editor/text-editor.component.js";export{createEmpty,createFromHTML}from"./components/text-editor/__internal__/__utils__/helpers.js";import"react/jsx-runtime";import"@lexical/react/LexicalComposerContext";import"@lexical/react/LexicalTypeaheadMenuPlugin";import"lexical";import"react";import"react-dom";import"./components/text-editor/__internal__/__ui__/Mentions/constants.js";import"./components/text-editor/__internal__/__ui__/Mentions/mentions.style.js";import"./__internal__/i18n-context/index.js";export{Textarea}from"./components/textarea/textarea.component.js";export{Textbox}from"./components/textbox/textbox.component.js";export{default as TileSelect}from"./components/tile-select/tile-select.component.js";export{TileSelectGroup}from"./components/tile-select/tile-select-group/tile-select-group.component.js";export{Tile}from"./components/tile/tile.component.js";export{default as TileContent}from"./components/tile/tile-content/tile-content.component.js";export{TileFooter}from"./components/tile/tile-footer/tile-footer.component.js";export{TileHeader}from"./components/tile/tile-header/tile-header.component.js";export{FlexTileContainer}from"./components/tile/flex-tile-container/flex-tile-container.component.js";export{FlexTileCell}from"./components/tile/flex-tile-cell/flex-tile-cell.component.js";export{FlexTileDivider}from"./components/tile/flex-tile-divider/flex-tile-divider.component.js";export{default as Time}from"./components/time/time.component.js";export{Toast}from"./components/toast/toast.component.js";export{Tooltip}from"./components/tooltip/tooltip.component.js";export{Typography}from"./components/typography/typography.component.js";export{List,ListItem}from"./components/typography/list.component.js";export{VerticalDivider}from"./components/vertical-divider/vertical-divider.component.js";export{VerticalMenu}from"./components/vertical-menu/vertical-menu.component.js";export{VerticalMenuItem}from"./components/vertical-menu/vertical-menu-item/vertical-menu-item.component.js";export{VerticalMenuFullScreen}from"./components/vertical-menu/vertical-menu-full-screen/vertical-menu-full-screen.component.js";export{VerticalMenuTrigger}from"./components/vertical-menu/vertical-menu-trigger/vertical-menu-trigger.component.js";import"./components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu.style.js";import"react-transition-group";import"./hooks/__internal__/useScrollBlock/useScrollBlock.js";import"./__internal__/modal/modal-manager.js";import"./__internal__/modal/modal.style.js";import"./__internal__/modal/modal.context.js";export{default as useMediaQuery}from"./hooks/useMediaQuery/useMediaQuery.js";import"./components/carbon-provider/__internal__/top-modal.context.js";import"./components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu-item/responsive-vertical-menu-item.style.js";import"./style/utils/filter-styled-system-padding-props.js";import"./components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu-divider/responsive-vertical-menu-divider.style.js";export{default as useCharacterCount}from"./hooks/useCharacterCount/useCharacterCount.js";export{default as GlobalStyle}from"./style/global-style.js";export{MenuItemDivider as ActionPopoverDivider}from"./components/action-popover/action-popover.style.js";
1
+ export{Accordion}from"./components/accordion/accordion.component.js";export{AccordionGroup}from"./components/accordion/accordion-group/accordion-group.component.js";export{ActionPopover}from"./components/action-popover/action-popover.component.js";export{default as ActionPopoverMenu}from"./components/action-popover/action-popover-menu/action-popover-menu.component.js";export{ActionPopoverItem}from"./components/action-popover/action-popover-item/action-popover-item.component.js";export{ActionPopoverMenuButton}from"./components/action-popover/action-popover-menu-button/action-popover-menu-button.component.js";import"./components/action-popover/action-popover-divider/action-popover-divider.component.js";export{AdaptiveSidebar}from"./components/adaptive-sidebar/adaptive-sidebar.component.js";export{AdvancedColorPicker}from"./components/advanced-color-picker/advanced-color-picker.component.js";export{Alert}from"./components/alert/alert.component.js";export{default as AnchorNavigation}from"./components/anchor-navigation/anchor-navigation.component.js";export{default as AnchorNavigationItem}from"./components/anchor-navigation/anchor-navigation-item/anchor-navigation-item.component.js";export{default as AnchorSectionDivider}from"./components/anchor-navigation/anchor-section-divider.component.js";export{Badge}from"./components/badge/badge.component.js";export{BatchSelection}from"./components/batch-selection/batch-selection.component.js";export{Box}from"./components/box/box.component.js";export{Breadcrumbs}from"./components/breadcrumbs/breadcrumbs.component.js";export{Crumb}from"./components/breadcrumbs/crumb/crumb.component.js";export{ButtonBar}from"./components/button-bar/button-bar.component.js";export{ButtonMinor}from"./components/button-minor/button-minor.component.js";export{ButtonToggle}from"./components/button-toggle/button-toggle.component.js";export{default as ButtonToggleGroup}from"./components/button-toggle/button-toggle-group/button-toggle-group.component.js";export{default as Button}from"./components/button/button.component.js";export{CarbonProvider}from"./components/carbon-provider/carbon-provider.component.js";export{default as Card}from"./components/card/card.component.js";export{default as CardColumn}from"./components/card/card-column/card-column.component.js";export{default as CardFooter}from"./components/card/card-footer/card-footer.component.js";export{default as CardRow}from"./components/card/card-row/card-row.component.js";export{CheckboxGroup}from"./components/checkbox/checkbox-group/checkbox-group.component.js";export{Checkbox}from"./components/checkbox/checkbox.component.js";export{Confirm}from"./components/confirm/confirm.component.js";export{Content}from"./components/content/content.component.js";export{DateRange}from"./components/date-range/date-range.component.js";export{DateInput}from"./components/date/date.component.js";export{Decimal}from"./components/decimal/decimal.component.js";export{default as Dl}from"./components/definition-list/dl.component.js";export{default as Dt}from"./components/definition-list/dt/dt.component.js";export{default as Dd}from"./components/definition-list/dd/dd.component.js";export{Detail}from"./components/detail/detail.component.js";export{Dialog}from"./components/dialog/dialog.component.js";export{DismissibleBox}from"./components/dismissible-box/dismissible-box.component.js";export{default as DraggableContainer}from"./components/draggable/draggable-container.component.js";export{default as DraggableItem}from"./components/draggable/draggable-item/draggable-item.component.js";export{Drawer}from"./components/drawer/drawer.component.js";export{DuellingPicklist}from"./components/duelling-picklist/duelling-picklist.component.js";export{default as PicklistDivider}from"./components/duelling-picklist/picklist-divider/picklist-divider.component.js";export{PicklistItem}from"./components/duelling-picklist/picklist-item/picklist-item.component.js";export{Picklist}from"./components/duelling-picklist/picklist/picklist.component.js";export{PicklistPlaceholder}from"./components/duelling-picklist/picklist-placeholder/picklist-placeholder.component.js";export{PicklistGroup}from"./components/duelling-picklist/picklist-group/picklist-group.component.js";export{Fieldset}from"./components/fieldset/fieldset.component.js";export{FileInput}from"./components/file-input/file-input.component.js";export{FlatTable}from"./components/flat-table/flat-table.component.js";export{FlatTableHead}from"./components/flat-table/flat-table-head/flat-table-head.component.js";export{FlatTableHeader}from"./components/flat-table/flat-table-header/flat-table-header.component.js";export{FlatTableBody}from"./components/flat-table/flat-table-body/flat-table-body.component.js";export{FlatTableRow}from"./components/flat-table/flat-table-row/flat-table-row.component.js";export{FlatTableRowHeader}from"./components/flat-table/flat-table-row-header/flat-table-row-header.component.js";export{FlatTableCell}from"./components/flat-table/flat-table-cell/flat-table-cell.component.js";export{FlatTableCheckbox}from"./components/flat-table/flat-table-checkbox/flat-table-checkbox.component.js";export{FlatTableBodyDraggable}from"./components/flat-table/flat-table-body-draggable/flat-table-body-draggable.component.js";export{Sort}from"./components/flat-table/sort/sort.component.js";export{Form}from"./components/form/form.component.js";export{default as RequiredFieldsIndicator}from"./components/form/required-fields-indicator/required-fields-indicator.component.js";export{default as GlobalHeader}from"./components/global-header/global-header.component.js";export{GridContainer}from"./components/grid/grid-container/grid-container.component.js";export{GridItem}from"./components/grid/grid-item/grid-item.component.js";export{GroupedCharacter}from"./components/grouped-character/grouped-character.component.js";export{Heading}from"./components/heading/heading.component.js";export{Help}from"./components/help/help.component.js";export{Hr}from"./components/hr/hr.component.js";export{I18nProvider}from"./components/i18n-provider/i18n-provider.component.js";export{default as IconButton}from"./components/icon-button/icon-button.component.js";export{default as Icon}from"./components/icon/icon.component.js";export{Image}from"./components/image/image.component.js";export{default as InlineInputs}from"./components/inline-inputs/inline-inputs.component.js";export{LinkPreview}from"./components/link-preview/link-preview.component.js";export{Link}from"./components/link/link.component.js";export{Loader}from"./components/loader/loader.component.js";export{LoaderBar}from"./components/loader-bar/loader-bar.component.js";export{LoaderSpinner}from"./components/loader-spinner/loader-spinner.component.js";export{default as LoaderStar}from"./components/loader-star/loader-star.component.js";export{Loader as NextLoader}from"./components/loader/__next__/loader.component.js";export{Menu}from"./components/menu/menu.component.js";export{MenuItem}from"./components/menu/menu-item/menu-item.component.js";export{default as MenuDivider}from"./components/menu/menu-divider/menu-divider.component.js";export{default as MenuSegmentTitle}from"./components/menu/menu-segment-title/menu-segment-title.component.js";export{MenuFullscreen}from"./components/menu/menu-full-screen/menu-full-screen.component.js";export{ScrollableBlock}from"./components/menu/scrollable-block/scrollable-block.component.js";export{Message}from"./components/message/message.component.js";export{default as Modal}from"./components/modal/index.js";export{MultiActionButton}from"./components/multi-action-button/multi-action-button.component.js";export{NavigationBar}from"./components/navigation-bar/navigation-bar.component.js";export{Note}from"./components/note/note.component.js";export{Number}from"./components/number/number.component.js";export{NumeralDate}from"./components/numeral-date/numeral-date.component.js";export{Pager}from"./components/pager/pager.component.js";export{default as Pages}from"./components/pages/pages.component.js";export{default as Page}from"./components/pages/page/page.component.js";export{Password}from"./components/password/password.component.js";export{Pill}from"./components/pill/pill.component.js";export{default as Pod}from"./components/pod/pod.component.js";export{PopoverContainer}from"./components/popover-container/popover-container.component.js";export{default as Portal}from"./components/portal/portal.js";export{Portrait}from"./components/portrait/portrait.component.js";export{Preview}from"./components/preview/preview.component.js";export{Profile}from"./components/profile/profile.component.js";export{default as ProgressTracker}from"./components/progress-tracker/progress-tracker.component.js";export{default as RadioButton}from"./components/radio-button/radio-button.component.js";export{RadioButtonGroup}from"./components/radio-button/radio-button-group/radio-button-group.component.js";export{Search}from"./components/search/search.component.js";export{default as Option}from"./components/select/option/option.component.js";export{default as OptionRow}from"./components/select/option-row/option-row.component.js";export{default as OptionGroupHeader}from"./components/select/option-group-header/option-group-header.component.js";export{SimpleSelect as Select}from"./components/select/simple-select/simple-select.component.js";export{FilterableSelect}from"./components/select/filterable-select/filterable-select.component.js";export{MultiSelect}from"./components/select/multi-select/multi-select.component.js";export{default as setupSelectMocks}from"./components/select/setup-select-mocks.js";export{SettingsRow}from"./components/settings-row/settings-row.component.js";export{Sidebar}from"./components/sidebar/sidebar.component.js";export{SimpleColorPicker}from"./components/simple-color-picker/simple-color-picker.component.js";export{SimpleColor}from"./components/simple-color-picker/simple-color/simple-color.component.js";export{SplitButton}from"./components/split-button/split-button.component.js";export{StepFlowTitle}from"./components/step-flow/step-flow-title/step-flow-title.component.js";export{StepFlow}from"./components/step-flow/step-flow.component.js";export{StepSequence}from"./components/step-sequence/step-sequence.component.js";export{StepSequenceItem}from"./components/step-sequence/step-sequence-item/step-sequence-item.component.js";export{Switch}from"./components/switch/switch.component.js";export{Tabs}from"./components/tabs/tabs.component.js";export{Tab}from"./components/tabs/tab/tab.component.js";export{TextEditor}from"./components/text-editor/text-editor.component.js";export{createEmpty,createFromHTML}from"./components/text-editor/__internal__/__utils__/helpers.js";import"react/jsx-runtime";import"@lexical/react/LexicalComposerContext";import"@lexical/react/LexicalTypeaheadMenuPlugin";import"lexical";import"react";import"react-dom";import"./components/text-editor/__internal__/__ui__/Mentions/constants.js";import"./components/text-editor/__internal__/__ui__/Mentions/mentions.style.js";import"./__internal__/i18n-context/index.js";export{OriginalTextarea as Textarea}from"./components/textarea/textarea.component.js";export{Textbox}from"./components/textbox/textbox.component.js";export{default as TileSelect}from"./components/tile-select/tile-select.component.js";export{TileSelectGroup}from"./components/tile-select/tile-select-group/tile-select-group.component.js";export{Tile}from"./components/tile/tile.component.js";export{default as TileContent}from"./components/tile/tile-content/tile-content.component.js";export{TileFooter}from"./components/tile/tile-footer/tile-footer.component.js";export{TileHeader}from"./components/tile/tile-header/tile-header.component.js";export{FlexTileContainer}from"./components/tile/flex-tile-container/flex-tile-container.component.js";export{FlexTileCell}from"./components/tile/flex-tile-cell/flex-tile-cell.component.js";export{FlexTileDivider}from"./components/tile/flex-tile-divider/flex-tile-divider.component.js";export{default as Time}from"./components/time/time.component.js";export{Toast}from"./components/toast/toast.component.js";export{Tooltip}from"./components/tooltip/tooltip.component.js";export{Typography}from"./components/typography/typography.component.js";export{List,ListItem}from"./components/typography/list.component.js";export{VerticalDivider}from"./components/vertical-divider/vertical-divider.component.js";export{VerticalMenu}from"./components/vertical-menu/vertical-menu.component.js";export{VerticalMenuItem}from"./components/vertical-menu/vertical-menu-item/vertical-menu-item.component.js";export{VerticalMenuFullScreen}from"./components/vertical-menu/vertical-menu-full-screen/vertical-menu-full-screen.component.js";export{VerticalMenuTrigger}from"./components/vertical-menu/vertical-menu-trigger/vertical-menu-trigger.component.js";import"./components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu.style.js";import"react-transition-group";import"./hooks/__internal__/useScrollBlock/useScrollBlock.js";import"./__internal__/modal/modal-manager.js";import"./__internal__/modal/modal.style.js";import"./__internal__/modal/modal.context.js";export{default as useMediaQuery}from"./hooks/useMediaQuery/useMediaQuery.js";import"./components/carbon-provider/__internal__/top-modal.context.js";import"./components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu-item/responsive-vertical-menu-item.style.js";import"./style/utils/filter-styled-system-padding-props.js";import"./components/vertical-menu/responsive-vertical-menu/responsive-vertical-menu-divider/responsive-vertical-menu-divider.style.js";export{default as useCharacterCount}from"./hooks/useCharacterCount/useCharacterCount.js";export{default as GlobalStyle}from"./style/global-style.js";export{MenuItemDivider as ActionPopoverDivider}from"./components/action-popover/action-popover.style.js";