@navikt/ds-css 7.9.1 → 7.10.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 (244) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/button.css +1 -1
  3. package/darkside/accordion.darkside.css +9 -10
  4. package/darkside/action-menu.darkside.css +13 -13
  5. package/darkside/alert.darkside.css +8 -8
  6. package/darkside/button.darkside.css +27 -27
  7. package/darkside/chat.darkside.css +8 -8
  8. package/darkside/chips.darkside.css +20 -20
  9. package/darkside/copybutton.darkside.css +13 -42
  10. package/darkside/date.darkside.css +17 -17
  11. package/darkside/expansioncard.darkside.css +10 -10
  12. package/darkside/form/combobox.darkside.css +38 -30
  13. package/darkside/form/error-summary.darkside.css +10 -10
  14. package/darkside/form/fieldset.darkside.css +1 -1
  15. package/darkside/form/file-upload.darkside.css +14 -14
  16. package/darkside/form/form-progress.darkside.css +3 -3
  17. package/darkside/form/form-summary.darkside.css +17 -17
  18. package/darkside/form/form.darkside.css +3 -3
  19. package/darkside/form/radio-checkbox.darkside.css +10 -11
  20. package/darkside/form/search.darkside.css +12 -12
  21. package/darkside/form/select.darkside.css +7 -7
  22. package/darkside/form/switch.darkside.css +12 -12
  23. package/darkside/form/text-field.darkside.css +7 -7
  24. package/darkside/form/textarea.darkside.css +6 -6
  25. package/darkside/guide-panel.darkside.css +8 -8
  26. package/darkside/help-text.darkside.css +2 -2
  27. package/darkside/internalheader.darkside.css +9 -9
  28. package/darkside/link.darkside.css +1 -1
  29. package/darkside/list.darkside.css +5 -5
  30. package/darkside/loader.darkside.css +1 -1
  31. package/darkside/modal.darkside.css +10 -10
  32. package/darkside/pagination.darkside.css +3 -3
  33. package/darkside/popover.darkside.css +2 -2
  34. package/darkside/primitives/page.darkside.css +1 -1
  35. package/darkside/progress-bar.darkside.css +2 -2
  36. package/darkside/read-more.darkside.css +15 -15
  37. package/darkside/skeleton.darkside.css +1 -1
  38. package/darkside/stepper.darkside.css +11 -11
  39. package/darkside/table.darkside.css +36 -22
  40. package/darkside/tabs.darkside.css +11 -11
  41. package/darkside/tag.darkside.css +21 -21
  42. package/darkside/timeline.darkside.css +19 -19
  43. package/darkside/toggle-group.darkside.css +7 -7
  44. package/darkside/tooltip.darkside.css +5 -5
  45. package/darkside/typography.darkside.css +19 -19
  46. package/dist/component/button.css +1 -1
  47. package/dist/component/button.min.css +1 -1
  48. package/dist/component/table.css +22 -8
  49. package/dist/component/table.min.css +1 -1
  50. package/dist/component/tag.css +6 -6
  51. package/dist/component/tag.min.css +1 -1
  52. package/dist/components.css +29 -15
  53. package/dist/components.min.css +2 -2
  54. package/dist/darkside/component/accordion.css +9 -10
  55. package/dist/darkside/component/accordion.min.css +1 -1
  56. package/dist/darkside/component/actionmenu.css +13 -13
  57. package/dist/darkside/component/actionmenu.min.css +1 -1
  58. package/dist/darkside/component/alert.css +6 -6
  59. package/dist/darkside/component/alert.min.css +1 -1
  60. package/dist/darkside/component/button.css +26 -27
  61. package/dist/darkside/component/button.min.css +1 -1
  62. package/dist/darkside/component/chat.css +8 -8
  63. package/dist/darkside/component/chat.min.css +1 -1
  64. package/dist/darkside/component/chips.css +20 -20
  65. package/dist/darkside/component/chips.min.css +1 -1
  66. package/dist/darkside/component/copybutton.css +13 -41
  67. package/dist/darkside/component/copybutton.min.css +1 -1
  68. package/dist/darkside/component/date.css +17 -17
  69. package/dist/darkside/component/date.min.css +1 -1
  70. package/dist/darkside/component/expansioncard.css +10 -10
  71. package/dist/darkside/component/expansioncard.min.css +1 -1
  72. package/dist/darkside/component/form.css +138 -136
  73. package/dist/darkside/component/form.min.css +1 -1
  74. package/dist/darkside/component/guidepanel.css +8 -8
  75. package/dist/darkside/component/guidepanel.min.css +1 -1
  76. package/dist/darkside/component/helptext.css +2 -2
  77. package/dist/darkside/component/helptext.min.css +1 -1
  78. package/dist/darkside/component/internalheader.css +9 -9
  79. package/dist/darkside/component/internalheader.min.css +1 -1
  80. package/dist/darkside/component/link.css +1 -1
  81. package/dist/darkside/component/link.min.css +1 -1
  82. package/dist/darkside/component/list.css +5 -5
  83. package/dist/darkside/component/list.min.css +1 -1
  84. package/dist/darkside/component/loader.css +1 -1
  85. package/dist/darkside/component/loader.min.css +1 -1
  86. package/dist/darkside/component/modal.css +8 -8
  87. package/dist/darkside/component/modal.min.css +1 -1
  88. package/dist/darkside/component/pagination.css +3 -3
  89. package/dist/darkside/component/pagination.min.css +1 -1
  90. package/dist/darkside/component/popover.css +2 -2
  91. package/dist/darkside/component/popover.min.css +1 -1
  92. package/dist/darkside/component/primitives.css +1 -1
  93. package/dist/darkside/component/primitives.min.css +1 -1
  94. package/dist/darkside/component/progressbar.css +2 -2
  95. package/dist/darkside/component/progressbar.min.css +1 -1
  96. package/dist/darkside/component/readmore.css +15 -15
  97. package/dist/darkside/component/readmore.min.css +1 -1
  98. package/dist/darkside/component/skeleton.css +1 -1
  99. package/dist/darkside/component/skeleton.min.css +1 -1
  100. package/dist/darkside/component/stepper.css +11 -11
  101. package/dist/darkside/component/stepper.min.css +1 -1
  102. package/dist/darkside/component/table.css +35 -22
  103. package/dist/darkside/component/table.min.css +1 -1
  104. package/dist/darkside/component/tabs.css +11 -11
  105. package/dist/darkside/component/tabs.min.css +1 -1
  106. package/dist/darkside/component/tag.css +21 -21
  107. package/dist/darkside/component/tag.min.css +1 -1
  108. package/dist/darkside/component/timeline.css +19 -19
  109. package/dist/darkside/component/timeline.min.css +1 -1
  110. package/dist/darkside/component/togglegroup.css +7 -7
  111. package/dist/darkside/component/togglegroup.min.css +1 -1
  112. package/dist/darkside/component/tooltip.css +5 -5
  113. package/dist/darkside/component/tooltip.min.css +1 -1
  114. package/dist/darkside/component/typography.css +19 -19
  115. package/dist/darkside/component/typography.min.css +1 -1
  116. package/dist/darkside/components.css +446 -461
  117. package/dist/darkside/components.min.css +1 -1
  118. package/dist/darkside/global/tokens.css +442 -499
  119. package/dist/darkside/global/tokens.min.css +1 -1
  120. package/dist/darkside/index.css +888 -960
  121. package/dist/darkside/index.min.css +1 -1
  122. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/accordion.css +9 -10
  123. package/dist/darkside/version/7.10.0/component/accordion.min.css +1 -0
  124. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/actionmenu.css +13 -13
  125. package/dist/darkside/version/7.10.0/component/actionmenu.min.css +1 -0
  126. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/alert.css +6 -6
  127. package/dist/darkside/version/7.10.0/component/alert.min.css +1 -0
  128. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/button.css +26 -27
  129. package/dist/darkside/version/7.10.0/component/button.min.css +1 -0
  130. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/chat.css +8 -8
  131. package/dist/darkside/version/7.10.0/component/chat.min.css +1 -0
  132. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/chips.css +20 -20
  133. package/dist/darkside/version/7.10.0/component/chips.min.css +1 -0
  134. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/copybutton.css +13 -41
  135. package/dist/darkside/version/7.10.0/component/copybutton.min.css +1 -0
  136. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/date.css +17 -17
  137. package/dist/darkside/version/7.10.0/component/date.min.css +1 -0
  138. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/expansioncard.css +10 -10
  139. package/dist/darkside/version/7.10.0/component/expansioncard.min.css +1 -0
  140. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/form.css +138 -136
  141. package/dist/darkside/version/7.10.0/component/form.min.css +1 -0
  142. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/guidepanel.css +8 -8
  143. package/dist/darkside/version/7.10.0/component/guidepanel.min.css +1 -0
  144. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/helptext.css +2 -2
  145. package/dist/darkside/version/7.10.0/component/helptext.min.css +1 -0
  146. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/internalheader.css +9 -9
  147. package/dist/darkside/version/7.10.0/component/internalheader.min.css +1 -0
  148. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/link.css +1 -1
  149. package/dist/darkside/version/7.10.0/component/link.min.css +1 -0
  150. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/list.css +5 -5
  151. package/dist/darkside/version/7.10.0/component/list.min.css +1 -0
  152. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/loader.css +1 -1
  153. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/loader.min.css +1 -1
  154. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/modal.css +8 -8
  155. package/dist/darkside/version/7.10.0/component/modal.min.css +1 -0
  156. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/pagination.css +3 -3
  157. package/dist/darkside/version/7.10.0/component/pagination.min.css +1 -0
  158. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/popover.css +2 -2
  159. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/popover.min.css +1 -1
  160. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/primitives.css +1 -1
  161. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/primitives.min.css +1 -1
  162. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/progressbar.css +2 -2
  163. package/dist/darkside/version/7.10.0/component/progressbar.min.css +1 -0
  164. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/readmore.css +15 -15
  165. package/dist/darkside/version/7.10.0/component/readmore.min.css +1 -0
  166. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/skeleton.css +1 -1
  167. package/dist/darkside/version/7.10.0/component/skeleton.min.css +1 -0
  168. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/stepper.css +11 -11
  169. package/dist/darkside/version/7.10.0/component/stepper.min.css +1 -0
  170. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/table.css +35 -22
  171. package/dist/darkside/version/7.10.0/component/table.min.css +1 -0
  172. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/tabs.css +11 -11
  173. package/dist/darkside/version/7.10.0/component/tabs.min.css +1 -0
  174. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/tag.css +21 -21
  175. package/dist/darkside/version/7.10.0/component/tag.min.css +1 -0
  176. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/timeline.css +19 -19
  177. package/dist/darkside/version/7.10.0/component/timeline.min.css +1 -0
  178. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/togglegroup.css +7 -7
  179. package/dist/darkside/version/7.10.0/component/togglegroup.min.css +1 -0
  180. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/tooltip.css +5 -5
  181. package/dist/darkside/version/7.10.0/component/tooltip.min.css +1 -0
  182. package/dist/darkside/version/{7.9.1 → 7.10.0}/component/typography.css +19 -19
  183. package/dist/darkside/version/7.10.0/component/typography.min.css +1 -0
  184. package/dist/darkside/version/{7.9.1 → 7.10.0}/components.css +446 -461
  185. package/dist/darkside/version/7.10.0/components.min.css +1 -0
  186. package/dist/darkside/version/7.10.0/global/tokens.css +839 -0
  187. package/dist/darkside/version/7.10.0/global/tokens.min.css +1 -0
  188. package/dist/darkside/version/{7.9.1 → 7.10.0}/index.css +888 -960
  189. package/dist/darkside/version/7.10.0/index.min.css +1 -0
  190. package/dist/global/tokens.css +23 -1
  191. package/dist/global/tokens.min.css +1 -1
  192. package/dist/index.css +52 -16
  193. package/dist/index.min.css +3 -3
  194. package/package.json +3 -3
  195. package/table.css +22 -8
  196. package/tag.css +6 -6
  197. package/dist/darkside/version/7.9.1/component/accordion.min.css +0 -1
  198. package/dist/darkside/version/7.9.1/component/actionmenu.min.css +0 -1
  199. package/dist/darkside/version/7.9.1/component/alert.min.css +0 -1
  200. package/dist/darkside/version/7.9.1/component/button.min.css +0 -1
  201. package/dist/darkside/version/7.9.1/component/chat.min.css +0 -1
  202. package/dist/darkside/version/7.9.1/component/chips.min.css +0 -1
  203. package/dist/darkside/version/7.9.1/component/copybutton.min.css +0 -1
  204. package/dist/darkside/version/7.9.1/component/date.min.css +0 -1
  205. package/dist/darkside/version/7.9.1/component/expansioncard.min.css +0 -1
  206. package/dist/darkside/version/7.9.1/component/form.min.css +0 -1
  207. package/dist/darkside/version/7.9.1/component/guidepanel.min.css +0 -1
  208. package/dist/darkside/version/7.9.1/component/helptext.min.css +0 -1
  209. package/dist/darkside/version/7.9.1/component/internalheader.min.css +0 -1
  210. package/dist/darkside/version/7.9.1/component/link.min.css +0 -1
  211. package/dist/darkside/version/7.9.1/component/list.min.css +0 -1
  212. package/dist/darkside/version/7.9.1/component/modal.min.css +0 -1
  213. package/dist/darkside/version/7.9.1/component/pagination.min.css +0 -1
  214. package/dist/darkside/version/7.9.1/component/progressbar.min.css +0 -1
  215. package/dist/darkside/version/7.9.1/component/readmore.min.css +0 -1
  216. package/dist/darkside/version/7.9.1/component/skeleton.min.css +0 -1
  217. package/dist/darkside/version/7.9.1/component/stepper.min.css +0 -1
  218. package/dist/darkside/version/7.9.1/component/table.min.css +0 -1
  219. package/dist/darkside/version/7.9.1/component/tabs.min.css +0 -1
  220. package/dist/darkside/version/7.9.1/component/tag.min.css +0 -1
  221. package/dist/darkside/version/7.9.1/component/timeline.min.css +0 -1
  222. package/dist/darkside/version/7.9.1/component/togglegroup.min.css +0 -1
  223. package/dist/darkside/version/7.9.1/component/tooltip.min.css +0 -1
  224. package/dist/darkside/version/7.9.1/component/typography.min.css +0 -1
  225. package/dist/darkside/version/7.9.1/components.min.css +0 -1
  226. package/dist/darkside/version/7.9.1/global/tokens.css +0 -896
  227. package/dist/darkside/version/7.9.1/global/tokens.min.css +0 -1
  228. package/dist/darkside/version/7.9.1/index.min.css +0 -1
  229. /package/dist/darkside/version/{7.9.1 → 7.10.0}/component/dropdown.css +0 -0
  230. /package/dist/darkside/version/{7.9.1 → 7.10.0}/component/dropdown.min.css +0 -0
  231. /package/dist/darkside/version/{7.9.1 → 7.10.0}/component/linkpanel.css +0 -0
  232. /package/dist/darkside/version/{7.9.1 → 7.10.0}/component/linkpanel.min.css +0 -0
  233. /package/dist/darkside/version/{7.9.1 → 7.10.0}/component/panel.css +0 -0
  234. /package/dist/darkside/version/{7.9.1 → 7.10.0}/component/panel.min.css +0 -0
  235. /package/dist/darkside/version/{7.9.1 → 7.10.0}/component/theme.css +0 -0
  236. /package/dist/darkside/version/{7.9.1 → 7.10.0}/component/theme.min.css +0 -0
  237. /package/dist/darkside/version/{7.9.1 → 7.10.0}/global/baseline.css +0 -0
  238. /package/dist/darkside/version/{7.9.1 → 7.10.0}/global/baseline.min.css +0 -0
  239. /package/dist/darkside/version/{7.9.1 → 7.10.0}/global/fonts.css +0 -0
  240. /package/dist/darkside/version/{7.9.1 → 7.10.0}/global/fonts.min.css +0 -0
  241. /package/dist/darkside/version/{7.9.1 → 7.10.0}/global/print.css +0 -0
  242. /package/dist/darkside/version/{7.9.1 → 7.10.0}/global/print.min.css +0 -0
  243. /package/dist/darkside/version/{7.9.1 → 7.10.0}/global/reset.css +0 -0
  244. /package/dist/darkside/version/{7.9.1 → 7.10.0}/global/reset.min.css +0 -0
@@ -94,76 +94,76 @@
94
94
 
95
95
  @layer aksel.theming {
96
96
  :root, :host, .light, .light-theme {
97
- --ax-meta-lime-400A: #d0dc00;
98
- --ax-meta-lime-300A: rgba(202, 223, 0, .58);
99
- --ax-meta-lime-200A: rgba(196, 223, 0, .337);
100
- --ax-meta-lime-100A: rgba(195, 222, 0, .18);
101
- --ax-meta-lime-1000: #2a2800;
102
- --ax-meta-lime-900: #515400;
103
- --ax-meta-lime-800: #5c6100;
104
- --ax-meta-lime-700: #646900;
105
- --ax-meta-lime-600: #757c00;
106
- --ax-meta-lime-500: #878f00;
107
- --ax-meta-lime-400: #d0dc00;
108
- --ax-meta-lime-300: #e0ec6b;
109
- --ax-meta-lime-200: #ebf4a9;
110
- --ax-meta-lime-100: #f4f9d1;
111
- --ax-meta-purple-400A: rgba(43, 0, 107, .19);
112
- --ax-meta-purple-300A: rgba(43, 0, 102, .118);
113
- --ax-meta-purple-200A: rgba(43, 0, 100, .07);
114
- --ax-meta-purple-100A: rgba(51, 0, 102, .04);
115
- --ax-meta-purple-1000: #331a4d;
116
- --ax-meta-purple-900: #5e467c;
117
- --ax-meta-purple-800: #6a5289;
118
- --ax-meta-purple-700: #725a91;
119
- --ax-meta-purple-600: #846ca4;
120
- --ax-meta-purple-500: #9580b1;
121
- --ax-meta-purple-400: #d7cfe3;
122
- --ax-meta-purple-300: #e6e1ed;
123
- --ax-meta-purple-200: #f0edf4;
124
- --ax-meta-purple-100: #f7f5f9;
125
- --ax-brand-blue-400A: rgba(0, 90, 146, .247);
126
- --ax-brand-blue-300A: rgba(0, 96, 160, .157);
127
- --ax-brand-blue-200A: rgba(0, 110, 183, .11);
128
- --ax-brand-blue-100A: rgba(0, 120, 210, .067);
129
- --ax-brand-blue-1000: #002942;
130
- --ax-brand-blue-900: #00557d;
131
- --ax-brand-blue-800: #156389;
132
- --ax-brand-blue-700: #246b91;
133
- --ax-brand-blue-600: #417da0;
134
- --ax-brand-blue-500: #5a8fae;
135
- --ax-brand-blue-400: #c0d6e4;
136
- --ax-brand-blue-300: #d7e6f0;
137
- --ax-brand-blue-200: #e3eff7;
138
- --ax-brand-blue-100: #eef6fc;
139
- --ax-brand-beige-400A: rgba(233, 76, 0, .306);
140
- --ax-brand-beige-300A: rgba(240, 82, 0, .196);
141
- --ax-brand-beige-200A: rgba(239, 91, 0, .12);
142
- --ax-brand-beige-100A: rgba(255, 90, 0, .067);
143
- --ax-brand-beige-1000: #3c1f15;
144
- --ax-brand-beige-900: #764332;
145
- --ax-brand-beige-800: #874e3b;
146
- --ax-brand-beige-700: #915541;
147
- --ax-brand-beige-600: #a9654e;
148
- --ax-brand-beige-500: #c0765d;
149
- --ax-brand-beige-400: #f8c8b1;
150
- --ax-brand-beige-300: #fcddcd;
151
- --ax-brand-beige-200: #fdebe0;
152
- --ax-brand-beige-100: #fff4ee;
153
- --ax-brand-magenta-400A: rgba(164, 0, 58, .208);
154
- --ax-brand-magenta-300A: rgba(165, 0, 60, .133);
155
- --ax-brand-magenta-200A: rgba(170, 0, 61, .082);
156
- --ax-brand-magenta-100A: rgba(170, 0, 64, .047);
157
- --ax-brand-magenta-1000: #52002b;
158
- --ax-brand-magenta-900: #98185d;
159
- --ax-brand-magenta-800: #a33069;
160
- --ax-brand-magenta-700: #a93d70;
161
- --ax-brand-magenta-600: #b65781;
162
- --ax-brand-magenta-500: #c26f92;
163
- --ax-brand-magenta-400: #eccad6;
164
- --ax-brand-magenta-300: #f3dde5;
165
- --ax-brand-magenta-200: #f8eaef;
166
- --ax-brand-magenta-100: #fbf3f6;
97
+ --ax-meta-2-400A: #d0dc00;
98
+ --ax-meta-2-300A: rgba(202, 223, 0, .58);
99
+ --ax-meta-2-200A: rgba(196, 223, 0, .337);
100
+ --ax-meta-2-100A: rgba(195, 222, 0, .18);
101
+ --ax-meta-2-1000: #2a2800;
102
+ --ax-meta-2-900: #515400;
103
+ --ax-meta-2-800: #5c6100;
104
+ --ax-meta-2-700: #646900;
105
+ --ax-meta-2-600: #757c00;
106
+ --ax-meta-2-500: #878f00;
107
+ --ax-meta-2-400: #d0dc00;
108
+ --ax-meta-2-300: #e0ec6b;
109
+ --ax-meta-2-200: #ebf4a9;
110
+ --ax-meta-2-100: #f4f9d1;
111
+ --ax-meta-1-400A: rgba(43, 0, 107, .19);
112
+ --ax-meta-1-300A: rgba(43, 0, 102, .118);
113
+ --ax-meta-1-200A: rgba(43, 0, 100, .07);
114
+ --ax-meta-1-100A: rgba(51, 0, 102, .04);
115
+ --ax-meta-1-1000: #331a4d;
116
+ --ax-meta-1-900: #5e467c;
117
+ --ax-meta-1-800: #6a5289;
118
+ --ax-meta-1-700: #725a91;
119
+ --ax-meta-1-600: #846ca4;
120
+ --ax-meta-1-500: #9580b1;
121
+ --ax-meta-1-400: #d7cfe3;
122
+ --ax-meta-1-300: #e6e1ed;
123
+ --ax-meta-1-200: #f0edf4;
124
+ --ax-meta-1-100: #f7f5f9;
125
+ --ax-brand-3-400A: rgba(0, 90, 146, .247);
126
+ --ax-brand-3-300A: rgba(0, 96, 160, .157);
127
+ --ax-brand-3-200A: rgba(0, 110, 183, .11);
128
+ --ax-brand-3-100A: rgba(0, 120, 210, .067);
129
+ --ax-brand-3-1000: #002942;
130
+ --ax-brand-3-900: #00557d;
131
+ --ax-brand-3-800: #156389;
132
+ --ax-brand-3-700: #246b91;
133
+ --ax-brand-3-600: #417da0;
134
+ --ax-brand-3-500: #5a8fae;
135
+ --ax-brand-3-400: #c0d6e4;
136
+ --ax-brand-3-300: #d7e6f0;
137
+ --ax-brand-3-200: #e3eff7;
138
+ --ax-brand-3-100: #eef6fc;
139
+ --ax-brand-2-400A: rgba(233, 76, 0, .306);
140
+ --ax-brand-2-300A: rgba(240, 82, 0, .196);
141
+ --ax-brand-2-200A: rgba(239, 91, 0, .12);
142
+ --ax-brand-2-100A: rgba(255, 90, 0, .067);
143
+ --ax-brand-2-1000: #3c1f15;
144
+ --ax-brand-2-900: #764332;
145
+ --ax-brand-2-800: #874e3b;
146
+ --ax-brand-2-700: #915541;
147
+ --ax-brand-2-600: #a9654e;
148
+ --ax-brand-2-500: #c0765d;
149
+ --ax-brand-2-400: #f8c8b1;
150
+ --ax-brand-2-300: #fcddcd;
151
+ --ax-brand-2-200: #fdebe0;
152
+ --ax-brand-2-100: #fff4ee;
153
+ --ax-brand-1-400A: rgba(164, 0, 58, .208);
154
+ --ax-brand-1-300A: rgba(165, 0, 60, .133);
155
+ --ax-brand-1-200A: rgba(170, 0, 61, .082);
156
+ --ax-brand-1-100A: rgba(170, 0, 64, .047);
157
+ --ax-brand-1-1000: #52002b;
158
+ --ax-brand-1-900: #98185d;
159
+ --ax-brand-1-800: #a33069;
160
+ --ax-brand-1-700: #a93d70;
161
+ --ax-brand-1-600: #b65781;
162
+ --ax-brand-1-500: #c26f92;
163
+ --ax-brand-1-400: #eccad6;
164
+ --ax-brand-1-300: #f3dde5;
165
+ --ax-brand-1-200: #f8eaef;
166
+ --ax-brand-1-100: #fbf3f6;
167
167
  --ax-info-400A: rgba(0, 90, 146, .247);
168
168
  --ax-info-300A: rgba(0, 96, 160, .157);
169
169
  --ax-info-200A: rgba(0, 110, 183, .11);
@@ -255,176 +255,169 @@
255
255
  --ax-bg-default: #fff;
256
256
  --ax-opacity-disabled: .3;
257
257
  --ax-shadow-dialog: 0px 0px 1px 0px rgba(7, 9, 13, .02), 0px 2px 5px 0px rgba(7, 9, 13, .1), 0px 5px 12px 0px rgba(7, 9, 13, .12);
258
- --ax-border-focus: var(--ax-accent-700);
258
+ --ax-border-focus: var(--ax-neutral-1000);
259
259
  --ax-border-strong: var(--ax-neutral-600);
260
260
  --ax-border-subtleA: var(--ax-neutral-400A);
261
261
  --ax-border-subtle: var(--ax-neutral-400);
262
262
  --ax-border-default: var(--ax-neutral-500);
263
- --ax-border-meta-lime-strong: var(--ax-meta-lime-600);
264
- --ax-border-meta-lime-subtleA: var(--ax-meta-lime-400A);
265
- --ax-border-meta-lime-subtle: var(--ax-meta-lime-400);
266
- --ax-border-meta-lime: var(--ax-meta-lime-500);
267
- --ax-border-meta-purple-strong: var(--ax-meta-purple-600);
268
- --ax-border-meta-purple-subtleA: var(--ax-meta-purple-400A);
269
- --ax-border-meta-purple-subtle: var(--ax-meta-purple-400);
270
- --ax-border-meta-purple: var(--ax-meta-purple-500);
271
- --ax-border-brand-blue-strong: var(--ax-brand-blue-600);
272
- --ax-border-brand-blue-subtleA: var(--ax-brand-blue-400A);
273
- --ax-border-brand-blue-subtle: var(--ax-brand-blue-400);
274
- --ax-border-brand-blue: var(--ax-brand-blue-500);
275
- --ax-border-brand-beige-strong: var(--ax-brand-beige-600);
276
- --ax-border-brand-beige-subtleA: var(--ax-brand-beige-400A);
277
- --ax-border-brand-beige-subtle: var(--ax-brand-beige-400);
278
- --ax-border-brand-beige: var(--ax-brand-beige-500);
279
- --ax-border-brand-magenta-strong: var(--ax-brand-magenta-600);
280
- --ax-border-brand-magenta-subtleA: var(--ax-brand-magenta-400A);
281
- --ax-border-brand-magenta-subtle: var(--ax-brand-magenta-400);
282
- --ax-border-brand-magenta: var(--ax-brand-magenta-500);
283
- --ax-border-info-strong: var(--ax-info-600);
263
+ --ax-border-meta-2-strong: var(--ax-meta-2-700);
264
+ --ax-border-meta-2-subtleA: var(--ax-meta-2-400A);
265
+ --ax-border-meta-2-subtle: var(--ax-meta-2-400);
266
+ --ax-border-meta-2: var(--ax-meta-2-600);
267
+ --ax-border-meta-1-strong: var(--ax-meta-1-700);
268
+ --ax-border-meta-1-subtleA: var(--ax-meta-1-400A);
269
+ --ax-border-meta-1-subtle: var(--ax-meta-1-400);
270
+ --ax-border-meta-1: var(--ax-meta-1-600);
271
+ --ax-border-brand-3-strong: var(--ax-brand-3-700);
272
+ --ax-border-brand-3-subtleA: var(--ax-brand-3-400A);
273
+ --ax-border-brand-3-subtle: var(--ax-brand-3-400);
274
+ --ax-border-brand-3: var(--ax-brand-3-600);
275
+ --ax-border-brand-2-strong: var(--ax-brand-2-700);
276
+ --ax-border-brand-2-subtleA: var(--ax-brand-2-400A);
277
+ --ax-border-brand-2-subtle: var(--ax-brand-2-400);
278
+ --ax-border-brand-2: var(--ax-brand-2-600);
279
+ --ax-border-brand-1-strong: var(--ax-brand-1-700);
280
+ --ax-border-brand-1-subtleA: var(--ax-brand-1-400A);
281
+ --ax-border-brand-1-subtle: var(--ax-brand-1-400);
282
+ --ax-border-brand-1: var(--ax-brand-1-600);
283
+ --ax-border-info-strong: var(--ax-info-700);
284
284
  --ax-border-info-subtleA: var(--ax-info-400A);
285
285
  --ax-border-info-subtle: var(--ax-info-400);
286
- --ax-border-info: var(--ax-info-500);
287
- --ax-border-danger-strong: var(--ax-danger-600);
286
+ --ax-border-info: var(--ax-info-600);
287
+ --ax-border-danger-strong: var(--ax-danger-700);
288
288
  --ax-border-danger-subtleA: var(--ax-danger-400A);
289
289
  --ax-border-danger-subtle: var(--ax-danger-400);
290
- --ax-border-danger: var(--ax-danger-500);
291
- --ax-border-warning-strong: var(--ax-warning-600);
290
+ --ax-border-danger: var(--ax-danger-600);
291
+ --ax-border-warning-strong: var(--ax-warning-700);
292
292
  --ax-border-warning-subtleA: var(--ax-warning-400A);
293
293
  --ax-border-warning-subtle: var(--ax-warning-400);
294
- --ax-border-warning: var(--ax-warning-500);
295
- --ax-border-success-strong: var(--ax-success-600);
294
+ --ax-border-warning: var(--ax-warning-600);
295
+ --ax-border-success-strong: var(--ax-success-700);
296
296
  --ax-border-success-subtleA: var(--ax-success-400A);
297
297
  --ax-border-success-subtle: var(--ax-success-400);
298
- --ax-border-success: var(--ax-success-500);
299
- --ax-border-accent-strong: var(--ax-accent-600);
298
+ --ax-border-success: var(--ax-success-600);
299
+ --ax-border-accent-strong: var(--ax-accent-700);
300
300
  --ax-border-accent-subtleA: var(--ax-accent-400A);
301
301
  --ax-border-accent-subtle: var(--ax-accent-400);
302
- --ax-border-accent: var(--ax-accent-500);
303
- --ax-border-neutral-strong: var(--ax-neutral-600);
304
- --ax-border-neutral-subtleA: var(--ax-neutral-400A);
305
- --ax-border-neutral-subtle: var(--ax-neutral-400);
306
- --ax-border-neutral: var(--ax-neutral-500);
302
+ --ax-border-accent: var(--ax-accent-600);
303
+ --ax-text-contrast: var(--ax-neutral-000);
307
304
  --ax-text-icon: var(--ax-neutral-600);
308
305
  --ax-text-subtle: var(--ax-neutral-900);
309
306
  --ax-text-default: var(--ax-neutral-1000);
310
- --ax-text-meta-lime-contrast: var(--ax-neutral-000);
311
- --ax-text-meta-purple-contrast: var(--ax-neutral-000);
312
- --ax-text-brand-blue-contrast: var(--ax-neutral-000);
313
- --ax-text-brand-beige-contrast: var(--ax-neutral-000);
314
- --ax-text-brand-magenta-contrast: var(--ax-neutral-000);
307
+ --ax-text-meta-2-contrast: var(--ax-neutral-000);
308
+ --ax-text-meta-1-contrast: var(--ax-neutral-000);
309
+ --ax-text-brand-3-contrast: var(--ax-neutral-000);
310
+ --ax-text-brand-2-contrast: var(--ax-neutral-000);
311
+ --ax-text-brand-1-contrast: var(--ax-neutral-000);
315
312
  --ax-text-warning-contrast: var(--ax-neutral-000);
316
313
  --ax-text-success-contrast: var(--ax-neutral-000);
317
314
  --ax-text-info-contrast: var(--ax-neutral-000);
318
315
  --ax-text-danger-contrast: var(--ax-neutral-000);
319
- --ax-text-neutral-contrast: var(--ax-neutral-000);
320
316
  --ax-text-accent-contrast: var(--ax-neutral-000);
321
- --ax-text-meta-lime-icon: var(--ax-meta-lime-600);
322
- --ax-text-meta-lime-strong: var(--ax-meta-lime-900);
323
- --ax-text-meta-lime: var(--ax-meta-lime-700);
324
- --ax-text-meta-purple-icon: var(--ax-meta-purple-600);
325
- --ax-text-meta-purple-strong: var(--ax-meta-purple-900);
326
- --ax-text-meta-purple: var(--ax-meta-purple-700);
327
- --ax-text-brand-blue-icon: var(--ax-brand-blue-600);
328
- --ax-text-brand-blue-strong: var(--ax-brand-blue-900);
329
- --ax-text-brand-blue: var(--ax-brand-blue-700);
330
- --ax-text-brand-beige-icon: var(--ax-brand-beige-600);
331
- --ax-text-brand-beige-strong: var(--ax-brand-beige-900);
332
- --ax-text-brand-beige: var(--ax-brand-beige-700);
333
- --ax-text-brand-magenta-icon: var(--ax-brand-magenta-600);
334
- --ax-text-brand-magenta-strong: var(--ax-brand-magenta-900);
335
- --ax-text-brand-magenta: var(--ax-brand-magenta-700);
317
+ --ax-text-meta-2-icon: var(--ax-meta-2-600);
318
+ --ax-text-meta-2-strong: var(--ax-meta-2-1000);
319
+ --ax-text-meta-2: var(--ax-meta-2-800);
320
+ --ax-text-meta-1-icon: var(--ax-meta-1-600);
321
+ --ax-text-meta-1-strong: var(--ax-meta-1-1000);
322
+ --ax-text-meta-1: var(--ax-meta-1-800);
323
+ --ax-text-brand-3-icon: var(--ax-brand-3-600);
324
+ --ax-text-brand-3-strong: var(--ax-brand-3-1000);
325
+ --ax-text-brand-3: var(--ax-brand-3-800);
326
+ --ax-text-brand-2-icon: var(--ax-brand-2-600);
327
+ --ax-text-brand-2-strong: var(--ax-brand-2-1000);
328
+ --ax-text-brand-2: var(--ax-brand-2-800);
329
+ --ax-text-brand-1-icon: var(--ax-brand-1-600);
330
+ --ax-text-brand-1-strong: var(--ax-brand-1-1000);
331
+ --ax-text-brand-1: var(--ax-brand-1-800);
336
332
  --ax-text-info-icon: var(--ax-info-600);
337
- --ax-text-info-strong: var(--ax-info-900);
338
- --ax-text-info: var(--ax-info-700);
333
+ --ax-text-info-strong: var(--ax-info-1000);
334
+ --ax-text-info: var(--ax-info-800);
339
335
  --ax-text-danger-icon: var(--ax-danger-600);
340
- --ax-text-danger-strong: var(--ax-danger-900);
341
- --ax-text-danger: var(--ax-danger-700);
336
+ --ax-text-danger-strong: var(--ax-danger-1000);
337
+ --ax-text-danger: var(--ax-danger-800);
342
338
  --ax-text-warning-icon: var(--ax-warning-600);
343
- --ax-text-warning-strong: var(--ax-warning-900);
344
- --ax-text-warning: var(--ax-warning-700);
339
+ --ax-text-warning-strong: var(--ax-warning-1000);
340
+ --ax-text-warning: var(--ax-warning-800);
345
341
  --ax-text-success-icon: var(--ax-success-600);
346
- --ax-text-success-strong: var(--ax-success-900);
347
- --ax-text-success: var(--ax-success-700);
342
+ --ax-text-success-strong: var(--ax-success-1000);
343
+ --ax-text-success: var(--ax-success-800);
348
344
  --ax-text-accent-icon: var(--ax-accent-600);
349
- --ax-text-accent-strong: var(--ax-accent-900);
350
- --ax-text-accent: var(--ax-accent-700);
351
- --ax-text-neutral-icon: var(--ax-neutral-600);
352
- --ax-text-neutral-strong: var(--ax-neutral-900);
353
- --ax-text-neutral: var(--ax-neutral-700);
345
+ --ax-text-accent-strong: var(--ax-accent-1000);
346
+ --ax-text-accent: var(--ax-accent-800);
347
+ --ax-bg-strong-pressed: var(--ax-neutral-900);
348
+ --ax-bg-strong-hover: var(--ax-neutral-800);
349
+ --ax-bg-strong: var(--ax-neutral-700);
350
+ --ax-bg-moderate-pressedA: var(--ax-neutral-400A);
351
+ --ax-bg-moderate-pressed: var(--ax-neutral-400);
352
+ --ax-bg-moderate-hoverA: var(--ax-neutral-300A);
353
+ --ax-bg-moderate-hover: var(--ax-neutral-300);
354
+ --ax-bg-moderateA: var(--ax-neutral-200A);
355
+ --ax-bg-moderate: var(--ax-neutral-200);
356
+ --ax-bg-hoverA: var(--ax-neutral-200A);
357
+ --ax-bg-hover: var(--ax-neutral-200);
358
+ --ax-bg-soft: var(--ax-neutral-100);
354
359
  --ax-bg-sunken: var(--ax-neutral-200);
355
360
  --ax-bg-raised: var(--ax-neutral-000);
356
- --ax-bg-meta-lime-raised-hover: var(--ax-meta-lime-200);
357
- --ax-bg-meta-lime-raised: var(--ax-meta-lime-100);
358
- --ax-bg-meta-lime-strong-pressed: var(--ax-meta-lime-800);
359
- --ax-bg-meta-lime-strong-hover: var(--ax-meta-lime-700);
360
- --ax-bg-meta-lime-strong: var(--ax-meta-lime-600);
361
- --ax-bg-meta-lime-moderate-pressedA: var(--ax-meta-lime-400A);
362
- --ax-bg-meta-lime-moderate-pressed: var(--ax-meta-lime-400);
363
- --ax-bg-meta-lime-moderate-hoverA: var(--ax-meta-lime-300A);
364
- --ax-bg-meta-lime-moderate-hover: var(--ax-meta-lime-300);
365
- --ax-bg-meta-lime-moderateA: var(--ax-meta-lime-200A);
366
- --ax-bg-meta-lime-moderate: var(--ax-meta-lime-200);
367
- --ax-bg-meta-lime-hoverA: var(--ax-meta-lime-200A);
368
- --ax-bg-meta-lime-hover: var(--ax-meta-lime-200);
369
- --ax-bg-meta-lime: var(--ax-meta-lime-100);
370
- --ax-bg-meta-purple-raised-hover: var(--ax-meta-purple-200);
371
- --ax-bg-meta-purple-raised: var(--ax-meta-purple-100);
372
- --ax-bg-meta-purple-strong-pressed: var(--ax-meta-purple-800);
373
- --ax-bg-meta-purple-strong-hover: var(--ax-meta-purple-700);
374
- --ax-bg-meta-purple-strong: var(--ax-meta-purple-600);
375
- --ax-bg-meta-purple-moderate-pressedA: var(--ax-meta-purple-400A);
376
- --ax-bg-meta-purple-moderate-pressed: var(--ax-meta-purple-400);
377
- --ax-bg-meta-purple-moderate-hoverA: var(--ax-meta-purple-300A);
378
- --ax-bg-meta-purple-moderate-hover: var(--ax-meta-purple-300);
379
- --ax-bg-meta-purple-moderateA: var(--ax-meta-purple-200A);
380
- --ax-bg-meta-purple-moderate: var(--ax-meta-purple-200);
381
- --ax-bg-meta-purple-hoverA: var(--ax-meta-purple-200A);
382
- --ax-bg-meta-purple-hover: var(--ax-meta-purple-200);
383
- --ax-bg-meta-purple: var(--ax-meta-purple-100);
384
- --ax-bg-brand-blue-raised-hover: var(--ax-brand-blue-200);
385
- --ax-bg-brand-blue-raised: var(--ax-brand-blue-100);
386
- --ax-bg-brand-blue-strong-pressed: var(--ax-brand-blue-800);
387
- --ax-bg-brand-blue-strong-hover: var(--ax-brand-blue-700);
388
- --ax-bg-brand-blue-strong: var(--ax-brand-blue-600);
389
- --ax-bg-brand-blue-moderate-pressedA: var(--ax-brand-blue-400A);
390
- --ax-bg-brand-blue-moderate-pressed: var(--ax-brand-blue-400);
391
- --ax-bg-brand-blue-moderate-hoverA: var(--ax-brand-blue-300A);
392
- --ax-bg-brand-blue-moderate-hover: var(--ax-brand-blue-300);
393
- --ax-bg-brand-blue-moderateA: var(--ax-brand-blue-200A);
394
- --ax-bg-brand-blue-moderate: var(--ax-brand-blue-200);
395
- --ax-bg-brand-blue-hoverA: var(--ax-brand-blue-200A);
396
- --ax-bg-brand-blue-hover: var(--ax-brand-blue-200);
397
- --ax-bg-brand-blue: var(--ax-brand-blue-100);
398
- --ax-bg-brand-beige-raised-hover: var(--ax-brand-beige-200);
399
- --ax-bg-brand-beige-raised: var(--ax-brand-beige-100);
400
- --ax-bg-brand-beige-strong-pressed: var(--ax-brand-beige-800);
401
- --ax-bg-brand-beige-strong-hover: var(--ax-brand-beige-700);
402
- --ax-bg-brand-beige-strong: var(--ax-brand-beige-600);
403
- --ax-bg-brand-beige-moderate-pressedA: var(--ax-brand-beige-400A);
404
- --ax-bg-brand-beige-moderate-pressed: var(--ax-brand-beige-400);
405
- --ax-bg-brand-beige-moderate-hoverA: var(--ax-brand-beige-300A);
406
- --ax-bg-brand-beige-moderate-hover: var(--ax-brand-beige-300);
407
- --ax-bg-brand-beige-moderateA: var(--ax-brand-beige-200A);
408
- --ax-bg-brand-beige-moderate: var(--ax-brand-beige-200);
409
- --ax-bg-brand-beige-hoverA: var(--ax-brand-beige-200A);
410
- --ax-bg-brand-beige-hover: var(--ax-brand-beige-200);
411
- --ax-bg-brand-beige: var(--ax-brand-beige-100);
412
- --ax-bg-brand-magenta-raised-hover: var(--ax-brand-magenta-200);
413
- --ax-bg-brand-magenta-raised: var(--ax-brand-magenta-100);
414
- --ax-bg-brand-magenta-strong-pressed: var(--ax-brand-magenta-800);
415
- --ax-bg-brand-magenta-strong-hover: var(--ax-brand-magenta-700);
416
- --ax-bg-brand-magenta-strong: var(--ax-brand-magenta-600);
417
- --ax-bg-brand-magenta-moderate-pressedA: var(--ax-brand-magenta-400A);
418
- --ax-bg-brand-magenta-moderate-pressed: var(--ax-brand-magenta-400);
419
- --ax-bg-brand-magenta-moderate-hoverA: var(--ax-brand-magenta-300A);
420
- --ax-bg-brand-magenta-moderate-hover: var(--ax-brand-magenta-300);
421
- --ax-bg-brand-magenta-moderateA: var(--ax-brand-magenta-200A);
422
- --ax-bg-brand-magenta-moderate: var(--ax-brand-magenta-200);
423
- --ax-bg-brand-magenta-hoverA: var(--ax-brand-magenta-200A);
424
- --ax-bg-brand-magenta-hover: var(--ax-brand-magenta-200);
425
- --ax-bg-brand-magenta: var(--ax-brand-magenta-100);
426
- --ax-bg-info-raised-hover: var(--ax-info-200);
427
- --ax-bg-info-raised: var(--ax-info-100);
361
+ --ax-bg-meta-2-strong-pressed: var(--ax-meta-2-800);
362
+ --ax-bg-meta-2-strong-hover: var(--ax-meta-2-700);
363
+ --ax-bg-meta-2-strong: var(--ax-meta-2-600);
364
+ --ax-bg-meta-2-moderate-pressedA: var(--ax-meta-2-400A);
365
+ --ax-bg-meta-2-moderate-pressed: var(--ax-meta-2-400);
366
+ --ax-bg-meta-2-moderate-hoverA: var(--ax-meta-2-300A);
367
+ --ax-bg-meta-2-moderate-hover: var(--ax-meta-2-300);
368
+ --ax-bg-meta-2-moderateA: var(--ax-meta-2-200A);
369
+ --ax-bg-meta-2-moderate: var(--ax-meta-2-200);
370
+ --ax-bg-meta-2-hoverA: var(--ax-meta-2-200A);
371
+ --ax-bg-meta-2-hover: var(--ax-meta-2-200);
372
+ --ax-bg-meta-2-soft: var(--ax-meta-2-100);
373
+ --ax-bg-meta-1-strong-pressed: var(--ax-meta-1-800);
374
+ --ax-bg-meta-1-strong-hover: var(--ax-meta-1-700);
375
+ --ax-bg-meta-1-strong: var(--ax-meta-1-600);
376
+ --ax-bg-meta-1-moderate-pressedA: var(--ax-meta-1-400A);
377
+ --ax-bg-meta-1-moderate-pressed: var(--ax-meta-1-400);
378
+ --ax-bg-meta-1-moderate-hoverA: var(--ax-meta-1-300A);
379
+ --ax-bg-meta-1-moderate-hover: var(--ax-meta-1-300);
380
+ --ax-bg-meta-1-moderateA: var(--ax-meta-1-200A);
381
+ --ax-bg-meta-1-moderate: var(--ax-meta-1-200);
382
+ --ax-bg-meta-1-hoverA: var(--ax-meta-1-200A);
383
+ --ax-bg-meta-1-hover: var(--ax-meta-1-200);
384
+ --ax-bg-meta-1-soft: var(--ax-meta-1-100);
385
+ --ax-bg-brand-3-strong-pressed: var(--ax-brand-3-800);
386
+ --ax-bg-brand-3-strong-hover: var(--ax-brand-3-700);
387
+ --ax-bg-brand-3-strong: var(--ax-brand-3-600);
388
+ --ax-bg-brand-3-moderate-pressedA: var(--ax-brand-3-400A);
389
+ --ax-bg-brand-3-moderate-pressed: var(--ax-brand-3-400);
390
+ --ax-bg-brand-3-moderate-hoverA: var(--ax-brand-3-300A);
391
+ --ax-bg-brand-3-moderate-hover: var(--ax-brand-3-300);
392
+ --ax-bg-brand-3-moderateA: var(--ax-brand-3-200A);
393
+ --ax-bg-brand-3-moderate: var(--ax-brand-3-200);
394
+ --ax-bg-brand-3-hoverA: var(--ax-brand-3-200A);
395
+ --ax-bg-brand-3-hover: var(--ax-brand-3-200);
396
+ --ax-bg-brand-3-soft: var(--ax-brand-3-100);
397
+ --ax-bg-brand-2-strong-pressed: var(--ax-brand-2-800);
398
+ --ax-bg-brand-2-strong-hover: var(--ax-brand-2-700);
399
+ --ax-bg-brand-2-strong: var(--ax-brand-2-600);
400
+ --ax-bg-brand-2-moderate-pressedA: var(--ax-brand-2-400A);
401
+ --ax-bg-brand-2-moderate-pressed: var(--ax-brand-2-400);
402
+ --ax-bg-brand-2-moderate-hoverA: var(--ax-brand-2-300A);
403
+ --ax-bg-brand-2-moderate-hover: var(--ax-brand-2-300);
404
+ --ax-bg-brand-2-moderateA: var(--ax-brand-2-200A);
405
+ --ax-bg-brand-2-moderate: var(--ax-brand-2-200);
406
+ --ax-bg-brand-2-hoverA: var(--ax-brand-2-200A);
407
+ --ax-bg-brand-2-hover: var(--ax-brand-2-200);
408
+ --ax-bg-brand-2-soft: var(--ax-brand-2-100);
409
+ --ax-bg-brand-1-strong-pressed: var(--ax-brand-1-800);
410
+ --ax-bg-brand-1-strong-hover: var(--ax-brand-1-700);
411
+ --ax-bg-brand-1-strong: var(--ax-brand-1-600);
412
+ --ax-bg-brand-1-moderate-pressedA: var(--ax-brand-1-400A);
413
+ --ax-bg-brand-1-moderate-pressed: var(--ax-brand-1-400);
414
+ --ax-bg-brand-1-moderate-hoverA: var(--ax-brand-1-300A);
415
+ --ax-bg-brand-1-moderate-hover: var(--ax-brand-1-300);
416
+ --ax-bg-brand-1-moderateA: var(--ax-brand-1-200A);
417
+ --ax-bg-brand-1-moderate: var(--ax-brand-1-200);
418
+ --ax-bg-brand-1-hoverA: var(--ax-brand-1-200A);
419
+ --ax-bg-brand-1-hover: var(--ax-brand-1-200);
420
+ --ax-bg-brand-1-soft: var(--ax-brand-1-100);
428
421
  --ax-bg-info-strong-pressed: var(--ax-info-800);
429
422
  --ax-bg-info-strong-hover: var(--ax-info-700);
430
423
  --ax-bg-info-strong: var(--ax-info-600);
@@ -436,9 +429,7 @@
436
429
  --ax-bg-info-moderate: var(--ax-info-200);
437
430
  --ax-bg-info-hoverA: var(--ax-info-200A);
438
431
  --ax-bg-info-hover: var(--ax-info-200);
439
- --ax-bg-info: var(--ax-info-100);
440
- --ax-bg-danger-raised-hover: var(--ax-danger-200);
441
- --ax-bg-danger-raised: var(--ax-danger-100);
432
+ --ax-bg-info-soft: var(--ax-info-100);
442
433
  --ax-bg-danger-strong-pressed: var(--ax-danger-800);
443
434
  --ax-bg-danger-strong-hover: var(--ax-danger-700);
444
435
  --ax-bg-danger-strong: var(--ax-danger-600);
@@ -450,9 +441,7 @@
450
441
  --ax-bg-danger-moderate: var(--ax-danger-200);
451
442
  --ax-bg-danger-hoverA: var(--ax-danger-200A);
452
443
  --ax-bg-danger-hover: var(--ax-danger-200);
453
- --ax-bg-danger: var(--ax-danger-100);
454
- --ax-bg-warning-raised-hover: var(--ax-warning-200);
455
- --ax-bg-warning-raised: var(--ax-warning-100);
444
+ --ax-bg-danger-soft: var(--ax-danger-100);
456
445
  --ax-bg-warning-strong-pressed: var(--ax-warning-800);
457
446
  --ax-bg-warning-strong-hover: var(--ax-warning-700);
458
447
  --ax-bg-warning-strong: var(--ax-warning-600);
@@ -464,9 +453,7 @@
464
453
  --ax-bg-warning-moderate: var(--ax-warning-200);
465
454
  --ax-bg-warning-hoverA: var(--ax-warning-200A);
466
455
  --ax-bg-warning-hover: var(--ax-warning-200);
467
- --ax-bg-warning: var(--ax-warning-100);
468
- --ax-bg-success-raised-hover: var(--ax-success-200);
469
- --ax-bg-success-raised: var(--ax-success-100);
456
+ --ax-bg-warning-soft: var(--ax-warning-100);
470
457
  --ax-bg-success-strong-pressed: var(--ax-success-800);
471
458
  --ax-bg-success-strong-hover: var(--ax-success-700);
472
459
  --ax-bg-success-strong: var(--ax-success-600);
@@ -478,9 +465,7 @@
478
465
  --ax-bg-success-moderate: var(--ax-success-200);
479
466
  --ax-bg-success-hoverA: var(--ax-success-200A);
480
467
  --ax-bg-success-hover: var(--ax-success-200);
481
- --ax-bg-success: var(--ax-success-100);
482
- --ax-bg-accent-raised-hover: var(--ax-accent-200);
483
- --ax-bg-accent-raised: var(--ax-accent-100);
468
+ --ax-bg-success-soft: var(--ax-success-100);
484
469
  --ax-bg-accent-strong-pressed: var(--ax-accent-800);
485
470
  --ax-bg-accent-strong-hover: var(--ax-accent-700);
486
471
  --ax-bg-accent-strong: var(--ax-accent-600);
@@ -492,94 +477,80 @@
492
477
  --ax-bg-accent-moderate: var(--ax-accent-200);
493
478
  --ax-bg-accent-hoverA: var(--ax-accent-200A);
494
479
  --ax-bg-accent-hover: var(--ax-accent-200);
495
- --ax-bg-accent: var(--ax-accent-100);
496
- --ax-bg-neutral-raised-hover: var(--ax-neutral-200);
497
- --ax-bg-neutral-raised: var(--ax-neutral-100);
498
- --ax-bg-neutral-strong-pressed: var(--ax-neutral-800);
499
- --ax-bg-neutral-strong-hover: var(--ax-neutral-700);
500
- --ax-bg-neutral-strong: var(--ax-neutral-600);
501
- --ax-bg-neutral-moderate-pressedA: var(--ax-neutral-400A);
502
- --ax-bg-neutral-moderate-pressed: var(--ax-neutral-400);
503
- --ax-bg-neutral-moderate-hoverA: var(--ax-neutral-300A);
504
- --ax-bg-neutral-moderate-hover: var(--ax-neutral-300);
505
- --ax-bg-neutral-moderateA: var(--ax-neutral-200A);
506
- --ax-bg-neutral-moderate: var(--ax-neutral-200);
507
- --ax-bg-neutral-hoverA: var(--ax-neutral-200A);
508
- --ax-bg-neutral-hover: var(--ax-neutral-200);
509
- --ax-bg-neutral: var(--ax-neutral-100);
480
+ --ax-bg-accent-soft: var(--ax-accent-100);
510
481
  }
511
482
 
512
483
  .dark, .dark-theme {
513
- --ax-meta-lime-400A: rgba(251, 245, 0, .16);
514
- --ax-meta-lime-300A: rgba(252, 233, 0, .114);
515
- --ax-meta-lime-200A: rgba(246, 207, 0, .086);
516
- --ax-meta-lime-100A: rgba(252, 191, 0, .06);
517
- --ax-meta-lime-1000: #c5d14c;
518
- --ax-meta-lime-900: #a9b325;
519
- --ax-meta-lime-800: #99a200;
520
- --ax-meta-lime-700: #8f9800;
521
- --ax-meta-lime-600: #7c8400;
522
- --ax-meta-lime-500: #6a7200;
523
- --ax-meta-lime-400: #343900;
524
- --ax-meta-lime-300: #292d00;
525
- --ax-meta-lime-200: #222500;
526
- --ax-meta-lime-100: #1c1f00;
527
- --ax-meta-purple-400A: rgba(253, 179, 238, .184);
528
- --ax-meta-purple-300A: rgba(255, 153, 228, .137);
529
- --ax-meta-purple-200A: rgba(250, 125, 211, .106);
530
- --ax-meta-purple-100A: rgba(246, 79, 182, .086);
531
- --ax-meta-purple-1000: #cdc5d9;
532
- --ax-meta-purple-900: #b2a7c3;
533
- --ax-meta-purple-800: #a495b7;
534
- --ax-meta-purple-700: #9b8bb0;
535
- --ax-meta-purple-600: #8876a1;
536
- --ax-meta-purple-500: #776491;
537
- --ax-meta-purple-400: #3a3245;
538
- --ax-meta-purple-300: #2f273a;
539
- --ax-meta-purple-200: #272032;
540
- --ax-meta-purple-100: #221a2c;
541
- --ax-brand-blue-400A: rgba(68, 198, 252, .204);
542
- --ax-brand-blue-300A: rgba(43, 191, 251, .14);
543
- --ax-brand-blue-200A: rgba(4, 191, 255, .094);
544
- --ax-brand-blue-100A: rgba(0, 165, 255, .063);
545
- --ax-brand-blue-1000: #b7cbd7;
546
- --ax-brand-blue-900: #93afc0;
547
- --ax-brand-blue-800: #7f9fb3;
548
- --ax-brand-blue-700: #7396ab;
549
- --ax-brand-blue-600: #5a839b;
550
- --ax-brand-blue-500: #43718d;
551
- --ax-brand-blue-400: #19394c;
552
- --ax-brand-blue-300: #122d3e;
553
- --ax-brand-blue-200: #0d2534;
554
- --ax-brand-blue-100: #071e2d;
555
- --ax-brand-beige-400A: rgba(252, 131, 64, .247);
556
- --ax-brand-beige-300A: rgba(254, 98, 16, .196);
557
- --ax-brand-beige-200A: rgba(251, 69, 0, .165);
558
- --ax-brand-beige-100A: rgba(254, 29, 0, .13);
559
- --ax-brand-beige-1000: #e3c2b1;
560
- --ax-brand-beige-900: #d1a08c;
561
- --ax-brand-beige-800: #c78e79;
562
- --ax-brand-beige-700: #c0836e;
563
- --ax-brand-beige-600: #ab6f5b;
564
- --ax-brand-beige-500: #975e4a;
565
- --ax-brand-beige-400: #493027;
566
- --ax-brand-beige-300: #3d241c;
567
- --ax-brand-beige-200: #351d15;
568
- --ax-brand-beige-100: #2d160e;
569
- --ax-brand-magenta-400A: rgba(254, 100, 129, .267);
570
- --ax-brand-magenta-300A: rgba(251, 72, 100, .22);
571
- --ax-brand-magenta-200A: rgba(253, 38, 75, .184);
572
- --ax-brand-magenta-100A: rgba(250, 2, 38, .153);
573
- --ax-brand-magenta-1000: #e1c0cc;
574
- --ax-brand-magenta-900: #cf9eb1;
575
- --ax-brand-magenta-800: #c58aa2;
576
- --ax-brand-magenta-700: #be7f99;
577
- --ax-brand-magenta-600: #b06886;
578
- --ax-brand-magenta-500: #a35276;
579
- --ax-brand-magenta-400: #4e2a39;
580
- --ax-brand-magenta-300: #42202e;
581
- --ax-brand-magenta-200: #3a1827;
582
- --ax-brand-magenta-100: #321220;
484
+ --ax-meta-2-400A: rgba(251, 245, 0, .16);
485
+ --ax-meta-2-300A: rgba(252, 233, 0, .114);
486
+ --ax-meta-2-200A: rgba(246, 207, 0, .086);
487
+ --ax-meta-2-100A: rgba(252, 191, 0, .06);
488
+ --ax-meta-2-1000: #c5d14c;
489
+ --ax-meta-2-900: #a9b325;
490
+ --ax-meta-2-800: #99a200;
491
+ --ax-meta-2-700: #8f9800;
492
+ --ax-meta-2-600: #7c8400;
493
+ --ax-meta-2-500: #6a7200;
494
+ --ax-meta-2-400: #343900;
495
+ --ax-meta-2-300: #292d00;
496
+ --ax-meta-2-200: #222500;
497
+ --ax-meta-2-100: #1c1f00;
498
+ --ax-meta-1-400A: rgba(253, 179, 238, .184);
499
+ --ax-meta-1-300A: rgba(255, 153, 228, .137);
500
+ --ax-meta-1-200A: rgba(250, 125, 211, .106);
501
+ --ax-meta-1-100A: rgba(246, 79, 182, .086);
502
+ --ax-meta-1-1000: #cdc5d9;
503
+ --ax-meta-1-900: #b2a7c3;
504
+ --ax-meta-1-800: #a495b7;
505
+ --ax-meta-1-700: #9b8bb0;
506
+ --ax-meta-1-600: #8876a1;
507
+ --ax-meta-1-500: #776491;
508
+ --ax-meta-1-400: #3a3245;
509
+ --ax-meta-1-300: #2f273a;
510
+ --ax-meta-1-200: #272032;
511
+ --ax-meta-1-100: #221a2c;
512
+ --ax-brand-3-400A: rgba(68, 198, 252, .204);
513
+ --ax-brand-3-300A: rgba(43, 191, 251, .14);
514
+ --ax-brand-3-200A: rgba(4, 191, 255, .094);
515
+ --ax-brand-3-100A: rgba(0, 165, 255, .063);
516
+ --ax-brand-3-1000: #b7cbd7;
517
+ --ax-brand-3-900: #93afc0;
518
+ --ax-brand-3-800: #7f9fb3;
519
+ --ax-brand-3-700: #7396ab;
520
+ --ax-brand-3-600: #5a839b;
521
+ --ax-brand-3-500: #43718d;
522
+ --ax-brand-3-400: #19394c;
523
+ --ax-brand-3-300: #122d3e;
524
+ --ax-brand-3-200: #0d2534;
525
+ --ax-brand-3-100: #071e2d;
526
+ --ax-brand-2-400A: rgba(252, 131, 64, .247);
527
+ --ax-brand-2-300A: rgba(254, 98, 16, .196);
528
+ --ax-brand-2-200A: rgba(251, 69, 0, .165);
529
+ --ax-brand-2-100A: rgba(254, 29, 0, .13);
530
+ --ax-brand-2-1000: #e3c2b1;
531
+ --ax-brand-2-900: #d1a08c;
532
+ --ax-brand-2-800: #c78e79;
533
+ --ax-brand-2-700: #c0836e;
534
+ --ax-brand-2-600: #ab6f5b;
535
+ --ax-brand-2-500: #975e4a;
536
+ --ax-brand-2-400: #493027;
537
+ --ax-brand-2-300: #3d241c;
538
+ --ax-brand-2-200: #351d15;
539
+ --ax-brand-2-100: #2d160e;
540
+ --ax-brand-1-400A: rgba(254, 100, 129, .267);
541
+ --ax-brand-1-300A: rgba(251, 72, 100, .22);
542
+ --ax-brand-1-200A: rgba(253, 38, 75, .184);
543
+ --ax-brand-1-100A: rgba(250, 2, 38, .153);
544
+ --ax-brand-1-1000: #e1c0cc;
545
+ --ax-brand-1-900: #cf9eb1;
546
+ --ax-brand-1-800: #c58aa2;
547
+ --ax-brand-1-700: #be7f99;
548
+ --ax-brand-1-600: #b06886;
549
+ --ax-brand-1-500: #a35276;
550
+ --ax-brand-1-400: #4e2a39;
551
+ --ax-brand-1-300: #42202e;
552
+ --ax-brand-1-200: #3a1827;
553
+ --ax-brand-1-100: #321220;
583
554
  --ax-info-400A: rgba(68, 198, 252, .204);
584
555
  --ax-info-300A: rgba(43, 191, 251, .14);
585
556
  --ax-info-200A: rgba(4, 191, 255, .094);
@@ -671,176 +642,169 @@
671
642
  --ax-bg-default: #0e151f;
672
643
  --ax-opacity-disabled: .4;
673
644
  --ax-shadow-dialog: 0px 0px 1px 0px rgba(7, 9, 13, 0), 0px 2px 5px 0px rgba(7, 9, 13, .35), 0px 5px 12px 0px rgba(7, 9, 13, .5);
674
- --ax-border-focus: var(--ax-accent-700);
645
+ --ax-border-focus: var(--ax-neutral-1000);
675
646
  --ax-border-strong: var(--ax-neutral-600);
676
647
  --ax-border-subtleA: var(--ax-neutral-400A);
677
648
  --ax-border-subtle: var(--ax-neutral-400);
678
649
  --ax-border-default: var(--ax-neutral-500);
679
- --ax-border-meta-lime-strong: var(--ax-meta-lime-600);
680
- --ax-border-meta-lime-subtleA: var(--ax-meta-lime-400A);
681
- --ax-border-meta-lime-subtle: var(--ax-meta-lime-400);
682
- --ax-border-meta-lime: var(--ax-meta-lime-500);
683
- --ax-border-meta-purple-strong: var(--ax-meta-purple-600);
684
- --ax-border-meta-purple-subtleA: var(--ax-meta-purple-400A);
685
- --ax-border-meta-purple-subtle: var(--ax-meta-purple-400);
686
- --ax-border-meta-purple: var(--ax-meta-purple-500);
687
- --ax-border-brand-blue-strong: var(--ax-brand-blue-600);
688
- --ax-border-brand-blue-subtleA: var(--ax-brand-blue-400A);
689
- --ax-border-brand-blue-subtle: var(--ax-brand-blue-400);
690
- --ax-border-brand-blue: var(--ax-brand-blue-500);
691
- --ax-border-brand-beige-strong: var(--ax-brand-beige-600);
692
- --ax-border-brand-beige-subtleA: var(--ax-brand-beige-400A);
693
- --ax-border-brand-beige-subtle: var(--ax-brand-beige-400);
694
- --ax-border-brand-beige: var(--ax-brand-beige-500);
695
- --ax-border-brand-magenta-strong: var(--ax-brand-magenta-600);
696
- --ax-border-brand-magenta-subtleA: var(--ax-brand-magenta-400A);
697
- --ax-border-brand-magenta-subtle: var(--ax-brand-magenta-400);
698
- --ax-border-brand-magenta: var(--ax-brand-magenta-500);
699
- --ax-border-info-strong: var(--ax-info-600);
650
+ --ax-border-meta-2-strong: var(--ax-meta-2-700);
651
+ --ax-border-meta-2-subtleA: var(--ax-meta-2-400A);
652
+ --ax-border-meta-2-subtle: var(--ax-meta-2-400);
653
+ --ax-border-meta-2: var(--ax-meta-2-600);
654
+ --ax-border-meta-1-strong: var(--ax-meta-1-700);
655
+ --ax-border-meta-1-subtleA: var(--ax-meta-1-400A);
656
+ --ax-border-meta-1-subtle: var(--ax-meta-1-400);
657
+ --ax-border-meta-1: var(--ax-meta-1-600);
658
+ --ax-border-brand-3-strong: var(--ax-brand-3-700);
659
+ --ax-border-brand-3-subtleA: var(--ax-brand-3-400A);
660
+ --ax-border-brand-3-subtle: var(--ax-brand-3-400);
661
+ --ax-border-brand-3: var(--ax-brand-3-600);
662
+ --ax-border-brand-2-strong: var(--ax-brand-2-700);
663
+ --ax-border-brand-2-subtleA: var(--ax-brand-2-400A);
664
+ --ax-border-brand-2-subtle: var(--ax-brand-2-400);
665
+ --ax-border-brand-2: var(--ax-brand-2-600);
666
+ --ax-border-brand-1-strong: var(--ax-brand-1-700);
667
+ --ax-border-brand-1-subtleA: var(--ax-brand-1-400A);
668
+ --ax-border-brand-1-subtle: var(--ax-brand-1-400);
669
+ --ax-border-brand-1: var(--ax-brand-1-600);
670
+ --ax-border-info-strong: var(--ax-info-700);
700
671
  --ax-border-info-subtleA: var(--ax-info-400A);
701
672
  --ax-border-info-subtle: var(--ax-info-400);
702
- --ax-border-info: var(--ax-info-500);
703
- --ax-border-danger-strong: var(--ax-danger-600);
673
+ --ax-border-info: var(--ax-info-600);
674
+ --ax-border-danger-strong: var(--ax-danger-700);
704
675
  --ax-border-danger-subtleA: var(--ax-danger-400A);
705
676
  --ax-border-danger-subtle: var(--ax-danger-400);
706
- --ax-border-danger: var(--ax-danger-500);
707
- --ax-border-warning-strong: var(--ax-warning-600);
677
+ --ax-border-danger: var(--ax-danger-600);
678
+ --ax-border-warning-strong: var(--ax-warning-700);
708
679
  --ax-border-warning-subtleA: var(--ax-warning-400A);
709
680
  --ax-border-warning-subtle: var(--ax-warning-400);
710
- --ax-border-warning: var(--ax-warning-500);
711
- --ax-border-success-strong: var(--ax-success-600);
681
+ --ax-border-warning: var(--ax-warning-600);
682
+ --ax-border-success-strong: var(--ax-success-700);
712
683
  --ax-border-success-subtleA: var(--ax-success-400A);
713
684
  --ax-border-success-subtle: var(--ax-success-400);
714
- --ax-border-success: var(--ax-success-500);
715
- --ax-border-accent-strong: var(--ax-accent-600);
685
+ --ax-border-success: var(--ax-success-600);
686
+ --ax-border-accent-strong: var(--ax-accent-700);
716
687
  --ax-border-accent-subtleA: var(--ax-accent-400A);
717
688
  --ax-border-accent-subtle: var(--ax-accent-400);
718
- --ax-border-accent: var(--ax-accent-500);
719
- --ax-border-neutral-strong: var(--ax-neutral-600);
720
- --ax-border-neutral-subtleA: var(--ax-neutral-400A);
721
- --ax-border-neutral-subtle: var(--ax-neutral-400);
722
- --ax-border-neutral: var(--ax-neutral-500);
689
+ --ax-border-accent: var(--ax-accent-600);
690
+ --ax-text-contrast: var(--ax-neutral-000);
723
691
  --ax-text-logo: var(--ax-neutral-1000);
724
692
  --ax-text-icon: var(--ax-neutral-600);
725
693
  --ax-text-subtle: var(--ax-neutral-900);
726
694
  --ax-text-default: var(--ax-neutral-1000);
727
- --ax-text-meta-lime-contrast: var(--ax-neutral-000);
728
- --ax-text-meta-purple-contrast: var(--ax-neutral-000);
729
- --ax-text-brand-blue-contrast: var(--ax-neutral-000);
730
- --ax-text-brand-beige-contrast: var(--ax-neutral-000);
731
- --ax-text-brand-magenta-contrast: var(--ax-neutral-000);
695
+ --ax-text-meta-2-contrast: var(--ax-neutral-000);
696
+ --ax-text-meta-1-contrast: var(--ax-neutral-000);
697
+ --ax-text-brand-3-contrast: var(--ax-neutral-000);
698
+ --ax-text-brand-2-contrast: var(--ax-neutral-000);
699
+ --ax-text-brand-1-contrast: var(--ax-neutral-000);
732
700
  --ax-text-warning-contrast: var(--ax-neutral-000);
733
701
  --ax-text-success-contrast: var(--ax-neutral-000);
734
702
  --ax-text-info-contrast: var(--ax-neutral-000);
735
703
  --ax-text-danger-contrast: var(--ax-neutral-000);
736
- --ax-text-neutral-contrast: var(--ax-neutral-000);
737
704
  --ax-text-accent-contrast: var(--ax-neutral-000);
738
- --ax-text-meta-lime-icon: var(--ax-meta-lime-600);
739
- --ax-text-meta-lime-strong: var(--ax-meta-lime-900);
740
- --ax-text-meta-lime: var(--ax-meta-lime-700);
741
- --ax-text-meta-purple-icon: var(--ax-meta-purple-600);
742
- --ax-text-meta-purple-strong: var(--ax-meta-purple-900);
743
- --ax-text-meta-purple: var(--ax-meta-purple-700);
744
- --ax-text-brand-blue-icon: var(--ax-brand-blue-600);
745
- --ax-text-brand-blue-strong: var(--ax-brand-blue-900);
746
- --ax-text-brand-blue: var(--ax-brand-blue-700);
747
- --ax-text-brand-beige-icon: var(--ax-brand-beige-600);
748
- --ax-text-brand-beige-strong: var(--ax-brand-beige-900);
749
- --ax-text-brand-beige: var(--ax-brand-beige-700);
750
- --ax-text-brand-magenta-icon: var(--ax-brand-magenta-600);
751
- --ax-text-brand-magenta-strong: var(--ax-brand-magenta-900);
752
- --ax-text-brand-magenta: var(--ax-brand-magenta-700);
705
+ --ax-text-meta-2-icon: var(--ax-meta-2-600);
706
+ --ax-text-meta-2-strong: var(--ax-meta-2-1000);
707
+ --ax-text-meta-2: var(--ax-meta-2-800);
708
+ --ax-text-meta-1-icon: var(--ax-meta-1-600);
709
+ --ax-text-meta-1-strong: var(--ax-meta-1-1000);
710
+ --ax-text-meta-1: var(--ax-meta-1-800);
711
+ --ax-text-brand-3-icon: var(--ax-brand-3-600);
712
+ --ax-text-brand-3-strong: var(--ax-brand-3-1000);
713
+ --ax-text-brand-3: var(--ax-brand-3-800);
714
+ --ax-text-brand-2-icon: var(--ax-brand-2-600);
715
+ --ax-text-brand-2-strong: var(--ax-brand-2-1000);
716
+ --ax-text-brand-2: var(--ax-brand-2-800);
717
+ --ax-text-brand-1-icon: var(--ax-brand-1-600);
718
+ --ax-text-brand-1-strong: var(--ax-brand-1-1000);
719
+ --ax-text-brand-1: var(--ax-brand-1-800);
753
720
  --ax-text-info-icon: var(--ax-info-600);
754
- --ax-text-info-strong: var(--ax-info-900);
755
- --ax-text-info: var(--ax-info-700);
721
+ --ax-text-info-strong: var(--ax-info-1000);
722
+ --ax-text-info: var(--ax-info-800);
756
723
  --ax-text-danger-icon: var(--ax-danger-600);
757
- --ax-text-danger-strong: var(--ax-danger-900);
758
- --ax-text-danger: var(--ax-danger-700);
724
+ --ax-text-danger-strong: var(--ax-danger-1000);
725
+ --ax-text-danger: var(--ax-danger-800);
759
726
  --ax-text-warning-icon: var(--ax-warning-600);
760
- --ax-text-warning-strong: var(--ax-warning-900);
761
- --ax-text-warning: var(--ax-warning-700);
727
+ --ax-text-warning-strong: var(--ax-warning-1000);
728
+ --ax-text-warning: var(--ax-warning-800);
762
729
  --ax-text-success-icon: var(--ax-success-600);
763
- --ax-text-success-strong: var(--ax-success-900);
764
- --ax-text-success: var(--ax-success-700);
730
+ --ax-text-success-strong: var(--ax-success-1000);
731
+ --ax-text-success: var(--ax-success-800);
765
732
  --ax-text-accent-icon: var(--ax-accent-600);
766
- --ax-text-accent-strong: var(--ax-accent-900);
767
- --ax-text-accent: var(--ax-accent-700);
768
- --ax-text-neutral-icon: var(--ax-neutral-600);
769
- --ax-text-neutral-strong: var(--ax-neutral-900);
770
- --ax-text-neutral: var(--ax-neutral-700);
771
- --ax-bg-raised: var(--ax-neutral-200);
772
- --ax-bg-meta-lime-raised-hover: var(--ax-meta-lime-300);
773
- --ax-bg-meta-lime-raised: var(--ax-meta-lime-200);
774
- --ax-bg-meta-lime-strong-pressed: var(--ax-meta-lime-800);
775
- --ax-bg-meta-lime-strong-hover: var(--ax-meta-lime-700);
776
- --ax-bg-meta-lime-strong: var(--ax-meta-lime-600);
777
- --ax-bg-meta-lime-moderate-pressedA: var(--ax-meta-lime-400A);
778
- --ax-bg-meta-lime-moderate-pressed: var(--ax-meta-lime-400);
779
- --ax-bg-meta-lime-moderate-hoverA: var(--ax-meta-lime-300A);
780
- --ax-bg-meta-lime-moderate-hover: var(--ax-meta-lime-300);
781
- --ax-bg-meta-lime-moderateA: var(--ax-meta-lime-200A);
782
- --ax-bg-meta-lime-moderate: var(--ax-meta-lime-200);
783
- --ax-bg-meta-lime-hoverA: var(--ax-meta-lime-200A);
784
- --ax-bg-meta-lime-hover: var(--ax-meta-lime-200);
785
- --ax-bg-meta-lime: var(--ax-meta-lime-100);
786
- --ax-bg-meta-purple-raised-hover: var(--ax-meta-purple-300);
787
- --ax-bg-meta-purple-raised: var(--ax-meta-purple-200);
788
- --ax-bg-meta-purple-strong-pressed: var(--ax-meta-purple-800);
789
- --ax-bg-meta-purple-strong-hover: var(--ax-meta-purple-700);
790
- --ax-bg-meta-purple-strong: var(--ax-meta-purple-600);
791
- --ax-bg-meta-purple-moderate-pressedA: var(--ax-meta-purple-400A);
792
- --ax-bg-meta-purple-moderate-pressed: var(--ax-meta-purple-400);
793
- --ax-bg-meta-purple-moderate-hoverA: var(--ax-meta-purple-300A);
794
- --ax-bg-meta-purple-moderate-hover: var(--ax-meta-purple-300);
795
- --ax-bg-meta-purple-moderateA: var(--ax-meta-purple-200A);
796
- --ax-bg-meta-purple-moderate: var(--ax-meta-purple-200);
797
- --ax-bg-meta-purple-hoverA: var(--ax-meta-purple-200A);
798
- --ax-bg-meta-purple-hover: var(--ax-meta-purple-200);
799
- --ax-bg-meta-purple: var(--ax-meta-purple-100);
800
- --ax-bg-brand-blue-raised-hover: var(--ax-brand-blue-300);
801
- --ax-bg-brand-blue-raised: var(--ax-brand-blue-200);
802
- --ax-bg-brand-blue-strong-pressed: var(--ax-brand-blue-800);
803
- --ax-bg-brand-blue-strong-hover: var(--ax-brand-blue-700);
804
- --ax-bg-brand-blue-strong: var(--ax-brand-blue-600);
805
- --ax-bg-brand-blue-moderate-pressedA: var(--ax-brand-blue-400A);
806
- --ax-bg-brand-blue-moderate-pressed: var(--ax-brand-blue-400);
807
- --ax-bg-brand-blue-moderate-hoverA: var(--ax-brand-blue-300A);
808
- --ax-bg-brand-blue-moderate-hover: var(--ax-brand-blue-300);
809
- --ax-bg-brand-blue-moderateA: var(--ax-brand-blue-200A);
810
- --ax-bg-brand-blue-moderate: var(--ax-brand-blue-200);
811
- --ax-bg-brand-blue-hoverA: var(--ax-brand-blue-200A);
812
- --ax-bg-brand-blue-hover: var(--ax-brand-blue-200);
813
- --ax-bg-brand-blue: var(--ax-brand-blue-100);
814
- --ax-bg-brand-beige-raised-hover: var(--ax-brand-beige-300);
815
- --ax-bg-brand-beige-raised: var(--ax-brand-beige-200);
816
- --ax-bg-brand-beige-strong-pressed: var(--ax-brand-beige-800);
817
- --ax-bg-brand-beige-strong-hover: var(--ax-brand-beige-700);
818
- --ax-bg-brand-beige-strong: var(--ax-brand-beige-600);
819
- --ax-bg-brand-beige-moderate-pressedA: var(--ax-brand-beige-400A);
820
- --ax-bg-brand-beige-moderate-pressed: var(--ax-brand-beige-400);
821
- --ax-bg-brand-beige-moderate-hoverA: var(--ax-brand-beige-300A);
822
- --ax-bg-brand-beige-moderate-hover: var(--ax-brand-beige-300);
823
- --ax-bg-brand-beige-moderateA: var(--ax-brand-beige-200A);
824
- --ax-bg-brand-beige-moderate: var(--ax-brand-beige-200);
825
- --ax-bg-brand-beige-hoverA: var(--ax-brand-beige-200A);
826
- --ax-bg-brand-beige-hover: var(--ax-brand-beige-200);
827
- --ax-bg-brand-beige: var(--ax-brand-beige-100);
828
- --ax-bg-brand-magenta-raised-hover: var(--ax-brand-magenta-300);
829
- --ax-bg-brand-magenta-raised: var(--ax-brand-magenta-200);
830
- --ax-bg-brand-magenta-strong-pressed: var(--ax-brand-magenta-800);
831
- --ax-bg-brand-magenta-strong-hover: var(--ax-brand-magenta-700);
832
- --ax-bg-brand-magenta-strong: var(--ax-brand-magenta-600);
833
- --ax-bg-brand-magenta-moderate-pressedA: var(--ax-brand-magenta-400A);
834
- --ax-bg-brand-magenta-moderate-pressed: var(--ax-brand-magenta-400);
835
- --ax-bg-brand-magenta-moderate-hoverA: var(--ax-brand-magenta-300A);
836
- --ax-bg-brand-magenta-moderate-hover: var(--ax-brand-magenta-300);
837
- --ax-bg-brand-magenta-moderateA: var(--ax-brand-magenta-200A);
838
- --ax-bg-brand-magenta-moderate: var(--ax-brand-magenta-200);
839
- --ax-bg-brand-magenta-hoverA: var(--ax-brand-magenta-200A);
840
- --ax-bg-brand-magenta-hover: var(--ax-brand-magenta-200);
841
- --ax-bg-brand-magenta: var(--ax-brand-magenta-100);
842
- --ax-bg-info-raised-hover: var(--ax-info-300);
843
- --ax-bg-info-raised: var(--ax-info-200);
733
+ --ax-text-accent-strong: var(--ax-accent-1000);
734
+ --ax-text-accent: var(--ax-accent-800);
735
+ --ax-bg-strong-pressed: var(--ax-neutral-900);
736
+ --ax-bg-strong-hover: var(--ax-neutral-800);
737
+ --ax-bg-strong: var(--ax-neutral-700);
738
+ --ax-bg-moderate-pressedA: var(--ax-neutral-400A);
739
+ --ax-bg-moderate-pressed: var(--ax-neutral-400);
740
+ --ax-bg-moderate-hoverA: var(--ax-neutral-300A);
741
+ --ax-bg-moderate-hover: var(--ax-neutral-300);
742
+ --ax-bg-moderateA: var(--ax-neutral-200A);
743
+ --ax-bg-moderate: var(--ax-neutral-200);
744
+ --ax-bg-hoverA: var(--ax-neutral-200A);
745
+ --ax-bg-hover: var(--ax-neutral-200);
746
+ --ax-bg-soft: var(--ax-neutral-100);
747
+ --ax-bg-raised: var(--ax-neutral-100);
748
+ --ax-bg-meta-2-strong-pressed: var(--ax-meta-2-800);
749
+ --ax-bg-meta-2-strong-hover: var(--ax-meta-2-700);
750
+ --ax-bg-meta-2-strong: var(--ax-meta-2-600);
751
+ --ax-bg-meta-2-moderate-pressedA: var(--ax-meta-2-400A);
752
+ --ax-bg-meta-2-moderate-pressed: var(--ax-meta-2-400);
753
+ --ax-bg-meta-2-moderate-hoverA: var(--ax-meta-2-300A);
754
+ --ax-bg-meta-2-moderate-hover: var(--ax-meta-2-300);
755
+ --ax-bg-meta-2-moderateA: var(--ax-meta-2-200A);
756
+ --ax-bg-meta-2-moderate: var(--ax-meta-2-200);
757
+ --ax-bg-meta-2-hoverA: var(--ax-meta-2-200A);
758
+ --ax-bg-meta-2-hover: var(--ax-meta-2-200);
759
+ --ax-bg-meta-2-soft: var(--ax-meta-2-100);
760
+ --ax-bg-meta-1-strong-pressed: var(--ax-meta-1-800);
761
+ --ax-bg-meta-1-strong-hover: var(--ax-meta-1-700);
762
+ --ax-bg-meta-1-strong: var(--ax-meta-1-600);
763
+ --ax-bg-meta-1-moderate-pressedA: var(--ax-meta-1-400A);
764
+ --ax-bg-meta-1-moderate-pressed: var(--ax-meta-1-400);
765
+ --ax-bg-meta-1-moderate-hoverA: var(--ax-meta-1-300A);
766
+ --ax-bg-meta-1-moderate-hover: var(--ax-meta-1-300);
767
+ --ax-bg-meta-1-moderateA: var(--ax-meta-1-200A);
768
+ --ax-bg-meta-1-moderate: var(--ax-meta-1-200);
769
+ --ax-bg-meta-1-hoverA: var(--ax-meta-1-200A);
770
+ --ax-bg-meta-1-hover: var(--ax-meta-1-200);
771
+ --ax-bg-meta-1-soft: var(--ax-meta-1-100);
772
+ --ax-bg-brand-3-strong-pressed: var(--ax-brand-3-800);
773
+ --ax-bg-brand-3-strong-hover: var(--ax-brand-3-700);
774
+ --ax-bg-brand-3-strong: var(--ax-brand-3-600);
775
+ --ax-bg-brand-3-moderate-pressedA: var(--ax-brand-3-400A);
776
+ --ax-bg-brand-3-moderate-pressed: var(--ax-brand-3-400);
777
+ --ax-bg-brand-3-moderate-hoverA: var(--ax-brand-3-300A);
778
+ --ax-bg-brand-3-moderate-hover: var(--ax-brand-3-300);
779
+ --ax-bg-brand-3-moderateA: var(--ax-brand-3-200A);
780
+ --ax-bg-brand-3-moderate: var(--ax-brand-3-200);
781
+ --ax-bg-brand-3-hoverA: var(--ax-brand-3-200A);
782
+ --ax-bg-brand-3-hover: var(--ax-brand-3-200);
783
+ --ax-bg-brand-3-soft: var(--ax-brand-3-100);
784
+ --ax-bg-brand-2-strong-pressed: var(--ax-brand-2-800);
785
+ --ax-bg-brand-2-strong-hover: var(--ax-brand-2-700);
786
+ --ax-bg-brand-2-strong: var(--ax-brand-2-600);
787
+ --ax-bg-brand-2-moderate-pressedA: var(--ax-brand-2-400A);
788
+ --ax-bg-brand-2-moderate-pressed: var(--ax-brand-2-400);
789
+ --ax-bg-brand-2-moderate-hoverA: var(--ax-brand-2-300A);
790
+ --ax-bg-brand-2-moderate-hover: var(--ax-brand-2-300);
791
+ --ax-bg-brand-2-moderateA: var(--ax-brand-2-200A);
792
+ --ax-bg-brand-2-moderate: var(--ax-brand-2-200);
793
+ --ax-bg-brand-2-hoverA: var(--ax-brand-2-200A);
794
+ --ax-bg-brand-2-hover: var(--ax-brand-2-200);
795
+ --ax-bg-brand-2-soft: var(--ax-brand-2-100);
796
+ --ax-bg-brand-1-strong-pressed: var(--ax-brand-1-800);
797
+ --ax-bg-brand-1-strong-hover: var(--ax-brand-1-700);
798
+ --ax-bg-brand-1-strong: var(--ax-brand-1-600);
799
+ --ax-bg-brand-1-moderate-pressedA: var(--ax-brand-1-400A);
800
+ --ax-bg-brand-1-moderate-pressed: var(--ax-brand-1-400);
801
+ --ax-bg-brand-1-moderate-hoverA: var(--ax-brand-1-300A);
802
+ --ax-bg-brand-1-moderate-hover: var(--ax-brand-1-300);
803
+ --ax-bg-brand-1-moderateA: var(--ax-brand-1-200A);
804
+ --ax-bg-brand-1-moderate: var(--ax-brand-1-200);
805
+ --ax-bg-brand-1-hoverA: var(--ax-brand-1-200A);
806
+ --ax-bg-brand-1-hover: var(--ax-brand-1-200);
807
+ --ax-bg-brand-1-soft: var(--ax-brand-1-100);
844
808
  --ax-bg-info-strong-pressed: var(--ax-info-800);
845
809
  --ax-bg-info-strong-hover: var(--ax-info-700);
846
810
  --ax-bg-info-strong: var(--ax-info-600);
@@ -852,9 +816,7 @@
852
816
  --ax-bg-info-moderate: var(--ax-info-200);
853
817
  --ax-bg-info-hoverA: var(--ax-info-200A);
854
818
  --ax-bg-info-hover: var(--ax-info-200);
855
- --ax-bg-info: var(--ax-info-100);
856
- --ax-bg-danger-raised-hover: var(--ax-danger-300);
857
- --ax-bg-danger-raised: var(--ax-danger-200);
819
+ --ax-bg-info-soft: var(--ax-info-100);
858
820
  --ax-bg-danger-strong-pressed: var(--ax-danger-800);
859
821
  --ax-bg-danger-strong-hover: var(--ax-danger-700);
860
822
  --ax-bg-danger-strong: var(--ax-danger-600);
@@ -866,9 +828,7 @@
866
828
  --ax-bg-danger-moderate: var(--ax-danger-200);
867
829
  --ax-bg-danger-hoverA: var(--ax-danger-200A);
868
830
  --ax-bg-danger-hover: var(--ax-danger-200);
869
- --ax-bg-danger: var(--ax-danger-100);
870
- --ax-bg-warning-raised-hover: var(--ax-warning-300);
871
- --ax-bg-warning-raised: var(--ax-warning-200);
831
+ --ax-bg-danger-soft: var(--ax-danger-100);
872
832
  --ax-bg-warning-strong-pressed: var(--ax-warning-800);
873
833
  --ax-bg-warning-strong-hover: var(--ax-warning-700);
874
834
  --ax-bg-warning-strong: var(--ax-warning-600);
@@ -880,9 +840,7 @@
880
840
  --ax-bg-warning-moderate: var(--ax-warning-200);
881
841
  --ax-bg-warning-hoverA: var(--ax-warning-200A);
882
842
  --ax-bg-warning-hover: var(--ax-warning-200);
883
- --ax-bg-warning: var(--ax-warning-100);
884
- --ax-bg-success-raised-hover: var(--ax-success-300);
885
- --ax-bg-success-raised: var(--ax-success-200);
843
+ --ax-bg-warning-soft: var(--ax-warning-100);
886
844
  --ax-bg-success-strong-pressed: var(--ax-success-800);
887
845
  --ax-bg-success-strong-hover: var(--ax-success-700);
888
846
  --ax-bg-success-strong: var(--ax-success-600);
@@ -894,9 +852,7 @@
894
852
  --ax-bg-success-moderate: var(--ax-success-200);
895
853
  --ax-bg-success-hoverA: var(--ax-success-200A);
896
854
  --ax-bg-success-hover: var(--ax-success-200);
897
- --ax-bg-success: var(--ax-success-100);
898
- --ax-bg-accent-raised-hover: var(--ax-accent-300);
899
- --ax-bg-accent-raised: var(--ax-accent-200);
855
+ --ax-bg-success-soft: var(--ax-success-100);
900
856
  --ax-bg-accent-strong-pressed: var(--ax-accent-800);
901
857
  --ax-bg-accent-strong-hover: var(--ax-accent-700);
902
858
  --ax-bg-accent-strong: var(--ax-accent-600);
@@ -908,25 +864,11 @@
908
864
  --ax-bg-accent-moderate: var(--ax-accent-200);
909
865
  --ax-bg-accent-hoverA: var(--ax-accent-200A);
910
866
  --ax-bg-accent-hover: var(--ax-accent-200);
911
- --ax-bg-accent: var(--ax-accent-100);
912
- --ax-bg-neutral-raised-hover: var(--ax-neutral-300);
913
- --ax-bg-neutral-raised: var(--ax-neutral-200);
914
- --ax-bg-neutral-strong-pressed: var(--ax-neutral-800);
915
- --ax-bg-neutral-strong-hover: var(--ax-neutral-700);
916
- --ax-bg-neutral-strong: var(--ax-neutral-600);
917
- --ax-bg-neutral-moderate-pressedA: var(--ax-neutral-400A);
918
- --ax-bg-neutral-moderate-pressed: var(--ax-neutral-400);
919
- --ax-bg-neutral-moderate-hoverA: var(--ax-neutral-300A);
920
- --ax-bg-neutral-moderate-hover: var(--ax-neutral-300);
921
- --ax-bg-neutral-moderateA: var(--ax-neutral-200A);
922
- --ax-bg-neutral-moderate: var(--ax-neutral-200);
923
- --ax-bg-neutral-hoverA: var(--ax-neutral-200A);
924
- --ax-bg-neutral-hover: var(--ax-neutral-200);
925
- --ax-bg-neutral: var(--ax-neutral-100);
867
+ --ax-bg-accent-soft: var(--ax-accent-100);
926
868
  }
927
869
 
928
870
  :root, :host {
929
- --ax-version: "7.9.1";
871
+ --ax-version: "7.10.0";
930
872
  --ax-font-weight-regular: 400;
931
873
  --ax-font-weight-bold: 600;
932
874
  --ax-font-size-small: .875rem;
@@ -965,27 +907,28 @@
965
907
  --ax-border-radius-large: 8px;
966
908
  --ax-border-radius-medium: 4px;
967
909
  --ax-border-radius-small: 2px;
968
- --ax-spacing-1-alt: .375rem;
969
- --ax-spacing-05: .125rem;
970
- --ax-spacing-32: 8rem;
971
- --ax-spacing-24: 6rem;
972
- --ax-spacing-20: 5rem;
973
- --ax-spacing-18: 4.5rem;
974
- --ax-spacing-16: 4rem;
975
- --ax-spacing-14: 3.5rem;
976
- --ax-spacing-12: 3rem;
977
- --ax-spacing-11: 2.75rem;
978
- --ax-spacing-10: 2.5rem;
979
- --ax-spacing-9: 2.25rem;
980
- --ax-spacing-8: 2rem;
981
- --ax-spacing-7: 1.75rem;
982
- --ax-spacing-6: 1.5rem;
983
- --ax-spacing-5: 1.25rem;
984
- --ax-spacing-4: 1rem;
985
- --ax-spacing-3: .75rem;
986
- --ax-spacing-2: .5rem;
987
- --ax-spacing-1: .25rem;
988
- --ax-spacing-0: 0;
910
+ --ax-space-128: 8rem;
911
+ --ax-space-96: 6rem;
912
+ --ax-space-80: 5rem;
913
+ --ax-space-72: 4.5rem;
914
+ --ax-space-64: 4rem;
915
+ --ax-space-56: 3.5rem;
916
+ --ax-space-48: 3rem;
917
+ --ax-space-44: 2.75rem;
918
+ --ax-space-40: 2.5rem;
919
+ --ax-space-36: 2.25rem;
920
+ --ax-space-32: 2rem;
921
+ --ax-space-28: 1.75rem;
922
+ --ax-space-24: 1.5rem;
923
+ --ax-space-20: 1.25rem;
924
+ --ax-space-16: 1rem;
925
+ --ax-space-12: .75rem;
926
+ --ax-space-8: .5rem;
927
+ --ax-space-6: .375rem;
928
+ --ax-space-4: .25rem;
929
+ --ax-space-2: .125rem;
930
+ --ax-space-1: .0625rem;
931
+ --ax-space-0: 0rem;
989
932
  }
990
933
  }
991
934
 
@@ -1213,7 +1156,7 @@
1213
1156
  }
1214
1157
 
1215
1158
  .navds-heading--xlarge.navds-typo--spacing {
1216
- margin-bottom: var(--ax-spacing-5);
1159
+ margin-bottom: var(--ax-space-20);
1217
1160
  }
1218
1161
 
1219
1162
  .navds-heading--large {
@@ -1223,7 +1166,7 @@
1223
1166
  }
1224
1167
 
1225
1168
  .navds-heading--large.navds-typo--spacing {
1226
- margin-bottom: var(--ax-spacing-4);
1169
+ margin-bottom: var(--ax-space-16);
1227
1170
  }
1228
1171
 
1229
1172
  @media (max-width: 480px) {
@@ -1234,7 +1177,7 @@
1234
1177
  }
1235
1178
 
1236
1179
  .navds-heading--xlarge.navds-typo--spacing {
1237
- margin-bottom: var(--ax-spacing-4);
1180
+ margin-bottom: var(--ax-space-16);
1238
1181
  }
1239
1182
 
1240
1183
  .navds-heading--large {
@@ -1244,7 +1187,7 @@
1244
1187
  }
1245
1188
 
1246
1189
  .navds-heading--large.navds-typo--spacing {
1247
- margin-bottom: var(--ax-spacing-3);
1190
+ margin-bottom: var(--ax-space-12);
1248
1191
  }
1249
1192
  }
1250
1193
 
@@ -1255,7 +1198,7 @@
1255
1198
  }
1256
1199
 
1257
1200
  .navds-heading--medium.navds-typo--spacing {
1258
- margin-bottom: var(--ax-spacing-3);
1201
+ margin-bottom: var(--ax-space-12);
1259
1202
  }
1260
1203
 
1261
1204
  .navds-heading--small {
@@ -1265,7 +1208,7 @@
1265
1208
  }
1266
1209
 
1267
1210
  .navds-heading--small.navds-typo--spacing {
1268
- margin-bottom: var(--ax-spacing-3);
1211
+ margin-bottom: var(--ax-space-12);
1269
1212
  }
1270
1213
 
1271
1214
  .navds-heading--xsmall {
@@ -1275,7 +1218,7 @@
1275
1218
  }
1276
1219
 
1277
1220
  .navds-heading--xsmall.navds-typo--spacing {
1278
- margin-bottom: var(--ax-spacing-3);
1221
+ margin-bottom: var(--ax-space-12);
1279
1222
  }
1280
1223
 
1281
1224
  .navds-ingress {
@@ -1287,7 +1230,7 @@
1287
1230
  }
1288
1231
 
1289
1232
  .navds-ingress.navds-typo--spacing {
1290
- margin-bottom: var(--ax-spacing-10);
1233
+ margin-bottom: var(--ax-space-40);
1291
1234
  }
1292
1235
 
1293
1236
  .navds-body-long {
@@ -1299,7 +1242,7 @@
1299
1242
  }
1300
1243
 
1301
1244
  .navds-body-long.navds-typo--spacing {
1302
- margin-bottom: var(--ax-spacing-7);
1245
+ margin-bottom: var(--ax-space-28);
1303
1246
  }
1304
1247
 
1305
1248
  .navds-body-long--large {
@@ -1309,7 +1252,7 @@
1309
1252
  }
1310
1253
 
1311
1254
  .navds-body-long--large.navds-typo--spacing {
1312
- margin-bottom: var(--ax-spacing-10);
1255
+ margin-bottom: var(--ax-space-40);
1313
1256
  }
1314
1257
 
1315
1258
  .navds-body-long--small {
@@ -1319,7 +1262,7 @@
1319
1262
  }
1320
1263
 
1321
1264
  .navds-body-long--small.navds-typo--spacing {
1322
- margin-bottom: var(--ax-spacing-6);
1265
+ margin-bottom: var(--ax-space-24);
1323
1266
  }
1324
1267
 
1325
1268
  .navds-body-short {
@@ -1331,7 +1274,7 @@
1331
1274
  }
1332
1275
 
1333
1276
  .navds-body-short.navds-typo--spacing {
1334
- margin-bottom: var(--ax-spacing-3);
1277
+ margin-bottom: var(--ax-space-12);
1335
1278
  }
1336
1279
 
1337
1280
  .navds-body-short--large {
@@ -1341,7 +1284,7 @@
1341
1284
  }
1342
1285
 
1343
1286
  .navds-body-short--large.navds-typo--spacing {
1344
- margin-bottom: var(--ax-spacing-4);
1287
+ margin-bottom: var(--ax-space-16);
1345
1288
  }
1346
1289
 
1347
1290
  .navds-body-short--small {
@@ -1351,7 +1294,7 @@
1351
1294
  }
1352
1295
 
1353
1296
  .navds-body-short--small.navds-typo--spacing {
1354
- margin-bottom: var(--ax-spacing-2);
1297
+ margin-bottom: var(--ax-space-8);
1355
1298
  }
1356
1299
 
1357
1300
  .navds-label {
@@ -1363,7 +1306,7 @@
1363
1306
  }
1364
1307
 
1365
1308
  .navds-label.navds-typo--spacing {
1366
- margin-bottom: var(--ax-spacing-3);
1309
+ margin-bottom: var(--ax-space-12);
1367
1310
  }
1368
1311
 
1369
1312
  .navds-label--small {
@@ -1373,7 +1316,7 @@
1373
1316
  }
1374
1317
 
1375
1318
  .navds-label--small.navds-typo--spacing {
1376
- margin-bottom: var(--ax-spacing-2);
1319
+ margin-bottom: var(--ax-space-8);
1377
1320
  }
1378
1321
 
1379
1322
  .navds-detail {
@@ -1384,7 +1327,7 @@
1384
1327
  }
1385
1328
 
1386
1329
  .navds-detail.navds-typo--spacing {
1387
- margin-bottom: var(--ax-spacing-2);
1330
+ margin-bottom: var(--ax-space-8);
1388
1331
  }
1389
1332
 
1390
1333
  .navds-detail.navds-typo--uppercase {
@@ -1396,7 +1339,7 @@
1396
1339
  }
1397
1340
 
1398
1341
  .navds-detail--small.navds-typo--spacing {
1399
- margin-bottom: var(--ax-spacing-2);
1342
+ margin-bottom: var(--ax-space-8);
1400
1343
  }
1401
1344
 
1402
1345
  .navds-error-message {
@@ -1404,7 +1347,7 @@
1404
1347
  }
1405
1348
 
1406
1349
  .navds-error-message.navds-error-message--show-icon {
1407
- gap: var(--ax-spacing-1);
1350
+ gap: var(--ax-space-4);
1408
1351
  display: flex;
1409
1352
  }
1410
1353
 
@@ -1459,12 +1402,12 @@
1459
1402
  --__axc-button-icon-margin: -4px;
1460
1403
  --__axc-button-border-color: transparent;
1461
1404
  --__axc-button-border-width: 2px;
1462
- padding: var(--ax-spacing-3) var(--ax-spacing-5);
1405
+ padding: var(--ax-space-12) var(--ax-space-20);
1463
1406
  border-radius: var(--ax-border-radius-medium);
1464
1407
  cursor: pointer;
1465
1408
  justify-content: center;
1466
1409
  align-items: center;
1467
- gap: var(--ax-spacing-2);
1410
+ gap: var(--ax-space-8);
1468
1411
  box-shadow: inset 0 0 0 var(--__axc-button-border-width) var(--__axc-button-border-color);
1469
1412
  background: none;
1470
1413
  border: none;
@@ -1473,36 +1416,37 @@
1473
1416
  }
1474
1417
 
1475
1418
  .navds-button:focus-visible {
1476
- outline: 2px solid var(--ax-border-focus);
1477
- outline-offset: 2px;
1419
+ outline: 3px solid var(--ax-border-focus);
1420
+ outline-offset: 3px;
1478
1421
  }
1479
1422
 
1480
1423
  .navds-button--small, .navds-button--xsmall {
1481
1424
  --__axc-button-icon-margin: -2px;
1482
- --__axc-button-icon-size: 1.25rem;
1483
1425
  }
1484
1426
 
1485
1427
  .navds-button--small {
1486
- padding: var(--ax-spacing-1) var(--ax-spacing-3);
1428
+ padding: var(--ax-space-4) var(--ax-space-12);
1429
+ gap: var(--ax-space-6);
1487
1430
  min-width: 2rem;
1488
1431
  min-height: 2rem;
1489
1432
  }
1490
1433
 
1491
1434
  .navds-button--xsmall {
1492
- padding: var(--ax-spacing-05) var(--ax-spacing-2);
1493
- gap: var(--ax-spacing-1);
1435
+ padding: var(--ax-space-2) var(--ax-space-8);
1436
+ gap: var(--ax-space-4);
1437
+ --__axc-button-icon-size: 1.25rem;
1494
1438
  }
1495
1439
 
1496
1440
  .navds-button--icon-only {
1497
- padding: var(--ax-spacing-3);
1441
+ padding: var(--ax-space-12);
1498
1442
  }
1499
1443
 
1500
1444
  .navds-button--icon-only.navds-button--small {
1501
- padding: var(--ax-spacing-1);
1445
+ padding: var(--ax-space-4);
1502
1446
  }
1503
1447
 
1504
1448
  .navds-button--icon-only.navds-button--xsmall {
1505
- padding: var(--ax-spacing-05);
1449
+ padding: var(--ax-space-2);
1506
1450
  }
1507
1451
 
1508
1452
  @supports not selector(:focus-visible) {
@@ -1557,20 +1501,20 @@
1557
1501
  }
1558
1502
 
1559
1503
  .navds-button--primary-neutral {
1560
- background-color: var(--ax-bg-neutral-strong);
1561
- color: var(--ax-text-neutral-contrast);
1504
+ background-color: var(--ax-bg-strong);
1505
+ color: var(--ax-text-contrast);
1562
1506
  }
1563
1507
 
1564
1508
  .navds-button--primary-neutral:hover {
1565
- background-color: var(--ax-bg-neutral-strong-hover);
1509
+ background-color: var(--ax-bg-strong-hover);
1566
1510
  }
1567
1511
 
1568
1512
  .navds-button--primary-neutral:active {
1569
- background-color: var(--ax-bg-neutral-strong-pressed);
1513
+ background-color: var(--ax-bg-strong-pressed);
1570
1514
  }
1571
1515
 
1572
1516
  .navds-button--primary-neutral:is(:disabled, .navds-button--disabled) {
1573
- background-color: var(--ax-bg-neutral-strong);
1517
+ background-color: var(--ax-bg-strong);
1574
1518
  }
1575
1519
 
1576
1520
  .navds-button--secondary {
@@ -1582,7 +1526,6 @@
1582
1526
  .navds-button--secondary:hover {
1583
1527
  --__axc-button-border-color: var(--ax-border-accent-strong);
1584
1528
  background-color: var(--ax-bg-accent-moderate-hoverA);
1585
- color: var(--ax-text-accent-strong);
1586
1529
  }
1587
1530
 
1588
1531
  .navds-button--secondary:active {
@@ -1598,24 +1541,24 @@
1598
1541
  }
1599
1542
 
1600
1543
  .navds-button--secondary-neutral {
1601
- --__axc-button-border-color: var(--ax-border-default);
1544
+ --__axc-button-border-color: var(--ax-border-strong);
1602
1545
  color: var(--ax-text-default);
1603
1546
  background-color: rgba(0, 0, 0, 0);
1604
1547
  }
1605
1548
 
1606
1549
  .navds-button--secondary-neutral:hover {
1607
1550
  --__axc-button-border-color: var(--ax-border-strong);
1608
- background-color: var(--ax-bg-neutral-moderate-hoverA);
1551
+ background-color: var(--ax-bg-moderate-hoverA);
1609
1552
  }
1610
1553
 
1611
1554
  .navds-button--secondary-neutral:active {
1612
1555
  --__axc-button-border-color: transparent;
1613
- color: var(--ax-text-neutral-contrast);
1614
- background-color: var(--ax-bg-neutral-strong-pressed);
1556
+ color: var(--ax-text-contrast);
1557
+ background-color: var(--ax-bg-strong-pressed);
1615
1558
  }
1616
1559
 
1617
1560
  .navds-button--secondary-neutral:is(:disabled, .navds-button--disabled) {
1618
- --__axc-button-border-color: var(--ax-border-neutral);
1561
+ --__axc-button-border-color: var(--ax-border-strong);
1619
1562
  color: var(--ax-text-default);
1620
1563
  background-color: rgba(0, 0, 0, 0);
1621
1564
  }
@@ -1627,7 +1570,6 @@
1627
1570
 
1628
1571
  .navds-button--tertiary:hover {
1629
1572
  background-color: var(--ax-bg-accent-moderate-hoverA);
1630
- color: var(--ax-text-accent-strong);
1631
1573
  }
1632
1574
 
1633
1575
  .navds-button--tertiary:active {
@@ -1646,12 +1588,12 @@
1646
1588
  }
1647
1589
 
1648
1590
  .navds-button--tertiary-neutral:hover {
1649
- background-color: var(--ax-bg-neutral-moderate-hoverA);
1591
+ background-color: var(--ax-bg-moderate-hoverA);
1650
1592
  }
1651
1593
 
1652
1594
  .navds-button--tertiary-neutral:active {
1653
- background-color: var(--ax-bg-neutral-strong-pressed);
1654
- color: var(--ax-text-neutral-contrast);
1595
+ background-color: var(--ax-bg-strong-pressed);
1596
+ color: var(--ax-text-contrast);
1655
1597
  }
1656
1598
 
1657
1599
  .navds-button--tertiary-neutral:is(:disabled, .navds-button--disabled) {
@@ -1684,7 +1626,7 @@
1684
1626
  opacity: var(--ax-opacity-disabled);
1685
1627
  }
1686
1628
 
1687
- .navds-button .navds-loader {
1629
+ .navds-button > .navds-loader {
1688
1630
  position: absolute;
1689
1631
  }
1690
1632
 
@@ -1733,7 +1675,7 @@
1733
1675
  }
1734
1676
 
1735
1677
  .navds-chips {
1736
- gap: var(--ax-spacing-2);
1678
+ gap: var(--ax-space-8);
1737
1679
  flex-wrap: wrap;
1738
1680
  margin: 0;
1739
1681
  padding: 0;
@@ -1753,8 +1695,8 @@
1753
1695
  cursor: pointer;
1754
1696
  justify-content: center;
1755
1697
  align-items: center;
1756
- gap: var(--ax-spacing-05);
1757
- padding: 0 var(--ax-spacing-3);
1698
+ gap: var(--ax-space-2);
1699
+ padding: 0 var(--ax-space-12);
1758
1700
  border-radius: var(--ax-border-radius-full);
1759
1701
  min-height: 2rem;
1760
1702
  margin: 0;
@@ -1768,12 +1710,12 @@
1768
1710
  }
1769
1711
 
1770
1712
  .navds-chips--readonly .navds-chips__chip {
1771
- background-color: var(--ax-bg-neutral-moderateA);
1713
+ background-color: var(--ax-bg-moderateA);
1772
1714
  }
1773
1715
 
1774
1716
  .navds-chips--small .navds-chips__chip {
1775
1717
  min-height: 1.5rem;
1776
- padding: 0 var(--ax-spacing-2);
1718
+ padding: 0 var(--ax-space-8);
1777
1719
  }
1778
1720
 
1779
1721
  .navds-chips--small .navds-chips__toggle-icon {
@@ -1782,7 +1724,7 @@
1782
1724
  }
1783
1725
 
1784
1726
  .navds-chips--small .navds-chips__toggle--with-checkmark {
1785
- padding-left: var(--ax-spacing-1);
1727
+ padding-left: var(--ax-space-4);
1786
1728
  }
1787
1729
 
1788
1730
  .navds-chips--small .navds-chips__removable-icon {
@@ -1795,13 +1737,13 @@
1795
1737
  }
1796
1738
 
1797
1739
  .navds-chips--small .navds-chips--icon-right {
1798
- padding-right: var(--ax-spacing-05);
1740
+ padding-right: var(--ax-space-2);
1799
1741
  }
1800
1742
 
1801
1743
  .navds-chips__toggle--action {
1802
1744
  box-shadow: inset 0 0 0 1px var(--ax-border-accent-subtleA);
1803
1745
  background-color: var(--ax-bg-accent-moderate);
1804
- color: var(--ax-text-default);
1746
+ color: var(--ax-text-accent-strong);
1805
1747
  }
1806
1748
 
1807
1749
  .navds-chips__toggle--action:hover {
@@ -1819,27 +1761,27 @@
1819
1761
  }
1820
1762
 
1821
1763
  .navds-chips__toggle--neutral {
1822
- box-shadow: inset 0 0 0 1px var(--ax-border-neutral-subtleA);
1823
- background-color: var(--ax-bg-neutral-moderate);
1764
+ box-shadow: inset 0 0 0 1px var(--ax-border-subtleA);
1765
+ background-color: var(--ax-bg-moderate);
1824
1766
  color: var(--ax-text-default);
1825
1767
  }
1826
1768
 
1827
1769
  .navds-chips__toggle--neutral:hover {
1828
- background-color: var(--ax-bg-neutral-moderate-hover);
1770
+ background-color: var(--ax-bg-moderate-hover);
1829
1771
  }
1830
1772
 
1831
1773
  .navds-chips__toggle--neutral[data-pressed="true"] {
1832
1774
  box-shadow: none;
1833
- background-color: var(--ax-bg-neutral-strong-pressed);
1834
- color: var(--ax-text-neutral-contrast);
1775
+ background-color: var(--ax-bg-strong-pressed);
1776
+ color: var(--ax-text-contrast);
1835
1777
  }
1836
1778
 
1837
1779
  .navds-chips__toggle--neutral[data-pressed="true"]:hover {
1838
- background-color: var(--ax-bg-neutral-strong-hover);
1780
+ background-color: var(--ax-bg-strong-hover);
1839
1781
  }
1840
1782
 
1841
1783
  .navds-chips--medium .navds-chips__toggle--with-checkmark {
1842
- padding-left: var(--ax-spacing-1-alt);
1784
+ padding-left: var(--ax-space-6);
1843
1785
  }
1844
1786
 
1845
1787
  .navds-chips__removable {
@@ -1856,12 +1798,12 @@
1856
1798
  }
1857
1799
 
1858
1800
  .navds-chips__removable--neutral {
1859
- background: var(--ax-bg-neutral-strong-pressed);
1860
- color: var(--ax-text-neutral-contrast);
1801
+ background: var(--ax-bg-strong-pressed);
1802
+ color: var(--ax-text-contrast);
1861
1803
  }
1862
1804
 
1863
1805
  .navds-chips__removable--neutral:hover {
1864
- background: var(--ax-bg-neutral-strong-hover);
1806
+ background: var(--ax-bg-strong-hover);
1865
1807
  }
1866
1808
 
1867
1809
  .navds-chips__removable-icon {
@@ -1874,11 +1816,11 @@
1874
1816
  }
1875
1817
 
1876
1818
  .navds-chips--icon-left {
1877
- padding-left: var(--ax-spacing-1-alt);
1819
+ padding-left: var(--ax-space-6);
1878
1820
  }
1879
1821
 
1880
1822
  .navds-chips--icon-right {
1881
- padding-right: var(--ax-spacing-1-alt);
1823
+ padding-right: var(--ax-space-6);
1882
1824
  }
1883
1825
 
1884
1826
  @media (forced-colors: active) {
@@ -1915,7 +1857,7 @@
1915
1857
  }
1916
1858
 
1917
1859
  .navds-fieldset > :not(:first-child, :empty) {
1918
- margin-top: var(--ax-spacing-2);
1860
+ margin-top: var(--ax-space-8);
1919
1861
  }
1920
1862
 
1921
1863
  .navds-fieldset__description {
@@ -1950,16 +1892,16 @@
1950
1892
 
1951
1893
  .navds-dropzone__area {
1952
1894
  --__axc-dropzone-background: var(--ax-bg-input);
1953
- --__axc-dropzone-icon-padding: var(--ax-spacing-2);
1895
+ --__axc-dropzone-icon-padding: var(--ax-space-8);
1954
1896
  --__axc-dropzone-animation-length-long: .4s;
1955
1897
  --__axc-dropzone-animation-length-short: .25s;
1956
1898
  --__axc-dropzone-animation-ease-out: cubic-bezier(.3, 1, .3, 1);
1957
1899
  --__axc-dropzone-animation-over-under: cubic-bezier(.3, 1, .3, 1);
1958
1900
  align-items: center;
1959
- gap: var(--ax-spacing-4);
1901
+ gap: var(--ax-space-16);
1960
1902
  text-align: center;
1961
1903
  width: 100%;
1962
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
1904
+ padding: var(--ax-space-16) var(--ax-space-20);
1963
1905
  border: 1px dashed var(--ax-border-default);
1964
1906
  border-radius: var(--ax-border-radius-xlarge);
1965
1907
  background-color: var(--__axc-dropzone-background);
@@ -2033,13 +1975,13 @@
2033
1975
  }
2034
1976
 
2035
1977
  .navds-dropzone--error > .navds-dropzone__area {
2036
- outline: 2px solid var(--ax-border-danger);
1978
+ outline: 2px solid var(--ax-border-danger-strong);
2037
1979
  outline-offset: -1px;
2038
1980
  border-color: rgba(0, 0, 0, 0);
2039
1981
  }
2040
1982
 
2041
1983
  .navds-dropzone__area-release {
2042
- top: var(--ax-spacing-4);
1984
+ top: var(--ax-space-16);
2043
1985
  z-index: 1;
2044
1986
  pointer-events: none;
2045
1987
  transition: top var(--__axc-dropzone-animation-length-long) var(--__axc-dropzone-animation-over-under), transform var(--__axc-dropzone-animation-length-long) var(--__axc-dropzone-animation-over-under);
@@ -2050,7 +1992,7 @@
2050
1992
  .navds-dropzone__area-release__icon {
2051
1993
  padding: var(--__axc-dropzone-icon-padding);
2052
1994
  border-radius: var(--ax-border-radius-full);
2053
- background-color: var(--ax-bg-neutral-moderateA);
1995
+ background-color: var(--ax-bg-moderateA);
2054
1996
  transition: background-color .3s var(--__axc-dropzone-animation-ease-out), font-size .3s var(--__axc-dropzone-animation-ease-out);
2055
1997
  font-size: 1.5rem;
2056
1998
  display: grid;
@@ -2079,7 +2021,7 @@
2079
2021
  .navds-dropzone__area-disabled {
2080
2022
  color: var(--ax-text-subtle);
2081
2023
  align-items: center;
2082
- gap: var(--ax-spacing-2);
2024
+ gap: var(--ax-space-8);
2083
2025
  flex-direction: column;
2084
2026
  display: flex;
2085
2027
  }
@@ -2095,24 +2037,24 @@
2095
2037
  border: 1px solid var(--ax-border-subtleA);
2096
2038
  outline-offset: -1px;
2097
2039
  border-radius: var(--ax-border-radius-xlarge);
2098
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
2099
- gap: var(--ax-spacing-3);
2040
+ padding: var(--ax-space-12) var(--ax-space-16);
2041
+ gap: var(--ax-space-12);
2100
2042
  align-items: flex-start;
2101
2043
  transition: outline-color .25s cubic-bezier(0, .3, .15, 1);
2102
2044
  display: flex;
2103
2045
  }
2104
2046
 
2105
2047
  .navds-file-item--error > .navds-file-item__inner {
2106
- outline: 2px solid var(--ax-border-danger);
2048
+ outline: 2px solid var(--ax-border-danger-strong);
2107
2049
  }
2108
2050
 
2109
2051
  .navds-file-item__icon {
2110
- background-color: var(--ax-bg-neutral-moderateA);
2052
+ background-color: var(--ax-bg-moderateA);
2111
2053
  color: var(--ax-text-default);
2112
2054
  border-radius: var(--ax-border-radius-full);
2113
2055
  min-width: 2.5rem;
2114
2056
  min-height: 2.5rem;
2115
- margin-top: var(--ax-spacing-05);
2057
+ margin-top: var(--ax-space-2);
2116
2058
  place-content: center;
2117
2059
  transition: background-color .25s cubic-bezier(0, .3, .15, 1);
2118
2060
  display: grid;
@@ -2146,12 +2088,12 @@
2146
2088
  }
2147
2089
 
2148
2090
  .navds-file-item__error .navds-file-item__error {
2149
- padding-top: var(--ax-spacing-1);
2091
+ padding-top: var(--ax-space-4);
2150
2092
  grid-template-rows: 1fr;
2151
2093
  }
2152
2094
 
2153
2095
  .navds-file-item__error-content {
2154
- gap: var(--ax-spacing-1);
2096
+ gap: var(--ax-space-4);
2155
2097
  min-height: 0;
2156
2098
  display: flex;
2157
2099
  }
@@ -2164,7 +2106,7 @@
2164
2106
 
2165
2107
  .navds-form-field {
2166
2108
  justify-items: start;
2167
- gap: var(--ax-spacing-2);
2109
+ gap: var(--ax-space-8);
2168
2110
  display: grid;
2169
2111
  }
2170
2112
 
@@ -2191,8 +2133,8 @@
2191
2133
  }
2192
2134
 
2193
2135
  .navds-form-field__readonly-icon {
2194
- margin-top: var(--ax-spacing-05);
2195
- margin-right: var(--ax-spacing-1);
2136
+ margin-top: var(--ax-space-2);
2137
+ margin-right: var(--ax-space-4);
2196
2138
  flex-shrink: 0;
2197
2139
  align-self: flex-start;
2198
2140
  }
@@ -2205,7 +2147,7 @@
2205
2147
 
2206
2148
  .navds-error-summary {
2207
2149
  background-color: var(--ax-bg-default);
2208
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
2150
+ padding: var(--ax-space-16) var(--ax-space-20);
2209
2151
  border: 4px solid var(--ax-border-danger);
2210
2152
  border-radius: var(--ax-border-radius-xlarge);
2211
2153
  outline-offset: 2px;
@@ -2222,21 +2164,21 @@
2222
2164
  }
2223
2165
 
2224
2166
  .navds-error-summary--small {
2225
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
2167
+ padding: var(--ax-space-12) var(--ax-space-16);
2226
2168
  }
2227
2169
 
2228
2170
  .navds-error-summary--small .navds-error-summary__heading {
2229
- scroll-margin-top: var(--ax-spacing-4);
2171
+ scroll-margin-top: var(--ax-space-16);
2230
2172
  }
2231
2173
 
2232
2174
  .navds-error-summary--small > .navds-error-summary__list {
2233
- margin: var(--ax-spacing-2) 0;
2234
- gap: var(--ax-spacing-2);
2235
- padding-left: var(--ax-spacing-5);
2175
+ margin: var(--ax-space-8) 0;
2176
+ gap: var(--ax-space-8);
2177
+ padding-left: var(--ax-space-20);
2236
2178
  }
2237
2179
 
2238
2180
  .navds-error-summary__heading {
2239
- scroll-margin-top: var(--ax-spacing-6);
2181
+ scroll-margin-top: var(--ax-space-24);
2240
2182
  }
2241
2183
 
2242
2184
  .navds-error-summary__heading:focus {
@@ -2244,9 +2186,9 @@
2244
2186
  }
2245
2187
 
2246
2188
  .navds-error-summary__list {
2247
- margin: var(--ax-spacing-3) 0;
2248
- gap: var(--ax-spacing-3);
2249
- padding-left: var(--ax-spacing-6);
2189
+ margin: var(--ax-space-12) 0;
2190
+ gap: var(--ax-space-12);
2191
+ padding-left: var(--ax-space-24);
2250
2192
  list-style: inherit;
2251
2193
  flex-direction: column;
2252
2194
  display: flex;
@@ -2324,10 +2266,10 @@
2324
2266
  }
2325
2267
 
2326
2268
  .navds-checkbox__label, .navds-radio__label {
2327
- padding: var(--ax-spacing-3) 0;
2269
+ padding: var(--ax-space-12) 0;
2328
2270
  cursor: pointer;
2329
- gap: var(--ax-spacing-2);
2330
- --__axc-radio-checkbox-readonly-bg: var(--ax-bg-neutral-moderate);
2271
+ gap: var(--ax-space-8);
2272
+ --__axc-radio-checkbox-readonly-bg: var(--ax-bg-moderate);
2331
2273
  --__axc-radio-checkbox-readonly-border: var(--ax-border-subtle);
2332
2274
  display: flex;
2333
2275
  }
@@ -2360,7 +2302,7 @@
2360
2302
  }
2361
2303
 
2362
2304
  .navds-checkbox--small > .navds-checkbox__label, .navds-radio--small > .navds-radio__label {
2363
- padding: var(--ax-spacing-1-alt) 0;
2305
+ padding: var(--ax-space-6) 0;
2364
2306
  }
2365
2307
 
2366
2308
  .navds-checkbox--small > .navds-checkbox__label:before, .navds-radio--small > .navds-radio__label:before {
@@ -2375,7 +2317,7 @@
2375
2317
 
2376
2318
  .navds-checkbox__input:indeterminate + .navds-checkbox__label:after {
2377
2319
  content: "";
2378
- transform: translate(var(--ax-spacing-1-alt), -50%);
2320
+ transform: translate(var(--ax-space-6), -50%);
2379
2321
  background-color: var(--ax-bg-default);
2380
2322
  border-radius: 1px;
2381
2323
  flex-shrink: 0;
@@ -2406,7 +2348,7 @@
2406
2348
  .navds-checkbox__input:checked + .navds-checkbox__label > .navds-checkbox__icon {
2407
2349
  color: var(--ax-bg-default);
2408
2350
  height: 1.5rem;
2409
- transform: translate(var(--ax-spacing-1-alt));
2351
+ transform: translate(var(--ax-space-6));
2410
2352
  pointer-events: none;
2411
2353
  align-items: center;
2412
2354
  display: flex;
@@ -2436,7 +2378,7 @@
2436
2378
  }
2437
2379
 
2438
2380
  .navds-checkbox__input:hover:not(:disabled) + .navds-checkbox__label, .navds-radio__input:hover:not(:disabled) + .navds-radio__label {
2439
- color: var(--ax-text-accent-strong);
2381
+ color: var(--ax-text-accent);
2440
2382
  }
2441
2383
 
2442
2384
  .navds-checkbox__input:hover:not(:disabled, :checked, :indeterminate) + .navds-checkbox__label:before, .navds-radio__input:hover:not(:disabled, :checked) + .navds-radio__label:before {
@@ -2445,12 +2387,11 @@
2445
2387
  }
2446
2388
 
2447
2389
  .navds-checkbox--error > .navds-checkbox__input:not(:disabled, :checked, :indeterminate) + .navds-checkbox__label:before, .navds-radio--error > .navds-radio__input:not(:disabled, :checked) + .navds-radio__label:before {
2448
- border-color: var(--ax-border-danger);
2390
+ border-color: var(--ax-border-danger-strong);
2449
2391
  }
2450
2392
 
2451
2393
  .navds-checkbox--error > .navds-checkbox__input:not(:disabled, :checked, :indeterminate):hover + .navds-checkbox__label:before, .navds-radio--error > .navds-radio__input:not(:disabled, :checked):hover + .navds-radio__label:before {
2452
2394
  background-color: var(--ax-bg-danger-moderate-hoverA);
2453
- border-color: var(--ax-border-danger-strong);
2454
2395
  }
2455
2396
 
2456
2397
  .navds-checkbox--error > .navds-checkbox__input:is(:checked, :indeterminate):not(:disabled) + .navds-checkbox__label:before {
@@ -2497,8 +2438,8 @@
2497
2438
  }
2498
2439
 
2499
2440
  .navds-radio--readonly > .navds-radio__input:checked + .navds-radio__label:before {
2500
- background-color: var(--ax-bg-neutral-strong);
2501
- box-shadow: inset 0 0 0 2px var(--ax-border-subtle), inset 0 0 0 8px var(--ax-bg-neutral-moderate);
2441
+ background-color: var(--ax-bg-strong);
2442
+ box-shadow: inset 0 0 0 2px var(--ax-border-subtle), inset 0 0 0 8px var(--ax-bg-moderate);
2502
2443
  border-width: 0;
2503
2444
  }
2504
2445
 
@@ -2568,8 +2509,8 @@
2568
2509
  box-sizing: border-box;
2569
2510
  width: 100%;
2570
2511
  min-height: 3rem;
2571
- padding: var(--ax-spacing-2);
2572
- padding-right: var(--ax-spacing-10);
2512
+ padding: var(--ax-space-8);
2513
+ padding-right: var(--ax-space-40);
2573
2514
  display: inline-block;
2574
2515
  position: relative;
2575
2516
  }
@@ -2601,7 +2542,7 @@
2601
2542
  }
2602
2543
 
2603
2544
  .navds-select__chevron {
2604
- right: var(--ax-spacing-2);
2545
+ right: var(--ax-space-8);
2605
2546
  pointer-events: none;
2606
2547
  color: var(--ax-text-default);
2607
2548
  align-self: center;
@@ -2620,12 +2561,7 @@
2620
2561
  padding-block: 0;
2621
2562
  }
2622
2563
 
2623
- .navds-select--error > * select {
2624
- box-shadow: 0 0 0 1px var(--ax-border-danger);
2625
- border-color: var(--ax-border-danger);
2626
- }
2627
-
2628
- .navds-select--error > * select:hover, .navds-select--error > * select:focus {
2564
+ .navds-select--error > * select, .navds-select--error > * select:hover, .navds-select--error > * select:focus {
2629
2565
  box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
2630
2566
  border-color: var(--ax-border-danger-strong);
2631
2567
  }
@@ -2650,8 +2586,8 @@
2650
2586
  }
2651
2587
 
2652
2588
  .navds-select--readonly .navds-select__input {
2653
- background-color: var(--ax-bg-neutral-moderate);
2654
- border-color: var(--ax-border-neutral-subtleA);
2589
+ background-color: var(--ax-bg-moderate);
2590
+ border-color: var(--ax-border-subtleA);
2655
2591
  cursor: default;
2656
2592
  }
2657
2593
 
@@ -2709,11 +2645,11 @@
2709
2645
  }
2710
2646
 
2711
2647
  .navds-switch--small .navds-switch__content {
2712
- padding: calc(var(--ax-spacing-2) - var(--ax-spacing-05)) 0 calc(var(--ax-spacing-2) - var(--ax-spacing-05)) 3.25rem;
2648
+ padding: calc(var(--ax-space-8) - var(--ax-space-2)) 0 calc(var(--ax-space-8) - var(--ax-space-2)) 3.25rem;
2713
2649
  }
2714
2650
 
2715
2651
  .navds-switch--right.navds-switch--small .navds-switch__content {
2716
- padding: calc(var(--ax-spacing-2) - var(--ax-spacing-05)) 3.25rem calc(var(--ax-spacing-2) - var(--ax-spacing-05)) 0;
2652
+ padding: calc(var(--ax-space-8) - var(--ax-space-2)) 3.25rem calc(var(--ax-space-8) - var(--ax-space-2)) 0;
2717
2653
  }
2718
2654
 
2719
2655
  .navds-switch--with-description {
@@ -2721,7 +2657,7 @@
2721
2657
  }
2722
2658
 
2723
2659
  .navds-switch__input:hover ~ .navds-switch__label-wrapper, .navds-switch__label-wrapper:hover {
2724
- color: var(--ax-text-accent-strong);
2660
+ color: var(--ax-text-accent);
2725
2661
  }
2726
2662
 
2727
2663
  .navds-switch__input:disabled:hover ~ .navds-switch__label-wrapper {
@@ -2732,7 +2668,7 @@
2732
2668
  background-color: var(--ax-bg-input);
2733
2669
  width: 2.75rem;
2734
2670
  height: 1.5rem;
2735
- top: var(--ax-spacing-3);
2671
+ top: var(--ax-space-12);
2736
2672
  border-radius: var(--ax-border-radius-full);
2737
2673
  border: 2px solid var(--ax-border-default);
2738
2674
  transition-property: background-color, border-color;
@@ -2743,7 +2679,7 @@
2743
2679
  }
2744
2680
 
2745
2681
  .navds-switch--small > .navds-switch__track {
2746
- top: var(--ax-spacing-1);
2682
+ top: var(--ax-space-4);
2747
2683
  }
2748
2684
 
2749
2685
  .navds-switch__input:checked ~ .navds-switch__track {
@@ -2772,7 +2708,7 @@
2772
2708
  }
2773
2709
 
2774
2710
  .navds-switch__thumb {
2775
- background-color: var(--ax-bg-neutral-strong);
2711
+ background-color: var(--ax-bg-strong);
2776
2712
  border-radius: var(--ax-border-radius-full);
2777
2713
  justify-content: center;
2778
2714
  align-items: center;
@@ -2788,7 +2724,7 @@
2788
2724
 
2789
2725
  .navds-switch__input:checked ~ .navds-switch__track > .navds-switch__thumb {
2790
2726
  background-color: var(--ax-bg-raised);
2791
- color: var(--ax-text-accent-strong);
2727
+ color: var(--ax-text-accent);
2792
2728
  width: 1.25rem;
2793
2729
  height: 1.25rem;
2794
2730
  top: 0;
@@ -2839,8 +2775,8 @@
2839
2775
  }
2840
2776
 
2841
2777
  .navds-switch--readonly > .navds-switch__track, .navds-switch--readonly > .navds-switch__input:hover ~ .navds-switch__track, .navds-switch--readonly > .navds-switch__input:checked ~ .navds-switch__track, .navds-switch--readonly > .navds-switch__input:checked:hover ~ .navds-switch__track {
2842
- background-color: var(--ax-bg-neutral-moderate);
2843
- border-color: var(--ax-border-neutral-subtleA);
2778
+ background-color: var(--ax-bg-moderate);
2779
+ border-color: var(--ax-border-subtleA);
2844
2780
  }
2845
2781
 
2846
2782
  .navds-switch--readonly > .navds-switch__label-wrapper, .navds-switch--readonly > .navds-switch__input {
@@ -2856,12 +2792,12 @@
2856
2792
  }
2857
2793
 
2858
2794
  .navds-switch--readonly .navds-switch__thumb {
2859
- background-color: var(--ax-bg-neutral-strong);
2795
+ background-color: var(--ax-bg-strong);
2860
2796
  }
2861
2797
 
2862
2798
  .navds-switch--readonly > .navds-switch__input:checked ~ .navds-switch__track > .navds-switch__thumb {
2863
- background-color: var(--ax-bg-neutral-strong);
2864
- color: var(--ax-text-neutral-contrast);
2799
+ background-color: var(--ax-bg-strong);
2800
+ color: var(--ax-text-contrast);
2865
2801
  }
2866
2802
 
2867
2803
  @media (hover: hover) and (pointer: fine) {
@@ -2911,7 +2847,7 @@
2911
2847
 
2912
2848
  .navds-text-field__input {
2913
2849
  appearance: none;
2914
- padding: var(--ax-spacing-2);
2850
+ padding: var(--ax-space-8);
2915
2851
  background: var(--ax-bg-input);
2916
2852
  border-radius: var(--ax-border-radius-medium);
2917
2853
  border: 1px solid var(--ax-border-default);
@@ -2937,7 +2873,7 @@
2937
2873
  }
2938
2874
 
2939
2875
  .navds-text-field__input::placeholder {
2940
- color: var(--ax-text-neutral);
2876
+ color: var(--ax-text-subtle);
2941
2877
  }
2942
2878
 
2943
2879
  .navds-text-field__input[size] {
@@ -2945,18 +2881,18 @@
2945
2881
  }
2946
2882
 
2947
2883
  .navds-form-field--small .navds-text-field__input {
2948
- padding: 0 var(--ax-spacing-2);
2884
+ padding: 0 var(--ax-space-8);
2949
2885
  min-height: 2rem;
2950
2886
  }
2951
2887
 
2952
2888
  .navds-text-field--error .navds-text-field__input:not(:disabled) {
2953
- border-color: var(--ax-border-danger);
2954
- box-shadow: 0 0 0 1px var(--ax-border-danger);
2889
+ border-color: var(--ax-border-danger-strong);
2890
+ box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
2955
2891
  }
2956
2892
 
2957
2893
  .navds-text-field--readonly .navds-text-field__input {
2958
- background-color: var(--ax-bg-neutral-moderate);
2959
- border-color: var(--ax-border-neutral-subtleA);
2894
+ background-color: var(--ax-bg-moderate);
2895
+ border-color: var(--ax-border-subtleA);
2960
2896
  cursor: default;
2961
2897
  }
2962
2898
 
@@ -2986,7 +2922,7 @@
2986
2922
  .navds-textarea__input {
2987
2923
  height: var(--__axc-textarea-height);
2988
2924
  appearance: none;
2989
- padding: var(--ax-spacing-2);
2925
+ padding: var(--ax-space-8);
2990
2926
  background-color: var(--ax-bg-input);
2991
2927
  border-radius: var(--ax-border-radius-medium);
2992
2928
  border: 1px solid var(--ax-border-default);
@@ -3017,12 +2953,12 @@
3017
2953
  }
3018
2954
 
3019
2955
  .navds-form-field--small .navds-textarea__input {
3020
- padding: var(--ax-spacing-1-alt);
2956
+ padding: var(--ax-space-6);
3021
2957
  }
3022
2958
 
3023
2959
  .navds-textarea--readonly .navds-textarea__input {
3024
- background-color: var(--ax-bg-neutral-moderate);
3025
- border-color: var(--ax-border-neutral-subtleA);
2960
+ background-color: var(--ax-bg-moderate);
2961
+ border-color: var(--ax-border-subtleA);
3026
2962
  cursor: default;
3027
2963
  }
3028
2964
 
@@ -3071,8 +3007,8 @@
3071
3007
  }
3072
3008
 
3073
3009
  .navds-textarea--error .navds-textarea__input:not(:disabled) {
3074
- box-shadow: 0 0 0 1px var(--ax-border-danger);
3075
- border-color: var(--ax-border-danger);
3010
+ box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
3011
+ border-color: var(--ax-border-danger-strong);
3076
3012
  }
3077
3013
 
3078
3014
  @media (forced-colors: active) {
@@ -3113,7 +3049,7 @@
3113
3049
  }
3114
3050
 
3115
3051
  .navds-search__input {
3116
- padding-right: var(--ax-spacing-10);
3052
+ padding-right: var(--ax-space-40);
3117
3053
  }
3118
3054
 
3119
3055
  .navds-search__input:focus-visible {
@@ -3127,28 +3063,28 @@
3127
3063
  }
3128
3064
 
3129
3065
  .navds-search__input--simple {
3130
- padding-left: var(--ax-spacing-10);
3066
+ padding-left: var(--ax-space-40);
3131
3067
  }
3132
3068
 
3133
3069
  .navds-form-field--small .navds-search__input {
3134
- padding-right: var(--ax-spacing-7);
3070
+ padding-right: var(--ax-space-28);
3135
3071
  }
3136
3072
 
3137
3073
  .navds-form-field--small .navds-search__input--simple {
3138
- padding-left: var(--ax-spacing-7);
3074
+ padding-left: var(--ax-space-28);
3139
3075
  }
3140
3076
 
3141
3077
  .navds-form-field--small .navds-search__search-icon {
3142
- left: var(--ax-spacing-1);
3078
+ left: var(--ax-space-4);
3143
3079
  font-size: 1.25rem;
3144
3080
  }
3145
3081
 
3146
3082
  .navds-form-field--small .navds-search__button-clear {
3147
- right: var(--ax-spacing-1);
3083
+ right: var(--ax-space-4);
3148
3084
  }
3149
3085
 
3150
3086
  .navds-search__search-icon {
3151
- left: var(--ax-spacing-2);
3087
+ left: var(--ax-space-8);
3152
3088
  pointer-events: none;
3153
3089
  font-size: 1.5rem;
3154
3090
  position: absolute;
@@ -3161,7 +3097,7 @@
3161
3097
  }
3162
3098
 
3163
3099
  .navds-search__button-clear {
3164
- right: var(--ax-spacing-2);
3100
+ right: var(--ax-space-8);
3165
3101
  position: absolute;
3166
3102
  top: 50%;
3167
3103
  transform: translateY(-50%);
@@ -3196,12 +3132,12 @@
3196
3132
  }
3197
3133
 
3198
3134
  .navds-search--error .navds-search__input:not(:disabled) {
3199
- border-color: var(--ax-border-danger);
3200
- box-shadow: inset -2px 0 0 0 var(--ax-border-danger), inset 0 0 0 1px var(--ax-border-danger);
3135
+ border-color: var(--ax-border-danger-strong);
3136
+ box-shadow: inset -2px 0 0 0 var(--ax-border-danger-strong), inset 0 0 0 1px var(--ax-border-danger-strong);
3201
3137
  }
3202
3138
 
3203
3139
  .navds-search--error .navds-search__input:not(:disabled).navds-search__input--simple {
3204
- box-shadow: inset 0 0 0 1px var(--ax-border-danger);
3140
+ box-shadow: inset 0 0 0 1px var(--ax-border-danger-strong);
3205
3141
  }
3206
3142
 
3207
3143
  .navds-search__input:focus-visible, .navds-search__button-search:focus-visible {
@@ -3215,9 +3151,9 @@
3215
3151
 
3216
3152
  .navds-combobox__wrapper {
3217
3153
  --__axc-combobox-icon-size: 1.5rem;
3218
- --__axc-combobox-wrapper-inner-padding: var(--ax-spacing-2);
3219
- --__axc-combobox-list-item-padding-block: var(--ax-spacing-3);
3220
- --__axc-combobox-list-item-padding-inline: var(--ax-spacing-3);
3154
+ --__axc-combobox-wrapper-inner-padding: var(--ax-space-8);
3155
+ --__axc-combobox-list-item-padding-block: var(--ax-space-12);
3156
+ --__axc-combobox-list-item-padding-inline: var(--ax-space-12);
3221
3157
  --__axc-combobox-border-width: 1px;
3222
3158
  --__axc-combobox-input-height: 2rem;
3223
3159
  border-radius: var(--ax-border-radius-medium);
@@ -3228,14 +3164,14 @@
3228
3164
  }
3229
3165
 
3230
3166
  .navds-form-field:not(:is(.navds-combobox--disabled, .navds-combobox--readonly)) .navds-combobox__wrapper:hover {
3231
- border-color: var(--ax-border-focus);
3167
+ border-color: var(--ax-border-accent-strong);
3232
3168
  }
3233
3169
 
3234
3170
  .navds-form-field--small .navds-combobox__wrapper {
3235
3171
  --__axc-combobox-icon-size: 1.25rem;
3236
- --__axc-combobox-wrapper-inner-padding: var(--ax-spacing-1);
3237
- --__axc-combobox-list-item-padding-block: var(--ax-spacing-1-alt);
3238
- --__axc-combobox-list-item-padding-inline: var(--ax-spacing-2);
3172
+ --__axc-combobox-wrapper-inner-padding: var(--ax-space-4);
3173
+ --__axc-combobox-list-item-padding-block: var(--ax-space-6);
3174
+ --__axc-combobox-list-item-padding-inline: var(--ax-space-8);
3239
3175
  --__axc-combobox-input-height: 1.5rem;
3240
3176
  }
3241
3177
 
@@ -3243,6 +3179,10 @@
3243
3179
  opacity: var(--ax-opacity-disabled);
3244
3180
  }
3245
3181
 
3182
+ .navds-combobox--disabled .navds-combobox__wrapper:hover {
3183
+ border-color: var(--ax-border-default);
3184
+ }
3185
+
3246
3186
  .navds-combobox--disabled .navds-combobox__wrapper :hover {
3247
3187
  cursor: not-allowed;
3248
3188
  }
@@ -3256,11 +3196,11 @@
3256
3196
  }
3257
3197
 
3258
3198
  .navds-combobox--readonly .navds-combobox__selected-options .navds-chips__chip {
3259
- background-color: var(--ax-bg-neutral-moderateA);
3199
+ background-color: var(--ax-bg-moderateA);
3260
3200
  }
3261
3201
 
3262
3202
  .navds-combobox--readonly .navds-combobox__button-toggle-list {
3263
- color: var(--ax-bg-neutral-moderate);
3203
+ color: var(--ax-bg-moderate);
3264
3204
  }
3265
3205
 
3266
3206
  .navds-combobox--readonly .navds-combobox__wrapper {
@@ -3269,7 +3209,7 @@
3269
3209
  }
3270
3210
 
3271
3211
  .navds-combobox--readonly .navds-text-field__input, .navds-combobox--readonly .navds-combobox__input {
3272
- background-color: var(--ax-bg-neutral-moderate);
3212
+ background-color: var(--ax-bg-moderate);
3273
3213
  }
3274
3214
 
3275
3215
  .navds-combobox__button-toggle-list svg, .navds-combobox__list svg {
@@ -3283,9 +3223,9 @@
3283
3223
  }
3284
3224
 
3285
3225
  .navds-combobox__wrapper-inner:has(.navds-combobox__input:focus-visible) {
3286
- outline: 2px solid var(--ax-border-focus);
3287
- outline-offset: 2px;
3288
- border-color: var(--ax-border-focus);
3226
+ outline: 3px solid var(--ax-border-focus);
3227
+ outline-offset: 3px;
3228
+ border-color: var(--ax-border-accent-strong);
3289
3229
  }
3290
3230
 
3291
3231
  .navds-combobox__wrapper-inner:has(.navds-combobox__input:focus-visible).navds-combobox__wrapper-inner--virtually-unfocused {
@@ -3317,13 +3257,17 @@
3317
3257
  cursor: text;
3318
3258
  }
3319
3259
 
3260
+ .navds-combobox--disabled .navds-combobox__wrapper-inner:hover {
3261
+ border-color: var(--ax-border-default);
3262
+ }
3263
+
3320
3264
  .navds-combobox--error .navds-combobox__wrapper-inner {
3321
- border-color: var(--ax-border-danger);
3322
- box-shadow: 0 0 0 1px var(--ax-border-danger);
3265
+ border-color: var(--ax-border-danger-strong);
3266
+ box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
3323
3267
  }
3324
3268
 
3325
3269
  .navds-combobox--error .navds-combobox__wrapper-inner:has(.navds-combobox__input:focus-visible) {
3326
- border-color: var(--ax-border-danger);
3270
+ border-color: var(--ax-border-danger-strong);
3327
3271
  }
3328
3272
 
3329
3273
  .navds-combobox__selected-options {
@@ -3376,7 +3320,7 @@
3376
3320
  }
3377
3321
 
3378
3322
  .navds-combobox__selected-options > li:only-child > .navds-combobox__input {
3379
- margin-left: var(--ax-spacing-1);
3323
+ margin-left: var(--ax-space-4);
3380
3324
  }
3381
3325
 
3382
3326
  .navds-combobox__input--hide-caret {
@@ -3421,10 +3365,10 @@
3421
3365
 
3422
3366
  .navds-combobox__list {
3423
3367
  z-index: 10;
3424
- max-height: 290px;
3368
+ max-height: 316px;
3425
3369
  left: 0;
3426
3370
  right: 0;
3427
- top: calc(100% + var(--ax-spacing-2));
3371
+ top: calc(100% + var(--ax-space-8));
3428
3372
  border: 1px solid var(--ax-border-subtleA);
3429
3373
  border-radius: var(--ax-border-radius-large);
3430
3374
  background-color: var(--ax-bg-raised);
@@ -3449,8 +3393,8 @@
3449
3393
  padding-block: var(--__axc-combobox-list-item-padding-block);
3450
3394
  padding-inline: var(--__axc-combobox-list-item-padding-inline);
3451
3395
  border-radius: var(--ax-border-radius-medium);
3452
- margin-inline: var(--ax-spacing-2);
3453
- margin-block: var(--ax-spacing-1);
3396
+ margin-inline: var(--ax-space-8);
3397
+ margin-block: var(--ax-space-2);
3454
3398
  border: 0;
3455
3399
  justify-content: space-between;
3456
3400
  align-items: center;
@@ -3468,9 +3412,9 @@
3468
3412
  }
3469
3413
 
3470
3414
  .navds-combobox__list-item--max-selected {
3471
- background-color: var(--ax-bg-neutral-moderateA);
3472
- border-bottom: 1px solid var(--ax-border-neutral-subtle);
3473
- padding-block: var(--ax-spacing-2);
3415
+ background-color: var(--ax-bg-moderateA);
3416
+ border-bottom: 1px solid var(--ax-border-subtle);
3417
+ padding-block: var(--ax-space-8);
3474
3418
  line-height: var(--ax-font-line-height-large);
3475
3419
  border-radius: 0;
3476
3420
  margin: 0;
@@ -3482,7 +3426,7 @@
3482
3426
  gap: inherit;
3483
3427
  background-color: inherit;
3484
3428
  padding: 0;
3485
- padding-block: var(--ax-spacing-1);
3429
+ padding-block: var(--ax-space-4);
3486
3430
  align-items: stretch;
3487
3431
  margin: 0;
3488
3432
  list-style: none;
@@ -3491,7 +3435,6 @@
3491
3435
  .navds-combobox__list-item--focus {
3492
3436
  cursor: pointer;
3493
3437
  outline: 2px solid var(--ax-border-focus);
3494
- outline-offset: 2px;
3495
3438
  }
3496
3439
 
3497
3440
  .navds-combobox__list-item {
@@ -3506,11 +3449,12 @@
3506
3449
 
3507
3450
  .navds-combobox__list-item mark {
3508
3451
  font-weight: var(--ax-font-weight-bold);
3452
+ color: var(--ax-text-default);
3509
3453
  background-color: rgba(0, 0, 0, 0);
3510
3454
  }
3511
3455
 
3512
3456
  .navds-combobox__list-item svg {
3513
- color: var(--ax-text-accent);
3457
+ color: var(--ax-text-default);
3514
3458
  }
3515
3459
 
3516
3460
  .navds-combobox__list-item--selected {
@@ -3526,11 +3470,10 @@
3526
3470
  background: var(--ax-bg-accent-moderateA);
3527
3471
  cursor: pointer;
3528
3472
  margin: 0;
3529
- margin-block: calc(var(--ax-spacing-1) * -1);
3530
- padding-block: var(--ax-spacing-4);
3531
3473
  border-radius: 0;
3532
3474
  justify-content: flex-start;
3533
3475
  gap: .25rem;
3476
+ margin-block-start: calc(var(--ax-space-4) * -1);
3534
3477
  }
3535
3478
 
3536
3479
  .navds-combobox__list-item--new-option svg {
@@ -3538,6 +3481,7 @@
3538
3481
  }
3539
3482
 
3540
3483
  .navds-combobox__list-item--new-option:only-child {
3484
+ margin-block: calc(var(--ax-space-4) * -1);
3541
3485
  border: none;
3542
3486
  }
3543
3487
 
@@ -3562,7 +3506,7 @@
3562
3506
  }
3563
3507
 
3564
3508
  .navds-combobox__selected-options {
3565
- gap: var(--ax-spacing-1);
3509
+ gap: var(--ax-space-4);
3566
3510
  }
3567
3511
  }
3568
3512
 
@@ -3632,29 +3576,29 @@
3632
3576
  }
3633
3577
 
3634
3578
  .navds-form-summary {
3635
- border: 1px solid var(--ax-border-neutral-subtleA);
3579
+ border: 1px solid var(--ax-border-subtleA);
3636
3580
  border-radius: var(--ax-border-radius-xlarge);
3637
3581
  background: var(--ax-bg-raised);
3638
3582
  overflow: hidden;
3639
3583
  }
3640
3584
 
3641
3585
  .navds-form-summary__header {
3642
- background: var(--ax-bg-neutral-moderateA);
3643
- padding: var(--ax-spacing-4) var(--ax-spacing-6);
3586
+ background: var(--ax-bg-moderateA);
3587
+ padding: var(--ax-space-16) var(--ax-space-24);
3644
3588
  justify-content: space-between;
3645
- gap: 0 var(--ax-spacing-3);
3589
+ gap: 0 var(--ax-space-12);
3646
3590
  display: flex;
3647
3591
  }
3648
3592
 
3649
3593
  @media (max-width: 479px) {
3650
3594
  .navds-form-summary__header {
3651
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
3595
+ padding: var(--ax-space-12) var(--ax-space-16);
3652
3596
  flex-direction: column;
3653
3597
  }
3654
3598
  }
3655
3599
 
3656
3600
  .navds-form-summary__edit {
3657
- margin-top: var(--ax-spacing-1);
3601
+ margin-top: var(--ax-space-4);
3658
3602
  flex-shrink: 0;
3659
3603
  align-self: flex-start;
3660
3604
  }
@@ -3664,24 +3608,24 @@
3664
3608
  }
3665
3609
 
3666
3610
  .navds-form-summary__answers {
3667
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
3611
+ padding: var(--ax-space-16) var(--ax-space-20);
3668
3612
  margin: 0;
3669
3613
  }
3670
3614
 
3671
3615
  @media (max-width: 479px) {
3672
3616
  .navds-form-summary__answers {
3673
- padding: var(--ax-spacing-4);
3617
+ padding: var(--ax-space-16);
3674
3618
  }
3675
3619
  }
3676
3620
 
3677
3621
  .navds-form-summary__answer:not(:last-child) {
3678
- margin-bottom: var(--ax-spacing-4);
3679
- padding-bottom: var(--ax-spacing-4);
3622
+ margin-bottom: var(--ax-space-16);
3623
+ padding-bottom: var(--ax-space-16);
3680
3624
  border-bottom: 1px solid var(--ax-border-subtleA);
3681
3625
  }
3682
3626
 
3683
3627
  .navds-form-summary__answer:has(.navds-form-summary__answer) {
3684
- padding-bottom: var(--ax-spacing-6);
3628
+ padding-bottom: var(--ax-space-24);
3685
3629
  }
3686
3630
 
3687
3631
  .navds-form-summary__answer:has(.navds-form-summary__answer):last-child {
@@ -3690,22 +3634,22 @@
3690
3634
 
3691
3635
  @media (max-width: 479px) {
3692
3636
  .navds-form-summary__answer:not(:last-child) {
3693
- margin-bottom: var(--ax-spacing-3);
3694
- padding-bottom: var(--ax-spacing-3);
3637
+ margin-bottom: var(--ax-space-12);
3638
+ padding-bottom: var(--ax-space-12);
3695
3639
  }
3696
3640
 
3697
3641
  .navds-form-summary__answer:has(.navds-form-summary__answer) {
3698
- padding-bottom: var(--ax-spacing-5);
3642
+ padding-bottom: var(--ax-space-20);
3699
3643
  }
3700
3644
  }
3701
3645
 
3702
3646
  .navds-form-summary__value:first-of-type {
3703
- margin-top: var(--ax-spacing-1);
3647
+ margin-top: var(--ax-space-4);
3704
3648
  }
3705
3649
 
3706
3650
  .navds-form-summary__value .navds-form-summary__answers {
3707
- margin-top: var(--ax-spacing-2);
3708
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
3651
+ margin-top: var(--ax-space-8);
3652
+ padding: var(--ax-space-16) var(--ax-space-20);
3709
3653
  background: var(--ax-bg-info-moderateA);
3710
3654
  border-radius: var(--ax-border-radius-large);
3711
3655
  border: 1px solid var(--ax-border-info-subtleA);
@@ -3716,7 +3660,7 @@
3716
3660
  }
3717
3661
 
3718
3662
  .navds-form-progress__bar {
3719
- margin-bottom: var(--ax-spacing-2);
3663
+ margin-bottom: var(--ax-space-8);
3720
3664
  }
3721
3665
 
3722
3666
  .navds-form-progress__button:focus-visible {
@@ -3763,17 +3707,17 @@
3763
3707
  .navds-form-progress__stepper {
3764
3708
  border: 1px solid var(--ax-border-subtle);
3765
3709
  border-radius: var(--ax-border-radius-large);
3766
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
3767
- margin-top: var(--ax-spacing-1);
3710
+ padding: var(--ax-space-16) var(--ax-space-20);
3711
+ margin-top: var(--ax-space-4);
3768
3712
  background: var(--ax-bg-raised);
3769
3713
  }
3770
3714
 
3771
3715
  .navds-accordion__header {
3772
3716
  justify-content: flex-start;
3773
3717
  align-items: flex-start;
3774
- gap: var(--ax-spacing-3);
3718
+ gap: var(--ax-space-12);
3775
3719
  width: 100%;
3776
- padding: var(--ax-spacing-3);
3720
+ padding: var(--ax-space-12);
3777
3721
  text-align: left;
3778
3722
  cursor: pointer;
3779
3723
  border-radius: var(--ax-border-radius-large);
@@ -3798,7 +3742,6 @@
3798
3742
 
3799
3743
  .navds-accordion__header:hover {
3800
3744
  background-color: var(--ax-bg-accent-hoverA);
3801
- color: var(--ax-text-accent-strong);
3802
3745
  }
3803
3746
 
3804
3747
  .navds-accordion__header:hover:before, .navds-accordion__header:hover:after {
@@ -3862,7 +3805,7 @@
3862
3805
  background-color: var(--ax-bg-accent-moderateA);
3863
3806
  width: 22px;
3864
3807
  height: 22px;
3865
- color: var(--ax-text-accent-strong);
3808
+ color: var(--ax-text-accent);
3866
3809
  align-self: center;
3867
3810
  }
3868
3811
 
@@ -3879,7 +3822,7 @@
3879
3822
 
3880
3823
  .navds-accordion__content {
3881
3824
  --__acx-accordion-content-line-width: 2px;
3882
- padding-inline: var(--ax-spacing-6) var(--ax-spacing-3);
3825
+ padding-inline: var(--ax-space-24) var(--ax-space-12);
3883
3826
  max-height: 0;
3884
3827
  transition: all .25s cubic-bezier(.2, 0, 0, 1) allow-discrete;
3885
3828
  border-color: rgba(0, 0, 0, 0);
@@ -3908,13 +3851,13 @@
3908
3851
  }
3909
3852
 
3910
3853
  .navds-accordion--indent > .navds-accordion__item > .navds-accordion__content {
3911
- padding-inline: var(--ax-spacing-6) var(--ax-spacing-3);
3854
+ padding-inline: var(--ax-space-24) var(--ax-space-12);
3912
3855
  }
3913
3856
 
3914
3857
  .navds-accordion--indent > .navds-accordion__item .navds-accordion__content-inner {
3915
3858
  box-shadow: -2px 0 0 0 var(--ax-border-subtleA);
3916
- padding-block: var(--ax-spacing-2);
3917
- padding-inline: calc(var(--ax-spacing-5) + 2px) var(--ax-spacing-5);
3859
+ padding-block: var(--ax-space-8);
3860
+ padding-inline: calc(var(--ax-space-20) + 2px) var(--ax-space-20);
3918
3861
  }
3919
3862
 
3920
3863
  @media (forced-colors: active) {
@@ -3926,9 +3869,9 @@
3926
3869
  .navds-accordion__item[data-expanded="true"] > .navds-accordion__content {
3927
3870
  opacity: 1;
3928
3871
  max-height: fit-content;
3929
- padding-block: var(--ax-spacing-2);
3872
+ padding-block: var(--ax-space-8);
3930
3873
  border-color: var(--ax-border-subtleA);
3931
- padding-block-end: var(--ax-spacing-6);
3874
+ padding-block-end: var(--ax-space-24);
3932
3875
  display: block;
3933
3876
  overflow: visible;
3934
3877
  }
@@ -3943,8 +3886,8 @@
3943
3886
 
3944
3887
  .navds-alert {
3945
3888
  border-radius: var(--ax-border-radius-xlarge);
3946
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
3947
- gap: var(--ax-spacing-3);
3889
+ padding: var(--ax-space-16) var(--ax-space-20);
3890
+ gap: var(--ax-space-12);
3948
3891
  border: 1px solid;
3949
3892
  align-items: center;
3950
3893
  display: flex;
@@ -3970,8 +3913,8 @@
3970
3913
  }
3971
3914
 
3972
3915
  .navds-alert--small {
3973
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
3974
- gap: var(--ax-spacing-2);
3916
+ padding: var(--ax-space-12) var(--ax-space-16);
3917
+ gap: var(--ax-space-8);
3975
3918
  }
3976
3919
 
3977
3920
  .navds-alert--small > .navds-alert__icon {
@@ -4034,7 +3977,7 @@
4034
3977
  }
4035
3978
 
4036
3979
  .navds-alert--close-button > .navds-alert__wrapper, .navds-alert--close-button > .navds-alert__icon {
4037
- margin-block-start: var(--ax-spacing-05);
3980
+ margin-block-start: var(--ax-space-2);
4038
3981
  }
4039
3982
 
4040
3983
  .navds-alert--close-button.navds-alert--small {
@@ -4042,12 +3985,12 @@
4042
3985
  }
4043
3986
 
4044
3987
  .navds-alert--close-button.navds-alert--small > .navds-alert__wrapper, .navds-alert--close-button.navds-alert--small > .navds-alert__icon {
4045
- margin-block-start: var(--ax-spacing-1);
3988
+ margin-block-start: var(--ax-space-4);
4046
3989
  }
4047
3990
 
4048
3991
  .navds-chat {
4049
3992
  align-items: flex-end;
4050
- gap: var(--ax-spacing-3);
3993
+ gap: var(--ax-space-12);
4051
3994
  max-width: 40.75rem;
4052
3995
  display: flex;
4053
3996
  }
@@ -4090,7 +4033,7 @@
4090
4033
  }
4091
4034
 
4092
4035
  .navds-chat__bubble-wrapper {
4093
- gap: var(--ax-spacing-3);
4036
+ gap: var(--ax-space-12);
4094
4037
  flex-direction: column;
4095
4038
  margin: 0;
4096
4039
  padding: 0;
@@ -4099,9 +4042,9 @@
4099
4042
  }
4100
4043
 
4101
4044
  .navds-chat__bubble {
4102
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
4045
+ padding: var(--ax-space-16) var(--ax-space-20);
4103
4046
  background-color: var(--ax-bg-raised);
4104
- gap: var(--ax-spacing-2);
4047
+ gap: var(--ax-space-8);
4105
4048
  border-radius: var(--ax-border-radius-xlarge);
4106
4049
  border-bottom-left-radius: var(--ax-border-radius-small);
4107
4050
  border: 1px solid var(--ax-border-subtleA);
@@ -4111,20 +4054,20 @@
4111
4054
  }
4112
4055
 
4113
4056
  .navds-chat--small .navds-chat__bubble {
4114
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
4057
+ padding: var(--ax-space-12) var(--ax-space-16);
4115
4058
  }
4116
4059
 
4117
4060
  .navds-chat--info .navds-chat__bubble, .navds-chat--info .navds-chat__avatar {
4118
- background-color: var(--ax-bg-info-raised);
4061
+ background-color: var(--ax-bg-info-moderate);
4119
4062
  }
4120
4063
 
4121
4064
  .navds-chat--neutral .navds-chat__bubble, .navds-chat--neutral .navds-chat__avatar {
4122
- background-color: var(--ax-bg-neutral-raised);
4065
+ background-color: var(--ax-bg-moderateA);
4123
4066
  }
4124
4067
 
4125
4068
  .navds-chat__top-text {
4126
4069
  color: var(--ax-text-default);
4127
- gap: var(--ax-spacing-2);
4070
+ gap: var(--ax-space-8);
4128
4071
  align-items: baseline;
4129
4072
  margin: 0;
4130
4073
  font-weight: normal;
@@ -4148,7 +4091,7 @@
4148
4091
  }
4149
4092
 
4150
4093
  .navds-copybutton {
4151
- --__axc-copybutton-padding: var(--ax-spacing-3) var(--ax-spacing-5) var(--ax-spacing-3) var(--ax-spacing-4);
4094
+ --__axc-copybutton-padding: var(--ax-space-12) var(--ax-space-20) var(--ax-space-12) var(--ax-space-16);
4152
4095
  cursor: pointer;
4153
4096
  border-radius: var(--ax-border-radius-medium);
4154
4097
  padding: var(--__axc-copybutton-padding);
@@ -4162,15 +4105,15 @@
4162
4105
  }
4163
4106
 
4164
4107
  .navds-copybutton.navds-copybutton--icon-only {
4165
- --__axc-copybutton-padding: var(--ax-spacing-3);
4108
+ --__axc-copybutton-padding: var(--ax-space-12);
4166
4109
  }
4167
4110
 
4168
4111
  .navds-copybutton.navds-copybutton--icon-right {
4169
- --__axc-copybutton-padding: var(--ax-spacing-3) var(--ax-spacing-4) var(--ax-spacing-3) var(--ax-spacing-5);
4112
+ --__axc-copybutton-padding: var(--ax-space-12) var(--ax-space-16) var(--ax-space-12) var(--ax-space-20);
4170
4113
  }
4171
4114
 
4172
4115
  .navds-copybutton:hover {
4173
- background-color: var(--ax-bg-neutral-moderate-hoverA);
4116
+ background-color: var(--ax-bg-moderate-hoverA);
4174
4117
  }
4175
4118
 
4176
4119
  .navds-copybutton:focus-visible {
@@ -4201,39 +4144,35 @@
4201
4144
  }
4202
4145
 
4203
4146
  .navds-copybutton--small {
4204
- --__axc-copybutton-padding: var(--ax-spacing-1) var(--ax-spacing-3) var(--ax-spacing-1) var(--ax-spacing-2);
4147
+ --__axc-copybutton-padding: var(--ax-space-4) var(--ax-space-12) var(--ax-space-4) var(--ax-space-8);
4205
4148
  min-width: 2rem;
4206
4149
  min-height: 2rem;
4207
4150
  }
4208
4151
 
4209
4152
  .navds-copybutton--small.navds-copybutton--icon-right {
4210
- --__axc-copybutton-padding: var(--ax-spacing-1) var(--ax-spacing-2) var(--ax-spacing-1) var(--ax-spacing-3);
4153
+ --__axc-copybutton-padding: var(--ax-space-4) var(--ax-space-8) var(--ax-space-4) var(--ax-space-12);
4211
4154
  }
4212
4155
 
4213
4156
  .navds-copybutton--small.navds-copybutton--icon-only {
4214
- --__axc-copybutton-padding: var(--ax-spacing-1);
4215
- }
4216
-
4217
- .navds-copybutton--small .navds-copybutton__icon {
4218
- font-size: 1.25rem;
4157
+ --__axc-copybutton-padding: var(--ax-space-4);
4219
4158
  }
4220
4159
 
4221
4160
  .navds-copybutton--small > .navds-copybutton__content {
4222
- gap: var(--ax-spacing-1-alt);
4161
+ gap: var(--ax-space-4);
4223
4162
  }
4224
4163
 
4225
4164
  .navds-copybutton--xsmall {
4226
- --__axc-copybutton-padding: var(--ax-spacing-05) var(--ax-spacing-2) var(--ax-spacing-05) var(--ax-spacing-1);
4165
+ --__axc-copybutton-padding: var(--ax-space-2) var(--ax-space-8) var(--ax-space-2) var(--ax-space-4);
4227
4166
  min-width: 1.5rem;
4228
4167
  min-height: 1.5rem;
4229
4168
  }
4230
4169
 
4231
4170
  .navds-copybutton--xsmall.navds-copybutton--icon-right {
4232
- --__axc-copybutton-padding: var(--ax-spacing-05) var(--ax-spacing-1) var(--ax-spacing-05) var(--ax-spacing-2);
4171
+ --__axc-copybutton-padding: var(--ax-space-2) var(--ax-space-4) var(--ax-space-2) var(--ax-space-8);
4233
4172
  }
4234
4173
 
4235
4174
  .navds-copybutton--xsmall.navds-copybutton--icon-only {
4236
- --__axc-copybutton-padding: var(--ax-spacing-05);
4175
+ --__axc-copybutton-padding: var(--ax-space-2);
4237
4176
  }
4238
4177
 
4239
4178
  .navds-copybutton--xsmall .navds-copybutton__icon {
@@ -4241,7 +4180,7 @@
4241
4180
  }
4242
4181
 
4243
4182
  .navds-copybutton--xsmall > .navds-copybutton__content {
4244
- gap: var(--ax-spacing-1);
4183
+ gap: var(--ax-space-2);
4245
4184
  }
4246
4185
 
4247
4186
  .navds-copybutton__icon {
@@ -4249,18 +4188,6 @@
4249
4188
  display: flex;
4250
4189
  }
4251
4190
 
4252
- .navds-copybutton__icon:first-of-type {
4253
- margin-left: -.25rem;
4254
- }
4255
-
4256
- .navds-copybutton__icon:last-of-type {
4257
- margin-right: -.25rem;
4258
- }
4259
-
4260
- .navds-copybutton__icon:only-child {
4261
- margin: 0;
4262
- }
4263
-
4264
4191
  .navds-copybutton--active .navds-copybutton__icon {
4265
4192
  animation: 2s cubic-bezier(.05, .7, .1, 1) akselCopyButtonIconAnimation;
4266
4193
  }
@@ -4291,14 +4218,6 @@
4291
4218
  color: var(--ax-text-success);
4292
4219
  }
4293
4220
 
4294
- .navds-copybutton--action.navds-copybutton--active:hover {
4295
- color: var(--ax-text-success-strong);
4296
- }
4297
-
4298
- .navds-copybutton--action:hover {
4299
- color: var(--ax-text-accent-strong);
4300
- }
4301
-
4302
4221
  .navds-copybutton--action:disabled {
4303
4222
  color: var(--ax-text-accent);
4304
4223
  }
@@ -4307,10 +4226,6 @@
4307
4226
  color: var(--ax-text-subtle);
4308
4227
  }
4309
4228
 
4310
- .navds-copybutton--neutral:hover, .navds-copybutton--neutral.navds-copybutton--active {
4311
- color: var(--ax-text-default);
4312
- }
4313
-
4314
4229
  .navds-copybutton--neutral:disabled {
4315
4230
  color: var(--ax-text-subtle);
4316
4231
  }
@@ -4318,17 +4233,17 @@
4318
4233
  .navds-copybutton__content {
4319
4234
  justify-content: center;
4320
4235
  align-items: center;
4321
- gap: var(--ax-spacing-2);
4236
+ gap: var(--ax-space-6);
4322
4237
  display: inline-flex;
4323
4238
  }
4324
4239
 
4325
4240
  .navds-date {
4326
- padding: var(--ax-spacing-4) var(--ax-spacing-3);
4241
+ padding: var(--ax-space-16) var(--ax-space-12);
4327
4242
  }
4328
4243
 
4329
4244
  .navds-date .rdp-day_range_middle.rdp-day_disabled {
4330
4245
  color: var(--ax-text-default);
4331
- background: var(--ax-bg-neutral-moderateA);
4246
+ background: var(--ax-bg-moderateA);
4332
4247
  }
4333
4248
 
4334
4249
  .navds-date .rdp-day_range_middle.rdp-day_selected {
@@ -4338,7 +4253,7 @@
4338
4253
  }
4339
4254
 
4340
4255
  .navds-date .rdp-month, .navds-date.rdp-month {
4341
- gap: var(--ax-spacing-5);
4256
+ gap: var(--ax-space-20);
4342
4257
  display: grid;
4343
4258
  }
4344
4259
 
@@ -4387,7 +4302,7 @@
4387
4302
 
4388
4303
  .navds-date .rdp-day_disabled {
4389
4304
  cursor: not-allowed;
4390
- background-color: var(--ax-bg-neutral-moderateA);
4305
+ background-color: var(--ax-bg-moderateA);
4391
4306
  color: var(--ax-text-subtle);
4392
4307
  text-decoration: line-through;
4393
4308
  }
@@ -4430,8 +4345,8 @@
4430
4345
  .navds-date__caption {
4431
4346
  justify-content: space-between;
4432
4347
  align-items: center;
4433
- gap: var(--ax-spacing-1);
4434
- padding-inline: var(--ax-spacing-1);
4348
+ gap: var(--ax-space-4);
4349
+ padding-inline: var(--ax-space-4);
4435
4350
  display: flex;
4436
4351
  }
4437
4352
 
@@ -4476,18 +4391,18 @@
4476
4391
  }
4477
4392
 
4478
4393
  .navds-date__field-input.navds-text-field__input {
4479
- padding-right: var(--ax-spacing-12);
4394
+ padding-right: var(--ax-space-48);
4480
4395
  }
4481
4396
 
4482
4397
  .navds-form-field--small .navds-date__field-input {
4483
- padding-right: var(--ax-spacing-8);
4398
+ padding-right: var(--ax-space-32);
4484
4399
  }
4485
4400
 
4486
4401
  .navds-date__field-button {
4487
4402
  color: var(--ax-text-default);
4488
4403
  cursor: pointer;
4489
4404
  border-radius: calc(var(--ax-border-radius-medium) - 1px);
4490
- padding: var(--ax-spacing-3);
4405
+ padding: var(--ax-space-12);
4491
4406
  background: none;
4492
4407
  border: none;
4493
4408
  border-start-start-radius: 0;
@@ -4506,7 +4421,7 @@
4506
4421
  }
4507
4422
 
4508
4423
  .navds-form-field--small .navds-date__field-button {
4509
- padding: var(--ax-spacing-1);
4424
+ padding: var(--ax-space-4);
4510
4425
  }
4511
4426
 
4512
4427
  .navds-form-field--disabled .navds-date__field-button {
@@ -4531,7 +4446,7 @@
4531
4446
 
4532
4447
  .navds-date__week-row {
4533
4448
  align-items: center;
4534
- gap: var(--ax-spacing-05);
4449
+ gap: var(--ax-space-2);
4535
4450
  display: flex;
4536
4451
  }
4537
4452
 
@@ -4545,7 +4460,7 @@
4545
4460
  }
4546
4461
 
4547
4462
  .navds-date__weeknumber:active .navds-date__weeknumber-number {
4548
- color: var(--ax-text-neutral-contrast);
4463
+ color: var(--ax-text-contrast);
4549
4464
  }
4550
4465
 
4551
4466
  .navds-date__week-wrapper {
@@ -4557,24 +4472,24 @@
4557
4472
  }
4558
4473
 
4559
4474
  .navds-date__modal-body {
4560
- padding: var(--ax-spacing-4);
4475
+ padding: var(--ax-space-16);
4561
4476
  align-items: flex-end;
4562
- gap: var(--ax-spacing-2);
4477
+ gap: var(--ax-space-8);
4563
4478
  flex-direction: column;
4564
4479
  display: flex;
4565
4480
  }
4566
4481
 
4567
4482
  @media (min-width: 480px) {
4568
4483
  .navds-date {
4569
- padding: var(--ax-spacing-5) var(--ax-spacing-4);
4484
+ padding: var(--ax-space-20) var(--ax-space-16);
4570
4485
  }
4571
4486
 
4572
4487
  .navds-date__modal-body {
4573
- padding: var(--ax-spacing-6);
4488
+ padding: var(--ax-space-24);
4574
4489
  }
4575
4490
 
4576
4491
  .navds-date__caption {
4577
- gap: var(--ax-spacing-2);
4492
+ gap: var(--ax-space-8);
4578
4493
  }
4579
4494
 
4580
4495
  .navds-date .rdp-button, .navds-date__caption-button {
@@ -4707,9 +4622,9 @@
4707
4622
  }
4708
4623
 
4709
4624
  .navds-action-menu__content > .navds-action-menu__content-inner {
4710
- --__axc-action-menu-content-p: var(--ax-spacing-2);
4711
- --__axc-action-menu-item-pr: var(--ax-spacing-2);
4712
- --__axc-action-menu-item-pl: var(--ax-spacing-2);
4625
+ --__axc-action-menu-content-p: var(--ax-space-8);
4626
+ --__axc-action-menu-item-pr: var(--ax-space-8);
4627
+ --__axc-action-menu-item-pl: var(--ax-space-8);
4713
4628
  --__axc-action-menu-item-height: 2rem;
4714
4629
  border-radius: var(--ax-border-radius-large);
4715
4630
  background-color: var(--ax-bg-raised);
@@ -4725,7 +4640,7 @@
4725
4640
 
4726
4641
  .navds-action-menu__item {
4727
4642
  align-items: center;
4728
- gap: var(--ax-spacing-2);
4643
+ gap: var(--ax-space-8);
4729
4644
  min-height: var(--__axc-action-menu-item-height);
4730
4645
  cursor: default;
4731
4646
  border-radius: var(--ax-border-radius-medium);
@@ -4756,15 +4671,15 @@
4756
4671
  }
4757
4672
 
4758
4673
  .navds-action-menu__item--has-icon {
4759
- --__axc-action-menu-item-pl: var(--ax-spacing-6);
4674
+ --__axc-action-menu-item-pl: var(--ax-space-24);
4760
4675
  }
4761
4676
 
4762
4677
  .navds-action-menu__sub-trigger {
4763
- --__axc-action-menu-item-pr: var(--ax-spacing-05);
4678
+ --__axc-action-menu-item-pr: var(--ax-space-2);
4764
4679
  }
4765
4680
 
4766
4681
  .navds-action-menu__sub-trigger[data-state="open"] {
4767
- background-color: var(--ax-bg-neutral-moderate-pressed);
4682
+ background-color: var(--ax-bg-moderate-pressed);
4768
4683
  }
4769
4684
 
4770
4685
  .navds-action-menu__sub-trigger:focus {
@@ -4777,17 +4692,17 @@
4777
4692
 
4778
4693
  .navds-action-menu__item--danger:focus {
4779
4694
  background-color: var(--ax-bg-danger-moderate-hoverA);
4780
- color: var(--ax-text-danger-strong);
4695
+ color: var(--ax-text-danger);
4781
4696
  }
4782
4697
 
4783
4698
  .navds-action-menu__marker {
4784
4699
  align-items: center;
4785
- gap: var(--ax-spacing-1);
4700
+ gap: var(--ax-space-4);
4786
4701
  display: flex;
4787
4702
  }
4788
4703
 
4789
4704
  .navds-action-menu__marker--right {
4790
- padding-left: var(--ax-spacing-4);
4705
+ padding-left: var(--ax-space-16);
4791
4706
  margin-left: auto;
4792
4707
  }
4793
4708
 
@@ -4805,10 +4720,10 @@
4805
4720
  }
4806
4721
 
4807
4722
  .navds-action-menu__shortcut {
4808
- background-color: var(--ax-bg-neutral-moderateA);
4723
+ background-color: var(--ax-bg-moderateA);
4809
4724
  color: var(--ax-text-default);
4810
4725
  border-radius: var(--ax-border-radius-small);
4811
- padding: 0 var(--ax-spacing-1);
4726
+ padding: 0 var(--ax-space-4);
4812
4727
  min-width: 1.125rem;
4813
4728
  height: 1.125rem;
4814
4729
  line-height: 1;
@@ -4834,7 +4749,7 @@
4834
4749
 
4835
4750
  .navds-action-menu__divider {
4836
4751
  height: 1px;
4837
- margin-block: var(--ax-spacing-2);
4752
+ margin-block: var(--ax-space-8);
4838
4753
  background-color: var(--ax-border-subtleA);
4839
4754
  }
4840
4755
 
@@ -4857,8 +4772,8 @@
4857
4772
 
4858
4773
  .navds-expansioncard {
4859
4774
  --__axc-expansioncard-border-radius: calc(var(--ax-border-radius-xlarge) - 1px);
4860
- --__axc-expansioncard-padding-block: var(--ax-spacing-4);
4861
- --__axc-expansioncard-padding-inline: var(--ax-spacing-5);
4775
+ --__axc-expansioncard-padding-block: var(--ax-space-16);
4776
+ --__axc-expansioncard-padding-inline: var(--ax-space-20);
4862
4777
  border-radius: var(--ax-border-radius-xlarge);
4863
4778
  background-color: var(--ax-bg-raised);
4864
4779
  border: 1px solid var(--ax-border-default);
@@ -4871,12 +4786,12 @@
4871
4786
  }
4872
4787
 
4873
4788
  .navds-expansioncard--small {
4874
- --__axc-expansioncard-padding-inline: var(--ax-spacing-4);
4875
- --__axc-expansioncard-padding-block: var(--ax-spacing-3);
4789
+ --__axc-expansioncard-padding-inline: var(--ax-space-16);
4790
+ --__axc-expansioncard-padding-block: var(--ax-space-12);
4876
4791
  }
4877
4792
 
4878
4793
  .navds-expansioncard--small > .navds-expansioncard__header .navds-expansioncard__title--small {
4879
- margin-top: var(--ax-spacing-05);
4794
+ margin-top: var(--ax-space-2);
4880
4795
  }
4881
4796
 
4882
4797
  .navds-expansioncard--small :is(.navds-expansioncard__title--medium, .navds-expansioncard__title--large) {
@@ -4889,7 +4804,7 @@
4889
4804
  }
4890
4805
 
4891
4806
  .navds-expansioncard__header {
4892
- gap: var(--ax-spacing-4);
4807
+ gap: var(--ax-space-16);
4893
4808
  width: 100%;
4894
4809
  padding: var(--__axc-expansioncard-padding-block) var(--__axc-expansioncard-padding-inline);
4895
4810
  border-radius: var(--__axc-expansioncard-border-radius);
@@ -4900,7 +4815,7 @@
4900
4815
  }
4901
4816
 
4902
4817
  .navds-expansioncard__header:hover {
4903
- background-color: var(--ax-bg-neutral-raised-hover);
4818
+ background-color: var(--ax-bg-hover);
4904
4819
  }
4905
4820
 
4906
4821
  .navds-expansioncard__header[data-open="true"] {
@@ -4928,11 +4843,11 @@
4928
4843
  }
4929
4844
 
4930
4845
  .navds-expansioncard__title--medium {
4931
- margin-top: var(--ax-spacing-2);
4846
+ margin-top: var(--ax-space-8);
4932
4847
  }
4933
4848
 
4934
4849
  .navds-expansioncard__title--large {
4935
- margin-top: var(--ax-spacing-1);
4850
+ margin-top: var(--ax-space-4);
4936
4851
  }
4937
4852
 
4938
4853
  .navds-expansioncard__header-button {
@@ -4972,7 +4887,7 @@
4972
4887
  }
4973
4888
 
4974
4889
  .navds-expansioncard__header:hover > .navds-expansioncard__header-button {
4975
- background-color: var(--ax-bg-neutral-moderate-hoverA);
4890
+ background-color: var(--ax-bg-moderate-hoverA);
4976
4891
  }
4977
4892
 
4978
4893
  .navds-expansioncard__header-chevron {
@@ -5072,22 +4987,22 @@
5072
4987
  }
5073
4988
 
5074
4989
  .navds-guide-panel:is([data-poster="true"], [data-responsive="true"]) > .navds-guide-panel__content {
5075
- margin-top: var(--ax-spacing-5);
4990
+ margin-top: var(--ax-space-20);
5076
4991
  }
5077
4992
 
5078
4993
  .navds-guide-panel[data-poster="false"] > .navds-guide-panel__content {
5079
- margin-left: var(--ax-spacing-5);
4994
+ margin-left: var(--ax-space-20);
5080
4995
  }
5081
4996
 
5082
4997
  @media (min-width: 480px) {
5083
4998
  .navds-guide-panel[data-responsive="true"] > .navds-guide-panel__content {
5084
4999
  margin-top: 0;
5085
- margin-left: var(--ax-spacing-5);
5000
+ margin-left: var(--ax-space-20);
5086
5001
  }
5087
5002
  }
5088
5003
 
5089
5004
  .navds-guide-panel__content-inner {
5090
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
5005
+ padding: var(--ax-space-12) var(--ax-space-16);
5091
5006
  border-radius: var(--ax-border-radius-xlarge);
5092
5007
  background-color: var(--ax-bg-raised);
5093
5008
  height: 100%;
@@ -5100,7 +5015,7 @@
5100
5015
 
5101
5016
  @media (min-width: 480px) {
5102
5017
  .navds-guide-panel__content-inner {
5103
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
5018
+ padding: var(--ax-space-16) var(--ax-space-20);
5104
5019
  }
5105
5020
 
5106
5021
  .navds-guide-panel[data-responsive="true"] .navds-guide-panel__content-inner {
@@ -5115,20 +5030,20 @@
5115
5030
 
5116
5031
  .navds-guide-panel:is([data-poster="true"], [data-responsive="true"]) .navds-guide-panel__tail {
5117
5032
  left: 50%;
5118
- top: calc(var(--ax-spacing-4) * -1 - 2px);
5033
+ top: calc(var(--ax-space-16) * -1 - 2px);
5119
5034
  transform: translateX(-48%);
5120
5035
  }
5121
5036
 
5122
5037
  .navds-guide-panel[data-poster="false"] .navds-guide-panel__tail {
5123
5038
  top: calc(var(--__axc-guide-panel-guide-size) / 2);
5124
- left: calc(var(--ax-spacing-5) * -1 - 2px);
5039
+ left: calc(var(--ax-space-20) * -1 - 2px);
5125
5040
  transform: translateY(-48%)rotateZ(-90deg)scaleX(-1);
5126
5041
  }
5127
5042
 
5128
5043
  @media (min-width: 480px) {
5129
5044
  .navds-guide-panel[data-responsive="true"] .navds-guide-panel__tail {
5130
5045
  top: calc(var(--__axc-guide-panel-guide-size) / 2);
5131
- left: calc(var(--ax-spacing-5) * -1 - 2px);
5046
+ left: calc(var(--ax-space-20) * -1 - 2px);
5132
5047
  transform: translateY(-48%)rotateZ(-90deg)scaleX(-1);
5133
5048
  }
5134
5049
  }
@@ -5137,7 +5052,7 @@
5137
5052
  cursor: pointer;
5138
5053
  border-radius: var(--ax-border-radius-full);
5139
5054
  color: var(--ax-bg-accent-strong);
5140
- padding: calc(var(--ax-spacing-1) / 2);
5055
+ padding: calc(var(--ax-space-4) / 2);
5141
5056
  background-color: rgba(0, 0, 0, 0);
5142
5057
  border: 0;
5143
5058
  justify-content: center;
@@ -5153,7 +5068,7 @@
5153
5068
 
5154
5069
  .navds-help-text__popover.navds-popover {
5155
5070
  background-color: var(--ax-bg-info-moderate);
5156
- max-width: min(65ch, calc(100vw - var(--ax-spacing-6)));
5071
+ max-width: min(65ch, calc(100vw - var(--ax-space-24)));
5157
5072
  border-radius: var(--ax-border-radius-large);
5158
5073
  border: 1px solid var(--ax-border-info);
5159
5074
  }
@@ -5206,7 +5121,7 @@
5206
5121
  font-weight: var(--ax-font-weight-bold);
5207
5122
  text-align: left;
5208
5123
  padding-block: 0;
5209
- padding-inline: var(--ax-spacing-6) var(--ax-spacing-5);
5124
+ padding-inline: var(--ax-space-24) var(--ax-space-20);
5210
5125
  border: none;
5211
5126
  border-right: 1px solid var(--ax-border-subtleA);
5212
5127
  color: var(--ax-text-default);
@@ -5224,7 +5139,7 @@
5224
5139
  }
5225
5140
 
5226
5141
  .navds-internalheader__title:hover {
5227
- background: var(--ax-bg-neutral-moderate-hover);
5142
+ background: var(--ax-bg-moderate-hover);
5228
5143
  }
5229
5144
 
5230
5145
  .navds-internalheader__title:is(:hover, :active):not(button, a) {
@@ -5232,20 +5147,20 @@
5232
5147
  }
5233
5148
 
5234
5149
  .navds-internalheader__user {
5235
- padding: 0 var(--ax-spacing-5);
5150
+ padding: 0 var(--ax-space-20);
5236
5151
  border-left: 1px solid var(--ax-border-subtleA);
5237
5152
  align-items: center;
5238
5153
  display: flex;
5239
5154
  }
5240
5155
 
5241
5156
  .navds-internalheader__button {
5242
- padding: 0 var(--ax-spacing-3);
5157
+ padding: 0 var(--ax-space-12);
5243
5158
  font: inherit;
5244
5159
  cursor: pointer;
5245
5160
  text-align: left;
5246
5161
  justify-self: center;
5247
5162
  align-items: center;
5248
- gap: var(--ax-spacing-2);
5163
+ gap: var(--ax-space-8);
5249
5164
  border: none;
5250
5165
  border-left: 1px solid var(--ax-border-subtleA);
5251
5166
  color: var(--ax-text-default);
@@ -5257,7 +5172,7 @@
5257
5172
  }
5258
5173
 
5259
5174
  .navds-internalheader__button:hover {
5260
- background: var(--ax-bg-neutral-moderate-hover);
5175
+ background: var(--ax-bg-moderate-hover);
5261
5176
  }
5262
5177
 
5263
5178
  @media (forced-colors: active) {
@@ -5276,18 +5191,18 @@
5276
5191
  }
5277
5192
 
5278
5193
  :is(.navds-internalheader__title, .navds-internalheader__button):active {
5279
- background: var(--ax-bg-neutral-moderate-pressed);
5194
+ background: var(--ax-bg-moderate-pressed);
5280
5195
  }
5281
5196
 
5282
5197
  .navds-internalheader__user-button {
5283
- padding-left: var(--ax-spacing-5);
5284
- gap: var(--ax-spacing-4);
5198
+ padding-left: var(--ax-space-20);
5199
+ gap: var(--ax-space-16);
5285
5200
  }
5286
5201
 
5287
5202
  .navds-link {
5288
5203
  color: var(--ax-text-accent);
5289
5204
  align-items: center;
5290
- gap: var(--ax-spacing-05);
5205
+ gap: var(--ax-space-2);
5291
5206
  text-underline-offset: .1em;
5292
5207
  text-decoration: underline;
5293
5208
  text-decoration-thickness: .05em;
@@ -5404,7 +5319,7 @@
5404
5319
  }
5405
5320
 
5406
5321
  .navds-loader__background {
5407
- stroke: var(--ax-border-neutral-subtleA);
5322
+ stroke: var(--ax-border-subtleA);
5408
5323
  stroke-width: var(--__axc-loader-stroke-width);
5409
5324
  }
5410
5325
 
@@ -5516,7 +5431,7 @@
5516
5431
  }
5517
5432
 
5518
5433
  .navds-modal--small .navds-modal__header, .navds-modal--small .navds-modal__body, .navds-modal--small .navds-modal__footer {
5519
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
5434
+ padding: var(--ax-space-12) var(--ax-space-16);
5520
5435
  }
5521
5436
 
5522
5437
  @media (min-width: 480px) {
@@ -5552,17 +5467,17 @@
5552
5467
  }
5553
5468
 
5554
5469
  .navds-modal__button {
5555
- margin-left: var(--ax-spacing-4);
5470
+ margin-left: var(--ax-space-16);
5556
5471
  float: right;
5557
5472
  }
5558
5473
 
5559
5474
  .navds-modal__header {
5560
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
5475
+ padding: var(--ax-space-16) var(--ax-space-20);
5561
5476
  }
5562
5477
 
5563
5478
  .navds-modal__header-icon svg {
5564
5479
  vertical-align: -.25rem;
5565
- margin-right: var(--ax-spacing-1);
5480
+ margin-right: var(--ax-space-4);
5566
5481
  display: inline;
5567
5482
  }
5568
5483
 
@@ -5572,7 +5487,7 @@
5572
5487
  }
5573
5488
 
5574
5489
  .navds-modal__body {
5575
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
5490
+ padding: var(--ax-space-16) var(--ax-space-20);
5576
5491
  overscroll-behavior: contain;
5577
5492
  background: linear-gradient(var(--__axc-modal-bg) 30%, transparent) top, linear-gradient(transparent, var(--__axc-modal-bg) 60%) bottom, radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, .3), transparent) top, radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .3), transparent) bottom;
5578
5493
  background-repeat: no-repeat;
@@ -5583,12 +5498,12 @@
5583
5498
  }
5584
5499
 
5585
5500
  .navds-modal__header + .navds-modal__body {
5586
- padding-top: var(--ax-spacing-0);
5501
+ padding-top: var(--ax-space-0);
5587
5502
  }
5588
5503
 
5589
5504
  .navds-modal__footer {
5590
- gap: var(--ax-spacing-4);
5591
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
5505
+ gap: var(--ax-space-16);
5506
+ padding: var(--ax-space-16) var(--ax-space-20);
5592
5507
  flex-flow: row-reverse wrap;
5593
5508
  display: flex;
5594
5509
  }
@@ -5640,7 +5555,7 @@
5640
5555
  }
5641
5556
 
5642
5557
  .navds-pagination__list {
5643
- gap: var(--ax-spacing-3);
5558
+ gap: var(--ax-space-12);
5644
5559
  margin: 0;
5645
5560
  padding: 0;
5646
5561
  list-style: none;
@@ -5669,8 +5584,8 @@
5669
5584
  }
5670
5585
 
5671
5586
  .navds-pagination__item[data-selected="true"] {
5672
- background-color: var(--ax-bg-neutral-strong-pressed);
5673
- color: var(--ax-text-neutral-contrast);
5587
+ background-color: var(--ax-bg-strong-pressed);
5588
+ color: var(--ax-text-contrast);
5674
5589
  }
5675
5590
 
5676
5591
  .navds-pagination--invisible {
@@ -5683,11 +5598,11 @@
5683
5598
  box-shadow: var(--ax-shadow-dialog);
5684
5599
  border: 1px solid var(--ax-border-subtleA);
5685
5600
  border-radius: var(--ax-border-radius-xlarge);
5686
- max-width: calc(100vw - var(--ax-spacing-6));
5601
+ max-width: calc(100vw - var(--ax-space-24));
5687
5602
  }
5688
5603
 
5689
5604
  .navds-popover__content {
5690
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
5605
+ padding: var(--ax-space-16) var(--ax-space-20);
5691
5606
  }
5692
5607
 
5693
5608
  .navds-popover--hidden {
@@ -5703,7 +5618,7 @@
5703
5618
  --__axc-tag-text: ;
5704
5619
  --__axc-tag-text-strong: ;
5705
5620
  border-radius: var(--ax-border-radius-medium);
5706
- padding: var(--ax-spacing-05) var(--ax-spacing-2);
5621
+ padding: var(--ax-space-2) var(--ax-space-8);
5707
5622
  justify-content: center;
5708
5623
  align-items: center;
5709
5624
  min-height: 2rem;
@@ -5712,7 +5627,7 @@
5712
5627
  }
5713
5628
 
5714
5629
  .navds-tag:has(.navds-tag__icon--left) {
5715
- gap: var(--ax-spacing-05);
5630
+ gap: var(--ax-space-2);
5716
5631
  }
5717
5632
 
5718
5633
  .navds-tag--info, .navds-tag--alt3 {
@@ -5748,38 +5663,38 @@
5748
5663
  }
5749
5664
 
5750
5665
  .navds-tag--neutral {
5751
- --__axc-tag-border: var(--ax-border-neutral);
5752
- --__axc-tag-bg: var(--ax-bg-neutral-moderateA);
5753
- --__axc-tag-bg-strong: var(--ax-bg-neutral-strong);
5754
- --__axc-tag-text: var(--ax-text-neutral-strong);
5755
- --__axc-tag-text-strong: var(--ax-text-neutral-contrast);
5666
+ --__axc-tag-border: var(--ax-border-default);
5667
+ --__axc-tag-bg: var(--ax-bg-moderateA);
5668
+ --__axc-tag-bg-strong: var(--ax-bg-strong);
5669
+ --__axc-tag-text: var(--ax-text-default);
5670
+ --__axc-tag-text-strong: var(--ax-text-contrast);
5756
5671
  }
5757
5672
 
5758
- .navds-tag--meta-purple, .navds-tag--alt1 {
5759
- --__axc-tag-border: var(--ax-border-meta-purple);
5760
- --__axc-tag-bg: var(--ax-bg-meta-purple-moderateA);
5761
- --__axc-tag-bg-strong: var(--ax-bg-meta-purple-strong);
5762
- --__axc-tag-text: var(--ax-text-meta-purple-strong);
5763
- --__axc-tag-text-strong: var(--ax-text-meta-purple-contrast);
5673
+ .navds-tag--meta-1, .navds-tag--alt1 {
5674
+ --__axc-tag-border: var(--ax-border-meta-1);
5675
+ --__axc-tag-bg: var(--ax-bg-meta-1-moderateA);
5676
+ --__axc-tag-bg-strong: var(--ax-bg-meta-1-strong);
5677
+ --__axc-tag-text: var(--ax-text-meta-1-strong);
5678
+ --__axc-tag-text-strong: var(--ax-text-meta-1-contrast);
5764
5679
  }
5765
5680
 
5766
- .navds-tag--meta-lime, .navds-tag--alt2 {
5767
- --__axc-tag-border: var(--ax-border-meta-lime);
5768
- --__axc-tag-bg: var(--ax-bg-meta-lime-moderateA);
5769
- --__axc-tag-bg-strong: var(--ax-bg-meta-lime-strong);
5770
- --__axc-tag-text: var(--ax-text-meta-lime-strong);
5771
- --__axc-tag-text-strong: var(--ax-text-meta-lime-contrast);
5681
+ .navds-tag--meta-2, .navds-tag--alt2 {
5682
+ --__axc-tag-border: var(--ax-border-meta-2);
5683
+ --__axc-tag-bg: var(--ax-bg-meta-2-moderateA);
5684
+ --__axc-tag-bg-strong: var(--ax-bg-meta-2-strong);
5685
+ --__axc-tag-text: var(--ax-text-meta-2-strong);
5686
+ --__axc-tag-text-strong: var(--ax-text-meta-2-contrast);
5772
5687
  }
5773
5688
 
5774
5689
  .navds-tag--small {
5775
5690
  min-height: 1.5rem;
5776
- padding: 0 var(--ax-spacing-1-alt);
5691
+ padding: 0 var(--ax-space-6);
5777
5692
  --__axc-tag-icon-size: 1.25rem;
5778
5693
  }
5779
5694
 
5780
5695
  .navds-tag--xsmall {
5781
5696
  min-height: 1.25rem;
5782
- padding: 0 var(--ax-spacing-1);
5697
+ padding: 0 var(--ax-space-4);
5783
5698
  --__axc-tag-icon-size: 1rem;
5784
5699
  --__axc-tag-icon-margin: -1px;
5785
5700
  }
@@ -5833,7 +5748,7 @@
5833
5748
  .navds-timeline__axislabels {
5834
5749
  box-sizing: content-box;
5835
5750
  height: 1rem;
5836
- margin-bottom: var(--ax-spacing-1);
5751
+ margin-bottom: var(--ax-space-4);
5837
5752
  grid-column: 2;
5838
5753
  position: relative;
5839
5754
  }
@@ -5841,9 +5756,9 @@
5841
5756
  .navds-timeline__row-label {
5842
5757
  white-space: nowrap;
5843
5758
  width: auto;
5844
- margin-right: var(--ax-spacing-4);
5759
+ margin-right: var(--ax-space-16);
5845
5760
  align-items: center;
5846
- gap: var(--ax-spacing-2);
5761
+ gap: var(--ax-space-8);
5847
5762
  grid-column: 1;
5848
5763
  min-height: 1.5rem;
5849
5764
  display: flex;
@@ -5860,8 +5775,8 @@
5860
5775
  }
5861
5776
 
5862
5777
  .navds-timeline__row {
5863
- background: var(--ax-bg-neutral);
5864
- margin: var(--ax-spacing-4) 0;
5778
+ background: var(--ax-bg-soft);
5779
+ margin: var(--ax-space-16) 0;
5865
5780
  grid-column: 2;
5866
5781
  display: flex;
5867
5782
  }
@@ -5908,7 +5823,7 @@
5908
5823
  }
5909
5824
 
5910
5825
  .navds-timeline__period--inner {
5911
- margin: 0 var(--ax-spacing-2);
5826
+ margin: 0 var(--ax-space-8);
5912
5827
  white-space: nowrap;
5913
5828
  text-overflow: clip;
5914
5829
  text-align: left;
@@ -5990,18 +5905,18 @@
5990
5905
  }
5991
5906
 
5992
5907
  .navds-timeline__period--neutral {
5993
- background: var(--ax-bg-neutral-moderate);
5994
- border: solid 1px var(--ax-border-neutral);
5995
- color: var(--ax-text-neutral-icon);
5908
+ background: var(--ax-bg-moderate);
5909
+ border: solid 1px var(--ax-border-default);
5910
+ color: var(--ax-text-icon);
5996
5911
  }
5997
5912
 
5998
5913
  .navds-timeline__period--neutral.navds-timeline__period--clickable:hover {
5999
- background: var(--ax-bg-neutral-moderate-hover);
5914
+ background: var(--ax-bg-moderate-hover);
6000
5915
  }
6001
5916
 
6002
5917
  .navds-timeline__period--neutral.navds-timeline__period--clickable.navds-timeline__period--selected {
6003
- background: var(--ax-bg-neutral-strong-pressed);
6004
- color: var(--ax-text-neutral-contrast);
5918
+ background: var(--ax-bg-strong-pressed);
5919
+ color: var(--ax-text-contrast);
6005
5920
  border: none;
6006
5921
  }
6007
5922
 
@@ -6037,7 +5952,7 @@
6037
5952
  box-shadow: inset 0 0 0 4px var(--ax-bg-danger-strong);
6038
5953
  z-index: 2;
6039
5954
  border-radius: var(--ax-border-radius-full);
6040
- padding: var(--ax-spacing-2);
5955
+ padding: var(--ax-space-8);
6041
5956
  border: none;
6042
5957
  position: relative;
6043
5958
  }
@@ -6071,7 +5986,7 @@
6071
5986
  }
6072
5987
 
6073
5988
  .navds-timeline__zoom {
6074
- margin-top: var(--ax-spacing-6);
5989
+ margin-top: var(--ax-space-24);
6075
5990
  float: right;
6076
5991
  list-style-type: none;
6077
5992
  display: flex;
@@ -6100,13 +6015,13 @@
6100
6015
  }
6101
6016
 
6102
6017
  .navds-timeline__zoom-button:not([aria-pressed="true"]):hover {
6103
- background: var(--ax-bg-neutral-moderate-hoverA);
6018
+ background: var(--ax-bg-moderate-hoverA);
6104
6019
  }
6105
6020
 
6106
6021
  .navds-timeline__zoom-button[aria-pressed="true"] {
6107
- background: var(--ax-bg-neutral-strong-pressed);
6108
- border-color: var(--ax-bg-neutral-strong-pressed);
6109
- color: var(--ax-text-neutral-contrast);
6022
+ background: var(--ax-bg-strong-pressed);
6023
+ border-color: var(--ax-bg-strong-pressed);
6024
+ color: var(--ax-text-contrast);
6110
6025
  }
6111
6026
 
6112
6027
  .navds-timeline__zoom li:focus-within {
@@ -6130,7 +6045,7 @@
6130
6045
  border: 1px solid;
6131
6046
  border-color: var(--ax-border-subtleA);
6132
6047
  border-radius: var(--ax-border-radius-large);
6133
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
6048
+ padding: var(--ax-space-16) var(--ax-space-20);
6134
6049
  }
6135
6050
 
6136
6051
  @media (forced-colors: active) {
@@ -6163,7 +6078,7 @@
6163
6078
  background-color: var(--ax-bg-raised);
6164
6079
  color: var(--ax-text-default);
6165
6080
  border-radius: var(--ax-border-radius-medium);
6166
- padding: 0 var(--ax-spacing-1-alt);
6081
+ padding: 0 var(--ax-space-6);
6167
6082
  text-align: center;
6168
6083
  border: 1px solid var(--ax-border-subtleA);
6169
6084
  box-shadow: var(--ax-shadow-dialog);
@@ -6241,17 +6156,17 @@
6241
6156
  }
6242
6157
 
6243
6158
  .navds-tooltip__keys {
6244
- padding-bottom: var(--ax-spacing-1);
6245
- gap: var(--ax-spacing-1);
6159
+ padding-bottom: var(--ax-space-4);
6160
+ gap: var(--ax-space-4);
6246
6161
  display: flex;
6247
6162
  }
6248
6163
 
6249
6164
  .navds-tooltip__key {
6250
6165
  font-family: var(--ax-font-family);
6251
6166
  color: var(--ax-text-default);
6252
- padding: 0 var(--ax-spacing-1);
6167
+ padding: 0 var(--ax-space-4);
6253
6168
  border-radius: var(--ax-border-radius-small);
6254
- background: var(--ax-bg-neutral-moderateA);
6169
+ background: var(--ax-bg-moderateA);
6255
6170
  justify-content: center;
6256
6171
  align-items: center;
6257
6172
  min-width: 1.125rem;
@@ -6267,7 +6182,7 @@
6267
6182
 
6268
6183
  .navds-toggle-group__wrapper {
6269
6184
  justify-items: start;
6270
- gap: var(--ax-spacing-2);
6185
+ gap: var(--ax-space-8);
6271
6186
  display: grid;
6272
6187
  }
6273
6188
 
@@ -6286,7 +6201,7 @@
6286
6201
  }
6287
6202
 
6288
6203
  .navds-toggle-group__button {
6289
- padding: var(--ax-spacing-1) var(--ax-spacing-3);
6204
+ padding: var(--ax-space-4) var(--ax-space-12);
6290
6205
  cursor: pointer;
6291
6206
  min-height: 3rem;
6292
6207
  color: var(--ax-text-default);
@@ -6328,7 +6243,7 @@
6328
6243
 
6329
6244
  .navds-toggle-group__button-inner {
6330
6245
  align-items: center;
6331
- gap: var(--ax-spacing-2);
6246
+ gap: var(--ax-space-8);
6332
6247
  display: flex;
6333
6248
  }
6334
6249
 
@@ -6341,16 +6256,16 @@
6341
6256
  }
6342
6257
 
6343
6258
  :where(.navds-toggle-group--neutral) .navds-toggle-group__button:hover {
6344
- background-color: var(--ax-bg-neutral-moderate-hoverA);
6259
+ background-color: var(--ax-bg-moderate-hoverA);
6345
6260
  }
6346
6261
 
6347
6262
  :where(.navds-toggle-group--neutral) .navds-toggle-group__button[data-selected="true"] {
6348
- background-color: var(--ax-bg-neutral-strong-pressed);
6349
- color: var(--ax-text-neutral-contrast);
6263
+ background-color: var(--ax-bg-strong-pressed);
6264
+ color: var(--ax-text-contrast);
6350
6265
  }
6351
6266
 
6352
6267
  .navds-toggle-group--small .navds-toggle-group__button {
6353
- padding: var(--ax-spacing-05) var(--ax-spacing-3);
6268
+ padding: var(--ax-space-2) var(--ax-space-12);
6354
6269
  min-height: 2rem;
6355
6270
  }
6356
6271
 
@@ -6441,14 +6356,14 @@
6441
6356
  .navds-read-more {
6442
6357
  --__axc-read-more-icon-size: 1.5rem;
6443
6358
  --__axc-read-more-pi-start: 0px;
6444
- --__axc-read-more-pi-end: var(--ax-spacing-1);
6445
- --__axc-read-more-pb: var(--ax-spacing-1);
6359
+ --__axc-read-more-pi-end: var(--ax-space-4);
6360
+ --__axc-read-more-pb: var(--ax-space-4);
6446
6361
  }
6447
6362
 
6448
6363
  .navds-read-more__button {
6449
6364
  cursor: pointer;
6450
6365
  align-items: flex-start;
6451
- gap: var(--ax-spacing-1);
6366
+ gap: var(--ax-space-4);
6452
6367
  color: var(--ax-text-accent);
6453
6368
  padding-inline: var(--__axc-read-more-pi-start) var(--__axc-read-more-pi-end);
6454
6369
  padding-block: var(--__axc-read-more-pb);
@@ -6460,8 +6375,8 @@
6460
6375
  }
6461
6376
 
6462
6377
  .navds-read-more__button:focus-visible {
6463
- outline: 2px solid var(--ax-border-focus);
6464
- outline-offset: 2px;
6378
+ outline: 3px solid var(--ax-border-focus);
6379
+ outline-offset: 3px;
6465
6380
  }
6466
6381
 
6467
6382
  .navds-read-more__button[data-state="open"] .navds-read-more__expand-icon {
@@ -6473,7 +6388,7 @@
6473
6388
  }
6474
6389
 
6475
6390
  .navds-read-more:is([data-volume="low"], :not([data-volume])) .navds-read-more__button:hover {
6476
- background-color: var(--ax-bg-neutral-hoverA);
6391
+ background-color: var(--ax-bg-hoverA);
6477
6392
  color: var(--ax-text-accent-strong);
6478
6393
  }
6479
6394
 
@@ -6488,21 +6403,21 @@
6488
6403
  }
6489
6404
 
6490
6405
  .navds-read-more[data-volume="high"].navds-read-more--large {
6491
- --__axc-read-more-pi-start: var(--ax-spacing-3);
6492
- --__axc-read-more-pi-end: var(--ax-spacing-6);
6406
+ --__axc-read-more-pi-start: var(--ax-space-12);
6407
+ --__axc-read-more-pi-end: var(--ax-space-24);
6493
6408
  }
6494
6409
 
6495
6410
  .navds-read-more[data-volume="high"].navds-read-more--small, .navds-read-more[data-volume="high"].navds-read-more--medium {
6496
- --__axc-read-more-pi-start: var(--ax-spacing-2);
6497
- --__axc-read-more-pi-end: var(--ax-spacing-4);
6411
+ --__axc-read-more-pi-start: var(--ax-space-8);
6412
+ --__axc-read-more-pi-end: var(--ax-space-16);
6498
6413
  }
6499
6414
 
6500
6415
  .navds-read-more__content {
6501
- margin-top: var(--ax-spacing-2);
6502
- border-left: 2px solid var(--ax-border-neutral-subtleA);
6416
+ margin-top: var(--ax-space-8);
6417
+ border-left: 2px solid var(--ax-border-subtleA);
6503
6418
  color: var(--ax-text-default);
6504
6419
  margin-left: calc(var(--__axc-read-more-pi-start) + var(--__axc-read-more-icon-size) / 2 - 1px);
6505
- padding-left: calc(var(--__axc-read-more-icon-size) / 2 - 1px + var(--ax-spacing-1));
6420
+ padding-left: calc(var(--__axc-read-more-icon-size) / 2 - 1px + var(--ax-space-4));
6506
6421
  }
6507
6422
 
6508
6423
  .navds-read-more__content[data-state="closed"] {
@@ -6516,12 +6431,12 @@
6516
6431
  }
6517
6432
 
6518
6433
  .navds-read-more--large {
6519
- --__axc-read-more-pb: var(--ax-spacing-3);
6434
+ --__axc-read-more-pb: var(--ax-space-12);
6520
6435
  }
6521
6436
 
6522
6437
  .navds-read-more--small {
6523
6438
  --__axc-read-more-icon-size: 1.25rem;
6524
- --__axc-read-more-pb: var(--ax-spacing-05);
6439
+ --__axc-read-more-pb: var(--ax-space-2);
6525
6440
  }
6526
6441
 
6527
6442
  @media (forced-colors: active) {
@@ -6533,9 +6448,9 @@
6533
6448
  }
6534
6449
 
6535
6450
  .navds-progress-bar {
6536
- background: var(--ax-bg-neutral-moderateA);
6451
+ background: var(--ax-bg-moderateA);
6537
6452
  border-radius: var(--ax-border-radius-full);
6538
- box-shadow: inset 0 0 0 1px var(--ax-border-neutral-subtleA);
6453
+ box-shadow: inset 0 0 0 1px var(--ax-border-subtleA);
6539
6454
  position: relative;
6540
6455
  overflow: hidden;
6541
6456
  }
@@ -6638,7 +6553,7 @@
6638
6553
  }
6639
6554
 
6640
6555
  .navds-skeleton {
6641
- background-color: var(--ax-bg-neutral-moderateA);
6556
+ background-color: var(--ax-bg-moderateA);
6642
6557
  pointer-events: none;
6643
6558
  height: 1.3em;
6644
6559
  animation: 2s cubic-bezier(.4, 0, .6, 1) infinite akselSkeletonAnimation;
@@ -6718,7 +6633,7 @@
6718
6633
  grid-template-rows: [line-1] auto [step-start] var(--__axc-stepper-circle-size) [line-2 step-end] auto;
6719
6634
  grid-template-columns: var(--__axc-stepper-circle-size) auto;
6720
6635
  justify-items: flex-start;
6721
- gap: var(--ax-spacing-2);
6636
+ gap: var(--ax-space-8);
6722
6637
  display: grid;
6723
6638
  }
6724
6639
 
@@ -6732,11 +6647,11 @@
6732
6647
  }
6733
6648
 
6734
6649
  .navds-stepper__item--non-interactive .navds-stepper__line {
6735
- background-color: var(--ax-border-neutral-strong);
6650
+ background-color: var(--ax-border-strong);
6736
6651
  }
6737
6652
 
6738
6653
  .navds-stepper__item:has( + .navds-stepper__item > .navds-stepper__step[data-interactive="false"]) .navds-stepper__line--2 {
6739
- background-color: var(--ax-border-neutral-strong);
6654
+ background-color: var(--ax-border-strong);
6740
6655
  }
6741
6656
 
6742
6657
  .navds-stepper__line--1 {
@@ -6755,7 +6670,7 @@
6755
6670
  .navds-stepper__step {
6756
6671
  grid-area: 2 / 1 / -1 / -1;
6757
6672
  grid-template-columns: [circle] var(--__axc-stepper-circle-size) [content] auto;
6758
- gap: var(--ax-spacing-2);
6673
+ gap: var(--ax-space-8);
6759
6674
  cursor: pointer;
6760
6675
  padding: var(--__axc-stepper-border-width);
6761
6676
  margin: calc(var(--__axc-stepper-border-width) * -1) calc(var(--__axc-stepper-border-width) * -1) var(--__axc-stepper-circle-size);
@@ -6840,23 +6755,23 @@
6840
6755
  }
6841
6756
 
6842
6757
  .navds-stepper__step[data-interactive="false"] {
6843
- color: var(--ax-text-neutral);
6758
+ color: var(--ax-text-default);
6844
6759
  cursor: default;
6845
6760
  }
6846
6761
 
6847
6762
  .navds-stepper__step[data-interactive="false"] .navds-stepper__circle {
6848
- color: var(--ax-text-neutral);
6849
- border-color: var(--ax-border-neutral-strong);
6763
+ color: var(--ax-text-default);
6764
+ border-color: var(--ax-border-strong);
6850
6765
  }
6851
6766
 
6852
6767
  .navds-stepper__step[data-interactive="false"][data-active="true"] .navds-stepper__content {
6853
- color: var(--ax-text-neutral-strong);
6768
+ color: var(--ax-text-subtle);
6854
6769
  }
6855
6770
 
6856
6771
  .navds-stepper__step[data-interactive="false"][data-active="true"] .navds-stepper__circle {
6857
- color: var(--ax-text-neutral-contrast);
6858
- background-color: var(--ax-bg-neutral-strong-pressed);
6859
- border-color: var(--ax-bg-neutral-strong-pressed);
6772
+ color: var(--ax-text-contrast);
6773
+ background-color: var(--ax-bg-strong-pressed);
6774
+ border-color: var(--ax-bg-strong-pressed);
6860
6775
  }
6861
6776
 
6862
6777
  .navds-stepper__content {
@@ -6950,7 +6865,7 @@
6950
6865
  }
6951
6866
 
6952
6867
  .navds-table__body .navds-table__row--shade-on-hover:not(.navds-table__expandable-row--expansion-disabled):hover {
6953
- background-color: var(--ax-bg-neutral-hoverA);
6868
+ background-color: var(--ax-bg-hoverA);
6954
6869
  transition: background-color 70ms cubic-bezier(.2, 0, 0, 1);
6955
6870
  }
6956
6871
 
@@ -6963,11 +6878,11 @@
6963
6878
  }
6964
6879
 
6965
6880
  .navds-table__row--selected {
6966
- background-color: var(--ax-bg-accent);
6881
+ background-color: var(--ax-bg-accent-soft);
6967
6882
  }
6968
6883
 
6969
6884
  .navds-table--zebra-stripes .navds-table__body :where(.navds-table__row:nth-child(odd):not(.navds-table__row--selected)) {
6970
- background-color: var(--ax-bg-neutral);
6885
+ background-color: var(--ax-bg-soft);
6971
6886
  }
6972
6887
 
6973
6888
  .navds-table--zebra-stripes .navds-table__body :where(.navds-table__expandable-row:nth-child(4n+1):not(.navds-table__row--selected)) {
@@ -6975,11 +6890,11 @@
6975
6890
  }
6976
6891
 
6977
6892
  .navds-table--zebra-stripes .navds-table__body .navds-table__expanded-row:nth-child(4n) {
6978
- background-color: var(--ax-bg-neutral);
6893
+ background-color: var(--ax-bg-soft);
6979
6894
  }
6980
6895
 
6981
6896
  .navds-table__header-cell, .navds-table__data-cell {
6982
- padding: var(--ax-spacing-3) var(--ax-spacing-2);
6897
+ padding: var(--ax-space-12) var(--ax-space-8);
6983
6898
  border-bottom: 1px solid var(--ax-border-default);
6984
6899
  text-align: left;
6985
6900
  display: table-cell;
@@ -7006,11 +6921,11 @@
7006
6921
  }
7007
6922
 
7008
6923
  .navds-table--large .navds-table__header-cell, .navds-table--large .navds-table__data-cell {
7009
- padding: var(--ax-spacing-4) var(--ax-spacing-2);
6924
+ padding: var(--ax-space-16) var(--ax-space-8);
7010
6925
  }
7011
6926
 
7012
6927
  .navds-table--small .navds-table__header-cell, .navds-table--small .navds-table__data-cell {
7013
- padding: var(--ax-spacing-1) var(--ax-spacing-2);
6928
+ padding: var(--ax-space-4) var(--ax-space-8);
7014
6929
  }
7015
6930
 
7016
6931
  .navds-table :not(.navds-checkboxes) > .navds-checkbox .navds-checkbox__input {
@@ -7029,8 +6944,8 @@
7029
6944
  appearance: none;
7030
6945
  color: var(--ax-text-accent);
7031
6946
  cursor: pointer;
7032
- padding: var(--ax-spacing-4) var(--ax-spacing-3);
7033
- gap: var(--ax-spacing-2);
6947
+ padding: var(--ax-space-16) var(--ax-space-12);
6948
+ gap: var(--ax-space-8);
7034
6949
  width: 100%;
7035
6950
  line-height: inherit;
7036
6951
  font-weight: inherit;
@@ -7042,11 +6957,11 @@
7042
6957
  }
7043
6958
 
7044
6959
  .navds-table--small .navds-table__sort-button {
7045
- padding: var(--ax-spacing-2) var(--ax-spacing-3);
6960
+ padding: var(--ax-space-8) var(--ax-space-12);
7046
6961
  }
7047
6962
 
7048
6963
  .navds-table__sort-button:hover {
7049
- background-color: var(--ax-bg-neutral-hoverA);
6964
+ background-color: var(--ax-bg-hoverA);
7050
6965
  }
7051
6966
 
7052
6967
  .navds-table__sort-button:focus-visible {
@@ -7072,7 +6987,7 @@
7072
6987
  font-size: 1rem;
7073
6988
  }
7074
6989
 
7075
- .navds-table__expandable-row:not(.navds-table__expandable-row--open) .navds-table__data-cell {
6990
+ .navds-table__expandable-row:not(.navds-table__expandable-row--open) :where(.navds-table__data-cell, .navds-table__header-cell) {
7076
6991
  transition: border-bottom-color .15s cubic-bezier(.95, .05, .8, .04);
7077
6992
  }
7078
6993
 
@@ -7080,14 +6995,10 @@
7080
6995
  cursor: pointer;
7081
6996
  }
7082
6997
 
7083
- .navds-table__expandable-row--open .navds-table__data-cell {
6998
+ .navds-table__expandable-row--open :where(.navds-table__data-cell, .navds-table__header-cell) {
7084
6999
  border-bottom-color: rgba(0, 0, 0, 0);
7085
7000
  }
7086
7001
 
7087
- .navds-table__expandable-row--open .navds-table__header-cell {
7088
- border-color: var(--ax-border-default);
7089
- }
7090
-
7091
7002
  .navds-table__expandable-row--open .navds-table__toggle-expand-cell--open {
7092
7003
  border-color: rgba(0, 0, 0, 0);
7093
7004
  }
@@ -7098,11 +7009,11 @@
7098
7009
  }
7099
7010
 
7100
7011
  .navds-table--large .navds-table__toggle-expand-cell {
7101
- padding: 0 var(--ax-spacing-2);
7012
+ padding: 0 var(--ax-space-8);
7102
7013
  }
7103
7014
 
7104
7015
  .navds-table--small .navds-table__toggle-expand-cell {
7105
- padding: var(--ax-spacing-1) var(--ax-spacing-2);
7016
+ padding: var(--ax-space-4) var(--ax-space-8);
7106
7017
  }
7107
7018
 
7108
7019
  .navds-table__toggle-expand-button {
@@ -7128,7 +7039,7 @@
7128
7039
  }
7129
7040
 
7130
7041
  .navds-table__toggle-expand-button:hover, .navds-table__toggle-expand-cell:hover > .navds-table__toggle-expand-button, .navds-table__expandable-row--clickable:hover .navds-table__toggle-expand-button {
7131
- background-color: var(--ax-bg-neutral-hoverA);
7042
+ background-color: var(--ax-bg-hoverA);
7132
7043
  }
7133
7044
 
7134
7045
  .navds-table__toggle-expand-cell--open > :where(.navds-table__toggle-expand-button) :where(.navds-table__expandable-icon) {
@@ -7152,15 +7063,32 @@
7152
7063
  }
7153
7064
 
7154
7065
  .navds-table__expanded-row-content {
7155
- padding: var(--ax-spacing-4) calc(var(--ax-spacing-2) + 3rem);
7066
+ --__ac-table-expanded-row-pi: calc(var(--ax-space-8) + 3rem);
7067
+ padding-block: var(--ax-space-16);
7156
7068
  }
7157
7069
 
7158
7070
  .navds-table--small .navds-table__expanded-row-content {
7159
- padding: var(--ax-spacing-2) calc(var(--ax-spacing-2) + 3rem);
7071
+ padding-block: var(--ax-space-8);
7072
+ }
7073
+
7074
+ .navds-table__expanded-row-content--gutter-both {
7075
+ padding-inline: var(--__ac-table-expanded-row-pi);
7076
+ }
7077
+
7078
+ .navds-table__expanded-row-content--gutter-left {
7079
+ padding-inline: var(--__ac-table-expanded-row-pi) var(--ax-space-8);
7080
+ }
7081
+
7082
+ .navds-table__expanded-row-content--gutter-right {
7083
+ padding-inline: var(--ax-space-8) var(--__ac-table-expanded-row-pi);
7084
+ }
7085
+
7086
+ .navds-table__expanded-row-content--gutter-none {
7087
+ padding-inline: var(--ax-space-8);
7160
7088
  }
7161
7089
 
7162
7090
  .navds-tabs__tablist-wrapper {
7163
- box-shadow: inset 0 -1px var(--ax-border-neutral-subtle);
7091
+ box-shadow: inset 0 -1px var(--ax-border-subtle);
7164
7092
  width: 100%;
7165
7093
  display: flex;
7166
7094
  }
@@ -7180,7 +7108,7 @@
7180
7108
  }
7181
7109
 
7182
7110
  .navds-tabs__scroll-button {
7183
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
7111
+ padding: var(--ax-space-12) var(--ax-space-16);
7184
7112
  cursor: pointer;
7185
7113
  justify-content: center;
7186
7114
  align-items: center;
@@ -7194,7 +7122,7 @@
7194
7122
  }
7195
7123
 
7196
7124
  .navds-tabs--small .navds-tabs__scroll-button {
7197
- padding: var(--ax-spacing-1-alt) var(--ax-spacing-4);
7125
+ padding: var(--ax-space-6) var(--ax-space-16);
7198
7126
  width: 2rem;
7199
7127
  }
7200
7128
 
@@ -7204,11 +7132,11 @@
7204
7132
 
7205
7133
  .navds-tabs__tab {
7206
7134
  min-height: 3rem;
7207
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
7135
+ padding: var(--ax-space-12) var(--ax-space-16);
7208
7136
  color: var(--ax-text-default);
7209
7137
  cursor: pointer;
7210
7138
  --__axc-tabs-line-width: 0;
7211
- --__axc-tabs-line-color: var(--ax-border-neutral-subtle);
7139
+ --__axc-tabs-line-color: var(--ax-border-subtle);
7212
7140
  box-shadow: inset 0 var(--__axc-tabs-line-width) var(--__axc-tabs-line-color);
7213
7141
  background: none;
7214
7142
  border: none;
@@ -7234,7 +7162,7 @@
7234
7162
 
7235
7163
  .navds-tabs__tab-inner {
7236
7164
  align-items: center;
7237
- gap: var(--ax-spacing-1);
7165
+ gap: var(--ax-space-4);
7238
7166
  display: flex;
7239
7167
  }
7240
7168
 
@@ -7253,11 +7181,11 @@
7253
7181
 
7254
7182
  .navds-tabs__tab--small {
7255
7183
  min-height: 2rem;
7256
- padding: var(--ax-spacing-1-alt) var(--ax-spacing-4);
7184
+ padding: var(--ax-space-6) var(--ax-space-16);
7257
7185
  }
7258
7186
 
7259
7187
  .navds-tabs__tab-icon--top, .navds-tabs__tab--small.navds-tabs__tab-icon--top {
7260
- padding: var(--ax-spacing-1) var(--ax-spacing-4);
7188
+ padding: var(--ax-space-4) var(--ax-space-16);
7261
7189
  }
7262
7190
 
7263
7191
  :is(.navds-tabs__tab, .navds-tabs__tab--small.navds-tabs__tab--icon-only, .navds-tabs__tab--small.navds-tabs__tab-icon--top) svg {
@@ -7284,29 +7212,29 @@
7284
7212
  @media (forced-colors: active) {
7285
7213
  .navds-tabs__tab[data-state="active"] {
7286
7214
  border-bottom: 3px solid canvastext;
7287
- padding-block-end: calc(var(--ax-spacing-3) - 3px);
7215
+ padding-block-end: calc(var(--ax-space-12) - 3px);
7288
7216
  }
7289
7217
 
7290
7218
  .navds-tabs__tab--small[data-state="active"] {
7291
- padding-block-end: calc(var(--ax-spacing-1-alt) - 3px);
7219
+ padding-block-end: calc(var(--ax-space-6) - 3px);
7292
7220
  }
7293
7221
 
7294
7222
  .navds-tabs__tab-icon--top[data-state="active"], .navds-tabs__tab--small.navds-tabs__tab-icon--top[data-state="active"] {
7295
- padding-block-end: calc(var(--ax-spacing-1) - 3px);
7223
+ padding-block-end: calc(var(--ax-space-4) - 3px);
7296
7224
  }
7297
7225
  }
7298
7226
 
7299
7227
  .navds-list ul, .navds-list ol {
7300
- margin-block: var(--ax-spacing-4);
7228
+ margin-block: var(--ax-space-16);
7301
7229
  padding: 0;
7302
7230
  }
7303
7231
 
7304
7232
  .navds-list--small ul, .navds-list--small ol {
7305
- margin-block: var(--ax-spacing-3);
7233
+ margin-block: var(--ax-space-12);
7306
7234
  }
7307
7235
 
7308
7236
  .navds-list .navds-list :where(ul, ol) {
7309
- margin-block: var(--ax-spacing-2) 0;
7237
+ margin-block: var(--ax-space-8) 0;
7310
7238
  }
7311
7239
 
7312
7240
  .navds-list ol {
@@ -7323,7 +7251,7 @@
7323
7251
  }
7324
7252
 
7325
7253
  .navds-list ul > .navds-list__item {
7326
- gap: var(--ax-spacing-2);
7254
+ gap: var(--ax-space-8);
7327
7255
  grid-template-columns: auto 1fr;
7328
7256
  display: grid;
7329
7257
  }
@@ -7359,7 +7287,7 @@
7359
7287
  }
7360
7288
 
7361
7289
  .navds-list__item {
7362
- margin-block-end: var(--ax-spacing-2);
7290
+ margin-block-end: var(--ax-space-8);
7363
7291
  }
7364
7292
 
7365
7293
  .navds-list__item:last-child {
@@ -8367,7 +8295,7 @@
8367
8295
  }
8368
8296
 
8369
8297
  .navds-page__content--padding {
8370
- padding-block-end: var(--ax-spacing-16);
8298
+ padding-block-end: var(--ax-space-64);
8371
8299
  }
8372
8300
 
8373
8301
  .navds-pageblock--text {