@navikt/ds-css 7.3.0 → 7.4.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 (43) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/baseline/_utilities.css +1 -1
  3. package/button.css +1 -0
  4. package/darkside/baseline/utilities.darkside.css +1 -1
  5. package/darkside/index.css +8 -8
  6. package/date.css +9 -9
  7. package/dist/component/date.css +9 -9
  8. package/dist/component/date.min.css +1 -1
  9. package/dist/component/dropdown.css +1 -1
  10. package/dist/component/dropdown.min.css +1 -1
  11. package/dist/component/form.css +33 -35
  12. package/dist/component/form.min.css +2 -2
  13. package/dist/component/index.css +1437 -56
  14. package/dist/component/index.min.css +6 -5
  15. package/dist/component/modal.css +6 -4
  16. package/dist/component/primitives.css +1 -2
  17. package/dist/component/primitives.min.css +1 -1
  18. package/dist/component/stepper.css +1 -2
  19. package/dist/component/stepper.min.css +1 -1
  20. package/dist/component/togglegroup.css +1 -1
  21. package/dist/component/togglegroup.min.css +1 -1
  22. package/dist/components.css +1012 -54
  23. package/dist/components.min.css +6 -4
  24. package/dist/global/baseline.css +1 -1
  25. package/dist/global/baseline.min.css +1 -1
  26. package/dist/global/tokens.css +1 -1
  27. package/dist/global/tokens.min.css +1 -1
  28. package/dist/index.css +1437 -56
  29. package/dist/index.min.css +6 -5
  30. package/dropdown.css +1 -1
  31. package/form/combobox.css +7 -2
  32. package/form/fieldset.css +2 -2
  33. package/form/radio-checkbox.css +16 -22
  34. package/form/search.css +3 -3
  35. package/form/select.css +1 -1
  36. package/form/text-field.css +3 -3
  37. package/form/textarea.css +2 -2
  38. package/index.css +1 -0
  39. package/modal.css +6 -4
  40. package/package.json +2 -2
  41. package/primitives/stack.css +1 -2
  42. package/stepper.css +1 -2
  43. package/toggle-group.css +1 -1
@@ -1,4 +1,956 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root, :host {
6
+ --a-version: "7.4.0";
7
+ --a-spacing-1-alt: 0.375rem;
8
+ --a-spacing-05: 0.125rem;
9
+ --a-spacing-32: 8rem;
10
+ --a-spacing-24: 6rem;
11
+ --a-spacing-20: 5rem;
12
+ --a-spacing-18: 4.5rem;
13
+ --a-spacing-16: 4rem;
14
+ --a-spacing-14: 3.5rem;
15
+ --a-spacing-12: 3rem;
16
+ --a-spacing-11: 2.75rem;
17
+ --a-spacing-10: 2.5rem;
18
+ --a-spacing-9: 2.25rem;
19
+ --a-spacing-8: 2rem;
20
+ --a-spacing-7: 1.75rem;
21
+ --a-spacing-6: 1.5rem;
22
+ --a-spacing-5: 1.25rem;
23
+ --a-spacing-4: 1rem;
24
+ --a-spacing-3: 0.75rem;
25
+ --a-spacing-2: 0.5rem;
26
+ --a-spacing-1: 0.25rem;
27
+ --a-spacing-0: 0;
28
+ --a-shadow-xlarge: 0px 2px 5px 0px rgba(0, 0, 0, 0.15), 0px 10px 24px 0px rgba(0, 0, 0, 0.18), 0px 0px 1px 0px rgba(0, 0, 0, 0.08);
29
+ --a-shadow-large: 0px 2px 5px 0px rgba(0, 0, 0, 0.15), 0px 10px 16px 0px rgba(0, 0, 0, 0.12), 0px 0px 1px 0px rgba(0, 0, 0, 0.12);
30
+ --a-shadow-medium: 0px 5px 12px 0px rgba(0, 0, 0, 0.13), 0px 1px 3px 0px rgba(0, 0, 0, 0.10), 0px 0px 1px 0px rgba(0, 0, 0, 0.15);
31
+ --a-shadow-small: 0px 3px 8px 0px rgba(0, 0, 0, 0.10), 0px 1px 3px 0px rgba(0, 0, 0, 0.10), 0px 0px 1px 0px rgba(0, 0, 0, 0.18);
32
+ --a-shadow-xsmall: 0px 1px 3px 0px rgba(0, 0, 0, 0.15), 0px 0px 1px 0px rgba(0, 0, 0, 0.20);
33
+ --a-purple-900: rgba(31, 20, 47, 1);
34
+ --a-purple-800: rgba(48, 31, 70, 1);
35
+ --a-purple-700: rgba(65, 43, 93, 1);
36
+ --a-purple-600: rgba(82, 56, 116, 1);
37
+ --a-purple-500: rgba(99, 70, 137, 1);
38
+ --a-purple-400: rgba(130, 105, 162, 1);
39
+ --a-purple-300: rgba(161, 141, 187, 1);
40
+ --a-purple-200: rgba(192, 178, 210, 1);
41
+ --a-purple-100: rgba(224, 216, 233, 1);
42
+ --a-purple-50: rgba(239, 236, 244, 1);
43
+ --a-orange-900: rgba(82, 51, 0, 1);
44
+ --a-orange-800: rgba(125, 76, 0, 1);
45
+ --a-orange-700: rgba(168, 100, 0, 1);
46
+ --a-orange-600: rgba(199, 115, 0, 1);
47
+ --a-orange-500: rgba(255, 145, 0, 1);
48
+ --a-orange-400: rgba(255, 170, 51, 1);
49
+ --a-orange-300: rgba(255, 193, 102, 1);
50
+ --a-orange-200: rgba(255, 215, 153, 1);
51
+ --a-orange-100: rgba(255, 236, 204, 1);
52
+ --a-orange-50: rgba(255, 249, 240, 1);
53
+ --a-limegreen-900: rgba(71, 78, 0, 1);
54
+ --a-limegreen-800: rgba(102, 110, 0, 1);
55
+ --a-limegreen-700: rgba(127, 137, 0, 1);
56
+ --a-limegreen-600: rgba(147, 158, 0, 1);
57
+ --a-limegreen-500: rgba(162, 173, 0, 1);
58
+ --a-limegreen-400: rgba(193, 203, 51, 1);
59
+ --a-limegreen-300: rgba(217, 227, 102, 1);
60
+ --a-limegreen-200: rgba(236, 243, 153, 1);
61
+ --a-limegreen-100: rgba(249, 252, 204, 1);
62
+ --a-limegreen-50: rgba(253, 255, 230, 1);
63
+ --a-lightblue-900: rgba(19, 72, 82, 1);
64
+ --a-lightblue-800: rgba(35, 107, 125, 1);
65
+ --a-lightblue-700: rgba(54, 141, 168, 1);
66
+ --a-lightblue-600: rgba(76, 173, 205, 1);
67
+ --a-lightblue-500: rgba(102, 203, 236, 1);
68
+ --a-lightblue-400: rgba(124, 218, 248, 1);
69
+ --a-lightblue-300: rgba(151, 230, 255, 1);
70
+ --a-lightblue-200: rgba(181, 241, 255, 1);
71
+ --a-lightblue-100: rgba(216, 249, 255, 1);
72
+ --a-lightblue-50: rgba(235, 252, 255, 1);
73
+ --a-green-900: rgba(0, 59, 15, 1);
74
+ --a-green-800: rgba(0, 85, 25, 1);
75
+ --a-green-700: rgba(0, 106, 35, 1);
76
+ --a-green-600: rgba(0, 124, 46, 1);
77
+ --a-green-500: rgba(6, 137, 58, 1);
78
+ --a-green-400: rgba(42, 167, 88, 1);
79
+ --a-green-300: rgba(102, 199, 134, 1);
80
+ --a-green-200: rgba(153, 222, 173, 1);
81
+ --a-green-100: rgba(204, 241, 214, 1);
82
+ --a-green-50: rgba(243, 252, 245, 1);
83
+ --a-deepblue-900: rgba(0, 36, 58, 1);
84
+ --a-deepblue-800: rgba(0, 52, 83, 1);
85
+ --a-deepblue-700: rgba(0, 67, 103, 1);
86
+ --a-deepblue-600: rgba(0, 80, 119, 1);
87
+ --a-deepblue-500: rgba(0, 91, 130, 1);
88
+ --a-deepblue-400: rgba(51, 128, 165, 1);
89
+ --a-deepblue-300: rgba(102, 163, 196, 1);
90
+ --a-deepblue-200: rgba(153, 196, 221, 1);
91
+ --a-deepblue-100: rgba(204, 226, 240, 1);
92
+ --a-deepblue-50: rgba(230, 241, 248, 1);
93
+ --a-red-900: rgba(38, 0, 0, 1);
94
+ --a-red-800: rgba(92, 0, 0, 1);
95
+ --a-red-700: rgba(140, 0, 0, 1);
96
+ --a-red-600: rgba(173, 0, 0, 1);
97
+ --a-red-500: rgba(195, 0, 0, 1);
98
+ --a-red-400: rgba(222, 46, 46, 1);
99
+ --a-red-300: rgba(242, 92, 92, 1);
100
+ --a-red-200: rgba(246, 130, 130, 1);
101
+ --a-red-100: rgba(255, 194, 194, 1);
102
+ --a-red-50: rgba(255, 230, 230, 1);
103
+ --a-blue-900: rgba(0, 34, 82, 1);
104
+ --a-blue-800: rgba(0, 52, 125, 1);
105
+ --a-blue-700: rgba(0, 69, 156, 1);
106
+ --a-blue-600: rgba(0, 86, 180, 1);
107
+ --a-blue-500: rgba(0, 103, 197, 1);
108
+ --a-blue-400: rgba(51, 134, 224, 1);
109
+ --a-blue-300: rgba(102, 165, 244, 1);
110
+ --a-blue-200: rgba(153, 195, 255, 1);
111
+ --a-blue-100: rgba(204, 225, 255, 1);
112
+ --a-blue-50: rgba(230, 240, 255, 1);
113
+ --a-grayalpha-900: rgba(2, 5, 9, 0.87);
114
+ --a-grayalpha-800: rgba(3, 11, 22, 0.75);
115
+ --a-grayalpha-700: rgba(1, 11, 24, 0.68);
116
+ --a-grayalpha-600: rgba(2, 15, 34, 0.6);
117
+ --a-grayalpha-500: rgba(2, 20, 49, 0.49);
118
+ --a-grayalpha-400: rgba(5, 23, 51, 0.34);
119
+ --a-grayalpha-300: rgba(7, 26, 54, 0.21);
120
+ --a-grayalpha-200: rgba(17, 41, 64, 0.13);
121
+ --a-grayalpha-100: rgba(18, 43, 68, 0.08);
122
+ --a-grayalpha-50: rgba(38, 55, 89, 0.06);
123
+ --a-gray-900: rgba(35, 38, 42, 1);
124
+ --a-gray-800: rgba(66, 71, 79, 1);
125
+ --a-gray-700: rgba(82, 89, 98, 1);
126
+ --a-gray-600: rgba(103, 111, 123, 1);
127
+ --a-gray-500: rgba(131, 140, 154, 1);
128
+ --a-gray-400: rgba(170, 176, 186, 1);
129
+ --a-gray-300: rgba(203, 207, 213, 1);
130
+ --a-gray-200: rgba(224, 227, 230, 1);
131
+ --a-gray-100: rgba(236, 238, 240, 1);
132
+ --a-gray-50: rgba(242, 243, 245, 1);
133
+ --a-nav-red: rgba(195, 0, 0, 1);
134
+ --a-white: rgba(255, 255, 255, 1);
135
+ --a-transparent: rgba(255, 255, 255, 0);
136
+ --a-border-radius-full: 9999px;
137
+ --a-border-radius-xlarge: 12px;
138
+ --a-border-radius-large: 8px;
139
+ --a-border-radius-medium: 4px;
140
+ --a-border-radius-small: 2px;
141
+ --a-z-index-tooltip: 3000;
142
+ --a-z-index-focus: 10;
143
+ --a-z-index-popover: 1000;
144
+ --a-font-weight-regular: 400;
145
+ --a-font-weight-bold: 600;
146
+ --a-font-size-small: 0.875rem;
147
+ --a-font-size-medium: 1rem;
148
+ --a-font-size-large: 1.125rem;
149
+ --a-font-size-xlarge: 1.25rem;
150
+ --a-font-size-heading-xsmall: 1.125rem;
151
+ --a-font-size-heading-small: 1.25rem;
152
+ --a-font-size-heading-medium: 1.5rem;
153
+ --a-font-size-heading-large: 1.75rem;
154
+ --a-font-size-heading-xlarge: 2rem;
155
+ --a-font-size-heading-2xlarge: 2.5rem;
156
+ --a-font-line-height-medium: 1.25rem;
157
+ --a-font-line-height-large: 1.5rem;
158
+ --a-font-line-height-xlarge: 1.75rem;
159
+ --a-font-line-height-heading-xsmall: 1.5rem;
160
+ --a-font-line-height-heading-small: 1.75rem;
161
+ --a-font-line-height-heading-medium: 2rem;
162
+ --a-font-line-height-heading-large: 2.25rem;
163
+ --a-font-line-height-heading-xlarge: 2.5rem;
164
+ --a-font-line-height-heading-2xlarge: 3.25rem;
165
+ --a-font-family: 'Source Sans 3', 'Source Sans Pro', Arial, sans-serif;
166
+ --a-text-width-max: 576px;
167
+ --a-breakpoint-2xl-down: 1439px;
168
+ --a-breakpoint-2xl: 1440px;
169
+ --a-breakpoint-xl-down: 1279px;
170
+ --a-breakpoint-xl: 1280px;
171
+ --a-breakpoint-lg-down: 1023px;
172
+ --a-breakpoint-lg: 1024px;
173
+ --a-breakpoint-md-down: 767px;
174
+ --a-breakpoint-md: 768px;
175
+ --a-breakpoint-sm-down: 479px;
176
+ --a-breakpoint-sm: 480px;
177
+ --a-breakpoint-xs: 0;
178
+ --a-data-border-6: var(--a-purple-400);
179
+ --a-data-border-5: var(--a-green-400);
180
+ --a-data-border-4: var(--a-lightblue-700);
181
+ --a-data-border-3: var(--a-orange-600);
182
+ --a-data-border-2: var(--a-deepblue-500);
183
+ --a-data-border-1: var(--a-blue-400);
184
+ --a-data-surface-6-subtle: var(--a-purple-200);
185
+ --a-data-surface-6: var(--a-purple-400);
186
+ --a-data-surface-5-subtle: var(--a-green-200);
187
+ --a-data-surface-5: var(--a-green-400);
188
+ --a-data-surface-4-subtle: var(--a-lightblue-500);
189
+ --a-data-surface-4: var(--a-lightblue-700);
190
+ --a-data-surface-3-subtle: var(--a-orange-300);
191
+ --a-data-surface-3: var(--a-orange-600);
192
+ --a-data-surface-2-subtle: var(--a-deepblue-200);
193
+ --a-data-surface-2: var(--a-deepblue-500);
194
+ --a-data-surface-1-subtle: var(--a-blue-100);
195
+ --a-data-surface-1: var(--a-blue-400);
196
+ --a-text-on-alt-3: var(--a-white);
197
+ --a-text-on-alt-2: var(--a-gray-900);
198
+ --a-text-on-alt-1: var(--a-white);
199
+ --a-text-on-info: var(--a-gray-900);
200
+ --a-text-on-warning: var(--a-gray-900);
201
+ --a-text-on-danger: var(--a-white);
202
+ --a-text-on-success: var(--a-white);
203
+ --a-text-on-action: var(--a-white);
204
+ --a-text-on-neutral: var(--a-white);
205
+ --a-text-on-inverted: var(--a-white);
206
+ --a-text-action: var(--a-blue-500);
207
+ --a-text-action-on-action-subtle: var(--a-blue-600);
208
+ --a-text-action-hover: var(--a-blue-600);
209
+ --a-text-action-selected: var(--a-blue-700);
210
+ --a-text-danger: var(--a-red-500);
211
+ --a-text-visited: var(--a-purple-500);
212
+ --a-text-subtle: var(--a-grayalpha-700);
213
+ --a-text-default: var(--a-gray-900);
214
+ --a-surface-alt-3: var(--a-deepblue-500);
215
+ --a-surface-alt-3-strong: var(--a-deepblue-800);
216
+ --a-surface-alt-3-moderate: var(--a-deepblue-200);
217
+ --a-surface-alt-3-subtle: var(--a-deepblue-100);
218
+ --a-surface-alt-2: var(--a-limegreen-400);
219
+ --a-surface-alt-2-moderate: var(--a-limegreen-200);
220
+ --a-surface-alt-2-subtle: var(--a-limegreen-100);
221
+ --a-surface-alt-1: var(--a-purple-400);
222
+ --a-surface-alt-1-moderate: var(--a-purple-200);
223
+ --a-surface-alt-1-subtle: var(--a-purple-100);
224
+ --a-surface-info: var(--a-lightblue-500);
225
+ --a-surface-info-moderate: var(--a-lightblue-200);
226
+ --a-surface-info-subtle: var(--a-lightblue-100);
227
+ --a-surface-warning: var(--a-orange-500);
228
+ --a-surface-warning-moderate: var(--a-orange-200);
229
+ --a-surface-warning-subtle: var(--a-orange-100);
230
+ --a-surface-danger: var(--a-red-500);
231
+ --a-surface-danger-moderate: var(--a-red-200);
232
+ --a-surface-danger-subtle: var(--a-red-100);
233
+ --a-surface-success: var(--a-green-500);
234
+ --a-surface-success-moderate: var(--a-green-200);
235
+ --a-surface-success-subtle: var(--a-green-100);
236
+ --a-surface-neutral: var(--a-gray-700);
237
+ --a-surface-neutral-selected: var(--a-gray-900);
238
+ --a-surface-neutral-moderate: var(--a-grayalpha-200);
239
+ --a-surface-neutral-subtle: var(--a-grayalpha-100);
240
+ --a-surface-action: var(--a-blue-500);
241
+ --a-surface-action-selected: var(--a-blue-700);
242
+ --a-surface-action-subtle: var(--a-blue-50);
243
+ --a-surface-inverted: var(--a-gray-900);
244
+ --a-surface-backdrop: var(--a-grayalpha-500);
245
+ --a-surface-transparent: var(--a-transparent);
246
+ --a-surface-subtle: var(--a-gray-50);
247
+ --a-surface-selected: var(--a-blue-50);
248
+ --a-surface-default: var(--a-white);
249
+ --a-surface-info-subtle-hover: var(--a-lightblue-200);
250
+ --a-surface-warning-subtle-hover: var(--a-orange-200);
251
+ --a-surface-danger-active: var(--a-red-700);
252
+ --a-surface-danger-hover: var(--a-red-600);
253
+ --a-surface-danger-subtle-hover: var(--a-red-200);
254
+ --a-surface-success-hover: var(--a-green-600);
255
+ --a-surface-success-subtle-hover: var(--a-green-200);
256
+ --a-surface-neutral-hover: var(--a-gray-800);
257
+ --a-surface-neutral-active: var(--a-gray-900);
258
+ --a-surface-neutral-subtle-hover: var(--a-grayalpha-200);
259
+ --a-surface-action-selected-hover: var(--a-blue-800);
260
+ --a-surface-action-active: var(--a-blue-700);
261
+ --a-surface-action-hover: var(--a-blue-600);
262
+ --a-surface-action-subtle-hover: var(--a-blue-100);
263
+ --a-surface-inverted-active: var(--a-gray-700);
264
+ --a-surface-inverted-hover: var(--a-gray-800);
265
+ --a-surface-active: var(--a-grayalpha-200);
266
+ --a-surface-hover: var(--a-grayalpha-100);
267
+ --a-icon-on-info: var(--a-gray-900);
268
+ --a-icon-on-warning: var(--a-gray-900);
269
+ --a-icon-on-danger: var(--a-white);
270
+ --a-icon-on-success: var(--a-white);
271
+ --a-icon-on-action: var(--a-white);
272
+ --a-icon-on-inverted: var(--a-white);
273
+ --a-icon-on-neutral: var(--a-white);
274
+ --a-icon-alt-3: var(--a-deepblue-500);
275
+ --a-icon-alt-2: var(--a-limegreen-700);
276
+ --a-icon-alt-1: var(--a-purple-500);
277
+ --a-icon-info: var(--a-lightblue-800);
278
+ --a-icon-warning: var(--a-orange-600);
279
+ --a-icon-danger: var(--a-red-500);
280
+ --a-icon-success: var(--a-green-500);
281
+ --a-icon-action: var(--a-blue-500);
282
+ --a-icon-action-on-action-subtle: var(--a-blue-600);
283
+ --a-icon-action-hover: var(--a-blue-600);
284
+ --a-icon-action-selected: var(--a-blue-700);
285
+ --a-icon-subtle: var(--a-grayalpha-700);
286
+ --a-icon-default: var(--a-gray-900);
287
+ --a-border-alt-3: var(--a-deepblue-500);
288
+ --a-border-alt-2: var(--a-limegreen-700);
289
+ --a-border-alt-1: var(--a-purple-400);
290
+ --a-border-on-inverted-subtle: var(--a-gray-700);
291
+ --a-border-on-inverted: var(--a-gray-200);
292
+ --a-border-focus: var(--a-blue-800);
293
+ --a-border-focus-on-inverted: var(--a-blue-200);
294
+ --a-border-info: var(--a-lightblue-700);
295
+ --a-border-warning: var(--a-orange-600);
296
+ --a-border-danger: var(--a-red-500);
297
+ --a-border-success: var(--a-green-500);
298
+ --a-border-selected: var(--a-blue-500);
299
+ --a-border-action: var(--a-blue-500);
300
+ --a-border-action-hover: var(--a-blue-600);
301
+ --a-border-action-selected: var(--a-blue-700);
302
+ --a-border-subtle: var(--a-grayalpha-300);
303
+ --a-border-divider: var(--a-grayalpha-300);
304
+ --a-border-strong: var(--a-grayalpha-700);
305
+ --a-border-default: var(--a-grayalpha-500);
306
+ --a-border-subtle-hover: var(--a-grayalpha-400);
307
+ --a-bg-subtle: var(--a-gray-100);
308
+ --a-bg-default: var(--a-white);
309
+ --a-shadow-focus-inverted: 0 0 0 3px var(--a-border-focus-on-inverted);
310
+ --a-shadow-focus: 0 0 0 3px var(--a-border-focus);
311
+ }
312
+
313
+ /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
314
+
315
+ /* Document
316
+ ========================================================================== */
317
+
318
+ /**
319
+ * 1. Correct the line height in all browsers.
320
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
321
+ */
322
+
323
+ html {
324
+ line-height: 1.15; /* 1 */
325
+ -webkit-text-size-adjust: 100%; /* 2 */
326
+ }
327
+
328
+ /* Sections
329
+ ========================================================================== */
330
+
331
+ /**
332
+ * Remove the margin in all browsers.
333
+ */
334
+
335
+ body {
336
+ margin: 0;
337
+ }
338
+
339
+ /**
340
+ * Render the `main` element consistently in IE.
341
+ */
342
+
343
+ main {
344
+ display: block;
345
+ }
346
+
347
+ /**
348
+ * Correct the font size and margin on `h1` elements within `section` and
349
+ * `article` contexts in Chrome, Firefox, and Safari.
350
+ */
351
+
352
+ h1 {
353
+ font-size: 2em;
354
+ margin: 0.67em 0;
355
+ }
356
+
357
+ /* Grouping content
358
+ ========================================================================== */
359
+
360
+ /**
361
+ * 1. Add the correct box sizing in Firefox.
362
+ * 2. Show the overflow in Edge and IE.
363
+ */
364
+
365
+ hr {
366
+ box-sizing: content-box; /* 1 */
367
+ height: 0; /* 1 */
368
+ overflow: visible; /* 2 */
369
+ }
370
+
371
+ /**
372
+ * 1. Correct the inheritance and scaling of font size in all browsers.
373
+ * 2. Correct the odd `em` font sizing in all browsers.
374
+ */
375
+
376
+ pre {
377
+ font-family: monospace; /* 1 */
378
+ font-size: 1em; /* 2 */
379
+ }
380
+
381
+ /* Text-level semantics
382
+ ========================================================================== */
383
+
384
+ /**
385
+ * Remove the gray background on active links in IE 10.
386
+ */
387
+
388
+ a {
389
+ background-color: transparent;
390
+ color: var(--a-text-action);
391
+ }
392
+
393
+ /**
394
+ * 1. Remove the bottom border in Chrome 57-
395
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
396
+ */
397
+
398
+ abbr[title] {
399
+ border-bottom: none; /* 1 */
400
+ text-decoration: underline; /* 2 */
401
+ text-decoration: underline dotted; /* 2 */
402
+ }
403
+
404
+ /**
405
+ * Add the correct font weight in Chrome, Edge, and Safari.
406
+ */
407
+
408
+ b,
409
+ strong {
410
+ font-weight: bolder;
411
+ }
412
+
413
+ /**
414
+ * 1. Correct the inheritance and scaling of font size in all browsers.
415
+ * 2. Correct the odd `em` font sizing in all browsers.
416
+ */
417
+
418
+ code,
419
+ kbd,
420
+ samp {
421
+ font-family: monospace; /* 1 */
422
+ font-size: 1em; /* 2 */
423
+ }
424
+
425
+ /**
426
+ * Add the correct font size in all browsers.
427
+ */
428
+
429
+ small {
430
+ font-size: 80%;
431
+ }
432
+
433
+ /**
434
+ * Prevent `sub` and `sup` elements from affecting the line height in
435
+ * all browsers.
436
+ */
437
+
438
+ sub,
439
+ sup {
440
+ font-size: 75%;
441
+ line-height: 0;
442
+ position: relative;
443
+ vertical-align: baseline;
444
+ }
445
+
446
+ sub {
447
+ bottom: -0.25em;
448
+ }
449
+
450
+ sup {
451
+ top: -0.5em;
452
+ }
453
+
454
+ /* Embedded content
455
+ ========================================================================== */
456
+
457
+ /**
458
+ * Remove the border on images inside links in IE 10.
459
+ */
460
+
461
+ img {
462
+ border-style: none;
463
+ }
464
+
465
+ /* Forms
466
+ ========================================================================== */
467
+
468
+ /**
469
+ * Remove the inner border and padding in Firefox.
470
+ */
471
+
472
+ button::-moz-focus-inner,
473
+ [type="button"]::-moz-focus-inner,
474
+ [type="reset"]::-moz-focus-inner,
475
+ [type="submit"]::-moz-focus-inner {
476
+ border-style: none;
477
+ padding: 0;
478
+ }
479
+
480
+ /**
481
+ * Restore the focus styles unset by the previous rule.
482
+ */
483
+
484
+ button:-moz-focusring,
485
+ [type="button"]:-moz-focusring,
486
+ [type="reset"]:-moz-focusring,
487
+ [type="submit"]:-moz-focusring {
488
+ outline: 1px dotted ButtonText;
489
+ }
490
+
491
+ /**
492
+ * Correct the padding in Firefox.
493
+ */
494
+
495
+ fieldset {
496
+ padding: 0.35em 0.75em 0.625em;
497
+ }
498
+
499
+ /**
500
+ * 1. Correct the text wrapping in Edge and IE.
501
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
502
+ * 3. Remove the padding so developers are not caught out when they zero out
503
+ * `fieldset` elements in all browsers.
504
+ */
505
+
506
+ legend {
507
+ box-sizing: border-box; /* 1 */
508
+ color: inherit; /* 2 */
509
+ display: table; /* 1 */
510
+ max-width: 100%; /* 1 */
511
+ padding: 0; /* 3 */
512
+ white-space: normal; /* 1 */
513
+ box-sizing: border-box;
514
+ color: inherit;
515
+ display: table;
516
+ max-width: 100%;
517
+ padding: 0;
518
+ white-space: normal;
519
+ }
520
+
521
+ /**
522
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
523
+ */
524
+
525
+ progress {
526
+ vertical-align: baseline;
527
+ }
528
+
529
+ /**
530
+ * Remove the default vertical scrollbar in IE 10+.
531
+ */
532
+
533
+ textarea {
534
+ overflow: auto;
535
+ }
536
+
537
+ /**
538
+ * 1. Add the correct box sizing in IE 10.
539
+ * 2. Remove the padding in IE 10.
540
+ */
541
+
542
+ [type="checkbox"],
543
+ [type="radio"] {
544
+ box-sizing: border-box; /* 1 */
545
+ padding: 0; /* 2 */
546
+ }
547
+
548
+ /**
549
+ * Correct the cursor style of increment and decrement buttons in Chrome.
550
+ */
551
+
552
+ [type="number"]::-webkit-inner-spin-button,
553
+ [type="number"]::-webkit-outer-spin-button {
554
+ height: auto;
555
+ }
556
+
557
+ /**
558
+ * 1. Correct the odd appearance in Chrome and Safari.
559
+ * 2. Correct the outline style in Safari.
560
+ */
561
+
562
+ [type="search"] {
563
+ -webkit-appearance: textfield; /* 1 */
564
+ outline-offset: -2px; /* 2 */
565
+ }
566
+
567
+ /**
568
+ * Remove the inner padding in Chrome and Safari on macOS.
569
+ */
570
+
571
+ [type="search"]::-webkit-search-decoration {
572
+ -webkit-appearance: none;
573
+ }
574
+
575
+ /**
576
+ * 1. Correct the inability to style clickable types in iOS and Safari.
577
+ * 2. Change font properties to `inherit` in Safari.
578
+ */
579
+
580
+ ::-webkit-file-upload-button {
581
+ -webkit-appearance: button; /* 1 */
582
+ font: inherit; /* 2 */
583
+ }
584
+
585
+ /* Interactive
586
+ ========================================================================== */
587
+
588
+ /*
589
+ * Add the correct display in Edge, IE 10+, and Firefox.
590
+ */
591
+
592
+ details {
593
+ display: block;
594
+ }
595
+
596
+ /*
597
+ * Add the correct display in all browsers.
598
+ */
599
+
600
+ summary {
601
+ display: list-item;
602
+ }
603
+
604
+ /* Misc
605
+ ========================================================================== */
606
+
607
+ /**
608
+ * Add the correct display in IE 10+.
609
+ */
610
+
611
+ template {
612
+ display: none;
613
+ }
614
+
615
+ /* cyrillic-ext */
616
+
617
+ @font-face {
618
+ font-family: "Source Sans 3";
619
+ font-style: italic;
620
+ font-weight: 400 600;
621
+ font-display: swap;
622
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-italic-cyrillic_ext.woff2) format("woff2");
623
+ unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
624
+ }
625
+
626
+ /* cyrillic */
627
+
628
+ @font-face {
629
+ font-family: "Source Sans 3";
630
+ font-style: italic;
631
+ font-weight: 400 600;
632
+ font-display: swap;
633
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-italic-cyrillic.woff2) format("woff2");
634
+ unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
635
+ }
636
+
637
+ /* latin-ext */
638
+
639
+ @font-face {
640
+ font-family: "Source Sans 3";
641
+ font-style: italic;
642
+ font-weight: 400 600;
643
+ font-display: swap;
644
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-italic-latin_ext.woff2) format("woff2");
645
+ unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
646
+ U+2C60-2C7F, U+A720-A7FF;
647
+ }
648
+
649
+ /* latin */
650
+
651
+ @font-face {
652
+ font-family: "Source Sans 3";
653
+ font-style: italic;
654
+ font-weight: 400 600;
655
+ font-display: swap;
656
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-italic.woff2) format("woff2");
657
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
658
+ U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
659
+ }
660
+
661
+ /* cyrillic-ext */
662
+
663
+ @font-face {
664
+ font-family: "Source Sans 3";
665
+ font-style: normal;
666
+ font-weight: 400 600;
667
+ font-display: swap;
668
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-normal-cyrillic_ext.woff2) format("woff2");
669
+ unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
670
+ }
671
+
672
+ /* cyrillic */
673
+
674
+ @font-face {
675
+ font-family: "Source Sans 3";
676
+ font-style: normal;
677
+ font-weight: 400 600;
678
+ font-display: swap;
679
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-normal-cyrillic.woff2) format("woff2");
680
+ unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
681
+ }
682
+
683
+ /* latin-ext */
684
+
685
+ @font-face {
686
+ font-family: "Source Sans 3";
687
+ font-style: normal;
688
+ font-weight: 400 600;
689
+ font-display: swap;
690
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-normal-latin_ext.woff2) format("woff2");
691
+ unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
692
+ U+2C60-2C7F, U+A720-A7FF;
693
+ }
694
+
695
+ /* latin */
696
+
697
+ @font-face {
698
+ font-family: "Source Sans 3";
699
+ font-style: normal;
700
+ font-weight: 400 600;
701
+ font-display: swap;
702
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-normal.woff2) format("woff2");
703
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
704
+ U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
705
+ }
706
+
707
+ /* Legacy support */
708
+
709
+ /* latin-ext */
710
+
711
+ @font-face {
712
+ font-family: "Source Sans Pro";
713
+ font-style: italic;
714
+ font-weight: 400 600;
715
+ font-display: swap;
716
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-italic-latin_ext.woff2) format("woff2");
717
+ unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
718
+ U+2C60-2C7F, U+A720-A7FF;
719
+ }
720
+
721
+ /* latin */
722
+
723
+ @font-face {
724
+ font-family: "Source Sans Pro";
725
+ font-style: italic;
726
+ font-weight: 400 600;
727
+ font-display: swap;
728
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-italic.woff2) format("woff2");
729
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
730
+ U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
731
+ }
732
+
733
+ /* latin-ext */
734
+
735
+ @font-face {
736
+ font-family: "Source Sans Pro";
737
+ font-style: normal;
738
+ font-weight: 400 600;
739
+ font-display: swap;
740
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-normal-latin_ext.woff2) format("woff2");
741
+ unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
742
+ U+2C60-2C7F, U+A720-A7FF;
743
+ }
744
+
745
+ /* latin */
746
+
747
+ @font-face {
748
+ font-family: "Source Sans Pro";
749
+ font-style: normal;
750
+ font-weight: 400 600;
751
+ font-display: swap;
752
+ src: url(https://cdn.nav.no/aksel/fonts/SourceSans3-normal.woff2) format("woff2");
753
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
754
+ U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
755
+ }
756
+
757
+ /* ==========================================================================
758
+ Print styles copied from https://github.com/h5bp/html5-boilerplate/blob/master/dist/css/style.css
759
+ Inlined to avoid the additional HTTP request:
760
+ https://www.phpied.com/delay-loading-your-print-css/
761
+ ========================================================================== */
762
+
763
+ @media print {
764
+ *,
765
+ *::before,
766
+ *::after {
767
+ background: #fff !important;
768
+ color: #000 !important;
769
+
770
+ /* Black prints faster */
771
+ box-shadow: none !important;
772
+ text-shadow: none !important;
773
+ }
774
+
775
+ a,
776
+ a:visited {
777
+ text-decoration: underline;
778
+ }
779
+
780
+ a[href]::after {
781
+ content: " (" attr(href) ")";
782
+ }
783
+
784
+ abbr[title]::after {
785
+ content: " (" attr(title) ")";
786
+ }
787
+
788
+ /*
789
+ * Don't show links that are fragment identifiers,
790
+ * or use the `javascript:` pseudo protocol
791
+ */
792
+ a[href^="#"]::after,
793
+ a[href^="javascript:"]::after {
794
+ content: "";
795
+ }
796
+
797
+ pre {
798
+ white-space: pre-wrap !important;
799
+ }
800
+
801
+ pre,
802
+ blockquote {
803
+ border: 1px solid #999;
804
+ page-break-inside: avoid;
805
+ }
806
+
807
+ /*
808
+ * Printing Tables:
809
+ * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
810
+ */
811
+ thead {
812
+ display: table-header-group;
813
+ }
814
+
815
+ tr,
816
+ img {
817
+ page-break-inside: avoid;
818
+ }
819
+
820
+ p,
821
+ h2,
822
+ h3 {
823
+ orphans: 3;
824
+ widows: 3;
825
+ }
826
+
827
+ h2,
828
+ h3 {
829
+ page-break-after: avoid;
830
+ }
831
+ }
832
+
833
+ html,
834
+ :host {
835
+ box-sizing: border-box;
836
+ }
837
+
838
+ *,
839
+ *::before,
840
+ *::after {
841
+ box-sizing: inherit;
842
+ }
843
+
844
+ button,
845
+ input,
846
+ optgroup,
847
+ select,
848
+ textarea {
849
+ font-family: inherit;
850
+ font-size: 100%;
851
+ line-height: 1.15;
852
+ margin: 0;
853
+ color: inherit;
854
+ }
855
+
856
+ button,
857
+ input {
858
+ overflow: visible;
859
+ }
860
+
861
+ button,
862
+ select {
863
+ text-transform: none;
864
+ }
865
+
866
+ button,
867
+ [type="button"],
868
+ [type="reset"],
869
+ [type="submit"] {
870
+ -webkit-appearance: button;
871
+ }
872
+
873
+ /* Make elements with the HTML hidden attribute stay hidden by default. */
874
+
875
+ [hidden] {
876
+ display: none !important;
877
+ }
878
+
879
+ /* https://web.dev/prefers-reduced-motion/ */
880
+
881
+ @media (prefers-reduced-motion: reduce) {
882
+ *:not(.navds-loader *, .navds-loader, .navds-progress-bar *, .navds-progress-bar),
883
+ ::before,
884
+ ::after {
885
+ animation-delay: -1ms !important;
886
+ animation-duration: 1ms !important;
887
+ animation-iteration-count: 1 !important;
888
+ background-attachment: initial !important;
889
+ scroll-behavior: auto !important;
890
+ transition-duration: 0s !important;
891
+ transition-delay: 0s !important;
892
+ }
893
+ }
894
+
895
+ /*
896
+ * From https://github.com/h5bp/html5-boilerplate/blob/master/dist/css/style.css
897
+ *
898
+ * Hide only visually, but have it available for screen readers:
899
+ * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
900
+ *
901
+ * 1. For long content, line feeds are not interpreted as spaces and small width
902
+ * causes content to wrap 1 word per line:
903
+ * https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
904
+ */
905
+
906
+ .sr-only,
907
+ .navds-sr-only {
908
+ border: 0;
909
+ clip: rect(0, 0, 0, 0);
910
+ clip-path: inset(50%);
911
+ height: 1px;
912
+ margin: -1px;
913
+ overflow: hidden;
914
+ padding: 0;
915
+ position: absolute;
916
+ white-space: nowrap;
917
+ width: 1px;
918
+ }
919
+
920
+ /*
921
+ * From https://github.com/h5bp/html5-boilerplate/blob/master/dist/css/style.css
922
+ *
923
+ * Extends the .sr-only class to allow the element
924
+ * to be focusable when navigated to via the keyboard:
925
+ * https://www.drupal.org/node/897638
926
+ */
927
+
928
+ .sr-only.focusable:active,
929
+ .sr-only.focusable:focus,
930
+ .navds-sr-only.focusable:active,
931
+ .navds-sr-only.focusable:focus {
932
+ clip: auto;
933
+ clip-path: none;
934
+ height: auto;
935
+ margin: 0;
936
+ overflow: visible;
937
+ position: static;
938
+ white-space: inherit;
939
+ width: auto;
940
+ }
941
+
942
+ :root,
943
+ :host,
944
+ [data-theme="light"] {
945
+ --a-shadow-focus: 0 0 0 3px var(--a-border-focus);
946
+
947
+ color: var(--a-text-default);
948
+ }
949
+
1
950
  [data-theme="dark"] {
951
+ --a-shadow-focus: var(--a-shadow-focus-inverted);
952
+
953
+ color: var(--a-text-on-inverted);
2
954
  --__ac-typo-error-text: var(--a-red-300);
3
955
  --__ac-typo-text-subtle: var(--a-gray-300);
4
956
  --__ac-button-primary-text: var(--a-gray-900);
@@ -43,6 +995,13 @@
43
995
  --__ac-search-error-border: var(--a-red-300);
44
996
  }
45
997
 
998
+ body,
999
+ :host {
1000
+ font-family: var(--a-font-family, "Source Sans 3", "Source Sans Pro", Arial, sans-serif);
1001
+ line-height: 1.333;
1002
+ font-size: 1.125rem;
1003
+ }
1004
+
46
1005
  [data-theme="light"] {
47
1006
  --__ac-typo-error-text: initial;
48
1007
  --__ac-typo-text-subtle: initial;
@@ -1752,7 +2711,7 @@
1752
2711
  border-bottom: 1px solid var(--a-border-divider);
1753
2712
  }
1754
2713
 
1755
- .navds-dropdown__menu > :not(.navds-dropdown__divider):not(.navds-dropdown__list) {
2714
+ .navds-dropdown__menu > :not(.navds-dropdown__divider, .navds-dropdown__list) {
1756
2715
  margin: 0 var(--a-spacing-4) var(--a-spacing-3);
1757
2716
  }
1758
2717
 
@@ -2405,7 +3364,7 @@
2405
3364
  min-width: 0;
2406
3365
  }
2407
3366
 
2408
- .navds-fieldset > :not(:first-child):not(:empty) {
3367
+ .navds-fieldset > :not(:first-child, :empty) {
2409
3368
  margin-top: var(--a-spacing-2);
2410
3369
  }
2411
3370
 
@@ -2419,7 +3378,7 @@
2419
3378
 
2420
3379
  /* Applied when hideLegend is applied to fieldset */
2421
3380
 
2422
- .navds-fieldset > .navds-sr-only + :not(:first-child):not(:empty) {
3381
+ .navds-fieldset > .navds-sr-only + :not(:first-child, :empty) {
2423
3382
  margin-top: 0;
2424
3383
  }
2425
3384
 
@@ -3012,44 +3971,42 @@
3012
3971
  color: var(--ac-radio-checkbox-action, var(--a-surface-action-hover));
3013
3972
  }
3014
3973
 
3015
- .navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus) + .navds-checkbox__label::before,
3016
- .navds-radio__input:hover:not(:disabled):not(:checked):not(:focus) + .navds-radio__label::before {
3974
+ .navds-checkbox__input:hover:not(:disabled, :checked, :indeterminate, :focus) + .navds-checkbox__label::before,
3975
+ .navds-radio__input:hover:not(:disabled, :checked, :focus) + .navds-radio__label::before {
3017
3976
  box-shadow: 0 0 0 2px var(--ac-radio-checkbox-action, var(--a-surface-action-hover));
3018
3977
  }
3019
3978
 
3020
- .navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate) + .navds-checkbox__label::before,
3021
- .navds-radio__input:hover:not(:disabled):not(:checked) + .navds-radio__label::before {
3979
+ .navds-checkbox__input:hover:not(:disabled, :checked, :indeterminate) + .navds-checkbox__label::before,
3980
+ .navds-radio__input:hover:not(:disabled, :checked) + .navds-radio__label::before {
3022
3981
  background-color: var(--ac-radio-checkbox-action-hover-bg, var(--a-surface-action-subtle));
3023
3982
  }
3024
3983
 
3025
- .navds-checkbox--error
3026
- > .navds-checkbox__input:not(:hover):not(:disabled):not(:checked):not(:indeterminate)
3027
- + .navds-checkbox__label::before,
3028
- .navds-radio--error > .navds-radio__input:not(:hover):not(:disabled):not(:checked) + .navds-radio__label::before {
3984
+ .navds-checkbox--error > .navds-checkbox__input:not(:hover, :disabled, :checked, :indeterminate) + .navds-checkbox__label::before,
3985
+ .navds-radio--error > .navds-radio__input:not(:hover, :disabled, :checked) + .navds-radio__label::before {
3029
3986
  box-shadow: 0 0 0 2px var(--ac-radio-checkbox-error-border, var(--a-border-danger));
3030
3987
  }
3031
3988
 
3032
3989
  .navds-checkbox--error
3033
- > .navds-checkbox__input:focus:not(:hover):not(:disabled):not(:checked):not(:indeterminate)
3990
+ > .navds-checkbox__input:focus:not(:hover, :disabled, :checked, :indeterminate)
3034
3991
  + .navds-checkbox__label::before,
3035
- .navds-radio--error > .navds-radio__input:focus:not(:hover):not(:disabled):not(:checked) + .navds-radio__label::before {
3992
+ .navds-radio--error > .navds-radio__input:focus:not(:hover, :disabled, :checked) + .navds-radio__label::before {
3036
3993
  box-shadow:
3037
3994
  0 0 0 2px var(--ac-radio-checkbox-error-border, var(--a-border-danger)),
3038
3995
  0 0 0 4px var(--a-border-focus);
3039
3996
  }
3040
3997
 
3041
3998
  .navds-checkbox--error
3042
- > .navds-checkbox__input:hover:not(:disabled):not(:checked):not(:indeterminate):not(:focus)
3999
+ > .navds-checkbox__input:hover:not(:disabled, :checked, :indeterminate, :focus)
3043
4000
  + .navds-checkbox__label::before,
3044
- .navds-radio--error > .navds-radio__input:hover:not(:disabled):not(:checked):not(:focus) + .navds-radio__label::before {
4001
+ .navds-radio--error > .navds-radio__input:hover:not(:disabled, :checked, :focus) + .navds-radio__label::before {
3045
4002
  background-color: var(--ac-radio-checkbox-error-hover-bg, var(--a-surface-danger-subtle));
3046
4003
  box-shadow: 0 0 0 2px var(--ac-radio-checkbox-error-border, var(--a-border-danger));
3047
4004
  }
3048
4005
 
3049
4006
  .navds-checkbox--error
3050
- > .navds-checkbox__input:focus:hover:not(:disabled):not(:checked):not(:indeterminate)
4007
+ > .navds-checkbox__input:focus:hover:not(:disabled, :checked, :indeterminate)
3051
4008
  + .navds-checkbox__label::before,
3052
- .navds-radio--error > .navds-radio__input:focus:hover:not(:disabled):not(:checked) + .navds-radio__label::before {
4009
+ .navds-radio--error > .navds-radio__input:focus:hover:not(:disabled, :checked) + .navds-radio__label::before {
3053
4010
  background-color: var(--ac-radio-checkbox-error-hover-bg, var(--a-surface-danger-subtle));
3054
4011
  box-shadow:
3055
4012
  0 0 0 2px var(--ac-radio-checkbox-error-border, var(--a-border-danger)),
@@ -3084,14 +4041,10 @@
3084
4041
  color: var(--a-text-default);
3085
4042
  }
3086
4043
 
3087
- .navds-checkbox--readonly
3088
- > .navds-checkbox__input:not(:disabled):not(:checked):not(:indeterminate)
3089
- + .navds-checkbox__label::before,
3090
- .navds-checkbox--readonly
3091
- > .navds-checkbox__input:hover:not(:checked):not(:indeterminate):not(:focus)
3092
- + .navds-checkbox__label::before,
3093
- .navds-radio--readonly > .navds-radio__input:not(:disabled):not(:checked) + .navds-radio__label::before,
3094
- .navds-radio--readonly > .navds-radio__input:hover:not(:checked):not(:focus) + .navds-radio__label::before {
4044
+ .navds-checkbox--readonly > .navds-checkbox__input:not(:disabled, :checked, :indeterminate) + .navds-checkbox__label::before,
4045
+ .navds-checkbox--readonly > .navds-checkbox__input:hover:not(:checked, :indeterminate, :focus) + .navds-checkbox__label::before,
4046
+ .navds-radio--readonly > .navds-radio__input:not(:disabled, :checked) + .navds-radio__label::before,
4047
+ .navds-radio--readonly > .navds-radio__input:hover:not(:checked, :focus) + .navds-radio__label::before {
3095
4048
  background-color: var(--__ac-radio-checkbox-readonly-bg);
3096
4049
  box-shadow: 0 0 0 2px var(--__ac-radio-checkbox-readonly-border);
3097
4050
  }
@@ -3287,7 +4240,7 @@
3287
4240
  Error handling
3288
4241
  */
3289
4242
 
3290
- .navds-select--error > * select:not(:hover):not(:focus):not(:disabled) {
4243
+ .navds-select--error > * select:not(:hover, :focus, :disabled) {
3291
4244
  box-shadow: 0 0 0 1px var(--ac-select-error-border, var(--a-surface-danger));
3292
4245
  border-color: var(--ac-select-error-border, var(--a-surface-danger));
3293
4246
  }
@@ -3645,19 +4598,19 @@
3645
4598
  Error handling
3646
4599
  */
3647
4600
 
3648
- .navds-text-field--error > .navds-text-field__input:not(:hover):not(:disabled) {
4601
+ .navds-text-field--error > .navds-text-field__input:not(:hover, :disabled) {
3649
4602
  border-color: var(--ac-textfield-error-border, var(--__ac-textfield-error-border, var(--a-border-danger)));
3650
4603
  box-shadow: 0 0 0 1px var(--ac-textfield-error-border, var(--__ac-textfield-error-border, var(--a-border-danger)));
3651
4604
  }
3652
4605
 
3653
- .navds-text-field--error > .navds-text-field__input:focus-visible:not(:hover):not(:disabled) {
4606
+ .navds-text-field--error > .navds-text-field__input:focus-visible:not(:hover, :disabled) {
3654
4607
  box-shadow:
3655
4608
  0 0 0 1px var(--a-border-danger),
3656
4609
  var(--a-shadow-focus);
3657
4610
  }
3658
4611
 
3659
4612
  @supports not selector(:focus-visible) {
3660
- .navds-text-field--error > .navds-text-field__input:focus:not(:hover):not(:disabled) {
4613
+ .navds-text-field--error > .navds-text-field__input:focus:not(:hover, :disabled) {
3661
4614
  box-shadow:
3662
4615
  0 0 0 1px var(--a-border-danger),
3663
4616
  var(--a-shadow-focus);
@@ -3789,13 +4742,13 @@
3789
4742
  Error handling
3790
4743
  */
3791
4744
 
3792
- .navds-textarea--error .navds-textarea__input:not(:hover):not(:focus-visible):not(:disabled) {
4745
+ .navds-textarea--error .navds-textarea__input:not(:hover, :focus-visible, :disabled) {
3793
4746
  box-shadow: 0 0 0 1px var(--ac-textarea-error-border, var(--__ac-textarea-error-border, var(--a-border-danger)));
3794
4747
  border-color: var(--ac-textarea-error-border, var(--__ac-textarea-error-border, var(--a-border-danger)));
3795
4748
  }
3796
4749
 
3797
4750
  @supports not selector(:focus-visible) {
3798
- .navds-textarea--error .navds-textarea__input:not(:hover):not(:focus):not(:disabled) {
4751
+ .navds-textarea--error .navds-textarea__input:not(:hover, :focus, :disabled) {
3799
4752
  box-shadow: 0 0 0 1px var(--ac-textarea-error-border, var(--__ac-textarea-error-border, var(--a-border-danger)));
3800
4753
  border-color: var(--ac-textarea-error-border, var(--__ac-textarea-error-border, var(--a-border-danger)));
3801
4754
  }
@@ -3994,12 +4947,12 @@
3994
4947
 
3995
4948
  /* Error-handling */
3996
4949
 
3997
- .navds-search--error .navds-search__input:not(:hover):not(:disabled) {
4950
+ .navds-search--error .navds-search__input:not(:hover, :disabled) {
3998
4951
  border-color: var(--ac-search-error-border, var(--__ac-search-error-border, var(--a-border-danger)));
3999
4952
  box-shadow: inset 0 0 0 1px var(--ac-search-error-border, var(--__ac-search-error-border, var(--a-border-danger)));
4000
4953
  }
4001
4954
 
4002
- .navds-search--error .navds-search__input:focus-visible:not(:hover):not(:disabled) {
4955
+ .navds-search--error .navds-search__input:focus-visible:not(:hover, :disabled) {
4003
4956
  box-shadow:
4004
4957
  inset 0 0 0 1px var(--ac-search-error-border, var(--__ac-search-error-border, var(--a-border-danger))),
4005
4958
  var(--a-shadow-focus);
@@ -4014,7 +4967,7 @@
4014
4967
  }
4015
4968
 
4016
4969
  @supports not selector(:focus-visible) {
4017
- .navds-search--error .navds-search__input:focus:not(:hover):not(:disabled) {
4970
+ .navds-search--error .navds-search__input:focus:not(:hover, :disabled) {
4018
4971
  box-shadow:
4019
4972
  inset 0 0 0 1px var(--ac-search-error-border, var(--__ac-search-error-border, var(--a-border-danger))),
4020
4973
  var(--a-shadow-focus);
@@ -4120,13 +5073,13 @@
4120
5073
  cursor: text;
4121
5074
  }
4122
5075
 
4123
- .navds-combobox--error .navds-text-field__input:not(:hover):not(:disabled) {
5076
+ .navds-combobox--error .navds-text-field__input:not(:hover, :disabled) {
4124
5077
  border-color: var(--ac-combobox-error-border, var(--a-border-danger));
4125
5078
  box-shadow: 0 0 0 1px var(--ac-combobox-error-border, var(--a-border-danger));
4126
5079
  }
4127
5080
 
4128
5081
  .navds-combobox--error
4129
- .navds-text-field__input:not(:hover):not(:disabled):not(.navds-combobox__wrapper-inner--virtually-unfocused):focus-within {
5082
+ .navds-text-field__input:not(:hover, :disabled, .navds-combobox__wrapper-inner--virtually-unfocused):focus-within {
4130
5083
  outline: 2px solid transparent;
4131
5084
  outline-offset: 2px;
4132
5085
  box-shadow:
@@ -4411,6 +5364,11 @@
4411
5364
  border-radius: calc(var(--a-border-radius-medium) - 1px);
4412
5365
  }
4413
5366
 
5367
+ .navds-combobox__list-item mark {
5368
+ background-color: transparent;
5369
+ font-weight: bold;
5370
+ }
5371
+
4414
5372
  /* Mobile */
4415
5373
 
4416
5374
  @media (max-width: 479px) {
@@ -5047,8 +6005,9 @@ button.navds-internalheader__title:active,
5047
6005
  /* From polyfill */
5048
6006
  position: fixed;
5049
6007
  top: 0;
5050
- right: 0;
5051
6008
  bottom: 0;
6009
+ right: 0;
6010
+ /* stylelint-disable-next-line declaration-block-no-redundant-longhand-properties */
5052
6011
  left: 0;
5053
6012
  }
5054
6013
 
@@ -5097,8 +6056,9 @@ button.navds-internalheader__title:active,
5097
6056
  /* From polyfill: */
5098
6057
  position: fixed;
5099
6058
  top: 0;
5100
- right: 0;
5101
6059
  bottom: 0;
6060
+ right: 0;
6061
+ /* stylelint-disable-next-line declaration-block-no-redundant-longhand-properties */
5102
6062
  left: 0;
5103
6063
  }
5104
6064
 
@@ -5178,7 +6138,7 @@ button.navds-internalheader__title:active,
5178
6138
  }
5179
6139
 
5180
6140
  @keyframes akselModalFadeIn {
5181
- from {
6141
+ 0% {
5182
6142
  opacity: 0.0001; /* Safari will not set focus inside the modal when it opens if we set this to 0 */
5183
6143
  transform: translate3d(0, calc(5% + 4px), 0);
5184
6144
  }
@@ -5187,7 +6147,7 @@ button.navds-internalheader__title:active,
5187
6147
  opacity: 1;
5188
6148
  }
5189
6149
 
5190
- to {
6150
+ 100% {
5191
6151
  transform: none;
5192
6152
  }
5193
6153
  }
@@ -5442,14 +6402,14 @@ button.navds-internalheader__title:active,
5442
6402
  border-radius: var(--a-border-radius-xlarge);
5443
6403
  }
5444
6404
 
5445
- .navds-date .rdp-button:not(.rdp-day_selected):not([disabled]):focus-visible,
5446
- .navds-date .navds-date__month-button:not(.rdp-day_selected):not([disabled]):focus-visible {
6405
+ .navds-date .rdp-button:not(.rdp-day_selected, [disabled]):focus-visible,
6406
+ .navds-date .navds-date__month-button:not(.rdp-day_selected, [disabled]):focus-visible {
5447
6407
  box-shadow: var(--a-shadow-focus);
5448
6408
  }
5449
6409
 
5450
6410
  @supports not selector(:focus-visible) {
5451
- .navds-date .rdp-button:not(.rdp-day_selected):not([disabled]):focus,
5452
- .navds-date .navds-date__month-button:not(.rdp-day_selected):not([disabled]):focus {
6411
+ .navds-date .rdp-button:not(.rdp-day_selected, [disabled]):focus,
6412
+ .navds-date .navds-date__month-button:not(.rdp-day_selected, [disabled]):focus {
5453
6413
  box-shadow: var(--a-shadow-focus);
5454
6414
  }
5455
6415
  }
@@ -5535,8 +6495,8 @@ button.navds-internalheader__title:active,
5535
6495
  color: var(--ac-date-disabled-text, var(--a-text-subtle));
5536
6496
  }
5537
6497
 
5538
- .navds-date .rdp-button:where(:not(.rdp-day_selected):not([disabled])):hover,
5539
- .navds-date__month-button:where(:not(.rdp-day_selected):not([disabled])):hover {
6498
+ .navds-date .rdp-button:where(:not(.rdp-day_selected, [disabled])):hover,
6499
+ .navds-date__month-button:where(:not(.rdp-day_selected, [disabled])):hover {
5540
6500
  background: var(--ac-date-hover-bg, var(--a-surface-action-subtle-hover));
5541
6501
  cursor: pointer;
5542
6502
  }
@@ -5570,19 +6530,19 @@ button.navds-internalheader__title:active,
5570
6530
 
5571
6531
  /* Error-handling */
5572
6532
 
5573
- .navds-date__field--error .navds-date__field-input:not(:hover):not(:disabled) {
6533
+ .navds-date__field--error .navds-date__field-input:not(:hover, :disabled) {
5574
6534
  border-color: var(--ac-date-input-error-border, var(--a-border-danger));
5575
6535
  box-shadow: inset 0 0 0 1px var(--ac-date-input-error-border, var(--a-border-danger));
5576
6536
  }
5577
6537
 
5578
- .navds-date__field--error .navds-date__field-input:focus-visible:not(:hover):not(:disabled) {
6538
+ .navds-date__field--error .navds-date__field-input:focus-visible:not(:hover, :disabled) {
5579
6539
  box-shadow:
5580
6540
  inset 0 0 0 1px var(--ac-date-input-error-border, var(--a-border-danger)),
5581
6541
  var(--a-shadow-focus);
5582
6542
  }
5583
6543
 
5584
6544
  @supports not selector(:focus-visible) {
5585
- .navds-date__field--error .navds-date__field-input:focus:not(:hover):not(:disabled) {
6545
+ .navds-date__field--error .navds-date__field-input:focus:not(:hover, :disabled) {
5586
6546
  box-shadow:
5587
6547
  inset 0 0 0 1px var(--ac-date-input-error-border, var(--a-border-danger)),
5588
6548
  var(--a-shadow-focus);
@@ -6614,7 +7574,7 @@ button.navds-internalheader__title:active,
6614
7574
  }
6615
7575
 
6616
7576
  .navds-toggle-group__button:active {
6617
- background-color: none !important;
7577
+ background-color: unset !important;
6618
7578
  }
6619
7579
 
6620
7580
  .navds-toggle-group__button:focus-visible {
@@ -7157,8 +8117,7 @@ button.navds-stepper__step {
7157
8117
  grid-template-columns:
7158
8118
  [content-start] auto [circle] var(--navds-stepper-circle-size)
7159
8119
  [content-end] auto;
7160
- justify-items: center;
7161
- align-items: center;
8120
+ place-items: center center;
7162
8121
  margin-bottom: 0;
7163
8122
  }
7164
8123
 
@@ -8169,8 +9128,7 @@ _:future,
8169
9128
 
8170
9129
  .navds-stack__spacer {
8171
9130
  flex: 1;
8172
- justify-self: stretch;
8173
- align-self: stretch;
9131
+ place-content: stretch stretch;
8174
9132
  }
8175
9133
 
8176
9134
  .navds-stack > .navds-stack__spacer {