@rijkshuisstijl-community/design-tokens 1.0.0 → 1.1.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 (54) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/_variables.scss +114 -4
  3. package/dist/index.css +114 -4
  4. package/dist/index.d.ts +111 -1
  5. package/dist/index.js +114 -4
  6. package/dist/index.json +113 -3
  7. package/dist/index.tokens.json +149 -3
  8. package/dist/root.css +114 -4
  9. package/dist/tokens.d.ts +147 -1
  10. package/dist/tokens.js +6284 -3880
  11. package/dist/uitvoerend-mintgroen-focus/_variables.scss +724 -610
  12. package/dist/uitvoerend-mintgroen-focus/index.css +724 -610
  13. package/dist/uitvoerend-mintgroen-focus/index.d.ts +612 -498
  14. package/dist/uitvoerend-mintgroen-focus/index.js +613 -499
  15. package/dist/uitvoerend-mintgroen-focus/index.json +612 -498
  16. package/dist/uitvoerend-mintgroen-focus/index.tokens.json +1654 -1506
  17. package/dist/uitvoerend-mintgroen-focus/root.css +724 -610
  18. package/dist/uitvoerend-mintgroen-focus/tokens.d.ts +1573 -1425
  19. package/dist/uitvoerend-mintgroen-focus/tokens.js +22376 -19892
  20. package/dist/uitvoerend-violet/_variables.scss +723 -608
  21. package/dist/uitvoerend-violet/index.css +723 -608
  22. package/dist/uitvoerend-violet/index.d.ts +613 -498
  23. package/dist/uitvoerend-violet/index.js +614 -499
  24. package/dist/uitvoerend-violet/index.json +613 -498
  25. package/dist/uitvoerend-violet/index.tokens.json +1652 -1499
  26. package/dist/uitvoerend-violet/root.css +723 -608
  27. package/dist/uitvoerend-violet/tokens.d.ts +1545 -1392
  28. package/dist/uitvoerend-violet/tokens.js +22572 -20061
  29. package/dist/uitvoerend-violet-oud/_variables.scss +723 -608
  30. package/dist/uitvoerend-violet-oud/index.css +723 -608
  31. package/dist/uitvoerend-violet-oud/index.d.ts +613 -498
  32. package/dist/uitvoerend-violet-oud/index.js +614 -499
  33. package/dist/uitvoerend-violet-oud/index.json +613 -498
  34. package/dist/uitvoerend-violet-oud/index.tokens.json +1645 -1492
  35. package/dist/uitvoerend-violet-oud/root.css +723 -608
  36. package/dist/uitvoerend-violet-oud/tokens.d.ts +1556 -1403
  37. package/dist/uitvoerend-violet-oud/tokens.js +23087 -20576
  38. package/dist/wetgevend/_variables.scss +723 -608
  39. package/dist/wetgevend/index.css +723 -608
  40. package/dist/wetgevend/index.d.ts +613 -498
  41. package/dist/wetgevend/index.js +614 -499
  42. package/dist/wetgevend/index.json +613 -498
  43. package/dist/wetgevend/index.tokens.json +1660 -1507
  44. package/dist/wetgevend/root.css +723 -608
  45. package/dist/wetgevend/tokens.d.ts +1572 -1419
  46. package/dist/wetgevend/tokens.js +23030 -20519
  47. package/figma/figma.tokens.json +571 -46
  48. package/package.json +1 -1
  49. package/src/generated/base.tokens.json +488 -12
  50. package/src/generated/themes.json +17956 -15972
  51. package/src/generated/uitvoerend-mintgroen-focus/tokens.json +4568 -4078
  52. package/src/generated/uitvoerend-violet/tokens.json +4468 -3970
  53. package/src/generated/uitvoerend-violet-oud/tokens.json +4510 -4012
  54. package/src/generated/wetgevend/tokens.json +4478 -3980
package/dist/uitvoerend-mintgroen-focus/index.tokens.json CHANGED
@@ -1,1740 +1,1854 @@
1
1
  {
2
- "rhc": {
3
- "color": {
4
- "primary": {
5
- "50": "#eaf8f4",
6
- "100": "#d6f2e9",
7
- "200": "#C1EBDE",
8
- "300": "#ACE4D3",
9
- "400": "#98DDC8",
10
- "500": "#76d2b6",
11
- "hover": "#528e7c"
12
- },
13
- "focus": {
14
- "outline": "#76d2b6"
15
- },
16
- "foreground": {
17
- "default": "#0F172A",
18
- "subdued": "#334155",
19
- "onEmphasis": "#fff",
20
- "link": "#01689b"
21
- },
22
- "border": {
23
- "default": "#64748B",
24
- "subdued": "#94A3B8",
25
- "strong": "#0F172A"
26
- },
27
- "canvas": "#fff",
28
- "feedback": {
29
- "success": {
30
- "default": "#39870c",
31
- "subdued": "#e1eddb"
2
+ "utrecht": {
3
+ "pre-heading": {
4
+ "color": "#0F172A",
5
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
6
+ "font-weight": 700,
7
+ "line-height": "125%",
8
+ "font-size": "1rem"
9
+ },
10
+ "accordion": {
11
+ "button": {
12
+ "focus": {
13
+ "background-color": "#FDD370",
14
+ "border-color": "#154273",
15
+ "color": "#0F172A"
32
16
  },
33
- "info": {
34
- "default": "#007bc7",
35
- "subdued": "#d9ebf7"
17
+ "gap": "0.5rem",
18
+ "icon": {
19
+ "size": "24px"
36
20
  },
37
- "error": {
38
- "default": "#d52b1e",
39
- "subdued": "#f9dfdd"
21
+ "hover": {
22
+ "background-color": "#F8FAFC",
23
+ "border-color": "#94A3B8",
24
+ "color": "#0F172A"
40
25
  },
41
- "warning": {
42
- "default": "#ffb612",
43
- "subdued": "#fff4db"
26
+ "background-color": "#fff",
27
+ "border-color": "#94A3B8",
28
+ "border-width": 0,
29
+ "color": "#0F172A",
30
+ "active": {
31
+ "background-color": "#F1F5F9",
32
+ "border-color": "#94A3B8",
33
+ "color": "#0F172A",
34
+ "row-gap": 0
44
35
  }
45
36
  },
46
- "accent": {
47
- "500": "#8fcae7"
48
- },
49
- "cool-grey": {
50
- "50": "#F8FAFC",
51
- "100": "#F1F5F9",
52
- "200": "#E2E8F0",
53
- "300": "#CBD5E1",
54
- "400": "#94A3B8",
55
- "500": "#64748B",
56
- "600": "#475569",
57
- "700": "#334155",
58
- "800": "#1E293B",
59
- "900": "#0F172A"
60
- },
61
- "lichtblauw": {
62
- "50": "#eef7fb",
63
- "100": "#ddeff8",
64
- "200": "#CCE7F4",
65
- "300": "#BCDFF0",
66
- "400": "#ABD7ED",
67
- "500": "#8fcae7"
68
- },
69
- "violet": {
70
- "50": "#f2d9e7",
71
- "100": "#e5b3d0",
72
- "200": "#D88CB7",
73
- "300": "#CB66A0",
74
- "400": "#BE4088",
75
- "500": "#a90061"
76
- },
77
- "paars": {
78
- "50": "#e3dce7",
79
- "100": "#c6b9cf",
80
- "200": "#A995B7",
81
- "300": "#8D729F",
82
- "400": "#714f87",
83
- "500": "#42145f"
84
- },
85
- "hemelblauw": {
86
- "50": "#d9ebf7",
87
- "100": "#b3d7ee",
88
- "200": "#8CC3E6",
89
- "300": "#66AFDD",
90
- "400": "#409CD5",
91
- "500": "#007bc7"
92
- },
93
- "donkerblauw": {
94
- "50": "#d9e8f0",
95
- "100": "#b3d2e1",
96
- "200": "#8CBBD2",
97
- "300": "#66A4C3",
98
- "400": "#408EB4",
99
- "500": "#01689b"
100
- },
101
- "mintgroen": {
102
- "50": "#eaf8f4",
103
- "100": "#d6f2e9",
104
- "200": "#C1EBDE",
105
- "300": "#ACE4D3",
106
- "400": "#98DDC8",
107
- "500": "#76d2b6"
108
- },
109
- "mosgroen": {
110
- "50": "#ebebd9",
111
- "100": "#d6d7b3",
112
- "200": "#C1C38C",
113
- "300": "#ADAF66",
114
- "400": "#999C40",
115
- "500": "#777b00"
116
- },
117
- "groen": {
118
- "50": "#e1eddb",
119
- "100": "#c4dbb6",
120
- "200": "#A5C991",
121
- "300": "#88B76D",
122
- "400": "#6AA549",
123
- "500": "#39870c"
124
- },
125
- "donkergroen": {
126
- "50": "#dfe6e1",
127
- "100": "#becdc3",
128
- "200": "#9DB4A4",
129
- "300": "#7D9B87",
130
- "400": "#5D8269",
131
- "500": "#275937"
132
- },
133
- "bruin": {
134
- "50": "#efeada",
135
- "100": "#dfd4b6",
136
- "200": "#CFBF90",
137
- "300": "#BFA96C",
138
- "400": "#AF9447",
139
- "500": "#94710a"
140
- },
141
- "donkerbruin": {
142
- "50": "#e8e0df",
143
- "100": "#d1c2be",
144
- "200": "#BAA39D",
145
- "300": "#A3847D",
146
- "400": "#8D665D",
147
- "500": "#673327"
148
- },
149
- "geel": {
150
- "50": "#fefbdd",
151
- "100": "#fdf6bc",
152
- "200": "#FCF199",
153
- "300": "#FBED78",
154
- "400": "#FAE856",
155
- "500": "#f9e11e"
156
- },
157
- "donkergeel": {
158
- "50": "#fff4db",
159
- "100": "#ffe9b8",
160
- "200": "#FDDE94",
161
- "300": "#FDD370",
162
- "400": "#FDC84D",
163
- "500": "#ffb612"
164
- },
165
- "oranje": {
166
- "50": "#fbead9",
167
- "100": "#f6d4b3",
168
- "200": "#F1BE8C",
169
- "300": "#EDA966",
170
- "400": "#E89440",
171
- "500": "#e17000"
172
- },
173
- "rood": {
174
- "50": "#f9dfdd",
175
- "100": "#f2bfbc",
176
- "200": "#EC9F99",
177
- "300": "#E67F78",
178
- "400": "#DF6056",
179
- "500": "#d52b1e"
180
- },
181
- "roze": {
182
- "50": "#fdeff8",
183
- "100": "#fbdef0",
184
- "200": "#F8CEE8",
185
- "300": "#F6BDE1",
186
- "400": "#F4ADD9",
187
- "500": "#f092cd"
188
- },
189
- "robijnrood": {
190
- "50": "#f7d9e7",
191
- "100": "#efb3ce",
192
- "200": "#E78CB6",
193
- "300": "#DF669D",
194
- "400": "#D74085",
195
- "500": "#ca005d"
196
- },
197
- "lintblauw": {
198
- "50": "#dce3ea",
199
- "100": "#b8c6d5",
200
- "200": "#95a9c0",
201
- "300": "#738eab",
202
- "400": "#4f7196",
203
- "500": "#154273"
204
- },
205
- "wit": "#fff",
206
- "zwart": "#000",
207
- "none": "transparent"
208
- },
209
- "sub-nav-bar": {
210
- "background-color": "#f2f4f6",
211
- "column-gap": "0.5rem",
212
- "column-width": "375px",
213
- "padding-block-end": "2rem",
214
- "padding-block-start": "2rem",
215
- "inline-size": "100%",
216
- "content": {
37
+ "panel": {
38
+ "border-color": "#94A3B8",
39
+ "border-width": 0,
40
+ "padding-block-end": "1.5rem",
41
+ "padding-block-start": "1rem",
217
42
  "padding-inline-end": "1rem",
218
- "padding-inline-start": "1rem",
219
- "max-inline-size": "1280px",
220
- "list": {
221
- "row-gap": "0.5rem"
222
- }
43
+ "padding-inline-start": "1rem"
223
44
  }
224
45
  },
225
- "toggletip": {
226
- "color": "#fff",
227
- "background-color": "#007bc7",
228
- "border-color": "transparent",
46
+ "button": {
47
+ "primary-action": {
48
+ "focus": {
49
+ "background-color": "#FDD370",
50
+ "border-color": "transparent",
51
+ "color": "#fff"
52
+ },
53
+ "hover": {
54
+ "background-color": "#528e7c",
55
+ "border-color": "transparent",
56
+ "color": "#fff"
57
+ },
58
+ "background-color": "#76d2b6",
59
+ "border-color": "transparent",
60
+ "color": "#fff",
61
+ "disabled": {
62
+ "background-color": "#d6f2e9",
63
+ "border-color": "#C1EBDE",
64
+ "color": "#98DDC8"
65
+ },
66
+ "font-weight": 700,
67
+ "active": {
68
+ "background-color": "#477e6d",
69
+ "border-color": "transparent",
70
+ "color": "#fff"
71
+ },
72
+ "font-size": "1.25rem",
73
+ "line-height": "1.875rem"
74
+ },
75
+ "secondary-action": {
76
+ "focus": {
77
+ "background-color": "#FDD370",
78
+ "border-color": "transparent",
79
+ "color": "#76d2b6"
80
+ },
81
+ "hover": {
82
+ "background-color": "#d6f2e9",
83
+ "border-color": "transparent",
84
+ "color": "#76d2b6"
85
+ },
86
+ "background-color": "transparent",
87
+ "border-color": "#76d2b6",
88
+ "color": "#76d2b6",
89
+ "disabled": {
90
+ "background-color": "transparent",
91
+ "border-color": "#ACE4D3",
92
+ "color": "#ACE4D3"
93
+ },
94
+ "font-weight": 700,
95
+ "active": {
96
+ "background-color": "#C1EBDE",
97
+ "border-color": "#76d2b6",
98
+ "color": "#76d2b6"
99
+ },
100
+ "font-size": "1.25rem",
101
+ "line-height": "1.875rem"
102
+ },
103
+ "subtle": {
104
+ "focus": {
105
+ "background-color": "#FDD370",
106
+ "border-color": "transparent",
107
+ "color": "#76d2b6"
108
+ },
109
+ "font-size": "1.25rem",
110
+ "font-weight": 700,
111
+ "hover": {
112
+ "background-color": "transparent",
113
+ "border-color": "transparent",
114
+ "color": "#528e7c"
115
+ },
116
+ "background-color": "transparent",
117
+ "border-color": "transparent",
118
+ "color": "#76d2b6",
119
+ "disabled": {
120
+ "background-color": "transparent",
121
+ "border-color": "transparent",
122
+ "color": "#d6f2e9"
123
+ },
124
+ "active": {
125
+ "background-color": "transparent",
126
+ "border-color": "transparent",
127
+ "color": "#477e6d"
128
+ },
129
+ "line-height": "1.875rem"
130
+ },
131
+ "background-color": "transparent",
132
+ "border-color": "#334155",
133
+ "color": "#334155",
229
134
  "border-radius": "5px",
230
135
  "border-width": "1px",
231
136
  "icon": {
137
+ "gap": "0.5rem",
232
138
  "size": "24px"
233
139
  },
234
- "size": "24px",
235
- "active": {
236
- "color": "#007bc7",
237
- "background-color": "#fff",
238
- "border-color": "#007bc7"
140
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
141
+ "font-size": "1.25rem",
142
+ "font-weight": 700,
143
+ "line-height": "150%",
144
+ "padding-block-end": "0.5rem",
145
+ "padding-block-start": "0.5rem",
146
+ "padding-inline-end": "1rem",
147
+ "padding-inline-start": "1rem",
148
+ "disabled": {
149
+ "background-color": "#F8FAFC",
150
+ "border-color": "transparent",
151
+ "color": "#64748B"
152
+ },
153
+ "focus": {
154
+ "background-color": "#FDDE94",
155
+ "border-color": "transparent",
156
+ "color": "#1E293B"
239
157
  },
240
158
  "hover": {
241
- "color": "#0F172A",
242
- "background-color": "#66AFDD"
159
+ "background-color": "#F8FAFC",
160
+ "border-color": "#1E293B",
161
+ "color": "#1E293B"
243
162
  },
244
- "focus": {
245
- "color": "#fff",
246
- "background-color": "#007bc7"
247
- }
163
+ "active": {
164
+ "background-color": "#CBD5E1",
165
+ "border-color": "#0F172A",
166
+ "color": "#0F172A"
167
+ },
168
+ "min-block-size": "48px",
169
+ "min-inline-size": "48px",
170
+ "column-gap": "0.5rem"
248
171
  },
249
- "sidenav": {
250
- "display": "flex",
251
- "link": {
252
- "line-height": "150%",
253
- "icon": {
254
- "size": "24px",
255
- "margin-inline": "0.5rem"
256
- },
257
- "font-size": "1.25rem",
258
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
259
- "font-weight": 400,
260
- "current": {
261
- "font-weight": 700,
262
- "color": "#0F172A"
263
- },
264
- "color": "#01689b",
265
- "active": {
266
- "color": "#42145f",
267
- "text-decoration": "underline"
268
- },
172
+ "checkbox": {
173
+ "focus": {
174
+ "background-color": "#FDD370",
175
+ "border-color": "#154273",
176
+ "border-width": "2px"
177
+ },
178
+ "checked": {
269
179
  "focus": {
270
- "border-radius": "5px",
180
+ "background-color": "#FDD370",
271
181
  "border-width": "2px",
272
- "border-style": "solid",
273
182
  "border-color": "#154273",
274
- "background-color": "none",
275
- "color": "#01689b",
276
- "text-decoration": "None"
183
+ "color": "#154273"
184
+ },
185
+ "background-color": "#154273",
186
+ "border-color": "transparent",
187
+ "color": "#fff",
188
+ "border-width": "1px",
189
+ "disabled": {
190
+ "background-color": "#CBD5E1",
191
+ "border-color": "#94A3B8",
192
+ "color": "#475569"
277
193
  },
278
194
  "hover": {
279
- "color": "#15496a",
280
- "text-decoration": "underline"
195
+ "border-width": "1px",
196
+ "background-color": "#738eab",
197
+ "border-color": "transparent",
198
+ "color": "#fff"
281
199
  },
282
- "padding-block-start": "0.75rem",
283
- "padding-block-end": "0.75rem",
284
- "text-decoration": "None",
285
- "column-gap": "0.5rem"
286
- }
287
- },
288
- "radio-group": {
289
- "padding-block-end": "0.5rem",
290
- "padding-block-start": "0.5rem",
291
- "row-gap": "1rem"
292
- },
293
- "navigation-list": {
200
+ "active": {
201
+ "border-width": "1px",
202
+ "background-color": "#4f7196",
203
+ "border-color": "transparent",
204
+ "color": "#fff"
205
+ }
206
+ },
207
+ "border-radius": "2.5px",
208
+ "size": "24px",
294
209
  "icon": {
295
- "background-color": "#0F172A",
296
- "border-radius": "999px",
297
- "color": "#fff"
210
+ "size": "24px"
298
211
  },
299
- "item": {
300
- "icon": {
301
- "padding-inline": "0.5rem",
302
- "padding-block": "0.5rem",
303
- "size": "24px"
304
- },
305
- "content": {
306
- "font-size": "1.125rem",
307
- "column-gap": "0.5rem",
308
- "row-gap": "0.25rem"
309
- },
310
- "label": {
311
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
312
- "font-size": "1.875rem",
313
- "font-weight": 700,
314
- "line-height": "150%"
212
+ "background-color": "#fff",
213
+ "border-color": "#154273",
214
+ "invalid": {
215
+ "background-color": "#f9dfdd",
216
+ "border-color": "#d52b1e",
217
+ "border-width": "1px"
218
+ },
219
+ "disabled": {
220
+ "background-color": "#CBD5E1",
221
+ "border-color": "#94A3B8"
222
+ },
223
+ "indeterminate": {
224
+ "background-color": "#154273",
225
+ "border-color": "transparent",
226
+ "color": "#fff",
227
+ "border-width": "1px",
228
+ "disabled": {
229
+ "background-color": "#CBD5E1",
230
+ "border-color": "#94A3B8",
231
+ "color": "#475569"
315
232
  },
316
233
  "active": {
317
- "background-color": "#F1F5F9"
234
+ "background-color": "#4f7196",
235
+ "border-color": "transparent",
236
+ "color": "#fff",
237
+ "border-width": "1px"
318
238
  },
319
239
  "hover": {
320
- "background-color": "#F8FAFC"
240
+ "background-color": "#738eab",
241
+ "border-color": "transparent",
242
+ "color": "#fff",
243
+ "border-width": "1px"
321
244
  },
322
245
  "focus": {
323
- "background-color": "#dce3ea"
324
- },
246
+ "background-color": "#fff",
247
+ "border-color": "#154273",
248
+ "color": "#154273",
249
+ "border-width": "2px"
250
+ }
251
+ },
252
+ "border-width": "1px",
253
+ "hover": {
254
+ "border-width": "1px",
325
255
  "background-color": "#fff",
326
- "color": "#334155",
256
+ "border-color": "#738eab"
257
+ },
258
+ "active": {
327
259
  "border-width": "1px",
328
- "border-color": "#CBD5E1",
329
- "heading": {
330
- "color": "#0F172A"
331
- },
332
- "column-gap": "1rem",
333
- "min-height": "48px",
334
- "padding-block": "0.75rem",
335
- "padding-inline": "1rem"
260
+ "background-color": "#fff",
261
+ "border-color": "#4f7196"
336
262
  }
337
263
  },
338
- "nav-bar": {
339
- "border-block-end-width": "1px",
340
- "max-inline-size": "1280px",
341
- "padding-inline": "1rem",
342
- "container": {
343
- "inline-size": "100%"
264
+ "radio-button": {
265
+ "focus": {
266
+ "background-color": "#FDD370",
267
+ "border-color": "#154273",
268
+ "border-width": "2px"
269
+ },
270
+ "checked": {
271
+ "focus": {
272
+ "background-color": "#FDD370",
273
+ "border-color": "#154273",
274
+ "color": "#154273",
275
+ "border-width": "2px"
276
+ },
277
+ "background-color": "#154273",
278
+ "border-color": "transparent",
279
+ "color": "#fff",
280
+ "hover": {
281
+ "background-color": "#738eab",
282
+ "border-color": "transparent",
283
+ "color": "#fff",
284
+ "border-width": "1px"
285
+ },
286
+ "active": {
287
+ "background-color": "#4f7196",
288
+ "border-color": "transparent",
289
+ "color": "#fff",
290
+ "border-width": "1px"
291
+ },
292
+ "disabled": {
293
+ "background-color": "#CBD5E1",
294
+ "border-color": "#94A3B8",
295
+ "color": "#475569"
296
+ },
297
+ "border-width": "1px"
298
+ },
299
+ "active": {
300
+ "border-width": "1px",
301
+ "background-color": "#fff",
302
+ "border-color": "#4f7196"
303
+ },
304
+ "size": "24px",
305
+ "dot": {
306
+ "size": "12px"
307
+ },
308
+ "background-color": "#fff",
309
+ "border-color": "#154273",
310
+ "invalid": {
311
+ "background-color": "#f9dfdd",
312
+ "border-color": "#d52b1e",
313
+ "border-width": "1px"
314
+ },
315
+ "disabled": {
316
+ "background-color": "#CBD5E1",
317
+ "border-color": "#94A3B8",
318
+ "color": "#475569"
319
+ },
320
+ "hover": {
321
+ "background-color": "#fff",
322
+ "border-color": "#738eab",
323
+ "border-width": "1px"
324
+ },
325
+ "border-radius": "999px",
326
+ "border-width": "1px"
327
+ },
328
+ "link": {
329
+ "focus": {
330
+ "background-color": "#FDD370",
331
+ "color": "#01689b",
332
+ "text-decoration": "None",
333
+ "text-decoration-thickness": "auto"
344
334
  },
345
- "content": {
346
- "column-gap": "1rem"
335
+ "color": "#01689b",
336
+ "text-decoration-color": "#01689b",
337
+ "active": {
338
+ "color": "#42145f",
339
+ "text-decoration": "None"
340
+ },
341
+ "hover": {
342
+ "color": "#01496c",
343
+ "text-decoration": "None",
344
+ "text-decoration-thickness": "auto"
345
+ },
346
+ "visited": {
347
+ "color": "#42145f"
347
348
  },
349
+ "text-decoration": "underline",
348
350
  "icon": {
351
+ "inset-block-start": "0.25rem",
352
+ "size": "24px"
353
+ },
354
+ "column-gap": "0.25rem",
355
+ "text-decoration-thickness": "auto",
356
+ "text-underline-offset": "0.125rem",
357
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
358
+ "font-weight": 400,
359
+ "font-size": "1.25rem",
360
+ "line-height": "150%"
361
+ },
362
+ "select": {
363
+ "focus": {
364
+ "background-color": "#FDD370",
365
+ "border-color": "#154273",
349
366
  "color": "#0F172A",
350
- "active": {
351
- "color": "#fff"
352
- },
367
+ "border-width": "2px"
368
+ },
369
+ "image-background-position": "right 0.5rem center",
370
+ "icon": {
353
371
  "size": "24px"
354
372
  },
355
- "link": {
356
- "active": {
357
- "background-color": "#76d2b6",
358
- "color": "#fff"
359
- },
373
+ "background-color": "#fff",
374
+ "border-color": "#154273",
375
+ "color": "#0F172A",
376
+ "invalid": {
377
+ "background-color": "#f9dfdd",
378
+ "border-color": "#d52b1e",
379
+ "color": "#0F172A",
380
+ "border-width": "1px"
381
+ },
382
+ "disabled": {
383
+ "background-color": "#CBD5E1",
384
+ "border-color": "#94A3B8",
385
+ "color": "#475569"
386
+ },
387
+ "hover": {
360
388
  "background-color": "#fff",
361
- "color": "#76d2b6",
362
- "focus": {
363
- "background-color": "#eaf8f4",
364
- "color": "#76d2b6"
365
- },
366
- "hover": {
367
- "background-color": "#F8FAFC",
368
- "color": "#76d2b6"
369
- },
370
- "padding-block-end": "1rem",
371
- "padding-block-start": "1rem",
372
- "padding-inline-end": "0.75rem",
373
- "padding-inline-start": "0.75rem",
374
- "column-gap": "0.5rem"
389
+ "border-color": "#738eab",
390
+ "color": "#0F172A",
391
+ "border-width": "1px"
375
392
  },
376
- "heading": {
377
- "font-weight": 700
393
+ "padding-block-end": "0.5rem",
394
+ "padding-block-start": "0.5rem",
395
+ "padding-inline-end": "0.75rem",
396
+ "padding-inline-start": "0.75rem",
397
+ "border-radius": "2.5px",
398
+ "border-bottom-width": "auto",
399
+ "border-width": "1px",
400
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
401
+ "font-weight": 400,
402
+ "line-height": "150%",
403
+ "font-size": "1.25rem",
404
+ "max-inline-size": "400px"
405
+ },
406
+ "textarea": {
407
+ "focus": {
408
+ "background-color": "#FDD370",
409
+ "border-color": "#154273",
410
+ "color": "#0F172A",
411
+ "border-width": "2px"
378
412
  },
413
+ "max-inline-size": "400px",
414
+ "padding-block-end": "0.5rem",
415
+ "padding-block-start": "0.5rem",
416
+ "padding-inline-end": "0.75rem",
417
+ "padding-inline-start": "0.75rem",
379
418
  "background-color": "#fff",
380
- "color": "#76d2b6",
381
- "border-color": "#98DDC8"
382
- },
383
- "message-list": {
384
- "item": {
419
+ "border-color": "#154273",
420
+ "color": "#0F172A",
421
+ "invalid": {
422
+ "background-color": "#f9dfdd",
423
+ "border-color": "#d52b1e",
424
+ "color": "#0F172A",
425
+ "border-width": "1px"
426
+ },
427
+ "placeholder": {
428
+ "color": "#64748B"
429
+ },
430
+ "disabled": {
431
+ "background-color": "#CBD5E1",
432
+ "border-color": "#94A3B8",
433
+ "color": "#475569"
434
+ },
435
+ "read-only": {
436
+ "background-color": "#F1F5F9",
437
+ "border-color": "transparent",
438
+ "color": "#0F172A"
439
+ },
440
+ "hover": {
385
441
  "background-color": "#fff",
386
- "border-color": "#CBD5E1",
442
+ "border-color": "#738eab",
443
+ "color": "#0F172A",
444
+ "border-width": "1px"
445
+ },
446
+ "border-radius": "2.5px",
447
+ "border-bottom-width": "1px",
448
+ "border-width": "1px",
449
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
450
+ "font-weight": 400,
451
+ "line-height": "150%",
452
+ "font-size": "1.25rem"
453
+ },
454
+ "textbox": {
455
+ "focus": {
456
+ "background-color": "#FDD370",
457
+ "border-width": "2px",
458
+ "border-color": "#154273",
459
+ "color": "#0F172A"
460
+ },
461
+ "border-radius": "2.5px",
462
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
463
+ "font-size": "1.25rem",
464
+ "font-weight": 400,
465
+ "line-height": "150%",
466
+ "max-inline-size": "400px",
467
+ "padding-block-end": "0.5rem",
468
+ "padding-block-start": "0.5rem",
469
+ "padding-inline-end": "0.75rem",
470
+ "padding-inline-start": "0.75rem",
471
+ "background-color": "#fff",
472
+ "border-color": "#154273",
473
+ "color": "#0F172A",
474
+ "invalid": {
475
+ "background-color": "#f9dfdd",
476
+ "border-color": "#d52b1e",
477
+ "color": "#0F172A",
478
+ "border-width": "1px"
479
+ },
480
+ "placeholder": {
481
+ "color": "#64748B"
482
+ },
483
+ "border-block-end-width": "auto",
484
+ "border-width": "1px",
485
+ "disabled": {
486
+ "background-color": "#CBD5E1",
487
+ "border-color": "#94A3B8",
488
+ "color": "#475569"
489
+ },
490
+ "read-only": {
491
+ "background-color": "#F1F5F9",
492
+ "border-color": "transparent",
493
+ "color": "#0F172A"
494
+ },
495
+ "hover": {
387
496
  "border-width": "1px",
388
- "color": "#334155",
389
- "column-gap": "1rem",
390
- "icon": {
391
- "size": "24px",
392
- "color": "#0F172A"
393
- },
394
- "min-height": "48px",
395
- "padding-block": "0.75rem",
396
- "padding-inline": "1rem",
397
- "content": {
398
- "font-size": "1.125rem",
399
- "column-gap": "0.5rem",
400
- "row-gap": "0.5rem"
401
- },
402
- "label": {
403
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
404
- "font-size": "1.25rem",
405
- "font-weight": 700,
406
- "line-height": "150%"
407
- },
408
- "heading": {
409
- "color": "#0F172A"
410
- }
497
+ "background-color": "#fff",
498
+ "border-color": "#738eab",
499
+ "color": "#0F172A"
411
500
  }
412
501
  },
413
- "logo": {
414
- "image": {
415
- "background-color": "#fff",
416
- "inline-size": "48px",
417
- "block-size": "96px",
418
- "color": "#154273"
502
+ "counter-badge": {
503
+ "background-color": "#FDD370"
504
+ },
505
+ "skip-link": {
506
+ "focus": {
507
+ "background-color": "#FDD370",
508
+ "border-color": "#154273",
509
+ "border-style": "solid",
510
+ "border-width": "2px",
511
+ "color": "#0F172A",
512
+ "text-decoration": "None"
419
513
  },
420
- "title": {
421
- "font-weight": 600,
422
- "line-height": "1.063rem",
423
- "font-size": "0.913rem",
424
- "padding-block-start": "3.125rem"
514
+ "font-weight": 700,
515
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
516
+ "font-size": "1.25rem",
517
+ "line-height": "150%",
518
+ "min-block-size": "48px",
519
+ "min-inline-size": "48px",
520
+ "padding-block-end": "0.75rem",
521
+ "padding-block-start": "0.75rem",
522
+ "padding-inline-end": "1rem",
523
+ "padding-inline-start": "1rem",
524
+ "focus-visible": {
525
+ "outline-color": "#000"
425
526
  },
426
- "subtitle": {
427
- "font-weight": 400,
428
- "line-height": "1rem",
429
- "font-size": "0.775rem"
527
+ "background-color": "#154273",
528
+ "border-color": "transparent",
529
+ "color": "#fff",
530
+ "border-width": "2px",
531
+ "box-block-end-shadow": {
532
+ "offset-x": 0,
533
+ "offset-y": "16px",
534
+ "blur-radius": "48px",
535
+ "spread-radius": 0,
536
+ "color": "#0000001a"
430
537
  },
431
- "column-gap": "12px",
432
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
433
- "color": "#154273"
434
- },
435
- "link-list-card": {
436
- "background-color": "#fff",
437
- "padding-block-start": "1.5rem",
438
- "padding-block-end": "1.5rem",
439
- "row-gap": "1rem",
440
- "padding-inline-start": "1.5rem",
441
- "padding-inline-end": "1.5rem"
538
+ "text-decoration": "underline",
539
+ "text-underline-offset": "0.125rem"
442
540
  },
443
- "link-list": {
444
- "text-decoration": "None"
541
+ "icon": {
542
+ "color": "inherit",
543
+ "size": "24px",
544
+ "inset-block-start": 0
445
545
  },
446
- "icon-only-button": {
447
- "padding-block-end": "0.75rem",
448
- "padding-block-start": "0.75rem",
449
- "padding-inline-end": "0.75rem",
450
- "padding-inline-start": "0.75rem"
546
+ "unordered-list": {
547
+ "padding-inline-start": "1.5rem",
548
+ "margin-block-end": "0.25rem",
549
+ "margin-block-start": "0.25rem",
550
+ "color": "#0F172A",
551
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
552
+ "font-weight": 400,
553
+ "font-size": "1.25rem",
554
+ "line-height": "150%",
555
+ "item": {
556
+ "padding-inline-start": "0.5rem",
557
+ "margin-block-end": "0.25rem",
558
+ "margin-block-start": "0.25rem"
559
+ },
560
+ "marker": {
561
+ "color": "#0F172A",
562
+ "border-color": "#0F172A"
563
+ }
451
564
  },
452
- "hero": {
453
- "heading": {
565
+ "table": {
566
+ "header-cell": {
567
+ "line-height": "150%",
568
+ "color": "#0F172A",
569
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
454
570
  "font-weight": 700,
455
- "line-height": "125%",
456
- "font-size": "1.875rem",
457
- "font-family": "Fira Sans, Arial, Verdana, sans-serif"
571
+ "font-size": "1.25rem"
458
572
  },
459
- "sub-heading": {
460
- "font-weight": 400,
461
- "line-height": "150%",
462
- "font-size": "1.25rem",
463
- "font-family": "Fira Sans, Arial, Verdana, sans-serif"
573
+ "caption": {
574
+ "line-height": "125%",
575
+ "margin-block-end": "1.5rem",
576
+ "color": "#0F172A",
577
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
578
+ "font-weight": 700,
579
+ "font-size": "1.875rem"
464
580
  },
465
- "message": {
466
- "background-color": "#154273",
467
- "color": "#fff",
468
- "row-gap": "0.125rem",
469
- "padding-block-end": "1rem",
581
+ "cell": {
582
+ "padding-block-end": "0.75rem",
583
+ "padding-block-start": "0.75rem",
470
584
  "padding-inline-end": "1rem",
471
585
  "padding-inline-start": "1rem",
472
- "padding-block-start": "1rem",
473
- "border-radius": "20px",
474
- "inline-size": "90%"
586
+ "line-height": "150%"
475
587
  },
476
- "border-radius": "40px",
477
- "inline-size": "100%"
478
- },
479
- "form-field-radio-option": {
480
- "column-gap": "0.5rem",
481
- "font-weight": 400,
482
- "row-gap": "0.5rem",
483
- "label": {
484
- "margin-block-end": 0
588
+ "data-cell": {
589
+ "color": "#0F172A",
590
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
591
+ "font-weight": 400,
592
+ "line-height": "150%",
593
+ "font-size": "1.25rem"
485
594
  },
486
- "input": {
487
- "margin": {
488
- "block-start": "0.25rem"
489
- }
490
- }
491
- },
492
- "form-field-checkbox-option": {
493
- "column-gap": "0.5rem",
494
- "margin-block-end": 0
495
- },
496
- "page-footer": {
497
- "column-gap": "1.5rem",
498
- "column-width": "200px",
499
- "column": {
500
- "title": {
501
- "margin-block-end": "0.75rem"
502
- }
595
+ "header": {
596
+ "border-block-end-width": "2px",
597
+ "border-block-end-color": "#CBD5E1",
598
+ "background-color": "transparent"
503
599
  },
504
- "content": {
505
- "max-inline-size": "1280px",
506
- "padding-inline-start": "1rem",
507
- "padding-inline-end": "1rem",
508
- "column-gap": "2rem"
600
+ "footer": {
601
+ "border-block-end-width": "1px",
602
+ "border-block-end-color": "#CBD5E1",
603
+ "background-color": "transparent"
509
604
  },
510
- "border": {
511
- "block-start": {
512
- "width": "2px",
513
- "color": "#738eab",
514
- "style": "solid"
515
- }
605
+ "row": {
606
+ "border-block-end-width": "1px",
607
+ "border-block-end-color": "#CBD5E1",
608
+ "background-color": "transparent"
516
609
  },
517
- "outlined": {
518
- "background-color": "#fff",
519
- "color": "#76d2b6",
520
- "border": {
521
- "color": "#76d2b6"
522
- }
610
+ "footer-cell": {
611
+ "font-weight": 700,
612
+ "font-size": "1.25rem",
613
+ "color": "#0F172A",
614
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
615
+ "line-height": "150%"
523
616
  },
524
- "padding": {
525
- "block-start": "2.5rem",
526
- "block-end": "2.5rem",
527
- "inline-start": "2.5rem",
528
- "inline-end": "2.5rem"
617
+ "container": {
618
+ "box-inline-end-shadow": {
619
+ "x": 0,
620
+ "y": "16px",
621
+ "blur": "48px",
622
+ "spread": 0,
623
+ "color": "#0000001a"
624
+ },
625
+ "box-inline-start-shadow": {
626
+ "x": 0,
627
+ "y": "16px",
628
+ "blur": "48px",
629
+ "spread": 0,
630
+ "color": "#0000001a"
631
+ }
529
632
  },
530
- "flex": {
531
- "direction": "column"
532
- }
633
+ "font-size": "1.25rem"
533
634
  },
534
- "file-input": {
535
- "column-gap": "0.75rem",
536
- "row-gap": "0.75rem",
537
- "feedback": {
538
- "color": "#475569",
539
- "font-size": "1rem"
635
+ "separator": {
636
+ "color": "#CBD5E1",
637
+ "block-size": "2px",
638
+ "margin-block-end": "0.75rem",
639
+ "margin-block-start": "0.75rem"
640
+ },
641
+ "paragraph": {
642
+ "color": "#0F172A",
643
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
644
+ "font-size": "1.25rem",
645
+ "font-weight": 400,
646
+ "line-height": "150%",
647
+ "margin-block-end": 0,
648
+ "margin-block-start": 0,
649
+ "lead": {
650
+ "color": "#0F172A",
651
+ "font-size": "1.5rem",
652
+ "font-weight": 400,
653
+ "line-height": "150%"
540
654
  }
541
655
  },
542
- "file": {
543
- "border-style": "solid",
544
- "border-color": "#154273",
545
- "border-width": "1px",
546
- "border-radius": "5px",
547
- "padding-inline-start": "1rem",
548
- "padding-inline-end": "1rem",
549
- "padding-block-start": "0.75rem",
550
- "padding-block-end": "0.75rem",
551
- "column-gap": "0.25rem",
552
- "error": {
553
- "border-color": "#d52b1e"
656
+ "ordered-list": {
657
+ "padding-inline-start": "1.5rem",
658
+ "margin-block-end": "0.25rem",
659
+ "margin-block-start": "0.25rem",
660
+ "margin-inline-start": "0.625rem",
661
+ "item": {
662
+ "padding-inline-start": 0,
663
+ "margin-block-end": "0.25rem",
664
+ "margin-block-start": "0.25rem"
554
665
  },
555
- "subtitle": {
556
- "color": "#64748B"
666
+ "color": "#0F172A",
667
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
668
+ "font-weight": 400,
669
+ "font-size": "1.25rem",
670
+ "line-height": "150%"
671
+ },
672
+ "link-list": {
673
+ "margin-block-start": 0,
674
+ "row-gap": "0.5rem",
675
+ "margin-block-end": 0,
676
+ "item": {
677
+ "column-gap": "0.5rem",
678
+ "text-decoration": "None"
679
+ },
680
+ "icon": {
681
+ "size": "24px",
682
+ "inset-block-start": "0.188rem"
557
683
  }
558
684
  },
559
- "dot-badge": {
560
- "border-radius": "999px",
561
- "color": "#d52b1e",
562
- "size": "12px"
685
+ "heading-1": {
686
+ "color": "#154273",
687
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
688
+ "font-weight": 700,
689
+ "line-height": "125%",
690
+ "font-size": "3.125rem",
691
+ "margin-block-end": 0,
692
+ "margin-block-start": 0
693
+ },
694
+ "heading-2": {
695
+ "color": "#154273",
696
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
697
+ "font-weight": 700,
698
+ "line-height": "125%",
699
+ "font-size": "2.5rem",
700
+ "margin-block-end": 0,
701
+ "margin-block-start": 0
563
702
  },
564
- "code-input": {
565
- "size": "48px"
703
+ "heading-3": {
704
+ "color": "#154273",
705
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
706
+ "font-weight": 700,
707
+ "line-height": "125%",
708
+ "font-size": "1.875rem",
709
+ "margin-block-end": 0,
710
+ "margin-block-start": 0
566
711
  },
567
- "code-input-group": {
568
- "column-gap": "0.5rem"
712
+ "heading-4": {
713
+ "color": "#154273",
714
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
715
+ "font-weight": 700,
716
+ "line-height": "125%",
717
+ "font-size": "1.5rem",
718
+ "margin-block-end": 0,
719
+ "margin-block-start": 0
569
720
  },
570
- "checkbox-group": {
571
- "padding-block-end": "0.5rem",
572
- "padding-block-start": "0.5rem",
573
- "row-gap": "1rem"
721
+ "heading-5": {
722
+ "color": "#154273",
723
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
724
+ "font-weight": 700,
725
+ "line-height": "125%",
726
+ "font-size": "1.25rem",
727
+ "margin-block-end": 0,
728
+ "margin-block-start": 0
574
729
  },
575
- "card-as-link": {
576
- "background-color": "#fff",
577
- "border-color": "#CBD5E1",
578
- "border-radius": "5px",
579
- "border-width": "1px",
730
+ "form-label": {
580
731
  "color": "#0F172A",
581
- "column-gap": "1rem",
582
- "inline-size": "328px",
732
+ "font-size": "1.25rem",
733
+ "font-weight": 700
734
+ },
735
+ "form-field-label": {
736
+ "color": "#0F172A",
737
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
738
+ "font-size": "1.25rem",
739
+ "font-weight": 700,
740
+ "line-height": "150%"
741
+ },
742
+ "form-field-error-message": {
583
743
  "icon": {
584
- "color": "#0F172A",
585
- "size": "24px"
586
- },
587
- "link": {
588
- "color": "#01689b",
589
- "text-decoration": "underline",
590
- "active": {
591
- "text-decoration": "none"
592
- },
593
- "hover": {
594
- "text-decoration": "none"
595
- },
596
- "focus": {
597
- "text-decoration": "none"
598
- }
599
- },
600
- "metadata": {
601
- "color": "#0F172A"
602
- },
603
- "padding-block-end": "1rem",
604
- "padding-block-start": "1rem",
605
- "padding-inline-end": "1rem",
606
- "padding-inline-start": "1rem",
607
- "row-gap": "0.75rem",
608
- "active": {
609
- "background-color": "#F1F5F9",
610
- "text-decoration": "underline"
611
- },
612
- "hover": {
613
- "background-color": "#F8FAFC",
614
- "text-decoration": "underline"
744
+ "size": "24px",
745
+ "margin-inline-end": "0.5rem"
615
746
  },
616
- "focus": {
617
- "background-color": "#dce3ea",
618
- "text-decoration": "underline"
747
+ "color": "#d52b1e",
748
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
749
+ "font-size": "1.25rem",
750
+ "font-weight": 400,
751
+ "margin-block-end": "0.5rem",
752
+ "padding-block-end": "0.5rem"
753
+ },
754
+ "form-field-description": {
755
+ "color": "#334155",
756
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
757
+ "font-size": "1.25rem",
758
+ "line-height": "150%",
759
+ "margin-block-start": "-0.5rem",
760
+ "margin-block-end": "0.5rem",
761
+ "padding-block-end": "0.5rem"
762
+ },
763
+ "form-field": {
764
+ "margin-block-start": "0.5rem",
765
+ "margin-block-end": "0.5rem",
766
+ "invalid": {
767
+ "border-inline-start-color": "#d52b1e",
768
+ "border-inline-start-width": "0px",
769
+ "padding-inline-start": 0
619
770
  },
620
- "full-bleed": {
621
- "background-color": "#000",
622
- "border-color": "transparent",
623
- "color": "#fff",
624
- "opacity": 0.5
771
+ "label": {
772
+ "margin-block-end": "0.5rem"
625
773
  },
626
- "heading": {
774
+ "error-message": {
775
+ "line-height": "normal"
776
+ }
777
+ },
778
+ "page-footer": {
779
+ "background-color": "#154273",
780
+ "color": "#fff",
781
+ "padding-block-start": "3rem",
782
+ "padding-block-end": "3rem",
783
+ "padding-inline-start": "80px",
784
+ "padding-inline-end": "80px"
785
+ },
786
+ "figure": {
787
+ "caption": {
788
+ "border-color": "#CBD5E1",
789
+ "border-width": "4px",
790
+ "color": "#76d2b6",
791
+ "padding-block-end": "0.5rem",
627
792
  "padding-block-start": "0.5rem",
628
- "font-size": "1.5rem",
629
- "font-weight": 700
630
- },
631
- "horizontal": {
632
- "background-color": "#154273",
633
- "border-color": "transparent",
634
- "color": "#fff",
635
- "max-block-size": "96px",
636
- "padding-block-end": 0,
637
- "padding-block-start": 0,
638
- "padding-inline-end": "1rem",
639
793
  "padding-inline-start": "1rem",
640
- "heading": {
641
- "inline-size": "200px"
642
- }
794
+ "line-height": "150%",
795
+ "font-size": "1.25rem"
796
+ },
797
+ "img": {
798
+ "border-end-end-radius": 0,
799
+ "border-end-start-radius": 0,
800
+ "border-start-end-radius": 0,
801
+ "border-start-start-radius": 0
643
802
  }
644
803
  },
645
- "accordion": {
646
- "button": {
804
+ "form-fieldset": {
805
+ "legend": {
806
+ "color": "#0F172A",
647
807
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
648
808
  "font-size": "1.25rem",
649
- "font-weight": 400,
809
+ "font-weight": 700,
650
810
  "line-height": "150%",
651
- "icon": {
652
- "margin-block": "0.25rem"
653
- },
654
- "padding-block-end": "0.75rem",
655
- "padding-block-start": "0.75rem",
656
- "padding-inline-end": "1rem",
657
- "padding-inline-start": "1rem",
658
- "expanded": {
659
- "background-color": "#fff",
660
- "color": "#0F172A"
811
+ "disabled": {
812
+ "color": "#334155"
661
813
  }
662
814
  },
663
815
  "section": {
664
- "border-block-end-width": "1px",
665
- "border-width": 0,
666
- "border-color": "#94A3B8"
667
- },
668
- "header": {
669
- "margin": 0
816
+ "background-color": "transparent",
817
+ "color": "#0F172A"
670
818
  },
671
- "border-radius": "0px",
672
- "color": "#0F172A"
819
+ "invalid": {
820
+ "border-inline-start": {
821
+ "color": "#d52b1e"
822
+ },
823
+ "padding-inline-start": 0,
824
+ "border-inline-start-width": "0px"
825
+ }
673
826
  },
674
- "keep": {
675
- "top-left": {
676
- "borderRadiusTopLeft": "48px",
677
- "borderRadiusTopRight": 0,
678
- "borderRadiusBottomRight": 0,
679
- "borderRadiusBottomLeft": 0
680
- },
681
- "top-right": {
682
- "borderRadiusTopRight": "48px",
683
- "borderRadiusTopLeft": 0,
684
- "borderRadiusBottomRight": 0,
685
- "borderRadiusBottomLeft": 0
827
+ "number-badge": {
828
+ "font-size": "1.25rem",
829
+ "line-height": "150%",
830
+ "min-block-size": "24px",
831
+ "min-inline-size": "24px",
832
+ "font-weight": 700,
833
+ "border-width": "0px",
834
+ "border-radius": "999px",
835
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
836
+ "background-color": "#154273",
837
+ "border-color": "transparent",
838
+ "color": "#fff",
839
+ "padding-inline": "0.5rem",
840
+ "padding-block": "0.5rem"
841
+ },
842
+ "button-group": {
843
+ "background-color": "transparent",
844
+ "column-gap": "0.5rem",
845
+ "margin-block-end": "0px",
846
+ "margin-block-start": "0px",
847
+ "padding-block-end": "0px",
848
+ "padding-block-start": "0px",
849
+ "row-gap": "0.5rem"
850
+ },
851
+ "breadcrumb-nav": {
852
+ "line-height": 1.4,
853
+ "font-size": "1.25rem",
854
+ "link": {
855
+ "icon": {
856
+ "size": "24px",
857
+ "margin-inline": "0.25rem",
858
+ "inset-block-start": 0
859
+ },
860
+ "padding-block-end": "0.75rem",
861
+ "padding-block-start": "0.75rem",
862
+ "padding-inline-end": 0,
863
+ "padding-inline-start": 0,
864
+ "color": "#01689b",
865
+ "active": {
866
+ "color": "#42145f",
867
+ "text-decoration": "None"
868
+ },
869
+ "focus": {
870
+ "background-color": "transparent",
871
+ "color": "#01689b",
872
+ "text-decoration": "None"
873
+ },
874
+ "hover": {
875
+ "color": "#01496c",
876
+ "text-decoration": "None"
877
+ },
878
+ "current": {
879
+ "color": "#334155"
880
+ },
881
+ "text-decoration": "underline"
686
882
  },
687
- "bottom-right": {
688
- "borderRadiusTopLeft": 0,
689
- "borderRadiusTopRight": 0,
690
- "borderRadiusBottomRight": "48px",
691
- "borderRadiusBottomLeft": 0
883
+ "divider": {
884
+ "size": "24px",
885
+ "color": "#334155",
886
+ "inset-block-start": 0
692
887
  },
693
- "bottom-left": {
694
- "borderRadiusTopLeft": 0,
695
- "borderRadiusTopRight": 0,
696
- "borderRadiusBottomRight": 0,
697
- "borderRadiusBottomLeft": "48px"
698
- }
699
- },
700
- "border-radius": {
701
- "sm": "2.5px",
702
- "md": "5px",
703
- "keep": "48px",
704
- "circle": "999px",
705
- "none": "0px"
706
- },
707
- "focus": {
708
- "outline-offset": "0.125rem",
709
- "outline-style": "solid",
710
- "outline-width": "2px"
888
+ "margin-inline": "0.5rem",
889
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
890
+ "font-weight": 400
711
891
  },
712
- "font-size": {
713
- "heading": {
714
- "level-1": "3.125rem",
715
- "level-2": "2.5rem",
716
- "level-3": "1.875rem",
717
- "level-4": "1.5rem",
718
- "level-5": "1.25rem"
719
- },
720
- "paragraph": {
721
- "intro": "1.5rem",
722
- "default": "1.25rem",
723
- "small": "1.125rem"
892
+ "blockquote": {
893
+ "caption": {
894
+ "font-size": "1.25rem",
895
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
896
+ "line-height": "150%",
897
+ "font-weight": 400,
898
+ "padding-block-start": "0.75rem",
899
+ "color": "#334155"
724
900
  },
725
- "xs": {
726
- "desktop": "1.25rem",
727
- "tablet": "1.125rem",
728
- "mobile": "1rem"
901
+ "content": {
902
+ "font-family": "RijksoverheidSerifWeb, 'Times New Roman', serif",
903
+ "line-height": "150%",
904
+ "font-weight": 400,
905
+ "font-size": "1.5rem",
906
+ "color": "#0F172A"
729
907
  },
730
- "sm": {
731
- "desktop": "1.5rem",
732
- "tablet": "1.35rem",
733
- "mobile": "1.2rem"
908
+ "margin-block-end": 0,
909
+ "margin-block-start": 0,
910
+ "margin-inline-end": 0,
911
+ "margin-inline-start": 0,
912
+ "padding-block-end": "2rem",
913
+ "padding-block-start": "2rem",
914
+ "padding-inline-end": "2rem",
915
+ "padding-inline-start": "2rem",
916
+ "row-gap": "0.75rem",
917
+ "background-color": "transparent",
918
+ "border-color": "#76d2b6",
919
+ "border-block-start-width": 0,
920
+ "border-block-end-width": 0,
921
+ "border-inline-start-width": 0,
922
+ "border-inline-end-width": 0,
923
+ "border-start-start-radius": 0,
924
+ "border-start-end-radius": 0,
925
+ "border-end-start-radius": 0,
926
+ "border-end-end-radius": 0,
927
+ "border-width": "2px",
928
+ "blue-corner-border-variation": {
929
+ "border-color": "#76d2b6",
930
+ "border-block-end-width": "2px",
931
+ "border-inline-end-width": "2px",
932
+ "border-end-end-radius": "3rem"
734
933
  },
735
- "md": {
736
- "desktop": "1.875rem",
737
- "tablet": "1.688rem",
738
- "mobile": "1.5rem"
934
+ "pink-background-variation": {
935
+ "background-color": "#F6BDE1",
936
+ "border-end-start-radius": "3rem",
937
+ "padding": "2.5rem"
739
938
  },
740
- "lg": {
741
- "desktop": "2.5rem",
742
- "tablet": "2.25rem",
743
- "mobile": "2rem"
939
+ "pink-left-border-variation": {
940
+ "border-color": "#F6BDE1",
941
+ "border-inline-start-width": "0.75rem",
942
+ "padding-inline-start": "2.5rem",
943
+ "padding-inline-end": "2.5rem",
944
+ "padding-block-start": "1.5rem",
945
+ "padding-block-end": "1.5rem"
744
946
  },
745
- "xl": {
746
- "desktop": "3.125rem",
747
- "tablet": "2.813rem",
748
- "mobile": "2.5rem"
947
+ "pink-corner-border-variation": {
948
+ "border-color": "#F6BDE1",
949
+ "border-block-start-width": "0.25rem",
950
+ "border-inline-start-width": "0.25rem",
951
+ "border-start-start-radius": "3rem",
952
+ "padding": "2.5rem"
749
953
  }
750
954
  },
751
- "line-height": {
752
- "paragraph": "150%",
753
- "sm": "125%",
754
- "md": "150%"
955
+ "article": {
956
+ "max-inline-size": "75ch"
755
957
  },
756
- "size": {
757
- "target": "48px",
758
- "icon": {
759
- "functional": "24px"
958
+ "alert": {
959
+ "heading": {
960
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
961
+ "font-weight": 700,
962
+ "line-height": "150%",
963
+ "font-size": "1.25rem"
760
964
  },
761
- "quarter-lint": "12px",
762
- "half-lint": "24px",
763
- "lint": "48px",
764
- "2-lint": "96px",
765
- "3-lint": "1440px"
766
- },
767
- "font-weight": {
768
- "extra-bold": 800,
769
- "bold": 700,
770
- "semi-bold": 550,
771
- "regular": 400,
772
- "chosen-regular": 400,
773
- "light": 300,
774
- "thin": 200
775
- },
776
- "font-family": {
777
- "primary": "Fira Sans, Arial, Verdana, sans-serif",
778
- "secondary": "RijksoverheidSerifWeb, 'Times New Roman', serif"
779
- },
780
- "border-width": {
781
- "default": "1px",
782
- "m": "2px",
783
- "none": "0px"
784
- },
785
- "space": {
786
- "0": 0,
787
- "25": "0.125rem",
788
- "50": "0.25rem",
789
- "100": "0.5rem",
790
- "150": "0.75rem",
791
- "200": "1rem",
792
- "300": "1.5rem",
793
- "400": "2rem",
794
- "500": "2.5rem",
795
- "600": "3rem",
796
- "700": "3.5rem"
797
- }
798
- },
799
- "utrecht": {
800
- "accordion": {
801
- "button": {
802
- "focus": {
803
- "background-color": "#FDD370",
804
- "border-color": "#154273",
805
- "color": "#0F172A"
806
- },
807
- "gap": "0.5rem",
808
- "icon": {
809
- "size": "24px"
810
- },
811
- "hover": {
812
- "background-color": "#F8FAFC",
813
- "border-color": "#94A3B8",
814
- "color": "#0F172A"
815
- },
816
- "background-color": "#fff",
817
- "border-color": "#94A3B8",
818
- "border-width": 0,
819
- "color": "#0F172A",
820
- "active": {
821
- "background-color": "#F1F5F9",
822
- "border-color": "#94A3B8",
823
- "color": "#0F172A",
824
- "row-gap": 0
825
- }
965
+ "column-gap": "0.5rem",
966
+ "border-width": "0px",
967
+ "margin-block-end": "0.75rem",
968
+ "margin-block-start": "0.75rem",
969
+ "padding-block-end": "1rem",
970
+ "padding-block-start": "1rem",
971
+ "padding-inline-end": "1rem",
972
+ "padding-inline-start": "1rem",
973
+ "background-color": "#d9ebf7",
974
+ "border-color": "transparent",
975
+ "color": "#0F172A",
976
+ "info": {
977
+ "background-color": "#d9ebf7",
978
+ "border-color": "transparent",
979
+ "color": "#0F172A"
826
980
  },
827
- "panel": {
828
- "border-color": "#94A3B8",
829
- "border-width": 0,
830
- "padding-block-end": "1.5rem",
831
- "padding-block-start": "1rem",
832
- "padding-inline-end": "1rem",
833
- "padding-inline-start": "1rem"
834
- }
835
- },
836
- "button": {
837
- "primary-action": {
838
- "focus": {
839
- "background-color": "#FDD370",
840
- "border-color": "transparent",
841
- "color": "#fff"
842
- },
843
- "hover": {
844
- "background-color": "#528e7c",
845
- "border-color": "transparent",
846
- "color": "#fff"
847
- },
848
- "background-color": "#76d2b6",
981
+ "error": {
982
+ "background-color": "#f9dfdd",
983
+ "border-color": "transparent",
984
+ "color": "#0F172A"
985
+ },
986
+ "ok": {
987
+ "background-color": "#e1eddb",
849
988
  "border-color": "transparent",
850
- "color": "#fff",
851
- "disabled": {
852
- "background-color": "#d6f2e9",
853
- "border-color": "#C1EBDE",
854
- "color": "#98DDC8"
855
- },
856
- "font-weight": 700,
857
- "active": {
858
- "background-color": "#477e6d",
859
- "border-color": "transparent",
860
- "color": "#fff"
861
- },
862
- "font-size": "1.25rem",
863
- "line-height": "1.875rem"
989
+ "color": "#0F172A"
864
990
  },
865
- "secondary-action": {
866
- "focus": {
867
- "background-color": "#FDD370",
868
- "border-color": "transparent",
869
- "color": "#76d2b6"
870
- },
871
- "hover": {
872
- "background-color": "#d6f2e9",
873
- "border-color": "transparent",
874
- "color": "#76d2b6"
875
- },
876
- "background-color": "transparent",
877
- "border-color": "#76d2b6",
878
- "color": "#76d2b6",
879
- "disabled": {
880
- "background-color": "transparent",
881
- "border-color": "#ACE4D3",
882
- "color": "#ACE4D3"
883
- },
884
- "font-weight": 700,
885
- "active": {
886
- "background-color": "#C1EBDE",
887
- "border-color": "#76d2b6",
888
- "color": "#76d2b6"
889
- },
890
- "font-size": "1.25rem",
891
- "line-height": "1.875rem"
991
+ "warning": {
992
+ "background-color": "#fff4db",
993
+ "border-color": "transparent",
994
+ "color": "#0F172A"
892
995
  },
893
- "subtle": {
894
- "focus": {
895
- "background-color": "#FDD370",
896
- "border-color": "transparent",
897
- "color": "#76d2b6"
996
+ "icon": {
997
+ "inset-block-start": "3px",
998
+ "info": {
999
+ "color": "#007bc7"
898
1000
  },
899
- "font-size": "1.25rem",
900
- "font-weight": 700,
901
- "hover": {
902
- "background-color": "transparent",
903
- "border-color": "transparent",
904
- "color": "#528e7c"
1001
+ "error": {
1002
+ "color": "#d52b1e"
905
1003
  },
906
- "background-color": "transparent",
907
- "border-color": "transparent",
908
- "color": "#76d2b6",
909
- "disabled": {
910
- "background-color": "transparent",
911
- "border-color": "transparent",
912
- "color": "#d6f2e9"
1004
+ "ok": {
1005
+ "color": "#39870c"
913
1006
  },
914
- "active": {
915
- "background-color": "transparent",
916
- "border-color": "transparent",
917
- "color": "#477e6d"
1007
+ "warning": {
1008
+ "color": "#ffb612"
918
1009
  },
919
- "line-height": "1.875rem"
920
- },
921
- "background-color": "transparent",
922
- "border-color": "#334155",
923
- "color": "#334155",
924
- "border-radius": "5px",
925
- "border-width": "1px",
926
- "icon": {
927
- "gap": "0.5rem",
928
1010
  "size": "24px"
929
1011
  },
1012
+ "message": {
1013
+ "line-height": "150%",
1014
+ "column-gap": "0.5rem"
1015
+ },
1016
+ "border-radius": "5px"
1017
+ },
1018
+ "document": {
1019
+ "background-color": "#fff",
1020
+ "color": "#0F172A",
930
1021
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
931
1022
  "font-size": "1.25rem",
932
- "font-weight": 700,
933
1023
  "line-height": "150%",
934
- "padding-block-end": "0.5rem",
935
- "padding-block-start": "0.5rem",
936
- "padding-inline-end": "1rem",
937
- "padding-inline-start": "1rem",
938
- "disabled": {
939
- "background-color": "#F8FAFC",
940
- "border-color": "transparent",
941
- "color": "#64748B"
1024
+ "font-weight": 400
1025
+ },
1026
+ "rich-text": {
1027
+ "stranger": {
1028
+ "margin-block-end": "2rem"
942
1029
  },
943
- "focus": {
944
- "background-color": "#FDDE94",
945
- "border-color": "transparent",
946
- "color": "#1E293B"
1030
+ "acquaintance": {
1031
+ "margin-block-end": "1rem"
947
1032
  },
948
- "hover": {
949
- "background-color": "#F8FAFC",
950
- "border-color": "#1E293B",
951
- "color": "#1E293B"
1033
+ "friend": {
1034
+ "margin-block-end": "0.5rem"
952
1035
  },
953
- "active": {
954
- "background-color": "#CBD5E1",
955
- "border-color": "#0F172A",
956
- "color": "#0F172A"
1036
+ "best-friend": {
1037
+ "margin-block-end": "0.25rem"
957
1038
  },
958
- "min-block-size": "48px",
959
- "min-inline-size": "48px",
960
- "column-gap": "0.5rem"
1039
+ "confidant": {
1040
+ "margin-block-end": 0
1041
+ }
961
1042
  },
962
- "checkbox": {
1043
+ "pointer-target": {
1044
+ "min-size": "48px"
1045
+ },
1046
+ "focus": {
1047
+ "outline-color": "#76d2b6",
1048
+ "outline-offset": "0.125rem",
1049
+ "outline-style": "solid",
1050
+ "outline-width": "2px",
1051
+ "inverse": {
1052
+ "outline-color": "#fff"
1053
+ }
1054
+ }
1055
+ },
1056
+ "rhc": {
1057
+ "color": {
1058
+ "primary": {
1059
+ "50": "#eaf8f4",
1060
+ "100": "#d6f2e9",
1061
+ "200": "#C1EBDE",
1062
+ "300": "#ACE4D3",
1063
+ "400": "#98DDC8",
1064
+ "500": "#76d2b6",
1065
+ "hover": "#528e7c"
1066
+ },
963
1067
  "focus": {
964
- "background-color": "#FDD370",
965
- "border-color": "#154273",
966
- "border-width": "2px"
1068
+ "outline": "#76d2b6"
967
1069
  },
968
- "checked": {
969
- "focus": {
970
- "background-color": "#FDD370",
971
- "border-width": "2px",
972
- "border-color": "#154273",
973
- "color": "#154273"
1070
+ "foreground": {
1071
+ "default": "#0F172A",
1072
+ "subdued": "#334155",
1073
+ "onEmphasis": "#fff",
1074
+ "link": "#01689b"
1075
+ },
1076
+ "border": {
1077
+ "default": "#64748B",
1078
+ "subdued": "#94A3B8",
1079
+ "strong": "#0F172A"
1080
+ },
1081
+ "canvas": "#fff",
1082
+ "feedback": {
1083
+ "success": {
1084
+ "default": "#39870c",
1085
+ "subdued": "#e1eddb"
974
1086
  },
975
- "background-color": "#154273",
976
- "border-color": "transparent",
977
- "color": "#fff",
978
- "border-width": "1px",
979
- "disabled": {
980
- "background-color": "#CBD5E1",
981
- "border-color": "#94A3B8",
982
- "color": "#475569"
1087
+ "info": {
1088
+ "default": "#007bc7",
1089
+ "subdued": "#d9ebf7"
983
1090
  },
984
- "hover": {
985
- "border-width": "1px",
986
- "background-color": "#738eab",
987
- "border-color": "transparent",
988
- "color": "#fff"
1091
+ "error": {
1092
+ "default": "#d52b1e",
1093
+ "subdued": "#f9dfdd"
989
1094
  },
990
- "active": {
991
- "border-width": "1px",
992
- "background-color": "#4f7196",
993
- "border-color": "transparent",
994
- "color": "#fff"
1095
+ "warning": {
1096
+ "default": "#ffb612",
1097
+ "subdued": "#fff4db"
995
1098
  }
996
1099
  },
997
- "border-radius": "2.5px",
998
- "size": "24px",
999
- "icon": {
1000
- "size": "24px"
1100
+ "accent": {
1101
+ "500": "#8fcae7"
1001
1102
  },
1002
- "background-color": "#fff",
1003
- "border-color": "#154273",
1004
- "invalid": {
1005
- "background-color": "#f9dfdd",
1006
- "border-color": "#d52b1e",
1007
- "border-width": "1px"
1103
+ "cool-grey": {
1104
+ "50": "#F8FAFC",
1105
+ "100": "#F1F5F9",
1106
+ "200": "#E2E8F0",
1107
+ "300": "#CBD5E1",
1108
+ "400": "#94A3B8",
1109
+ "500": "#64748B",
1110
+ "600": "#475569",
1111
+ "700": "#334155",
1112
+ "800": "#1E293B",
1113
+ "900": "#0F172A"
1114
+ },
1115
+ "lichtblauw": {
1116
+ "50": "#eef7fb",
1117
+ "100": "#ddeff8",
1118
+ "200": "#CCE7F4",
1119
+ "300": "#BCDFF0",
1120
+ "400": "#ABD7ED",
1121
+ "500": "#8fcae7"
1122
+ },
1123
+ "violet": {
1124
+ "50": "#f2d9e7",
1125
+ "100": "#e5b3d0",
1126
+ "200": "#D88CB7",
1127
+ "300": "#CB66A0",
1128
+ "400": "#BE4088",
1129
+ "500": "#a90061"
1130
+ },
1131
+ "paars": {
1132
+ "50": "#e3dce7",
1133
+ "100": "#c6b9cf",
1134
+ "200": "#A995B7",
1135
+ "300": "#8D729F",
1136
+ "400": "#714f87",
1137
+ "500": "#42145f"
1008
1138
  },
1009
- "disabled": {
1010
- "background-color": "#CBD5E1",
1011
- "border-color": "#94A3B8"
1139
+ "hemelblauw": {
1140
+ "50": "#d9ebf7",
1141
+ "100": "#b3d7ee",
1142
+ "200": "#8CC3E6",
1143
+ "300": "#66AFDD",
1144
+ "400": "#409CD5",
1145
+ "500": "#007bc7"
1012
1146
  },
1013
- "indeterminate": {
1014
- "background-color": "#154273",
1015
- "border-color": "transparent",
1016
- "color": "#fff",
1017
- "border-width": "1px",
1018
- "disabled": {
1019
- "background-color": "#CBD5E1",
1020
- "border-color": "#94A3B8",
1021
- "color": "#475569"
1022
- },
1023
- "active": {
1024
- "background-color": "#4f7196",
1025
- "border-color": "transparent",
1026
- "color": "#fff",
1027
- "border-width": "1px"
1028
- },
1029
- "hover": {
1030
- "background-color": "#738eab",
1031
- "border-color": "transparent",
1032
- "color": "#fff",
1033
- "border-width": "1px"
1034
- },
1035
- "focus": {
1036
- "background-color": "#fff",
1037
- "border-color": "#154273",
1038
- "color": "#154273",
1039
- "border-width": "2px"
1040
- }
1147
+ "donkerblauw": {
1148
+ "50": "#d9e8f0",
1149
+ "100": "#b3d2e1",
1150
+ "200": "#8CBBD2",
1151
+ "300": "#66A4C3",
1152
+ "400": "#408EB4",
1153
+ "500": "#01689b"
1041
1154
  },
1042
- "border-width": "1px",
1043
- "hover": {
1044
- "border-width": "1px",
1045
- "background-color": "#fff",
1046
- "border-color": "#738eab"
1155
+ "mintgroen": {
1156
+ "50": "#eaf8f4",
1157
+ "100": "#d6f2e9",
1158
+ "200": "#C1EBDE",
1159
+ "300": "#ACE4D3",
1160
+ "400": "#98DDC8",
1161
+ "500": "#76d2b6"
1047
1162
  },
1048
- "active": {
1049
- "border-width": "1px",
1050
- "background-color": "#fff",
1051
- "border-color": "#4f7196"
1052
- }
1053
- },
1054
- "radio-button": {
1055
- "focus": {
1056
- "background-color": "#FDD370",
1057
- "border-color": "#154273",
1058
- "border-width": "2px"
1163
+ "mosgroen": {
1164
+ "50": "#ebebd9",
1165
+ "100": "#d6d7b3",
1166
+ "200": "#C1C38C",
1167
+ "300": "#ADAF66",
1168
+ "400": "#999C40",
1169
+ "500": "#777b00"
1059
1170
  },
1060
- "checked": {
1061
- "focus": {
1062
- "background-color": "#FDD370",
1063
- "border-color": "#154273",
1064
- "color": "#154273",
1065
- "border-width": "2px"
1066
- },
1067
- "background-color": "#154273",
1068
- "border-color": "transparent",
1069
- "color": "#fff",
1070
- "hover": {
1071
- "background-color": "#738eab",
1072
- "border-color": "transparent",
1073
- "color": "#fff",
1074
- "border-width": "1px"
1075
- },
1076
- "active": {
1077
- "background-color": "#4f7196",
1078
- "border-color": "transparent",
1079
- "color": "#fff",
1080
- "border-width": "1px"
1081
- },
1082
- "disabled": {
1083
- "background-color": "#CBD5E1",
1084
- "border-color": "#94A3B8",
1085
- "color": "#475569"
1086
- },
1087
- "border-width": "1px"
1171
+ "groen": {
1172
+ "50": "#e1eddb",
1173
+ "100": "#c4dbb6",
1174
+ "200": "#A5C991",
1175
+ "300": "#88B76D",
1176
+ "400": "#6AA549",
1177
+ "500": "#39870c"
1088
1178
  },
1089
- "active": {
1090
- "border-width": "1px",
1091
- "background-color": "#fff",
1092
- "border-color": "#4f7196"
1179
+ "donkergroen": {
1180
+ "50": "#dfe6e1",
1181
+ "100": "#becdc3",
1182
+ "200": "#9DB4A4",
1183
+ "300": "#7D9B87",
1184
+ "400": "#5D8269",
1185
+ "500": "#275937"
1093
1186
  },
1094
- "size": "24px",
1095
- "dot": {
1096
- "size": "12px"
1187
+ "bruin": {
1188
+ "50": "#efeada",
1189
+ "100": "#dfd4b6",
1190
+ "200": "#CFBF90",
1191
+ "300": "#BFA96C",
1192
+ "400": "#AF9447",
1193
+ "500": "#94710a"
1097
1194
  },
1098
- "background-color": "#fff",
1099
- "border-color": "#154273",
1100
- "invalid": {
1101
- "background-color": "#f9dfdd",
1102
- "border-color": "#d52b1e",
1103
- "border-width": "1px"
1195
+ "donkerbruin": {
1196
+ "50": "#e8e0df",
1197
+ "100": "#d1c2be",
1198
+ "200": "#BAA39D",
1199
+ "300": "#A3847D",
1200
+ "400": "#8D665D",
1201
+ "500": "#673327"
1104
1202
  },
1105
- "disabled": {
1106
- "background-color": "#CBD5E1",
1107
- "border-color": "#94A3B8",
1108
- "color": "#475569"
1203
+ "geel": {
1204
+ "50": "#fefbdd",
1205
+ "100": "#fdf6bc",
1206
+ "200": "#FCF199",
1207
+ "300": "#FBED78",
1208
+ "400": "#FAE856",
1209
+ "500": "#f9e11e"
1109
1210
  },
1110
- "hover": {
1111
- "background-color": "#fff",
1112
- "border-color": "#738eab",
1113
- "border-width": "1px"
1211
+ "donkergeel": {
1212
+ "50": "#fff4db",
1213
+ "100": "#ffe9b8",
1214
+ "200": "#FDDE94",
1215
+ "300": "#FDD370",
1216
+ "400": "#FDC84D",
1217
+ "500": "#ffb612"
1114
1218
  },
1115
- "border-radius": "999px",
1116
- "border-width": "1px"
1117
- },
1118
- "link": {
1119
- "focus": {
1120
- "background-color": "#FDD370",
1121
- "color": "#01689b",
1122
- "text-decoration": "None",
1123
- "text-decoration-thickness": "auto"
1219
+ "oranje": {
1220
+ "50": "#fbead9",
1221
+ "100": "#f6d4b3",
1222
+ "200": "#F1BE8C",
1223
+ "300": "#EDA966",
1224
+ "400": "#E89440",
1225
+ "500": "#e17000"
1124
1226
  },
1125
- "color": "#01689b",
1126
- "text-decoration-color": "#01689b",
1127
- "active": {
1128
- "color": "#42145f",
1129
- "text-decoration": "None"
1227
+ "rood": {
1228
+ "50": "#f9dfdd",
1229
+ "100": "#f2bfbc",
1230
+ "200": "#EC9F99",
1231
+ "300": "#E67F78",
1232
+ "400": "#DF6056",
1233
+ "500": "#d52b1e"
1130
1234
  },
1131
- "hover": {
1132
- "color": "#01496c",
1133
- "text-decoration": "None",
1134
- "text-decoration-thickness": "auto"
1235
+ "roze": {
1236
+ "50": "#fdeff8",
1237
+ "100": "#fbdef0",
1238
+ "200": "#F8CEE8",
1239
+ "300": "#F6BDE1",
1240
+ "400": "#F4ADD9",
1241
+ "500": "#f092cd"
1135
1242
  },
1136
- "visited": {
1137
- "color": "#42145f"
1243
+ "robijnrood": {
1244
+ "50": "#f7d9e7",
1245
+ "100": "#efb3ce",
1246
+ "200": "#E78CB6",
1247
+ "300": "#DF669D",
1248
+ "400": "#D74085",
1249
+ "500": "#ca005d"
1138
1250
  },
1139
- "text-decoration": "underline",
1140
- "icon": {
1141
- "inset-block-start": "0.25rem",
1142
- "size": "24px"
1251
+ "lintblauw": {
1252
+ "50": "#dce3ea",
1253
+ "100": "#b8c6d5",
1254
+ "200": "#95a9c0",
1255
+ "300": "#738eab",
1256
+ "400": "#4f7196",
1257
+ "500": "#154273"
1143
1258
  },
1144
- "column-gap": "0.25rem",
1145
- "text-decoration-thickness": "auto",
1146
- "text-underline-offset": "0.125rem",
1147
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1148
- "font-weight": 400,
1149
- "font-size": "1.25rem",
1150
- "line-height": "150%"
1259
+ "wit": "#fff",
1260
+ "zwart": "#000",
1261
+ "none": "transparent"
1151
1262
  },
1152
- "select": {
1153
- "focus": {
1154
- "background-color": "#FDD370",
1155
- "border-color": "#154273",
1156
- "color": "#0F172A",
1157
- "border-width": "2px"
1158
- },
1159
- "image-background-position": "right 0.5rem center",
1263
+ "sub-nav-bar": {
1264
+ "background-color": "#f2f4f6",
1265
+ "column-gap": "0.5rem",
1266
+ "column-width": "375px",
1267
+ "padding-block-end": "2rem",
1268
+ "padding-block-start": "2rem",
1269
+ "inline-size": "100%",
1270
+ "content": {
1271
+ "padding-inline-end": "1rem",
1272
+ "padding-inline-start": "1rem",
1273
+ "max-inline-size": "1280px",
1274
+ "list": {
1275
+ "row-gap": "0.5rem"
1276
+ }
1277
+ }
1278
+ },
1279
+ "toggletip": {
1280
+ "color": "#fff",
1281
+ "background-color": "#007bc7",
1282
+ "border-color": "transparent",
1283
+ "border-radius": "5px",
1284
+ "border-width": "1px",
1160
1285
  "icon": {
1161
1286
  "size": "24px"
1162
1287
  },
1163
- "background-color": "#fff",
1164
- "border-color": "#154273",
1165
- "color": "#0F172A",
1166
- "invalid": {
1167
- "background-color": "#f9dfdd",
1168
- "border-color": "#d52b1e",
1169
- "color": "#0F172A",
1170
- "border-width": "1px"
1171
- },
1172
- "disabled": {
1173
- "background-color": "#CBD5E1",
1174
- "border-color": "#94A3B8",
1175
- "color": "#475569"
1288
+ "size": "24px",
1289
+ "active": {
1290
+ "color": "#007bc7",
1291
+ "background-color": "#fff",
1292
+ "border-color": "#007bc7"
1176
1293
  },
1177
1294
  "hover": {
1178
- "background-color": "#fff",
1179
- "border-color": "#738eab",
1180
1295
  "color": "#0F172A",
1181
- "border-width": "1px"
1296
+ "background-color": "#66AFDD"
1182
1297
  },
1183
- "padding-block-end": "0.5rem",
1184
- "padding-block-start": "0.5rem",
1185
- "padding-inline-end": "0.75rem",
1186
- "padding-inline-start": "0.75rem",
1187
- "border-radius": "2.5px",
1188
- "border-bottom-width": "auto",
1189
- "border-width": "1px",
1190
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1191
- "font-weight": 400,
1192
- "line-height": "150%",
1193
- "font-size": "1.25rem",
1194
- "max-inline-size": "400px"
1195
- },
1196
- "textarea": {
1197
1298
  "focus": {
1198
- "background-color": "#FDD370",
1199
- "border-color": "#154273",
1200
- "color": "#0F172A",
1201
- "border-width": "2px"
1202
- },
1203
- "max-inline-size": "400px",
1299
+ "color": "#fff",
1300
+ "background-color": "#007bc7"
1301
+ }
1302
+ },
1303
+ "sidenav": {
1304
+ "display": "flex",
1305
+ "link": {
1306
+ "line-height": "150%",
1307
+ "icon": {
1308
+ "size": "24px",
1309
+ "margin-inline": "0.5rem"
1310
+ },
1311
+ "font-size": "1.25rem",
1312
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1313
+ "font-weight": 400,
1314
+ "current": {
1315
+ "font-weight": 700,
1316
+ "color": "#0F172A"
1317
+ },
1318
+ "color": "#01689b",
1319
+ "active": {
1320
+ "color": "#42145f",
1321
+ "text-decoration": "underline"
1322
+ },
1323
+ "focus": {
1324
+ "border-radius": "5px",
1325
+ "border-width": "2px",
1326
+ "border-style": "solid",
1327
+ "border-color": "#154273",
1328
+ "background-color": "none",
1329
+ "color": "#01689b",
1330
+ "text-decoration": "None"
1331
+ },
1332
+ "hover": {
1333
+ "color": "#15496a",
1334
+ "text-decoration": "underline"
1335
+ },
1336
+ "padding-block-start": "0.75rem",
1337
+ "padding-block-end": "0.75rem",
1338
+ "text-decoration": "None",
1339
+ "column-gap": "0.5rem"
1340
+ }
1341
+ },
1342
+ "radio-group": {
1204
1343
  "padding-block-end": "0.5rem",
1205
1344
  "padding-block-start": "0.5rem",
1206
- "padding-inline-end": "0.75rem",
1207
- "padding-inline-start": "0.75rem",
1208
- "background-color": "#fff",
1209
- "border-color": "#154273",
1210
- "color": "#0F172A",
1211
- "invalid": {
1212
- "background-color": "#f9dfdd",
1213
- "border-color": "#d52b1e",
1214
- "color": "#0F172A",
1215
- "border-width": "1px"
1216
- },
1217
- "placeholder": {
1218
- "color": "#64748B"
1219
- },
1220
- "disabled": {
1221
- "background-color": "#CBD5E1",
1222
- "border-color": "#94A3B8",
1223
- "color": "#475569"
1224
- },
1225
- "read-only": {
1226
- "background-color": "#F1F5F9",
1227
- "border-color": "transparent",
1228
- "color": "#0F172A"
1345
+ "row-gap": "1rem"
1346
+ },
1347
+ "navigation-list": {
1348
+ "icon": {
1349
+ "background-color": "#0F172A",
1350
+ "border-radius": "999px",
1351
+ "color": "#fff"
1229
1352
  },
1230
- "hover": {
1353
+ "item": {
1354
+ "icon": {
1355
+ "padding-inline": "0.5rem",
1356
+ "padding-block": "0.5rem",
1357
+ "size": "24px"
1358
+ },
1359
+ "content": {
1360
+ "font-size": "1.125rem",
1361
+ "column-gap": "0.5rem",
1362
+ "row-gap": "0.25rem"
1363
+ },
1364
+ "label": {
1365
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1366
+ "font-size": "1.875rem",
1367
+ "font-weight": 700,
1368
+ "line-height": "150%"
1369
+ },
1370
+ "active": {
1371
+ "background-color": "#F1F5F9"
1372
+ },
1373
+ "hover": {
1374
+ "background-color": "#F8FAFC"
1375
+ },
1376
+ "focus": {
1377
+ "background-color": "#dce3ea"
1378
+ },
1231
1379
  "background-color": "#fff",
1232
- "border-color": "#738eab",
1233
- "color": "#0F172A",
1234
- "border-width": "1px"
1235
- },
1236
- "border-radius": "2.5px",
1237
- "border-bottom-width": "1px",
1238
- "border-width": "1px",
1239
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1240
- "font-weight": 400,
1241
- "line-height": "150%",
1242
- "font-size": "1.25rem"
1380
+ "color": "#334155",
1381
+ "border-width": "1px",
1382
+ "border-color": "#CBD5E1",
1383
+ "heading": {
1384
+ "color": "#0F172A"
1385
+ },
1386
+ "column-gap": "1rem",
1387
+ "min-height": "48px",
1388
+ "padding-block": "0.75rem",
1389
+ "padding-inline": "1rem"
1390
+ }
1243
1391
  },
1244
- "textbox": {
1245
- "focus": {
1246
- "background-color": "#FDD370",
1247
- "border-width": "2px",
1248
- "border-color": "#154273",
1249
- "color": "#0F172A"
1392
+ "nav-bar": {
1393
+ "border-block-end-width": "1px",
1394
+ "max-inline-size": "1280px",
1395
+ "padding-inline": "1rem",
1396
+ "container": {
1397
+ "inline-size": "100%"
1250
1398
  },
1251
- "border-radius": "2.5px",
1252
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1253
- "font-size": "1.25rem",
1254
- "font-weight": 400,
1255
- "line-height": "150%",
1256
- "max-inline-size": "400px",
1257
- "padding-block-end": "0.5rem",
1258
- "padding-block-start": "0.5rem",
1259
- "padding-inline-end": "0.75rem",
1260
- "padding-inline-start": "0.75rem",
1261
- "background-color": "#fff",
1262
- "border-color": "#154273",
1263
- "color": "#0F172A",
1264
- "invalid": {
1265
- "background-color": "#f9dfdd",
1266
- "border-color": "#d52b1e",
1267
- "color": "#0F172A",
1268
- "border-width": "1px"
1399
+ "content": {
1400
+ "column-gap": "1rem"
1269
1401
  },
1270
- "placeholder": {
1271
- "color": "#64748B"
1402
+ "icon": {
1403
+ "color": "#0F172A",
1404
+ "active": {
1405
+ "color": "#fff"
1406
+ },
1407
+ "size": "24px"
1272
1408
  },
1273
- "border-block-end-width": "auto",
1274
- "border-width": "1px",
1275
- "disabled": {
1276
- "background-color": "#CBD5E1",
1277
- "border-color": "#94A3B8",
1278
- "color": "#475569"
1409
+ "link": {
1410
+ "active": {
1411
+ "background-color": "#76d2b6",
1412
+ "color": "#fff"
1413
+ },
1414
+ "background-color": "#fff",
1415
+ "color": "#76d2b6",
1416
+ "focus": {
1417
+ "background-color": "#eaf8f4",
1418
+ "color": "#76d2b6"
1419
+ },
1420
+ "hover": {
1421
+ "background-color": "#F8FAFC",
1422
+ "color": "#76d2b6"
1423
+ },
1424
+ "padding-block-end": "1rem",
1425
+ "padding-block-start": "1rem",
1426
+ "padding-inline-end": "0.75rem",
1427
+ "padding-inline-start": "0.75rem",
1428
+ "column-gap": "0.5rem"
1279
1429
  },
1280
- "read-only": {
1281
- "background-color": "#F1F5F9",
1282
- "border-color": "transparent",
1283
- "color": "#0F172A"
1430
+ "heading": {
1431
+ "font-weight": 700
1284
1432
  },
1285
- "hover": {
1286
- "border-width": "1px",
1433
+ "background-color": "#fff",
1434
+ "color": "#76d2b6",
1435
+ "border-color": "#98DDC8"
1436
+ },
1437
+ "message-list": {
1438
+ "item": {
1287
1439
  "background-color": "#fff",
1288
- "border-color": "#738eab",
1289
- "color": "#0F172A"
1440
+ "border-color": "#CBD5E1",
1441
+ "border-width": "1px",
1442
+ "color": "#334155",
1443
+ "column-gap": "1rem",
1444
+ "icon": {
1445
+ "size": "24px",
1446
+ "color": "#0F172A"
1447
+ },
1448
+ "min-height": "48px",
1449
+ "padding-block": "0.75rem",
1450
+ "padding-inline": "1rem",
1451
+ "content": {
1452
+ "font-size": "1.125rem",
1453
+ "column-gap": "0.5rem",
1454
+ "row-gap": "0.5rem"
1455
+ },
1456
+ "label": {
1457
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1458
+ "font-size": "1.25rem",
1459
+ "font-weight": 700,
1460
+ "line-height": "150%"
1461
+ },
1462
+ "heading": {
1463
+ "color": "#0F172A"
1464
+ }
1290
1465
  }
1291
1466
  },
1292
- "counter-badge": {
1293
- "background-color": "#FDD370"
1467
+ "logo": {
1468
+ "image": {
1469
+ "background-color": "#fff",
1470
+ "inline-size": "48px",
1471
+ "block-size": "96px",
1472
+ "color": "#154273"
1473
+ },
1474
+ "title": {
1475
+ "font-weight": 600,
1476
+ "line-height": "1.063rem",
1477
+ "font-size": "0.913rem",
1478
+ "padding-block-start": "3.125rem"
1479
+ },
1480
+ "subtitle": {
1481
+ "font-weight": 400,
1482
+ "line-height": "1rem",
1483
+ "font-size": "0.775rem"
1484
+ },
1485
+ "column-gap": "12px",
1486
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1487
+ "color": "#154273"
1294
1488
  },
1295
- "skip-link": {
1296
- "focus": {
1297
- "background-color": "#FDD370"
1298
- }
1489
+ "link-list-card": {
1490
+ "background-color": "#fff",
1491
+ "padding-block-start": "1.5rem",
1492
+ "padding-block-end": "1.5rem",
1493
+ "row-gap": "1rem",
1494
+ "padding-inline-start": "1.5rem",
1495
+ "padding-inline-end": "1.5rem"
1299
1496
  },
1300
- "icon": {
1301
- "color": "inherit",
1302
- "size": "24px",
1303
- "inset-block-start": 0
1497
+ "link-list": {
1498
+ "text-decoration": "None"
1304
1499
  },
1305
- "unordered-list": {
1306
- "padding-inline-start": "1.5rem",
1307
- "margin-block-end": "0.25rem",
1308
- "margin-block-start": "0.25rem",
1309
- "color": "#0F172A",
1310
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1311
- "font-weight": 400,
1312
- "font-size": "1.25rem",
1313
- "line-height": "150%",
1314
- "item": {
1315
- "padding-inline-start": "0.5rem",
1316
- "margin-block-end": "0.25rem",
1317
- "margin-block-start": "0.25rem"
1318
- },
1319
- "marker": {
1320
- "color": "#0F172A",
1321
- "border-color": "#0F172A"
1322
- }
1500
+ "icon-only-button": {
1501
+ "padding-block-end": "0.75rem",
1502
+ "padding-block-start": "0.75rem",
1503
+ "padding-inline-end": "0.75rem",
1504
+ "padding-inline-start": "0.75rem"
1323
1505
  },
1324
- "table": {
1325
- "header-cell": {
1326
- "line-height": "150%",
1327
- "color": "#0F172A",
1328
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1506
+ "hero": {
1507
+ "heading": {
1329
1508
  "font-weight": 700,
1330
- "font-size": "1.25rem"
1331
- },
1332
- "caption": {
1333
1509
  "line-height": "125%",
1334
- "margin-block-end": "1.5rem",
1335
- "color": "#0F172A",
1336
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1337
- "font-weight": 700,
1338
- "font-size": "1.875rem"
1339
- },
1340
- "cell": {
1341
- "padding-block-end": "0.75rem",
1342
- "padding-block-start": "0.75rem",
1343
- "padding-inline-end": "1rem",
1344
- "padding-inline-start": "1rem",
1345
- "line-height": "150%"
1510
+ "font-size": "1.875rem",
1511
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif"
1346
1512
  },
1347
- "data-cell": {
1348
- "color": "#0F172A",
1349
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1513
+ "sub-heading": {
1350
1514
  "font-weight": 400,
1351
1515
  "line-height": "150%",
1352
- "font-size": "1.25rem"
1353
- },
1354
- "header": {
1355
- "border-block-end-width": "2px",
1356
- "border-block-end-color": "#CBD5E1",
1357
- "background-color": "transparent"
1358
- },
1359
- "footer": {
1360
- "border-block-end-width": "1px",
1361
- "border-block-end-color": "#CBD5E1",
1362
- "background-color": "transparent"
1363
- },
1364
- "row": {
1365
- "border-block-end-width": "1px",
1366
- "border-block-end-color": "#CBD5E1",
1367
- "background-color": "transparent"
1368
- },
1369
- "footer-cell": {
1370
- "font-weight": 700,
1371
1516
  "font-size": "1.25rem",
1372
- "color": "#0F172A",
1373
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1374
- "line-height": "150%"
1517
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif"
1375
1518
  },
1376
- "container": {
1377
- "box-inline-end-shadow": {
1378
- "x": 0,
1379
- "y": "16px",
1380
- "blur": "48px",
1381
- "spread": 0,
1382
- "color": "#0000001a"
1383
- },
1384
- "box-inline-start-shadow": {
1385
- "x": 0,
1386
- "y": "16px",
1387
- "blur": "48px",
1388
- "spread": 0,
1389
- "color": "#0000001a"
1390
- }
1519
+ "message": {
1520
+ "background-color": "#154273",
1521
+ "color": "#fff",
1522
+ "row-gap": "0.125rem",
1523
+ "padding-block-end": "1rem",
1524
+ "padding-inline-end": "1rem",
1525
+ "padding-inline-start": "1rem",
1526
+ "padding-block-start": "1rem",
1527
+ "border-radius": "20px",
1528
+ "inline-size": "90%"
1391
1529
  },
1392
- "font-size": "1.25rem"
1393
- },
1394
- "separator": {
1395
- "color": "#CBD5E1",
1396
- "block-size": "2px",
1397
- "margin-block-end": "0.75rem",
1398
- "margin-block-start": "0.75rem"
1530
+ "border-radius": "40px",
1531
+ "inline-size": "100%"
1399
1532
  },
1400
- "ordered-list": {
1401
- "padding-inline-start": "1.5rem",
1402
- "margin-block-end": "0.25rem",
1403
- "margin-block-start": "0.25rem",
1404
- "margin-inline-start": "0.625rem",
1405
- "item": {
1406
- "padding-inline-start": 0,
1407
- "margin-block-end": "0.25rem",
1408
- "margin-block-start": "0.25rem"
1409
- },
1410
- "color": "#0F172A",
1411
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1533
+ "form-field-radio-option": {
1534
+ "column-gap": "0.5rem",
1412
1535
  "font-weight": 400,
1413
- "font-size": "1.25rem",
1414
- "line-height": "150%"
1415
- },
1416
- "link-list": {
1417
- "margin-block-start": 0,
1418
1536
  "row-gap": "0.5rem",
1419
- "margin-block-end": 0,
1420
- "item": {
1421
- "column-gap": "0.5rem",
1422
- "text-decoration": "None"
1423
- },
1424
- "icon": {
1425
- "size": "24px",
1426
- "inset-block-start": "0.188rem"
1427
- }
1428
- },
1429
- "form-label": {
1430
- "color": "#0F172A",
1431
- "font-size": "1.25rem",
1432
- "font-weight": 700
1433
- },
1434
- "form-field-label": {
1435
- "color": "#0F172A",
1436
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1437
- "font-size": "1.25rem",
1438
- "font-weight": 700,
1439
- "line-height": "150%"
1440
- },
1441
- "form-field-error-message": {
1442
- "icon": {
1443
- "size": "24px",
1444
- "margin-inline-end": "0.5rem"
1445
- },
1446
- "color": "#d52b1e",
1447
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1448
- "font-size": "1.25rem",
1449
- "font-weight": 400,
1450
- "margin-block-end": "0.5rem",
1451
- "padding-block-end": "0.5rem"
1452
- },
1453
- "form-field-description": {
1454
- "color": "#334155",
1455
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1456
- "font-size": "1.25rem",
1457
- "line-height": "150%",
1458
- "margin-block-start": "-0.5rem",
1459
- "margin-block-end": "0.5rem",
1460
- "padding-block-end": "0.5rem"
1461
- },
1462
- "form-field": {
1463
- "margin-block-start": "0.5rem",
1464
- "margin-block-end": "0.5rem",
1465
- "invalid": {
1466
- "border-inline-start-color": "#d52b1e",
1467
- "border-inline-start-width": "0px",
1468
- "padding-inline-start": 0
1469
- },
1470
1537
  "label": {
1471
- "margin-block-end": "0.5rem"
1538
+ "margin-block-end": 0
1472
1539
  },
1473
- "error-message": {
1474
- "line-height": "normal"
1540
+ "input": {
1541
+ "margin": {
1542
+ "block-start": "0.25rem"
1543
+ }
1475
1544
  }
1476
1545
  },
1546
+ "form-field-checkbox-option": {
1547
+ "column-gap": "0.5rem",
1548
+ "margin-block-end": 0
1549
+ },
1477
1550
  "page-footer": {
1478
- "background-color": "#154273",
1479
- "color": "#fff",
1480
- "padding-block-start": "3rem",
1481
- "padding-block-end": "3rem",
1482
- "padding-inline-start": "80px",
1483
- "padding-inline-end": "80px"
1484
- },
1485
- "figure": {
1486
- "caption": {
1487
- "border-color": "#CBD5E1",
1488
- "border-width": "4px",
1489
- "color": "#76d2b6",
1490
- "padding-block-end": "0.5rem",
1491
- "padding-block-start": "0.5rem",
1551
+ "column-gap": "1.5rem",
1552
+ "column-width": "200px",
1553
+ "column": {
1554
+ "title": {
1555
+ "margin-block-end": "0.75rem"
1556
+ }
1557
+ },
1558
+ "content": {
1559
+ "max-inline-size": "1280px",
1492
1560
  "padding-inline-start": "1rem",
1493
- "line-height": "150%",
1494
- "font-size": "1.25rem"
1561
+ "padding-inline-end": "1rem",
1562
+ "column-gap": "2rem"
1495
1563
  },
1496
- "img": {
1497
- "border-end-end-radius": 0,
1498
- "border-end-start-radius": 0,
1499
- "border-start-end-radius": 0,
1500
- "border-start-start-radius": 0
1501
- }
1502
- },
1503
- "form-fieldset": {
1504
- "legend": {
1505
- "color": "#0F172A",
1506
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1507
- "font-size": "1.25rem",
1508
- "font-weight": 700,
1509
- "line-height": "150%",
1510
- "disabled": {
1511
- "color": "#334155"
1564
+ "border": {
1565
+ "block-start": {
1566
+ "width": "2px",
1567
+ "color": "#738eab",
1568
+ "style": "solid"
1512
1569
  }
1513
1570
  },
1514
- "section": {
1515
- "background-color": "transparent",
1516
- "color": "#0F172A"
1571
+ "outlined": {
1572
+ "background-color": "#fff",
1573
+ "color": "#76d2b6",
1574
+ "border": {
1575
+ "color": "#76d2b6"
1576
+ }
1517
1577
  },
1518
- "invalid": {
1519
- "border-inline-start": {
1520
- "color": "#d52b1e"
1521
- },
1522
- "padding-inline-start": 0,
1523
- "border-inline-start-width": "0px"
1578
+ "padding": {
1579
+ "block-start": "2.5rem",
1580
+ "block-end": "2.5rem",
1581
+ "inline-start": "2.5rem",
1582
+ "inline-end": "2.5rem"
1583
+ },
1584
+ "flex": {
1585
+ "direction": "column"
1524
1586
  }
1525
1587
  },
1526
- "button-group": {
1527
- "background-color": "transparent",
1528
- "column-gap": "0.5rem",
1529
- "margin-block-end": "0px",
1530
- "margin-block-start": "0px",
1531
- "padding-block-end": "0px",
1532
- "padding-block-start": "0px",
1533
- "row-gap": "0.5rem"
1588
+ "file-input": {
1589
+ "column-gap": "0.75rem",
1590
+ "row-gap": "0.75rem",
1591
+ "feedback": {
1592
+ "color": "#475569",
1593
+ "font-size": "1rem"
1594
+ }
1534
1595
  },
1535
- "breadcrumb-nav": {
1536
- "line-height": 1.4,
1537
- "font-size": "1.25rem",
1596
+ "file": {
1597
+ "border-style": "solid",
1598
+ "border-color": "#154273",
1599
+ "border-width": "1px",
1600
+ "border-radius": "5px",
1601
+ "padding-inline-start": "1rem",
1602
+ "padding-inline-end": "1rem",
1603
+ "padding-block-start": "0.75rem",
1604
+ "padding-block-end": "0.75rem",
1605
+ "column-gap": "0.25rem",
1606
+ "error": {
1607
+ "border-color": "#d52b1e"
1608
+ },
1609
+ "subtitle": {
1610
+ "color": "#64748B"
1611
+ }
1612
+ },
1613
+ "dot-badge": {
1614
+ "border-radius": "999px",
1615
+ "color": "#d52b1e",
1616
+ "size": "12px"
1617
+ },
1618
+ "code-input": {
1619
+ "size": "48px"
1620
+ },
1621
+ "code-input-group": {
1622
+ "column-gap": "0.5rem"
1623
+ },
1624
+ "checkbox-group": {
1625
+ "padding-block-end": "0.5rem",
1626
+ "padding-block-start": "0.5rem",
1627
+ "row-gap": "1rem"
1628
+ },
1629
+ "card-as-link": {
1630
+ "background-color": "#fff",
1631
+ "border-color": "#CBD5E1",
1632
+ "border-radius": "5px",
1633
+ "border-width": "1px",
1634
+ "color": "#0F172A",
1635
+ "column-gap": "1rem",
1636
+ "inline-size": "328px",
1637
+ "icon": {
1638
+ "color": "#154273",
1639
+ "size": "24px"
1640
+ },
1538
1641
  "link": {
1539
- "icon": {
1540
- "size": "24px",
1541
- "margin-inline": "0.25rem",
1542
- "inset-block-start": 0
1543
- },
1544
- "padding-block-end": "0.75rem",
1545
- "padding-block-start": "0.75rem",
1546
- "padding-inline-end": 0,
1547
- "padding-inline-start": 0,
1548
1642
  "color": "#01689b",
1643
+ "text-decoration": "underline",
1549
1644
  "active": {
1550
- "color": "#42145f",
1551
- "text-decoration": "None"
1552
- },
1553
- "focus": {
1554
- "background-color": "transparent",
1555
- "color": "#01689b",
1556
- "text-decoration": "None"
1645
+ "text-decoration": "none"
1557
1646
  },
1558
1647
  "hover": {
1559
- "color": "#01496c",
1560
- "text-decoration": "None"
1561
- },
1562
- "current": {
1563
- "color": "#334155"
1648
+ "text-decoration": "none"
1564
1649
  },
1565
- "text-decoration": "underline"
1566
- },
1567
- "divider": {
1568
- "size": "24px",
1569
- "color": "#334155",
1570
- "inset-block-start": 0
1650
+ "focus": {
1651
+ "text-decoration": "none"
1652
+ }
1571
1653
  },
1572
- "margin-inline": "0.5rem",
1573
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1574
- "font-weight": 400
1575
- },
1576
- "blockquote": {
1577
- "caption": {
1578
- "font-size": "1.25rem",
1579
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1580
- "line-height": "150%",
1581
- "font-weight": 400,
1582
- "padding-block-start": "0.75rem",
1654
+ "metadata": {
1583
1655
  "color": "#334155"
1584
1656
  },
1585
- "content": {
1586
- "font-family": "RijksoverheidSerifWeb, 'Times New Roman', serif",
1587
- "line-height": "150%",
1588
- "font-weight": 400,
1589
- "font-size": "1.5rem",
1590
- "color": "#0F172A"
1591
- },
1592
- "margin-block-end": 0,
1593
- "margin-block-start": 0,
1594
- "margin-inline-end": 0,
1595
- "margin-inline-start": 0,
1596
- "padding-block-end": "2rem",
1597
- "padding-block-start": "2rem",
1598
- "padding-inline-end": "2rem",
1599
- "padding-inline-start": "2rem",
1600
- "row-gap": "0.75rem",
1601
- "background-color": "transparent",
1602
- "border-color": "#76d2b6",
1603
- "border-block-start-width": 0,
1604
- "border-block-end-width": 0,
1605
- "border-inline-start-width": 0,
1606
- "border-inline-end-width": 0,
1607
- "border-start-start-radius": 0,
1608
- "border-start-end-radius": 0,
1609
- "border-end-start-radius": 0,
1610
- "border-end-end-radius": 0,
1611
- "border-width": "2px",
1612
- "blue-corner-border-variation": {
1613
- "border-color": "#76d2b6",
1614
- "border-block-end-width": "2px",
1615
- "border-inline-end-width": "2px",
1616
- "border-end-end-radius": "3rem"
1617
- },
1618
- "pink-background-variation": {
1619
- "background-color": "#F6BDE1",
1620
- "border-end-start-radius": "3rem",
1621
- "padding": "2.5rem"
1622
- },
1623
- "pink-left-border-variation": {
1624
- "border-color": "#F6BDE1",
1625
- "border-inline-start-width": "0.75rem",
1626
- "padding-inline-start": "2.5rem",
1627
- "padding-inline-end": "2.5rem",
1628
- "padding-block-start": "1.5rem",
1629
- "padding-block-end": "1.5rem"
1630
- },
1631
- "pink-corner-border-variation": {
1632
- "border-color": "#F6BDE1",
1633
- "border-block-start-width": "0.25rem",
1634
- "border-inline-start-width": "0.25rem",
1635
- "border-start-start-radius": "3rem",
1636
- "padding": "2.5rem"
1637
- }
1638
- },
1639
- "article": {
1640
- "max-inline-size": "75ch"
1641
- },
1642
- "alert": {
1643
- "heading": {
1644
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1645
- "font-weight": 700,
1646
- "line-height": "150%",
1647
- "font-size": "1.25rem"
1648
- },
1649
- "column-gap": "0.5rem",
1650
- "border-width": "0px",
1651
- "margin-block-end": "0.75rem",
1652
- "margin-block-start": "0.75rem",
1653
1657
  "padding-block-end": "1rem",
1654
1658
  "padding-block-start": "1rem",
1655
1659
  "padding-inline-end": "1rem",
1656
1660
  "padding-inline-start": "1rem",
1657
- "background-color": "#d9ebf7",
1658
- "border-color": "transparent",
1659
- "color": "#0F172A",
1660
- "info": {
1661
- "background-color": "#d9ebf7",
1662
- "border-color": "transparent",
1663
- "color": "#0F172A"
1661
+ "row-gap": "0.75rem",
1662
+ "active": {
1663
+ "background-color": "#F1F5F9",
1664
+ "text-decoration": "underline"
1664
1665
  },
1665
- "error": {
1666
- "background-color": "#f9dfdd",
1667
- "border-color": "transparent",
1668
- "color": "#0F172A"
1666
+ "hover": {
1667
+ "background-color": "#F8FAFC",
1668
+ "text-decoration": "underline"
1669
1669
  },
1670
- "ok": {
1671
- "background-color": "#e1eddb",
1672
- "border-color": "transparent",
1673
- "color": "#0F172A"
1670
+ "focus": {
1671
+ "background-color": "#dce3ea",
1672
+ "text-decoration": "underline"
1674
1673
  },
1675
- "warning": {
1676
- "background-color": "#fff4db",
1674
+ "full-bleed": {
1675
+ "background-color": "#000",
1677
1676
  "border-color": "transparent",
1678
- "color": "#0F172A"
1677
+ "color": "#fff",
1678
+ "opacity": 0.5
1679
1679
  },
1680
- "icon": {
1681
- "inset-block-start": "3px",
1682
- "info": {
1683
- "color": "#007bc7"
1684
- },
1685
- "error": {
1686
- "color": "#d52b1e"
1687
- },
1688
- "ok": {
1689
- "color": "#39870c"
1690
- },
1691
- "warning": {
1692
- "color": "#ffb612"
1693
- },
1694
- "size": "24px"
1680
+ "heading": {
1681
+ "color": "#154273",
1682
+ "padding-block-start": "0.5rem",
1683
+ "font-size": "1.5rem",
1684
+ "font-weight": 700
1695
1685
  },
1696
- "message": {
1686
+ "horizontal": {
1687
+ "background-color": "#154273",
1688
+ "border-color": "transparent",
1689
+ "color": "#fff",
1690
+ "max-block-size": "96px",
1691
+ "padding-block-end": 0,
1692
+ "padding-block-start": 0,
1693
+ "padding-inline-end": "1rem",
1694
+ "padding-inline-start": "1rem",
1695
+ "heading": {
1696
+ "inline-size": "200px"
1697
+ }
1698
+ }
1699
+ },
1700
+ "accordion": {
1701
+ "button": {
1702
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1703
+ "font-size": "1.25rem",
1704
+ "font-weight": 400,
1697
1705
  "line-height": "150%",
1698
- "column-gap": "0.5rem"
1706
+ "icon": {
1707
+ "margin-block": "0.25rem"
1708
+ },
1709
+ "padding-block-end": "0.75rem",
1710
+ "padding-block-start": "0.75rem",
1711
+ "padding-inline-end": "1rem",
1712
+ "padding-inline-start": "1rem",
1713
+ "expanded": {
1714
+ "background-color": "#fff",
1715
+ "color": "#0F172A"
1716
+ }
1699
1717
  },
1700
- "border-radius": "5px"
1701
- },
1702
- "document": {
1703
- "background-color": "#fff",
1704
- "color": "#0F172A",
1705
- "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1706
- "font-size": "1.25rem",
1707
- "line-height": "150%",
1708
- "font-weight": 400
1709
- },
1710
- "rich-text": {
1711
- "stranger": {
1712
- "margin-block-end": "2rem"
1718
+ "section": {
1719
+ "border-block-end-width": "1px",
1720
+ "border-width": 0,
1721
+ "border-color": "#94A3B8"
1713
1722
  },
1714
- "acquaintance": {
1715
- "margin-block-end": "1rem"
1723
+ "header": {
1724
+ "margin": 0
1716
1725
  },
1717
- "friend": {
1718
- "margin-block-end": "0.5rem"
1726
+ "border-radius": "0px",
1727
+ "color": "#0F172A"
1728
+ },
1729
+ "keep": {
1730
+ "top-left": {
1731
+ "borderRadiusTopLeft": "48px",
1732
+ "borderRadiusTopRight": 0,
1733
+ "borderRadiusBottomRight": 0,
1734
+ "borderRadiusBottomLeft": 0
1719
1735
  },
1720
- "best-friend": {
1721
- "margin-block-end": "0.25rem"
1736
+ "top-right": {
1737
+ "borderRadiusTopRight": "48px",
1738
+ "borderRadiusTopLeft": 0,
1739
+ "borderRadiusBottomRight": 0,
1740
+ "borderRadiusBottomLeft": 0
1722
1741
  },
1723
- "confidant": {
1724
- "margin-block-end": 0
1742
+ "bottom-right": {
1743
+ "borderRadiusTopLeft": 0,
1744
+ "borderRadiusTopRight": 0,
1745
+ "borderRadiusBottomRight": "48px",
1746
+ "borderRadiusBottomLeft": 0
1747
+ },
1748
+ "bottom-left": {
1749
+ "borderRadiusTopLeft": 0,
1750
+ "borderRadiusTopRight": 0,
1751
+ "borderRadiusBottomRight": 0,
1752
+ "borderRadiusBottomLeft": "48px"
1725
1753
  }
1726
1754
  },
1727
- "pointer-target": {
1728
- "min-size": "48px"
1755
+ "border-radius": {
1756
+ "sm": "2.5px",
1757
+ "md": "5px",
1758
+ "keep": "48px",
1759
+ "circle": "999px",
1760
+ "none": "0px"
1729
1761
  },
1730
1762
  "focus": {
1731
- "outline-color": "#76d2b6",
1732
1763
  "outline-offset": "0.125rem",
1733
1764
  "outline-style": "solid",
1734
- "outline-width": "2px",
1735
- "inverse": {
1736
- "outline-color": "transparant"
1765
+ "outline-width": "2px"
1766
+ },
1767
+ "font-size": {
1768
+ "heading": {
1769
+ "level-1": "3.125rem",
1770
+ "level-2": "2.5rem",
1771
+ "level-3": "1.875rem",
1772
+ "level-4": "1.5rem",
1773
+ "level-5": "1.25rem"
1774
+ },
1775
+ "paragraph": {
1776
+ "intro": "1.5rem",
1777
+ "default": "1.25rem",
1778
+ "small": "1.125rem"
1779
+ },
1780
+ "xs": {
1781
+ "desktop": "1.25rem",
1782
+ "tablet": "1.125rem",
1783
+ "mobile": "1rem"
1784
+ },
1785
+ "sm": {
1786
+ "desktop": "1.5rem",
1787
+ "tablet": "1.35rem",
1788
+ "mobile": "1.2rem"
1789
+ },
1790
+ "md": {
1791
+ "desktop": "1.875rem",
1792
+ "tablet": "1.688rem",
1793
+ "mobile": "1.5rem"
1794
+ },
1795
+ "lg": {
1796
+ "desktop": "2.5rem",
1797
+ "tablet": "2.25rem",
1798
+ "mobile": "2rem"
1799
+ },
1800
+ "xl": {
1801
+ "desktop": "3.125rem",
1802
+ "tablet": "2.813rem",
1803
+ "mobile": "2.5rem"
1737
1804
  }
1805
+ },
1806
+ "line-height": {
1807
+ "paragraph": "150%",
1808
+ "sm": "125%",
1809
+ "md": "150%"
1810
+ },
1811
+ "size": {
1812
+ "target": "48px",
1813
+ "icon": {
1814
+ "functional": "24px"
1815
+ },
1816
+ "quarter-lint": "12px",
1817
+ "half-lint": "24px",
1818
+ "lint": "48px",
1819
+ "2-lint": "96px",
1820
+ "3-lint": "1440px"
1821
+ },
1822
+ "font-weight": {
1823
+ "extra-bold": 800,
1824
+ "bold": 700,
1825
+ "semi-bold": 550,
1826
+ "regular": 400,
1827
+ "chosen-regular": 400,
1828
+ "light": 300,
1829
+ "thin": 200
1830
+ },
1831
+ "font-family": {
1832
+ "primary": "Fira Sans, Arial, Verdana, sans-serif",
1833
+ "secondary": "RijksoverheidSerifWeb, 'Times New Roman', serif"
1834
+ },
1835
+ "border-width": {
1836
+ "default": "1px",
1837
+ "m": "2px",
1838
+ "none": "0px"
1839
+ },
1840
+ "space": {
1841
+ "0": 0,
1842
+ "25": "0.125rem",
1843
+ "50": "0.25rem",
1844
+ "100": "0.5rem",
1845
+ "150": "0.75rem",
1846
+ "200": "1rem",
1847
+ "300": "1.5rem",
1848
+ "400": "2rem",
1849
+ "500": "2.5rem",
1850
+ "600": "3rem",
1851
+ "700": "3.5rem"
1738
1852
  }
1739
1853
  },
1740
1854
  "overwrite": {
@@ -1819,6 +1933,40 @@
1819
1933
  "line-height": "150%"
1820
1934
  }
1821
1935
  },
1936
+ "link": {
1937
+ "color": "#01689b",
1938
+ "text-decoration-color": "#01689b",
1939
+ "active": {
1940
+ "color": "#42145f",
1941
+ "text-decoration": "None"
1942
+ },
1943
+ "focus": {
1944
+ "background-color": "transparent",
1945
+ "color": "#01689b",
1946
+ "text-decoration": "None",
1947
+ "text-decoration-thickness": "auto"
1948
+ },
1949
+ "hover": {
1950
+ "color": "#01496c",
1951
+ "text-decoration": "None",
1952
+ "text-decoration-thickness": "auto"
1953
+ },
1954
+ "visited": {
1955
+ "color": "#42145f"
1956
+ },
1957
+ "text-decoration": "underline",
1958
+ "icon": {
1959
+ "inset-block-start": "0.25rem",
1960
+ "size": "24px"
1961
+ },
1962
+ "column-gap": "0.25rem",
1963
+ "text-decoration-thickness": "auto",
1964
+ "text-underline-offset": "0.125rem",
1965
+ "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1966
+ "font-weight": 400,
1967
+ "font-size": "1.25rem",
1968
+ "line-height": "150%"
1969
+ },
1822
1970
  "heading-level-1": {
1823
1971
  "color": "#154273",
1824
1972
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",