@zohodesk/dot 1.0.0-temp-131 → 1.0.0-temp-133

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 (153) hide show
  1. package/README.md +20 -0
  2. package/assets/Appearance/dark/mode/dotDarkMode.module.css +289 -289
  3. package/assets/Appearance/dark/themes/blue/blueDarkDotTheme.module.css +9 -9
  4. package/assets/Appearance/dark/themes/green/greenDarkDotTheme.module.css +9 -9
  5. package/assets/Appearance/dark/themes/orange/orangeDarkDotTheme.module.css +9 -9
  6. package/assets/Appearance/dark/themes/red/redDarkDotTheme.module.css +9 -9
  7. package/assets/Appearance/dark/themes/yellow/yellowDarkDotTheme.module.css +9 -9
  8. package/assets/Appearance/default/mode/dotDefaultMode.module.css +283 -283
  9. package/assets/Appearance/default/themes/blue/blueDefaultDotTheme.module.css +9 -9
  10. package/assets/Appearance/default/themes/green/greenDefaultDotTheme.module.css +9 -9
  11. package/assets/Appearance/default/themes/orange/orangeDefaultDotTheme.module.css +9 -9
  12. package/assets/Appearance/default/themes/red/redDefaultDotTheme.module.css +9 -9
  13. package/assets/Appearance/default/themes/yellow/yellowDefaultDotTheme.module.css +9 -9
  14. package/assets/Appearance/pureDark/mode/dotPureDarkMode.module.css +291 -291
  15. package/assets/Appearance/pureDark/themes/blue/bluePureDarkDotTheme.module.css +9 -9
  16. package/assets/Appearance/pureDark/themes/green/greenPureDarkDotTheme.module.css +9 -9
  17. package/assets/Appearance/pureDark/themes/orange/orangePureDarkDotTheme.module.css +9 -9
  18. package/assets/Appearance/pureDark/themes/red/redPureDarkDotTheme.module.css +9 -9
  19. package/assets/Appearance/pureDark/themes/yellow/yellowPureDarkDotTheme.module.css +9 -9
  20. package/es/ActionButton/ActionButton.js +1 -1
  21. package/es/Attachment/Attachment.js +1 -1
  22. package/es/AttachmentViewer/AttachmentViewer.js +1 -1
  23. package/es/ChannelIcon/ChannelIcon.js +1 -1
  24. package/es/Drawer/Drawer.js +1 -1
  25. package/es/FreezeLayer/FreezeLayer.js +61 -114
  26. package/es/FreezeLayer/css/cssJSLogic.js +23 -0
  27. package/es/FreezeLayer/index.js +2 -0
  28. package/es/FreezeLayer/props/defaultProps.js +1 -0
  29. package/es/FreezeLayer/props/propTypes.js +1 -0
  30. package/es/FreezeLayer/useFreezeLayer.js +50 -0
  31. package/es/IconButton/IconButton.js +1 -1
  32. package/es/ImportantNotes/ImportantNotes.js +1 -1
  33. package/es/Message/Message.js +1 -1
  34. package/es/MessageBanner/MessageBanner.js +1 -1
  35. package/es/NewStar/NewStar.js +1 -1
  36. package/es/ToastMessage/ToastMessage.js +1 -1
  37. package/es/Upload/Upload.js +1 -1
  38. package/es/alert/AlertHeader/AlertHeader.js +1 -1
  39. package/es/avatar/AvatarClose/AvatarClose.js +1 -1
  40. package/es/avatar/AvatarCollision/AvatarCollision.js +1 -1
  41. package/es/avatar/AvatarIcon/AvatarIcon.js +1 -1
  42. package/es/avatar/AvatarStatus/AvatarStatus.js +3 -1
  43. package/es/avatar/AvatarStatus/props/defaultProps.js +3 -1
  44. package/es/avatar/AvatarStatus/props/propTypes.js +2 -0
  45. package/es/avatar/AvatarThread/AvatarThread.js +1 -1
  46. package/es/avatar/AvatarUser/AvatarUser.js +1 -1
  47. package/es/avatar/AvatarWithTeam/AvatarWithTeam.js +3 -2
  48. package/es/avatar/AvatarWithTeam/props/defaultProps.js +2 -1
  49. package/es/avatar/AvatarWithTeam/props/propTypes.js +1 -0
  50. package/es/deprecated/FreezeLayer/FreezeLayer.js +128 -0
  51. package/es/deprecated/FreezeLayer/props/defaultProps.js +8 -0
  52. package/es/deprecated/FreezeLayer/props/propTypes.js +17 -0
  53. package/es/deprecated/SelectDropdown/SelectDropdown.js +1 -1
  54. package/es/docs/formDocs.js +1 -16
  55. package/es/docs/generalDocs.js +1 -107
  56. package/es/docs/lookupDocs.js +1 -35
  57. package/es/docs/setupDocs.js +1 -15
  58. package/es/dropdown/ToggleDropDown/ToggleDropDown.js +1 -1
  59. package/es/form/fields/FieldContainer/FieldContainer.js +1 -1
  60. package/es/form/fields/PhoneField/PhoneField.js +1 -1
  61. package/es/form/fields/ValidationMessage/ValidationMessage.js +1 -1
  62. package/es/index.js +0 -3
  63. package/es/layout/SetupDetailLayout/SetupDetailLayout.js +1 -1
  64. package/es/list/AvatarFlip/AvatarFlip.js +4 -2
  65. package/es/list/AvatarFlip/props/defaultProps.js +2 -1
  66. package/es/list/AvatarFlip/props/propTypes.js +2 -1
  67. package/es/list/BluePrintStatus/BluePrintStatus.js +1 -1
  68. package/es/list/Comment/Comment.js +1 -1
  69. package/es/list/Icons/AddNewIcon.js +1 -1
  70. package/es/list/Icons/CompleteIcon.js +1 -1
  71. package/es/list/Icons/DeleteIcon.js +1 -1
  72. package/es/list/Icons/EditIcon.js +1 -1
  73. package/es/list/Icons/ReadUnreadIcon.js +1 -1
  74. package/es/list/Icons/SmartIcon.js +1 -1
  75. package/es/list/SecondaryText/ContactName.js +1 -1
  76. package/es/list/SentimentStatus/SentimentStatus.js +1 -1
  77. package/es/list/Thread/Thread.js +1 -1
  78. package/es/list/UserTime/UserTime.js +1 -1
  79. package/es/list/status/StatusDropdown/StatusDropdown.js +1 -1
  80. package/es/list/status/StatusListItem/StatusListItem.js +1 -1
  81. package/es/lookup/header/Search/Search.js +1 -1
  82. package/es/lookup/header/ViewDropDown/ViewDropDown.js +1 -1
  83. package/es/setup/header/Link/Link.js +1 -1
  84. package/es/setup/header/Search/Search.js +1 -1
  85. package/es/setup/header/Views/Views.js +1 -1
  86. package/es/version2/AlertClose/AlertClose.js +1 -1
  87. package/lib/ActionButton/ActionButton.js +3 -3
  88. package/lib/Attachment/Attachment.js +3 -3
  89. package/lib/AttachmentViewer/AttachmentViewer.js +3 -3
  90. package/lib/ChannelIcon/ChannelIcon.js +3 -3
  91. package/lib/Drawer/Drawer.js +2 -2
  92. package/lib/FreezeLayer/FreezeLayer.js +58 -141
  93. package/lib/FreezeLayer/css/FreezeLayer.module.css +42 -0
  94. package/lib/FreezeLayer/css/cssJSLogic.js +22 -0
  95. package/lib/FreezeLayer/index.js +20 -0
  96. package/lib/FreezeLayer/props/defaultProps.js +1 -0
  97. package/lib/FreezeLayer/props/propTypes.js +1 -0
  98. package/lib/FreezeLayer/useFreezeLayer.js +73 -0
  99. package/lib/IconButton/IconButton.js +2 -2
  100. package/lib/ImportantNotes/ImportantNotes.js +2 -2
  101. package/lib/Message/Message.js +3 -3
  102. package/lib/MessageBanner/MessageBanner.js +2 -2
  103. package/lib/NewStar/NewStar.js +4 -4
  104. package/lib/ToastMessage/ToastMessage.js +5 -5
  105. package/lib/Upload/Upload.js +3 -3
  106. package/lib/alert/AlertHeader/AlertHeader.js +2 -2
  107. package/lib/avatar/AvatarClose/AvatarClose.js +2 -2
  108. package/lib/avatar/AvatarCollision/AvatarCollision.js +2 -2
  109. package/lib/avatar/AvatarIcon/AvatarIcon.js +2 -2
  110. package/lib/avatar/AvatarStatus/AvatarStatus.js +3 -1
  111. package/lib/avatar/AvatarStatus/props/defaultProps.js +3 -1
  112. package/lib/avatar/AvatarStatus/props/propTypes.js +22 -24
  113. package/lib/avatar/AvatarThread/AvatarThread.js +2 -2
  114. package/lib/avatar/AvatarUser/AvatarUser.js +5 -5
  115. package/lib/avatar/AvatarWithTeam/AvatarWithTeam.js +3 -2
  116. package/lib/avatar/AvatarWithTeam/props/defaultProps.js +2 -1
  117. package/lib/avatar/AvatarWithTeam/props/propTypes.js +1 -0
  118. package/lib/deprecated/FreezeLayer/FreezeLayer.js +161 -0
  119. package/lib/deprecated/FreezeLayer/FreezeLayer.module.css +42 -0
  120. package/lib/deprecated/FreezeLayer/props/defaultProps.js +15 -0
  121. package/lib/deprecated/FreezeLayer/props/propTypes.js +25 -0
  122. package/lib/deprecated/SelectDropdown/SelectDropdown.js +2 -2
  123. package/lib/dropdown/ToggleDropDown/ToggleDropDown.js +3 -3
  124. package/lib/form/fields/FieldContainer/FieldContainer.js +3 -3
  125. package/lib/form/fields/PhoneField/PhoneField.js +2 -2
  126. package/lib/form/fields/ValidationMessage/ValidationMessage.js +2 -2
  127. package/lib/layout/SetupDetailLayout/SetupDetailLayout.js +6 -6
  128. package/lib/list/AvatarFlip/AvatarFlip.js +4 -2
  129. package/lib/list/AvatarFlip/props/defaultProps.js +2 -1
  130. package/lib/list/AvatarFlip/props/propTypes.js +2 -1
  131. package/lib/list/BluePrintStatus/BluePrintStatus.js +2 -2
  132. package/lib/list/Comment/Comment.js +2 -2
  133. package/lib/list/Icons/AddNewIcon.js +2 -2
  134. package/lib/list/Icons/CompleteIcon.js +2 -2
  135. package/lib/list/Icons/DeleteIcon.js +2 -2
  136. package/lib/list/Icons/EditIcon.js +2 -2
  137. package/lib/list/Icons/ReadUnreadIcon.js +2 -2
  138. package/lib/list/Icons/SmartIcon.js +2 -2
  139. package/lib/list/SecondaryText/ContactName.js +2 -2
  140. package/lib/list/SentimentStatus/SentimentStatus.js +2 -2
  141. package/lib/list/Thread/Thread.js +2 -2
  142. package/lib/list/UserTime/UserTime.js +8 -8
  143. package/lib/list/status/StatusDropdown/StatusDropdown.js +2 -2
  144. package/lib/list/status/StatusListItem/StatusListItem.js +2 -2
  145. package/lib/lookup/header/Search/Search.js +4 -4
  146. package/lib/lookup/header/ViewDropDown/ViewDropDown.js +2 -2
  147. package/lib/setup/header/Link/Link.js +2 -2
  148. package/lib/setup/header/Search/Search.js +2 -2
  149. package/lib/setup/header/Views/Views.js +3 -3
  150. package/lib/version2/AlertClose/AlertClose.js +2 -2
  151. package/package.json +7 -7
  152. /package/es/FreezeLayer/{FreezeLayer.module.css → css/FreezeLayer.module.css} +0 -0
  153. /package/{lib → es/deprecated}/FreezeLayer/FreezeLayer.module.css +0 -0
@@ -4,192 +4,192 @@
4
4
  --zdt_actionButton_primaryFilled_hover_bg: var(--zdt_cta_primary_hover_bg);
5
5
  --zdt_actionButton_primary_border: var(--zdt_cta_primary_border);
6
6
  --zdt_actionButton_primary_hover_border: var(--zdt_cta_primary_hover_border);
7
- --zdt_actionButton_separator_border: var(--zdt_cta_secondary_border);
7
+ --zdt_actionButton_separator_border: var(--zdt_m_cta_secondary_border_borderLighterBoth);
8
8
  --zdt_actionButton_separator_hover_border: var(--zdt_cta_primary_border);
9
- --zdt_actionButton_primaryFilled_text: var(--zdt_m_cta_secondary_text_text);
9
+ --zdt_actionButton_primaryFilled_text: var(--zdt_cta_secondary_text);
10
10
  --zdt_actionButton_primary_text: var(--zdt_cta_primary_text);
11
11
  --zdt_actionButton_primary_hover_text: var(--zdt_cta_primary_hover_text);
12
12
 
13
13
  /* alert header */
14
- --zdt_alertheader_default_bg: hsl(216, 29%, calc(97% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
15
- --zdt_alertheader_default_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
16
- --zdt_alertheader_primary_bg: hsl(191, 89%, calc(96% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
17
- --zdt_alertheader_primary_text: hsl(204, 72%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
18
- --zdt_alertheader_danger_bg: hsl(0, 89%, calc(96% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
19
- --zdt_alertheader_danger_text: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
14
+ --zdt_alertheader_default_bg: hsla(216, 29%, calc(97% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
15
+ --zdt_alertheader_default_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
16
+ --zdt_alertheader_primary_bg: hsla(191, 89%, calc(96% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
17
+ --zdt_alertheader_primary_text: hsla(204, 72%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
18
+ --zdt_alertheader_danger_bg: hsla(0, 89%, calc(96% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
19
+ --zdt_alertheader_danger_text: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
20
20
 
21
21
  /* alert lookup */
22
- --zdt_alertlookup_innersection_text: hsl(0, 0%, calc(20% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
22
+ --zdt_alertlookup_innersection_text: hsla(0, 0%, calc(20% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
23
23
 
24
24
  /* alphabetic list */
25
- --zdt_alphabeticList_text: hsl(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
25
+ --zdt_alphabeticList_text: hsla(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
26
26
  --zdt_alphabeticList_hover_text: var(--zdt_cta_primary_text);
27
27
 
28
28
  /* attachment */
29
- --zdt_attachment_default_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
29
+ --zdt_attachment_default_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
30
30
  --zdt_attachment_default_border: var(--zdt_m_cta_grey_40_border_border);
31
- --zdt_attachment_default_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
32
- --zdt_attachment_default_hover_border: hsl(218, 10%, calc(52% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
31
+ --zdt_attachment_default_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
32
+ --zdt_attachment_default_hover_border: hsla(218, 10%, calc(52% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
33
33
  --zdt_attachment_download_bg: var(--zdt_cta_grey_10_bg);
34
34
  --zdt_attachment_download_hover_bg: var(--zdt_cta_grey_35_bg);
35
- --zdt_avataruser_delete_text: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
35
+ --zdt_avataruser_delete_text: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
36
36
 
37
37
  /* avatar with team */
38
- --zdt_avatarwithteam_default_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
38
+ --zdt_avatarwithteam_default_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
39
39
 
40
40
  /* avatar icon */
41
- --zdt_avatarIcon_dark_icon: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
42
- --zdt_avatarIcon_danger_icon: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
43
- --zdt_avatarIcon_primary_icon: hsl(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
44
- --zdt_avatarIcon_grey_icon: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
45
- --zdt_avatarIcon_success_icon: hsl(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
46
- --zdt_avatarIcon_smoke_icon: hsl(0, 0%, calc(67% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
41
+ --zdt_avatarIcon_dark_icon: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
42
+ --zdt_avatarIcon_danger_icon: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
43
+ --zdt_avatarIcon_primary_icon: hsla(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
44
+ --zdt_avatarIcon_grey_icon: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
45
+ --zdt_avatarIcon_success_icon: hsla(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
46
+ --zdt_avatarIcon_smoke_icon: hsla(0, 0%, calc(67% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
47
47
  --zdt_avatarIcon_default_border: var(--zdt_m_cta_grey_40_border_border);
48
- --zdt_avatarIcon_default_hover_border: hsl(218, 10%, calc(52% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
49
- --zdt_avatarIcon_primary_border: hsl(212, 92%, calc(48% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
50
- --zdt_avatarIcon_primary_hover_border: hsl(213, 100%, calc(36% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
51
- --zdt_avatarIcon_secondary_border: hsl(201, 100%, calc(50% + var(--zd_default_border_lValue)), calc( 0.3 + var(--zd_alpha)));
52
- --zdt_avatarIcon_secondary_hover_border: hsl(201, 100%, calc(50% + var(--zd_default_border_lValue)), calc( 0.3 + var(--zd_alpha)));
53
- --zdt_avatarIcon_success_border: hsl(133, 63%, calc(41% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
54
- --zdt_avatarIcon_success_hover_border: hsl(134, 79%, calc(26% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
55
- --zdt_avatarIcon_danger_border: hsl(0, 72%, calc(54% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
56
- --zdt_avatarIcon_danger_hover_border: hsl(1, 75%, calc(38% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
48
+ --zdt_avatarIcon_default_hover_border: hsla(218, 10%, calc(52% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
49
+ --zdt_avatarIcon_primary_border: hsla(212, 92%, calc(48% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
50
+ --zdt_avatarIcon_primary_hover_border: hsla(213, 100%, calc(36% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
51
+ --zdt_avatarIcon_secondary_border: hsla(201, 100%, calc(50% + var(--zd_default_border_lValue)), calc( 0.3 + var(--zd_alpha)));
52
+ --zdt_avatarIcon_secondary_hover_border: hsla(201, 100%, calc(50% + var(--zd_default_border_lValue)), calc( 0.3 + var(--zd_alpha)));
53
+ --zdt_avatarIcon_success_border: hsla(133, 63%, calc(41% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
54
+ --zdt_avatarIcon_success_hover_border: hsla(134, 79%, calc(26% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
55
+ --zdt_avatarIcon_danger_border: hsla(0, 72%, calc(54% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
56
+ --zdt_avatarIcon_danger_hover_border: hsla(1, 75%, calc(38% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
57
57
 
58
58
  /* avatar status */
59
- --zdt_avatarstatus_size_border: hsl(0, 0%, calc(100% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
60
- --zdt_avatarstatus_online_bg: hsl(133, 63%, calc(41% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
61
- --zdt_avatarstatus_offline_bg: hsl(231, 22%, calc(82% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
62
- --zdt_avatarstatus_idle_bg: hsl(26, 100%, calc(50% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
59
+ --zdt_avatarstatus_size_border: hsla(0, 0%, calc(100% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
60
+ --zdt_avatarstatus_online_bg: hsla(133, 63%, calc(41% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
61
+ --zdt_avatarstatus_offline_bg: hsla(231, 22%, calc(82% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
62
+ --zdt_avatarstatus_idle_bg: hsla(26, 100%, calc(50% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
63
63
 
64
64
  /* avatar thread */
65
- --zdt_avatarthread_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
65
+ --zdt_avatarthread_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
66
66
  --zdt_avatarthread_default_border: var(--zdt_cta_grey_35_border);
67
- --zdt_avatarthread_default_text: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
68
- --zdt_avatarthread_primary_border: hsl(212, 92%, calc(48% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
69
- --zdt_avatarthread_primary_text: hsl(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
70
- --zdt_avatarthread_success_border: hsl(133, 63%, calc(41% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
71
- --zdt_avatarthread_success_text: hsl(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
72
- --zdt_avatarthread_danger_border: hsl(0, 72%, calc(54% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
73
- --zdt_avatarthread_danger_text: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
74
- --zdt_avatarthread_orange_border: hsl(26, 100%, calc(50% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
75
- --zdt_avatarthread_orange_text: hsl(26, 100%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
67
+ --zdt_avatarthread_default_text: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
68
+ --zdt_avatarthread_primary_border: hsla(212, 92%, calc(48% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
69
+ --zdt_avatarthread_primary_text: hsla(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
70
+ --zdt_avatarthread_success_border: hsla(133, 63%, calc(41% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
71
+ --zdt_avatarthread_success_text: hsla(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
72
+ --zdt_avatarthread_danger_border: hsla(0, 72%, calc(54% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
73
+ --zdt_avatarthread_danger_text: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
74
+ --zdt_avatarthread_orange_border: hsla(26, 100%, calc(50% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
75
+ --zdt_avatarthread_orange_text: hsla(26, 100%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
76
76
 
77
77
  /* avatar user */
78
- --zdt_avataruser_default_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
79
- --zdt_avataruser_delete_bg: hsl(0, 0%, calc(0% + var(--zd_default_bg_lValue)), calc( 0.75 + var(--zd_bg_alpha)));
80
- --zdt_avataruser_delete_text: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
78
+ --zdt_avataruser_default_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
79
+ --zdt_avataruser_delete_bg: hsla(0, 0%, calc(0% + var(--zd_default_bg_lValue)), calc( 0.75 + var(--zd_bg_alpha)));
80
+ --zdt_avataruser_delete_text: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
81
81
 
82
82
  /* avatar with team */
83
- --zdt_avatarteam_default_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
83
+ --zdt_avatarteam_default_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
84
84
 
85
85
  /* channel icon */
86
- --zdt_channelIcon_icon: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
87
- --zdt_channelIcon_topIcon_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
88
- --zdt_channelIcon_topIcon_iconGreen: hsl(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
89
- --zdt_channelIcon_topIcon_iconYellow: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
86
+ --zdt_channelIcon_icon: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
87
+ --zdt_channelIcon_topIcon_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
88
+ --zdt_channelIcon_topIcon_iconGreen: hsla(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
89
+ --zdt_channelIcon_topIcon_iconYellow: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
90
90
  --zdt_channelIcon_topIcon_border: var(--zdt_cta_grey_35_border);
91
91
 
92
92
  /* drawer */
93
93
  --zdt_drawer_default_box_shadow: rgba(0, 0, 0, 0.176);
94
- --zdt_drawer_default_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
95
- --zdt_drawer_header_bg: var(--zdt_m_cta_grey_10_bg_bg);
94
+ --zdt_drawer_default_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
95
+ --zdt_drawer_header_bg: var(--zdt_m_cta_grey_10_bg_bgDarkerLighterMild);
96
96
  --zdt_drawer_header_border: var(--zdt_cta_grey_35_border);
97
- --zdt_drawer_title_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
97
+ --zdt_drawer_title_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
98
98
 
99
99
  /* toggle dropdown */
100
100
  --zdt_toggledropdown_line_border: var(--zdt_cta_grey_15_border);
101
101
 
102
102
  /* common empty state */
103
- --zdt_commonEmptyState_default_title: hsl(217, 26%, calc(16% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
104
- --zdt_commonEmptyState_default_description: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
103
+ --zdt_commonEmptyState_default_title: hsla(217, 26%, calc(16% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
104
+ --zdt_commonEmptyState_default_description: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
105
105
  --zdt_commonEmptyState_default_link: var(--zdt_cta_primary_text);
106
106
  --zdt_commonEmptyState_default_link_hover: var(--zdt_cta_primary_hover_text);
107
107
 
108
108
  /* edition page */
109
- --zdt_editionpage_footer_text: hsl(0, 0%, calc(93% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
109
+ --zdt_editionpage_footer_text: hsla(0, 0%, calc(93% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
110
110
  --zdt_editionpage_primary_text: var(--zdt_cta_primary_text);
111
111
 
112
112
  /* error state empty */
113
- --zdt_emptystate_default_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
114
- --zdt_emptystate_title_text: hsl(0, 0%, calc(15% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
113
+ --zdt_emptystate_default_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
114
+ --zdt_emptystate_title_text: hsla(0, 0%, calc(15% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
115
115
 
116
116
  /* link text */
117
117
  --zdt_linktext_default_text: var(--zdt_cta_primary_text);
118
118
 
119
119
  /* permission play */
120
- --zdt_permissionplay_title_text: hsl(0, 0%, calc(15% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
120
+ --zdt_permissionplay_title_text: hsla(0, 0%, calc(15% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
121
121
 
122
122
  /* will back */
123
- --zdt_willback_title_text: hsl(220, 2%, calc(68% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
123
+ --zdt_willback_title_text: hsla(220, 2%, calc(68% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
124
124
 
125
125
  /* flip card */
126
126
  --zdt_flipcard_default_bg: var(--dot_mirror);
127
- --zdt_flipcard_default_text: hsl(0, 0%, calc(47% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
127
+ --zdt_flipcard_default_text: hsla(0, 0%, calc(47% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
128
128
 
129
129
  /* form fields */
130
- --zdt_fields_phoneicon_icon: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
131
- --zdt_fields_phoneicon_hover_icon: hsl(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
132
- --zdt_fields_lockicon_icon: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
133
- --zdt_fields_lockicon_hover_icon: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
134
- --zdt_fields_phitag_text: hsl(134, 79%, calc(26% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
135
- --zdt_fields_phitag_bg: hsl(143, 44%, calc(96% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
136
- --zdt_fields_phitag_border: hsl(133, 63%, calc(41% + var(--zd_default_border_lValue)), calc( 0.2 + var(--zd_alpha)));
137
- --zdt_fields_newtabicon_icon: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
130
+ --zdt_fields_phoneicon_icon: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
131
+ --zdt_fields_phoneicon_hover_icon: hsla(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
132
+ --zdt_fields_lockicon_icon: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
133
+ --zdt_fields_lockicon_hover_icon: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
134
+ --zdt_fields_phitag_text: hsla(134, 79%, calc(26% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
135
+ --zdt_fields_phitag_bg: hsla(143, 44%, calc(96% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
136
+ --zdt_fields_phitag_border: hsla(133, 63%, calc(41% + var(--zd_default_border_lValue)), calc( 0.2 + var(--zd_alpha)));
137
+ --zdt_fields_newtabicon_icon: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
138
138
  --zdt_fields_newtabicon_hover_icon: var(--zdt_cta_primary_text);
139
139
 
140
140
  /* form action */
141
- --zdt_formAction_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
141
+ --zdt_formAction_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
142
142
  --zdt_formAction_border: var(--zdt_cta_grey_15_border);
143
143
 
144
144
  /* freezelayer */
145
- --zdt_freezelayer_default_bg: hsl(0, 0%, calc(0% + var(--zd_default_bg_lValue)), calc( 0.45 + var(--zd_bg_alpha)));
146
- --zdt_freezelayer_dark_bg: hsl(0, 0%, calc(0% + var(--zd_default_bgDarkerBoth_lValue)), calc( 0.9 + var(--zd_bg_alpha)));
145
+ --zdt_freezelayer_default_bg: rgba(0, 0, 0, 0.45);
146
+ --zdt_freezelayer_dark_bg: rgba(0, 0, 0, 0.9);
147
147
  --zdt_freezelayer_plain_bg: var(--dot_mirror);
148
- --zdt_freezelayer_snow_bg: hsl(227, 27%, calc(24% + var(--zd_default_bgDarkerLighter_lValue)), calc( 0.45 + var(--zd_alpha)));
148
+ --zdt_freezelayer_snow_bg: rgba(44, 51, 77, 0.45);
149
149
 
150
150
  /* icon button */
151
- --zdt_iconButton_icon_black: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
151
+ --zdt_iconButton_icon_black: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
152
152
  --zdt_iconButton_icon_primary: var(--zdt_cta_alpha_text);
153
153
  --zdt_iconButton_icon_primaryHover: var(--zdt_cta_alpha_hover_text);
154
- --zdt_iconButton_icon_primaryActive: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
154
+ --zdt_iconButton_icon_primaryActive: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
155
155
 
156
156
  /* important notes */
157
- --zdt_importantnotes_bg: hsl(37, 90%, calc(96% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
158
- --zdt_importantnotes_title_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
159
- --zdt_importantnotes_icon: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
157
+ --zdt_importantnotes_bg: hsla(37, 90%, calc(96% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
158
+ --zdt_importantnotes_title_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
159
+ --zdt_importantnotes_icon: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
160
160
 
161
161
  /* setup detail layout */
162
- --zdt_setupdetail_header_border: hsl(200, 7%, calc(92% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
163
- --zdt_setupdetail_backicon: hsl(0, 0%, calc(20% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
164
- --zdt_setupdetail_hover_backicon_bg: hsl(0, 0%, calc(97% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
165
- --zdt_setupdetail_helpinfo: hsl(0, 0%, calc(88% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
166
- --zdt_setupdetail_helpinfo_text: hsl(0, 0%, calc(60% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
167
- --zdt_setupdetail_popup_border: hsl(0, 0%, calc(91% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
168
- --zdt_setupdetail_popup_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
169
- --zdt_setupdetail_infoheader_bg: hsl(206, 89%, calc(46% + var(--zd_default_bg_lValue)), calc( 0.1 + var(--zd_bg_alpha)));
170
- --zdt_setupdetail_infoheader_text: hsl(206, 89%, calc(46% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
171
- --zdt_setupdetail_infoicon_border: hsl(206, 89%, calc(46% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
172
- --zdt_setupdetail_infoclose: hsl(0, 0%, calc(53% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
162
+ --zdt_setupdetail_header_border: hsla(200, 7%, calc(92% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
163
+ --zdt_setupdetail_backicon: hsla(0, 0%, calc(20% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
164
+ --zdt_setupdetail_hover_backicon_bg: hsla(0, 0%, calc(97% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
165
+ --zdt_setupdetail_helpinfo: hsla(0, 0%, calc(88% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
166
+ --zdt_setupdetail_helpinfo_text: hsla(0, 0%, calc(60% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
167
+ --zdt_setupdetail_popup_border: hsla(0, 0%, calc(91% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
168
+ --zdt_setupdetail_popup_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
169
+ --zdt_setupdetail_infoheader_bg: hsla(206, 89%, calc(46% + var(--zd_default_bg_lValue)), calc( 0.1 + var(--zd_bg_alpha)));
170
+ --zdt_setupdetail_infoheader_text: hsla(206, 89%, calc(46% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
171
+ --zdt_setupdetail_infoicon_border: hsla(206, 89%, calc(46% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
172
+ --zdt_setupdetail_infoclose: hsla(0, 0%, calc(53% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
173
173
 
174
174
  /* subtab layout */
175
175
  --zdt_subtablayout_border: var(--zdt_cta_grey_15_border);
176
- --zdt_subtablayout_tabhead_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
177
- --zdt_subtablayout_plusicon_bg: hsl(0, 0%, calc(92% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
178
- --zdt_subtablayout_primary_border: hsl(0, 0%, calc(93% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
176
+ --zdt_subtablayout_tabhead_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
177
+ --zdt_subtablayout_plusicon_bg: hsla(0, 0%, calc(92% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
178
+ --zdt_subtablayout_primary_border: hsla(0, 0%, calc(93% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
179
179
  --zdt_subtablayout_shadowstyle_box_shadow: rgba(0, 0, 0, 0.15);
180
180
  --zdt_subtablayout_title_text: var(--zdt_cta_primary_text);
181
- --zdt_subtablayout_label_text: hsl(0, 0%, calc(67% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
181
+ --zdt_subtablayout_label_text: hsla(0, 0%, calc(67% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
182
182
 
183
183
  /* avatar flip */
184
- --zdt_avatarflip_default_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
184
+ --zdt_avatarflip_default_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
185
185
 
186
186
  /* comment icon */
187
- --zdt_comment_iconText: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
188
- --zdt_comment_hover_iconText: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
187
+ --zdt_comment_iconText: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
188
+ --zdt_comment_hover_iconText: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
189
189
 
190
190
  /* department dropdown */
191
- --zdt_departmentdropdown_default_text: hsl(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
192
- --zdt_departmentdropdown_default_hover_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
191
+ --zdt_departmentdropdown_default_text: hsla(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
192
+ --zdt_departmentdropdown_default_hover_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
193
193
 
194
194
  /* dot */
195
195
  --zdt_dot_text: var(--zdt_cta_grey_40_text);
@@ -201,87 +201,87 @@
201
201
  --zdt_dotnew_animate_to_box_shadow: rgba(255, 255, 255, 0);
202
202
 
203
203
  /* grid stencils */
204
- --zdt_gridstencils_default_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
205
- --zdt_gridstencils_default_border: hsl(0, 0%, calc(95% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
206
- --zdt_gridstencils_after_bg: hsl(0, 0%, calc(92% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
207
- --zdt_gridstencils_listbar_bg: hsl(210, 12%, calc(97% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
204
+ --zdt_gridstencils_default_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
205
+ --zdt_gridstencils_default_border: hsla(0, 0%, calc(95% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
206
+ --zdt_gridstencils_after_bg: hsla(0, 0%, calc(92% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
207
+ --zdt_gridstencils_listbar_bg: hsla(210, 12%, calc(97% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
208
208
  --zdt_gridstencils_listbar_gradient_bg: linear-gradient(to left, var(--zd_smoke78) 0, #edeef1 20%, var(--zd_smoke78) 40%, var(--zd_smoke78) 100%);
209
209
 
210
210
  /* icons */
211
- --zdt_icons_default: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
211
+ --zdt_icons_default: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
212
212
  --zdt_icons_hover_blue: var(--zdt_cta_primary_text);
213
- --zdt_icons_hover_red: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
213
+ --zdt_icons_hover_red: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
214
214
 
215
215
  /* list layout */
216
216
  --zdt_listLayout_border: var(--zdt_cta_grey_15_border);
217
217
  --zdt_listLayout_hover_bg: var(--dot_listItemHover);
218
218
  --zdt_listLayout_active_bg: var(--dot_listItemActive);
219
219
  --zdt_listLayout_active_border: var(--zdt_cta_primary_border);
220
- --zdt_listLayout_keyboard_active_border: hsl(218, 10%, calc(52% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
220
+ --zdt_listLayout_keyboard_active_border: hsla(218, 10%, calc(52% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
221
221
 
222
222
  /* list stencils */
223
223
  --zdt_liststencils_innercontainer_border: var(--zdt_cta_grey_15_border);
224
224
 
225
225
  /* secondary text */
226
- --zdt_secondaryText_gray_text: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
227
- --zdt_secondaryText_orage_text: hsl(26, 100%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
228
- --zdt_secondaryText_green_text: hsl(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
229
- --zdt_secondaryText_red_text: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
226
+ --zdt_secondaryText_gray_text: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
227
+ --zdt_secondaryText_orage_text: hsla(26, 100%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
228
+ --zdt_secondaryText_green_text: hsla(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
229
+ --zdt_secondaryText_red_text: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
230
230
  --zdt_secondaryText_blue_text: var(--zdt_cta_primary_text);
231
231
  --zdt_secondaryText_blue_hover_text: var(--zdt_cta_primary_hover_text);
232
- --zdt_secondaryText_black_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
233
- --zdt_secondaryText_secondaryText_text: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
232
+ --zdt_secondaryText_black_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
233
+ --zdt_secondaryText_secondaryText_text: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
234
234
 
235
235
  /* status dropdown */
236
236
  --zdt_statusdropdown_line_border: var(--zdt_cta_grey_15_border);
237
237
 
238
238
  /* status listitem */
239
- --zdt_statuslistitem_list_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
239
+ --zdt_statuslistitem_list_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
240
240
  --zdt_statuslistitem_default_border: var(--dot_mirror);
241
241
  --zdt_statuslistitem_default_active_border: var(--zdt_cta_primary_border);
242
242
  --zdt_statuslistitem_default_effect_bg: var(--dot_listItemHover);
243
243
  --zdt_statuslistitem_primary_efffect_bg: var(--dot_listItemActive);
244
244
  --zdt_statuslistitem_secondary_effect_bg: var(--zdt_m_cta_primary_bg_bg);
245
- --zdt_statuslistitem_secondary_effect_text: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
245
+ --zdt_statuslistitem_secondary_effect_text: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
246
246
  --zdt_statuslistitem_tickicon: var(--zdt_cta_primary_text);
247
- --zdt_statuslistitem_black_bg: hsl(0, 0%, calc(0% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
248
- --zdt_statuslistitem_orange_bg: hsl(26, 100%, calc(50% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
249
- --zdt_statuslistitem_green_bg: hsl(133, 63%, calc(41% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
247
+ --zdt_statuslistitem_black_bg: hsla(0, 0%, calc(0% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
248
+ --zdt_statuslistitem_orange_bg: hsla(26, 100%, calc(50% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
249
+ --zdt_statuslistitem_green_bg: hsla(133, 63%, calc(41% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
250
250
 
251
251
  /* subject */
252
- --zdt_subject_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
252
+ --zdt_subject_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
253
253
 
254
254
  /* tag new */
255
255
  --zdt_tagnew_default_bg: var(--zdt_m_cta_primary_bg_bg);
256
256
  --zdt_tagnew_default_box_shadow: var(--zdt_cta_primary_box_shadow);
257
- --zdt_tagnew_default_text: var(--zdt_m_cta_secondary_text_text);
257
+ --zdt_tagnew_default_text: var(--zdt_m_cta_secondary_text_textLighterBoth);
258
258
 
259
259
  /* thread */
260
- --zdt_thread_iconText: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
261
- --zdt_thread_hover_iconText: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
260
+ --zdt_thread_iconText: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
261
+ --zdt_thread_hover_iconText: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
262
262
 
263
263
  /* usertime */
264
- --zdt_usertime_timeText: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
265
- --zdt_usertime_icon_red: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
266
- --zdt_usertime_icon_green: hsl(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
267
- --zdt_usertime_icon_orange: hsl(26, 100%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
268
- --zdt_usertime_icon_gray: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
264
+ --zdt_usertime_timeText: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
265
+ --zdt_usertime_icon_red: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
266
+ --zdt_usertime_icon_green: hsla(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
267
+ --zdt_usertime_icon_orange: hsla(26, 100%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
268
+ --zdt_usertime_icon_gray: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
269
269
 
270
270
  /* loader */
271
271
  --zdt_loader_gradient_bg: linear-gradient(to right, rgb(206, 34, 50) 0%, rgb(96, 128, 64) 20%, rgb(144, 178, 71) 40%, rgb(249, 221, 75) 60%, rgb(9, 116, 176) 80%, rgb(206, 34, 50) 100%);
272
272
 
273
273
  /* lookup header common */
274
- --zdt_lookupheader_default_bg: var(--zdt_m_cta_grey_10_bg_bg);
275
- --zdt_lookupheader_white_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
274
+ --zdt_lookupheader_default_bg: var(--zdt_m_cta_grey_10_bg_bgDarkerLighter);
275
+ --zdt_lookupheader_white_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
276
276
  --zdt_lookupheader_default_border: var(--zdt_cta_grey_35_border);
277
277
  --zdt_lookupheader_white_border: var(--zdt_cta_grey_15_border);
278
- --zdt_lookupheader_para_text: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
279
- --zdt_lookupheader_input_border: hsl(0, 0%, calc(90% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
278
+ --zdt_lookupheader_para_text: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
279
+ --zdt_lookupheader_input_border: hsla(0, 0%, calc(90% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
280
280
 
281
281
  /* lookup close */
282
- --zdt_lookupclose_default_text: hsl(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
283
- --zdt_lookupclose_default_hover_bg: hsl(0, 0%, calc(93% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
284
- --zdt_lookupclose_default_hover_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
282
+ --zdt_lookupclose_default_text: hsla(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
283
+ --zdt_lookupclose_default_hover_bg: hsla(0, 0%, calc(93% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
284
+ --zdt_lookupclose_default_hover_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
285
285
 
286
286
  /* lookup search */
287
287
  --zdt_lookupsearch_boxstyle_border: var(--zdt_cta_grey_35_border);
@@ -289,45 +289,45 @@
289
289
  --zdt_lookupsearch_boxstyle_activer_border: var(--dot_inputLineFocus);
290
290
 
291
291
  /* lookup ticket header */
292
- --zdt_lookupticketheader_border: hsl(0, 0%, calc(90% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
292
+ --zdt_lookupticketheader_border: hsla(0, 0%, calc(90% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
293
293
 
294
294
  /* lookup title */
295
- --zdt_lookuptitle_default_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
296
- --zdt_lookuptitle_primary_text: hsl(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
297
- --zdt_lookuptitle_danger_text: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
295
+ --zdt_lookuptitle_default_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
296
+ --zdt_lookuptitle_primary_text: hsla(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
297
+ --zdt_lookuptitle_danger_text: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
298
298
 
299
299
  /* view dropdown */
300
- --zdt_viewdropdown_empty_text: hsl(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
301
- --zdt_viewdropdown_label_text: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
302
- --zdt_viewdropdown_hover_label_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
300
+ --zdt_viewdropdown_empty_text: hsla(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
301
+ --zdt_viewdropdown_label_text: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
302
+ --zdt_viewdropdown_hover_label_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
303
303
 
304
304
  /* lookup section */
305
- --zdt_lookupsection_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
305
+ --zdt_lookupsection_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
306
306
  --zdt_lookupsection_box_shadow: rgba(55, 84, 170, 0.25);
307
307
 
308
308
  /* message */
309
309
  --zdt_message_default_box_shadow: rgba(0, 0, 0, 0.15);
310
- --zdt_message_default_bg: hsl(0, 0%, calc(100% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
311
- --zdt_message_success_bg: hsl(133, 63%, calc(41% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
312
- --zdt_message_alert_bg: hsl(0, 72%, calc(54% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
313
- --zdt_message_info_bg: hsl(187, 100%, calc(43% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
314
- --zdt_message_tickicon: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
315
- --zdt_message_close_text: hsl(0, 0%, calc(60% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
310
+ --zdt_message_default_bg: hsla(0, 0%, calc(100% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
311
+ --zdt_message_success_bg: hsla(133, 63%, calc(41% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
312
+ --zdt_message_alert_bg: hsla(0, 72%, calc(54% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
313
+ --zdt_message_info_bg: hsla(187, 100%, calc(43% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
314
+ --zdt_message_tickicon: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
315
+ --zdt_message_close_text: hsla(0, 0%, calc(60% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
316
316
 
317
317
  /* message banner */
318
- --zdt_messagebanner_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
318
+ --zdt_messagebanner_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
319
319
  --zdt_messagebanner_link_text: var(--zdt_cta_primary_text);
320
- --zdt_messagebanner_close_text: hsl(0, 0%, calc(67% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
321
- --zdt_messagebanner_close_hover_bg: hsl(60, 50%, calc(85% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
322
- --zdt_messagebanner_close_hover_text: hsl(0, 0%, calc(15% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
323
- --zdt_messagebanner_default_bg: hsl(62, 100%, calc(93% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
324
- --zdt_messagebanner_blue_bg: hsl(210, 91%, calc(96% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
325
- --zdt_messagebanner_white_text: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
320
+ --zdt_messagebanner_close_text: hsla(0, 0%, calc(67% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
321
+ --zdt_messagebanner_close_hover_bg: hsla(60, 50%, calc(85% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
322
+ --zdt_messagebanner_close_hover_text: hsla(0, 0%, calc(15% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
323
+ --zdt_messagebanner_default_bg: hsla(62, 100%, calc(93% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
324
+ --zdt_messagebanner_blue_bg: hsla(210, 91%, calc(96% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
325
+ --zdt_messagebanner_white_text: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
326
326
 
327
327
  /* new star */
328
- --zdt_newstar_green_text: hsl(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
329
- --zdt_newstar_yellow_text: hsl(50, 90%, calc(47% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
330
- --zdt_newstar_blue_text: hsl(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
328
+ --zdt_newstar_green_text: hsla(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
329
+ --zdt_newstar_yellow_text: hsla(50, 90%, calc(47% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
330
+ --zdt_newstar_blue_text: hsla(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
331
331
 
332
332
  /* plus icon */
333
333
  --zdt_plusicon_box_shadow: var(--zdt_cta_primary_box_shadow);
@@ -341,206 +341,206 @@
341
341
  --zdt_headerlink_hover_text: var(--zdt_m_cta_primary_border_text);
342
342
 
343
343
  /* search */
344
- --zdt_search_input_border: hsl(0, 0%, calc(60% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
345
- --zdt_search_input_text: hsl(0, 0%, calc(20% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
346
- --zdt_search_input_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
344
+ --zdt_search_input_border: hsla(0, 0%, calc(60% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
345
+ --zdt_search_input_text: hsla(0, 0%, calc(20% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
346
+ --zdt_search_input_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
347
347
  --zdt_search_input_focus_border: var(--zdt_cta_primary_border);
348
- --zdt_search_icon: hsl(0, 0%, calc(60% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
349
- --zdt_search_hover_icon: hsl(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
350
- --zdt_search_placeholder_text: hsl(0, 0%, calc(79% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
348
+ --zdt_search_icon: hsla(0, 0%, calc(60% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
349
+ --zdt_search_hover_icon: hsla(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
350
+ --zdt_search_placeholder_text: hsla(0, 0%, calc(79% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
351
351
 
352
352
  /* views */
353
- --zdt_views_icon: hsl(0, 0%, calc(60% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
354
- --zdt_views_border: hsl(0, 0%, calc(88% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
355
- --zdt_views_hover_icon: hsl(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
353
+ --zdt_views_icon: hsla(0, 0%, calc(60% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
354
+ --zdt_views_border: hsla(0, 0%, calc(88% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
355
+ --zdt_views_hover_icon: hsla(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
356
356
  --zdt_views_active_icon: var(--zdt_cta_primary_text);
357
- --zdt_message_info_bg: hsl(187, 100%, calc(43% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
358
- --zdt_message_tickicon: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
359
- --zdt_message_close_text: hsl(0, 0%, calc(60% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
357
+ --zdt_message_info_bg: hsla(187, 100%, calc(43% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
358
+ --zdt_message_tickicon: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
359
+ --zdt_message_close_text: hsla(0, 0%, calc(60% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
360
360
 
361
361
  /* message banner */
362
- --zdt_messagebanner_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
362
+ --zdt_messagebanner_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
363
363
  --zdt_messagebanner_link_text: var(--zdt_cta_primary_text);
364
- --zdt_messagebanner_close_text: hsl(0, 0%, calc(67% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
365
- --zdt_messagebanner_close_hover_bg: hsl(60, 50%, calc(85% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
366
- --zdt_messagebanner_close_hover_text: hsl(0, 0%, calc(15% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
367
- --zdt_messagebanner_default_bg: hsl(62, 100%, calc(93% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
368
- --zdt_messagebanner_blue_bg: hsl(210, 91%, calc(96% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
369
- --zdt_messagebanner_white_text: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
364
+ --zdt_messagebanner_close_text: hsla(0, 0%, calc(67% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
365
+ --zdt_messagebanner_close_hover_bg: hsla(60, 50%, calc(85% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
366
+ --zdt_messagebanner_close_hover_text: hsla(0, 0%, calc(15% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
367
+ --zdt_messagebanner_default_bg: hsla(62, 100%, calc(93% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
368
+ --zdt_messagebanner_blue_bg: hsla(210, 91%, calc(96% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
369
+ --zdt_messagebanner_white_text: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
370
370
 
371
371
  /* new star */
372
- --zdt_newstar_green_text: hsl(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
373
- --zdt_newstar_yellow_text: hsl(50, 90%, calc(47% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
374
- --zdt_newstar_blue_text: hsl(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
372
+ --zdt_newstar_green_text: hsla(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
373
+ --zdt_newstar_yellow_text: hsla(50, 90%, calc(47% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
374
+ --zdt_newstar_blue_text: hsla(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
375
375
 
376
376
  /* help tips description */
377
- --zdt_helptips_text: hsl(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
377
+ --zdt_helptips_text: hsla(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
378
378
 
379
379
  /* help tips link */
380
380
  --zdt_helptipslink_text: var(--zdt_cta_primary_text);
381
381
 
382
382
  /* list group */
383
- --zdt_listgroup_text: hsl(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
383
+ --zdt_listgroup_text: hsla(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
384
384
 
385
385
  /* help tips title */
386
- --zdt_helptipstitle_text: hsl(0, 0%, calc(20% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
386
+ --zdt_helptipstitle_text: hsla(0, 0%, calc(20% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
387
387
 
388
388
  /* setup table head */
389
- --zdt_setuptablehead_border: hsl(200, 7%, calc(92% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
389
+ --zdt_setuptablehead_border: hsla(200, 7%, calc(92% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
390
390
 
391
391
  /* setup table row */
392
- --zdt_setuptablerow_border: hsl(0, 0%, calc(98% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
393
- --zdt_setuptablerow_hover_bg: hsl(0, 0%, calc(99% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
392
+ --zdt_setuptablerow_border: hsla(0, 0%, calc(98% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
393
+ --zdt_setuptablerow_hover_bg: hsla(0, 0%, calc(99% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
394
394
 
395
395
  /* table text */
396
396
  --zdt_tabletext_primary_text: var(--zdt_cta_primary_text);
397
- --zdt_tabletext_default_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
398
- --zdt_tabletext_green_text: hsl(107, 100%, calc(36% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
399
- --zdt_tabletext_danger_text: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
400
- --zdt_tabletext_heading_text: hsl(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
397
+ --zdt_tabletext_default_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
398
+ --zdt_tabletext_green_text: hsla(107, 100%, calc(36% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
399
+ --zdt_tabletext_danger_text: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
400
+ --zdt_tabletext_heading_text: hsla(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
401
401
 
402
402
  /* toast message */
403
403
  --zdt_toastmessage_default_box_shadow: rgb(232,232,232);
404
- --zdt_toastmessage_default_bg: hsl(0, 0%, calc(100% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
405
- --zdt_toastmessage_alert_border: hsl(0, 0%, calc(88% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
406
- --zdt_toastmessage_alert_text: hsl(216, 2%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
407
- --zdt_toastmessage_alerttitle_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
408
- --zdt_toastmessage_popbutton_text: hsl(0, 0%, calc(67% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
409
- --zdt_toastmessage_submit_border: hsl(0, 0%, calc(93% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
404
+ --zdt_toastmessage_default_bg: hsla(0, 0%, calc(100% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
405
+ --zdt_toastmessage_alert_border: hsla(0, 0%, calc(88% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
406
+ --zdt_toastmessage_alert_text: hsla(216, 2%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
407
+ --zdt_toastmessage_alerttitle_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
408
+ --zdt_toastmessage_popbutton_text: hsla(0, 0%, calc(67% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
409
+ --zdt_toastmessage_submit_border: hsla(0, 0%, calc(93% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
410
410
  --zdt_toastmessage_primary_text: var(--zdt_cta_primary_text);
411
411
  --zdt_toastmessage_primary_hover_bg: var(--zdt_m_cta_primary_bg_bg);
412
- --zdt_toastmessage_primary_hover_text: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
413
- --zdt_toastmessage_danger_text: hsl(0, 72%, calc(54% + var(--zd_default_textLighterDarker_lValue)), calc(1 + var(--zd_alpha)));
414
- --zdt_toastmessage_danger_hover_bg: hsl(0, 72%, calc(54% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
415
- --zdt_toastmessage_danger_text_shadow: hsl(359, 73%, calc(59% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
416
- --zdt_toastmessage_success_text: hsl(142, 55%, calc(46% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
417
- --zdt_toastmessage_success_hover_bg: hsl(142, 55%, calc(46% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
418
- --zdt_toastmessage_successfill_bg: hsl(141, 54%, calc(50% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
419
- --zdt_toastmessage_successplain_text: hsl(141, 54%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
420
- --zdt_toastmessage_cancel_hover_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
421
- --zdt_toastmessage_closeicon: hsl(0, 0%, calc(47% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
412
+ --zdt_toastmessage_primary_hover_text: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
413
+ --zdt_toastmessage_danger_text: hsla(0, 72%, calc(54% + var(--zd_default_textLighterDarker_lValue)), calc(1 + var(--zd_alpha)));
414
+ --zdt_toastmessage_danger_hover_bg: hsla(0, 72%, calc(54% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
415
+ --zdt_toastmessage_danger_text_shadow: hsla(359, 73%, calc(59% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
416
+ --zdt_toastmessage_success_text: hsla(142, 55%, calc(46% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
417
+ --zdt_toastmessage_success_hover_bg: hsla(142, 55%, calc(46% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
418
+ --zdt_toastmessage_successfill_bg: hsla(141, 54%, calc(50% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
419
+ --zdt_toastmessage_successplain_text: hsla(141, 54%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
420
+ --zdt_toastmessage_cancel_hover_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
421
+ --zdt_toastmessage_closeicon: hsla(0, 0%, calc(47% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
422
422
  --zdt_toastmessage_closeicon_hover_bg: var(--zdt_m_cta_primary_hover_bg_bg);
423
- --zdt_toastmessage_closeicon_hover_text: hsl(0, 0%, calc(13% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
424
- --zdt_toastmessage_dropdown_bg: hsl(0, 0%, calc(98% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
425
- --zdt_toastmessage_dropdown_text: hsl(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
426
- --zdt_toastmessage_message_border: hsl(0, 0%, calc(96% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
423
+ --zdt_toastmessage_closeicon_hover_text: hsla(0, 0%, calc(13% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
424
+ --zdt_toastmessage_dropdown_bg: hsla(0, 0%, calc(98% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
425
+ --zdt_toastmessage_dropdown_text: hsla(0, 0%, calc(40% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
426
+ --zdt_toastmessage_message_border: hsla(0, 0%, calc(96% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
427
427
 
428
428
  /* upload */
429
- --zdt_upload_default_bg: hsl(216, 38%, calc(97% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
430
- --zdt_upload_overlay_bg: hsl(0, 0%, calc(0% + var(--zd_default_bg_lValue)), calc( 0.2 + var(--zd_bg_alpha)));
431
- --zdt_upload_loader_default_bg: hsl(223, 9%, calc(30% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
432
- --zdt_upload_attachsize_default_text: hsl(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
433
- --zdt_upload_uploadclose_default_bg: hsl(218, 10%, calc(52% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
434
- --zdt_upload_uploadclose_default_text: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
435
- --zdt_upload_uploadclose_default_hover_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc( 0.7 + var(--zd_alpha)));
436
- --zdt_upload_night_bg: hsl(216, 38%, calc(97% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
437
- --zdt_upload_loader_night_bg: hsl(223, 9%, calc(30% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
438
- --zdt_upload_attachsize_night_text: hsl(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
439
- --zdt_upload_uploadclose_night_bg: hsl(218, 10%, calc(52% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
440
- --zdt_upload_uploadclose_night_text: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
441
- --zdt_upload_uploadclose_night_hover_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc( 0.7 + var(--zd_alpha)));
429
+ --zdt_upload_default_bg: hsla(216, 38%, calc(97% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
430
+ --zdt_upload_overlay_bg: hsla(0, 0%, calc(0% + var(--zd_default_bg_lValue)), calc( 0.2 + var(--zd_bg_alpha)));
431
+ --zdt_upload_loader_default_bg: hsla(223, 9%, calc(30% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
432
+ --zdt_upload_attachsize_default_text: hsla(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
433
+ --zdt_upload_uploadclose_default_bg: hsla(218, 10%, calc(52% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
434
+ --zdt_upload_uploadclose_default_text: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
435
+ --zdt_upload_uploadclose_default_hover_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc( 0.7 + var(--zd_alpha)));
436
+ --zdt_upload_night_bg: hsla(216, 38%, calc(97% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
437
+ --zdt_upload_loader_night_bg: hsla(223, 9%, calc(30% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
438
+ --zdt_upload_attachsize_night_text: hsla(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
439
+ --zdt_upload_uploadclose_night_bg: hsla(218, 10%, calc(52% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
440
+ --zdt_upload_uploadclose_night_text: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
441
+ --zdt_upload_uploadclose_night_hover_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc( 0.7 + var(--zd_alpha)));
442
442
 
443
443
  /* common alerts */
444
- --zdt_commonalert_default_border: hsl(0, 72%, calc(54% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
445
- --zdt_commonalert_success_border: hsl(133, 63%, calc(41% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
444
+ --zdt_commonalert_default_border: hsla(0, 72%, calc(54% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
445
+ --zdt_commonalert_success_border: hsla(133, 63%, calc(41% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
446
446
  --zdt_commonalert_info_border: var(--zdt_cta_primary_border);
447
- --zdt_commonalert_danger_border: hsl(0, 72%, calc(54% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
448
- --zdt_commonalert_error_border: hsl(0, 72%, calc(54% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
449
- --zdt_commonalert_warning_border: hsl(26, 100%, calc(50% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
450
- --zdt_commonalert_close_icon: hsl(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
451
- --zdt_commonalert_close_light_icon: hsl(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
452
- --zdt_commonalert_close_hover_bg: hsl(0, 74%, calc(95% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
453
- --zdt_commonalert_success_hover_bg: hsl(146, 47%, calc(94% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
447
+ --zdt_commonalert_danger_border: hsla(0, 72%, calc(54% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
448
+ --zdt_commonalert_error_border: hsla(0, 72%, calc(54% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
449
+ --zdt_commonalert_warning_border: hsla(26, 100%, calc(50% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
450
+ --zdt_commonalert_close_icon: hsla(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
451
+ --zdt_commonalert_close_light_icon: hsla(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
452
+ --zdt_commonalert_close_hover_bg: hsla(0, 74%, calc(95% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
453
+ --zdt_commonalert_success_hover_bg: hsla(146, 47%, calc(94% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
454
454
  --zdt_commonalert_info_hover_bg: var(--zdt_cta_primary_light_bg);
455
- --zdt_commonalert_plaininfo_hover_bg: hsl(212, 81%, calc(96% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
456
- --zdt_commonalert_danger_hover_bg: hsl(0, 74%, calc(95% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
457
- --zdt_commonalert_error_hover_bg: hsl(0, 74%, calc(95% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
458
- --zdt_commonalert_warning_hover_bg: hsl(26, 100%, calc(95% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
455
+ --zdt_commonalert_plaininfo_hover_bg: hsla(212, 81%, calc(96% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
456
+ --zdt_commonalert_danger_hover_bg: hsla(0, 74%, calc(95% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
457
+ --zdt_commonalert_error_hover_bg: hsla(0, 74%, calc(95% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
458
+ --zdt_commonalert_warning_hover_bg: hsla(26, 100%, calc(95% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
459
459
  --zdt_commonalert_light_hover_bg: var(--zdt_cta_grey_10_bg);
460
- --zdt_commonalert_secondlayer_bg: hsl(216, 38%, calc(97% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_alpha)));
461
- --zdt_commonalert_default_icon: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
462
- --zdt_commonalert_success_icon: hsl(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
463
- --zdt_commonalert_info_icon: var(--zdt_m_cta_primary_border_text);
464
- --zdt_commonalert_danger_icon: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
465
- --zdt_commonalert_error_icon: hsl(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
466
- --zdt_commonalert_warning_icon: hsl(26, 100%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
460
+ --zdt_commonalert_secondlayer_bg: hsla(216, 38%, calc(97% + var(--zd_default_bgDarkerLighter_lValue)), calc(1 + var(--zd_bg_alpha)));
461
+ --zdt_commonalert_default_icon: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
462
+ --zdt_commonalert_success_icon: hsla(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
463
+ --zdt_commonalert_info_icon: var(--zdt_cta_primary_border);
464
+ --zdt_commonalert_danger_icon: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
465
+ --zdt_commonalert_error_icon: hsla(0, 72%, calc(54% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
466
+ --zdt_commonalert_warning_icon: hsla(26, 100%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
467
467
 
468
468
  /* alert icons */
469
- --zdt_alerticons_green_fill: hsl(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
470
- --zdt_alerticons_primary_fill: hsl(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
471
- --zdt_alerticons_orange_fill: hsl(26, 100%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
469
+ --zdt_alerticons_green_fill: hsla(133, 63%, calc(41% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
470
+ --zdt_alerticons_primary_fill: hsla(212, 92%, calc(48% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
471
+ --zdt_alerticons_orange_fill: hsla(26, 100%, calc(50% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
472
472
 
473
473
  /* global notification */
474
- --zdt_globalnotification_default_bg: hsl(0, 71%, calc(97% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
475
- --zdt_globalnotification_default_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
476
- --zdt_globalnotification_success_bg: hsl(143, 44%, calc(96% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
477
- --zdt_globalnotification_success_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
478
- --zdt_globalnotification_info_bg: var(--zdt_m_cta_primary_light_bg_bgDarkerBoth);
479
- --zdt_globalnotification_info_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
480
- --zdt_globalnotification_danger_bg: hsl(0, 71%, calc(97% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
481
- --zdt_globalnotification_danger_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
482
- --zdt_globalnotification_error_bg: hsl(0, 71%, calc(97% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
483
- --zdt_globalnotification_error_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
484
- --zdt_globalnotification_warning_bg: hsl(24, 100%, calc(97% + var(--zd_default_bgDarkerBoth_lValue)), calc(1 + var(--zd_bg_alpha)));
485
- --zdt_globalnotification_warning_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
474
+ --zdt_globalnotification_default_bg: hsla(0, 71%, calc(97% + var(--zd_default_bgDarkerBothMild_lValue)), calc(1 + var(--zd_bg_alpha)));
475
+ --zdt_globalnotification_default_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
476
+ --zdt_globalnotification_success_bg: hsla(143, 44%, calc(96% + var(--zd_default_bgDarkerBothMild_lValue)), calc(1 + var(--zd_bg_alpha)));
477
+ --zdt_globalnotification_success_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
478
+ --zdt_globalnotification_info_bg: var(--zdt_m_cta_primary_light_bg_bgDarkerBothMild);
479
+ --zdt_globalnotification_info_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
480
+ --zdt_globalnotification_danger_bg: hsla(0, 71%, calc(97% + var(--zd_default_bgDarkerBothMild_lValue)), calc(1 + var(--zd_bg_alpha)));
481
+ --zdt_globalnotification_danger_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
482
+ --zdt_globalnotification_error_bg: hsla(0, 71%, calc(97% + var(--zd_default_bgDarkerBothMild_lValue)), calc(1 + var(--zd_bg_alpha)));
483
+ --zdt_globalnotification_error_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
484
+ --zdt_globalnotification_warning_bg: hsla(24, 100%, calc(97% + var(--zd_default_bgDarkerBothMild_lValue)), calc(1 + var(--zd_bg_alpha)));
485
+ --zdt_globalnotification_warning_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
486
486
  --zdt_globalnotification_default_box_shadow: rgba(55, 84, 170, 0.25);
487
487
 
488
488
  /* alert lookup */
489
- --zdt_alertlookup_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
489
+ --zdt_alertlookup_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
490
490
  --zdt_alertlookup_border: var(--zdt_cta_grey_15_border);
491
- --zdt_alertlookuop_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
491
+ --zdt_alertlookuop_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
492
492
 
493
493
  /* alert lookup new */
494
- --zdt_alertlookupnew_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
494
+ --zdt_alertlookupnew_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
495
495
 
496
496
  /* tagsmultiselect */
497
- --zdt_tagsmultiselect_labelt_text: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
497
+ --zdt_tagsmultiselect_labelt_text: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
498
498
  --zdt_tagsmultiselect_default_border: var(--dot_inputLine);
499
499
  --zdt_tagsmultiselect_transparent_border: var(--dot_mirror);
500
- --zdt_tagsmultiselect_dark_border: hsl(228, 16%, calc(35% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
500
+ --zdt_tagsmultiselect_dark_border: hsla(228, 16%, calc(35% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
501
501
  --zdt_tagsmultiselect_default_hover_border: var(--dot_inputLineHover);
502
502
  --zdt_tagsmultiselect_transparent_hover_border: var(--dot_inputLineHover);
503
- --zdt_tagsmultiselect_dark_hover_border: hsl(229, 8%, calc(62% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
503
+ --zdt_tagsmultiselect_dark_hover_border: hsla(229, 8%, calc(62% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
504
504
  --zdt_tagsmultiselect_default_active_border: var(--dot_inputLineFocus);
505
505
  --zdt_tagsmultiselect_transparent_active_border: var(--dot_inputLineFocus);
506
- --zdt_tagsmultiselect_dark_active_border: hsl(229, 8%, calc(62% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
506
+ --zdt_tagsmultiselect_dark_active_border: hsla(229, 8%, calc(62% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
507
507
  --zdt_tagsmultiselect_more_text: var(--zdt_cta_primary_text);
508
508
  --zdt_tagsmultiselect_more_hover_text: var(--zdt_cta_primary_hover_text);
509
509
 
510
510
  /* text editor */
511
- --zdt_texteditor_menu_bg: hsl(216, 38%, calc(97% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
511
+ --zdt_texteditor_menu_bg: hsla(216, 38%, calc(97% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
512
512
  --zdt_texteditor_default_bg: rgb(255,255,255);
513
- --zdt_texteditor_default_border: hsl(213, 27%, calc(87% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
514
- --zdt_texteditor_menu_li_bg: hsl(217, 37%, calc(93% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
515
- --zdt_texteditor_default_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
516
- --zdt_texteditor_more_icon_fill: hsl(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
513
+ --zdt_texteditor_default_border: hsla(213, 27%, calc(87% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
514
+ --zdt_texteditor_menu_li_bg: hsla(217, 37%, calc(93% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
515
+ --zdt_texteditor_default_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
516
+ --zdt_texteditor_more_icon_fill: hsla(218, 10%, calc(52% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
517
517
  --zdt_texteditor_menu_after_box_shadow: rgba(0, 0, 0, 0.08);
518
- --zdt_texteditor_menu_after_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
519
- --zdt_texteditor_input_placeholder_text: hsl(0, 0%, calc(81% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
518
+ --zdt_texteditor_menu_after_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
519
+ --zdt_texteditor_input_placeholder_text: hsla(0, 0%, calc(81% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
520
520
  --zdt_texteditor_dropdown_box_shadow: rgba(0, 0, 0, 0.2);
521
- --zdt_texteditor_night_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
522
- --zdt_texteditor_night_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
521
+ --zdt_texteditor_night_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
522
+ --zdt_texteditor_night_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
523
523
 
524
524
  /* desktop notification */
525
- --zdt_desktopnotification_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
526
- --zdt_desktopnotification_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
525
+ --zdt_desktopnotification_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
526
+ --zdt_desktopnotification_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
527
527
  --zdt_desktopnotification_box_shadow: rgba(55, 84, 170, 0.25);
528
528
 
529
529
  /* tagsmultiselect field */
530
- --zdt_tagsmultiselectField_count_text: hsl(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
530
+ --zdt_tagsmultiselectField_count_text: hsla(220, 10%, calc(39% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
531
531
 
532
532
  /* attachment viewer */
533
- --zdt_attachmentviewer_title_text: hsl(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
533
+ --zdt_attachmentviewer_title_text: hsla(0, 0%, calc(100% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
534
534
  --zdt_attachmentviewer_button_border: var(--zdt_cta_grey_35_border);
535
535
  --zdt_attachmentviewer_hover_border: var(--zdt_m_cta_grey_40_border_border);
536
536
  --zdt_attachmentviewer_selected_border: var(--zdt_cta_primary_border);
537
- --zdt_attachmentviewer_selected_after_bg: hsl(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
537
+ --zdt_attachmentviewer_selected_after_bg: hsla(0, 0%, calc(100% + var(--zd_default_bg_lValue)), calc(1 + var(--zd_bg_alpha)));
538
538
  --zdt_attachmentviewer_selected_box_shadow: rgba(0, 0, 0, 0.34);
539
- --zdt_attachmentviewer_loader_border: hsl(223, 14%, calc(19% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
540
- --zdt_attachmentviewer_loader_border_top: hsl(0, 0%, calc(95% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
539
+ --zdt_attachmentviewer_loader_border: hsla(223, 14%, calc(19% + var(--zd_default_border_lValue)), calc(1 + var(--zd_alpha)));
540
+ --zdt_attachmentviewer_loader_border_top: hsla(0, 0%, calc(95% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
541
541
 
542
542
  /* separator */
543
- --zdt_separator_default_text: hsl(0, 0%, calc(79% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
543
+ --zdt_separator_default_text: hsla(0, 0%, calc(79% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
544
544
  --zdt_separator_primary_text: var(--zdt_cta_primary_text);
545
- --zdt_separator_secondary_text: hsl(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
545
+ --zdt_separator_secondary_text: hsla(0, 0%, calc(0% + var(--zd_default_text_lValue)), calc(1 + var(--zd_alpha)));
546
546
  }