@amsterdam/design-system-tokens 0.10.0 → 0.12.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 (64) hide show
  1. package/CHANGELOG.md +49 -13
  2. package/README.md +197 -1
  3. package/build.js +15 -14
  4. package/dist/compact.css +17 -13
  5. package/dist/compact.d.ts +10 -12
  6. package/dist/compact.json +12 -7
  7. package/dist/compact.mjs +13 -9
  8. package/dist/compact.scss +17 -13
  9. package/dist/compact.theme.css +17 -13
  10. package/dist/index.css +828 -770
  11. package/dist/index.d.ts +187 -85
  12. package/dist/index.json +349 -240
  13. package/dist/index.mjs +278 -220
  14. package/dist/index.scss +828 -770
  15. package/dist/index.theme.css +828 -770
  16. package/package.json +11 -5
  17. package/src/brand/ams/space.compact.tokens.json +5 -0
  18. package/src/brand/ams/space.tokens.json +10 -19
  19. package/src/brand/ams/text.compact.tokens.json +7 -7
  20. package/src/brand/ams/text.tokens.json +7 -7
  21. package/src/common/ams/link-appearance.tokens.json +18 -6
  22. package/src/components/ams/accordion.tokens.json +4 -4
  23. package/src/components/ams/action-group.tokens.json +7 -0
  24. package/src/components/ams/alert.tokens.json +6 -3
  25. package/src/components/ams/avatar.tokens.json +5 -2
  26. package/src/components/ams/badge.tokens.json +1 -1
  27. package/src/components/ams/breadcrumb.tokens.json +4 -1
  28. package/src/components/ams/breakout.tokens.json +11 -0
  29. package/src/components/ams/button.tokens.json +7 -3
  30. package/src/components/ams/card.tokens.json +4 -0
  31. package/src/components/ams/{form-field-character-counter.tokens.json → character-count.tokens.json} +1 -1
  32. package/src/components/ams/checkbox.tokens.json +1 -0
  33. package/src/components/ams/column.tokens.json +6 -5
  34. package/src/components/ams/date-input.tokens.json +2 -2
  35. package/src/components/ams/description-list.tokens.json +6 -6
  36. package/src/components/ams/dialog.tokens.json +7 -11
  37. package/src/components/ams/field-set.tokens.json +3 -7
  38. package/src/components/ams/field.tokens.json +3 -9
  39. package/src/components/ams/file-input.tokens.json +5 -5
  40. package/src/components/ams/form-error-list.tokens.json +7 -0
  41. package/src/components/ams/header.tokens.json +1 -1
  42. package/src/components/ams/hint.tokens.json +7 -0
  43. package/src/components/ams/icon-button.tokens.json +2 -2
  44. package/src/components/ams/image-slider.tokens.json +26 -0
  45. package/src/components/ams/link-list.tokens.json +8 -8
  46. package/src/components/ams/link.tokens.json +8 -8
  47. package/src/components/ams/mega-menu.tokens.json +1 -1
  48. package/src/components/ams/ordered-list.tokens.json +4 -1
  49. package/src/components/ams/page-menu.tokens.json +1 -1
  50. package/src/components/ams/pagination.tokens.json +2 -1
  51. package/src/components/ams/password-input.tokens.json +33 -0
  52. package/src/components/ams/radio.tokens.json +37 -35
  53. package/src/components/ams/row.tokens.json +6 -5
  54. package/src/components/ams/search-field.tokens.json +5 -7
  55. package/src/components/ams/select.tokens.json +3 -3
  56. package/src/components/ams/skip-link.tokens.json +2 -2
  57. package/src/components/ams/table-of-contents.tokens.json +4 -4
  58. package/src/components/ams/table.tokens.json +2 -2
  59. package/src/components/ams/tabs.tokens.json +3 -2
  60. package/src/components/ams/text-area.tokens.json +2 -2
  61. package/src/components/ams/text-input.tokens.json +2 -2
  62. package/src/components/ams/time-input.tokens.json +2 -2
  63. package/src/components/ams/top-task-link.tokens.json +1 -0
  64. package/src/components/ams/unordered-list.tokens.json +4 -1
package/dist/index.json CHANGED
@@ -34,26 +34,17 @@
34
34
  "2x-wide": "16 / 5"
35
35
  },
36
36
  "space": {
37
+ "xs": "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)",
38
+ "sm": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
39
+ "md": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
40
+ "lg": "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)",
41
+ "xl": "clamp(2.25rem, 2.0625rem + 0.9375vw, 3rem)",
37
42
  "grid": {
38
- "xs": "clamp(0.25rem, calc(0.78125vw + 0.09375rem), 0.875rem)",
39
- "sm": "clamp(0.5rem, calc(1.5625vw + 0.1875rem), 1.75rem)",
40
- "md": "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)",
41
- "lg": "clamp(1.5rem, calc(4.6875vw + 0.5625rem), 5.25rem)",
42
- "xl": "clamp(2rem, calc(6.25vw + 0.75rem), 7rem)"
43
- },
44
- "inside": {
45
- "xs": ".5rem",
46
- "sm": ".75rem",
47
- "md": "1rem",
48
- "lg": "1.5rem",
49
- "xl": "2rem"
50
- },
51
- "stack": {
52
- "xs": ".5rem",
53
- "sm": ".75rem",
54
- "md": "1rem",
55
- "lg": "1.5rem",
56
- "xl": "2rem"
43
+ "xs": "clamp(0.25rem, calc(0.09375rem + 0.78125vw), 0.875rem)",
44
+ "sm": "clamp(0.5rem, calc(0.1875rem + 1.5625vw), 1.75rem)",
45
+ "md": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)",
46
+ "lg": "clamp(1.5rem, calc(0.5625rem + 4.6875vw), 5.25rem)",
47
+ "xl": "clamp(2rem, calc(0.75rem + 6.25vw), 7rem)"
57
48
  }
58
49
  },
59
50
  "text": {
@@ -64,31 +55,31 @@
64
55
  },
65
56
  "level": {
66
57
  "0": {
67
- "font-size": "clamp(2.432rem, calc(2.683vw + 1.895rem), 4.578rem)",
58
+ "font-size": "clamp(2.4316rem, calc(1.8951rem + 2.6826vw), 4.5776rem)",
68
59
  "line-height": "1.15"
69
60
  },
70
61
  "1": {
71
- "font-size": "clamp(2.084rem, calc(1.973vw + 1.69rem), 3.662rem)",
62
+ "font-size": "clamp(2.0842rem, calc(1.6897rem + 1.9724vw), 3.6621rem)",
72
63
  "line-height": "1.2"
73
64
  },
74
65
  "2": {
75
- "font-size": "clamp(1.786rem, calc(1.43vw + 1.5rem), 2.93rem)",
66
+ "font-size": "clamp(1.7865rem, calc(1.5007rem + 1.429vw), 2.9297rem)",
76
67
  "line-height": "1.25"
77
68
  },
78
69
  "3": {
79
- "font-size": "clamp(1.531rem, calc(1.016vw + 1.328rem), 2.344rem)",
70
+ "font-size": "clamp(1.5313rem, calc(1.3281rem + 1.0156vw), 2.3438rem)",
80
71
  "line-height": "1.3"
81
72
  },
82
73
  "4": {
83
- "font-size": "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)",
74
+ "font-size": "clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)",
84
75
  "line-height": "1.5"
85
76
  },
86
77
  "5": {
87
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
78
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
88
79
  "line-height": "1.6"
89
80
  },
90
81
  "6": {
91
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
82
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
92
83
  "line-height": "1.6"
93
84
  }
94
85
  }
@@ -128,12 +119,6 @@
128
119
  "hover": {
129
120
  "color": "#102E62"
130
121
  },
131
- "on-background-dark": {
132
- "color": "#FFFFFF"
133
- },
134
- "on-background-light": {
135
- "color": "#000000"
136
- },
137
122
  "regular": {
138
123
  "text-decoration-line": "underline",
139
124
  "hover": {
@@ -146,18 +131,36 @@
146
131
  "hover": {
147
132
  "text-decoration-line": "underline"
148
133
  }
134
+ },
135
+ "contrast": {
136
+ "color": "#000000",
137
+ "hover": {
138
+ "color": "#000000"
139
+ },
140
+ "visited": {
141
+ "color": "#000000"
142
+ }
143
+ },
144
+ "inverse": {
145
+ "color": "#FFFFFF",
146
+ "hover": {
147
+ "color": "#FFFFFF"
148
+ },
149
+ "visited": {
150
+ "color": "#FFFFFF"
151
+ }
149
152
  }
150
153
  },
151
154
  "accordion": {
152
- "gap": ".5rem",
155
+ "gap": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
153
156
  "button": {
154
157
  "color": "#004699",
155
158
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
156
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
159
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
157
160
  "font-weight": 800,
158
- "gap": "1rem",
161
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
159
162
  "line-height": "1.6",
160
- "padding-block": ".75rem",
163
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
161
164
  "padding-inline": "0",
162
165
  "focus": {
163
166
  "outline-offset": "0.125rem"
@@ -167,16 +170,19 @@
167
170
  }
168
171
  },
169
172
  "panel": {
170
- "padding-block": "0 1rem",
173
+ "padding-block": "0",
171
174
  "padding-inline": "0"
172
175
  }
173
176
  },
177
+ "action-group": {
178
+ "gap": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)"
179
+ },
174
180
  "alert": {
175
181
  "border-width": "0.25rem",
176
182
  "border-style": "solid",
177
- "gap": "1rem",
178
- "padding-block": "1rem",
179
- "padding-inline": "1.5rem",
183
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
184
+ "padding-block": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
185
+ "padding-inline": "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)",
180
186
  "error": {
181
187
  "border-color": "#EC0000"
182
188
  },
@@ -194,6 +200,9 @@
194
200
  "hover": {
195
201
  "fill": "#004699"
196
202
  }
203
+ },
204
+ "content": {
205
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)"
197
206
  }
198
207
  },
199
208
  "aspect-ratio": {
@@ -207,11 +216,11 @@
207
216
  "avatar": {
208
217
  "aspect-ratio": "1 / 1",
209
218
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
210
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
219
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
211
220
  "font-weight": 400,
212
221
  "line-height": "1.6",
213
- "padding-block": "0.25rem",
214
- "padding-inline": "0.25rem",
222
+ "padding-block": "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)",
223
+ "padding-inline": "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)",
215
224
  "black": {
216
225
  "background-color": "#000000",
217
226
  "color": "#FFFFFF"
@@ -224,6 +233,9 @@
224
233
  "background-color": "#00A03C",
225
234
  "color": "#FFFFFF"
226
235
  },
236
+ "forced-colors": {
237
+ "border-width": "0.125rem"
238
+ },
227
239
  "green": {
228
240
  "background-color": "#BED200",
229
241
  "color": "#000000"
@@ -271,10 +283,10 @@
271
283
  },
272
284
  "badge": {
273
285
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
274
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
286
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
275
287
  "font-weight": 800,
276
288
  "line-height": "1.6",
277
- "padding-inline": ".5rem",
289
+ "padding-inline": "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)",
278
290
  "black": {
279
291
  "background-color": "#000000",
280
292
  "color": "#FFFFFF"
@@ -335,18 +347,21 @@
335
347
  "blockquote": {
336
348
  "color": "#000000",
337
349
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
338
- "font-size": "clamp(1.531rem, calc(1.016vw + 1.328rem), 2.344rem)",
350
+ "font-size": "clamp(1.5313rem, calc(1.3281rem + 1.0156vw), 2.3438rem)",
339
351
  "font-weight": 800,
340
352
  "line-height": "1.3",
341
353
  "inverse-color": "#FFFFFF"
342
354
  },
343
355
  "breadcrumb": {
344
356
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
345
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
357
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
346
358
  "font-weight": 400,
347
359
  "line-height": "1.6",
348
360
  "separator": {
349
- "background-image": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23000000' fill-rule='evenodd' d='m9.757 32-2.9-2.91L19.937 16 6.857 2.91 9.757 0l16 16z'/></svg>\")"
361
+ "background-image": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23000000' fill-rule='evenodd' d='m9.757 32-2.9-2.91L19.937 16 6.857 2.91 9.757 0l16 16z'/></svg>\")",
362
+ "block-size": "1ex",
363
+ "inline-size": "1ex",
364
+ "margin-inline": "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)"
350
365
  },
351
366
  "link": {
352
367
  "color": "#004699",
@@ -360,15 +375,22 @@
360
375
  }
361
376
  }
362
377
  },
378
+ "breakout": {
379
+ "row-gap": {
380
+ "sm": "clamp(0.5rem, calc(0.1875rem + 1.5625vw), 1.75rem)",
381
+ "md": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)",
382
+ "lg": "clamp(1.5rem, calc(0.5625rem + 4.6875vw), 5.25rem)"
383
+ }
384
+ },
363
385
  "button": {
364
386
  "cursor": "pointer",
365
387
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
366
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
388
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
367
389
  "line-height": "1.6",
368
- "gap": "1rem",
369
- "padding-block": ".5rem",
370
- "padding-inline": "1rem",
390
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
371
391
  "outline-offset": "0.125rem",
392
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
393
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
372
394
  "disabled": {
373
395
  "cursor": "not-allowed"
374
396
  },
@@ -416,9 +438,17 @@
416
438
  "background-color": "transparent",
417
439
  "color": "#BEBEBE"
418
440
  }
441
+ },
442
+ "icon-only": {
443
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
444
+ "padding-inline": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)"
419
445
  }
420
446
  },
421
447
  "card": {
448
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
449
+ "heading-group": {
450
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)"
451
+ },
422
452
  "link": {
423
453
  "color": "#004699",
424
454
  "text-decoration-line": "none",
@@ -431,11 +461,22 @@
431
461
  },
432
462
  "outline-offset": "0.125rem"
433
463
  },
464
+ "character-count": {
465
+ "color": "#000000",
466
+ "font-family": "'Amsterdam Sans', Arial, sans-serif",
467
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
468
+ "font-weight": 400,
469
+ "line-height": "1.6",
470
+ "error": {
471
+ "color": "#EC0000"
472
+ }
473
+ },
434
474
  "checkbox": {
435
475
  "color": "#000000",
436
476
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
437
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
477
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
438
478
  "font-weight": 400,
479
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
439
480
  "line-height": "1.6",
440
481
  "outline-offset": "0.125rem",
441
482
  "checkmark": {
@@ -504,11 +545,12 @@
504
545
  },
505
546
  "column": {
506
547
  "gap": {
507
- "xs": "clamp(0.25rem, calc(0.78125vw + 0.09375rem), 0.875rem)",
508
- "sm": "clamp(0.5rem, calc(1.5625vw + 0.1875rem), 1.75rem)",
509
- "md": "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)",
510
- "lg": "clamp(1.5rem, calc(4.6875vw + 0.5625rem), 5.25rem)",
511
- "xl": "clamp(2rem, calc(6.25vw + 0.75rem), 7rem)"
548
+ "no": "0",
549
+ "xs": "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)",
550
+ "sm": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
551
+ "md": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
552
+ "lg": "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)",
553
+ "xl": "clamp(2.25rem, 2.0625rem + 0.9375vw, 3rem)"
512
554
  }
513
555
  },
514
556
  "date-input": {
@@ -516,12 +558,12 @@
516
558
  "box-shadow": "inset 0 0 0 0.0625rem #000000",
517
559
  "color": "#000000",
518
560
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
519
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
561
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
520
562
  "font-weight": 400,
521
563
  "line-height": "1.6",
522
564
  "outline-offset": "0.125rem",
523
- "padding-block": ".5rem",
524
- "padding-inline": "1.5rem",
565
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
566
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
525
567
  "calender-picker-indicator": {
526
568
  "background-image": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%23004699'><path d='M28 6V2h-4v4H12V2H8v4H2v28h32V6zm2 24H6V14h24z'/><path d='M10 17h4v4h-4zm6 0h4v4h-4zm6 0h4v4h-4zm-12 6h4v4h-4zm6 0h4v4h-4z'/></svg>\")"
527
569
  },
@@ -548,63 +590,59 @@
548
590
  },
549
591
  "description-list": {
550
592
  "color": "#000000",
593
+ "column-gap": "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)",
551
594
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
552
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
553
- "font-weight": 400,
554
- "gap": "1rem",
595
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
555
596
  "inverse-color": "#FFFFFF",
556
597
  "line-height": "1.6",
557
- "row": {
558
- "gap": "1rem"
598
+ "row-gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
599
+ "term": {
600
+ "font-weight": 800
559
601
  },
560
602
  "details": {
561
- "font-weight": 800,
562
- "padding-inline-start": "2rem"
603
+ "font-weight": 400,
604
+ "padding-inline-start": "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)"
563
605
  }
564
606
  },
565
607
  "dialog": {
566
608
  "background-color": "#FFFFFF",
567
609
  "border": "0",
568
- "max-inline-size": "min(87.69vw, 45rem)",
569
- "form": {
570
- "gap": "1.5rem",
571
- "padding-block": "clamp(1.5rem, calc(1.5rem + ((1vw - 0.5337rem) * 2.1448)), 2.5rem)",
572
- "padding-inline": "clamp(1.5rem, calc(1.5rem + ((1vw - 0.5337rem) * 2.1448)), 2.5rem)",
573
- "max-block-size": "75vh"
574
- },
610
+ "gap": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
611
+ "inline-size": "calc(100% - 2 * clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem))",
612
+ "max-block-size": "calc(100dvh - 2 * clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem))",
613
+ "max-inline-size": "48rem",
614
+ "padding-block": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)",
615
+ "padding-inline": "clamp(1.5rem, calc(0.5625rem + 4.6875vw), 5.25rem)",
575
616
  "header": {
576
- "gap": "1rem"
577
- },
578
- "footer": {
579
- "gap": "1rem"
617
+ "gap": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)"
580
618
  }
581
619
  },
582
620
  "error-message": {
583
621
  "color": "#EC0000",
584
622
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
585
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
623
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
586
624
  "font-weight": 400,
587
625
  "line-height": "1.6"
588
626
  },
589
627
  "field-set": {
590
628
  "invalid": {
591
629
  "border-inline-start": "0.1875rem solid #EC0000",
592
- "padding-inline-start": "1rem"
630
+ "padding-inline-start": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)"
593
631
  },
594
632
  "legend": {
595
633
  "color": "#000000",
596
634
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
597
- "font-size": "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)",
635
+ "font-size": "clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)",
598
636
  "font-weight": 800,
599
637
  "line-height": "1.5",
600
- "margin-block-end": "1rem"
638
+ "margin-block-end": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)"
601
639
  }
602
640
  },
603
641
  "field": {
604
- "gap": ".75rem",
642
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
605
643
  "invalid": {
606
644
  "border-inline-start": "0.1875rem solid #EC0000",
607
- "padding-inline-start": "1rem"
645
+ "padding-inline-start": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)"
608
646
  }
609
647
  },
610
648
  "file-input": {
@@ -613,12 +651,12 @@
613
651
  "color": "#000000",
614
652
  "cursor": "pointer",
615
653
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
616
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
654
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
617
655
  "font-weight": 400,
618
656
  "line-height": "1.6",
619
657
  "outline-offset": "0.125rem",
620
- "padding-block": "1rem",
621
- "padding-inline": "1rem",
658
+ "padding-block": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
659
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
622
660
  "disabled": {
623
661
  "color": "#BEBEBE",
624
662
  "cursor": "not-allowed"
@@ -628,9 +666,9 @@
628
666
  "box-shadow": "inset 0 0 0 0.125rem #004699",
629
667
  "color": "#004699",
630
668
  "cursor": "pointer",
631
- "margin-inline-end": "1rem",
632
- "padding-block": ".5rem",
633
- "padding-inline": "1rem",
669
+ "margin-inline-end": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
670
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
671
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
634
672
  "hover": {
635
673
  "box-shadow": "inset 0 0 0 0.1875rem #102E62",
636
674
  "color": "#102E62"
@@ -645,36 +683,29 @@
645
683
  }
646
684
  }
647
685
  },
648
- "form-field-character-counter": {
649
- "color": "#000000",
650
- "font-family": "'Amsterdam Sans', Arial, sans-serif",
651
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
652
- "font-weight": 400,
653
- "line-height": "1.6",
654
- "error": {
655
- "color": "#EC0000"
656
- }
686
+ "form-error-list": {
687
+ "outline-offset": "0.125rem"
657
688
  },
658
689
  "gap": {
659
- "xs": "clamp(0.25rem, calc(0.78125vw + 0.09375rem), 0.875rem)",
660
- "sm": "clamp(0.5rem, calc(1.5625vw + 0.1875rem), 1.75rem)",
661
- "md": "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)",
662
- "lg": "clamp(1.5rem, calc(4.6875vw + 0.5625rem), 5.25rem)",
663
- "xl": "clamp(2rem, calc(6.25vw + 0.75rem), 7rem)"
690
+ "xs": "clamp(0.25rem, calc(0.09375rem + 0.78125vw), 0.875rem)",
691
+ "sm": "clamp(0.5rem, calc(0.1875rem + 1.5625vw), 1.75rem)",
692
+ "md": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)",
693
+ "lg": "clamp(1.5rem, calc(0.5625rem + 4.6875vw), 5.25rem)",
694
+ "xl": "clamp(2rem, calc(0.75rem + 6.25vw), 7rem)"
664
695
  },
665
696
  "grid": {
666
697
  "column-count": "4",
667
- "column-gap": "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)",
698
+ "column-gap": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)",
668
699
  "padding-block": {
669
- "sm": "clamp(0.5rem, calc(1.5625vw + 0.1875rem), 1.75rem)",
670
- "md": "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)",
671
- "lg": "clamp(1.5rem, calc(4.6875vw + 0.5625rem), 5.25rem)"
700
+ "sm": "clamp(0.5rem, calc(0.1875rem + 1.5625vw), 1.75rem)",
701
+ "md": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)",
702
+ "lg": "clamp(1.5rem, calc(0.5625rem + 4.6875vw), 5.25rem)"
672
703
  },
673
- "padding-inline": "clamp(1.5rem, calc(4.6875vw + 0.5625rem), 5.25rem)",
704
+ "padding-inline": "clamp(1.5rem, calc(0.5625rem + 4.6875vw), 5.25rem)",
674
705
  "row-gap": {
675
- "sm": "clamp(0.5rem, calc(1.5625vw + 0.1875rem), 1.75rem)",
676
- "md": "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)",
677
- "lg": "clamp(1.5rem, calc(4.6875vw + 0.5625rem), 5.25rem)"
706
+ "sm": "clamp(0.5rem, calc(0.1875rem + 1.5625vw), 1.75rem)",
707
+ "md": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)",
708
+ "lg": "clamp(1.5rem, calc(0.5625rem + 4.6875vw), 5.25rem)"
678
709
  },
679
710
  "medium": {
680
711
  "column-count": "8"
@@ -684,8 +715,8 @@
684
715
  }
685
716
  },
686
717
  "header": {
687
- "column-gap": "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)",
688
- "padding-block": "1rem",
718
+ "column-gap": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)",
719
+ "padding-block": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
689
720
  "logo-link": {
690
721
  "outline-offset": "0.125rem"
691
722
  }
@@ -697,31 +728,34 @@
697
728
  "inverse-color": "#FFFFFF",
698
729
  "level": {
699
730
  "1": {
700
- "font-size": "clamp(2.084rem, calc(1.973vw + 1.69rem), 3.662rem)",
731
+ "font-size": "clamp(2.0842rem, calc(1.6897rem + 1.9724vw), 3.6621rem)",
701
732
  "line-height": "1.2"
702
733
  },
703
734
  "2": {
704
- "font-size": "clamp(1.786rem, calc(1.43vw + 1.5rem), 2.93rem)",
735
+ "font-size": "clamp(1.7865rem, calc(1.5007rem + 1.429vw), 2.9297rem)",
705
736
  "line-height": "1.25"
706
737
  },
707
738
  "3": {
708
- "font-size": "clamp(1.531rem, calc(1.016vw + 1.328rem), 2.344rem)",
739
+ "font-size": "clamp(1.5313rem, calc(1.3281rem + 1.0156vw), 2.3438rem)",
709
740
  "line-height": "1.3"
710
741
  },
711
742
  "4": {
712
- "font-size": "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)",
743
+ "font-size": "clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)",
713
744
  "line-height": "1.5"
714
745
  },
715
746
  "5": {
716
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
747
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
717
748
  "line-height": "1.6"
718
749
  },
719
750
  "6": {
720
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
751
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
721
752
  "line-height": "1.6"
722
753
  }
723
754
  }
724
755
  },
756
+ "hint": {
757
+ "color": "#767676"
758
+ },
725
759
  "icon-button": {
726
760
  "color": "#004699",
727
761
  "outline-offset": "0.125rem",
@@ -732,7 +766,7 @@
732
766
  "disabled": {
733
767
  "color": "#BEBEBE"
734
768
  },
735
- "on-background-light": {
769
+ "contrast-color": {
736
770
  "color": "#000000",
737
771
  "hover": {
738
772
  "background-color": "rgba(0, 0, 0, 0.125)",
@@ -742,7 +776,7 @@
742
776
  "color": "#BEBEBE"
743
777
  }
744
778
  },
745
- "on-background-dark": {
779
+ "inverse-color": {
746
780
  "background-color": "#004699",
747
781
  "color": "#FFFFFF",
748
782
  "hover": {
@@ -757,64 +791,86 @@
757
791
  },
758
792
  "icon": {
759
793
  "size-3": {
760
- "font-size": "clamp(1.531rem, calc(1.016vw + 1.328rem), 2.344rem)",
794
+ "font-size": "clamp(1.5313rem, calc(1.3281rem + 1.0156vw), 2.3438rem)",
761
795
  "line-height": "1.3"
762
796
  },
763
797
  "size-4": {
764
- "font-size": "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)",
798
+ "font-size": "clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)",
765
799
  "line-height": "1.5"
766
800
  },
767
801
  "size-5": {
768
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
802
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
769
803
  "line-height": "1.6"
770
804
  },
771
805
  "size-6": {
772
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
806
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
773
807
  "line-height": "1.6"
774
808
  }
775
809
  },
810
+ "image-slider": {
811
+ "gap": "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)",
812
+ "scroller": {
813
+ "gap": "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)",
814
+ "outline-offset": "0.125rem"
815
+ },
816
+ "thumbnails": {
817
+ "gap": "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)",
818
+ "thumbnail": {
819
+ "background-color": "transparent",
820
+ "cursor": "pointer",
821
+ "opacity": "40%",
822
+ "outline-offset": "0.125rem",
823
+ "in-view": {
824
+ "opacity": "100%"
825
+ },
826
+ "hover": {
827
+ "opacity": "100%"
828
+ }
829
+ }
830
+ }
831
+ },
776
832
  "label": {
777
833
  "color": "#000000",
778
834
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
779
- "font-size": "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)",
835
+ "font-size": "clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)",
780
836
  "font-weight": 800,
781
837
  "line-height": "1.5"
782
838
  },
783
839
  "link-list": {
784
- "gap": "0.5em",
840
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
785
841
  "link": {
786
842
  "color": "#004699",
787
843
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
788
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
844
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
789
845
  "font-weight": 400,
790
- "gap": "0.5em",
846
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
791
847
  "line-height": "1.6",
792
848
  "outline-offset": "0.125rem",
793
849
  "text-decoration-line": "none",
794
850
  "text-decoration-thickness": "0.125rem",
795
851
  "text-underline-offset": "0.3333em",
796
852
  "small": {
797
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
853
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
798
854
  "line-height": "1.6"
799
855
  },
800
856
  "large": {
801
- "font-size": "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)",
857
+ "font-size": "clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)",
802
858
  "line-height": "1.5"
803
859
  },
804
860
  "hover": {
805
861
  "color": "#102E62",
806
862
  "text-decoration-line": "underline"
807
863
  },
808
- "on-background-dark": {
809
- "color": "#FFFFFF",
864
+ "contrast-color": {
865
+ "color": "#000000",
810
866
  "hover": {
811
- "color": "#FFFFFF"
867
+ "color": "#000000"
812
868
  }
813
869
  },
814
- "on-background-light": {
815
- "color": "#000000",
870
+ "inverse-color": {
871
+ "color": "#FFFFFF",
816
872
  "hover": {
817
- "color": "#000000"
873
+ "color": "#FFFFFF"
818
874
  }
819
875
  }
820
876
  }
@@ -843,7 +899,7 @@
843
899
  }
844
900
  },
845
901
  "standalone": {
846
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
902
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
847
903
  "line-height": "1.6",
848
904
  "text-decoration-line": "underline",
849
905
  "text-decoration-thickness": "0.125rem",
@@ -853,22 +909,22 @@
853
909
  "text-underline-offset": "0.2778em"
854
910
  }
855
911
  },
856
- "on-background-dark": {
857
- "color": "#FFFFFF",
912
+ "contrast-color": {
913
+ "color": "#000000",
858
914
  "hover": {
859
- "color": "#FFFFFF"
915
+ "color": "#000000"
860
916
  },
861
917
  "visited": {
862
- "color": "#FFFFFF"
918
+ "color": "#000000"
863
919
  }
864
920
  },
865
- "on-background-light": {
866
- "color": "#000000",
921
+ "inverse-color": {
922
+ "color": "#FFFFFF",
867
923
  "hover": {
868
- "color": "#000000"
924
+ "color": "#FFFFFF"
869
925
  },
870
926
  "visited": {
871
- "color": "#000000"
927
+ "color": "#FFFFFF"
872
928
  }
873
929
  }
874
930
  },
@@ -885,34 +941,34 @@
885
941
  }
886
942
  },
887
943
  "margin": {
888
- "xs": "clamp(0.25rem, calc(0.78125vw + 0.09375rem), 0.875rem)",
889
- "sm": "clamp(0.5rem, calc(1.5625vw + 0.1875rem), 1.75rem)",
890
- "md": "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)",
891
- "lg": "clamp(1.5rem, calc(4.6875vw + 0.5625rem), 5.25rem)",
892
- "xl": "clamp(2rem, calc(6.25vw + 0.75rem), 7rem)"
944
+ "xs": "clamp(0.25rem, calc(0.09375rem + 0.78125vw), 0.875rem)",
945
+ "sm": "clamp(0.5rem, calc(0.1875rem + 1.5625vw), 1.75rem)",
946
+ "md": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)",
947
+ "lg": "clamp(1.5rem, calc(0.5625rem + 4.6875vw), 5.25rem)",
948
+ "xl": "clamp(2rem, calc(0.75rem + 6.25vw), 7rem)"
893
949
  },
894
950
  "mark": {
895
951
  "background-color": "#FFE600"
896
952
  },
897
953
  "mega-menu": {
898
954
  "list-category": {
899
- "column-gap": "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)",
955
+ "column-gap": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)",
900
956
  "column-width": "20rem",
901
- "padding-block-start": "1rem",
902
- "padding-block-end": "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)"
957
+ "padding-block-start": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
958
+ "padding-block-end": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)"
903
959
  }
904
960
  },
905
961
  "ordered-list": {
906
962
  "color": "#000000",
907
963
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
908
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
964
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
909
965
  "font-weight": 400,
910
- "gap": "0.75rem",
966
+ "gap": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
911
967
  "inverse-color": "#FFFFFF",
912
968
  "line-height": "1.6",
913
969
  "list-style-type": "decimal",
914
970
  "small": {
915
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
971
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
916
972
  "line-height": "1.6"
917
973
  },
918
974
  "item": {
@@ -920,7 +976,10 @@
920
976
  "padding-inline-start": "0.25rem"
921
977
  },
922
978
  "ordered-list": {
979
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
923
980
  "list-style-type": "lower-alpha",
981
+ "padding-block-end": "0",
982
+ "padding-block-start": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
924
983
  "item": {
925
984
  "margin-inline-start": "1.5rem",
926
985
  "padding-inline-start": "0.25rem"
@@ -930,20 +989,20 @@
930
989
  "page-heading": {
931
990
  "color": "#000000",
932
991
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
933
- "font-size": "clamp(2.432rem, calc(2.683vw + 1.895rem), 4.578rem)",
992
+ "font-size": "clamp(2.4316rem, calc(1.8951rem + 2.6826vw), 4.5776rem)",
934
993
  "font-weight": 800,
935
994
  "inverse-color": "#FFFFFF",
936
- "line-height": "clamp(2.432rem, calc(2.683vw + 1.895rem), 4.578rem)"
995
+ "line-height": "clamp(2.4316rem, calc(1.8951rem + 2.6826vw), 4.5776rem)"
937
996
  },
938
997
  "page-menu": {
939
- "column-gap": "clamp(1rem, calc(3.125vw + 0.375rem), 3.5rem)",
940
- "row-gap": "clamp(0.25rem, calc(0.78125vw + 0.09375rem), 0.875rem)",
998
+ "column-gap": "clamp(1rem, calc(0.375rem + 3.125vw), 3.5rem)",
999
+ "row-gap": "clamp(0.25rem, calc(0.09375rem + 0.78125vw), 0.875rem)",
941
1000
  "item": {
942
1001
  "color": "#004699",
943
1002
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
944
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
1003
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
945
1004
  "font-weight": 400,
946
- "gap": "0.5rem",
1005
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
947
1006
  "line-height": "1.6",
948
1007
  "outline-offset": "0.125rem",
949
1008
  "text-decoration-line": "none",
@@ -958,12 +1017,13 @@
958
1017
  "pagination": {
959
1018
  "color": "#004699",
960
1019
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
961
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1020
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
962
1021
  "font-weight": 400,
963
1022
  "line-height": "1.6",
964
1023
  "button": {
1024
+ "gap": "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)",
965
1025
  "outline-offset": "0.125rem",
966
- "padding-inline": ".75rem",
1026
+ "padding-inline": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
967
1027
  "text-decoration-line": "none",
968
1028
  "text-decoration-thickness": "0.125rem",
969
1029
  "text-underline-offset": "0.3333em",
@@ -979,58 +1039,97 @@
979
1039
  "paragraph": {
980
1040
  "color": "#000000",
981
1041
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
982
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1042
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
983
1043
  "font-weight": 400,
984
1044
  "line-height": "1.6",
985
1045
  "inverse-color": "#FFFFFF",
986
1046
  "small": {
987
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
1047
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
988
1048
  "line-height": "1.6"
989
1049
  },
990
1050
  "large": {
991
- "font-size": "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)",
1051
+ "font-size": "clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)",
992
1052
  "line-height": "1.5"
993
1053
  }
994
1054
  },
1055
+ "password-input": {
1056
+ "background-color": "#FFFFFF",
1057
+ "box-shadow": "inset 0 0 0 0.0625rem #000000",
1058
+ "color": "#000000",
1059
+ "font-family": "'Amsterdam Sans', Arial, sans-serif",
1060
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
1061
+ "font-weight": 400,
1062
+ "line-height": "1.6",
1063
+ "outline-offset": "0.125rem",
1064
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1065
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
1066
+ "disabled": {
1067
+ "background-color": "#FFFFFF",
1068
+ "box-shadow": "inset 0 0 0 0.0625rem #BEBEBE",
1069
+ "color": "#BEBEBE"
1070
+ },
1071
+ "hover": {
1072
+ "box-shadow": "inset 0 0 0 0.125rem #000000"
1073
+ },
1074
+ "invalid": {
1075
+ "box-shadow": "inset 0 0 0 0.0625rem #EC0000",
1076
+ "hover": {
1077
+ "box-shadow": "inset 0 0 0 0.125rem #EC0000"
1078
+ }
1079
+ },
1080
+ "placeholder": {
1081
+ "color": "#767676"
1082
+ }
1083
+ },
995
1084
  "radio": {
996
1085
  "color": "#000000",
997
1086
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
998
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1087
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
999
1088
  "font-weight": 400,
1089
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1000
1090
  "line-height": "1.6",
1001
1091
  "outline-offset": "0.125rem",
1002
- "circle": {
1003
- "border-color": "#004699",
1004
- "border-width": "0.125rem",
1005
- "checked": {
1006
- "background-image": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' fill='%23004699'%3E%3Ccircle cx='16' cy='16' r='16' /%3E%3C/svg%3E\")",
1092
+ "text-decoration-thickness": "0.125rem",
1093
+ "text-underline-offset": "0.3333em",
1094
+ "checked-indicator": {
1095
+ "fill": "#004699",
1096
+ "disabled": {
1097
+ "fill": "#767676"
1098
+ },
1099
+ "disabled-invalid": {
1100
+ "fill": "#767676",
1007
1101
  "hover": {
1008
- "background-image": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' fill='%23102E62'%3E%3Ccircle cx='16' cy='16' r='16' /%3E%3C/svg%3E\")"
1102
+ "fill": "#767676"
1009
1103
  }
1010
1104
  },
1105
+ "hover": {
1106
+ "fill": "#102E62"
1107
+ },
1108
+ "invalid": {
1109
+ "fill": "#EC0000",
1110
+ "hover": {
1111
+ "fill": "#EC0000"
1112
+ }
1113
+ }
1114
+ },
1115
+ "circle": {
1116
+ "stroke": "#004699",
1011
1117
  "disabled": {
1012
- "border-color": "#767676",
1013
- "border-width": "0.125rem",
1014
- "checked": {
1015
- "background-image": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' fill='%23767676'%3E%3Ccircle cx='16' cy='16' r='16' /%3E%3C/svg%3E\")",
1016
- "hover": {
1017
- "background-image": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' fill='%23767676'%3E%3Ccircle cx='16' cy='16' r='16' /%3E%3C/svg%3E\")"
1018
- }
1118
+ "stroke": "#767676"
1119
+ },
1120
+ "disabled-invalid": {
1121
+ "stroke": "#767676",
1122
+ "hover": {
1123
+ "stroke": "#767676"
1019
1124
  }
1020
1125
  },
1021
1126
  "hover": {
1022
- "border-color": "#102E62"
1127
+ "stroke": "#102E62"
1023
1128
  },
1024
1129
  "invalid": {
1025
- "border-color": "#EC0000",
1026
- "checked": {
1027
- "background-image": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' fill='%23EC0000'%3E%3Ccircle cx='16' cy='16' r='16' /%3E%3C/svg%3E\")",
1028
- "hover": {
1029
- "background-image": "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' fill='%23EC0000'%3E%3Ccircle cx='16' cy='16' r='16' /%3E%3C/svg%3E\")"
1030
- }
1031
- },
1130
+ "stroke": "#EC0000",
1032
1131
  "hover": {
1033
- "border-color": "#EC0000"
1132
+ "stroke": "#EC0000"
1034
1133
  }
1035
1134
  }
1036
1135
  },
@@ -1039,16 +1138,21 @@
1039
1138
  },
1040
1139
  "hover": {
1041
1140
  "color": "#102E62",
1042
- "text-decoration-thickness": "0.125rem"
1141
+ "text-decoration-line": "underline"
1142
+ },
1143
+ "icon-container": {
1144
+ "block-size": "calc(clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem) * 1.6)",
1145
+ "inline-size": "1.5rem"
1043
1146
  }
1044
1147
  },
1045
1148
  "row": {
1046
1149
  "gap": {
1047
- "xs": ".5rem",
1048
- "sm": ".75rem",
1049
- "md": "1rem",
1050
- "lg": "1.5rem",
1051
- "xl": "2rem"
1150
+ "no": "0",
1151
+ "xs": "clamp(0.2813rem, 0.2578rem + 0.1172vw, 0.375rem)",
1152
+ "sm": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1153
+ "md": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
1154
+ "lg": "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)",
1155
+ "xl": "clamp(2.25rem, 2.0625rem + 0.9375vw, 3rem)"
1052
1156
  }
1053
1157
  },
1054
1158
  "screen": {
@@ -1065,8 +1169,8 @@
1065
1169
  "background-color": "#004699",
1066
1170
  "color": "#FFFFFF",
1067
1171
  "outline-offset": "0.125rem",
1068
- "padding-block": ".5rem",
1069
- "padding-inline": ".5rem",
1172
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1173
+ "padding-inline": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1070
1174
  "hover": {
1071
1175
  "background-color": "#102E62"
1072
1176
  }
@@ -1076,17 +1180,17 @@
1076
1180
  "box-shadow": "inset 0 0 0 0.0625rem #000000",
1077
1181
  "color": "#000000",
1078
1182
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1079
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1183
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
1080
1184
  "font-weight": 400,
1081
1185
  "line-height": "1.6",
1082
1186
  "outline-offset": "0.125rem",
1083
- "padding-block": ".5rem",
1084
- "padding-inline": "1rem",
1187
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1188
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
1085
1189
  "cancel-button": {
1086
1190
  "background-image": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23004699' fill-rule='evenodd' d='M29.333 5.47 26.53 2.668 16 13.187 5.47 2.666 2.668 5.47 13.187 16 2.666 26.53l2.804 2.803L16 18.813l10.53 10.52 2.803-2.804L18.813 16z'/></svg>\")",
1087
- "block-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1191
+ "block-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
1088
1192
  "color": "#004699",
1089
- "inline-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)"
1193
+ "inline-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)"
1090
1194
  },
1091
1195
  "hover": {
1092
1196
  "box-shadow": "inset 0 0 0 0.125rem #000000"
@@ -1105,16 +1209,16 @@
1105
1209
  "select": {
1106
1210
  "background-color": "#FFFFFF",
1107
1211
  "background-image": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23004699' fill-rule='evenodd' d='m16 25.757-16-16 2.91-2.9L16 19.937l13.09-13.08 2.91 2.9z'/></svg>\")",
1108
- "background-position": "right 1rem center",
1212
+ "background-position": "right clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) center",
1109
1213
  "box-shadow": "inset 0 0 0 0.0625rem #000000",
1110
1214
  "color": "#000000",
1111
1215
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1112
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1216
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
1113
1217
  "font-weight": 400,
1114
1218
  "line-height": "1.6",
1115
1219
  "outline-offset": "0.125rem",
1116
- "padding-block": ".5rem",
1117
- "padding-inline": "1rem calc(2 * 1rem + 1em)",
1220
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1221
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) calc(2 * clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem) + 1em)",
1118
1222
  "disabled": {
1119
1223
  "background-image": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23BEBEBE' fill-rule='evenodd' d='m16 25.757-16-16 2.91-2.9L16 19.937l13.09-13.08 2.91 2.9z'/></svg>\")",
1120
1224
  "box-shadow": "inset 0 0 0 0.0625rem #BEBEBE",
@@ -1139,12 +1243,12 @@
1139
1243
  "background-color": "#004699",
1140
1244
  "color": "#FFFFFF",
1141
1245
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1142
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
1246
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
1143
1247
  "font-weight": 400,
1144
1248
  "line-height": "1.6",
1145
1249
  "outline-offset": "0.125rem",
1146
- "padding-block": ".5rem",
1147
- "padding-inline": "1rem",
1250
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1251
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
1148
1252
  "hover": {
1149
1253
  "background-color": "#102E62"
1150
1254
  }
@@ -1198,9 +1302,9 @@
1198
1302
  },
1199
1303
  "table-of-contents": {
1200
1304
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1201
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1305
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
1202
1306
  "font-weight": 400,
1203
- "gap": "1rem",
1307
+ "gap": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
1204
1308
  "line-height": "1.6",
1205
1309
  "link": {
1206
1310
  "color": "#004699",
@@ -1214,22 +1318,22 @@
1214
1318
  }
1215
1319
  },
1216
1320
  "list": {
1217
- "gap": "1rem",
1321
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1218
1322
  "list": {
1219
- "padding-block-start": "1rem",
1220
- "padding-inline-start": "1.5rem"
1323
+ "padding-block-start": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1324
+ "padding-inline-start": "clamp(1.6875rem, 1.5469rem + 0.7031vw, 2.25rem)"
1221
1325
  }
1222
1326
  },
1223
1327
  "heading": {
1224
1328
  "font-weight": 800,
1225
- "font-size": "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)",
1329
+ "font-size": "clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)",
1226
1330
  "line-height": "1.5"
1227
1331
  }
1228
1332
  },
1229
1333
  "table": {
1230
1334
  "color": "#000000",
1231
1335
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1232
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1336
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
1233
1337
  "font-weight": 400,
1234
1338
  "line-height": "1.6",
1235
1339
  "caption": {
@@ -1237,14 +1341,15 @@
1237
1341
  },
1238
1342
  "cell": {
1239
1343
  "border-block-end": "0.0625rem solid #E8E8E8",
1240
- "padding-block": "1rem",
1241
- "padding-inline": "1rem"
1344
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1345
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)"
1242
1346
  },
1243
1347
  "header-cell": {
1244
1348
  "font-weight": 800
1245
1349
  }
1246
1350
  },
1247
1351
  "tabs": {
1352
+ "gap": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
1248
1353
  "list": {
1249
1354
  "background-color": "#FFFFFF",
1250
1355
  "border-block-end": "0.125rem solid #004699"
@@ -1253,12 +1358,12 @@
1253
1358
  "color": "#004699",
1254
1359
  "cursor": "pointer",
1255
1360
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1256
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1361
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
1257
1362
  "font-weight": 400,
1258
1363
  "line-height": "1.6",
1259
1364
  "outline-offset": "-0.25rem",
1260
- "padding-block": ".5rem",
1261
- "padding-inline": "1rem",
1365
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1366
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
1262
1367
  "hover": {
1263
1368
  "color": "#102E62",
1264
1369
  "box-shadow": "inset 0 -0.125rem 0 0 #102E62"
@@ -1278,13 +1383,13 @@
1278
1383
  "box-shadow": "inset 0 0 0 0.0625rem #000000",
1279
1384
  "color": "#000000",
1280
1385
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1281
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1386
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
1282
1387
  "font-weight": 400,
1283
1388
  "line-height": "1.6",
1284
- "min-block-size": "calc(1.6 * 1em + 2 * 0.5rem)",
1389
+ "min-block-size": "calc(1.6 * 1em + 2 * clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem))",
1285
1390
  "outline-offset": "0.125rem",
1286
- "padding-block": "0.5rem",
1287
- "padding-inline": "1rem",
1391
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1392
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
1288
1393
  "disabled": {
1289
1394
  "background-color": "#FFFFFF",
1290
1395
  "box-shadow": "inset 0 0 0 0.0625rem #BEBEBE",
@@ -1309,12 +1414,12 @@
1309
1414
  "box-shadow": "inset 0 0 0 0.0625rem #000000",
1310
1415
  "color": "#000000",
1311
1416
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1312
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1417
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
1313
1418
  "font-weight": 400,
1314
1419
  "line-height": "1.6",
1315
1420
  "outline-offset": "0.125rem",
1316
- "padding-block": ".5rem",
1317
- "padding-inline": "1rem",
1421
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1422
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
1318
1423
  "disabled": {
1319
1424
  "background-color": "#FFFFFF",
1320
1425
  "box-shadow": "inset 0 0 0 0.0625rem #BEBEBE",
@@ -1338,12 +1443,12 @@
1338
1443
  "box-shadow": "inset 0 0 0 0.0625rem #000000",
1339
1444
  "color": "#000000",
1340
1445
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1341
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1446
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
1342
1447
  "font-weight": 400,
1343
1448
  "line-height": "1.6",
1344
1449
  "outline-offset": "0.125rem",
1345
- "padding-block": ".5rem",
1346
- "padding-inline": "1rem",
1450
+ "padding-block": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1451
+ "padding-inline": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
1347
1452
  "calender-picker-indicator": {
1348
1453
  "background-image": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23004699'><path d='M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16A16 16 0 0 0 16 0zm.9 28v-2h-2v1.9A11.8 11.8 0 0 1 4.1 17H6v-2H4.1A11.8 11.8 0 0 1 15 4.1V6h2V4.1A11.8 11.8 0 0 1 27.9 15H26v2h1.9a11.9 11.9 0 0 1-11 11zm.1-13h4v2h-6V9h2v6z'/></svg>\")"
1349
1454
  },
@@ -1369,17 +1474,18 @@
1369
1474
  }
1370
1475
  },
1371
1476
  "top-task-link": {
1477
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1372
1478
  "description": {
1373
1479
  "color": "#000000",
1374
1480
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1375
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
1481
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
1376
1482
  "font-weight": 400,
1377
1483
  "line-height": "1.6"
1378
1484
  },
1379
1485
  "label": {
1380
1486
  "color": "#004699",
1381
1487
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1382
- "font-size": "clamp(1.313rem, calc(0.703vw + 1.173rem), 1.875rem)",
1488
+ "font-size": "clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)",
1383
1489
  "font-weight": 800,
1384
1490
  "line-height": "1.5",
1385
1491
  "text-decoration-line": "none",
@@ -1395,9 +1501,9 @@
1395
1501
  "unordered-list": {
1396
1502
  "color": "#000000",
1397
1503
  "font-family": "'Amsterdam Sans', Arial, sans-serif",
1398
- "font-size": "clamp(1.125rem, calc(0.469vw + 1.031rem), 1.5rem)",
1504
+ "font-size": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)",
1399
1505
  "font-weight": 400,
1400
- "gap": "0.75rem",
1506
+ "gap": "clamp(1.125rem, 1.0313rem + 0.4688vw, 1.5rem)",
1401
1507
  "inverse-color": "#FFFFFF",
1402
1508
  "line-height": "1.6",
1403
1509
  "list-style-type": "'\\2022'",
@@ -1406,14 +1512,17 @@
1406
1512
  "padding-inline-start": "0.875rem"
1407
1513
  },
1408
1514
  "unordered-list": {
1515
+ "gap": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1409
1516
  "list-style-type": "'\\2013'",
1517
+ "padding-block-end": "0",
1518
+ "padding-block-start": "clamp(0.5625rem, 0.5156rem + 0.2344vw, 0.75rem)",
1410
1519
  "item": {
1411
1520
  "margin-inline-start": "0.875rem",
1412
1521
  "padding-inline-start": "0.875rem"
1413
1522
  }
1414
1523
  },
1415
1524
  "small": {
1416
- "font-size": "clamp(0.964rem, calc(0.295vw + 0.905rem), 1.2rem)",
1525
+ "font-size": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)",
1417
1526
  "line-height": "1.6"
1418
1527
  }
1419
1528
  }