@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
@@ -13,7 +13,7 @@
13
13
  }
14
14
 
15
15
  .navds-heading--xlarge.navds-typo--spacing {
16
- margin-bottom: var(--ax-spacing-5);
16
+ margin-bottom: var(--ax-space-20);
17
17
  }
18
18
 
19
19
  .navds-heading--large {
@@ -23,7 +23,7 @@
23
23
  }
24
24
 
25
25
  .navds-heading--large.navds-typo--spacing {
26
- margin-bottom: var(--ax-spacing-4);
26
+ margin-bottom: var(--ax-space-16);
27
27
  }
28
28
 
29
29
  @media (max-width: 480px) {
@@ -34,7 +34,7 @@
34
34
  }
35
35
 
36
36
  .navds-heading--xlarge.navds-typo--spacing {
37
- margin-bottom: var(--ax-spacing-4);
37
+ margin-bottom: var(--ax-space-16);
38
38
  }
39
39
 
40
40
  .navds-heading--large {
@@ -44,7 +44,7 @@
44
44
  }
45
45
 
46
46
  .navds-heading--large.navds-typo--spacing {
47
- margin-bottom: var(--ax-spacing-3);
47
+ margin-bottom: var(--ax-space-12);
48
48
  }
49
49
  }
50
50
 
@@ -55,7 +55,7 @@
55
55
  }
56
56
 
57
57
  .navds-heading--medium.navds-typo--spacing {
58
- margin-bottom: var(--ax-spacing-3);
58
+ margin-bottom: var(--ax-space-12);
59
59
  }
60
60
 
61
61
  .navds-heading--small {
@@ -65,7 +65,7 @@
65
65
  }
66
66
 
67
67
  .navds-heading--small.navds-typo--spacing {
68
- margin-bottom: var(--ax-spacing-3);
68
+ margin-bottom: var(--ax-space-12);
69
69
  }
70
70
 
71
71
  .navds-heading--xsmall {
@@ -75,7 +75,7 @@
75
75
  }
76
76
 
77
77
  .navds-heading--xsmall.navds-typo--spacing {
78
- margin-bottom: var(--ax-spacing-3);
78
+ margin-bottom: var(--ax-space-12);
79
79
  }
80
80
 
81
81
  .navds-ingress {
@@ -87,7 +87,7 @@
87
87
  }
88
88
 
89
89
  .navds-ingress.navds-typo--spacing {
90
- margin-bottom: var(--ax-spacing-10);
90
+ margin-bottom: var(--ax-space-40);
91
91
  }
92
92
 
93
93
  .navds-body-long {
@@ -99,7 +99,7 @@
99
99
  }
100
100
 
101
101
  .navds-body-long.navds-typo--spacing {
102
- margin-bottom: var(--ax-spacing-7);
102
+ margin-bottom: var(--ax-space-28);
103
103
  }
104
104
 
105
105
  .navds-body-long--large {
@@ -109,7 +109,7 @@
109
109
  }
110
110
 
111
111
  .navds-body-long--large.navds-typo--spacing {
112
- margin-bottom: var(--ax-spacing-10);
112
+ margin-bottom: var(--ax-space-40);
113
113
  }
114
114
 
115
115
  .navds-body-long--small {
@@ -119,7 +119,7 @@
119
119
  }
120
120
 
121
121
  .navds-body-long--small.navds-typo--spacing {
122
- margin-bottom: var(--ax-spacing-6);
122
+ margin-bottom: var(--ax-space-24);
123
123
  }
124
124
 
125
125
  .navds-body-short {
@@ -131,7 +131,7 @@
131
131
  }
132
132
 
133
133
  .navds-body-short.navds-typo--spacing {
134
- margin-bottom: var(--ax-spacing-3);
134
+ margin-bottom: var(--ax-space-12);
135
135
  }
136
136
 
137
137
  .navds-body-short--large {
@@ -141,7 +141,7 @@
141
141
  }
142
142
 
143
143
  .navds-body-short--large.navds-typo--spacing {
144
- margin-bottom: var(--ax-spacing-4);
144
+ margin-bottom: var(--ax-space-16);
145
145
  }
146
146
 
147
147
  .navds-body-short--small {
@@ -151,7 +151,7 @@
151
151
  }
152
152
 
153
153
  .navds-body-short--small.navds-typo--spacing {
154
- margin-bottom: var(--ax-spacing-2);
154
+ margin-bottom: var(--ax-space-8);
155
155
  }
156
156
 
157
157
  .navds-label {
@@ -163,7 +163,7 @@
163
163
  }
164
164
 
165
165
  .navds-label.navds-typo--spacing {
166
- margin-bottom: var(--ax-spacing-3);
166
+ margin-bottom: var(--ax-space-12);
167
167
  }
168
168
 
169
169
  .navds-label--small {
@@ -173,7 +173,7 @@
173
173
  }
174
174
 
175
175
  .navds-label--small.navds-typo--spacing {
176
- margin-bottom: var(--ax-spacing-2);
176
+ margin-bottom: var(--ax-space-8);
177
177
  }
178
178
 
179
179
  .navds-detail {
@@ -184,7 +184,7 @@
184
184
  }
185
185
 
186
186
  .navds-detail.navds-typo--spacing {
187
- margin-bottom: var(--ax-spacing-2);
187
+ margin-bottom: var(--ax-space-8);
188
188
  }
189
189
 
190
190
  .navds-detail.navds-typo--uppercase {
@@ -196,7 +196,7 @@
196
196
  }
197
197
 
198
198
  .navds-detail--small.navds-typo--spacing {
199
- margin-bottom: var(--ax-spacing-2);
199
+ margin-bottom: var(--ax-space-8);
200
200
  }
201
201
 
202
202
  .navds-error-message {
@@ -204,7 +204,7 @@
204
204
  }
205
205
 
206
206
  .navds-error-message.navds-error-message--show-icon {
207
- gap: var(--ax-spacing-1);
207
+ gap: var(--ax-space-4);
208
208
  display: flex;
209
209
  }
210
210
 
@@ -259,12 +259,12 @@
259
259
  --__axc-button-icon-margin: -4px;
260
260
  --__axc-button-border-color: transparent;
261
261
  --__axc-button-border-width: 2px;
262
- padding: var(--ax-spacing-3) var(--ax-spacing-5);
262
+ padding: var(--ax-space-12) var(--ax-space-20);
263
263
  border-radius: var(--ax-border-radius-medium);
264
264
  cursor: pointer;
265
265
  justify-content: center;
266
266
  align-items: center;
267
- gap: var(--ax-spacing-2);
267
+ gap: var(--ax-space-8);
268
268
  box-shadow: inset 0 0 0 var(--__axc-button-border-width) var(--__axc-button-border-color);
269
269
  background: none;
270
270
  border: none;
@@ -273,36 +273,37 @@
273
273
  }
274
274
 
275
275
  .navds-button:focus-visible {
276
- outline: 2px solid var(--ax-border-focus);
277
- outline-offset: 2px;
276
+ outline: 3px solid var(--ax-border-focus);
277
+ outline-offset: 3px;
278
278
  }
279
279
 
280
280
  .navds-button--small, .navds-button--xsmall {
281
281
  --__axc-button-icon-margin: -2px;
282
- --__axc-button-icon-size: 1.25rem;
283
282
  }
284
283
 
285
284
  .navds-button--small {
286
- padding: var(--ax-spacing-1) var(--ax-spacing-3);
285
+ padding: var(--ax-space-4) var(--ax-space-12);
286
+ gap: var(--ax-space-6);
287
287
  min-width: 2rem;
288
288
  min-height: 2rem;
289
289
  }
290
290
 
291
291
  .navds-button--xsmall {
292
- padding: var(--ax-spacing-05) var(--ax-spacing-2);
293
- gap: var(--ax-spacing-1);
292
+ padding: var(--ax-space-2) var(--ax-space-8);
293
+ gap: var(--ax-space-4);
294
+ --__axc-button-icon-size: 1.25rem;
294
295
  }
295
296
 
296
297
  .navds-button--icon-only {
297
- padding: var(--ax-spacing-3);
298
+ padding: var(--ax-space-12);
298
299
  }
299
300
 
300
301
  .navds-button--icon-only.navds-button--small {
301
- padding: var(--ax-spacing-1);
302
+ padding: var(--ax-space-4);
302
303
  }
303
304
 
304
305
  .navds-button--icon-only.navds-button--xsmall {
305
- padding: var(--ax-spacing-05);
306
+ padding: var(--ax-space-2);
306
307
  }
307
308
 
308
309
  @supports not selector(:focus-visible) {
@@ -357,20 +358,20 @@
357
358
  }
358
359
 
359
360
  .navds-button--primary-neutral {
360
- background-color: var(--ax-bg-neutral-strong);
361
- color: var(--ax-text-neutral-contrast);
361
+ background-color: var(--ax-bg-strong);
362
+ color: var(--ax-text-contrast);
362
363
  }
363
364
 
364
365
  .navds-button--primary-neutral:hover {
365
- background-color: var(--ax-bg-neutral-strong-hover);
366
+ background-color: var(--ax-bg-strong-hover);
366
367
  }
367
368
 
368
369
  .navds-button--primary-neutral:active {
369
- background-color: var(--ax-bg-neutral-strong-pressed);
370
+ background-color: var(--ax-bg-strong-pressed);
370
371
  }
371
372
 
372
373
  .navds-button--primary-neutral:is(:disabled, .navds-button--disabled) {
373
- background-color: var(--ax-bg-neutral-strong);
374
+ background-color: var(--ax-bg-strong);
374
375
  }
375
376
 
376
377
  .navds-button--secondary {
@@ -382,7 +383,6 @@
382
383
  .navds-button--secondary:hover {
383
384
  --__axc-button-border-color: var(--ax-border-accent-strong);
384
385
  background-color: var(--ax-bg-accent-moderate-hoverA);
385
- color: var(--ax-text-accent-strong);
386
386
  }
387
387
 
388
388
  .navds-button--secondary:active {
@@ -398,24 +398,24 @@
398
398
  }
399
399
 
400
400
  .navds-button--secondary-neutral {
401
- --__axc-button-border-color: var(--ax-border-default);
401
+ --__axc-button-border-color: var(--ax-border-strong);
402
402
  color: var(--ax-text-default);
403
403
  background-color: rgba(0, 0, 0, 0);
404
404
  }
405
405
 
406
406
  .navds-button--secondary-neutral:hover {
407
407
  --__axc-button-border-color: var(--ax-border-strong);
408
- background-color: var(--ax-bg-neutral-moderate-hoverA);
408
+ background-color: var(--ax-bg-moderate-hoverA);
409
409
  }
410
410
 
411
411
  .navds-button--secondary-neutral:active {
412
412
  --__axc-button-border-color: transparent;
413
- color: var(--ax-text-neutral-contrast);
414
- background-color: var(--ax-bg-neutral-strong-pressed);
413
+ color: var(--ax-text-contrast);
414
+ background-color: var(--ax-bg-strong-pressed);
415
415
  }
416
416
 
417
417
  .navds-button--secondary-neutral:is(:disabled, .navds-button--disabled) {
418
- --__axc-button-border-color: var(--ax-border-neutral);
418
+ --__axc-button-border-color: var(--ax-border-strong);
419
419
  color: var(--ax-text-default);
420
420
  background-color: rgba(0, 0, 0, 0);
421
421
  }
@@ -427,7 +427,6 @@
427
427
 
428
428
  .navds-button--tertiary:hover {
429
429
  background-color: var(--ax-bg-accent-moderate-hoverA);
430
- color: var(--ax-text-accent-strong);
431
430
  }
432
431
 
433
432
  .navds-button--tertiary:active {
@@ -446,12 +445,12 @@
446
445
  }
447
446
 
448
447
  .navds-button--tertiary-neutral:hover {
449
- background-color: var(--ax-bg-neutral-moderate-hoverA);
448
+ background-color: var(--ax-bg-moderate-hoverA);
450
449
  }
451
450
 
452
451
  .navds-button--tertiary-neutral:active {
453
- background-color: var(--ax-bg-neutral-strong-pressed);
454
- color: var(--ax-text-neutral-contrast);
452
+ background-color: var(--ax-bg-strong-pressed);
453
+ color: var(--ax-text-contrast);
455
454
  }
456
455
 
457
456
  .navds-button--tertiary-neutral:is(:disabled, .navds-button--disabled) {
@@ -484,7 +483,7 @@
484
483
  opacity: var(--ax-opacity-disabled);
485
484
  }
486
485
 
487
- .navds-button .navds-loader {
486
+ .navds-button > .navds-loader {
488
487
  position: absolute;
489
488
  }
490
489
 
@@ -533,7 +532,7 @@
533
532
  }
534
533
 
535
534
  .navds-chips {
536
- gap: var(--ax-spacing-2);
535
+ gap: var(--ax-space-8);
537
536
  flex-wrap: wrap;
538
537
  margin: 0;
539
538
  padding: 0;
@@ -553,8 +552,8 @@
553
552
  cursor: pointer;
554
553
  justify-content: center;
555
554
  align-items: center;
556
- gap: var(--ax-spacing-05);
557
- padding: 0 var(--ax-spacing-3);
555
+ gap: var(--ax-space-2);
556
+ padding: 0 var(--ax-space-12);
558
557
  border-radius: var(--ax-border-radius-full);
559
558
  min-height: 2rem;
560
559
  margin: 0;
@@ -568,12 +567,12 @@
568
567
  }
569
568
 
570
569
  .navds-chips--readonly .navds-chips__chip {
571
- background-color: var(--ax-bg-neutral-moderateA);
570
+ background-color: var(--ax-bg-moderateA);
572
571
  }
573
572
 
574
573
  .navds-chips--small .navds-chips__chip {
575
574
  min-height: 1.5rem;
576
- padding: 0 var(--ax-spacing-2);
575
+ padding: 0 var(--ax-space-8);
577
576
  }
578
577
 
579
578
  .navds-chips--small .navds-chips__toggle-icon {
@@ -582,7 +581,7 @@
582
581
  }
583
582
 
584
583
  .navds-chips--small .navds-chips__toggle--with-checkmark {
585
- padding-left: var(--ax-spacing-1);
584
+ padding-left: var(--ax-space-4);
586
585
  }
587
586
 
588
587
  .navds-chips--small .navds-chips__removable-icon {
@@ -595,13 +594,13 @@
595
594
  }
596
595
 
597
596
  .navds-chips--small .navds-chips--icon-right {
598
- padding-right: var(--ax-spacing-05);
597
+ padding-right: var(--ax-space-2);
599
598
  }
600
599
 
601
600
  .navds-chips__toggle--action {
602
601
  box-shadow: inset 0 0 0 1px var(--ax-border-accent-subtleA);
603
602
  background-color: var(--ax-bg-accent-moderate);
604
- color: var(--ax-text-default);
603
+ color: var(--ax-text-accent-strong);
605
604
  }
606
605
 
607
606
  .navds-chips__toggle--action:hover {
@@ -619,27 +618,27 @@
619
618
  }
620
619
 
621
620
  .navds-chips__toggle--neutral {
622
- box-shadow: inset 0 0 0 1px var(--ax-border-neutral-subtleA);
623
- background-color: var(--ax-bg-neutral-moderate);
621
+ box-shadow: inset 0 0 0 1px var(--ax-border-subtleA);
622
+ background-color: var(--ax-bg-moderate);
624
623
  color: var(--ax-text-default);
625
624
  }
626
625
 
627
626
  .navds-chips__toggle--neutral:hover {
628
- background-color: var(--ax-bg-neutral-moderate-hover);
627
+ background-color: var(--ax-bg-moderate-hover);
629
628
  }
630
629
 
631
630
  .navds-chips__toggle--neutral[data-pressed="true"] {
632
631
  box-shadow: none;
633
- background-color: var(--ax-bg-neutral-strong-pressed);
634
- color: var(--ax-text-neutral-contrast);
632
+ background-color: var(--ax-bg-strong-pressed);
633
+ color: var(--ax-text-contrast);
635
634
  }
636
635
 
637
636
  .navds-chips__toggle--neutral[data-pressed="true"]:hover {
638
- background-color: var(--ax-bg-neutral-strong-hover);
637
+ background-color: var(--ax-bg-strong-hover);
639
638
  }
640
639
 
641
640
  .navds-chips--medium .navds-chips__toggle--with-checkmark {
642
- padding-left: var(--ax-spacing-1-alt);
641
+ padding-left: var(--ax-space-6);
643
642
  }
644
643
 
645
644
  .navds-chips__removable {
@@ -656,12 +655,12 @@
656
655
  }
657
656
 
658
657
  .navds-chips__removable--neutral {
659
- background: var(--ax-bg-neutral-strong-pressed);
660
- color: var(--ax-text-neutral-contrast);
658
+ background: var(--ax-bg-strong-pressed);
659
+ color: var(--ax-text-contrast);
661
660
  }
662
661
 
663
662
  .navds-chips__removable--neutral:hover {
664
- background: var(--ax-bg-neutral-strong-hover);
663
+ background: var(--ax-bg-strong-hover);
665
664
  }
666
665
 
667
666
  .navds-chips__removable-icon {
@@ -674,11 +673,11 @@
674
673
  }
675
674
 
676
675
  .navds-chips--icon-left {
677
- padding-left: var(--ax-spacing-1-alt);
676
+ padding-left: var(--ax-space-6);
678
677
  }
679
678
 
680
679
  .navds-chips--icon-right {
681
- padding-right: var(--ax-spacing-1-alt);
680
+ padding-right: var(--ax-space-6);
682
681
  }
683
682
 
684
683
  @media (forced-colors: active) {
@@ -715,7 +714,7 @@
715
714
  }
716
715
 
717
716
  .navds-fieldset > :not(:first-child, :empty) {
718
- margin-top: var(--ax-spacing-2);
717
+ margin-top: var(--ax-space-8);
719
718
  }
720
719
 
721
720
  .navds-fieldset__description {
@@ -750,16 +749,16 @@
750
749
 
751
750
  .navds-dropzone__area {
752
751
  --__axc-dropzone-background: var(--ax-bg-input);
753
- --__axc-dropzone-icon-padding: var(--ax-spacing-2);
752
+ --__axc-dropzone-icon-padding: var(--ax-space-8);
754
753
  --__axc-dropzone-animation-length-long: .4s;
755
754
  --__axc-dropzone-animation-length-short: .25s;
756
755
  --__axc-dropzone-animation-ease-out: cubic-bezier(.3, 1, .3, 1);
757
756
  --__axc-dropzone-animation-over-under: cubic-bezier(.3, 1, .3, 1);
758
757
  align-items: center;
759
- gap: var(--ax-spacing-4);
758
+ gap: var(--ax-space-16);
760
759
  text-align: center;
761
760
  width: 100%;
762
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
761
+ padding: var(--ax-space-16) var(--ax-space-20);
763
762
  border: 1px dashed var(--ax-border-default);
764
763
  border-radius: var(--ax-border-radius-xlarge);
765
764
  background-color: var(--__axc-dropzone-background);
@@ -833,13 +832,13 @@
833
832
  }
834
833
 
835
834
  .navds-dropzone--error > .navds-dropzone__area {
836
- outline: 2px solid var(--ax-border-danger);
835
+ outline: 2px solid var(--ax-border-danger-strong);
837
836
  outline-offset: -1px;
838
837
  border-color: rgba(0, 0, 0, 0);
839
838
  }
840
839
 
841
840
  .navds-dropzone__area-release {
842
- top: var(--ax-spacing-4);
841
+ top: var(--ax-space-16);
843
842
  z-index: 1;
844
843
  pointer-events: none;
845
844
  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);
@@ -850,7 +849,7 @@
850
849
  .navds-dropzone__area-release__icon {
851
850
  padding: var(--__axc-dropzone-icon-padding);
852
851
  border-radius: var(--ax-border-radius-full);
853
- background-color: var(--ax-bg-neutral-moderateA);
852
+ background-color: var(--ax-bg-moderateA);
854
853
  transition: background-color .3s var(--__axc-dropzone-animation-ease-out), font-size .3s var(--__axc-dropzone-animation-ease-out);
855
854
  font-size: 1.5rem;
856
855
  display: grid;
@@ -879,7 +878,7 @@
879
878
  .navds-dropzone__area-disabled {
880
879
  color: var(--ax-text-subtle);
881
880
  align-items: center;
882
- gap: var(--ax-spacing-2);
881
+ gap: var(--ax-space-8);
883
882
  flex-direction: column;
884
883
  display: flex;
885
884
  }
@@ -895,24 +894,24 @@
895
894
  border: 1px solid var(--ax-border-subtleA);
896
895
  outline-offset: -1px;
897
896
  border-radius: var(--ax-border-radius-xlarge);
898
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
899
- gap: var(--ax-spacing-3);
897
+ padding: var(--ax-space-12) var(--ax-space-16);
898
+ gap: var(--ax-space-12);
900
899
  align-items: flex-start;
901
900
  transition: outline-color .25s cubic-bezier(0, .3, .15, 1);
902
901
  display: flex;
903
902
  }
904
903
 
905
904
  .navds-file-item--error > .navds-file-item__inner {
906
- outline: 2px solid var(--ax-border-danger);
905
+ outline: 2px solid var(--ax-border-danger-strong);
907
906
  }
908
907
 
909
908
  .navds-file-item__icon {
910
- background-color: var(--ax-bg-neutral-moderateA);
909
+ background-color: var(--ax-bg-moderateA);
911
910
  color: var(--ax-text-default);
912
911
  border-radius: var(--ax-border-radius-full);
913
912
  min-width: 2.5rem;
914
913
  min-height: 2.5rem;
915
- margin-top: var(--ax-spacing-05);
914
+ margin-top: var(--ax-space-2);
916
915
  place-content: center;
917
916
  transition: background-color .25s cubic-bezier(0, .3, .15, 1);
918
917
  display: grid;
@@ -946,12 +945,12 @@
946
945
  }
947
946
 
948
947
  .navds-file-item__error .navds-file-item__error {
949
- padding-top: var(--ax-spacing-1);
948
+ padding-top: var(--ax-space-4);
950
949
  grid-template-rows: 1fr;
951
950
  }
952
951
 
953
952
  .navds-file-item__error-content {
954
- gap: var(--ax-spacing-1);
953
+ gap: var(--ax-space-4);
955
954
  min-height: 0;
956
955
  display: flex;
957
956
  }
@@ -964,7 +963,7 @@
964
963
 
965
964
  .navds-form-field {
966
965
  justify-items: start;
967
- gap: var(--ax-spacing-2);
966
+ gap: var(--ax-space-8);
968
967
  display: grid;
969
968
  }
970
969
 
@@ -991,8 +990,8 @@
991
990
  }
992
991
 
993
992
  .navds-form-field__readonly-icon {
994
- margin-top: var(--ax-spacing-05);
995
- margin-right: var(--ax-spacing-1);
993
+ margin-top: var(--ax-space-2);
994
+ margin-right: var(--ax-space-4);
996
995
  flex-shrink: 0;
997
996
  align-self: flex-start;
998
997
  }
@@ -1005,7 +1004,7 @@
1005
1004
 
1006
1005
  .navds-error-summary {
1007
1006
  background-color: var(--ax-bg-default);
1008
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
1007
+ padding: var(--ax-space-16) var(--ax-space-20);
1009
1008
  border: 4px solid var(--ax-border-danger);
1010
1009
  border-radius: var(--ax-border-radius-xlarge);
1011
1010
  outline-offset: 2px;
@@ -1022,21 +1021,21 @@
1022
1021
  }
1023
1022
 
1024
1023
  .navds-error-summary--small {
1025
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
1024
+ padding: var(--ax-space-12) var(--ax-space-16);
1026
1025
  }
1027
1026
 
1028
1027
  .navds-error-summary--small .navds-error-summary__heading {
1029
- scroll-margin-top: var(--ax-spacing-4);
1028
+ scroll-margin-top: var(--ax-space-16);
1030
1029
  }
1031
1030
 
1032
1031
  .navds-error-summary--small > .navds-error-summary__list {
1033
- margin: var(--ax-spacing-2) 0;
1034
- gap: var(--ax-spacing-2);
1035
- padding-left: var(--ax-spacing-5);
1032
+ margin: var(--ax-space-8) 0;
1033
+ gap: var(--ax-space-8);
1034
+ padding-left: var(--ax-space-20);
1036
1035
  }
1037
1036
 
1038
1037
  .navds-error-summary__heading {
1039
- scroll-margin-top: var(--ax-spacing-6);
1038
+ scroll-margin-top: var(--ax-space-24);
1040
1039
  }
1041
1040
 
1042
1041
  .navds-error-summary__heading:focus {
@@ -1044,9 +1043,9 @@
1044
1043
  }
1045
1044
 
1046
1045
  .navds-error-summary__list {
1047
- margin: var(--ax-spacing-3) 0;
1048
- gap: var(--ax-spacing-3);
1049
- padding-left: var(--ax-spacing-6);
1046
+ margin: var(--ax-space-12) 0;
1047
+ gap: var(--ax-space-12);
1048
+ padding-left: var(--ax-space-24);
1050
1049
  list-style: inherit;
1051
1050
  flex-direction: column;
1052
1051
  display: flex;
@@ -1124,10 +1123,10 @@
1124
1123
  }
1125
1124
 
1126
1125
  .navds-checkbox__label, .navds-radio__label {
1127
- padding: var(--ax-spacing-3) 0;
1126
+ padding: var(--ax-space-12) 0;
1128
1127
  cursor: pointer;
1129
- gap: var(--ax-spacing-2);
1130
- --__axc-radio-checkbox-readonly-bg: var(--ax-bg-neutral-moderate);
1128
+ gap: var(--ax-space-8);
1129
+ --__axc-radio-checkbox-readonly-bg: var(--ax-bg-moderate);
1131
1130
  --__axc-radio-checkbox-readonly-border: var(--ax-border-subtle);
1132
1131
  display: flex;
1133
1132
  }
@@ -1160,7 +1159,7 @@
1160
1159
  }
1161
1160
 
1162
1161
  .navds-checkbox--small > .navds-checkbox__label, .navds-radio--small > .navds-radio__label {
1163
- padding: var(--ax-spacing-1-alt) 0;
1162
+ padding: var(--ax-space-6) 0;
1164
1163
  }
1165
1164
 
1166
1165
  .navds-checkbox--small > .navds-checkbox__label:before, .navds-radio--small > .navds-radio__label:before {
@@ -1175,7 +1174,7 @@
1175
1174
 
1176
1175
  .navds-checkbox__input:indeterminate + .navds-checkbox__label:after {
1177
1176
  content: "";
1178
- transform: translate(var(--ax-spacing-1-alt), -50%);
1177
+ transform: translate(var(--ax-space-6), -50%);
1179
1178
  background-color: var(--ax-bg-default);
1180
1179
  border-radius: 1px;
1181
1180
  flex-shrink: 0;
@@ -1206,7 +1205,7 @@
1206
1205
  .navds-checkbox__input:checked + .navds-checkbox__label > .navds-checkbox__icon {
1207
1206
  color: var(--ax-bg-default);
1208
1207
  height: 1.5rem;
1209
- transform: translate(var(--ax-spacing-1-alt));
1208
+ transform: translate(var(--ax-space-6));
1210
1209
  pointer-events: none;
1211
1210
  align-items: center;
1212
1211
  display: flex;
@@ -1236,7 +1235,7 @@
1236
1235
  }
1237
1236
 
1238
1237
  .navds-checkbox__input:hover:not(:disabled) + .navds-checkbox__label, .navds-radio__input:hover:not(:disabled) + .navds-radio__label {
1239
- color: var(--ax-text-accent-strong);
1238
+ color: var(--ax-text-accent);
1240
1239
  }
1241
1240
 
1242
1241
  .navds-checkbox__input:hover:not(:disabled, :checked, :indeterminate) + .navds-checkbox__label:before, .navds-radio__input:hover:not(:disabled, :checked) + .navds-radio__label:before {
@@ -1245,12 +1244,11 @@
1245
1244
  }
1246
1245
 
1247
1246
  .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 {
1248
- border-color: var(--ax-border-danger);
1247
+ border-color: var(--ax-border-danger-strong);
1249
1248
  }
1250
1249
 
1251
1250
  .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 {
1252
1251
  background-color: var(--ax-bg-danger-moderate-hoverA);
1253
- border-color: var(--ax-border-danger-strong);
1254
1252
  }
1255
1253
 
1256
1254
  .navds-checkbox--error > .navds-checkbox__input:is(:checked, :indeterminate):not(:disabled) + .navds-checkbox__label:before {
@@ -1297,8 +1295,8 @@
1297
1295
  }
1298
1296
 
1299
1297
  .navds-radio--readonly > .navds-radio__input:checked + .navds-radio__label:before {
1300
- background-color: var(--ax-bg-neutral-strong);
1301
- box-shadow: inset 0 0 0 2px var(--ax-border-subtle), inset 0 0 0 8px var(--ax-bg-neutral-moderate);
1298
+ background-color: var(--ax-bg-strong);
1299
+ box-shadow: inset 0 0 0 2px var(--ax-border-subtle), inset 0 0 0 8px var(--ax-bg-moderate);
1302
1300
  border-width: 0;
1303
1301
  }
1304
1302
 
@@ -1368,8 +1366,8 @@
1368
1366
  box-sizing: border-box;
1369
1367
  width: 100%;
1370
1368
  min-height: 3rem;
1371
- padding: var(--ax-spacing-2);
1372
- padding-right: var(--ax-spacing-10);
1369
+ padding: var(--ax-space-8);
1370
+ padding-right: var(--ax-space-40);
1373
1371
  display: inline-block;
1374
1372
  position: relative;
1375
1373
  }
@@ -1401,7 +1399,7 @@
1401
1399
  }
1402
1400
 
1403
1401
  .navds-select__chevron {
1404
- right: var(--ax-spacing-2);
1402
+ right: var(--ax-space-8);
1405
1403
  pointer-events: none;
1406
1404
  color: var(--ax-text-default);
1407
1405
  align-self: center;
@@ -1420,12 +1418,7 @@
1420
1418
  padding-block: 0;
1421
1419
  }
1422
1420
 
1423
- .navds-select--error > * select {
1424
- box-shadow: 0 0 0 1px var(--ax-border-danger);
1425
- border-color: var(--ax-border-danger);
1426
- }
1427
-
1428
- .navds-select--error > * select:hover, .navds-select--error > * select:focus {
1421
+ .navds-select--error > * select, .navds-select--error > * select:hover, .navds-select--error > * select:focus {
1429
1422
  box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
1430
1423
  border-color: var(--ax-border-danger-strong);
1431
1424
  }
@@ -1450,8 +1443,8 @@
1450
1443
  }
1451
1444
 
1452
1445
  .navds-select--readonly .navds-select__input {
1453
- background-color: var(--ax-bg-neutral-moderate);
1454
- border-color: var(--ax-border-neutral-subtleA);
1446
+ background-color: var(--ax-bg-moderate);
1447
+ border-color: var(--ax-border-subtleA);
1455
1448
  cursor: default;
1456
1449
  }
1457
1450
 
@@ -1509,11 +1502,11 @@
1509
1502
  }
1510
1503
 
1511
1504
  .navds-switch--small .navds-switch__content {
1512
- padding: calc(var(--ax-spacing-2) - var(--ax-spacing-05)) 0 calc(var(--ax-spacing-2) - var(--ax-spacing-05)) 3.25rem;
1505
+ padding: calc(var(--ax-space-8) - var(--ax-space-2)) 0 calc(var(--ax-space-8) - var(--ax-space-2)) 3.25rem;
1513
1506
  }
1514
1507
 
1515
1508
  .navds-switch--right.navds-switch--small .navds-switch__content {
1516
- padding: calc(var(--ax-spacing-2) - var(--ax-spacing-05)) 3.25rem calc(var(--ax-spacing-2) - var(--ax-spacing-05)) 0;
1509
+ padding: calc(var(--ax-space-8) - var(--ax-space-2)) 3.25rem calc(var(--ax-space-8) - var(--ax-space-2)) 0;
1517
1510
  }
1518
1511
 
1519
1512
  .navds-switch--with-description {
@@ -1521,7 +1514,7 @@
1521
1514
  }
1522
1515
 
1523
1516
  .navds-switch__input:hover ~ .navds-switch__label-wrapper, .navds-switch__label-wrapper:hover {
1524
- color: var(--ax-text-accent-strong);
1517
+ color: var(--ax-text-accent);
1525
1518
  }
1526
1519
 
1527
1520
  .navds-switch__input:disabled:hover ~ .navds-switch__label-wrapper {
@@ -1532,7 +1525,7 @@
1532
1525
  background-color: var(--ax-bg-input);
1533
1526
  width: 2.75rem;
1534
1527
  height: 1.5rem;
1535
- top: var(--ax-spacing-3);
1528
+ top: var(--ax-space-12);
1536
1529
  border-radius: var(--ax-border-radius-full);
1537
1530
  border: 2px solid var(--ax-border-default);
1538
1531
  transition-property: background-color, border-color;
@@ -1543,7 +1536,7 @@
1543
1536
  }
1544
1537
 
1545
1538
  .navds-switch--small > .navds-switch__track {
1546
- top: var(--ax-spacing-1);
1539
+ top: var(--ax-space-4);
1547
1540
  }
1548
1541
 
1549
1542
  .navds-switch__input:checked ~ .navds-switch__track {
@@ -1572,7 +1565,7 @@
1572
1565
  }
1573
1566
 
1574
1567
  .navds-switch__thumb {
1575
- background-color: var(--ax-bg-neutral-strong);
1568
+ background-color: var(--ax-bg-strong);
1576
1569
  border-radius: var(--ax-border-radius-full);
1577
1570
  justify-content: center;
1578
1571
  align-items: center;
@@ -1588,7 +1581,7 @@
1588
1581
 
1589
1582
  .navds-switch__input:checked ~ .navds-switch__track > .navds-switch__thumb {
1590
1583
  background-color: var(--ax-bg-raised);
1591
- color: var(--ax-text-accent-strong);
1584
+ color: var(--ax-text-accent);
1592
1585
  width: 1.25rem;
1593
1586
  height: 1.25rem;
1594
1587
  top: 0;
@@ -1639,8 +1632,8 @@
1639
1632
  }
1640
1633
 
1641
1634
  .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 {
1642
- background-color: var(--ax-bg-neutral-moderate);
1643
- border-color: var(--ax-border-neutral-subtleA);
1635
+ background-color: var(--ax-bg-moderate);
1636
+ border-color: var(--ax-border-subtleA);
1644
1637
  }
1645
1638
 
1646
1639
  .navds-switch--readonly > .navds-switch__label-wrapper, .navds-switch--readonly > .navds-switch__input {
@@ -1656,12 +1649,12 @@
1656
1649
  }
1657
1650
 
1658
1651
  .navds-switch--readonly .navds-switch__thumb {
1659
- background-color: var(--ax-bg-neutral-strong);
1652
+ background-color: var(--ax-bg-strong);
1660
1653
  }
1661
1654
 
1662
1655
  .navds-switch--readonly > .navds-switch__input:checked ~ .navds-switch__track > .navds-switch__thumb {
1663
- background-color: var(--ax-bg-neutral-strong);
1664
- color: var(--ax-text-neutral-contrast);
1656
+ background-color: var(--ax-bg-strong);
1657
+ color: var(--ax-text-contrast);
1665
1658
  }
1666
1659
 
1667
1660
  @media (hover: hover) and (pointer: fine) {
@@ -1711,7 +1704,7 @@
1711
1704
 
1712
1705
  .navds-text-field__input {
1713
1706
  appearance: none;
1714
- padding: var(--ax-spacing-2);
1707
+ padding: var(--ax-space-8);
1715
1708
  background: var(--ax-bg-input);
1716
1709
  border-radius: var(--ax-border-radius-medium);
1717
1710
  border: 1px solid var(--ax-border-default);
@@ -1737,7 +1730,7 @@
1737
1730
  }
1738
1731
 
1739
1732
  .navds-text-field__input::placeholder {
1740
- color: var(--ax-text-neutral);
1733
+ color: var(--ax-text-subtle);
1741
1734
  }
1742
1735
 
1743
1736
  .navds-text-field__input[size] {
@@ -1745,18 +1738,18 @@
1745
1738
  }
1746
1739
 
1747
1740
  .navds-form-field--small .navds-text-field__input {
1748
- padding: 0 var(--ax-spacing-2);
1741
+ padding: 0 var(--ax-space-8);
1749
1742
  min-height: 2rem;
1750
1743
  }
1751
1744
 
1752
1745
  .navds-text-field--error .navds-text-field__input:not(:disabled) {
1753
- border-color: var(--ax-border-danger);
1754
- box-shadow: 0 0 0 1px var(--ax-border-danger);
1746
+ border-color: var(--ax-border-danger-strong);
1747
+ box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
1755
1748
  }
1756
1749
 
1757
1750
  .navds-text-field--readonly .navds-text-field__input {
1758
- background-color: var(--ax-bg-neutral-moderate);
1759
- border-color: var(--ax-border-neutral-subtleA);
1751
+ background-color: var(--ax-bg-moderate);
1752
+ border-color: var(--ax-border-subtleA);
1760
1753
  cursor: default;
1761
1754
  }
1762
1755
 
@@ -1786,7 +1779,7 @@
1786
1779
  .navds-textarea__input {
1787
1780
  height: var(--__axc-textarea-height);
1788
1781
  appearance: none;
1789
- padding: var(--ax-spacing-2);
1782
+ padding: var(--ax-space-8);
1790
1783
  background-color: var(--ax-bg-input);
1791
1784
  border-radius: var(--ax-border-radius-medium);
1792
1785
  border: 1px solid var(--ax-border-default);
@@ -1817,12 +1810,12 @@
1817
1810
  }
1818
1811
 
1819
1812
  .navds-form-field--small .navds-textarea__input {
1820
- padding: var(--ax-spacing-1-alt);
1813
+ padding: var(--ax-space-6);
1821
1814
  }
1822
1815
 
1823
1816
  .navds-textarea--readonly .navds-textarea__input {
1824
- background-color: var(--ax-bg-neutral-moderate);
1825
- border-color: var(--ax-border-neutral-subtleA);
1817
+ background-color: var(--ax-bg-moderate);
1818
+ border-color: var(--ax-border-subtleA);
1826
1819
  cursor: default;
1827
1820
  }
1828
1821
 
@@ -1871,8 +1864,8 @@
1871
1864
  }
1872
1865
 
1873
1866
  .navds-textarea--error .navds-textarea__input:not(:disabled) {
1874
- box-shadow: 0 0 0 1px var(--ax-border-danger);
1875
- border-color: var(--ax-border-danger);
1867
+ box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
1868
+ border-color: var(--ax-border-danger-strong);
1876
1869
  }
1877
1870
 
1878
1871
  @media (forced-colors: active) {
@@ -1913,7 +1906,7 @@
1913
1906
  }
1914
1907
 
1915
1908
  .navds-search__input {
1916
- padding-right: var(--ax-spacing-10);
1909
+ padding-right: var(--ax-space-40);
1917
1910
  }
1918
1911
 
1919
1912
  .navds-search__input:focus-visible {
@@ -1927,28 +1920,28 @@
1927
1920
  }
1928
1921
 
1929
1922
  .navds-search__input--simple {
1930
- padding-left: var(--ax-spacing-10);
1923
+ padding-left: var(--ax-space-40);
1931
1924
  }
1932
1925
 
1933
1926
  .navds-form-field--small .navds-search__input {
1934
- padding-right: var(--ax-spacing-7);
1927
+ padding-right: var(--ax-space-28);
1935
1928
  }
1936
1929
 
1937
1930
  .navds-form-field--small .navds-search__input--simple {
1938
- padding-left: var(--ax-spacing-7);
1931
+ padding-left: var(--ax-space-28);
1939
1932
  }
1940
1933
 
1941
1934
  .navds-form-field--small .navds-search__search-icon {
1942
- left: var(--ax-spacing-1);
1935
+ left: var(--ax-space-4);
1943
1936
  font-size: 1.25rem;
1944
1937
  }
1945
1938
 
1946
1939
  .navds-form-field--small .navds-search__button-clear {
1947
- right: var(--ax-spacing-1);
1940
+ right: var(--ax-space-4);
1948
1941
  }
1949
1942
 
1950
1943
  .navds-search__search-icon {
1951
- left: var(--ax-spacing-2);
1944
+ left: var(--ax-space-8);
1952
1945
  pointer-events: none;
1953
1946
  font-size: 1.5rem;
1954
1947
  position: absolute;
@@ -1961,7 +1954,7 @@
1961
1954
  }
1962
1955
 
1963
1956
  .navds-search__button-clear {
1964
- right: var(--ax-spacing-2);
1957
+ right: var(--ax-space-8);
1965
1958
  position: absolute;
1966
1959
  top: 50%;
1967
1960
  transform: translateY(-50%);
@@ -1996,12 +1989,12 @@
1996
1989
  }
1997
1990
 
1998
1991
  .navds-search--error .navds-search__input:not(:disabled) {
1999
- border-color: var(--ax-border-danger);
2000
- box-shadow: inset -2px 0 0 0 var(--ax-border-danger), inset 0 0 0 1px var(--ax-border-danger);
1992
+ border-color: var(--ax-border-danger-strong);
1993
+ box-shadow: inset -2px 0 0 0 var(--ax-border-danger-strong), inset 0 0 0 1px var(--ax-border-danger-strong);
2001
1994
  }
2002
1995
 
2003
1996
  .navds-search--error .navds-search__input:not(:disabled).navds-search__input--simple {
2004
- box-shadow: inset 0 0 0 1px var(--ax-border-danger);
1997
+ box-shadow: inset 0 0 0 1px var(--ax-border-danger-strong);
2005
1998
  }
2006
1999
 
2007
2000
  .navds-search__input:focus-visible, .navds-search__button-search:focus-visible {
@@ -2015,9 +2008,9 @@
2015
2008
 
2016
2009
  .navds-combobox__wrapper {
2017
2010
  --__axc-combobox-icon-size: 1.5rem;
2018
- --__axc-combobox-wrapper-inner-padding: var(--ax-spacing-2);
2019
- --__axc-combobox-list-item-padding-block: var(--ax-spacing-3);
2020
- --__axc-combobox-list-item-padding-inline: var(--ax-spacing-3);
2011
+ --__axc-combobox-wrapper-inner-padding: var(--ax-space-8);
2012
+ --__axc-combobox-list-item-padding-block: var(--ax-space-12);
2013
+ --__axc-combobox-list-item-padding-inline: var(--ax-space-12);
2021
2014
  --__axc-combobox-border-width: 1px;
2022
2015
  --__axc-combobox-input-height: 2rem;
2023
2016
  border-radius: var(--ax-border-radius-medium);
@@ -2028,14 +2021,14 @@
2028
2021
  }
2029
2022
 
2030
2023
  .navds-form-field:not(:is(.navds-combobox--disabled, .navds-combobox--readonly)) .navds-combobox__wrapper:hover {
2031
- border-color: var(--ax-border-focus);
2024
+ border-color: var(--ax-border-accent-strong);
2032
2025
  }
2033
2026
 
2034
2027
  .navds-form-field--small .navds-combobox__wrapper {
2035
2028
  --__axc-combobox-icon-size: 1.25rem;
2036
- --__axc-combobox-wrapper-inner-padding: var(--ax-spacing-1);
2037
- --__axc-combobox-list-item-padding-block: var(--ax-spacing-1-alt);
2038
- --__axc-combobox-list-item-padding-inline: var(--ax-spacing-2);
2029
+ --__axc-combobox-wrapper-inner-padding: var(--ax-space-4);
2030
+ --__axc-combobox-list-item-padding-block: var(--ax-space-6);
2031
+ --__axc-combobox-list-item-padding-inline: var(--ax-space-8);
2039
2032
  --__axc-combobox-input-height: 1.5rem;
2040
2033
  }
2041
2034
 
@@ -2043,6 +2036,10 @@
2043
2036
  opacity: var(--ax-opacity-disabled);
2044
2037
  }
2045
2038
 
2039
+ .navds-combobox--disabled .navds-combobox__wrapper:hover {
2040
+ border-color: var(--ax-border-default);
2041
+ }
2042
+
2046
2043
  .navds-combobox--disabled .navds-combobox__wrapper :hover {
2047
2044
  cursor: not-allowed;
2048
2045
  }
@@ -2056,11 +2053,11 @@
2056
2053
  }
2057
2054
 
2058
2055
  .navds-combobox--readonly .navds-combobox__selected-options .navds-chips__chip {
2059
- background-color: var(--ax-bg-neutral-moderateA);
2056
+ background-color: var(--ax-bg-moderateA);
2060
2057
  }
2061
2058
 
2062
2059
  .navds-combobox--readonly .navds-combobox__button-toggle-list {
2063
- color: var(--ax-bg-neutral-moderate);
2060
+ color: var(--ax-bg-moderate);
2064
2061
  }
2065
2062
 
2066
2063
  .navds-combobox--readonly .navds-combobox__wrapper {
@@ -2069,7 +2066,7 @@
2069
2066
  }
2070
2067
 
2071
2068
  .navds-combobox--readonly .navds-text-field__input, .navds-combobox--readonly .navds-combobox__input {
2072
- background-color: var(--ax-bg-neutral-moderate);
2069
+ background-color: var(--ax-bg-moderate);
2073
2070
  }
2074
2071
 
2075
2072
  .navds-combobox__button-toggle-list svg, .navds-combobox__list svg {
@@ -2083,9 +2080,9 @@
2083
2080
  }
2084
2081
 
2085
2082
  .navds-combobox__wrapper-inner:has(.navds-combobox__input:focus-visible) {
2086
- outline: 2px solid var(--ax-border-focus);
2087
- outline-offset: 2px;
2088
- border-color: var(--ax-border-focus);
2083
+ outline: 3px solid var(--ax-border-focus);
2084
+ outline-offset: 3px;
2085
+ border-color: var(--ax-border-accent-strong);
2089
2086
  }
2090
2087
 
2091
2088
  .navds-combobox__wrapper-inner:has(.navds-combobox__input:focus-visible).navds-combobox__wrapper-inner--virtually-unfocused {
@@ -2117,13 +2114,17 @@
2117
2114
  cursor: text;
2118
2115
  }
2119
2116
 
2117
+ .navds-combobox--disabled .navds-combobox__wrapper-inner:hover {
2118
+ border-color: var(--ax-border-default);
2119
+ }
2120
+
2120
2121
  .navds-combobox--error .navds-combobox__wrapper-inner {
2121
- border-color: var(--ax-border-danger);
2122
- box-shadow: 0 0 0 1px var(--ax-border-danger);
2122
+ border-color: var(--ax-border-danger-strong);
2123
+ box-shadow: 0 0 0 1px var(--ax-border-danger-strong);
2123
2124
  }
2124
2125
 
2125
2126
  .navds-combobox--error .navds-combobox__wrapper-inner:has(.navds-combobox__input:focus-visible) {
2126
- border-color: var(--ax-border-danger);
2127
+ border-color: var(--ax-border-danger-strong);
2127
2128
  }
2128
2129
 
2129
2130
  .navds-combobox__selected-options {
@@ -2176,7 +2177,7 @@
2176
2177
  }
2177
2178
 
2178
2179
  .navds-combobox__selected-options > li:only-child > .navds-combobox__input {
2179
- margin-left: var(--ax-spacing-1);
2180
+ margin-left: var(--ax-space-4);
2180
2181
  }
2181
2182
 
2182
2183
  .navds-combobox__input--hide-caret {
@@ -2221,10 +2222,10 @@
2221
2222
 
2222
2223
  .navds-combobox__list {
2223
2224
  z-index: 10;
2224
- max-height: 290px;
2225
+ max-height: 316px;
2225
2226
  left: 0;
2226
2227
  right: 0;
2227
- top: calc(100% + var(--ax-spacing-2));
2228
+ top: calc(100% + var(--ax-space-8));
2228
2229
  border: 1px solid var(--ax-border-subtleA);
2229
2230
  border-radius: var(--ax-border-radius-large);
2230
2231
  background-color: var(--ax-bg-raised);
@@ -2249,8 +2250,8 @@
2249
2250
  padding-block: var(--__axc-combobox-list-item-padding-block);
2250
2251
  padding-inline: var(--__axc-combobox-list-item-padding-inline);
2251
2252
  border-radius: var(--ax-border-radius-medium);
2252
- margin-inline: var(--ax-spacing-2);
2253
- margin-block: var(--ax-spacing-1);
2253
+ margin-inline: var(--ax-space-8);
2254
+ margin-block: var(--ax-space-2);
2254
2255
  border: 0;
2255
2256
  justify-content: space-between;
2256
2257
  align-items: center;
@@ -2268,9 +2269,9 @@
2268
2269
  }
2269
2270
 
2270
2271
  .navds-combobox__list-item--max-selected {
2271
- background-color: var(--ax-bg-neutral-moderateA);
2272
- border-bottom: 1px solid var(--ax-border-neutral-subtle);
2273
- padding-block: var(--ax-spacing-2);
2272
+ background-color: var(--ax-bg-moderateA);
2273
+ border-bottom: 1px solid var(--ax-border-subtle);
2274
+ padding-block: var(--ax-space-8);
2274
2275
  line-height: var(--ax-font-line-height-large);
2275
2276
  border-radius: 0;
2276
2277
  margin: 0;
@@ -2282,7 +2283,7 @@
2282
2283
  gap: inherit;
2283
2284
  background-color: inherit;
2284
2285
  padding: 0;
2285
- padding-block: var(--ax-spacing-1);
2286
+ padding-block: var(--ax-space-4);
2286
2287
  align-items: stretch;
2287
2288
  margin: 0;
2288
2289
  list-style: none;
@@ -2291,7 +2292,6 @@
2291
2292
  .navds-combobox__list-item--focus {
2292
2293
  cursor: pointer;
2293
2294
  outline: 2px solid var(--ax-border-focus);
2294
- outline-offset: 2px;
2295
2295
  }
2296
2296
 
2297
2297
  .navds-combobox__list-item {
@@ -2306,11 +2306,12 @@
2306
2306
 
2307
2307
  .navds-combobox__list-item mark {
2308
2308
  font-weight: var(--ax-font-weight-bold);
2309
+ color: var(--ax-text-default);
2309
2310
  background-color: rgba(0, 0, 0, 0);
2310
2311
  }
2311
2312
 
2312
2313
  .navds-combobox__list-item svg {
2313
- color: var(--ax-text-accent);
2314
+ color: var(--ax-text-default);
2314
2315
  }
2315
2316
 
2316
2317
  .navds-combobox__list-item--selected {
@@ -2326,11 +2327,10 @@
2326
2327
  background: var(--ax-bg-accent-moderateA);
2327
2328
  cursor: pointer;
2328
2329
  margin: 0;
2329
- margin-block: calc(var(--ax-spacing-1) * -1);
2330
- padding-block: var(--ax-spacing-4);
2331
2330
  border-radius: 0;
2332
2331
  justify-content: flex-start;
2333
2332
  gap: .25rem;
2333
+ margin-block-start: calc(var(--ax-space-4) * -1);
2334
2334
  }
2335
2335
 
2336
2336
  .navds-combobox__list-item--new-option svg {
@@ -2338,6 +2338,7 @@
2338
2338
  }
2339
2339
 
2340
2340
  .navds-combobox__list-item--new-option:only-child {
2341
+ margin-block: calc(var(--ax-space-4) * -1);
2341
2342
  border: none;
2342
2343
  }
2343
2344
 
@@ -2362,7 +2363,7 @@
2362
2363
  }
2363
2364
 
2364
2365
  .navds-combobox__selected-options {
2365
- gap: var(--ax-spacing-1);
2366
+ gap: var(--ax-space-4);
2366
2367
  }
2367
2368
  }
2368
2369
 
@@ -2432,29 +2433,29 @@
2432
2433
  }
2433
2434
 
2434
2435
  .navds-form-summary {
2435
- border: 1px solid var(--ax-border-neutral-subtleA);
2436
+ border: 1px solid var(--ax-border-subtleA);
2436
2437
  border-radius: var(--ax-border-radius-xlarge);
2437
2438
  background: var(--ax-bg-raised);
2438
2439
  overflow: hidden;
2439
2440
  }
2440
2441
 
2441
2442
  .navds-form-summary__header {
2442
- background: var(--ax-bg-neutral-moderateA);
2443
- padding: var(--ax-spacing-4) var(--ax-spacing-6);
2443
+ background: var(--ax-bg-moderateA);
2444
+ padding: var(--ax-space-16) var(--ax-space-24);
2444
2445
  justify-content: space-between;
2445
- gap: 0 var(--ax-spacing-3);
2446
+ gap: 0 var(--ax-space-12);
2446
2447
  display: flex;
2447
2448
  }
2448
2449
 
2449
2450
  @media (max-width: 479px) {
2450
2451
  .navds-form-summary__header {
2451
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
2452
+ padding: var(--ax-space-12) var(--ax-space-16);
2452
2453
  flex-direction: column;
2453
2454
  }
2454
2455
  }
2455
2456
 
2456
2457
  .navds-form-summary__edit {
2457
- margin-top: var(--ax-spacing-1);
2458
+ margin-top: var(--ax-space-4);
2458
2459
  flex-shrink: 0;
2459
2460
  align-self: flex-start;
2460
2461
  }
@@ -2464,24 +2465,24 @@
2464
2465
  }
2465
2466
 
2466
2467
  .navds-form-summary__answers {
2467
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
2468
+ padding: var(--ax-space-16) var(--ax-space-20);
2468
2469
  margin: 0;
2469
2470
  }
2470
2471
 
2471
2472
  @media (max-width: 479px) {
2472
2473
  .navds-form-summary__answers {
2473
- padding: var(--ax-spacing-4);
2474
+ padding: var(--ax-space-16);
2474
2475
  }
2475
2476
  }
2476
2477
 
2477
2478
  .navds-form-summary__answer:not(:last-child) {
2478
- margin-bottom: var(--ax-spacing-4);
2479
- padding-bottom: var(--ax-spacing-4);
2479
+ margin-bottom: var(--ax-space-16);
2480
+ padding-bottom: var(--ax-space-16);
2480
2481
  border-bottom: 1px solid var(--ax-border-subtleA);
2481
2482
  }
2482
2483
 
2483
2484
  .navds-form-summary__answer:has(.navds-form-summary__answer) {
2484
- padding-bottom: var(--ax-spacing-6);
2485
+ padding-bottom: var(--ax-space-24);
2485
2486
  }
2486
2487
 
2487
2488
  .navds-form-summary__answer:has(.navds-form-summary__answer):last-child {
@@ -2490,22 +2491,22 @@
2490
2491
 
2491
2492
  @media (max-width: 479px) {
2492
2493
  .navds-form-summary__answer:not(:last-child) {
2493
- margin-bottom: var(--ax-spacing-3);
2494
- padding-bottom: var(--ax-spacing-3);
2494
+ margin-bottom: var(--ax-space-12);
2495
+ padding-bottom: var(--ax-space-12);
2495
2496
  }
2496
2497
 
2497
2498
  .navds-form-summary__answer:has(.navds-form-summary__answer) {
2498
- padding-bottom: var(--ax-spacing-5);
2499
+ padding-bottom: var(--ax-space-20);
2499
2500
  }
2500
2501
  }
2501
2502
 
2502
2503
  .navds-form-summary__value:first-of-type {
2503
- margin-top: var(--ax-spacing-1);
2504
+ margin-top: var(--ax-space-4);
2504
2505
  }
2505
2506
 
2506
2507
  .navds-form-summary__value .navds-form-summary__answers {
2507
- margin-top: var(--ax-spacing-2);
2508
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
2508
+ margin-top: var(--ax-space-8);
2509
+ padding: var(--ax-space-16) var(--ax-space-20);
2509
2510
  background: var(--ax-bg-info-moderateA);
2510
2511
  border-radius: var(--ax-border-radius-large);
2511
2512
  border: 1px solid var(--ax-border-info-subtleA);
@@ -2516,7 +2517,7 @@
2516
2517
  }
2517
2518
 
2518
2519
  .navds-form-progress__bar {
2519
- margin-bottom: var(--ax-spacing-2);
2520
+ margin-bottom: var(--ax-space-8);
2520
2521
  }
2521
2522
 
2522
2523
  .navds-form-progress__button:focus-visible {
@@ -2563,17 +2564,17 @@
2563
2564
  .navds-form-progress__stepper {
2564
2565
  border: 1px solid var(--ax-border-subtle);
2565
2566
  border-radius: var(--ax-border-radius-large);
2566
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
2567
- margin-top: var(--ax-spacing-1);
2567
+ padding: var(--ax-space-16) var(--ax-space-20);
2568
+ margin-top: var(--ax-space-4);
2568
2569
  background: var(--ax-bg-raised);
2569
2570
  }
2570
2571
 
2571
2572
  .navds-accordion__header {
2572
2573
  justify-content: flex-start;
2573
2574
  align-items: flex-start;
2574
- gap: var(--ax-spacing-3);
2575
+ gap: var(--ax-space-12);
2575
2576
  width: 100%;
2576
- padding: var(--ax-spacing-3);
2577
+ padding: var(--ax-space-12);
2577
2578
  text-align: left;
2578
2579
  cursor: pointer;
2579
2580
  border-radius: var(--ax-border-radius-large);
@@ -2598,7 +2599,6 @@
2598
2599
 
2599
2600
  .navds-accordion__header:hover {
2600
2601
  background-color: var(--ax-bg-accent-hoverA);
2601
- color: var(--ax-text-accent-strong);
2602
2602
  }
2603
2603
 
2604
2604
  .navds-accordion__header:hover:before, .navds-accordion__header:hover:after {
@@ -2662,7 +2662,7 @@
2662
2662
  background-color: var(--ax-bg-accent-moderateA);
2663
2663
  width: 22px;
2664
2664
  height: 22px;
2665
- color: var(--ax-text-accent-strong);
2665
+ color: var(--ax-text-accent);
2666
2666
  align-self: center;
2667
2667
  }
2668
2668
 
@@ -2679,7 +2679,7 @@
2679
2679
 
2680
2680
  .navds-accordion__content {
2681
2681
  --__acx-accordion-content-line-width: 2px;
2682
- padding-inline: var(--ax-spacing-6) var(--ax-spacing-3);
2682
+ padding-inline: var(--ax-space-24) var(--ax-space-12);
2683
2683
  max-height: 0;
2684
2684
  transition: all .25s cubic-bezier(.2, 0, 0, 1) allow-discrete;
2685
2685
  border-color: rgba(0, 0, 0, 0);
@@ -2708,13 +2708,13 @@
2708
2708
  }
2709
2709
 
2710
2710
  .navds-accordion--indent > .navds-accordion__item > .navds-accordion__content {
2711
- padding-inline: var(--ax-spacing-6) var(--ax-spacing-3);
2711
+ padding-inline: var(--ax-space-24) var(--ax-space-12);
2712
2712
  }
2713
2713
 
2714
2714
  .navds-accordion--indent > .navds-accordion__item .navds-accordion__content-inner {
2715
2715
  box-shadow: -2px 0 0 0 var(--ax-border-subtleA);
2716
- padding-block: var(--ax-spacing-2);
2717
- padding-inline: calc(var(--ax-spacing-5) + 2px) var(--ax-spacing-5);
2716
+ padding-block: var(--ax-space-8);
2717
+ padding-inline: calc(var(--ax-space-20) + 2px) var(--ax-space-20);
2718
2718
  }
2719
2719
 
2720
2720
  @media (forced-colors: active) {
@@ -2726,9 +2726,9 @@
2726
2726
  .navds-accordion__item[data-expanded="true"] > .navds-accordion__content {
2727
2727
  opacity: 1;
2728
2728
  max-height: fit-content;
2729
- padding-block: var(--ax-spacing-2);
2729
+ padding-block: var(--ax-space-8);
2730
2730
  border-color: var(--ax-border-subtleA);
2731
- padding-block-end: var(--ax-spacing-6);
2731
+ padding-block-end: var(--ax-space-24);
2732
2732
  display: block;
2733
2733
  overflow: visible;
2734
2734
  }
@@ -2743,8 +2743,8 @@
2743
2743
 
2744
2744
  .navds-alert {
2745
2745
  border-radius: var(--ax-border-radius-xlarge);
2746
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
2747
- gap: var(--ax-spacing-3);
2746
+ padding: var(--ax-space-16) var(--ax-space-20);
2747
+ gap: var(--ax-space-12);
2748
2748
  border: 1px solid;
2749
2749
  align-items: center;
2750
2750
  display: flex;
@@ -2770,8 +2770,8 @@
2770
2770
  }
2771
2771
 
2772
2772
  .navds-alert--small {
2773
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
2774
- gap: var(--ax-spacing-2);
2773
+ padding: var(--ax-space-12) var(--ax-space-16);
2774
+ gap: var(--ax-space-8);
2775
2775
  }
2776
2776
 
2777
2777
  .navds-alert--small > .navds-alert__icon {
@@ -2834,7 +2834,7 @@
2834
2834
  }
2835
2835
 
2836
2836
  .navds-alert--close-button > .navds-alert__wrapper, .navds-alert--close-button > .navds-alert__icon {
2837
- margin-block-start: var(--ax-spacing-05);
2837
+ margin-block-start: var(--ax-space-2);
2838
2838
  }
2839
2839
 
2840
2840
  .navds-alert--close-button.navds-alert--small {
@@ -2842,12 +2842,12 @@
2842
2842
  }
2843
2843
 
2844
2844
  .navds-alert--close-button.navds-alert--small > .navds-alert__wrapper, .navds-alert--close-button.navds-alert--small > .navds-alert__icon {
2845
- margin-block-start: var(--ax-spacing-1);
2845
+ margin-block-start: var(--ax-space-4);
2846
2846
  }
2847
2847
 
2848
2848
  .navds-chat {
2849
2849
  align-items: flex-end;
2850
- gap: var(--ax-spacing-3);
2850
+ gap: var(--ax-space-12);
2851
2851
  max-width: 40.75rem;
2852
2852
  display: flex;
2853
2853
  }
@@ -2890,7 +2890,7 @@
2890
2890
  }
2891
2891
 
2892
2892
  .navds-chat__bubble-wrapper {
2893
- gap: var(--ax-spacing-3);
2893
+ gap: var(--ax-space-12);
2894
2894
  flex-direction: column;
2895
2895
  margin: 0;
2896
2896
  padding: 0;
@@ -2899,9 +2899,9 @@
2899
2899
  }
2900
2900
 
2901
2901
  .navds-chat__bubble {
2902
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
2902
+ padding: var(--ax-space-16) var(--ax-space-20);
2903
2903
  background-color: var(--ax-bg-raised);
2904
- gap: var(--ax-spacing-2);
2904
+ gap: var(--ax-space-8);
2905
2905
  border-radius: var(--ax-border-radius-xlarge);
2906
2906
  border-bottom-left-radius: var(--ax-border-radius-small);
2907
2907
  border: 1px solid var(--ax-border-subtleA);
@@ -2911,20 +2911,20 @@
2911
2911
  }
2912
2912
 
2913
2913
  .navds-chat--small .navds-chat__bubble {
2914
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
2914
+ padding: var(--ax-space-12) var(--ax-space-16);
2915
2915
  }
2916
2916
 
2917
2917
  .navds-chat--info .navds-chat__bubble, .navds-chat--info .navds-chat__avatar {
2918
- background-color: var(--ax-bg-info-raised);
2918
+ background-color: var(--ax-bg-info-moderate);
2919
2919
  }
2920
2920
 
2921
2921
  .navds-chat--neutral .navds-chat__bubble, .navds-chat--neutral .navds-chat__avatar {
2922
- background-color: var(--ax-bg-neutral-raised);
2922
+ background-color: var(--ax-bg-moderateA);
2923
2923
  }
2924
2924
 
2925
2925
  .navds-chat__top-text {
2926
2926
  color: var(--ax-text-default);
2927
- gap: var(--ax-spacing-2);
2927
+ gap: var(--ax-space-8);
2928
2928
  align-items: baseline;
2929
2929
  margin: 0;
2930
2930
  font-weight: normal;
@@ -2948,7 +2948,7 @@
2948
2948
  }
2949
2949
 
2950
2950
  .navds-copybutton {
2951
- --__axc-copybutton-padding: var(--ax-spacing-3) var(--ax-spacing-5) var(--ax-spacing-3) var(--ax-spacing-4);
2951
+ --__axc-copybutton-padding: var(--ax-space-12) var(--ax-space-20) var(--ax-space-12) var(--ax-space-16);
2952
2952
  cursor: pointer;
2953
2953
  border-radius: var(--ax-border-radius-medium);
2954
2954
  padding: var(--__axc-copybutton-padding);
@@ -2962,15 +2962,15 @@
2962
2962
  }
2963
2963
 
2964
2964
  .navds-copybutton.navds-copybutton--icon-only {
2965
- --__axc-copybutton-padding: var(--ax-spacing-3);
2965
+ --__axc-copybutton-padding: var(--ax-space-12);
2966
2966
  }
2967
2967
 
2968
2968
  .navds-copybutton.navds-copybutton--icon-right {
2969
- --__axc-copybutton-padding: var(--ax-spacing-3) var(--ax-spacing-4) var(--ax-spacing-3) var(--ax-spacing-5);
2969
+ --__axc-copybutton-padding: var(--ax-space-12) var(--ax-space-16) var(--ax-space-12) var(--ax-space-20);
2970
2970
  }
2971
2971
 
2972
2972
  .navds-copybutton:hover {
2973
- background-color: var(--ax-bg-neutral-moderate-hoverA);
2973
+ background-color: var(--ax-bg-moderate-hoverA);
2974
2974
  }
2975
2975
 
2976
2976
  .navds-copybutton:focus-visible {
@@ -3001,39 +3001,35 @@
3001
3001
  }
3002
3002
 
3003
3003
  .navds-copybutton--small {
3004
- --__axc-copybutton-padding: var(--ax-spacing-1) var(--ax-spacing-3) var(--ax-spacing-1) var(--ax-spacing-2);
3004
+ --__axc-copybutton-padding: var(--ax-space-4) var(--ax-space-12) var(--ax-space-4) var(--ax-space-8);
3005
3005
  min-width: 2rem;
3006
3006
  min-height: 2rem;
3007
3007
  }
3008
3008
 
3009
3009
  .navds-copybutton--small.navds-copybutton--icon-right {
3010
- --__axc-copybutton-padding: var(--ax-spacing-1) var(--ax-spacing-2) var(--ax-spacing-1) var(--ax-spacing-3);
3010
+ --__axc-copybutton-padding: var(--ax-space-4) var(--ax-space-8) var(--ax-space-4) var(--ax-space-12);
3011
3011
  }
3012
3012
 
3013
3013
  .navds-copybutton--small.navds-copybutton--icon-only {
3014
- --__axc-copybutton-padding: var(--ax-spacing-1);
3015
- }
3016
-
3017
- .navds-copybutton--small .navds-copybutton__icon {
3018
- font-size: 1.25rem;
3014
+ --__axc-copybutton-padding: var(--ax-space-4);
3019
3015
  }
3020
3016
 
3021
3017
  .navds-copybutton--small > .navds-copybutton__content {
3022
- gap: var(--ax-spacing-1-alt);
3018
+ gap: var(--ax-space-4);
3023
3019
  }
3024
3020
 
3025
3021
  .navds-copybutton--xsmall {
3026
- --__axc-copybutton-padding: var(--ax-spacing-05) var(--ax-spacing-2) var(--ax-spacing-05) var(--ax-spacing-1);
3022
+ --__axc-copybutton-padding: var(--ax-space-2) var(--ax-space-8) var(--ax-space-2) var(--ax-space-4);
3027
3023
  min-width: 1.5rem;
3028
3024
  min-height: 1.5rem;
3029
3025
  }
3030
3026
 
3031
3027
  .navds-copybutton--xsmall.navds-copybutton--icon-right {
3032
- --__axc-copybutton-padding: var(--ax-spacing-05) var(--ax-spacing-1) var(--ax-spacing-05) var(--ax-spacing-2);
3028
+ --__axc-copybutton-padding: var(--ax-space-2) var(--ax-space-4) var(--ax-space-2) var(--ax-space-8);
3033
3029
  }
3034
3030
 
3035
3031
  .navds-copybutton--xsmall.navds-copybutton--icon-only {
3036
- --__axc-copybutton-padding: var(--ax-spacing-05);
3032
+ --__axc-copybutton-padding: var(--ax-space-2);
3037
3033
  }
3038
3034
 
3039
3035
  .navds-copybutton--xsmall .navds-copybutton__icon {
@@ -3041,7 +3037,7 @@
3041
3037
  }
3042
3038
 
3043
3039
  .navds-copybutton--xsmall > .navds-copybutton__content {
3044
- gap: var(--ax-spacing-1);
3040
+ gap: var(--ax-space-2);
3045
3041
  }
3046
3042
 
3047
3043
  .navds-copybutton__icon {
@@ -3049,18 +3045,6 @@
3049
3045
  display: flex;
3050
3046
  }
3051
3047
 
3052
- .navds-copybutton__icon:first-of-type {
3053
- margin-left: -.25rem;
3054
- }
3055
-
3056
- .navds-copybutton__icon:last-of-type {
3057
- margin-right: -.25rem;
3058
- }
3059
-
3060
- .navds-copybutton__icon:only-child {
3061
- margin: 0;
3062
- }
3063
-
3064
3048
  .navds-copybutton--active .navds-copybutton__icon {
3065
3049
  animation: 2s cubic-bezier(.05, .7, .1, 1) akselCopyButtonIconAnimation;
3066
3050
  }
@@ -3091,14 +3075,6 @@
3091
3075
  color: var(--ax-text-success);
3092
3076
  }
3093
3077
 
3094
- .navds-copybutton--action.navds-copybutton--active:hover {
3095
- color: var(--ax-text-success-strong);
3096
- }
3097
-
3098
- .navds-copybutton--action:hover {
3099
- color: var(--ax-text-accent-strong);
3100
- }
3101
-
3102
3078
  .navds-copybutton--action:disabled {
3103
3079
  color: var(--ax-text-accent);
3104
3080
  }
@@ -3107,10 +3083,6 @@
3107
3083
  color: var(--ax-text-subtle);
3108
3084
  }
3109
3085
 
3110
- .navds-copybutton--neutral:hover, .navds-copybutton--neutral.navds-copybutton--active {
3111
- color: var(--ax-text-default);
3112
- }
3113
-
3114
3086
  .navds-copybutton--neutral:disabled {
3115
3087
  color: var(--ax-text-subtle);
3116
3088
  }
@@ -3118,17 +3090,17 @@
3118
3090
  .navds-copybutton__content {
3119
3091
  justify-content: center;
3120
3092
  align-items: center;
3121
- gap: var(--ax-spacing-2);
3093
+ gap: var(--ax-space-6);
3122
3094
  display: inline-flex;
3123
3095
  }
3124
3096
 
3125
3097
  .navds-date {
3126
- padding: var(--ax-spacing-4) var(--ax-spacing-3);
3098
+ padding: var(--ax-space-16) var(--ax-space-12);
3127
3099
  }
3128
3100
 
3129
3101
  .navds-date .rdp-day_range_middle.rdp-day_disabled {
3130
3102
  color: var(--ax-text-default);
3131
- background: var(--ax-bg-neutral-moderateA);
3103
+ background: var(--ax-bg-moderateA);
3132
3104
  }
3133
3105
 
3134
3106
  .navds-date .rdp-day_range_middle.rdp-day_selected {
@@ -3138,7 +3110,7 @@
3138
3110
  }
3139
3111
 
3140
3112
  .navds-date .rdp-month, .navds-date.rdp-month {
3141
- gap: var(--ax-spacing-5);
3113
+ gap: var(--ax-space-20);
3142
3114
  display: grid;
3143
3115
  }
3144
3116
 
@@ -3187,7 +3159,7 @@
3187
3159
 
3188
3160
  .navds-date .rdp-day_disabled {
3189
3161
  cursor: not-allowed;
3190
- background-color: var(--ax-bg-neutral-moderateA);
3162
+ background-color: var(--ax-bg-moderateA);
3191
3163
  color: var(--ax-text-subtle);
3192
3164
  text-decoration: line-through;
3193
3165
  }
@@ -3230,8 +3202,8 @@
3230
3202
  .navds-date__caption {
3231
3203
  justify-content: space-between;
3232
3204
  align-items: center;
3233
- gap: var(--ax-spacing-1);
3234
- padding-inline: var(--ax-spacing-1);
3205
+ gap: var(--ax-space-4);
3206
+ padding-inline: var(--ax-space-4);
3235
3207
  display: flex;
3236
3208
  }
3237
3209
 
@@ -3276,18 +3248,18 @@
3276
3248
  }
3277
3249
 
3278
3250
  .navds-date__field-input.navds-text-field__input {
3279
- padding-right: var(--ax-spacing-12);
3251
+ padding-right: var(--ax-space-48);
3280
3252
  }
3281
3253
 
3282
3254
  .navds-form-field--small .navds-date__field-input {
3283
- padding-right: var(--ax-spacing-8);
3255
+ padding-right: var(--ax-space-32);
3284
3256
  }
3285
3257
 
3286
3258
  .navds-date__field-button {
3287
3259
  color: var(--ax-text-default);
3288
3260
  cursor: pointer;
3289
3261
  border-radius: calc(var(--ax-border-radius-medium) - 1px);
3290
- padding: var(--ax-spacing-3);
3262
+ padding: var(--ax-space-12);
3291
3263
  background: none;
3292
3264
  border: none;
3293
3265
  border-start-start-radius: 0;
@@ -3306,7 +3278,7 @@
3306
3278
  }
3307
3279
 
3308
3280
  .navds-form-field--small .navds-date__field-button {
3309
- padding: var(--ax-spacing-1);
3281
+ padding: var(--ax-space-4);
3310
3282
  }
3311
3283
 
3312
3284
  .navds-form-field--disabled .navds-date__field-button {
@@ -3331,7 +3303,7 @@
3331
3303
 
3332
3304
  .navds-date__week-row {
3333
3305
  align-items: center;
3334
- gap: var(--ax-spacing-05);
3306
+ gap: var(--ax-space-2);
3335
3307
  display: flex;
3336
3308
  }
3337
3309
 
@@ -3345,7 +3317,7 @@
3345
3317
  }
3346
3318
 
3347
3319
  .navds-date__weeknumber:active .navds-date__weeknumber-number {
3348
- color: var(--ax-text-neutral-contrast);
3320
+ color: var(--ax-text-contrast);
3349
3321
  }
3350
3322
 
3351
3323
  .navds-date__week-wrapper {
@@ -3357,24 +3329,24 @@
3357
3329
  }
3358
3330
 
3359
3331
  .navds-date__modal-body {
3360
- padding: var(--ax-spacing-4);
3332
+ padding: var(--ax-space-16);
3361
3333
  align-items: flex-end;
3362
- gap: var(--ax-spacing-2);
3334
+ gap: var(--ax-space-8);
3363
3335
  flex-direction: column;
3364
3336
  display: flex;
3365
3337
  }
3366
3338
 
3367
3339
  @media (min-width: 480px) {
3368
3340
  .navds-date {
3369
- padding: var(--ax-spacing-5) var(--ax-spacing-4);
3341
+ padding: var(--ax-space-20) var(--ax-space-16);
3370
3342
  }
3371
3343
 
3372
3344
  .navds-date__modal-body {
3373
- padding: var(--ax-spacing-6);
3345
+ padding: var(--ax-space-24);
3374
3346
  }
3375
3347
 
3376
3348
  .navds-date__caption {
3377
- gap: var(--ax-spacing-2);
3349
+ gap: var(--ax-space-8);
3378
3350
  }
3379
3351
 
3380
3352
  .navds-date .rdp-button, .navds-date__caption-button {
@@ -3507,9 +3479,9 @@
3507
3479
  }
3508
3480
 
3509
3481
  .navds-action-menu__content > .navds-action-menu__content-inner {
3510
- --__axc-action-menu-content-p: var(--ax-spacing-2);
3511
- --__axc-action-menu-item-pr: var(--ax-spacing-2);
3512
- --__axc-action-menu-item-pl: var(--ax-spacing-2);
3482
+ --__axc-action-menu-content-p: var(--ax-space-8);
3483
+ --__axc-action-menu-item-pr: var(--ax-space-8);
3484
+ --__axc-action-menu-item-pl: var(--ax-space-8);
3513
3485
  --__axc-action-menu-item-height: 2rem;
3514
3486
  border-radius: var(--ax-border-radius-large);
3515
3487
  background-color: var(--ax-bg-raised);
@@ -3525,7 +3497,7 @@
3525
3497
 
3526
3498
  .navds-action-menu__item {
3527
3499
  align-items: center;
3528
- gap: var(--ax-spacing-2);
3500
+ gap: var(--ax-space-8);
3529
3501
  min-height: var(--__axc-action-menu-item-height);
3530
3502
  cursor: default;
3531
3503
  border-radius: var(--ax-border-radius-medium);
@@ -3556,15 +3528,15 @@
3556
3528
  }
3557
3529
 
3558
3530
  .navds-action-menu__item--has-icon {
3559
- --__axc-action-menu-item-pl: var(--ax-spacing-6);
3531
+ --__axc-action-menu-item-pl: var(--ax-space-24);
3560
3532
  }
3561
3533
 
3562
3534
  .navds-action-menu__sub-trigger {
3563
- --__axc-action-menu-item-pr: var(--ax-spacing-05);
3535
+ --__axc-action-menu-item-pr: var(--ax-space-2);
3564
3536
  }
3565
3537
 
3566
3538
  .navds-action-menu__sub-trigger[data-state="open"] {
3567
- background-color: var(--ax-bg-neutral-moderate-pressed);
3539
+ background-color: var(--ax-bg-moderate-pressed);
3568
3540
  }
3569
3541
 
3570
3542
  .navds-action-menu__sub-trigger:focus {
@@ -3577,17 +3549,17 @@
3577
3549
 
3578
3550
  .navds-action-menu__item--danger:focus {
3579
3551
  background-color: var(--ax-bg-danger-moderate-hoverA);
3580
- color: var(--ax-text-danger-strong);
3552
+ color: var(--ax-text-danger);
3581
3553
  }
3582
3554
 
3583
3555
  .navds-action-menu__marker {
3584
3556
  align-items: center;
3585
- gap: var(--ax-spacing-1);
3557
+ gap: var(--ax-space-4);
3586
3558
  display: flex;
3587
3559
  }
3588
3560
 
3589
3561
  .navds-action-menu__marker--right {
3590
- padding-left: var(--ax-spacing-4);
3562
+ padding-left: var(--ax-space-16);
3591
3563
  margin-left: auto;
3592
3564
  }
3593
3565
 
@@ -3605,10 +3577,10 @@
3605
3577
  }
3606
3578
 
3607
3579
  .navds-action-menu__shortcut {
3608
- background-color: var(--ax-bg-neutral-moderateA);
3580
+ background-color: var(--ax-bg-moderateA);
3609
3581
  color: var(--ax-text-default);
3610
3582
  border-radius: var(--ax-border-radius-small);
3611
- padding: 0 var(--ax-spacing-1);
3583
+ padding: 0 var(--ax-space-4);
3612
3584
  min-width: 1.125rem;
3613
3585
  height: 1.125rem;
3614
3586
  line-height: 1;
@@ -3634,7 +3606,7 @@
3634
3606
 
3635
3607
  .navds-action-menu__divider {
3636
3608
  height: 1px;
3637
- margin-block: var(--ax-spacing-2);
3609
+ margin-block: var(--ax-space-8);
3638
3610
  background-color: var(--ax-border-subtleA);
3639
3611
  }
3640
3612
 
@@ -3657,8 +3629,8 @@
3657
3629
 
3658
3630
  .navds-expansioncard {
3659
3631
  --__axc-expansioncard-border-radius: calc(var(--ax-border-radius-xlarge) - 1px);
3660
- --__axc-expansioncard-padding-block: var(--ax-spacing-4);
3661
- --__axc-expansioncard-padding-inline: var(--ax-spacing-5);
3632
+ --__axc-expansioncard-padding-block: var(--ax-space-16);
3633
+ --__axc-expansioncard-padding-inline: var(--ax-space-20);
3662
3634
  border-radius: var(--ax-border-radius-xlarge);
3663
3635
  background-color: var(--ax-bg-raised);
3664
3636
  border: 1px solid var(--ax-border-default);
@@ -3671,12 +3643,12 @@
3671
3643
  }
3672
3644
 
3673
3645
  .navds-expansioncard--small {
3674
- --__axc-expansioncard-padding-inline: var(--ax-spacing-4);
3675
- --__axc-expansioncard-padding-block: var(--ax-spacing-3);
3646
+ --__axc-expansioncard-padding-inline: var(--ax-space-16);
3647
+ --__axc-expansioncard-padding-block: var(--ax-space-12);
3676
3648
  }
3677
3649
 
3678
3650
  .navds-expansioncard--small > .navds-expansioncard__header .navds-expansioncard__title--small {
3679
- margin-top: var(--ax-spacing-05);
3651
+ margin-top: var(--ax-space-2);
3680
3652
  }
3681
3653
 
3682
3654
  .navds-expansioncard--small :is(.navds-expansioncard__title--medium, .navds-expansioncard__title--large) {
@@ -3689,7 +3661,7 @@
3689
3661
  }
3690
3662
 
3691
3663
  .navds-expansioncard__header {
3692
- gap: var(--ax-spacing-4);
3664
+ gap: var(--ax-space-16);
3693
3665
  width: 100%;
3694
3666
  padding: var(--__axc-expansioncard-padding-block) var(--__axc-expansioncard-padding-inline);
3695
3667
  border-radius: var(--__axc-expansioncard-border-radius);
@@ -3700,7 +3672,7 @@
3700
3672
  }
3701
3673
 
3702
3674
  .navds-expansioncard__header:hover {
3703
- background-color: var(--ax-bg-neutral-raised-hover);
3675
+ background-color: var(--ax-bg-hover);
3704
3676
  }
3705
3677
 
3706
3678
  .navds-expansioncard__header[data-open="true"] {
@@ -3728,11 +3700,11 @@
3728
3700
  }
3729
3701
 
3730
3702
  .navds-expansioncard__title--medium {
3731
- margin-top: var(--ax-spacing-2);
3703
+ margin-top: var(--ax-space-8);
3732
3704
  }
3733
3705
 
3734
3706
  .navds-expansioncard__title--large {
3735
- margin-top: var(--ax-spacing-1);
3707
+ margin-top: var(--ax-space-4);
3736
3708
  }
3737
3709
 
3738
3710
  .navds-expansioncard__header-button {
@@ -3772,7 +3744,7 @@
3772
3744
  }
3773
3745
 
3774
3746
  .navds-expansioncard__header:hover > .navds-expansioncard__header-button {
3775
- background-color: var(--ax-bg-neutral-moderate-hoverA);
3747
+ background-color: var(--ax-bg-moderate-hoverA);
3776
3748
  }
3777
3749
 
3778
3750
  .navds-expansioncard__header-chevron {
@@ -3872,22 +3844,22 @@
3872
3844
  }
3873
3845
 
3874
3846
  .navds-guide-panel:is([data-poster="true"], [data-responsive="true"]) > .navds-guide-panel__content {
3875
- margin-top: var(--ax-spacing-5);
3847
+ margin-top: var(--ax-space-20);
3876
3848
  }
3877
3849
 
3878
3850
  .navds-guide-panel[data-poster="false"] > .navds-guide-panel__content {
3879
- margin-left: var(--ax-spacing-5);
3851
+ margin-left: var(--ax-space-20);
3880
3852
  }
3881
3853
 
3882
3854
  @media (min-width: 480px) {
3883
3855
  .navds-guide-panel[data-responsive="true"] > .navds-guide-panel__content {
3884
3856
  margin-top: 0;
3885
- margin-left: var(--ax-spacing-5);
3857
+ margin-left: var(--ax-space-20);
3886
3858
  }
3887
3859
  }
3888
3860
 
3889
3861
  .navds-guide-panel__content-inner {
3890
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
3862
+ padding: var(--ax-space-12) var(--ax-space-16);
3891
3863
  border-radius: var(--ax-border-radius-xlarge);
3892
3864
  background-color: var(--ax-bg-raised);
3893
3865
  height: 100%;
@@ -3900,7 +3872,7 @@
3900
3872
 
3901
3873
  @media (min-width: 480px) {
3902
3874
  .navds-guide-panel__content-inner {
3903
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
3875
+ padding: var(--ax-space-16) var(--ax-space-20);
3904
3876
  }
3905
3877
 
3906
3878
  .navds-guide-panel[data-responsive="true"] .navds-guide-panel__content-inner {
@@ -3915,20 +3887,20 @@
3915
3887
 
3916
3888
  .navds-guide-panel:is([data-poster="true"], [data-responsive="true"]) .navds-guide-panel__tail {
3917
3889
  left: 50%;
3918
- top: calc(var(--ax-spacing-4) * -1 - 2px);
3890
+ top: calc(var(--ax-space-16) * -1 - 2px);
3919
3891
  transform: translateX(-48%);
3920
3892
  }
3921
3893
 
3922
3894
  .navds-guide-panel[data-poster="false"] .navds-guide-panel__tail {
3923
3895
  top: calc(var(--__axc-guide-panel-guide-size) / 2);
3924
- left: calc(var(--ax-spacing-5) * -1 - 2px);
3896
+ left: calc(var(--ax-space-20) * -1 - 2px);
3925
3897
  transform: translateY(-48%)rotateZ(-90deg)scaleX(-1);
3926
3898
  }
3927
3899
 
3928
3900
  @media (min-width: 480px) {
3929
3901
  .navds-guide-panel[data-responsive="true"] .navds-guide-panel__tail {
3930
3902
  top: calc(var(--__axc-guide-panel-guide-size) / 2);
3931
- left: calc(var(--ax-spacing-5) * -1 - 2px);
3903
+ left: calc(var(--ax-space-20) * -1 - 2px);
3932
3904
  transform: translateY(-48%)rotateZ(-90deg)scaleX(-1);
3933
3905
  }
3934
3906
  }
@@ -3937,7 +3909,7 @@
3937
3909
  cursor: pointer;
3938
3910
  border-radius: var(--ax-border-radius-full);
3939
3911
  color: var(--ax-bg-accent-strong);
3940
- padding: calc(var(--ax-spacing-1) / 2);
3912
+ padding: calc(var(--ax-space-4) / 2);
3941
3913
  background-color: rgba(0, 0, 0, 0);
3942
3914
  border: 0;
3943
3915
  justify-content: center;
@@ -3953,7 +3925,7 @@
3953
3925
 
3954
3926
  .navds-help-text__popover.navds-popover {
3955
3927
  background-color: var(--ax-bg-info-moderate);
3956
- max-width: min(65ch, calc(100vw - var(--ax-spacing-6)));
3928
+ max-width: min(65ch, calc(100vw - var(--ax-space-24)));
3957
3929
  border-radius: var(--ax-border-radius-large);
3958
3930
  border: 1px solid var(--ax-border-info);
3959
3931
  }
@@ -4006,7 +3978,7 @@
4006
3978
  font-weight: var(--ax-font-weight-bold);
4007
3979
  text-align: left;
4008
3980
  padding-block: 0;
4009
- padding-inline: var(--ax-spacing-6) var(--ax-spacing-5);
3981
+ padding-inline: var(--ax-space-24) var(--ax-space-20);
4010
3982
  border: none;
4011
3983
  border-right: 1px solid var(--ax-border-subtleA);
4012
3984
  color: var(--ax-text-default);
@@ -4024,7 +3996,7 @@
4024
3996
  }
4025
3997
 
4026
3998
  .navds-internalheader__title:hover {
4027
- background: var(--ax-bg-neutral-moderate-hover);
3999
+ background: var(--ax-bg-moderate-hover);
4028
4000
  }
4029
4001
 
4030
4002
  .navds-internalheader__title:is(:hover, :active):not(button, a) {
@@ -4032,20 +4004,20 @@
4032
4004
  }
4033
4005
 
4034
4006
  .navds-internalheader__user {
4035
- padding: 0 var(--ax-spacing-5);
4007
+ padding: 0 var(--ax-space-20);
4036
4008
  border-left: 1px solid var(--ax-border-subtleA);
4037
4009
  align-items: center;
4038
4010
  display: flex;
4039
4011
  }
4040
4012
 
4041
4013
  .navds-internalheader__button {
4042
- padding: 0 var(--ax-spacing-3);
4014
+ padding: 0 var(--ax-space-12);
4043
4015
  font: inherit;
4044
4016
  cursor: pointer;
4045
4017
  text-align: left;
4046
4018
  justify-self: center;
4047
4019
  align-items: center;
4048
- gap: var(--ax-spacing-2);
4020
+ gap: var(--ax-space-8);
4049
4021
  border: none;
4050
4022
  border-left: 1px solid var(--ax-border-subtleA);
4051
4023
  color: var(--ax-text-default);
@@ -4057,7 +4029,7 @@
4057
4029
  }
4058
4030
 
4059
4031
  .navds-internalheader__button:hover {
4060
- background: var(--ax-bg-neutral-moderate-hover);
4032
+ background: var(--ax-bg-moderate-hover);
4061
4033
  }
4062
4034
 
4063
4035
  @media (forced-colors: active) {
@@ -4076,18 +4048,18 @@
4076
4048
  }
4077
4049
 
4078
4050
  :is(.navds-internalheader__title, .navds-internalheader__button):active {
4079
- background: var(--ax-bg-neutral-moderate-pressed);
4051
+ background: var(--ax-bg-moderate-pressed);
4080
4052
  }
4081
4053
 
4082
4054
  .navds-internalheader__user-button {
4083
- padding-left: var(--ax-spacing-5);
4084
- gap: var(--ax-spacing-4);
4055
+ padding-left: var(--ax-space-20);
4056
+ gap: var(--ax-space-16);
4085
4057
  }
4086
4058
 
4087
4059
  .navds-link {
4088
4060
  color: var(--ax-text-accent);
4089
4061
  align-items: center;
4090
- gap: var(--ax-spacing-05);
4062
+ gap: var(--ax-space-2);
4091
4063
  text-underline-offset: .1em;
4092
4064
  text-decoration: underline;
4093
4065
  text-decoration-thickness: .05em;
@@ -4204,7 +4176,7 @@
4204
4176
  }
4205
4177
 
4206
4178
  .navds-loader__background {
4207
- stroke: var(--ax-border-neutral-subtleA);
4179
+ stroke: var(--ax-border-subtleA);
4208
4180
  stroke-width: var(--__axc-loader-stroke-width);
4209
4181
  }
4210
4182
 
@@ -4316,7 +4288,7 @@
4316
4288
  }
4317
4289
 
4318
4290
  .navds-modal--small .navds-modal__header, .navds-modal--small .navds-modal__body, .navds-modal--small .navds-modal__footer {
4319
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
4291
+ padding: var(--ax-space-12) var(--ax-space-16);
4320
4292
  }
4321
4293
 
4322
4294
  @media (min-width: 480px) {
@@ -4352,17 +4324,17 @@
4352
4324
  }
4353
4325
 
4354
4326
  .navds-modal__button {
4355
- margin-left: var(--ax-spacing-4);
4327
+ margin-left: var(--ax-space-16);
4356
4328
  float: right;
4357
4329
  }
4358
4330
 
4359
4331
  .navds-modal__header {
4360
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
4332
+ padding: var(--ax-space-16) var(--ax-space-20);
4361
4333
  }
4362
4334
 
4363
4335
  .navds-modal__header-icon svg {
4364
4336
  vertical-align: -.25rem;
4365
- margin-right: var(--ax-spacing-1);
4337
+ margin-right: var(--ax-space-4);
4366
4338
  display: inline;
4367
4339
  }
4368
4340
 
@@ -4372,7 +4344,7 @@
4372
4344
  }
4373
4345
 
4374
4346
  .navds-modal__body {
4375
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
4347
+ padding: var(--ax-space-16) var(--ax-space-20);
4376
4348
  overscroll-behavior: contain;
4377
4349
  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;
4378
4350
  background-repeat: no-repeat;
@@ -4383,12 +4355,12 @@
4383
4355
  }
4384
4356
 
4385
4357
  .navds-modal__header + .navds-modal__body {
4386
- padding-top: var(--ax-spacing-0);
4358
+ padding-top: var(--ax-space-0);
4387
4359
  }
4388
4360
 
4389
4361
  .navds-modal__footer {
4390
- gap: var(--ax-spacing-4);
4391
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
4362
+ gap: var(--ax-space-16);
4363
+ padding: var(--ax-space-16) var(--ax-space-20);
4392
4364
  flex-flow: row-reverse wrap;
4393
4365
  display: flex;
4394
4366
  }
@@ -4440,7 +4412,7 @@
4440
4412
  }
4441
4413
 
4442
4414
  .navds-pagination__list {
4443
- gap: var(--ax-spacing-3);
4415
+ gap: var(--ax-space-12);
4444
4416
  margin: 0;
4445
4417
  padding: 0;
4446
4418
  list-style: none;
@@ -4469,8 +4441,8 @@
4469
4441
  }
4470
4442
 
4471
4443
  .navds-pagination__item[data-selected="true"] {
4472
- background-color: var(--ax-bg-neutral-strong-pressed);
4473
- color: var(--ax-text-neutral-contrast);
4444
+ background-color: var(--ax-bg-strong-pressed);
4445
+ color: var(--ax-text-contrast);
4474
4446
  }
4475
4447
 
4476
4448
  .navds-pagination--invisible {
@@ -4483,11 +4455,11 @@
4483
4455
  box-shadow: var(--ax-shadow-dialog);
4484
4456
  border: 1px solid var(--ax-border-subtleA);
4485
4457
  border-radius: var(--ax-border-radius-xlarge);
4486
- max-width: calc(100vw - var(--ax-spacing-6));
4458
+ max-width: calc(100vw - var(--ax-space-24));
4487
4459
  }
4488
4460
 
4489
4461
  .navds-popover__content {
4490
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
4462
+ padding: var(--ax-space-16) var(--ax-space-20);
4491
4463
  }
4492
4464
 
4493
4465
  .navds-popover--hidden {
@@ -4503,7 +4475,7 @@
4503
4475
  --__axc-tag-text: ;
4504
4476
  --__axc-tag-text-strong: ;
4505
4477
  border-radius: var(--ax-border-radius-medium);
4506
- padding: var(--ax-spacing-05) var(--ax-spacing-2);
4478
+ padding: var(--ax-space-2) var(--ax-space-8);
4507
4479
  justify-content: center;
4508
4480
  align-items: center;
4509
4481
  min-height: 2rem;
@@ -4512,7 +4484,7 @@
4512
4484
  }
4513
4485
 
4514
4486
  .navds-tag:has(.navds-tag__icon--left) {
4515
- gap: var(--ax-spacing-05);
4487
+ gap: var(--ax-space-2);
4516
4488
  }
4517
4489
 
4518
4490
  .navds-tag--info, .navds-tag--alt3 {
@@ -4548,38 +4520,38 @@
4548
4520
  }
4549
4521
 
4550
4522
  .navds-tag--neutral {
4551
- --__axc-tag-border: var(--ax-border-neutral);
4552
- --__axc-tag-bg: var(--ax-bg-neutral-moderateA);
4553
- --__axc-tag-bg-strong: var(--ax-bg-neutral-strong);
4554
- --__axc-tag-text: var(--ax-text-neutral-strong);
4555
- --__axc-tag-text-strong: var(--ax-text-neutral-contrast);
4523
+ --__axc-tag-border: var(--ax-border-default);
4524
+ --__axc-tag-bg: var(--ax-bg-moderateA);
4525
+ --__axc-tag-bg-strong: var(--ax-bg-strong);
4526
+ --__axc-tag-text: var(--ax-text-default);
4527
+ --__axc-tag-text-strong: var(--ax-text-contrast);
4556
4528
  }
4557
4529
 
4558
- .navds-tag--meta-purple, .navds-tag--alt1 {
4559
- --__axc-tag-border: var(--ax-border-meta-purple);
4560
- --__axc-tag-bg: var(--ax-bg-meta-purple-moderateA);
4561
- --__axc-tag-bg-strong: var(--ax-bg-meta-purple-strong);
4562
- --__axc-tag-text: var(--ax-text-meta-purple-strong);
4563
- --__axc-tag-text-strong: var(--ax-text-meta-purple-contrast);
4530
+ .navds-tag--meta-1, .navds-tag--alt1 {
4531
+ --__axc-tag-border: var(--ax-border-meta-1);
4532
+ --__axc-tag-bg: var(--ax-bg-meta-1-moderateA);
4533
+ --__axc-tag-bg-strong: var(--ax-bg-meta-1-strong);
4534
+ --__axc-tag-text: var(--ax-text-meta-1-strong);
4535
+ --__axc-tag-text-strong: var(--ax-text-meta-1-contrast);
4564
4536
  }
4565
4537
 
4566
- .navds-tag--meta-lime, .navds-tag--alt2 {
4567
- --__axc-tag-border: var(--ax-border-meta-lime);
4568
- --__axc-tag-bg: var(--ax-bg-meta-lime-moderateA);
4569
- --__axc-tag-bg-strong: var(--ax-bg-meta-lime-strong);
4570
- --__axc-tag-text: var(--ax-text-meta-lime-strong);
4571
- --__axc-tag-text-strong: var(--ax-text-meta-lime-contrast);
4538
+ .navds-tag--meta-2, .navds-tag--alt2 {
4539
+ --__axc-tag-border: var(--ax-border-meta-2);
4540
+ --__axc-tag-bg: var(--ax-bg-meta-2-moderateA);
4541
+ --__axc-tag-bg-strong: var(--ax-bg-meta-2-strong);
4542
+ --__axc-tag-text: var(--ax-text-meta-2-strong);
4543
+ --__axc-tag-text-strong: var(--ax-text-meta-2-contrast);
4572
4544
  }
4573
4545
 
4574
4546
  .navds-tag--small {
4575
4547
  min-height: 1.5rem;
4576
- padding: 0 var(--ax-spacing-1-alt);
4548
+ padding: 0 var(--ax-space-6);
4577
4549
  --__axc-tag-icon-size: 1.25rem;
4578
4550
  }
4579
4551
 
4580
4552
  .navds-tag--xsmall {
4581
4553
  min-height: 1.25rem;
4582
- padding: 0 var(--ax-spacing-1);
4554
+ padding: 0 var(--ax-space-4);
4583
4555
  --__axc-tag-icon-size: 1rem;
4584
4556
  --__axc-tag-icon-margin: -1px;
4585
4557
  }
@@ -4633,7 +4605,7 @@
4633
4605
  .navds-timeline__axislabels {
4634
4606
  box-sizing: content-box;
4635
4607
  height: 1rem;
4636
- margin-bottom: var(--ax-spacing-1);
4608
+ margin-bottom: var(--ax-space-4);
4637
4609
  grid-column: 2;
4638
4610
  position: relative;
4639
4611
  }
@@ -4641,9 +4613,9 @@
4641
4613
  .navds-timeline__row-label {
4642
4614
  white-space: nowrap;
4643
4615
  width: auto;
4644
- margin-right: var(--ax-spacing-4);
4616
+ margin-right: var(--ax-space-16);
4645
4617
  align-items: center;
4646
- gap: var(--ax-spacing-2);
4618
+ gap: var(--ax-space-8);
4647
4619
  grid-column: 1;
4648
4620
  min-height: 1.5rem;
4649
4621
  display: flex;
@@ -4660,8 +4632,8 @@
4660
4632
  }
4661
4633
 
4662
4634
  .navds-timeline__row {
4663
- background: var(--ax-bg-neutral);
4664
- margin: var(--ax-spacing-4) 0;
4635
+ background: var(--ax-bg-soft);
4636
+ margin: var(--ax-space-16) 0;
4665
4637
  grid-column: 2;
4666
4638
  display: flex;
4667
4639
  }
@@ -4708,7 +4680,7 @@
4708
4680
  }
4709
4681
 
4710
4682
  .navds-timeline__period--inner {
4711
- margin: 0 var(--ax-spacing-2);
4683
+ margin: 0 var(--ax-space-8);
4712
4684
  white-space: nowrap;
4713
4685
  text-overflow: clip;
4714
4686
  text-align: left;
@@ -4790,18 +4762,18 @@
4790
4762
  }
4791
4763
 
4792
4764
  .navds-timeline__period--neutral {
4793
- background: var(--ax-bg-neutral-moderate);
4794
- border: solid 1px var(--ax-border-neutral);
4795
- color: var(--ax-text-neutral-icon);
4765
+ background: var(--ax-bg-moderate);
4766
+ border: solid 1px var(--ax-border-default);
4767
+ color: var(--ax-text-icon);
4796
4768
  }
4797
4769
 
4798
4770
  .navds-timeline__period--neutral.navds-timeline__period--clickable:hover {
4799
- background: var(--ax-bg-neutral-moderate-hover);
4771
+ background: var(--ax-bg-moderate-hover);
4800
4772
  }
4801
4773
 
4802
4774
  .navds-timeline__period--neutral.navds-timeline__period--clickable.navds-timeline__period--selected {
4803
- background: var(--ax-bg-neutral-strong-pressed);
4804
- color: var(--ax-text-neutral-contrast);
4775
+ background: var(--ax-bg-strong-pressed);
4776
+ color: var(--ax-text-contrast);
4805
4777
  border: none;
4806
4778
  }
4807
4779
 
@@ -4837,7 +4809,7 @@
4837
4809
  box-shadow: inset 0 0 0 4px var(--ax-bg-danger-strong);
4838
4810
  z-index: 2;
4839
4811
  border-radius: var(--ax-border-radius-full);
4840
- padding: var(--ax-spacing-2);
4812
+ padding: var(--ax-space-8);
4841
4813
  border: none;
4842
4814
  position: relative;
4843
4815
  }
@@ -4871,7 +4843,7 @@
4871
4843
  }
4872
4844
 
4873
4845
  .navds-timeline__zoom {
4874
- margin-top: var(--ax-spacing-6);
4846
+ margin-top: var(--ax-space-24);
4875
4847
  float: right;
4876
4848
  list-style-type: none;
4877
4849
  display: flex;
@@ -4900,13 +4872,13 @@
4900
4872
  }
4901
4873
 
4902
4874
  .navds-timeline__zoom-button:not([aria-pressed="true"]):hover {
4903
- background: var(--ax-bg-neutral-moderate-hoverA);
4875
+ background: var(--ax-bg-moderate-hoverA);
4904
4876
  }
4905
4877
 
4906
4878
  .navds-timeline__zoom-button[aria-pressed="true"] {
4907
- background: var(--ax-bg-neutral-strong-pressed);
4908
- border-color: var(--ax-bg-neutral-strong-pressed);
4909
- color: var(--ax-text-neutral-contrast);
4879
+ background: var(--ax-bg-strong-pressed);
4880
+ border-color: var(--ax-bg-strong-pressed);
4881
+ color: var(--ax-text-contrast);
4910
4882
  }
4911
4883
 
4912
4884
  .navds-timeline__zoom li:focus-within {
@@ -4930,7 +4902,7 @@
4930
4902
  border: 1px solid;
4931
4903
  border-color: var(--ax-border-subtleA);
4932
4904
  border-radius: var(--ax-border-radius-large);
4933
- padding: var(--ax-spacing-4) var(--ax-spacing-5);
4905
+ padding: var(--ax-space-16) var(--ax-space-20);
4934
4906
  }
4935
4907
 
4936
4908
  @media (forced-colors: active) {
@@ -4963,7 +4935,7 @@
4963
4935
  background-color: var(--ax-bg-raised);
4964
4936
  color: var(--ax-text-default);
4965
4937
  border-radius: var(--ax-border-radius-medium);
4966
- padding: 0 var(--ax-spacing-1-alt);
4938
+ padding: 0 var(--ax-space-6);
4967
4939
  text-align: center;
4968
4940
  border: 1px solid var(--ax-border-subtleA);
4969
4941
  box-shadow: var(--ax-shadow-dialog);
@@ -5041,17 +5013,17 @@
5041
5013
  }
5042
5014
 
5043
5015
  .navds-tooltip__keys {
5044
- padding-bottom: var(--ax-spacing-1);
5045
- gap: var(--ax-spacing-1);
5016
+ padding-bottom: var(--ax-space-4);
5017
+ gap: var(--ax-space-4);
5046
5018
  display: flex;
5047
5019
  }
5048
5020
 
5049
5021
  .navds-tooltip__key {
5050
5022
  font-family: var(--ax-font-family);
5051
5023
  color: var(--ax-text-default);
5052
- padding: 0 var(--ax-spacing-1);
5024
+ padding: 0 var(--ax-space-4);
5053
5025
  border-radius: var(--ax-border-radius-small);
5054
- background: var(--ax-bg-neutral-moderateA);
5026
+ background: var(--ax-bg-moderateA);
5055
5027
  justify-content: center;
5056
5028
  align-items: center;
5057
5029
  min-width: 1.125rem;
@@ -5067,7 +5039,7 @@
5067
5039
 
5068
5040
  .navds-toggle-group__wrapper {
5069
5041
  justify-items: start;
5070
- gap: var(--ax-spacing-2);
5042
+ gap: var(--ax-space-8);
5071
5043
  display: grid;
5072
5044
  }
5073
5045
 
@@ -5086,7 +5058,7 @@
5086
5058
  }
5087
5059
 
5088
5060
  .navds-toggle-group__button {
5089
- padding: var(--ax-spacing-1) var(--ax-spacing-3);
5061
+ padding: var(--ax-space-4) var(--ax-space-12);
5090
5062
  cursor: pointer;
5091
5063
  min-height: 3rem;
5092
5064
  color: var(--ax-text-default);
@@ -5128,7 +5100,7 @@
5128
5100
 
5129
5101
  .navds-toggle-group__button-inner {
5130
5102
  align-items: center;
5131
- gap: var(--ax-spacing-2);
5103
+ gap: var(--ax-space-8);
5132
5104
  display: flex;
5133
5105
  }
5134
5106
 
@@ -5141,16 +5113,16 @@
5141
5113
  }
5142
5114
 
5143
5115
  :where(.navds-toggle-group--neutral) .navds-toggle-group__button:hover {
5144
- background-color: var(--ax-bg-neutral-moderate-hoverA);
5116
+ background-color: var(--ax-bg-moderate-hoverA);
5145
5117
  }
5146
5118
 
5147
5119
  :where(.navds-toggle-group--neutral) .navds-toggle-group__button[data-selected="true"] {
5148
- background-color: var(--ax-bg-neutral-strong-pressed);
5149
- color: var(--ax-text-neutral-contrast);
5120
+ background-color: var(--ax-bg-strong-pressed);
5121
+ color: var(--ax-text-contrast);
5150
5122
  }
5151
5123
 
5152
5124
  .navds-toggle-group--small .navds-toggle-group__button {
5153
- padding: var(--ax-spacing-05) var(--ax-spacing-3);
5125
+ padding: var(--ax-space-2) var(--ax-space-12);
5154
5126
  min-height: 2rem;
5155
5127
  }
5156
5128
 
@@ -5241,14 +5213,14 @@
5241
5213
  .navds-read-more {
5242
5214
  --__axc-read-more-icon-size: 1.5rem;
5243
5215
  --__axc-read-more-pi-start: 0px;
5244
- --__axc-read-more-pi-end: var(--ax-spacing-1);
5245
- --__axc-read-more-pb: var(--ax-spacing-1);
5216
+ --__axc-read-more-pi-end: var(--ax-space-4);
5217
+ --__axc-read-more-pb: var(--ax-space-4);
5246
5218
  }
5247
5219
 
5248
5220
  .navds-read-more__button {
5249
5221
  cursor: pointer;
5250
5222
  align-items: flex-start;
5251
- gap: var(--ax-spacing-1);
5223
+ gap: var(--ax-space-4);
5252
5224
  color: var(--ax-text-accent);
5253
5225
  padding-inline: var(--__axc-read-more-pi-start) var(--__axc-read-more-pi-end);
5254
5226
  padding-block: var(--__axc-read-more-pb);
@@ -5260,8 +5232,8 @@
5260
5232
  }
5261
5233
 
5262
5234
  .navds-read-more__button:focus-visible {
5263
- outline: 2px solid var(--ax-border-focus);
5264
- outline-offset: 2px;
5235
+ outline: 3px solid var(--ax-border-focus);
5236
+ outline-offset: 3px;
5265
5237
  }
5266
5238
 
5267
5239
  .navds-read-more__button[data-state="open"] .navds-read-more__expand-icon {
@@ -5273,7 +5245,7 @@
5273
5245
  }
5274
5246
 
5275
5247
  .navds-read-more:is([data-volume="low"], :not([data-volume])) .navds-read-more__button:hover {
5276
- background-color: var(--ax-bg-neutral-hoverA);
5248
+ background-color: var(--ax-bg-hoverA);
5277
5249
  color: var(--ax-text-accent-strong);
5278
5250
  }
5279
5251
 
@@ -5288,21 +5260,21 @@
5288
5260
  }
5289
5261
 
5290
5262
  .navds-read-more[data-volume="high"].navds-read-more--large {
5291
- --__axc-read-more-pi-start: var(--ax-spacing-3);
5292
- --__axc-read-more-pi-end: var(--ax-spacing-6);
5263
+ --__axc-read-more-pi-start: var(--ax-space-12);
5264
+ --__axc-read-more-pi-end: var(--ax-space-24);
5293
5265
  }
5294
5266
 
5295
5267
  .navds-read-more[data-volume="high"].navds-read-more--small, .navds-read-more[data-volume="high"].navds-read-more--medium {
5296
- --__axc-read-more-pi-start: var(--ax-spacing-2);
5297
- --__axc-read-more-pi-end: var(--ax-spacing-4);
5268
+ --__axc-read-more-pi-start: var(--ax-space-8);
5269
+ --__axc-read-more-pi-end: var(--ax-space-16);
5298
5270
  }
5299
5271
 
5300
5272
  .navds-read-more__content {
5301
- margin-top: var(--ax-spacing-2);
5302
- border-left: 2px solid var(--ax-border-neutral-subtleA);
5273
+ margin-top: var(--ax-space-8);
5274
+ border-left: 2px solid var(--ax-border-subtleA);
5303
5275
  color: var(--ax-text-default);
5304
5276
  margin-left: calc(var(--__axc-read-more-pi-start) + var(--__axc-read-more-icon-size) / 2 - 1px);
5305
- padding-left: calc(var(--__axc-read-more-icon-size) / 2 - 1px + var(--ax-spacing-1));
5277
+ padding-left: calc(var(--__axc-read-more-icon-size) / 2 - 1px + var(--ax-space-4));
5306
5278
  }
5307
5279
 
5308
5280
  .navds-read-more__content[data-state="closed"] {
@@ -5316,12 +5288,12 @@
5316
5288
  }
5317
5289
 
5318
5290
  .navds-read-more--large {
5319
- --__axc-read-more-pb: var(--ax-spacing-3);
5291
+ --__axc-read-more-pb: var(--ax-space-12);
5320
5292
  }
5321
5293
 
5322
5294
  .navds-read-more--small {
5323
5295
  --__axc-read-more-icon-size: 1.25rem;
5324
- --__axc-read-more-pb: var(--ax-spacing-05);
5296
+ --__axc-read-more-pb: var(--ax-space-2);
5325
5297
  }
5326
5298
 
5327
5299
  @media (forced-colors: active) {
@@ -5333,9 +5305,9 @@
5333
5305
  }
5334
5306
 
5335
5307
  .navds-progress-bar {
5336
- background: var(--ax-bg-neutral-moderateA);
5308
+ background: var(--ax-bg-moderateA);
5337
5309
  border-radius: var(--ax-border-radius-full);
5338
- box-shadow: inset 0 0 0 1px var(--ax-border-neutral-subtleA);
5310
+ box-shadow: inset 0 0 0 1px var(--ax-border-subtleA);
5339
5311
  position: relative;
5340
5312
  overflow: hidden;
5341
5313
  }
@@ -5438,7 +5410,7 @@
5438
5410
  }
5439
5411
 
5440
5412
  .navds-skeleton {
5441
- background-color: var(--ax-bg-neutral-moderateA);
5413
+ background-color: var(--ax-bg-moderateA);
5442
5414
  pointer-events: none;
5443
5415
  height: 1.3em;
5444
5416
  animation: 2s cubic-bezier(.4, 0, .6, 1) infinite akselSkeletonAnimation;
@@ -5518,7 +5490,7 @@
5518
5490
  grid-template-rows: [line-1] auto [step-start] var(--__axc-stepper-circle-size) [line-2 step-end] auto;
5519
5491
  grid-template-columns: var(--__axc-stepper-circle-size) auto;
5520
5492
  justify-items: flex-start;
5521
- gap: var(--ax-spacing-2);
5493
+ gap: var(--ax-space-8);
5522
5494
  display: grid;
5523
5495
  }
5524
5496
 
@@ -5532,11 +5504,11 @@
5532
5504
  }
5533
5505
 
5534
5506
  .navds-stepper__item--non-interactive .navds-stepper__line {
5535
- background-color: var(--ax-border-neutral-strong);
5507
+ background-color: var(--ax-border-strong);
5536
5508
  }
5537
5509
 
5538
5510
  .navds-stepper__item:has( + .navds-stepper__item > .navds-stepper__step[data-interactive="false"]) .navds-stepper__line--2 {
5539
- background-color: var(--ax-border-neutral-strong);
5511
+ background-color: var(--ax-border-strong);
5540
5512
  }
5541
5513
 
5542
5514
  .navds-stepper__line--1 {
@@ -5555,7 +5527,7 @@
5555
5527
  .navds-stepper__step {
5556
5528
  grid-area: 2 / 1 / -1 / -1;
5557
5529
  grid-template-columns: [circle] var(--__axc-stepper-circle-size) [content] auto;
5558
- gap: var(--ax-spacing-2);
5530
+ gap: var(--ax-space-8);
5559
5531
  cursor: pointer;
5560
5532
  padding: var(--__axc-stepper-border-width);
5561
5533
  margin: calc(var(--__axc-stepper-border-width) * -1) calc(var(--__axc-stepper-border-width) * -1) var(--__axc-stepper-circle-size);
@@ -5640,23 +5612,23 @@
5640
5612
  }
5641
5613
 
5642
5614
  .navds-stepper__step[data-interactive="false"] {
5643
- color: var(--ax-text-neutral);
5615
+ color: var(--ax-text-default);
5644
5616
  cursor: default;
5645
5617
  }
5646
5618
 
5647
5619
  .navds-stepper__step[data-interactive="false"] .navds-stepper__circle {
5648
- color: var(--ax-text-neutral);
5649
- border-color: var(--ax-border-neutral-strong);
5620
+ color: var(--ax-text-default);
5621
+ border-color: var(--ax-border-strong);
5650
5622
  }
5651
5623
 
5652
5624
  .navds-stepper__step[data-interactive="false"][data-active="true"] .navds-stepper__content {
5653
- color: var(--ax-text-neutral-strong);
5625
+ color: var(--ax-text-subtle);
5654
5626
  }
5655
5627
 
5656
5628
  .navds-stepper__step[data-interactive="false"][data-active="true"] .navds-stepper__circle {
5657
- color: var(--ax-text-neutral-contrast);
5658
- background-color: var(--ax-bg-neutral-strong-pressed);
5659
- border-color: var(--ax-bg-neutral-strong-pressed);
5629
+ color: var(--ax-text-contrast);
5630
+ background-color: var(--ax-bg-strong-pressed);
5631
+ border-color: var(--ax-bg-strong-pressed);
5660
5632
  }
5661
5633
 
5662
5634
  .navds-stepper__content {
@@ -5750,7 +5722,7 @@
5750
5722
  }
5751
5723
 
5752
5724
  .navds-table__body .navds-table__row--shade-on-hover:not(.navds-table__expandable-row--expansion-disabled):hover {
5753
- background-color: var(--ax-bg-neutral-hoverA);
5725
+ background-color: var(--ax-bg-hoverA);
5754
5726
  transition: background-color 70ms cubic-bezier(.2, 0, 0, 1);
5755
5727
  }
5756
5728
 
@@ -5763,11 +5735,11 @@
5763
5735
  }
5764
5736
 
5765
5737
  .navds-table__row--selected {
5766
- background-color: var(--ax-bg-accent);
5738
+ background-color: var(--ax-bg-accent-soft);
5767
5739
  }
5768
5740
 
5769
5741
  .navds-table--zebra-stripes .navds-table__body :where(.navds-table__row:nth-child(odd):not(.navds-table__row--selected)) {
5770
- background-color: var(--ax-bg-neutral);
5742
+ background-color: var(--ax-bg-soft);
5771
5743
  }
5772
5744
 
5773
5745
  .navds-table--zebra-stripes .navds-table__body :where(.navds-table__expandable-row:nth-child(4n+1):not(.navds-table__row--selected)) {
@@ -5775,11 +5747,11 @@
5775
5747
  }
5776
5748
 
5777
5749
  .navds-table--zebra-stripes .navds-table__body .navds-table__expanded-row:nth-child(4n) {
5778
- background-color: var(--ax-bg-neutral);
5750
+ background-color: var(--ax-bg-soft);
5779
5751
  }
5780
5752
 
5781
5753
  .navds-table__header-cell, .navds-table__data-cell {
5782
- padding: var(--ax-spacing-3) var(--ax-spacing-2);
5754
+ padding: var(--ax-space-12) var(--ax-space-8);
5783
5755
  border-bottom: 1px solid var(--ax-border-default);
5784
5756
  text-align: left;
5785
5757
  display: table-cell;
@@ -5806,11 +5778,11 @@
5806
5778
  }
5807
5779
 
5808
5780
  .navds-table--large .navds-table__header-cell, .navds-table--large .navds-table__data-cell {
5809
- padding: var(--ax-spacing-4) var(--ax-spacing-2);
5781
+ padding: var(--ax-space-16) var(--ax-space-8);
5810
5782
  }
5811
5783
 
5812
5784
  .navds-table--small .navds-table__header-cell, .navds-table--small .navds-table__data-cell {
5813
- padding: var(--ax-spacing-1) var(--ax-spacing-2);
5785
+ padding: var(--ax-space-4) var(--ax-space-8);
5814
5786
  }
5815
5787
 
5816
5788
  .navds-table :not(.navds-checkboxes) > .navds-checkbox .navds-checkbox__input {
@@ -5829,8 +5801,8 @@
5829
5801
  appearance: none;
5830
5802
  color: var(--ax-text-accent);
5831
5803
  cursor: pointer;
5832
- padding: var(--ax-spacing-4) var(--ax-spacing-3);
5833
- gap: var(--ax-spacing-2);
5804
+ padding: var(--ax-space-16) var(--ax-space-12);
5805
+ gap: var(--ax-space-8);
5834
5806
  width: 100%;
5835
5807
  line-height: inherit;
5836
5808
  font-weight: inherit;
@@ -5842,11 +5814,11 @@
5842
5814
  }
5843
5815
 
5844
5816
  .navds-table--small .navds-table__sort-button {
5845
- padding: var(--ax-spacing-2) var(--ax-spacing-3);
5817
+ padding: var(--ax-space-8) var(--ax-space-12);
5846
5818
  }
5847
5819
 
5848
5820
  .navds-table__sort-button:hover {
5849
- background-color: var(--ax-bg-neutral-hoverA);
5821
+ background-color: var(--ax-bg-hoverA);
5850
5822
  }
5851
5823
 
5852
5824
  .navds-table__sort-button:focus-visible {
@@ -5872,7 +5844,7 @@
5872
5844
  font-size: 1rem;
5873
5845
  }
5874
5846
 
5875
- .navds-table__expandable-row:not(.navds-table__expandable-row--open) .navds-table__data-cell {
5847
+ .navds-table__expandable-row:not(.navds-table__expandable-row--open) :where(.navds-table__data-cell, .navds-table__header-cell) {
5876
5848
  transition: border-bottom-color .15s cubic-bezier(.95, .05, .8, .04);
5877
5849
  }
5878
5850
 
@@ -5880,14 +5852,10 @@
5880
5852
  cursor: pointer;
5881
5853
  }
5882
5854
 
5883
- .navds-table__expandable-row--open .navds-table__data-cell {
5855
+ .navds-table__expandable-row--open :where(.navds-table__data-cell, .navds-table__header-cell) {
5884
5856
  border-bottom-color: rgba(0, 0, 0, 0);
5885
5857
  }
5886
5858
 
5887
- .navds-table__expandable-row--open .navds-table__header-cell {
5888
- border-color: var(--ax-border-default);
5889
- }
5890
-
5891
5859
  .navds-table__expandable-row--open .navds-table__toggle-expand-cell--open {
5892
5860
  border-color: rgba(0, 0, 0, 0);
5893
5861
  }
@@ -5898,11 +5866,11 @@
5898
5866
  }
5899
5867
 
5900
5868
  .navds-table--large .navds-table__toggle-expand-cell {
5901
- padding: 0 var(--ax-spacing-2);
5869
+ padding: 0 var(--ax-space-8);
5902
5870
  }
5903
5871
 
5904
5872
  .navds-table--small .navds-table__toggle-expand-cell {
5905
- padding: var(--ax-spacing-1) var(--ax-spacing-2);
5873
+ padding: var(--ax-space-4) var(--ax-space-8);
5906
5874
  }
5907
5875
 
5908
5876
  .navds-table__toggle-expand-button {
@@ -5928,7 +5896,7 @@
5928
5896
  }
5929
5897
 
5930
5898
  .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 {
5931
- background-color: var(--ax-bg-neutral-hoverA);
5899
+ background-color: var(--ax-bg-hoverA);
5932
5900
  }
5933
5901
 
5934
5902
  .navds-table__toggle-expand-cell--open > :where(.navds-table__toggle-expand-button) :where(.navds-table__expandable-icon) {
@@ -5952,15 +5920,32 @@
5952
5920
  }
5953
5921
 
5954
5922
  .navds-table__expanded-row-content {
5955
- padding: var(--ax-spacing-4) calc(var(--ax-spacing-2) + 3rem);
5923
+ --__ac-table-expanded-row-pi: calc(var(--ax-space-8) + 3rem);
5924
+ padding-block: var(--ax-space-16);
5956
5925
  }
5957
5926
 
5958
5927
  .navds-table--small .navds-table__expanded-row-content {
5959
- padding: var(--ax-spacing-2) calc(var(--ax-spacing-2) + 3rem);
5928
+ padding-block: var(--ax-space-8);
5929
+ }
5930
+
5931
+ .navds-table__expanded-row-content--gutter-both {
5932
+ padding-inline: var(--__ac-table-expanded-row-pi);
5933
+ }
5934
+
5935
+ .navds-table__expanded-row-content--gutter-left {
5936
+ padding-inline: var(--__ac-table-expanded-row-pi) var(--ax-space-8);
5937
+ }
5938
+
5939
+ .navds-table__expanded-row-content--gutter-right {
5940
+ padding-inline: var(--ax-space-8) var(--__ac-table-expanded-row-pi);
5941
+ }
5942
+
5943
+ .navds-table__expanded-row-content--gutter-none {
5944
+ padding-inline: var(--ax-space-8);
5960
5945
  }
5961
5946
 
5962
5947
  .navds-tabs__tablist-wrapper {
5963
- box-shadow: inset 0 -1px var(--ax-border-neutral-subtle);
5948
+ box-shadow: inset 0 -1px var(--ax-border-subtle);
5964
5949
  width: 100%;
5965
5950
  display: flex;
5966
5951
  }
@@ -5980,7 +5965,7 @@
5980
5965
  }
5981
5966
 
5982
5967
  .navds-tabs__scroll-button {
5983
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
5968
+ padding: var(--ax-space-12) var(--ax-space-16);
5984
5969
  cursor: pointer;
5985
5970
  justify-content: center;
5986
5971
  align-items: center;
@@ -5994,7 +5979,7 @@
5994
5979
  }
5995
5980
 
5996
5981
  .navds-tabs--small .navds-tabs__scroll-button {
5997
- padding: var(--ax-spacing-1-alt) var(--ax-spacing-4);
5982
+ padding: var(--ax-space-6) var(--ax-space-16);
5998
5983
  width: 2rem;
5999
5984
  }
6000
5985
 
@@ -6004,11 +5989,11 @@
6004
5989
 
6005
5990
  .navds-tabs__tab {
6006
5991
  min-height: 3rem;
6007
- padding: var(--ax-spacing-3) var(--ax-spacing-4);
5992
+ padding: var(--ax-space-12) var(--ax-space-16);
6008
5993
  color: var(--ax-text-default);
6009
5994
  cursor: pointer;
6010
5995
  --__axc-tabs-line-width: 0;
6011
- --__axc-tabs-line-color: var(--ax-border-neutral-subtle);
5996
+ --__axc-tabs-line-color: var(--ax-border-subtle);
6012
5997
  box-shadow: inset 0 var(--__axc-tabs-line-width) var(--__axc-tabs-line-color);
6013
5998
  background: none;
6014
5999
  border: none;
@@ -6034,7 +6019,7 @@
6034
6019
 
6035
6020
  .navds-tabs__tab-inner {
6036
6021
  align-items: center;
6037
- gap: var(--ax-spacing-1);
6022
+ gap: var(--ax-space-4);
6038
6023
  display: flex;
6039
6024
  }
6040
6025
 
@@ -6053,11 +6038,11 @@
6053
6038
 
6054
6039
  .navds-tabs__tab--small {
6055
6040
  min-height: 2rem;
6056
- padding: var(--ax-spacing-1-alt) var(--ax-spacing-4);
6041
+ padding: var(--ax-space-6) var(--ax-space-16);
6057
6042
  }
6058
6043
 
6059
6044
  .navds-tabs__tab-icon--top, .navds-tabs__tab--small.navds-tabs__tab-icon--top {
6060
- padding: var(--ax-spacing-1) var(--ax-spacing-4);
6045
+ padding: var(--ax-space-4) var(--ax-space-16);
6061
6046
  }
6062
6047
 
6063
6048
  :is(.navds-tabs__tab, .navds-tabs__tab--small.navds-tabs__tab--icon-only, .navds-tabs__tab--small.navds-tabs__tab-icon--top) svg {
@@ -6084,29 +6069,29 @@
6084
6069
  @media (forced-colors: active) {
6085
6070
  .navds-tabs__tab[data-state="active"] {
6086
6071
  border-bottom: 3px solid canvastext;
6087
- padding-block-end: calc(var(--ax-spacing-3) - 3px);
6072
+ padding-block-end: calc(var(--ax-space-12) - 3px);
6088
6073
  }
6089
6074
 
6090
6075
  .navds-tabs__tab--small[data-state="active"] {
6091
- padding-block-end: calc(var(--ax-spacing-1-alt) - 3px);
6076
+ padding-block-end: calc(var(--ax-space-6) - 3px);
6092
6077
  }
6093
6078
 
6094
6079
  .navds-tabs__tab-icon--top[data-state="active"], .navds-tabs__tab--small.navds-tabs__tab-icon--top[data-state="active"] {
6095
- padding-block-end: calc(var(--ax-spacing-1) - 3px);
6080
+ padding-block-end: calc(var(--ax-space-4) - 3px);
6096
6081
  }
6097
6082
  }
6098
6083
 
6099
6084
  .navds-list ul, .navds-list ol {
6100
- margin-block: var(--ax-spacing-4);
6085
+ margin-block: var(--ax-space-16);
6101
6086
  padding: 0;
6102
6087
  }
6103
6088
 
6104
6089
  .navds-list--small ul, .navds-list--small ol {
6105
- margin-block: var(--ax-spacing-3);
6090
+ margin-block: var(--ax-space-12);
6106
6091
  }
6107
6092
 
6108
6093
  .navds-list .navds-list :where(ul, ol) {
6109
- margin-block: var(--ax-spacing-2) 0;
6094
+ margin-block: var(--ax-space-8) 0;
6110
6095
  }
6111
6096
 
6112
6097
  .navds-list ol {
@@ -6123,7 +6108,7 @@
6123
6108
  }
6124
6109
 
6125
6110
  .navds-list ul > .navds-list__item {
6126
- gap: var(--ax-spacing-2);
6111
+ gap: var(--ax-space-8);
6127
6112
  grid-template-columns: auto 1fr;
6128
6113
  display: grid;
6129
6114
  }
@@ -6159,7 +6144,7 @@
6159
6144
  }
6160
6145
 
6161
6146
  .navds-list__item {
6162
- margin-block-end: var(--ax-spacing-2);
6147
+ margin-block-end: var(--ax-space-8);
6163
6148
  }
6164
6149
 
6165
6150
  .navds-list__item:last-child {
@@ -7167,7 +7152,7 @@
7167
7152
  }
7168
7153
 
7169
7154
  .navds-page__content--padding {
7170
- padding-block-end: var(--ax-spacing-16);
7155
+ padding-block-end: var(--ax-space-64);
7171
7156
  }
7172
7157
 
7173
7158
  .navds-pageblock--text {