@dialpad/dialtone 9.96.0 → 9.98.0

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 (126) hide show
  1. package/dist/css/dialtone-default-theme.css +45 -1
  2. package/dist/css/dialtone-default-theme.min.css +1 -1
  3. package/dist/css/dialtone.css +45 -1
  4. package/dist/css/dialtone.min.css +1 -1
  5. package/dist/css/tokens/tokens-base-deca-dark.css +293 -391
  6. package/dist/css/tokens/tokens-base-deca-light.css +284 -382
  7. package/dist/css/tokens/tokens-deca-dark.css +1001 -966
  8. package/dist/css/tokens/tokens-deca-light.css +731 -696
  9. package/dist/tokens/css/tokens-base-deca-dark.css +293 -391
  10. package/dist/tokens/css/tokens-base-deca-light.css +284 -382
  11. package/dist/tokens/css/tokens-deca-dark.css +1001 -966
  12. package/dist/tokens/css/tokens-deca-light.css +731 -696
  13. package/dist/tokens/doc.json +31965 -32211
  14. package/dist/tokens/less/tokens-base-deca-dark.less +77 -91
  15. package/dist/tokens/less/tokens-base-deca-light.less +75 -89
  16. package/dist/tokens/less/tokens-deca-dark.less +225 -220
  17. package/dist/tokens/less/tokens-deca-light.less +229 -224
  18. package/dist/tokens/themes/dp-deca-dark.cjs +1 -1
  19. package/dist/tokens/themes/dp-deca-dark.js +1 -1
  20. package/dist/tokens/themes/dp-deca-light.cjs +1 -1
  21. package/dist/tokens/themes/dp-deca-light.js +1 -1
  22. package/dist/tokens/tokens-base-deca-dark.json +77 -91
  23. package/dist/tokens/tokens-base-deca-light.json +75 -89
  24. package/dist/tokens/tokens-deca-dark.json +224 -219
  25. package/dist/tokens/tokens-deca-light.json +229 -224
  26. package/dist/vue2/component-documentation.json +1 -1
  27. package/dist/vue2/components/keyboard_shortcut/keyboard_shortcut.vue.cjs +2 -2
  28. package/dist/vue2/components/keyboard_shortcut/keyboard_shortcut.vue.js +2 -2
  29. package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.cjs.map +1 -1
  30. package/dist/vue2/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.js.map +1 -1
  31. package/dist/vue2/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.cjs.map +1 -1
  32. package/dist/vue2/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.js.map +1 -1
  33. package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.cjs +160 -17
  34. package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.cjs.map +1 -1
  35. package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.js +161 -18
  36. package/dist/vue2/components/rich_text_editor/rich_text_editor.vue.js.map +1 -1
  37. package/dist/vue2/recipes/conversation_view/editor/editor.vue.cjs +1 -1
  38. package/dist/vue2/recipes/conversation_view/editor/editor.vue.cjs.map +1 -1
  39. package/dist/vue2/recipes/conversation_view/editor/editor.vue.js +1 -1
  40. package/dist/vue2/recipes/conversation_view/editor/editor.vue.js.map +1 -1
  41. package/dist/vue2/recipes/conversation_view/message_input/last_active_nodes.cjs +87 -0
  42. package/dist/vue2/recipes/conversation_view/message_input/last_active_nodes.cjs.map +1 -0
  43. package/dist/vue2/recipes/conversation_view/message_input/last_active_nodes.js +87 -0
  44. package/dist/vue2/recipes/conversation_view/message_input/last_active_nodes.js.map +1 -0
  45. package/dist/vue2/recipes/conversation_view/message_input/message_input.vue.cjs +229 -46
  46. package/dist/vue2/recipes/conversation_view/message_input/message_input.vue.cjs.map +1 -1
  47. package/dist/vue2/recipes/conversation_view/message_input/message_input.vue.js +229 -46
  48. package/dist/vue2/recipes/conversation_view/message_input/message_input.vue.js.map +1 -1
  49. package/dist/vue2/recipes/conversation_view/message_input/message_input_button.vue.cjs +58 -0
  50. package/dist/vue2/recipes/conversation_view/message_input/message_input_button.vue.cjs.map +1 -0
  51. package/dist/vue2/recipes/conversation_view/message_input/message_input_button.vue.js +58 -0
  52. package/dist/vue2/recipes/conversation_view/message_input/message_input_button.vue.js.map +1 -0
  53. package/dist/vue2/recipes/conversation_view/message_input/message_input_link.vue.cjs +108 -0
  54. package/dist/vue2/recipes/conversation_view/message_input/message_input_link.vue.cjs.map +1 -0
  55. package/dist/vue2/recipes/conversation_view/message_input/message_input_link.vue.js +108 -0
  56. package/dist/vue2/recipes/conversation_view/message_input/message_input_link.vue.js.map +1 -0
  57. package/dist/vue2/recipes/conversation_view/message_input/message_input_topbar.vue.cjs +106 -0
  58. package/dist/vue2/recipes/conversation_view/message_input/message_input_topbar.vue.cjs.map +1 -0
  59. package/dist/vue2/recipes/conversation_view/message_input/message_input_topbar.vue.js +106 -0
  60. package/dist/vue2/recipes/conversation_view/message_input/message_input_topbar.vue.js.map +1 -0
  61. package/dist/vue2/types/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.d.ts.map +1 -1
  62. package/dist/vue2/types/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.d.ts.map +1 -1
  63. package/dist/vue2/types/components/rich_text_editor/rich_text_editor.vue.d.ts +37 -1
  64. package/dist/vue2/types/components/rich_text_editor/rich_text_editor.vue.d.ts.map +1 -1
  65. package/dist/vue2/types/recipes/conversation_view/editor/editor.vue.d.ts.map +1 -1
  66. package/dist/vue2/types/recipes/conversation_view/message_input/last_active_nodes.d.ts +3 -0
  67. package/dist/vue2/types/recipes/conversation_view/message_input/last_active_nodes.d.ts.map +1 -0
  68. package/dist/vue2/types/recipes/conversation_view/message_input/message_input.vue.d.ts +183 -60
  69. package/dist/vue2/types/recipes/conversation_view/message_input/message_input.vue.d.ts.map +1 -1
  70. package/dist/vue2/types/recipes/conversation_view/message_input/message_input_button.vue.d.ts +48 -0
  71. package/dist/vue2/types/recipes/conversation_view/message_input/message_input_button.vue.d.ts.map +1 -0
  72. package/dist/vue2/types/recipes/conversation_view/message_input/message_input_link.vue.d.ts +38 -0
  73. package/dist/vue2/types/recipes/conversation_view/message_input/message_input_link.vue.d.ts.map +1 -0
  74. package/dist/vue2/types/recipes/conversation_view/message_input/message_input_topbar.vue.d.ts +87 -0
  75. package/dist/vue2/types/recipes/conversation_view/message_input/message_input_topbar.vue.d.ts.map +1 -0
  76. package/dist/vue3/component-documentation.json +1 -1
  77. package/dist/vue3/components/keyboard_shortcut/keyboard_shortcut.vue.cjs +2 -2
  78. package/dist/vue3/components/keyboard_shortcut/keyboard_shortcut.vue.js +2 -2
  79. package/dist/vue3/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.cjs.map +1 -1
  80. package/dist/vue3/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.js.map +1 -1
  81. package/dist/vue3/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.cjs.map +1 -1
  82. package/dist/vue3/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.js.map +1 -1
  83. package/dist/vue3/components/rich_text_editor/rich_text_editor.vue.cjs +223 -21
  84. package/dist/vue3/components/rich_text_editor/rich_text_editor.vue.cjs.map +1 -1
  85. package/dist/vue3/components/rich_text_editor/rich_text_editor.vue.js +225 -23
  86. package/dist/vue3/components/rich_text_editor/rich_text_editor.vue.js.map +1 -1
  87. package/dist/vue3/recipes/conversation_view/editor/editor.vue.cjs +1 -0
  88. package/dist/vue3/recipes/conversation_view/editor/editor.vue.cjs.map +1 -1
  89. package/dist/vue3/recipes/conversation_view/editor/editor.vue.js +1 -0
  90. package/dist/vue3/recipes/conversation_view/editor/editor.vue.js.map +1 -1
  91. package/dist/vue3/recipes/conversation_view/message_input/last_active_nodes.cjs +87 -0
  92. package/dist/vue3/recipes/conversation_view/message_input/last_active_nodes.cjs.map +1 -0
  93. package/dist/vue3/recipes/conversation_view/message_input/last_active_nodes.js +87 -0
  94. package/dist/vue3/recipes/conversation_view/message_input/last_active_nodes.js.map +1 -0
  95. package/dist/vue3/recipes/conversation_view/message_input/message_input.vue.cjs +279 -65
  96. package/dist/vue3/recipes/conversation_view/message_input/message_input.vue.cjs.map +1 -1
  97. package/dist/vue3/recipes/conversation_view/message_input/message_input.vue.js +280 -66
  98. package/dist/vue3/recipes/conversation_view/message_input/message_input.vue.js.map +1 -1
  99. package/dist/vue3/recipes/conversation_view/message_input/message_input_button.vue.cjs +81 -0
  100. package/dist/vue3/recipes/conversation_view/message_input/message_input_button.vue.cjs.map +1 -0
  101. package/dist/vue3/recipes/conversation_view/message_input/message_input_button.vue.js +81 -0
  102. package/dist/vue3/recipes/conversation_view/message_input/message_input_button.vue.js.map +1 -0
  103. package/dist/vue3/recipes/conversation_view/message_input/message_input_link.vue.cjs +193 -0
  104. package/dist/vue3/recipes/conversation_view/message_input/message_input_link.vue.cjs.map +1 -0
  105. package/dist/vue3/recipes/conversation_view/message_input/message_input_link.vue.js +193 -0
  106. package/dist/vue3/recipes/conversation_view/message_input/message_input_link.vue.js.map +1 -0
  107. package/dist/vue3/recipes/conversation_view/message_input/message_input_topbar.vue.cjs +223 -0
  108. package/dist/vue3/recipes/conversation_view/message_input/message_input_topbar.vue.cjs.map +1 -0
  109. package/dist/vue3/recipes/conversation_view/message_input/message_input_topbar.vue.js +223 -0
  110. package/dist/vue3/recipes/conversation_view/message_input/message_input_topbar.vue.js.map +1 -0
  111. package/dist/vue3/types/components/rich_text_editor/extensions/mentions/MentionSuggestion.vue.d.ts.map +1 -1
  112. package/dist/vue3/types/components/rich_text_editor/extensions/suggestion/SuggestionList.vue.d.ts.map +1 -1
  113. package/dist/vue3/types/components/rich_text_editor/rich_text_editor.vue.d.ts +42 -1
  114. package/dist/vue3/types/components/rich_text_editor/rich_text_editor.vue.d.ts.map +1 -1
  115. package/dist/vue3/types/recipes/conversation_view/editor/editor.vue.d.ts.map +1 -1
  116. package/dist/vue3/types/recipes/conversation_view/message_input/last_active_nodes.d.ts +3 -0
  117. package/dist/vue3/types/recipes/conversation_view/message_input/last_active_nodes.d.ts.map +1 -0
  118. package/dist/vue3/types/recipes/conversation_view/message_input/message_input.vue.d.ts +185 -61
  119. package/dist/vue3/types/recipes/conversation_view/message_input/message_input.vue.d.ts.map +1 -1
  120. package/dist/vue3/types/recipes/conversation_view/message_input/message_input_button.vue.d.ts +50 -0
  121. package/dist/vue3/types/recipes/conversation_view/message_input/message_input_button.vue.d.ts.map +1 -0
  122. package/dist/vue3/types/recipes/conversation_view/message_input/message_input_link.vue.d.ts +42 -0
  123. package/dist/vue3/types/recipes/conversation_view/message_input/message_input_link.vue.d.ts.map +1 -0
  124. package/dist/vue3/types/recipes/conversation_view/message_input/message_input_topbar.vue.d.ts +89 -0
  125. package/dist/vue3/types/recipes/conversation_view/message_input/message_input_topbar.vue.d.ts.map +1 -0
  126. package/package.json +7 -4
@@ -2,119 +2,124 @@
2
2
  // Do not edit directly, this file was auto-generated.
3
3
 
4
4
  @dt-size-border-focus: 0.3rem;
5
- @dt-color-foreground-primary: #111111; // Default text color throughout the UI.
6
- @dt-color-foreground-secondary: hsl(0 0% 19.2%); // Example uses include introduction paragraphs, labels, and descriptions paired with form elements.
7
- @dt-color-foreground-tertiary: hsl(0 0% 30%); // Used to imply visual hierarchy relative to primary and secondary text colors, e.g. headlines and labels.
8
- @dt-color-foreground-muted: hsl(0 0% 14.9% / 0.5);
9
- @dt-color-foreground-placeholder: #535353; // Text color for placeholder text within form elements.
10
- @dt-color-foreground-disabled: #535353; // Used for text paired with disabled content or components, like the form elements.
11
- @dt-color-foreground-critical: #BF002A; // Expresses an error, danger, or otherwise critical state.
12
- @dt-color-foreground-critical-strong: #92001D; // Expresses an error, danger, or otherwise critical state on surfaces that require a stronger contrast.
13
- @dt-color-foreground-success: #006E29; // Indicates a positive state.
14
- @dt-color-foreground-success-strong: #006023; // Indicates a strong positive state on surfaces that require a stronger contrast.
15
- @dt-color-foreground-warning: #845400; // Indicates information that requires user’s attention and further action may be necessary.
16
- @dt-color-foreground-primary-inverted: #FBFBFB; // Primary text that sits on high-contrast surfaces or backgrounds.
17
- @dt-color-foreground-secondary-inverted: #E3E3E3; // Secondary text color that sits on high-contrast surfaces or backgrounds.
18
- @dt-color-foreground-tertiary-inverted: #C7C7C7; // Tertiary text color that sits on high-contrast surfaces or backgrounds.
19
- @dt-color-foreground-muted-inverted: hsl(0 0% 89% / 0.6); // Muted text color that sits on high-contrast surfaces or backgrounds.
20
- @dt-color-foreground-placeholder-inverted: #787878; // Placeholder text color that sits on high-contrast surfaces or backgrounds.
21
- @dt-color-foreground-disabled-inverted: #787878; // Disabled text color that sits on high-contrast surfaces or backgrounds.
22
- @dt-color-foreground-critical-inverted: #FF525C; // Critical text that sits on high-contrast surfaces or backgrounds
23
- @dt-color-foreground-critical-strong-inverted: #FF8888; // Critical strong text that sits on high-contrast surfaces or backgrounds
24
- @dt-color-foreground-success-inverted: #00E55E; // Success text that sits on high-contrast surfaces or backgrounds
25
- @dt-color-foreground-success-strong-inverted: #B2F2B3; // Success strong text that sits on high-contrast surfaces or backgrounds
26
- @dt-color-foreground-warning-inverted: #FFB958; // Warning text that sits on high-contrast surfaces or backgrounds
27
- @dt-color-link-primary: #6536E8;
28
- @dt-color-link-critical: #BF002A;
29
- @dt-color-link-success: #006E29; // positive
30
- @dt-color-link-warning: #845400;
31
- @dt-color-link-muted: hsl(0 0% 19.2%);
32
- @dt-color-link-disabled: #535353;
33
- @dt-color-link-primary-inverted: #B29DFF;
34
- @dt-color-link-critical-inverted: #FF525C;
35
- @dt-color-link-success-inverted: #00E55E;
36
- @dt-color-link-warning-inverted: #FFB958;
37
- @dt-color-link-muted-inverted: #E3E3E3;
38
- @dt-color-link-disabled-inverted: #787878;
39
- @dt-color-link-primary-hover: #4D04D0;
40
- @dt-color-link-critical-hover: #92001D;
41
- @dt-color-link-success-hover: #006023;
42
- @dt-color-link-warning-hover: #462B00;
43
- @dt-color-link-muted-hover: #111111;
44
- @dt-color-link-disabled-hover: #535353;
45
- @dt-color-link-primary-inverted-hover: #CCBEFF;
46
- @dt-color-link-critical-inverted-hover: #FF8888;
47
- @dt-color-link-success-inverted-hover: #B2F2B3;
48
- @dt-color-link-warning-inverted-hover: #FFDDB5;
49
- @dt-color-link-muted-inverted-hover: #FBFBFB;
50
- @dt-color-link-disabled-inverted-hover: #535353;
51
- @dt-color-surface-secondary-opaque: hsl(0 0% 6.67% / 0.02); // Secondary surface as opaque background color.
52
- @dt-color-surface-moderate-opaque: hsl(0 0% 6.67% / 0.12); // Moderate surface as opaque background color.
53
- @dt-color-surface-bold-opaque: hsl(0 0% 6.67% / 0.23); // Bold surface as opaque background color.
54
- @dt-color-surface-strong-opaque: hsl(0 0% 6.67% / 0.72); // Strong surface as opaque background color.
55
- @dt-color-surface-contrast-opaque: hsl(0 0% 6.67% / 0.95); // Contrast surface as opaque background color.
56
- @dt-color-surface-backdrop: hsl(0 0% 0% / 0.7); // Background color for a modal-like backdrop.
57
- @dt-color-surface-critical-opaque: hsl(1.54 100% 84.7% / 0.24); // Critical surface as opaque background color.
58
- @dt-color-surface-critical-subtle-opaque: hsl(6 100% 96.1% / 0.4); // Critical subtle surface as opaque background color.
59
- @dt-color-surface-warning-opaque: hsl(32.4 100% 85.5% / 0.5); // Warning surface as opaque background color
60
- @dt-color-surface-warning-subtle-opaque: hsl(30 100% 93.3% / 0.5); // Warning subtle surface as opaque background color
61
- @dt-color-surface-success-opaque: hsl(121 71.1% 82.4% / 0.26); // Success surface as opaque background color.
62
- @dt-color-surface-success-subtle-opaque: hsl(108 100% 95.1% / 0.5); // Success subtle surface as opaque background color.
63
- @dt-color-surface-info-opaque: hsl(225 100% 92.4% / 0.5); // Info surface as opaque background color.
64
- @dt-color-surface-info-subtle-opaque: hsl(230 100% 96.5% / 0.5); // Info surface as opaque background color.
5
+ @dt-color-foreground-primary: #1C1C1C; // Default text color throughout the UI.
6
+ @dt-color-foreground-secondary: #3A3A3A; // Example uses include introduction paragraphs, labels, and descriptions paired with form elements.
7
+ @dt-color-foreground-tertiary: #535353; // Used to imply visual hierarchy relative to primary and secondary text colors, e.g. headlines and labels.
8
+ @dt-color-foreground-muted: hsl(0 0% 0% / 0.5);
9
+ @dt-color-foreground-placeholder: #808080; // Text color for placeholder text within form elements.
10
+ @dt-color-foreground-disabled: #808080; // Used for text paired with disabled content or components, like the form elements.
11
+ @dt-color-foreground-critical: #E10040; // Expresses an error, danger, or otherwise critical state.
12
+ @dt-color-foreground-critical-strong: #AF0032; // Expresses an error, danger, or otherwise critical state on surfaces that require a stronger contrast.
13
+ @dt-color-foreground-success: #008E52; // Indicates a positive state.
14
+ @dt-color-foreground-success-strong: #004F2E; // Indicates a strong positive state on surfaces that require a stronger contrast.
15
+ @dt-color-foreground-warning: #815008; // Indicates information that requires user’s attention and further action may be necessary.
16
+ @dt-color-foreground-primary-inverted: #F9F9F9; // Primary text that sits on high-contrast surfaces or backgrounds.
17
+ @dt-color-foreground-secondary-inverted: #E9E9E9; // Secondary text color that sits on high-contrast surfaces or backgrounds.
18
+ @dt-color-foreground-tertiary-inverted: #D2D2D2; // Tertiary text color that sits on high-contrast surfaces or backgrounds.
19
+ @dt-color-foreground-muted-inverted: hsl(0 0% 97.6% / 0.65); // Muted text color that sits on high-contrast surfaces or backgrounds.
20
+ @dt-color-foreground-placeholder-inverted: #AAAAAA; // Placeholder text color that sits on high-contrast surfaces or backgrounds.
21
+ @dt-color-foreground-disabled-inverted: #AAAAAA; // Disabled text color that sits on high-contrast surfaces or backgrounds.
22
+ @dt-color-foreground-critical-inverted: #FF716F; // Critical text that sits on high-contrast surfaces or backgrounds
23
+ @dt-color-foreground-critical-strong-inverted: #FFABA4; // Critical strong text that sits on high-contrast surfaces or backgrounds
24
+ @dt-color-foreground-success-inverted: #AEFB3C; // Success text that sits on high-contrast surfaces or backgrounds
25
+ @dt-color-foreground-success-strong-inverted: #D1FF76; // Success strong text that sits on high-contrast surfaces or backgrounds
26
+ @dt-color-foreground-warning-inverted: #FFC047; // Warning text that sits on high-contrast surfaces or backgrounds
27
+ @dt-color-link-primary: #7C52FF;
28
+ @dt-color-link-critical: #E10040;
29
+ @dt-color-link-success: #008E52; // positive
30
+ @dt-color-link-warning: #815008;
31
+ @dt-color-link-muted: #3A3A3A;
32
+ @dt-color-link-disabled: #808080;
33
+ @dt-color-link-primary-inverted: #AB7EFF;
34
+ @dt-color-link-critical-inverted: #FF716F;
35
+ @dt-color-link-success-inverted: #AEFB3C;
36
+ @dt-color-link-warning-inverted: #FFC047;
37
+ @dt-color-link-muted-inverted: #E9E9E9;
38
+ @dt-color-link-disabled-inverted: #AAAAAA;
39
+ @dt-color-link-primary-hover: #5023DD;
40
+ @dt-color-link-critical-hover: #AF0032;
41
+ @dt-color-link-success-hover: #004F2E;
42
+ @dt-color-link-warning-hover: #533204;
43
+ @dt-color-link-muted-hover: #1C1C1C;
44
+ @dt-color-link-disabled-hover: #808080;
45
+ @dt-color-link-primary-inverted-hover: #DAC7FF;
46
+ @dt-color-link-critical-inverted-hover: #FFABA4;
47
+ @dt-color-link-success-inverted-hover: #D1FF76;
48
+ @dt-color-link-warning-inverted-hover: #FFE89C;
49
+ @dt-color-link-muted-inverted-hover: #F9F9F9;
50
+ @dt-color-link-disabled-inverted-hover: #AAAAAA;
51
+ @dt-color-surface-secondary-opaque: hsl(0 0% 11% / 0.02); // Secondary surface as opaque background color.
52
+ @dt-color-surface-moderate-opaque: hsl(0 0% 11% / 0.1); // Moderate surface as opaque background color.
53
+ @dt-color-surface-bold-opaque: hsl(0 0% 11% / 0.19); // Bold surface as opaque background color.
54
+ @dt-color-surface-strong-opaque: hsl(0 0% 11% / 0.76); // Strong surface as opaque background color.
55
+ @dt-color-surface-contrast-opaque: hsl(0 0% 11% / 0.94); // Contrast surface as opaque background color.
56
+ @dt-color-surface-backdrop: hsl(0 0% 0% / 0.65); // Background color for a modal-like backdrop.
57
+ @dt-color-surface-critical-opaque: hsl(4.62 100% 82.2% / 0.31); // Critical surface as opaque background color.
58
+ @dt-color-surface-critical-subtle-opaque: hsl(4.62 100% 82.2% / 0.15); // Critical subtle surface as opaque background color.
59
+ @dt-color-surface-warning-opaque: hsl(46.1 100% 80.6% / 0.5); // Warning surface as opaque background color
60
+ @dt-color-surface-warning-subtle-opaque: hsl(47.1 100% 90% / 0.5); // Warning subtle surface as opaque background color
61
+ @dt-color-surface-success-opaque: hsl(85.1 100% 83.1% / 0.25); // Success surface as opaque background color.
62
+ @dt-color-surface-success-subtle-opaque: hsl(111 53.8% 94.9% / 0.5); // Success subtle surface as opaque background color.
63
+ @dt-color-surface-info-opaque: hsl(201 100% 87.1% / 0.35); // Info surface as opaque background color.
64
+ @dt-color-surface-info-subtle-opaque: hsl(210 61.5% 94.9% / 0.5); // Info surface as opaque background color.
65
65
  @dt-color-surface-primary: #ffffff; // Default surface color for the majority of surfaces.
66
- @dt-color-surface-secondary: #FBFBFB; // For adjacent or complementary regions.
67
- @dt-color-surface-moderate: #E3E3E3; // A tertiary surface level, prominent without being too overpowering.
68
- @dt-color-surface-bold: #C7C7C7; // Highlight or call attention to specific areas of the interface.
66
+ @dt-color-surface-secondary: #F9F9F9; // For adjacent or complementary regions.
67
+ @dt-color-surface-moderate: #E9E9E9; // A tertiary surface level, prominent without being too overpowering.
68
+ @dt-color-surface-bold: #D2D2D2; // Highlight or call attention to specific areas of the interface.
69
69
  @dt-color-surface-strong: #535353; // Use sparingly to draw the eye to a relatively important region.
70
- @dt-color-surface-contrast: #1C1C1C; // An inverted surface for lightened content and elements, most likely paired with inverted foreground colors.
71
- @dt-color-surface-critical: #FFEDEB; // Background surface color containing error, danger, or otherwise critical messaging or elements.
72
- @dt-color-surface-critical-subtle: #FFF8F7; // A softer version of the Critical surface.
73
- @dt-color-surface-critical-strong: #A80023; // A contrasting critical surface, most likely paired with inverted foreground colors.
74
- @dt-color-surface-warning: #FFEEDD; // Background surface color highlighting messaging or elements that may require user's attention.
75
- @dt-color-surface-warning-subtle: #FFF8F4; // A softer version of the default warning surface.
76
- @dt-color-surface-warning-strong: #FFB958; // A contrasting warning surface, most likely paired with inverted foreground colors.
77
- @dt-color-surface-success: #EBFFE6; // Background surface color containing messaging or elements expressing a positive or successful state.
78
- @dt-color-surface-success-subtle: #F6FFF0; // A softer version of the default success surface.
79
- @dt-color-surface-success-strong: #008A35; // A contrasting positive state surface, most likely paired with inverted foreground colors.
80
- @dt-color-surface-info: #EDF0FF; // Background surface color containing messaging or elements communicated as generally informational.
81
- @dt-color-surface-info-subtle: #F9F9FF; // A softer version of the default informational surface.
82
- @dt-color-surface-info-strong: #005BC1; // A contrasting informational surface, most likely paired with inverted foreground colors.
83
- @dt-color-border-subtle: hsl(0 0% 6.67% / 0.1);
84
- @dt-color-border-default: hsl(0 0% 6.67% / 0.15);
85
- @dt-color-border-moderate: hsl(0 0% 6.67% / 0.25);
86
- @dt-color-border-bold: hsl(0 0% 6.67% / 0.5);
70
+ @dt-color-surface-contrast: #252525; // An inverted surface for lightened content and elements, most likely paired with inverted foreground colors.
71
+ @dt-color-surface-critical: #FFE5E6; // Background surface color containing error, danger, or otherwise critical messaging or elements.
72
+ @dt-color-surface-critical-subtle: hsl(358 100% 97.5%); // A softer version of the Critical surface.
73
+ @dt-color-surface-critical-strong: #AF0032; // A contrasting critical surface, most likely paired with inverted foreground colors.
74
+ @dt-color-surface-warning: #FFF4CC; // Background surface color highlighting messaging or elements that may require user's attention.
75
+ @dt-color-surface-warning-subtle: hsl(47.1 100% 95%); // A softer version of the default warning surface.
76
+ @dt-color-surface-warning-strong: #FFDB80; // A contrasting warning surface, most likely paired with inverted foreground colors.
77
+ @dt-color-surface-success: #EDF9EB; // Background surface color containing messaging or elements expressing a positive or successful state.
78
+ @dt-color-surface-success-subtle: hsl(111 53.8% 97.5%); // A softer version of the default success surface.
79
+ @dt-color-surface-success-strong: #008E52; // A contrasting positive state surface, most likely paired with inverted foreground colors.
80
+ @dt-color-surface-info: #EAF2FA; // Background surface color containing messaging or elements communicated as generally informational.
81
+ @dt-color-surface-info-subtle: hsl(210 61.5% 97.5%); // A softer version of the default informational surface.
82
+ @dt-color-surface-info-strong: #1768C6; // A contrasting informational surface, most likely paired with inverted foreground colors.
83
+ @dt-color-surface-brand: #F5F0FF; // Background surface color containing messaging or elements communicated as generally informational.
84
+ @dt-color-surface-brand-subtle: hsl(260 100% 98.2%); // A softer version of the default informational surface.
85
+ @dt-color-surface-brand-strong: #7C52FF; // A contrasting informational surface, most likely paired with inverted foreground colors.
86
+ @dt-color-surface-brand-opaque: hsl(260 100% 89% / 0.27); // Info surface as opaque background color.
87
+ @dt-color-surface-brand-subtle-opaque: hsl(260 100% 89% / 0.2); // Info surface as opaque background color.
88
+ @dt-color-border-subtle: hsl(0 0% 11% / 0.1);
89
+ @dt-color-border-default: hsl(0 0% 11% / 0.15);
90
+ @dt-color-border-moderate: hsl(0 0% 11% / 0.25);
91
+ @dt-color-border-bold: hsl(0 0% 11% / 0.5);
87
92
  @dt-color-border-subtle-inverted: hsl(0 0% 100% / 0.12);
88
93
  @dt-color-border-default-inverted: hsl(0 0% 100% / 0.2);
89
94
  @dt-color-border-moderate-inverted: hsl(0 0% 100% / 0.35);
90
95
  @dt-color-border-bold-inverted: hsl(0 0% 100% / 0.5);
91
- @dt-color-border-focus: #4B8EFF;
92
- @dt-color-border-critical: #ED0937;
93
- @dt-color-border-success: #00A742;
94
- @dt-color-border-warning: #C6820F;
95
- @dt-color-border-brand: #7F56FF;
96
- @dt-color-border-ai: linear-gradient(135deg, #E60083 10%, #7F56FF 90%);
97
- @dt-color-border-accent: #E60083;
98
- @dt-color-border-critical-subtle: #FF525C;
99
- @dt-color-border-critical-strong: #A80023;
100
- @dt-color-border-success-subtle: #00E55E;
101
- @dt-color-border-success-strong: #00531D;
102
- @dt-color-border-warning-subtle: #FFB958;
103
- @dt-color-border-warning-strong: #643F00;
104
- @dt-color-border-brand-subtle: #B29DFF;
105
- @dt-color-border-brand-strong: #350097;
106
- @dt-color-border-critical-inverted: #FF525C;
107
- @dt-color-border-success-inverted: #00C650;
108
- @dt-color-border-warning-inverted: #E59C2E;
109
- @dt-color-border-brand-inverted: #7F56FF;
110
- @dt-color-border-critical-subtle-inverted: #92001D;
111
- @dt-color-border-critical-strong-inverted: #FFB3B1;
112
- @dt-color-border-success-subtle-inverted: #008A35;
113
- @dt-color-border-success-strong-inverted: #B2F2B3;
114
- @dt-color-border-warning-subtle-inverted: #C6820F;
115
- @dt-color-border-warning-strong-inverted: #FFDDB5;
116
- @dt-color-border-brand-subtle-inverted: #4D04D0;
117
- @dt-color-border-brand-strong-inverted: #CCBEFF;
96
+ @dt-color-border-focus: #3CA8F3;
97
+ @dt-color-border-critical: #FF1356;
98
+ @dt-color-border-success: #008E52;
99
+ @dt-color-border-warning: #F19000;
100
+ @dt-color-border-brand: #7C52FF;
101
+ @dt-color-border-ai: linear-gradient(135deg, #FF1BA4 10%, #7C52FF 90%);
102
+ @dt-color-border-accent: #FF1BA4;
103
+ @dt-color-border-critical-subtle: #FF716F;
104
+ @dt-color-border-critical-strong: #AF0032;
105
+ @dt-color-border-success-subtle: #AEFB3C;
106
+ @dt-color-border-success-strong: #004F2E;
107
+ @dt-color-border-warning-subtle: #FFC047;
108
+ @dt-color-border-warning-strong: #815008;
109
+ @dt-color-border-brand-subtle: #AB7EFF;
110
+ @dt-color-border-brand-strong: #3A1D95;
111
+ @dt-color-border-critical-inverted: #FF716F;
112
+ @dt-color-border-success-inverted: #3CD707;
113
+ @dt-color-border-warning-inverted: #FFC047;
114
+ @dt-color-border-brand-inverted: #7C52FF;
115
+ @dt-color-border-critical-subtle-inverted: #AF0032;
116
+ @dt-color-border-critical-strong-inverted: #FFABA4;
117
+ @dt-color-border-success-subtle-inverted: #008E52;
118
+ @dt-color-border-success-strong-inverted: #D1FF76;
119
+ @dt-color-border-warning-subtle-inverted: #D57F00;
120
+ @dt-color-border-warning-strong-inverted: #FFE89C;
121
+ @dt-color-border-brand-subtle-inverted: #5023DD;
122
+ @dt-color-border-brand-strong-inverted: #AB7EFF;
118
123
  @dt-typography-body-md-font-family: -apple-system, BlinkMacSystemFont, "SF Pro", "Segoe UI Adjusted", "Segoe UI", SFMono, "Helvetica Neue", Cantarell, Ubuntu, Roboto, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; // Base default medium text style for main content.
119
124
  @dt-typography-body-md-font-weight: 400; // Base default medium text style for main content.
120
125
  @dt-typography-body-md-line-height: 1.6; // Base default medium text style for main content.
@@ -291,15 +296,15 @@
291
296
  @dt-typography-inputs-xl-font-size: 27px; // Text style for extra large inputs (e.g. input and textarea)
292
297
  @dt-typography-inputs-xl-line-height: 1.2; // Text style for extra large inputs (e.g. input and textarea)
293
298
  @dt-typography-button-xs-font-family: -apple-system, BlinkMacSystemFont, "SF Pro", "Segoe UI Adjusted", "Segoe UI", SFMono, "Helvetica Neue", Cantarell, Ubuntu, Roboto, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; // Text style for extra small button
294
- @dt-typography-button-xs-font-weight: 500; // Text style for extra small button
299
+ @dt-typography-button-xs-font-weight: 600; // Text style for extra small button
295
300
  @dt-typography-button-xs-font-size: 12px; // Text style for extra small button
296
301
  @dt-typography-button-xs-line-height: 1.2; // Text style for extra small button
297
302
  @dt-typography-button-sm-font-family: -apple-system, BlinkMacSystemFont, "SF Pro", "Segoe UI Adjusted", "Segoe UI", SFMono, "Helvetica Neue", Cantarell, Ubuntu, Roboto, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; // Text style for small button
298
- @dt-typography-button-sm-font-weight: 500; // Text style for small button
303
+ @dt-typography-button-sm-font-weight: 600; // Text style for small button
299
304
  @dt-typography-button-sm-font-size: 12px; // Text style for small button
300
305
  @dt-typography-button-sm-line-height: 1.2; // Text style for small button
301
306
  @dt-typography-button-md-font-family: -apple-system, BlinkMacSystemFont, "SF Pro", "Segoe UI Adjusted", "Segoe UI", SFMono, "Helvetica Neue", Cantarell, Ubuntu, Roboto, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; // Text style for medium button
302
- @dt-typography-button-md-font-weight: 500; // Text style for medium button
307
+ @dt-typography-button-md-font-weight: 600; // Text style for medium button
303
308
  @dt-typography-button-md-font-size: 15px; // Text style for medium button
304
309
  @dt-typography-button-md-line-height: 1.2; // Text style for medium button
305
310
  @dt-typography-button-lg-font-family: -apple-system, BlinkMacSystemFont, "SF Pro", "Segoe UI Adjusted", "Segoe UI", SFMono, "Helvetica Neue", Cantarell, Ubuntu, Roboto, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; // Text style for large button
@@ -332,112 +337,112 @@
332
337
  @dt-inputs-font-weight-md: 400; // Font weight for medium inputs (e.g. input and textarea)
333
338
  @dt-inputs-font-weight-lg: 400; // Font weight for large inputs (e.g. input and textarea)
334
339
  @dt-inputs-font-weight-xl: 400; // Font weight for extra large inputs (e.g. input and textarea)
335
- @dt-inputs-color-foreground-default: hsl(0 0% 19.2%);
336
- @dt-inputs-color-foreground-placeholder: #535353;
337
- @dt-inputs-color-foreground-disabled: #535353;
338
- @dt-inputs-color-border-default: hsl(0 0% 6.67% / 0.15);
339
- @dt-inputs-color-border-focus: #4B8EFF;
340
- @dt-inputs-color-border-critical: #ED0937;
341
- @dt-inputs-color-border-success: #00A742;
342
- @dt-inputs-color-border-warning: #C6820F;
340
+ @dt-inputs-color-foreground-default: #3A3A3A;
341
+ @dt-inputs-color-foreground-placeholder: #808080;
342
+ @dt-inputs-color-foreground-disabled: #808080;
343
+ @dt-inputs-color-border-default: hsl(0 0% 11% / 0.15);
344
+ @dt-inputs-color-border-focus: #3CA8F3;
345
+ @dt-inputs-color-border-critical: #FF1356;
346
+ @dt-inputs-color-border-success: #008E52;
347
+ @dt-inputs-color-border-warning: #F19000;
343
348
  @dt-inputs-color-border-disabled: transparent;
344
- @dt-inputs-color-background-default: hsl(0 0% 6.67% / 0.03);
345
- @dt-inputs-color-background-focus: hsl(0 0% 6.67% / 0.01);
346
- @dt-inputs-color-background-disabled: hsl(0 0% 6.67% / 0.12);
347
- @dt-action-color-foreground-base-default: #6536E8;
348
- @dt-action-color-foreground-base-hover: #5923DC;
349
- @dt-action-color-foreground-base-active: #5923DC;
349
+ @dt-inputs-color-background-default: hsl(0 0% 11% / 0.02);
350
+ @dt-inputs-color-background-focus: #F9F9F9;
351
+ @dt-inputs-color-background-disabled: hsl(0 0% 11% / 0.1);
352
+ @dt-action-color-foreground-base-default: #7C52FF;
353
+ @dt-action-color-foreground-base-hover: #5023DD;
354
+ @dt-action-color-foreground-base-active: #5023DD;
350
355
  @dt-action-color-foreground-base-primary-default: #ffffff;
351
- @dt-action-color-foreground-critical-default: #A80023;
352
- @dt-action-color-foreground-critical-hover: #92001D;
353
- @dt-action-color-foreground-critical-active: #92001D;
356
+ @dt-action-color-foreground-critical-default: #E10040;
357
+ @dt-action-color-foreground-critical-hover: #AF0032;
358
+ @dt-action-color-foreground-critical-active: #AF0032;
354
359
  @dt-action-color-foreground-critical-primary-default: #ffffff;
355
- @dt-action-color-foreground-inverted-default: #FBFBFB;
356
- @dt-action-color-foreground-inverted-hover: #FBFBFB;
357
- @dt-action-color-foreground-inverted-active: #FBFBFB;
358
- @dt-action-color-foreground-inverted-primary-default: #6536E8;
359
- @dt-action-color-foreground-inverted-primary-hover: #5923DC;
360
- @dt-action-color-foreground-inverted-primary-active: #5923DC;
361
- @dt-action-color-foreground-muted-default: hsl(0 0% 19.2%);
362
- @dt-action-color-foreground-muted-hover: #111111;
363
- @dt-action-color-foreground-muted-active: #111111;
364
- @dt-action-color-foreground-disabled-default: #535353;
365
- @dt-action-color-foreground-positive-default: #006E29;
366
- @dt-action-color-foreground-positive-hover: #006023;
367
- @dt-action-color-foreground-positive-active: #006023;
360
+ @dt-action-color-foreground-inverted-default: #F9F9F9;
361
+ @dt-action-color-foreground-inverted-hover: #F9F9F9;
362
+ @dt-action-color-foreground-inverted-active: #F9F9F9;
363
+ @dt-action-color-foreground-inverted-primary-default: #7C52FF;
364
+ @dt-action-color-foreground-inverted-primary-hover: #5023DD;
365
+ @dt-action-color-foreground-inverted-primary-active: #5023DD;
366
+ @dt-action-color-foreground-muted-default: #3A3A3A;
367
+ @dt-action-color-foreground-muted-hover: #1C1C1C;
368
+ @dt-action-color-foreground-muted-active: #1C1C1C;
369
+ @dt-action-color-foreground-disabled-default: #808080;
370
+ @dt-action-color-foreground-positive-default: #008E52;
371
+ @dt-action-color-foreground-positive-hover: #004F2E;
372
+ @dt-action-color-foreground-positive-active: #004F2E;
368
373
  @dt-action-color-foreground-positive-primary-default: #ffffff;
369
374
  @dt-action-color-background-base-default: transparent;
370
- @dt-action-color-background-base-hover: #F5EEFF;
371
- @dt-action-color-background-base-active: #CCBEFF;
372
- @dt-action-color-background-base-primary-default: #6536E8;
373
- @dt-action-color-background-base-primary-hover: #4D04D0;
374
- @dt-action-color-background-base-primary-active: #350097;
375
+ @dt-action-color-background-base-hover: hsl(260 100% 89% / 0.27);
376
+ @dt-action-color-background-base-active: #DAC7FF;
377
+ @dt-action-color-background-base-primary-default: #7C52FF;
378
+ @dt-action-color-background-base-primary-hover: #6538F1;
379
+ @dt-action-color-background-base-primary-active: #5023DD;
375
380
  @dt-action-color-background-critical-default: transparent;
376
- @dt-action-color-background-critical-hover: #FFEDEB;
377
- @dt-action-color-background-critical-active: #FFB3B1;
378
- @dt-action-color-background-critical-primary-default: #BF002A;
379
- @dt-action-color-background-critical-primary-hover: #A80023;
380
- @dt-action-color-background-critical-primary-active: #92001D;
381
+ @dt-action-color-background-critical-hover: hsl(4.62 100% 82.2% / 0.31);
382
+ @dt-action-color-background-critical-active: #FFABA4;
383
+ @dt-action-color-background-critical-primary-default: #FF1356;
384
+ @dt-action-color-background-critical-primary-hover: #E10040;
385
+ @dt-action-color-background-critical-primary-active: #AF0032;
381
386
  @dt-action-color-background-inverted-default: transparent;
382
- @dt-action-color-background-inverted-hover: #3C3C3C;
383
- @dt-action-color-background-inverted-active: #535353;
384
- @dt-action-color-background-inverted-primary-default: #F5EEFF;
385
- @dt-action-color-background-inverted-primary-hover: #FBFBFB;
386
- @dt-action-color-background-inverted-primary-active: #CCBEFF;
387
+ @dt-action-color-background-inverted-hover: #535353;
388
+ @dt-action-color-background-inverted-active: #808080;
389
+ @dt-action-color-background-inverted-primary-default: #F9F9F9;
390
+ @dt-action-color-background-inverted-primary-hover: #F5F0FF;
391
+ @dt-action-color-background-inverted-primary-active: #DAC7FF;
387
392
  @dt-action-color-background-muted-default: transparent;
388
- @dt-action-color-background-muted-hover: hsl(0 0% 14.9% / 0.1);
389
- @dt-action-color-background-muted-active: hsl(0 0% 14.9% / 0.15);
390
- @dt-action-color-background-disabled-default: hsl(0 0% 6.67% / 0.23);
393
+ @dt-action-color-background-muted-hover: hsl(0 0% 11% / 0.1);
394
+ @dt-action-color-background-muted-active: hsl(0 0% 11% / 0.19);
395
+ @dt-action-color-background-disabled-default: hsl(0 0% 11% / 0.19);
391
396
  @dt-action-color-background-positive-default: transparent;
392
- @dt-action-color-background-positive-hover: #EBFFE6;
393
- @dt-action-color-background-positive-active: #B2F2B3;
394
- @dt-action-color-background-positive-primary-default: #006E29;
395
- @dt-action-color-background-positive-primary-hover: #006023;
396
- @dt-action-color-background-positive-primary-active: #00531D;
397
- @dt-action-color-border-base-outlined-default: #6536E8;
398
- @dt-action-color-border-critical-outlined-default: #ED0937;
397
+ @dt-action-color-background-positive-hover: hsl(85.1 100% 83.1% / 0.25);
398
+ @dt-action-color-background-positive-active: #DBFFA9;
399
+ @dt-action-color-background-positive-primary-default: #04BF08; // Postive, accepting, or success actions.
400
+ @dt-action-color-background-positive-primary-hover: #008E52;
401
+ @dt-action-color-background-positive-primary-active: #004F2E;
402
+ @dt-action-color-border-base-outlined-default: #7C52FF;
403
+ @dt-action-color-border-critical-outlined-default: #FF1356;
399
404
  @dt-action-color-border-inverted-outlined-default: hsl(0 0% 100% / 0.2);
400
- @dt-action-color-border-muted-outlined-default: hsl(0 0% 6.67% / 0.15);
401
- @dt-theme-color-base: #111111;
402
- @dt-theme-topbar-color-foreground: hsl(0 0% 6.67% / 0.8);
403
- @dt-theme-topbar-color-background: #FBFBFB;
404
- @dt-theme-topbar-field-color-foreground: hsl(0 0% 6.67% / 0.5);
405
- @dt-theme-topbar-field-color-foreground-hover: hsl(0 0% 6.67% / 0.75);
406
- @dt-theme-topbar-field-color-background: hsl(0 0% 6.67% / 0.05);
405
+ @dt-action-color-border-muted-outlined-default: hsl(0 0% 11% / 0.15);
406
+ @dt-theme-color-base: #1C1C1C;
407
+ @dt-theme-topbar-color-foreground: hsl(0 0% 11% / 0.8);
408
+ @dt-theme-topbar-color-background: #F9F9F9;
409
+ @dt-theme-topbar-field-color-foreground: hsl(0 0% 11% / 0.5);
410
+ @dt-theme-topbar-field-color-foreground-hover: hsl(0 0% 11% / 0.75);
411
+ @dt-theme-topbar-field-color-background: hsl(0 0% 11% / 0.05);
407
412
  @dt-theme-topbar-field-color-background-hover: hsl(0 0% 100%);
408
- @dt-theme-topbar-field-color-border: hsl(0 0% 6.67% / 0);
409
- @dt-theme-topbar-field-color-border-hover: hsl(0 0% 6.67% / 0.1);
410
- @dt-theme-topbar-field-color-border-active: hsl(0 0% 6.67% / 0.2);
411
- @dt-theme-topbar-button-color-foreground: hsl(0 0% 6.67% / 0.65);
412
- @dt-theme-topbar-button-color-foreground-hover: #111111;
413
- @dt-theme-topbar-button-color-background: hsl(0 0% 6.67% / 0);
414
- @dt-theme-topbar-button-color-background-hover: hsl(0 0% 6.67% / 0.05);
415
- @dt-theme-topbar-button-color-background-active: hsl(0 0% 6.67% / 0.1);
416
- @dt-theme-topbar-profile-color-foreground: hsl(0 0% 6.67% / 0.8);
417
- @dt-theme-topbar-profile-color-foreground-inverted: hsl(0 0% 98.4% / 0.75);
418
- @dt-theme-topbar-profile-color-background: hsl(0 0% 6.67% / 0.05);
419
- @dt-theme-topbar-profile-color-background-inverted: hsl(0 0% 6.67% / 0.75);
420
- @dt-theme-topbar-profile-color-background-hover: hsl(0 0% 6.67% / 0.1);
421
- @dt-theme-topbar-profile-color-background-active: hsl(0 0% 6.67% / 0.14);
422
- @dt-theme-sidebar-color-foreground: hsl(0 0% 19.2%);
423
- @dt-theme-sidebar-color-foreground-unread: #111111;
424
- @dt-theme-sidebar-color-background: #FBFBFB;
425
- @dt-theme-sidebar-icon-color-foreground: hsl(0 0% 19.2%);
426
- @dt-theme-sidebar-status-color-foreground: hsl(0 0% 30%);
427
- @dt-theme-sidebar-row-color-background: hsl(0 0% 6.67% / 0);
428
- @dt-theme-sidebar-row-color-background-hover: hsl(0 0% 6.67% / 0.12);
429
- @dt-theme-sidebar-row-color-background-active: hsl(0 0% 6.67% / 0.16);
430
- @dt-theme-sidebar-selected-row-color-foreground: #111111;
431
- @dt-theme-sidebar-selected-row-color-background: hsl(0 0% 6.67% / 0.1);
432
- @dt-theme-sidebar-section-color-foreground: hsl(0 0% 30%);
433
- @dt-theme-presence-color-background-available: #00C650;
434
- @dt-theme-presence-color-background-busy-unavailable: #ED0937;
435
- @dt-theme-presence-color-background-busy: #FFB958;
413
+ @dt-theme-topbar-field-color-border: hsl(0 0% 11% / 0);
414
+ @dt-theme-topbar-field-color-border-hover: hsl(0 0% 11% / 0.1);
415
+ @dt-theme-topbar-field-color-border-active: hsl(0 0% 11% / 0.2);
416
+ @dt-theme-topbar-button-color-foreground: hsl(0 0% 11% / 0.65);
417
+ @dt-theme-topbar-button-color-foreground-hover: #1C1C1C;
418
+ @dt-theme-topbar-button-color-background: hsl(0 0% 11% / 0);
419
+ @dt-theme-topbar-button-color-background-hover: hsl(0 0% 11% / 0.05);
420
+ @dt-theme-topbar-button-color-background-active: hsl(0 0% 11% / 0.1);
421
+ @dt-theme-topbar-profile-color-foreground: hsl(0 0% 11% / 0.8);
422
+ @dt-theme-topbar-profile-color-foreground-inverted: hsl(0 0% 97.6% / 0.75);
423
+ @dt-theme-topbar-profile-color-background: hsl(0 0% 11% / 0.05);
424
+ @dt-theme-topbar-profile-color-background-inverted: hsl(0 0% 11% / 0.75);
425
+ @dt-theme-topbar-profile-color-background-hover: hsl(0 0% 11% / 0.1);
426
+ @dt-theme-topbar-profile-color-background-active: hsl(0 0% 11% / 0.14);
427
+ @dt-theme-sidebar-color-foreground: #3A3A3A;
428
+ @dt-theme-sidebar-color-foreground-unread: #1C1C1C;
429
+ @dt-theme-sidebar-color-background: #F9F9F9;
430
+ @dt-theme-sidebar-icon-color-foreground: #3A3A3A;
431
+ @dt-theme-sidebar-status-color-foreground: #535353;
432
+ @dt-theme-sidebar-row-color-background: hsl(0 0% 11% / 0);
433
+ @dt-theme-sidebar-row-color-background-hover: hsl(0 0% 11% / 0.12);
434
+ @dt-theme-sidebar-row-color-background-active: hsl(0 0% 11% / 0.16);
435
+ @dt-theme-sidebar-selected-row-color-foreground: #1C1C1C;
436
+ @dt-theme-sidebar-selected-row-color-background: hsl(0 0% 11% / 0.1);
437
+ @dt-theme-sidebar-section-color-foreground: #535353;
438
+ @dt-theme-presence-color-background-available: #008E52;
439
+ @dt-theme-presence-color-background-busy-unavailable: #FF1356;
440
+ @dt-theme-presence-color-background-busy: #FF9E0E;
436
441
  @dt-theme-presence-color-background-offline: #ffffff;
437
442
  @dt-theme-mention-color-foreground: #ffffff;
438
- @dt-theme-mention-color-foreground-strong: #FBFBFB;
439
- @dt-theme-mention-color-background: #7F56FF;
440
- @dt-theme-mention-color-background-strong: #350097;
443
+ @dt-theme-mention-color-foreground-strong: #F9F9F9;
444
+ @dt-theme-mention-color-background: #7C52FF;
445
+ @dt-theme-mention-color-background-strong: #3A1D95;
441
446
  @dt-avatar-color-foreground: #000000;
442
447
  @dt-avatar-color-background-100: #1aa340;
443
448
  @dt-avatar-color-background-200: #aaff83;
@@ -458,27 +463,27 @@
458
463
  @dt-avatar-color-background-1700: #ffd646;
459
464
  @dt-avatar-color-background-1800: #f1dab7;
460
465
  @dt-avatar-color-background-000: #e0e0e0;
461
- @dt-badge-color-background-default: hsl(0 0% 6.67% / 0.12);
462
- @dt-badge-color-background-info: #D8E2FF;
463
- @dt-badge-color-background-success: #B2F2B3;
464
- @dt-badge-color-background-warning: #FFDDB5;
465
- @dt-badge-color-background-critical: #FFB3B1;
466
- @dt-badge-color-background-bulletin: #7F56FF;
467
- @dt-badge-color-background-bulletin-subtle: #F5EEFF;
468
- @dt-badge-color-background-ai: linear-gradient(135deg, #E60083 10%, #7F56FF 90%);
469
- @dt-badge-color-foreground-default: #111111;
466
+ @dt-badge-color-background-default: hsl(0 0% 11% / 0.1);
467
+ @dt-badge-color-background-info: #BDE8FF;
468
+ @dt-badge-color-background-success: #DBFFA9;
469
+ @dt-badge-color-background-warning: #FFE89C;
470
+ @dt-badge-color-background-critical: #FFABA4;
471
+ @dt-badge-color-background-bulletin: #7C52FF;
472
+ @dt-badge-color-background-bulletin-subtle: #DAC7FF;
473
+ @dt-badge-color-background-ai: linear-gradient(135deg, #FF1BA4 10%, #7C52FF 90%);
474
+ @dt-badge-color-foreground-default: #1C1C1C;
470
475
  @dt-badge-color-foreground-bulletin: #ffffff;
471
- @dt-badge-color-foreground-bulletin-subtle: hsl(255 100% 26.7%);
472
- @dt-badge-color-border-default: hsl(0 0% 6.67% / 0.1);
473
- @dt-badge-color-border-bulletin-subtle: hsl(255 100% 66.9% / 0.5);
476
+ @dt-badge-color-foreground-bulletin-subtle: #3A1D95;
477
+ @dt-badge-color-border-default: hsl(0 0% 11% / 0.1);
478
+ @dt-badge-color-border-bulletin-subtle: hsl(255 100% 66.1% / 0.5);
474
479
  @dt-button-font-size-xs: 12px; // Extra small Button text size
475
480
  @dt-button-font-size-sm: 12px; // Small Button text size
476
481
  @dt-button-font-size-md: 15px; // Medium Button text size
477
482
  @dt-button-font-size-lg: 19px; // Large Button text size
478
483
  @dt-button-font-size-xl: 27px; // Extra large Button text size
479
- @dt-button-font-weight-xs: 500; // Font weight for XS button
480
- @dt-button-font-weight-sm: 500; // Font weight for SM button
481
- @dt-button-font-weight-md: 500; // Font weight for MD button
484
+ @dt-button-font-weight-xs: 600;
485
+ @dt-button-font-weight-sm: 600;
486
+ @dt-button-font-weight-md: 600;
482
487
  @dt-button-font-weight-lg: 500; // Font weight for LG button
483
488
  @dt-button-font-weight-xl: 400; // Font weight for XL button
484
489
  @dt-button-line-height-xs: 1.2; // Line-height for XS button
@@ -494,9 +499,9 @@
494
499
  @dt-checkbox-size-width: 1.6rem;
495
500
  @dt-checkbox-size-height: 1.6rem;
496
501
  @dt-checkbox-size-radius: 0.4rem;
497
- @dt-checkbox-color-border-unchecked: hsl(0 0% 6.67% / 0.25);
498
- @dt-checkbox-color-border-checked: #7F56FF;
499
- @dt-checkbox-color-background-checked: #7F56FF;
502
+ @dt-checkbox-color-border-unchecked: hsl(0 0% 11% / 0.25);
503
+ @dt-checkbox-color-border-checked: #7C52FF;
504
+ @dt-checkbox-color-background-checked: #7C52FF;
500
505
  @dt-icon-size-100: 12px;
501
506
  @dt-icon-size-200: 14px;
502
507
  @dt-icon-size-300: 18px;
@@ -516,6 +521,6 @@
516
521
  @dt-radio-size-width: 1.6rem;
517
522
  @dt-radio-size-height: 1.6rem;
518
523
  @dt-radio-size-radius: 50%;
519
- @dt-radio-color-border-unchecked: hsl(0 0% 6.67% / 0.25);
520
- @dt-radio-color-border-checked: #7F56FF;
521
- @dt-radio-color-background-checked: #7F56FF;
524
+ @dt-radio-color-border-unchecked: hsl(0 0% 11% / 0.25);
525
+ @dt-radio-color-border-checked: #7C52FF;
526
+ @dt-radio-color-background-checked: #7C52FF;