@rijkshuisstijl-community/design-tokens 3.0.0 → 4.0.1

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