@rijkshuisstijl-community/design-tokens 1.0.0-alpha.122 → 1.0.0-alpha.123

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 (57) hide show
  1. package/build.mjs +129 -0
  2. package/dist/_variables.scss +497 -501
  3. package/dist/index.css +497 -501
  4. package/dist/index.d.ts +698 -703
  5. package/dist/index.js +698 -702
  6. package/dist/index.json +698 -702
  7. package/dist/index.tokens.json +1607 -1622
  8. package/dist/root.css +497 -501
  9. package/dist/tokens.d.ts +1539 -1554
  10. package/dist/tokens.js +22067 -22164
  11. package/dist/uitvoerend-mintgroen-focus/_variables.scss +1194 -0
  12. package/dist/uitvoerend-mintgroen-focus/index.css +1197 -0
  13. package/dist/uitvoerend-mintgroen-focus/index.d.ts +1195 -0
  14. package/dist/uitvoerend-mintgroen-focus/index.js +1195 -0
  15. package/dist/uitvoerend-mintgroen-focus/index.json +1192 -0
  16. package/dist/uitvoerend-mintgroen-focus/index.tokens.json +1878 -0
  17. package/dist/uitvoerend-mintgroen-focus/root.css +1197 -0
  18. package/dist/uitvoerend-mintgroen-focus/tokens.d.ts +1901 -0
  19. package/dist/uitvoerend-mintgroen-focus/tokens.js +28015 -0
  20. package/dist/uitvoerend-violet/_variables.scss +1187 -0
  21. package/dist/uitvoerend-violet/index.css +1190 -0
  22. package/dist/uitvoerend-violet/index.d.ts +1188 -0
  23. package/dist/uitvoerend-violet/index.js +1188 -0
  24. package/dist/uitvoerend-violet/index.json +1185 -0
  25. package/dist/uitvoerend-violet/index.tokens.json +1835 -0
  26. package/dist/uitvoerend-violet/root.css +1190 -0
  27. package/dist/uitvoerend-violet/tokens.d.ts +1858 -0
  28. package/dist/uitvoerend-violet/tokens.js +27814 -0
  29. package/dist/uitvoerend-violet-oud/_variables.scss +1187 -0
  30. package/dist/uitvoerend-violet-oud/index.css +1190 -0
  31. package/dist/uitvoerend-violet-oud/index.d.ts +1188 -0
  32. package/dist/uitvoerend-violet-oud/index.js +1188 -0
  33. package/dist/uitvoerend-violet-oud/index.json +1185 -0
  34. package/dist/uitvoerend-violet-oud/index.tokens.json +1835 -0
  35. package/dist/uitvoerend-violet-oud/root.css +1190 -0
  36. package/dist/uitvoerend-violet-oud/tokens.d.ts +1858 -0
  37. package/dist/uitvoerend-violet-oud/tokens.js +27814 -0
  38. package/dist/wetgevend/_variables.scss +1187 -0
  39. package/dist/wetgevend/index.css +1190 -0
  40. package/dist/wetgevend/index.d.ts +1188 -0
  41. package/dist/wetgevend/index.js +1188 -0
  42. package/dist/wetgevend/index.json +1185 -0
  43. package/dist/wetgevend/index.tokens.json +1835 -0
  44. package/dist/wetgevend/root.css +1190 -0
  45. package/dist/wetgevend/tokens.d.ts +1858 -0
  46. package/dist/{tokens.json → wetgevend/tokens.js} +21898 -22097
  47. package/figma/figma.tokens.json +628 -4
  48. package/package.json +3 -4
  49. package/src/generated/themes.json +22266 -0
  50. package/src/generated/uitvoerend-mintgroen-focus/tokens.json +5610 -0
  51. package/src/generated/uitvoerend-violet/tokens.json +5546 -0
  52. package/src/generated/uitvoerend-violet-oud/tokens.json +5546 -0
  53. package/src/generated/wetgevend/tokens.json +5546 -0
  54. package/token-transformer.mjs +77 -41
  55. package/dist/variables.less +0 -1196
  56. package/style-dictionary.config.json +0 -105
  57. /package/src/generated/{figma.tokens.json → base.tokens.json} +0 -0
package/dist/root.css CHANGED
@@ -1,500 +1,14 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 20 Jan 2025 13:28:33 GMT
3
+ * Generated on Tue, 21 Jan 2025 13:16:09 GMT
4
4
  */
5
5
 
6
6
  :root {
7
- --rhc-space-700: 3.5rem;
8
- --rhc-space-600: 3rem;
9
- --rhc-space-500: 2.5rem;
10
- --rhc-space-400: 2rem;
11
- --rhc-space-300: 1.5rem;
12
- --rhc-space-200: 1rem;
13
- --rhc-space-150: 0.75rem;
14
- --rhc-space-100: 0.5rem;
15
- --rhc-space-50: 0.25rem;
16
- --rhc-space-25: 0.125rem;
17
- --rhc-space-0: 0;
18
- --rhc-border-width-none: 0px;
19
- --rhc-border-width-m: 2px;
20
- --rhc-border-width-default: 1px;
21
- --rhc-font-family-secondary: RijksoverheidSerifWeb, 'Times New Roman', serif;
22
- --rhc-font-family-primary: Fira Sans, Arial, Verdana, sans-serif;
23
- --rhc-font-weight-thin: 200;
24
- --rhc-font-weight-light: 300;
25
- --rhc-font-weight-chosen-regular: 400;
26
- --rhc-font-weight-regular: 400;
27
- --rhc-font-weight-semi-bold: 550;
28
- --rhc-font-weight-bold: 700;
29
- --rhc-font-weight-extra-bold: 800;
30
- --rhc-size-3-lint: 1440px;
31
- --rhc-size-2-lint: 96px;
32
- --rhc-size-lint: 48px;
33
- --rhc-size-half-lint: 24px;
34
- --rhc-size-quarter-lint: 12px;
35
- --rhc-size-icon-functional: 24px;
36
- --rhc-size-target: 48px;
37
- --rhc-line-height-md: 150%;
38
- --rhc-line-height-sm: 125%;
39
- --rhc-line-height-paragraph: 150%;
40
- --rhc-font-size-xl-mobile: 2.5rem;
41
- --rhc-font-size-xl-tablet: 2.813rem;
42
- --rhc-font-size-xl-desktop: 3.125rem;
43
- --rhc-font-size-lg-mobile: 2rem;
44
- --rhc-font-size-lg-tablet: 2.25rem;
45
- --rhc-font-size-lg-desktop: 2.5rem;
46
- --rhc-font-size-md-mobile: 1.5rem;
47
- --rhc-font-size-md-tablet: 1.688rem;
48
- --rhc-font-size-md-desktop: 1.875rem;
49
- --rhc-font-size-sm-mobile: 1.2rem;
50
- --rhc-font-size-sm-tablet: 1.35rem;
51
- --rhc-font-size-sm-desktop: 1.5rem;
52
- --rhc-font-size-xs-mobile: 1rem;
53
- --rhc-font-size-xs-tablet: 1.125rem;
54
- --rhc-font-size-xs-desktop: 1.25rem;
55
- --rhc-font-size-paragraph-small: 1.125rem;
56
- --rhc-font-size-paragraph-default: 1.25rem;
57
- --rhc-font-size-paragraph-intro: 1.5rem;
58
- --rhc-font-size-heading-level-5: 1.25rem;
59
- --rhc-font-size-heading-level-4: 1.5rem;
60
- --rhc-font-size-heading-level-3: 1.875rem;
61
- --rhc-font-size-heading-level-2: 2.5rem;
62
- --rhc-font-size-heading-level-1: 3.125rem;
63
- --rhc-focus-outline-width: 2px;
64
- --rhc-focus-outline-style: solid;
65
- --rhc-focus-outline-offset: 0.125rem;
66
- --rhc-color-none: transparent;
67
- --rhc-color-zwart: #000;
68
- --rhc-color-wit: #fff;
69
- --rhc-color-lintblauw-500: #154273;
70
- --rhc-color-lintblauw-400: #4f7196;
71
- --rhc-color-lintblauw-300: #738eab;
72
- --rhc-color-lintblauw-200: #95a9c0;
73
- --rhc-color-lintblauw-100: #b8c6d5;
74
- --rhc-color-lintblauw-50: #dce3ea;
75
- --rhc-color-robijnrood-500: #ca005d;
76
- --rhc-color-robijnrood-400: #D74085;
77
- --rhc-color-robijnrood-300: #DF669D;
78
- --rhc-color-robijnrood-200: #E78CB6;
79
- --rhc-color-robijnrood-100: #efb3ce;
80
- --rhc-color-robijnrood-50: #f7d9e7;
81
- --rhc-color-roze-500: #f092cd;
82
- --rhc-color-roze-400: #F4ADD9;
83
- --rhc-color-roze-300: #F6BDE1;
84
- --rhc-color-roze-200: #F8CEE8;
85
- --rhc-color-roze-100: #fbdef0;
86
- --rhc-color-roze-50: #fdeff8;
87
- --rhc-color-rood-500: #d52b1e;
88
- --rhc-color-rood-400: #DF6056;
89
- --rhc-color-rood-300: #E67F78;
90
- --rhc-color-rood-200: #EC9F99;
91
- --rhc-color-rood-100: #f2bfbc;
92
- --rhc-color-rood-50: #f9dfdd;
93
- --rhc-color-oranje-500: #e17000;
94
- --rhc-color-oranje-400: #E89440;
95
- --rhc-color-oranje-300: #EDA966;
96
- --rhc-color-oranje-200: #F1BE8C;
97
- --rhc-color-oranje-100: #f6d4b3;
98
- --rhc-color-oranje-50: #fbead9;
99
- --rhc-color-donkergeel-500: #ffb612;
100
- --rhc-color-donkergeel-400: #FDC84D;
101
- --rhc-color-donkergeel-300: #FDD370;
102
- --rhc-color-donkergeel-200: #FDDE94;
103
- --rhc-color-donkergeel-100: #ffe9b8;
104
- --rhc-color-donkergeel-50: #fff4db;
105
- --rhc-color-geel-500: #f9e11e;
106
- --rhc-color-geel-400: #FAE856;
107
- --rhc-color-geel-300: #FBED78;
108
- --rhc-color-geel-200: #FCF199;
109
- --rhc-color-geel-100: #fdf6bc;
110
- --rhc-color-geel-50: #fefbdd;
111
- --rhc-color-donkerbruin-500: #673327;
112
- --rhc-color-donkerbruin-400: #8D665D;
113
- --rhc-color-donkerbruin-300: #A3847D;
114
- --rhc-color-donkerbruin-200: #BAA39D;
115
- --rhc-color-donkerbruin-100: #d1c2be;
116
- --rhc-color-donkerbruin-50: #e8e0df;
117
- --rhc-color-bruin-500: #94710a;
118
- --rhc-color-bruin-400: #AF9447;
119
- --rhc-color-bruin-300: #BFA96C;
120
- --rhc-color-bruin-200: #CFBF90;
121
- --rhc-color-bruin-100: #dfd4b6;
122
- --rhc-color-bruin-50: #efeada;
123
- --rhc-color-donkergroen-500: #275937;
124
- --rhc-color-donkergroen-400: #5D8269;
125
- --rhc-color-donkergroen-300: #7D9B87;
126
- --rhc-color-donkergroen-200: #9DB4A4;
127
- --rhc-color-donkergroen-100: #becdc3;
128
- --rhc-color-donkergroen-50: #dfe6e1;
129
- --rhc-color-groen-500: #39870c;
130
- --rhc-color-groen-400: #6AA549;
131
- --rhc-color-groen-300: #88B76D;
132
- --rhc-color-groen-200: #A5C991;
133
- --rhc-color-groen-100: #c4dbb6;
134
- --rhc-color-groen-50: #e1eddb;
135
- --rhc-color-mosgroen-500: #777b00;
136
- --rhc-color-mosgroen-400: #999C40;
137
- --rhc-color-mosgroen-300: #ADAF66;
138
- --rhc-color-mosgroen-200: #C1C38C;
139
- --rhc-color-mosgroen-100: #d6d7b3;
140
- --rhc-color-mosgroen-50: #ebebd9;
141
- --rhc-color-mintgroen-500: #76d2b6;
142
- --rhc-color-mintgroen-400: #98DDC8;
143
- --rhc-color-mintgroen-300: #ACE4D3;
144
- --rhc-color-mintgroen-200: #C1EBDE;
145
- --rhc-color-mintgroen-100: #d6f2e9;
146
- --rhc-color-mintgroen-50: #eaf8f4;
147
- --rhc-color-donkerblauw-500: #01689b;
148
- --rhc-color-donkerblauw-400: #408EB4;
149
- --rhc-color-donkerblauw-300: #66A4C3;
150
- --rhc-color-donkerblauw-200: #8CBBD2;
151
- --rhc-color-donkerblauw-100: #b3d2e1;
152
- --rhc-color-donkerblauw-50: #d9e8f0;
153
- --rhc-color-hemelblauw-500: #007bc7;
154
- --rhc-color-hemelblauw-400: #409CD5;
155
- --rhc-color-hemelblauw-300: #66AFDD;
156
- --rhc-color-hemelblauw-200: #8CC3E6;
157
- --rhc-color-hemelblauw-100: #b3d7ee;
158
- --rhc-color-hemelblauw-50: #d9ebf7;
159
- --rhc-color-paars-500: #42145f;
160
- --rhc-color-paars-400: #714f87;
161
- --rhc-color-paars-300: #8D729F;
162
- --rhc-color-paars-200: #A995B7;
163
- --rhc-color-paars-100: #c6b9cf;
164
- --rhc-color-paars-50: #e3dce7;
165
- --rhc-color-violet-500: #a90061;
166
- --rhc-color-violet-400: #BE4088;
167
- --rhc-color-violet-300: #CB66A0;
168
- --rhc-color-violet-200: #D88CB7;
169
- --rhc-color-violet-100: #e5b3d0;
170
- --rhc-color-violet-50: #f2d9e7;
171
- --rhc-color-lichtblauw-500: #8fcae7;
172
- --rhc-color-lichtblauw-400: #ABD7ED;
173
- --rhc-color-lichtblauw-300: #BCDFF0;
174
- --rhc-color-lichtblauw-200: #CCE7F4;
175
- --rhc-color-lichtblauw-100: #ddeff8;
176
- --rhc-color-lichtblauw-50: #eef7fb;
177
- --rhc-color-grijs-900: #0F172A;
178
- --rhc-color-grijs-800: #1E293B;
179
- --rhc-color-grijs-700: #334155;
180
- --rhc-color-grijs-600: #475569;
181
- --rhc-color-grijs-500: #64748B;
182
- --rhc-color-grijs-400: #94A3B8;
183
- --rhc-color-grijs-300: #CBD5E1;
184
- --rhc-color-grijs-200: #E2E8F0;
185
- --rhc-color-grijs-100: #F1F5F9;
186
- --rhc-color-grijs-50: #F8FAFC;
187
- --rhc-color-primary-hover: #162f50;
188
- --rhc-color-primary-500: #154273;
189
- --rhc-color-primary-400: #4f7196;
190
- --rhc-color-primary-300: #738eab;
191
- --rhc-color-primary-200: #95a9c0;
192
- --rhc-color-primary-100: #b8c6d5;
193
- --rhc-color-primary-50: #dce3ea;
194
- --rhc-color-accent-500: #8fcae7;
195
- --rhc-color-feedback-warning-subdued: #fff4db;
196
- --rhc-color-feedback-warning-default: #ffb612;
197
- --rhc-color-feedback-error-subdued: #f9dfdd;
198
- --rhc-color-feedback-error-default: #d52b1e;
199
- --rhc-color-feedback-info-subdued: #d9ebf7;
200
- --rhc-color-feedback-info-default: #007bc7;
201
- --rhc-color-feedback-success-subdued: #e1eddb;
202
- --rhc-color-feedback-success-default: #39870c;
203
- --rhc-color-canvas: #fff;
204
- --rhc-color-border-strong: #000;
205
- --rhc-color-border-subdued: #94A3B8;
206
- --rhc-color-border-default: #64748B;
207
- --rhc-color-foreground-link: #01689b;
208
- --rhc-color-foreground-on-emphasis: #fff;
209
- --rhc-color-foreground-subdued: #334155;
210
- --rhc-color-foreground-lint: #154273;
211
- --rhc-color-foreground-default: #000;
212
- --rhc-color-focus-outline: #000;
213
- --rhc-border-radius-none: 0px;
214
- --rhc-border-radius-circle: 999px;
215
- --rhc-border-radius-keep: 48px;
216
- --rhc-border-radius-md: 5px;
217
- --rhc-border-radius-sm: 2.5px;
218
- --rhc-keep-bottom-left-border-radius-bottom-left: 48px;
219
- --rhc-keep-bottom-left-border-radius-bottom-right: 0;
220
- --rhc-keep-bottom-left-border-radius-top-right: 0;
221
- --rhc-keep-bottom-left-border-radius-top-left: 0;
222
- --rhc-keep-bottom-right-border-radius-bottom-left: 0;
223
- --rhc-keep-bottom-right-border-radius-bottom-right: 48px;
224
- --rhc-keep-bottom-right-border-radius-top-right: 0;
225
- --rhc-keep-bottom-right-border-radius-top-left: 0;
226
- --rhc-keep-top-right-border-radius-bottom-left: 0;
227
- --rhc-keep-top-right-border-radius-bottom-right: 0;
228
- --rhc-keep-top-right-border-radius-top-left: 0;
229
- --rhc-keep-top-right-border-radius-top-right: 48px;
230
- --rhc-keep-top-left-border-radius-bottom-left: 0;
231
- --rhc-keep-top-left-border-radius-bottom-right: 0;
232
- --rhc-keep-top-left-border-radius-top-right: 0;
233
- --rhc-keep-top-left-border-radius-top-left: 48px;
234
- --rhc-accordion-color: #154273;
235
- --rhc-accordion-border-radius: 0px;
236
- --rhc-accordion-header-margin: 0;
237
- --rhc-accordion-section-border-color: #94A3B8;
238
- --rhc-accordion-section-border-width: 0;
239
- --rhc-accordion-section-border-block-end-width: 1px;
240
- --rhc-accordion-button-expanded-color: #154273;
241
- --rhc-accordion-button-expanded-background-color: #fff;
242
- --rhc-accordion-button-padding-inline-start: 1rem;
243
- --rhc-accordion-button-padding-inline-end: 1rem;
244
- --rhc-accordion-button-padding-block-start: 0.75rem;
245
- --rhc-accordion-button-padding-block-end: 0.75rem;
246
- --rhc-accordion-button-icon-margin-block: 0.25rem;
247
- --rhc-accordion-button-line-height: 150%;
248
- --rhc-accordion-button-font-weight: 400;
249
- --rhc-accordion-button-font-size: 1.25rem;
250
- --rhc-accordion-button-font-family: Fira Sans, Arial, Verdana, sans-serif;
251
- --rhc-card-as-link-horizontal-heading-inline-size: 200px;
252
- --rhc-card-as-link-horizontal-padding-inline-start: 1rem;
253
- --rhc-card-as-link-horizontal-padding-inline-end: 1rem;
254
- --rhc-card-as-link-horizontal-padding-block-start: 0;
255
- --rhc-card-as-link-horizontal-padding-block-end: 0;
256
- --rhc-card-as-link-horizontal-max-block-size: 96px;
257
- --rhc-card-as-link-horizontal-color: #fff;
258
- --rhc-card-as-link-horizontal-border-color: transparent;
259
- --rhc-card-as-link-horizontal-background-color: #154273;
260
- --rhc-card-as-link-heading-font-weight: 700;
261
- --rhc-card-as-link-heading-font-size: 1.5rem;
262
- --rhc-card-as-link-heading-padding-block-start: 0.5rem;
263
- --rhc-card-as-link-full-bleed-opacity: 0.5;
264
- --rhc-card-as-link-full-bleed-color: #fff;
265
- --rhc-card-as-link-full-bleed-border-color: transparent;
266
- --rhc-card-as-link-full-bleed-background-color: #000;
267
- --rhc-card-as-link-focus-text-decoration: underline;
268
- --rhc-card-as-link-focus-background-color: #dce3ea;
269
- --rhc-card-as-link-hover-text-decoration: underline;
270
- --rhc-card-as-link-hover-background-color: #F8FAFC;
271
- --rhc-card-as-link-active-text-decoration: underline;
272
- --rhc-card-as-link-active-background-color: #F1F5F9;
273
- --rhc-card-as-link-row-gap: 0.75rem;
274
- --rhc-card-as-link-padding-inline-start: 1rem;
275
- --rhc-card-as-link-padding-inline-end: 1rem;
276
- --rhc-card-as-link-padding-block-start: 1rem;
277
- --rhc-card-as-link-padding-block-end: 1rem;
278
- --rhc-card-as-link-metadata-color: #154273;
279
- --rhc-card-as-link-link-focus-text-decoration: none;
280
- --rhc-card-as-link-link-hover-text-decoration: none;
281
- --rhc-card-as-link-link-active-text-decoration: none;
282
- --rhc-card-as-link-link-text-decoration: underline;
283
- --rhc-card-as-link-link-color: #01689b;
284
- --rhc-card-as-link-icon-size: 24px;
285
- --rhc-card-as-link-icon-color: #154273;
286
- --rhc-card-as-link-inline-size: 328px;
287
- --rhc-card-as-link-column-gap: 1rem;
288
- --rhc-card-as-link-color: #154273;
289
- --rhc-card-as-link-border-width: 1px;
290
- --rhc-card-as-link-border-radius: 5px;
291
- --rhc-card-as-link-border-color: #CBD5E1;
292
- --rhc-card-as-link-background-color: #fff;
293
- --rhc-checkbox-group-row-gap: 1rem;
294
- --rhc-checkbox-group-padding-block-start: 0.5rem;
295
- --rhc-checkbox-group-padding-block-end: 0.5rem;
296
- --rhc-code-input-group-column-gap: 0.5rem;
297
- --rhc-code-input-size: 48px;
298
- --rhc-dot-badge-size: 12px;
299
- --rhc-dot-badge-color: #d52b1e;
300
- --rhc-dot-badge-border-radius: 999px;
301
- --rhc-file-subtitle-color: #64748B;
302
- --rhc-file-error-border-color: #d52b1e;
303
- --rhc-file-column-gap: 0.25rem;
304
- --rhc-file-padding-block-end: 0.75rem;
305
- --rhc-file-padding-block-start: 0.75rem;
306
- --rhc-file-padding-inline-end: 1rem;
307
- --rhc-file-padding-inline-start: 1rem;
308
- --rhc-file-border-radius: 5px;
309
- --rhc-file-border-width: 1px;
310
- --rhc-file-border-color: #154273;
311
- --rhc-file-border-style: solid;
312
- --rhc-file-input-feedback-font-size: 1rem;
313
- --rhc-file-input-feedback-color: #475569;
314
- --rhc-file-input-row-gap: 0.75rem;
315
- --rhc-file-input-column-gap: 0.75rem;
316
- --rhc-page-footer-flex-direction: row;
317
- --rhc-page-footer-padding-inline-start: 2.5rem;
318
- --rhc-page-footer-padding-block-end: 2.5rem;
319
- --rhc-page-footer-padding-block-start: 2.5rem;
320
- --rhc-page-footer-border-block-start-style: solid;
321
- --rhc-page-footer-border-block-start-color: #154273;
322
- --rhc-page-footer-border-block-start-width: 2px;
323
- --rhc-page-footer-content-padding-inline-end: 1rem;
324
- --rhc-page-footer-content-padding-inline-start: 1rem;
325
- --rhc-page-footer-content-max-inline-size: 1280px;
326
- --rhc-page-footer-column-title-margin-block-end: 0.75rem;
327
- --rhc-page-footer-column-width: 200px;
328
- --rhc-page-footer-column-gap: 1.5rem;
329
- --rhc-form-field-checkbox-option-margin-block-end: 0;
330
- --rhc-form-field-checkbox-option-column-gap: 0.5rem;
331
- --rhc-form-field-radio-option-input-margin-block-start: 0.25rem;
332
- --rhc-form-field-radio-option-label-margin-block-end: 0;
333
- --rhc-form-field-radio-option-row-gap: 0.5rem;
334
- --rhc-form-field-radio-option-font-weight: 400;
335
- --rhc-form-field-radio-option-column-gap: 0.5rem;
336
- --rhc-hero-inline-size: 100%;
337
- --rhc-hero-border-radius: 40px;
338
- --rhc-hero-message-inline-size: 90%;
339
- --rhc-hero-message-border-radius: 20px;
340
- --rhc-hero-message-padding-block-start: 1rem;
341
- --rhc-hero-message-padding-inline-start: 1rem;
342
- --rhc-hero-message-padding-inline-end: 1rem;
343
- --rhc-hero-message-padding-block-end: 1rem;
344
- --rhc-hero-message-row-gap: 0.125rem;
345
- --rhc-hero-message-color: #fff;
346
- --rhc-hero-message-background-color: #154273;
347
- --rhc-hero-sub-heading-font-family: Fira Sans, Arial, Verdana, sans-serif;
348
- --rhc-hero-sub-heading-font-size: 1.25rem;
349
- --rhc-hero-sub-heading-line-height: 150%;
350
- --rhc-hero-sub-heading-font-weight: 400;
351
- --rhc-hero-heading-font-family: Fira Sans, Arial, Verdana, sans-serif;
352
- --rhc-hero-heading-font-size: 1.875rem;
353
- --rhc-hero-heading-line-height: 125%;
354
- --rhc-hero-heading-font-weight: 700;
355
- --rhc-icon-only-button-padding-inline-start: 0.75rem;
356
- --rhc-icon-only-button-padding-inline-end: 0.75rem;
357
- --rhc-icon-only-button-padding-block-start: 0.75rem;
358
- --rhc-icon-only-button-padding-block-end: 0.75rem;
359
- --rhc-link-list-text-decoration: None;
360
- --rhc-link-list-card-padding-inline-end: 1.5rem;
361
- --rhc-link-list-card-padding-inline-start: 1.5rem;
362
- --rhc-link-list-card-row-gap: 1rem;
363
- --rhc-link-list-card-padding-block-end: 1.5rem;
364
- --rhc-link-list-card-padding-block-start: 1.5rem;
365
- --rhc-link-list-card-background-color: #fff;
366
- --rhc-logo-color: #154273;
367
- --rhc-logo-font-family: Fira Sans, Arial, Verdana, sans-serif;
368
- --rhc-logo-column-gap: 12px;
369
- --rhc-logo-subtitle-font-size: 0.775rem;
370
- --rhc-logo-subtitle-line-height: 1rem;
371
- --rhc-logo-subtitle-font-weight: 400;
372
- --rhc-logo-title-padding-block-start: 3.125rem;
373
- --rhc-logo-title-font-size: 0.913rem;
374
- --rhc-logo-title-line-height: 1.063rem;
375
- --rhc-logo-title-font-weight: 600;
376
- --rhc-logo-image-color: #154273;
377
- --rhc-logo-image-block-size: 96px;
378
- --rhc-logo-image-inline-size: 48px;
379
- --rhc-logo-image-background-color: #fff;
380
- --rhc-message-list-item-heading-color: #154273;
381
- --rhc-message-list-item-label-line-height: 150%;
382
- --rhc-message-list-item-label-font-weight: 700;
383
- --rhc-message-list-item-label-font-size: 1.25rem;
384
- --rhc-message-list-item-label-font-family: Fira Sans, Arial, Verdana, sans-serif;
385
- --rhc-message-list-item-content-row-gap: 0.5rem;
386
- --rhc-message-list-item-content-column-gap: 0.5rem;
387
- --rhc-message-list-item-padding-inline: 1rem;
388
- --rhc-message-list-item-padding-block: 0.75rem;
389
- --rhc-message-list-item-min-height: 48px;
390
- --rhc-message-list-item-icon-color: #154273;
391
- --rhc-message-list-item-icon-size: 24px;
392
- --rhc-message-list-item-column-gap: 1rem;
393
- --rhc-message-list-item-color: #334155;
394
- --rhc-message-list-item-border-width: 1px;
395
- --rhc-message-list-item-border-color: #CBD5E1;
396
- --rhc-message-list-item-background-color: #fff;
397
- --rhc-nav-bar-border-color: #64748B;
398
- --rhc-nav-bar-color: #154273;
399
- --rhc-nav-bar-background-color: #fff;
400
- --rhc-nav-bar-heading-font-weight: 700;
401
- --rhc-nav-bar-link-column-gap: 0.5rem;
402
- --rhc-nav-bar-link-padding-inline-start: 0.75rem;
403
- --rhc-nav-bar-link-padding-inline-end: 0.75rem;
404
- --rhc-nav-bar-link-padding-block-start: 1rem;
405
- --rhc-nav-bar-link-padding-block-end: 1rem;
406
- --rhc-nav-bar-link-hover-color: #154273;
407
- --rhc-nav-bar-link-hover-background-color: #F8FAFC;
408
- --rhc-nav-bar-link-focus-color: #154273;
409
- --rhc-nav-bar-link-focus-background-color: #dce3ea;
410
- --rhc-nav-bar-link-color: #154273;
411
- --rhc-nav-bar-link-background-color: #fff;
412
- --rhc-nav-bar-link-active-color: #fff;
413
- --rhc-nav-bar-link-active-background-color: #154273;
414
- --rhc-nav-bar-icon-size: 24px;
415
- --rhc-nav-bar-icon-active-color: #fff;
416
- --rhc-nav-bar-icon-color: #154273;
417
- --rhc-nav-bar-content-column-gap: 1rem;
418
- --rhc-nav-bar-container-inline-size: 100%;
419
- --rhc-nav-bar-padding-inline: 1rem;
420
- --rhc-nav-bar-max-inline-size: 1280px;
421
- --rhc-nav-bar-border-block-end-width: 1px;
422
- --rhc-navigation-list-item-padding-inline: 1rem;
423
- --rhc-navigation-list-item-padding-block: 0.75rem;
424
- --rhc-navigation-list-item-min-height: 48px;
425
- --rhc-navigation-list-item-column-gap: 1rem;
426
- --rhc-navigation-list-item-heading-color: #154273;
427
- --rhc-navigation-list-item-border-color: #CBD5E1;
428
- --rhc-navigation-list-item-border-width: 1px;
429
- --rhc-navigation-list-item-color: #334155;
430
- --rhc-navigation-list-item-background-color: #fff;
431
- --rhc-navigation-list-item-focus-background-color: #dce3ea;
432
- --rhc-navigation-list-item-hover-background-color: #F8FAFC;
433
- --rhc-navigation-list-item-active-background-color: #F1F5F9;
434
- --rhc-navigation-list-item-label-line-height: 150%;
435
- --rhc-navigation-list-item-label-font-weight: 700;
436
- --rhc-navigation-list-item-label-font-size: 1.875rem;
437
- --rhc-navigation-list-item-label-font-family: Fira Sans, Arial, Verdana, sans-serif;
438
- --rhc-navigation-list-item-content-row-gap: 0.25rem;
439
- --rhc-navigation-list-item-content-column-gap: 0.5rem;
440
- --rhc-navigation-list-item-icon-size: 24px;
441
- --rhc-navigation-list-item-icon-padding-block: 0.5rem;
442
- --rhc-navigation-list-item-icon-padding-inline: 0.5rem;
443
- --rhc-navigation-list-icon-color: #fff;
444
- --rhc-navigation-list-icon-border-radius: 999px;
445
- --rhc-navigation-list-icon-background-color: #154273;
446
- --rhc-radio-group-row-gap: 1rem;
447
- --rhc-radio-group-padding-block-start: 0.5rem;
448
- --rhc-radio-group-padding-block-end: 0.5rem;
449
- --rhc-sidenav-link-column-gap: 0.5rem;
450
- --rhc-sidenav-link-text-decoration: None;
451
- --rhc-sidenav-link-padding-block-end: 0.75rem;
452
- --rhc-sidenav-link-padding-block-start: 0.75rem;
453
- --rhc-sidenav-link-hover-text-decoration: underline;
454
- --rhc-sidenav-link-hover-color: #15496a;
455
- --rhc-sidenav-link-focus-text-decoration: None;
456
- --rhc-sidenav-link-focus-color: #01689b;
457
- --rhc-sidenav-link-focus-background-color: none;
458
- --rhc-sidenav-link-focus-border-color: #154273;
459
- --rhc-sidenav-link-focus-border-style: solid;
460
- --rhc-sidenav-link-focus-border-width: 2px;
461
- --rhc-sidenav-link-focus-border-radius: 5px;
462
- --rhc-sidenav-link-active-text-decoration: underline;
463
- --rhc-sidenav-link-active-color: #42145f;
464
- --rhc-sidenav-link-color: #01689b;
465
- --rhc-sidenav-link-current-color: #154273;
466
- --rhc-sidenav-link-current-font-weight: 700;
467
- --rhc-sidenav-link-font-weight: 400;
468
- --rhc-sidenav-link-font-family: Fira Sans, Arial, Verdana, sans-serif;
469
- --rhc-sidenav-link-font-size: 1.25rem;
470
- --rhc-sidenav-link-icon-margin-inline: 0.5rem;
471
- --rhc-sidenav-link-icon-size: 24px;
472
- --rhc-sidenav-link-line-height: 150%;
473
- --rhc-sidenav-display: flex;
474
- --rhc-toggletip-focus-background-color: #007bc7;
475
- --rhc-toggletip-focus-color: #fff;
476
- --rhc-toggletip-hover-background-color: #66AFDD;
477
- --rhc-toggletip-hover-color: #154273;
478
- --rhc-toggletip-active-border-color: #007bc7;
479
- --rhc-toggletip-active-background-color: #fff;
480
- --rhc-toggletip-active-color: #007bc7;
481
- --rhc-toggletip-size: 24px;
482
- --rhc-toggletip-icon-size: 24px;
483
- --rhc-toggletip-border-width: 1px;
484
- --rhc-toggletip-border-radius: 5px;
485
- --rhc-toggletip-border-color: transparent;
486
- --rhc-toggletip-background-color: #007bc7;
487
- --rhc-toggletip-color: #fff;
488
- --rhc-sub-nav-bar-content-list-row-gap: 0.5rem;
489
- --rhc-sub-nav-bar-content-max-inline-size: 1280px;
490
- --rhc-sub-nav-bar-content-padding-inline-start: 1rem;
491
- --rhc-sub-nav-bar-content-padding-inline-end: 1rem;
492
- --rhc-sub-nav-bar-inline-size: 100%;
493
- --rhc-sub-nav-bar-padding-block-start: 2rem;
494
- --rhc-sub-nav-bar-padding-block-end: 2rem;
495
- --rhc-sub-nav-bar-column-width: 375px;
496
- --rhc-sub-nav-bar-column-gap: 0.5rem;
497
- --rhc-sub-nav-bar-background-color: #f2f4f6;
7
+ --utrecht-focus-inverse-outline-color: transparant;
8
+ --utrecht-focus-outline-width: 2px;
9
+ --utrecht-focus-outline-style: solid;
10
+ --utrecht-focus-outline-offset: 0.125rem;
11
+ --utrecht-focus-outline-color: #000;
498
12
  --utrecht-pointer-target-min-size: 48px;
499
13
  --utrecht-rich-text-confidant-margin-block-end: 0;
500
14
  --utrecht-rich-text-best-friend-margin-block-end: 0.25rem;
@@ -1187,13 +701,495 @@
1187
701
  --utrecht-icon-inset-block-start: 0;
1188
702
  --utrecht-icon-size: 24px;
1189
703
  --utrecht-icon-color: inherit;
1190
- --utrecht-focus-inverse-outline-color: transparant;
1191
- --utrecht-focus-outline-width: 2px;
1192
- --utrecht-focus-outline-style: solid;
1193
- --utrecht-focus-outline-offset: 0.125rem; /* This is only for buttons. Form fields (input, select and textarea) and links do not have an offset */
1194
- --utrecht-focus-outline-color: #000;
1195
- --utrecht-action-submit-cursor: pointer;
1196
- --utrecht-action-disabled-cursor: not-allowed;
1197
- --utrecht-action-busy-cursor: wait;
1198
- --utrecht-action-activate-cursor: pointer;
704
+ --rhc-space-700: 3.5rem;
705
+ --rhc-space-600: 3rem;
706
+ --rhc-space-500: 2.5rem;
707
+ --rhc-space-400: 2rem;
708
+ --rhc-space-300: 1.5rem;
709
+ --rhc-space-200: 1rem;
710
+ --rhc-space-150: 0.75rem;
711
+ --rhc-space-100: 0.5rem;
712
+ --rhc-space-50: 0.25rem;
713
+ --rhc-space-25: 0.125rem;
714
+ --rhc-space-0: 0;
715
+ --rhc-border-width-none: 0px;
716
+ --rhc-border-width-m: 2px;
717
+ --rhc-border-width-default: 1px;
718
+ --rhc-font-family-secondary: RijksoverheidSerifWeb, 'Times New Roman', serif;
719
+ --rhc-font-family-primary: Fira Sans, Arial, Verdana, sans-serif;
720
+ --rhc-font-weight-thin: 200;
721
+ --rhc-font-weight-light: 300;
722
+ --rhc-font-weight-chosen-regular: 400;
723
+ --rhc-font-weight-regular: 400;
724
+ --rhc-font-weight-semi-bold: 550;
725
+ --rhc-font-weight-bold: 700;
726
+ --rhc-font-weight-extra-bold: 800;
727
+ --rhc-size-3-lint: 1440px;
728
+ --rhc-size-2-lint: 96px;
729
+ --rhc-size-lint: 48px;
730
+ --rhc-size-half-lint: 24px;
731
+ --rhc-size-quarter-lint: 12px;
732
+ --rhc-size-icon-functional: 24px;
733
+ --rhc-size-target: 48px;
734
+ --rhc-line-height-md: 150%;
735
+ --rhc-line-height-sm: 125%;
736
+ --rhc-line-height-paragraph: 150%;
737
+ --rhc-font-size-xl-mobile: 2.5rem;
738
+ --rhc-font-size-xl-tablet: 2.813rem;
739
+ --rhc-font-size-xl-desktop: 3.125rem;
740
+ --rhc-font-size-lg-mobile: 2rem;
741
+ --rhc-font-size-lg-tablet: 2.25rem;
742
+ --rhc-font-size-lg-desktop: 2.5rem;
743
+ --rhc-font-size-md-mobile: 1.5rem;
744
+ --rhc-font-size-md-tablet: 1.688rem;
745
+ --rhc-font-size-md-desktop: 1.875rem;
746
+ --rhc-font-size-sm-mobile: 1.2rem;
747
+ --rhc-font-size-sm-tablet: 1.35rem;
748
+ --rhc-font-size-sm-desktop: 1.5rem;
749
+ --rhc-font-size-xs-mobile: 1rem;
750
+ --rhc-font-size-xs-tablet: 1.125rem;
751
+ --rhc-font-size-xs-desktop: 1.25rem;
752
+ --rhc-font-size-paragraph-small: 1.125rem;
753
+ --rhc-font-size-paragraph-default: 1.25rem;
754
+ --rhc-font-size-paragraph-intro: 1.5rem;
755
+ --rhc-font-size-heading-level-5: 1.25rem;
756
+ --rhc-font-size-heading-level-4: 1.5rem;
757
+ --rhc-font-size-heading-level-3: 1.875rem;
758
+ --rhc-font-size-heading-level-2: 2.5rem;
759
+ --rhc-font-size-heading-level-1: 3.125rem;
760
+ --rhc-focus-outline-width: 2px;
761
+ --rhc-focus-outline-style: solid;
762
+ --rhc-focus-outline-offset: 0.125rem;
763
+ --rhc-color-none: transparent;
764
+ --rhc-color-zwart: #000;
765
+ --rhc-color-wit: #fff;
766
+ --rhc-color-lintblauw-500: #154273;
767
+ --rhc-color-lintblauw-400: #4f7196;
768
+ --rhc-color-lintblauw-300: #738eab;
769
+ --rhc-color-lintblauw-200: #95a9c0;
770
+ --rhc-color-lintblauw-100: #b8c6d5;
771
+ --rhc-color-lintblauw-50: #dce3ea;
772
+ --rhc-color-robijnrood-500: #ca005d;
773
+ --rhc-color-robijnrood-400: #D74085;
774
+ --rhc-color-robijnrood-300: #DF669D;
775
+ --rhc-color-robijnrood-200: #E78CB6;
776
+ --rhc-color-robijnrood-100: #efb3ce;
777
+ --rhc-color-robijnrood-50: #f7d9e7;
778
+ --rhc-color-roze-500: #f092cd;
779
+ --rhc-color-roze-400: #F4ADD9;
780
+ --rhc-color-roze-300: #F6BDE1;
781
+ --rhc-color-roze-200: #F8CEE8;
782
+ --rhc-color-roze-100: #fbdef0;
783
+ --rhc-color-roze-50: #fdeff8;
784
+ --rhc-color-rood-500: #d52b1e;
785
+ --rhc-color-rood-400: #DF6056;
786
+ --rhc-color-rood-300: #E67F78;
787
+ --rhc-color-rood-200: #EC9F99;
788
+ --rhc-color-rood-100: #f2bfbc;
789
+ --rhc-color-rood-50: #f9dfdd;
790
+ --rhc-color-oranje-500: #e17000;
791
+ --rhc-color-oranje-400: #E89440;
792
+ --rhc-color-oranje-300: #EDA966;
793
+ --rhc-color-oranje-200: #F1BE8C;
794
+ --rhc-color-oranje-100: #f6d4b3;
795
+ --rhc-color-oranje-50: #fbead9;
796
+ --rhc-color-donkergeel-500: #ffb612;
797
+ --rhc-color-donkergeel-400: #FDC84D;
798
+ --rhc-color-donkergeel-300: #FDD370;
799
+ --rhc-color-donkergeel-200: #FDDE94;
800
+ --rhc-color-donkergeel-100: #ffe9b8;
801
+ --rhc-color-donkergeel-50: #fff4db;
802
+ --rhc-color-geel-500: #f9e11e;
803
+ --rhc-color-geel-400: #FAE856;
804
+ --rhc-color-geel-300: #FBED78;
805
+ --rhc-color-geel-200: #FCF199;
806
+ --rhc-color-geel-100: #fdf6bc;
807
+ --rhc-color-geel-50: #fefbdd;
808
+ --rhc-color-donkerbruin-500: #673327;
809
+ --rhc-color-donkerbruin-400: #8D665D;
810
+ --rhc-color-donkerbruin-300: #A3847D;
811
+ --rhc-color-donkerbruin-200: #BAA39D;
812
+ --rhc-color-donkerbruin-100: #d1c2be;
813
+ --rhc-color-donkerbruin-50: #e8e0df;
814
+ --rhc-color-bruin-500: #94710a;
815
+ --rhc-color-bruin-400: #AF9447;
816
+ --rhc-color-bruin-300: #BFA96C;
817
+ --rhc-color-bruin-200: #CFBF90;
818
+ --rhc-color-bruin-100: #dfd4b6;
819
+ --rhc-color-bruin-50: #efeada;
820
+ --rhc-color-donkergroen-500: #275937;
821
+ --rhc-color-donkergroen-400: #5D8269;
822
+ --rhc-color-donkergroen-300: #7D9B87;
823
+ --rhc-color-donkergroen-200: #9DB4A4;
824
+ --rhc-color-donkergroen-100: #becdc3;
825
+ --rhc-color-donkergroen-50: #dfe6e1;
826
+ --rhc-color-groen-500: #39870c;
827
+ --rhc-color-groen-400: #6AA549;
828
+ --rhc-color-groen-300: #88B76D;
829
+ --rhc-color-groen-200: #A5C991;
830
+ --rhc-color-groen-100: #c4dbb6;
831
+ --rhc-color-groen-50: #e1eddb;
832
+ --rhc-color-mosgroen-500: #777b00;
833
+ --rhc-color-mosgroen-400: #999C40;
834
+ --rhc-color-mosgroen-300: #ADAF66;
835
+ --rhc-color-mosgroen-200: #C1C38C;
836
+ --rhc-color-mosgroen-100: #d6d7b3;
837
+ --rhc-color-mosgroen-50: #ebebd9;
838
+ --rhc-color-mintgroen-500: #76d2b6;
839
+ --rhc-color-mintgroen-400: #98DDC8;
840
+ --rhc-color-mintgroen-300: #ACE4D3;
841
+ --rhc-color-mintgroen-200: #C1EBDE;
842
+ --rhc-color-mintgroen-100: #d6f2e9;
843
+ --rhc-color-mintgroen-50: #eaf8f4;
844
+ --rhc-color-donkerblauw-500: #01689b;
845
+ --rhc-color-donkerblauw-400: #408EB4;
846
+ --rhc-color-donkerblauw-300: #66A4C3;
847
+ --rhc-color-donkerblauw-200: #8CBBD2;
848
+ --rhc-color-donkerblauw-100: #b3d2e1;
849
+ --rhc-color-donkerblauw-50: #d9e8f0;
850
+ --rhc-color-hemelblauw-500: #007bc7;
851
+ --rhc-color-hemelblauw-400: #409CD5;
852
+ --rhc-color-hemelblauw-300: #66AFDD;
853
+ --rhc-color-hemelblauw-200: #8CC3E6;
854
+ --rhc-color-hemelblauw-100: #b3d7ee;
855
+ --rhc-color-hemelblauw-50: #d9ebf7;
856
+ --rhc-color-paars-500: #42145f;
857
+ --rhc-color-paars-400: #714f87;
858
+ --rhc-color-paars-300: #8D729F;
859
+ --rhc-color-paars-200: #A995B7;
860
+ --rhc-color-paars-100: #c6b9cf;
861
+ --rhc-color-paars-50: #e3dce7;
862
+ --rhc-color-violet-500: #a90061;
863
+ --rhc-color-violet-400: #BE4088;
864
+ --rhc-color-violet-300: #CB66A0;
865
+ --rhc-color-violet-200: #D88CB7;
866
+ --rhc-color-violet-100: #e5b3d0;
867
+ --rhc-color-violet-50: #f2d9e7;
868
+ --rhc-color-lichtblauw-500: #8fcae7;
869
+ --rhc-color-lichtblauw-400: #ABD7ED;
870
+ --rhc-color-lichtblauw-300: #BCDFF0;
871
+ --rhc-color-lichtblauw-200: #CCE7F4;
872
+ --rhc-color-lichtblauw-100: #ddeff8;
873
+ --rhc-color-lichtblauw-50: #eef7fb;
874
+ --rhc-color-grijs-900: #0F172A;
875
+ --rhc-color-grijs-800: #1E293B;
876
+ --rhc-color-grijs-700: #334155;
877
+ --rhc-color-grijs-600: #475569;
878
+ --rhc-color-grijs-500: #64748B;
879
+ --rhc-color-grijs-400: #94A3B8;
880
+ --rhc-color-grijs-300: #CBD5E1;
881
+ --rhc-color-grijs-200: #E2E8F0;
882
+ --rhc-color-grijs-100: #F1F5F9;
883
+ --rhc-color-grijs-50: #F8FAFC;
884
+ --rhc-color-primary-hover: #162f50;
885
+ --rhc-color-primary-500: #154273;
886
+ --rhc-color-primary-400: #4f7196;
887
+ --rhc-color-primary-300: #738eab;
888
+ --rhc-color-primary-200: #95a9c0;
889
+ --rhc-color-primary-100: #b8c6d5;
890
+ --rhc-color-primary-50: #dce3ea;
891
+ --rhc-color-accent-500: #8fcae7;
892
+ --rhc-color-feedback-warning-subdued: #fff4db;
893
+ --rhc-color-feedback-warning-default: #ffb612;
894
+ --rhc-color-feedback-error-subdued: #f9dfdd;
895
+ --rhc-color-feedback-error-default: #d52b1e;
896
+ --rhc-color-feedback-info-subdued: #d9ebf7;
897
+ --rhc-color-feedback-info-default: #007bc7;
898
+ --rhc-color-feedback-success-subdued: #e1eddb;
899
+ --rhc-color-feedback-success-default: #39870c;
900
+ --rhc-color-canvas: #fff;
901
+ --rhc-color-border-strong: #000;
902
+ --rhc-color-border-subdued: #94A3B8;
903
+ --rhc-color-border-default: #64748B;
904
+ --rhc-color-foreground-link: #01689b;
905
+ --rhc-color-foreground-on-emphasis: #fff;
906
+ --rhc-color-foreground-subdued: #334155;
907
+ --rhc-color-foreground-lint: #154273;
908
+ --rhc-color-foreground-default: #000;
909
+ --rhc-color-focus-outline: #000;
910
+ --rhc-border-radius-none: 0px;
911
+ --rhc-border-radius-circle: 999px;
912
+ --rhc-border-radius-keep: 48px;
913
+ --rhc-border-radius-md: 5px;
914
+ --rhc-border-radius-sm: 2.5px;
915
+ --rhc-keep-bottom-left-border-radius-bottom-left: 48px;
916
+ --rhc-keep-bottom-left-border-radius-bottom-right: 0;
917
+ --rhc-keep-bottom-left-border-radius-top-right: 0;
918
+ --rhc-keep-bottom-left-border-radius-top-left: 0;
919
+ --rhc-keep-bottom-right-border-radius-bottom-left: 0;
920
+ --rhc-keep-bottom-right-border-radius-bottom-right: 48px;
921
+ --rhc-keep-bottom-right-border-radius-top-right: 0;
922
+ --rhc-keep-bottom-right-border-radius-top-left: 0;
923
+ --rhc-keep-top-right-border-radius-bottom-left: 0;
924
+ --rhc-keep-top-right-border-radius-bottom-right: 0;
925
+ --rhc-keep-top-right-border-radius-top-left: 0;
926
+ --rhc-keep-top-right-border-radius-top-right: 48px;
927
+ --rhc-keep-top-left-border-radius-bottom-left: 0;
928
+ --rhc-keep-top-left-border-radius-bottom-right: 0;
929
+ --rhc-keep-top-left-border-radius-top-right: 0;
930
+ --rhc-keep-top-left-border-radius-top-left: 48px;
931
+ --rhc-accordion-color: #154273;
932
+ --rhc-accordion-border-radius: 0px;
933
+ --rhc-accordion-header-margin: 0;
934
+ --rhc-accordion-section-border-color: #94A3B8;
935
+ --rhc-accordion-section-border-width: 0;
936
+ --rhc-accordion-section-border-block-end-width: 1px;
937
+ --rhc-accordion-button-expanded-color: #154273;
938
+ --rhc-accordion-button-expanded-background-color: #fff;
939
+ --rhc-accordion-button-padding-inline-start: 1rem;
940
+ --rhc-accordion-button-padding-inline-end: 1rem;
941
+ --rhc-accordion-button-padding-block-start: 0.75rem;
942
+ --rhc-accordion-button-padding-block-end: 0.75rem;
943
+ --rhc-accordion-button-icon-margin-block: 0.25rem;
944
+ --rhc-accordion-button-line-height: 150%;
945
+ --rhc-accordion-button-font-weight: 400;
946
+ --rhc-accordion-button-font-size: 1.25rem;
947
+ --rhc-accordion-button-font-family: Fira Sans, Arial, Verdana, sans-serif;
948
+ --rhc-card-as-link-horizontal-heading-inline-size: 200px;
949
+ --rhc-card-as-link-horizontal-padding-inline-start: 1rem;
950
+ --rhc-card-as-link-horizontal-padding-inline-end: 1rem;
951
+ --rhc-card-as-link-horizontal-padding-block-start: 0;
952
+ --rhc-card-as-link-horizontal-padding-block-end: 0;
953
+ --rhc-card-as-link-horizontal-max-block-size: 96px;
954
+ --rhc-card-as-link-horizontal-color: #fff;
955
+ --rhc-card-as-link-horizontal-border-color: transparent;
956
+ --rhc-card-as-link-horizontal-background-color: #154273;
957
+ --rhc-card-as-link-heading-font-weight: 700;
958
+ --rhc-card-as-link-heading-font-size: 1.5rem;
959
+ --rhc-card-as-link-heading-padding-block-start: 0.5rem;
960
+ --rhc-card-as-link-full-bleed-opacity: 0.5;
961
+ --rhc-card-as-link-full-bleed-color: #fff;
962
+ --rhc-card-as-link-full-bleed-border-color: transparent;
963
+ --rhc-card-as-link-full-bleed-background-color: #000;
964
+ --rhc-card-as-link-focus-text-decoration: underline;
965
+ --rhc-card-as-link-focus-background-color: #dce3ea;
966
+ --rhc-card-as-link-hover-text-decoration: underline;
967
+ --rhc-card-as-link-hover-background-color: #F8FAFC;
968
+ --rhc-card-as-link-active-text-decoration: underline;
969
+ --rhc-card-as-link-active-background-color: #F1F5F9;
970
+ --rhc-card-as-link-row-gap: 0.75rem;
971
+ --rhc-card-as-link-padding-inline-start: 1rem;
972
+ --rhc-card-as-link-padding-inline-end: 1rem;
973
+ --rhc-card-as-link-padding-block-start: 1rem;
974
+ --rhc-card-as-link-padding-block-end: 1rem;
975
+ --rhc-card-as-link-metadata-color: #154273;
976
+ --rhc-card-as-link-link-focus-text-decoration: none;
977
+ --rhc-card-as-link-link-hover-text-decoration: none;
978
+ --rhc-card-as-link-link-active-text-decoration: none;
979
+ --rhc-card-as-link-link-text-decoration: underline;
980
+ --rhc-card-as-link-link-color: #01689b;
981
+ --rhc-card-as-link-icon-size: 24px;
982
+ --rhc-card-as-link-icon-color: #154273;
983
+ --rhc-card-as-link-inline-size: 328px;
984
+ --rhc-card-as-link-column-gap: 1rem;
985
+ --rhc-card-as-link-color: #154273;
986
+ --rhc-card-as-link-border-width: 1px;
987
+ --rhc-card-as-link-border-radius: 5px;
988
+ --rhc-card-as-link-border-color: #CBD5E1;
989
+ --rhc-card-as-link-background-color: #fff;
990
+ --rhc-checkbox-group-row-gap: 1rem;
991
+ --rhc-checkbox-group-padding-block-start: 0.5rem;
992
+ --rhc-checkbox-group-padding-block-end: 0.5rem;
993
+ --rhc-code-input-group-column-gap: 0.5rem;
994
+ --rhc-code-input-size: 48px;
995
+ --rhc-dot-badge-size: 12px;
996
+ --rhc-dot-badge-color: #d52b1e;
997
+ --rhc-dot-badge-border-radius: 999px;
998
+ --rhc-file-subtitle-color: #64748B;
999
+ --rhc-file-error-border-color: #d52b1e;
1000
+ --rhc-file-column-gap: 0.25rem;
1001
+ --rhc-file-padding-block-end: 0.75rem;
1002
+ --rhc-file-padding-block-start: 0.75rem;
1003
+ --rhc-file-padding-inline-end: 1rem;
1004
+ --rhc-file-padding-inline-start: 1rem;
1005
+ --rhc-file-border-radius: 5px;
1006
+ --rhc-file-border-width: 1px;
1007
+ --rhc-file-border-color: #154273;
1008
+ --rhc-file-border-style: solid;
1009
+ --rhc-file-input-feedback-font-size: 1rem;
1010
+ --rhc-file-input-feedback-color: #475569;
1011
+ --rhc-file-input-row-gap: 0.75rem;
1012
+ --rhc-file-input-column-gap: 0.75rem;
1013
+ --rhc-page-footer-flex-direction: row;
1014
+ --rhc-page-footer-padding-inline-start: 2.5rem;
1015
+ --rhc-page-footer-padding-block-end: 2.5rem;
1016
+ --rhc-page-footer-padding-block-start: 2.5rem;
1017
+ --rhc-page-footer-border-block-start-style: solid;
1018
+ --rhc-page-footer-border-block-start-color: #154273;
1019
+ --rhc-page-footer-border-block-start-width: 2px;
1020
+ --rhc-page-footer-content-padding-inline-end: 1rem;
1021
+ --rhc-page-footer-content-padding-inline-start: 1rem;
1022
+ --rhc-page-footer-content-max-inline-size: 1280px;
1023
+ --rhc-page-footer-column-title-margin-block-end: 0.75rem;
1024
+ --rhc-page-footer-column-width: 200px;
1025
+ --rhc-page-footer-column-gap: 1.5rem;
1026
+ --rhc-form-field-checkbox-option-margin-block-end: 0;
1027
+ --rhc-form-field-checkbox-option-column-gap: 0.5rem;
1028
+ --rhc-form-field-radio-option-input-margin-block-start: 0.25rem;
1029
+ --rhc-form-field-radio-option-label-margin-block-end: 0;
1030
+ --rhc-form-field-radio-option-row-gap: 0.5rem;
1031
+ --rhc-form-field-radio-option-font-weight: 400;
1032
+ --rhc-form-field-radio-option-column-gap: 0.5rem;
1033
+ --rhc-hero-inline-size: 100%;
1034
+ --rhc-hero-border-radius: 40px;
1035
+ --rhc-hero-message-inline-size: 90%;
1036
+ --rhc-hero-message-border-radius: 20px;
1037
+ --rhc-hero-message-padding-block-start: 1rem;
1038
+ --rhc-hero-message-padding-inline-start: 1rem;
1039
+ --rhc-hero-message-padding-inline-end: 1rem;
1040
+ --rhc-hero-message-padding-block-end: 1rem;
1041
+ --rhc-hero-message-row-gap: 0.125rem;
1042
+ --rhc-hero-message-color: #fff;
1043
+ --rhc-hero-message-background-color: #154273;
1044
+ --rhc-hero-sub-heading-font-family: Fira Sans, Arial, Verdana, sans-serif;
1045
+ --rhc-hero-sub-heading-font-size: 1.25rem;
1046
+ --rhc-hero-sub-heading-line-height: 150%;
1047
+ --rhc-hero-sub-heading-font-weight: 400;
1048
+ --rhc-hero-heading-font-family: Fira Sans, Arial, Verdana, sans-serif;
1049
+ --rhc-hero-heading-font-size: 1.875rem;
1050
+ --rhc-hero-heading-line-height: 125%;
1051
+ --rhc-hero-heading-font-weight: 700;
1052
+ --rhc-icon-only-button-padding-inline-start: 0.75rem;
1053
+ --rhc-icon-only-button-padding-inline-end: 0.75rem;
1054
+ --rhc-icon-only-button-padding-block-start: 0.75rem;
1055
+ --rhc-icon-only-button-padding-block-end: 0.75rem;
1056
+ --rhc-link-list-text-decoration: None;
1057
+ --rhc-link-list-card-padding-inline-end: 1.5rem;
1058
+ --rhc-link-list-card-padding-inline-start: 1.5rem;
1059
+ --rhc-link-list-card-row-gap: 1rem;
1060
+ --rhc-link-list-card-padding-block-end: 1.5rem;
1061
+ --rhc-link-list-card-padding-block-start: 1.5rem;
1062
+ --rhc-link-list-card-background-color: #fff;
1063
+ --rhc-logo-color: #154273;
1064
+ --rhc-logo-font-family: Fira Sans, Arial, Verdana, sans-serif;
1065
+ --rhc-logo-column-gap: 12px;
1066
+ --rhc-logo-subtitle-font-size: 0.775rem;
1067
+ --rhc-logo-subtitle-line-height: 1rem;
1068
+ --rhc-logo-subtitle-font-weight: 400;
1069
+ --rhc-logo-title-padding-block-start: 3.125rem;
1070
+ --rhc-logo-title-font-size: 0.913rem;
1071
+ --rhc-logo-title-line-height: 1.063rem;
1072
+ --rhc-logo-title-font-weight: 600;
1073
+ --rhc-logo-image-color: #154273;
1074
+ --rhc-logo-image-block-size: 96px;
1075
+ --rhc-logo-image-inline-size: 48px;
1076
+ --rhc-logo-image-background-color: #fff;
1077
+ --rhc-message-list-item-heading-color: #154273;
1078
+ --rhc-message-list-item-label-line-height: 150%;
1079
+ --rhc-message-list-item-label-font-weight: 700;
1080
+ --rhc-message-list-item-label-font-size: 1.25rem;
1081
+ --rhc-message-list-item-label-font-family: Fira Sans, Arial, Verdana, sans-serif;
1082
+ --rhc-message-list-item-content-row-gap: 0.5rem;
1083
+ --rhc-message-list-item-content-column-gap: 0.5rem;
1084
+ --rhc-message-list-item-padding-inline: 1rem;
1085
+ --rhc-message-list-item-padding-block: 0.75rem;
1086
+ --rhc-message-list-item-min-height: 48px;
1087
+ --rhc-message-list-item-icon-color: #154273;
1088
+ --rhc-message-list-item-icon-size: 24px;
1089
+ --rhc-message-list-item-column-gap: 1rem;
1090
+ --rhc-message-list-item-color: #334155;
1091
+ --rhc-message-list-item-border-width: 1px;
1092
+ --rhc-message-list-item-border-color: #CBD5E1;
1093
+ --rhc-message-list-item-background-color: #fff;
1094
+ --rhc-nav-bar-border-color: #64748B;
1095
+ --rhc-nav-bar-color: #154273;
1096
+ --rhc-nav-bar-background-color: #fff;
1097
+ --rhc-nav-bar-heading-font-weight: 700;
1098
+ --rhc-nav-bar-link-column-gap: 0.5rem;
1099
+ --rhc-nav-bar-link-padding-inline-start: 0.75rem;
1100
+ --rhc-nav-bar-link-padding-inline-end: 0.75rem;
1101
+ --rhc-nav-bar-link-padding-block-start: 1rem;
1102
+ --rhc-nav-bar-link-padding-block-end: 1rem;
1103
+ --rhc-nav-bar-link-hover-color: #154273;
1104
+ --rhc-nav-bar-link-hover-background-color: #F8FAFC;
1105
+ --rhc-nav-bar-link-focus-color: #154273;
1106
+ --rhc-nav-bar-link-focus-background-color: #dce3ea;
1107
+ --rhc-nav-bar-link-color: #154273;
1108
+ --rhc-nav-bar-link-background-color: #fff;
1109
+ --rhc-nav-bar-link-active-color: #fff;
1110
+ --rhc-nav-bar-link-active-background-color: #154273;
1111
+ --rhc-nav-bar-icon-size: 24px;
1112
+ --rhc-nav-bar-icon-active-color: #fff;
1113
+ --rhc-nav-bar-icon-color: #154273;
1114
+ --rhc-nav-bar-content-column-gap: 1rem;
1115
+ --rhc-nav-bar-container-inline-size: 100%;
1116
+ --rhc-nav-bar-padding-inline: 1rem;
1117
+ --rhc-nav-bar-max-inline-size: 1280px;
1118
+ --rhc-nav-bar-border-block-end-width: 1px;
1119
+ --rhc-navigation-list-item-padding-inline: 1rem;
1120
+ --rhc-navigation-list-item-padding-block: 0.75rem;
1121
+ --rhc-navigation-list-item-min-height: 48px;
1122
+ --rhc-navigation-list-item-column-gap: 1rem;
1123
+ --rhc-navigation-list-item-heading-color: #154273;
1124
+ --rhc-navigation-list-item-border-color: #CBD5E1;
1125
+ --rhc-navigation-list-item-border-width: 1px;
1126
+ --rhc-navigation-list-item-color: #334155;
1127
+ --rhc-navigation-list-item-background-color: #fff;
1128
+ --rhc-navigation-list-item-focus-background-color: #dce3ea;
1129
+ --rhc-navigation-list-item-hover-background-color: #F8FAFC;
1130
+ --rhc-navigation-list-item-active-background-color: #F1F5F9;
1131
+ --rhc-navigation-list-item-label-line-height: 150%;
1132
+ --rhc-navigation-list-item-label-font-weight: 700;
1133
+ --rhc-navigation-list-item-label-font-size: 1.875rem;
1134
+ --rhc-navigation-list-item-label-font-family: Fira Sans, Arial, Verdana, sans-serif;
1135
+ --rhc-navigation-list-item-content-row-gap: 0.25rem;
1136
+ --rhc-navigation-list-item-content-column-gap: 0.5rem;
1137
+ --rhc-navigation-list-item-icon-size: 24px;
1138
+ --rhc-navigation-list-item-icon-padding-block: 0.5rem;
1139
+ --rhc-navigation-list-item-icon-padding-inline: 0.5rem;
1140
+ --rhc-navigation-list-icon-color: #fff;
1141
+ --rhc-navigation-list-icon-border-radius: 999px;
1142
+ --rhc-navigation-list-icon-background-color: #154273;
1143
+ --rhc-radio-group-row-gap: 1rem;
1144
+ --rhc-radio-group-padding-block-start: 0.5rem;
1145
+ --rhc-radio-group-padding-block-end: 0.5rem;
1146
+ --rhc-sidenav-link-column-gap: 0.5rem;
1147
+ --rhc-sidenav-link-text-decoration: None;
1148
+ --rhc-sidenav-link-padding-block-end: 0.75rem;
1149
+ --rhc-sidenav-link-padding-block-start: 0.75rem;
1150
+ --rhc-sidenav-link-hover-text-decoration: underline;
1151
+ --rhc-sidenav-link-hover-color: #15496a;
1152
+ --rhc-sidenav-link-focus-text-decoration: None;
1153
+ --rhc-sidenav-link-focus-color: #01689b;
1154
+ --rhc-sidenav-link-focus-background-color: none;
1155
+ --rhc-sidenav-link-focus-border-color: #154273;
1156
+ --rhc-sidenav-link-focus-border-style: solid;
1157
+ --rhc-sidenav-link-focus-border-width: 2px;
1158
+ --rhc-sidenav-link-focus-border-radius: 5px;
1159
+ --rhc-sidenav-link-active-text-decoration: underline;
1160
+ --rhc-sidenav-link-active-color: #42145f;
1161
+ --rhc-sidenav-link-color: #01689b;
1162
+ --rhc-sidenav-link-current-color: #154273;
1163
+ --rhc-sidenav-link-current-font-weight: 700;
1164
+ --rhc-sidenav-link-font-weight: 400;
1165
+ --rhc-sidenav-link-font-family: Fira Sans, Arial, Verdana, sans-serif;
1166
+ --rhc-sidenav-link-font-size: 1.25rem;
1167
+ --rhc-sidenav-link-icon-margin-inline: 0.5rem;
1168
+ --rhc-sidenav-link-icon-size: 24px;
1169
+ --rhc-sidenav-link-line-height: 150%;
1170
+ --rhc-sidenav-display: flex;
1171
+ --rhc-toggletip-focus-background-color: #007bc7;
1172
+ --rhc-toggletip-focus-color: #fff;
1173
+ --rhc-toggletip-hover-background-color: #66AFDD;
1174
+ --rhc-toggletip-hover-color: #154273;
1175
+ --rhc-toggletip-active-border-color: #007bc7;
1176
+ --rhc-toggletip-active-background-color: #fff;
1177
+ --rhc-toggletip-active-color: #007bc7;
1178
+ --rhc-toggletip-size: 24px;
1179
+ --rhc-toggletip-icon-size: 24px;
1180
+ --rhc-toggletip-border-width: 1px;
1181
+ --rhc-toggletip-border-radius: 5px;
1182
+ --rhc-toggletip-border-color: transparent;
1183
+ --rhc-toggletip-background-color: #007bc7;
1184
+ --rhc-toggletip-color: #fff;
1185
+ --rhc-sub-nav-bar-content-list-row-gap: 0.5rem;
1186
+ --rhc-sub-nav-bar-content-max-inline-size: 1280px;
1187
+ --rhc-sub-nav-bar-content-padding-inline-start: 1rem;
1188
+ --rhc-sub-nav-bar-content-padding-inline-end: 1rem;
1189
+ --rhc-sub-nav-bar-inline-size: 100%;
1190
+ --rhc-sub-nav-bar-padding-block-start: 2rem;
1191
+ --rhc-sub-nav-bar-padding-block-end: 2rem;
1192
+ --rhc-sub-nav-bar-column-width: 375px;
1193
+ --rhc-sub-nav-bar-column-gap: 0.5rem;
1194
+ --rhc-sub-nav-bar-background-color: #f2f4f6;
1199
1195
  }