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