@rijkshuisstijl-community/design-tokens 1.0.0-alpha.16 → 1.0.0-alpha.161

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