@rijkshuisstijl-community/design-tokens 4.1.0 → 6.0.0

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