@rijkshuisstijl-community/design-tokens 4.0.0 → 4.1.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 (104) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/_variables.scss +356 -260
  3. package/dist/index.css +356 -260
  4. package/dist/index.d.ts +355 -259
  5. package/dist/index.js +356 -260
  6. package/dist/index.json +355 -259
  7. package/dist/index.tokens.json +515 -351
  8. package/dist/koop/_variables.scss +607 -516
  9. package/dist/koop/index.css +607 -516
  10. package/dist/koop/index.d.ts +701 -610
  11. package/dist/koop/index.js +703 -612
  12. package/dist/koop/index.json +703 -612
  13. package/dist/koop/index.tokens.json +915 -762
  14. package/dist/koop/root.css +607 -516
  15. package/dist/koop/tokens.d.ts +886 -733
  16. package/dist/koop/tokens.js +16374 -14153
  17. package/dist/root.css +356 -260
  18. package/dist/tokens.d.ts +488 -324
  19. package/dist/tokens.js +18845 -16503
  20. package/dist/uitvoerend-groen/_variables.scss +607 -516
  21. package/dist/uitvoerend-groen/index.css +607 -516
  22. package/dist/uitvoerend-groen/index.d.ts +680 -589
  23. package/dist/uitvoerend-groen/index.js +698 -607
  24. package/dist/uitvoerend-groen/index.json +698 -607
  25. package/dist/uitvoerend-groen/index.tokens.json +931 -778
  26. package/dist/uitvoerend-groen/root.css +607 -516
  27. package/dist/uitvoerend-groen/tokens.d.ts +907 -754
  28. package/dist/uitvoerend-groen/tokens.js +17815 -15594
  29. package/dist/uitvoerend-hemelblauw/_variables.scss +607 -516
  30. package/dist/uitvoerend-hemelblauw/index.css +607 -516
  31. package/dist/uitvoerend-hemelblauw/index.d.ts +680 -589
  32. package/dist/uitvoerend-hemelblauw/index.js +698 -607
  33. package/dist/uitvoerend-hemelblauw/index.json +698 -607
  34. package/dist/uitvoerend-hemelblauw/index.tokens.json +931 -778
  35. package/dist/uitvoerend-hemelblauw/root.css +607 -516
  36. package/dist/uitvoerend-hemelblauw/tokens.d.ts +907 -754
  37. package/dist/uitvoerend-hemelblauw/tokens.js +17819 -15598
  38. package/dist/uitvoerend-mintgroen/_variables.scss +607 -516
  39. package/dist/uitvoerend-mintgroen/index.css +607 -516
  40. package/dist/uitvoerend-mintgroen/index.d.ts +680 -589
  41. package/dist/uitvoerend-mintgroen/index.js +698 -607
  42. package/dist/uitvoerend-mintgroen/index.json +698 -607
  43. package/dist/uitvoerend-mintgroen/index.tokens.json +931 -778
  44. package/dist/uitvoerend-mintgroen/root.css +607 -516
  45. package/dist/uitvoerend-mintgroen/tokens.d.ts +907 -754
  46. package/dist/uitvoerend-mintgroen/tokens.js +17815 -15594
  47. package/dist/uitvoerend-oranje/_variables.scss +607 -516
  48. package/dist/uitvoerend-oranje/index.css +607 -516
  49. package/dist/uitvoerend-oranje/index.d.ts +680 -589
  50. package/dist/uitvoerend-oranje/index.js +698 -607
  51. package/dist/uitvoerend-oranje/index.json +698 -607
  52. package/dist/uitvoerend-oranje/index.tokens.json +933 -780
  53. package/dist/uitvoerend-oranje/root.css +607 -516
  54. package/dist/uitvoerend-oranje/tokens.d.ts +908 -755
  55. package/dist/uitvoerend-oranje/tokens.js +17794 -15573
  56. package/dist/uitvoerend-paars/_variables.scss +607 -516
  57. package/dist/uitvoerend-paars/index.css +607 -516
  58. package/dist/uitvoerend-paars/index.d.ts +680 -589
  59. package/dist/uitvoerend-paars/index.js +698 -607
  60. package/dist/uitvoerend-paars/index.json +698 -607
  61. package/dist/uitvoerend-paars/index.tokens.json +931 -778
  62. package/dist/uitvoerend-paars/root.css +607 -516
  63. package/dist/uitvoerend-paars/tokens.d.ts +907 -754
  64. package/dist/uitvoerend-paars/tokens.js +17815 -15594
  65. package/dist/uitvoerend-violet/_variables.scss +607 -516
  66. package/dist/uitvoerend-violet/index.css +607 -516
  67. package/dist/uitvoerend-violet/index.d.ts +680 -589
  68. package/dist/uitvoerend-violet/index.js +698 -607
  69. package/dist/uitvoerend-violet/index.json +698 -607
  70. package/dist/uitvoerend-violet/index.tokens.json +931 -778
  71. package/dist/uitvoerend-violet/root.css +607 -516
  72. package/dist/uitvoerend-violet/tokens.d.ts +907 -754
  73. package/dist/uitvoerend-violet/tokens.js +17815 -15594
  74. package/dist/uitvoerend-violet-oud/_variables.scss +608 -517
  75. package/dist/uitvoerend-violet-oud/index.css +608 -517
  76. package/dist/uitvoerend-violet-oud/index.d.ts +681 -590
  77. package/dist/uitvoerend-violet-oud/index.js +699 -608
  78. package/dist/uitvoerend-violet-oud/index.json +699 -608
  79. package/dist/uitvoerend-violet-oud/index.tokens.json +925 -772
  80. package/dist/uitvoerend-violet-oud/root.css +608 -517
  81. package/dist/uitvoerend-violet-oud/tokens.d.ts +898 -745
  82. package/dist/uitvoerend-violet-oud/tokens.js +17299 -15078
  83. package/dist/wetgevend/_variables.scss +606 -515
  84. package/dist/wetgevend/index.css +606 -515
  85. package/dist/wetgevend/index.d.ts +679 -588
  86. package/dist/wetgevend/index.js +682 -591
  87. package/dist/wetgevend/index.json +682 -591
  88. package/dist/wetgevend/index.tokens.json +934 -781
  89. package/dist/wetgevend/root.css +606 -515
  90. package/dist/wetgevend/tokens.d.ts +887 -734
  91. package/dist/wetgevend/tokens.js +16235 -14014
  92. package/figma/figma.tokens.json +2157 -1484
  93. package/package.json +1 -1
  94. package/src/generated/base.tokens.json +1902 -1437
  95. package/src/generated/koop/tokens.json +3394 -2955
  96. package/src/generated/themes.json +35654 -31703
  97. package/src/generated/uitvoerend-groen/tokens.json +3469 -3030
  98. package/src/generated/uitvoerend-hemelblauw/tokens.json +3466 -3027
  99. package/src/generated/uitvoerend-mintgroen/tokens.json +3469 -3030
  100. package/src/generated/uitvoerend-oranje/tokens.json +3469 -3030
  101. package/src/generated/uitvoerend-paars/tokens.json +3469 -3030
  102. package/src/generated/uitvoerend-violet/tokens.json +3469 -3030
  103. package/src/generated/uitvoerend-violet-oud/tokens.json +3482 -3043
  104. package/src/generated/wetgevend/tokens.json +3527 -3088
package/dist/index.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 17 Jul 2025 11:54:46 GMT
3
+ * Generated on Fri, 01 Aug 2025 12:51:45 GMT
4
4
  */
5
5
 
6
6
  .rhc-theme {
@@ -24,21 +24,6 @@
24
24
  --basis-color-default-color-subtle: #334155;
25
25
  --basis-color-default-color-document: #0F172A;
26
26
  --basis-color-default-bg-document: #fff;
27
- --todo-link-list-link-hover-text-decoration: underline;
28
- --todo-skip-link-font-weight: 700;
29
- --nl-number-badge-padding-block: 0.125rem;
30
- --nl-number-badge-padding-inline: 0.5rem;
31
- --nl-number-badge-color: #fff;
32
- --nl-number-badge-border-color: transparent;
33
- --nl-number-badge-background-color: #154273;
34
- --nl-number-badge-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
35
- --nl-number-badge-border-radius: 999px;
36
- --nl-number-badge-border-width: 0px;
37
- --nl-number-badge-font-weight: 700;
38
- --nl-number-badge-min-inline-size: 24px;
39
- --nl-number-badge-min-block-size: 24px;
40
- --nl-number-badge-line-height: 125%;
41
- --nl-number-badge-font-size: 1.25rem;
42
27
  --nl-heading-level-6-margin-block-start: 0rem;
43
28
  --nl-heading-level-6-margin-block-end: 0rem;
44
29
  --nl-heading-level-6-line-height: 150%;
@@ -106,6 +91,19 @@
106
91
  --nl-link-font-size: 1.25rem;
107
92
  --nl-link-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
108
93
  --nl-link-column-gap: 0.25rem;
94
+ --nl-number-badge-padding-inline: 0.5rem;
95
+ --nl-number-badge-padding-block: 0.125rem;
96
+ --nl-number-badge-min-inline-size: 24px;
97
+ --nl-number-badge-min-block-size: 24px;
98
+ --nl-number-badge-font-weight: 700;
99
+ --nl-number-badge-font-size: 1.25rem;
100
+ --nl-number-badge-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
101
+ --nl-number-badge-color: #fff;
102
+ --nl-number-badge-border-width: 0px;
103
+ --nl-number-badge-border-radius: 999px;
104
+ --nl-number-badge-border-color: transparent;
105
+ --nl-number-badge-background-color: #154273;
106
+ --nl-number-badge-line-height: 125%;
109
107
  --nl-paragraph-margin-block-start: 0rem;
110
108
  --nl-paragraph-margin-block-end: 0rem;
111
109
  --nl-paragraph-line-height: 150%;
@@ -150,6 +148,60 @@
150
148
  --nl-skip-link-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
151
149
  --nl-skip-link-border-width: 2px;
152
150
  --nl-skip-link-border-color: transparent;
151
+ --todo-accordion-button-line-height: 150%;
152
+ --todo-accordion-button-font-weight: 400;
153
+ --todo-accordion-button-font-size: 1.25rem;
154
+ --todo-accordion-button-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
155
+ --todo-checkbox-checked-focus-visible-color: #154273;
156
+ --todo-checkbox-checked-focus-visible-border-width: 2px;
157
+ --todo-checkbox-checked-focus-visible-border-color: #154273;
158
+ --todo-checkbox-checked-focus-visible-background-color: #fff;
159
+ --todo-checkbox-checked-hover-color: #fff;
160
+ --todo-checkbox-checked-hover-border-width: 1px;
161
+ --todo-checkbox-checked-hover-border-color: transparent;
162
+ --todo-checkbox-checked-hover-background-color: #738eab;
163
+ --todo-checkbox-checked-disabled-color: #475569;
164
+ --todo-checkbox-checked-disabled-border-color: #94A3B8;
165
+ --todo-checkbox-checked-disabled-background-color: #CBD5E1;
166
+ --todo-checkbox-checked-active-color: #fff;
167
+ --todo-checkbox-checked-active-border-width: 1px;
168
+ --todo-checkbox-checked-active-border-color: transparent;
169
+ --todo-checkbox-checked-active-background-color: #4f7196;
170
+ --todo-checkbox-indeterminate-focus-visible-color: #154273;
171
+ --todo-checkbox-indeterminate-focus-visible-border-width: 2px;
172
+ --todo-checkbox-indeterminate-focus-visible-border-color: #154273;
173
+ --todo-checkbox-indeterminate-focus-visible-background-color: #fff;
174
+ --todo-checkbox-indeterminate-hover-color: #fff;
175
+ --todo-checkbox-indeterminate-hover-border-width: 1px;
176
+ --todo-checkbox-indeterminate-hover-border-color: transparent;
177
+ --todo-checkbox-indeterminate-hover-background-color: #738eab;
178
+ --todo-checkbox-indeterminate-disabled-color: #475569;
179
+ --todo-checkbox-indeterminate-disabled-border-color: #94A3B8;
180
+ --todo-checkbox-indeterminate-disabled-background-color: #CBD5E1;
181
+ --todo-checkbox-indeterminate-active-color: #fff;
182
+ --todo-checkbox-indeterminate-active-border-width: 1px;
183
+ --todo-checkbox-indeterminate-active-border-color: transparent;
184
+ --todo-checkbox-indeterminate-active-background-color: #4f7196;
185
+ --todo-figure-row-gap: 0.5rem;
186
+ --todo-form-field-error-message-icon-size: 24px;
187
+ --todo-form-field-error-message-column-gap: 0.5rem;
188
+ --todo-form-field-label-line-height: 150%;
189
+ --todo-form-field-label-font-weight: 700;
190
+ --todo-form-field-label-font-size: 1.25rem;
191
+ --todo-form-field-label-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
192
+ --todo-form-field-label-column-gap: 0.5rem;
193
+ --todo-form-field-label-color: #0F172A;
194
+ --todo-link-list-link-hover-text-decoration: underline;
195
+ --todo-radio-button-checked-disabled-color: #475569;
196
+ --todo-radio-button-checked-disabled-border-color: #94A3B8;
197
+ --todo-radio-button-checked-disabled-background-color: #CBD5E1;
198
+ --todo-skip-link-font-weight: 700;
199
+ --todo-textarea-hover-color: #0F172A;
200
+ --todo-textarea-hover-border-color: #738eab;
201
+ --todo-textarea-hover-background-color: #fff;
202
+ --todo-textbox-hover-color: #0F172A;
203
+ --todo-textbox-hover-border-color: #738eab;
204
+ --todo-textbox-hover-background-color: #fff;
153
205
  --rhc-space-700: 3.5rem;
154
206
  --rhc-space-600: 3rem;
155
207
  --rhc-space-500: 2.5rem;
@@ -365,23 +417,23 @@
365
417
  --rhc-rounded-corner-xl-border-radius: 96px;
366
418
  --rhc-rounded-corner-md-border-radius: 48px;
367
419
  --rhc-rounded-corner-xs-border-radius: 24px;
368
- --rhc-accordion-color: #0F172A;
369
- --rhc-accordion-border-radius: 0px;
370
- --rhc-accordion-header-margin: 0;
371
- --rhc-accordion-section-border-color: #94A3B8;
372
- --rhc-accordion-section-border-width: 0;
373
- --rhc-accordion-section-border-block-end-width: 1px;
420
+ --rhc-accordion-button-line-height: 150%;
421
+ --rhc-accordion-button-font-size: 1.25rem;
422
+ --rhc-accordion-button-font-weight: 400;
423
+ --rhc-accordion-button-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
424
+ --rhc-accordion-button-icon-margin-block: 0.25rem;
374
425
  --rhc-accordion-button-expanded-color: #0F172A;
375
426
  --rhc-accordion-button-expanded-background-color: #fff;
376
427
  --rhc-accordion-button-padding-inline-start: 1rem;
377
428
  --rhc-accordion-button-padding-inline-end: 1rem;
378
429
  --rhc-accordion-button-padding-block-start: 0.75rem;
379
430
  --rhc-accordion-button-padding-block-end: 0.75rem;
380
- --rhc-accordion-button-icon-margin-block: 0.25rem;
381
- --rhc-accordion-button-line-height: 150%;
382
- --rhc-accordion-button-font-weight: 400;
383
- --rhc-accordion-button-font-size: 1.25rem;
384
- --rhc-accordion-button-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
431
+ --rhc-accordion-section-border-width: 1px;
432
+ --rhc-accordion-section-border-color: #94A3B8;
433
+ --rhc-accordion-section-border-block-end-width: 1px;
434
+ --rhc-accordion-header-margin: 0;
435
+ --rhc-accordion-color: #0F172A;
436
+ --rhc-accordion-border-radius: 0px;
385
437
  --rhc-keep-bottom-left-border-radius-bottom-left: 48px;
386
438
  --rhc-keep-bottom-left-border-radius-bottom-right: 0;
387
439
  --rhc-keep-bottom-left-border-radius-top-right: 0;
@@ -486,6 +538,11 @@
486
538
  --rhc-dot-badge-size: 12px;
487
539
  --rhc-dot-badge-color: #d52b1e;
488
540
  --rhc-dot-badge-border-radius: 999px;
541
+ --rhc-expandable-checkbox-group-summary-text-decoration: underline;
542
+ --rhc-expandable-checkbox-group-summary-margin-block-start: 0.5rem;
543
+ --rhc-expandable-checkbox-group-summary-margin-block-end: 0.5rem;
544
+ --rhc-expandable-checkbox-group-summary-color: #01689b;
545
+ --rhc-expandable-checkbox-group-details-margin-block-start: 0.5rem;
489
546
  --rhc-file-subtitle-color: #64748B;
490
547
  --rhc-file-error-border-color: #d52b1e;
491
548
  --rhc-file-column-gap: 0.25rem;
@@ -713,120 +770,140 @@
713
770
  --utrecht-rich-text-friend-margin-block-end: 0.5rem;
714
771
  --utrecht-rich-text-acquaintance-margin-block-end: 1rem;
715
772
  --utrecht-rich-text-stranger-margin-block-end: 2rem;
716
- --utrecht-accordion-button-active-row-gap: 0;
717
- --utrecht-accordion-button-active-color: #0F172A;
718
- --utrecht-accordion-button-active-border-color: #94A3B8;
719
- --utrecht-accordion-button-active-background-color: #F1F5F9;
720
- --utrecht-accordion-button-focus-color: #0F172A;
721
- --utrecht-accordion-button-focus-border-color: #154273;
722
- --utrecht-accordion-button-focus-background-color: #dce3ea;
723
- --utrecht-accordion-button-color: #0F172A;
724
- --utrecht-accordion-button-border-width: 0;
725
- --utrecht-accordion-button-border-color: #94A3B8;
726
- --utrecht-accordion-button-background-color: #fff;
727
- --utrecht-accordion-button-hover-color: #0F172A;
728
- --utrecht-accordion-button-hover-border-color: #94A3B8;
729
- --utrecht-accordion-button-hover-background-color: #F8FAFC;
730
- --utrecht-accordion-button-icon-size: 24px;
731
- --utrecht-accordion-button-gap: 0.5rem;
773
+ --utrecht-accordion-section-margin-block-start: 0rem;
774
+ --utrecht-accordion-section-margin-block-end: 0rem;
775
+ --utrecht-accordion-section-border-width: 1px;
776
+ --utrecht-accordion-section-hover-border-color: #94A3B8;
777
+ --utrecht-accordion-section-border-color: #94A3B8;
732
778
  --utrecht-accordion-panel-padding-inline-start: 1rem;
733
779
  --utrecht-accordion-panel-padding-inline-end: 1rem;
734
780
  --utrecht-accordion-panel-padding-block-start: 1rem;
735
781
  --utrecht-accordion-panel-padding-block-end: 1.5rem;
736
- --utrecht-accordion-panel-border-width: 0;
737
- --utrecht-accordion-panel-border-color: #94A3B8;
738
- --utrecht-alert-border-radius: 5px;
739
- --utrecht-alert-message-column-gap: 0.5rem;
740
- --utrecht-alert-message-line-height: 150%;
741
- --utrecht-alert-icon-size: 24px;
782
+ --utrecht-accordion-panel-border-width: 1px;
783
+ --utrecht-accordion-panel-border-color: transparent;
784
+ --utrecht-accordion-row-gap: 0rem;
785
+ --utrecht-accordion-margin-block-start: 0rem;
786
+ --utrecht-accordion-margin-block-end: 0rem;
787
+ --utrecht-accordion-button-focus-visible-color: #0F172A;
788
+ --utrecht-accordion-button-focus-visible-border-width: 1px;
789
+ --utrecht-accordion-button-focus-visible-border-color: transparent;
790
+ --utrecht-accordion-button-focus-visible-background-color: #dce3ea;
791
+ --utrecht-accordion-button-hover-color: #0F172A;
792
+ --utrecht-accordion-button-hover-border-color: transparent;
793
+ --utrecht-accordion-button-hover-background-color: #F8FAFC;
794
+ --utrecht-accordion-button-icon-size: 24px;
795
+ --utrecht-accordion-button-padding-inline-start: 1rem;
796
+ --utrecht-accordion-button-padding-inline-end: 1rem;
797
+ --utrecht-accordion-button-padding-block-start: 0.75rem;
798
+ --utrecht-accordion-button-padding-block-end: 0.75rem;
799
+ --utrecht-accordion-button-gap: 0.5rem;
800
+ --utrecht-accordion-button-color: #0F172A;
801
+ --utrecht-accordion-button-border-width: 1px;
802
+ --utrecht-accordion-button-border-radius: 0px;
803
+ --utrecht-accordion-button-border-color: transparent;
804
+ --utrecht-accordion-button-background-color: #fff;
805
+ --utrecht-accordion-button-focus-color: #0F172A;
806
+ --utrecht-accordion-button-focus-border-color: #154273;
807
+ --utrecht-accordion-button-focus-background-color: #dce3ea;
808
+ --utrecht-accordion-button-active-color: #0F172A;
809
+ --utrecht-accordion-button-active-border-color: transparent;
810
+ --utrecht-accordion-button-active-background-color: #F1F5F9;
811
+ --utrecht-accordion-button-active-row-gap: 0;
742
812
  --utrecht-alert-icon-warning-color: #ffb612;
743
813
  --utrecht-alert-icon-ok-color: #39870c;
744
- --utrecht-alert-icon-error-color: #d52b1e;
745
814
  --utrecht-alert-icon-info-color: #007bc7;
815
+ --utrecht-alert-icon-error-color: #d52b1e;
816
+ --utrecht-alert-icon-size: 24px;
746
817
  --utrecht-alert-icon-inset-block-start: 3px;
818
+ --utrecht-alert-icon-color: #007bc7;
747
819
  --utrecht-alert-warning-color: #000;
748
820
  --utrecht-alert-warning-border-color: transparent;
749
821
  --utrecht-alert-warning-background-color: #fff4db;
750
822
  --utrecht-alert-ok-color: #000;
751
823
  --utrecht-alert-ok-border-color: transparent;
752
824
  --utrecht-alert-ok-background-color: #e1eddb;
753
- --utrecht-alert-error-color: #000;
754
- --utrecht-alert-error-border-color: transparent;
755
- --utrecht-alert-error-background-color: #f9dfdd;
756
825
  --utrecht-alert-info-color: #000;
757
826
  --utrecht-alert-info-border-color: transparent;
758
827
  --utrecht-alert-info-background-color: #d9ebf7;
759
- --utrecht-alert-color: #000;
760
- --utrecht-alert-border-color: transparent;
761
- --utrecht-alert-background-color: #d9ebf7;
828
+ --utrecht-alert-error-color: #000;
829
+ --utrecht-alert-error-border-color: transparent;
830
+ --utrecht-alert-error-background-color: #f9dfdd;
831
+ --utrecht-alert-content-row-gap: 0.5rem;
762
832
  --utrecht-alert-padding-inline-start: 1rem;
763
833
  --utrecht-alert-padding-inline-end: 1rem;
764
834
  --utrecht-alert-padding-block-start: 1rem;
765
835
  --utrecht-alert-padding-block-end: 1rem;
766
836
  --utrecht-alert-margin-block-start: 0.75rem;
767
837
  --utrecht-alert-margin-block-end: 0.75rem;
768
- --utrecht-alert-border-width: 0px;
769
838
  --utrecht-alert-column-gap: 0.5rem;
770
- --utrecht-alert-heading-font-size: 1.25rem;
839
+ --utrecht-alert-color: #000;
840
+ --utrecht-alert-border-width: 0px;
841
+ --utrecht-alert-border-radius: 5px;
842
+ --utrecht-alert-border-color: transparent;
843
+ --utrecht-alert-background-color: #d9ebf7;
844
+ --utrecht-alert-message-row-gap: 0rem;
845
+ --utrecht-alert-message-line-height: 150%;
846
+ --utrecht-alert-message-column-gap: 0.5rem;
771
847
  --utrecht-alert-heading-line-height: 150%;
772
848
  --utrecht-alert-heading-font-weight: 700;
849
+ --utrecht-alert-heading-font-size: 1.25rem;
773
850
  --utrecht-alert-heading-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
774
851
  --utrecht-article-max-inline-size: 75ch;
852
+ --utrecht-blockquote-attribution-font-size: 1.25rem;
853
+ --utrecht-blockquote-attribution-color: #154273;
854
+ --utrecht-blockquote-row-gap: 0.75rem;
855
+ --utrecht-blockquote-padding-inline-start: 2rem;
856
+ --utrecht-blockquote-padding-inline-end: 2rem;
857
+ --utrecht-blockquote-padding-block-start: 2rem;
858
+ --utrecht-blockquote-padding-block-end: 2rem;
859
+ --utrecht-blockquote-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
860
+ --utrecht-blockquote-font-size: 1.25rem;
861
+ --utrecht-blockquote-color: #154273;
862
+ --utrecht-blockquote-border-width: 0px;
863
+ --utrecht-blockquote-border-radius: 0px;
864
+ --utrecht-blockquote-border-color: transparent;
865
+ --utrecht-blockquote-border-inline-start-width: 0px;
866
+ --utrecht-blockquote-background-color: transparent;
867
+ --utrecht-blockquote-pink-left-border-variation-padding-inline-start: 2.5rem;
868
+ --utrecht-blockquote-pink-left-border-variation-padding-inline-end: 2.5rem;
869
+ --utrecht-blockquote-pink-left-border-variation-padding-block-start: 1.5rem;
870
+ --utrecht-blockquote-pink-left-border-variation-padding-block-end: 1.5rem;
871
+ --utrecht-blockquote-pink-left-border-variation-border-inline-start-width: 0.75rem;
872
+ --utrecht-blockquote-pink-left-border-variation-border-color: #F6BDE1;
775
873
  --utrecht-blockquote-pink-corner-border-variation-padding: 2.5rem;
776
874
  --utrecht-blockquote-pink-corner-border-variation-border-start-start-radius: 3rem;
777
875
  --utrecht-blockquote-pink-corner-border-variation-border-inline-start-width: 0.25rem;
778
- --utrecht-blockquote-pink-corner-border-variation-border-block-start-width: 0.25rem;
779
876
  --utrecht-blockquote-pink-corner-border-variation-border-color: #F6BDE1;
780
- --utrecht-blockquote-pink-left-border-variation-padding-block-end: 1.5rem;
781
- --utrecht-blockquote-pink-left-border-variation-padding-block-start: 1.5rem;
782
- --utrecht-blockquote-pink-left-border-variation-padding-inline-end: 2.5rem;
783
- --utrecht-blockquote-pink-left-border-variation-padding-inline-start: 2.5rem;
784
- --utrecht-blockquote-pink-left-border-variation-border-inline-start-width: 0.75rem;
785
- --utrecht-blockquote-pink-left-border-variation-border-color: #F6BDE1;
877
+ --utrecht-blockquote-pink-corner-border-variation-border-block-start-width: 0.25rem;
786
878
  --utrecht-blockquote-pink-background-variation-padding: 2.5rem;
787
879
  --utrecht-blockquote-pink-background-variation-border-end-start-radius: 3rem;
788
880
  --utrecht-blockquote-pink-background-variation-background-color: #F6BDE1;
789
- --utrecht-blockquote-blue-corner-border-variation-border-end-end-radius: 3rem;
881
+ --utrecht-blockquote-content-font-size: 1.25rem;
882
+ --utrecht-blockquote-content-color: #154273;
883
+ --utrecht-blockquote-content-line-height: 150%;
884
+ --utrecht-blockquote-content-font-weight: 400;
885
+ --utrecht-blockquote-content-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
886
+ --utrecht-blockquote-caption-padding-block-start: 0.75rem;
887
+ --utrecht-blockquote-caption-line-height: 150%;
888
+ --utrecht-blockquote-caption-font-weight: 400;
889
+ --utrecht-blockquote-caption-font-size: 1.25rem;
890
+ --utrecht-blockquote-caption-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
891
+ --utrecht-blockquote-caption-color: #154273;
790
892
  --utrecht-blockquote-blue-corner-border-variation-border-inline-end-width: 2px;
791
- --utrecht-blockquote-blue-corner-border-variation-border-block-end-width: 2px;
893
+ --utrecht-blockquote-blue-corner-border-variation-border-end-end-radius: 3rem;
792
894
  --utrecht-blockquote-blue-corner-border-variation-border-color: #154273;
793
- --utrecht-blockquote-border-end-end-radius: 0;
794
- --utrecht-blockquote-border-end-start-radius: 0;
795
- --utrecht-blockquote-border-start-end-radius: 0;
796
- --utrecht-blockquote-border-start-start-radius: 0;
797
- --utrecht-blockquote-border-inline-end-width: 0;
798
- --utrecht-blockquote-border-block-end-width: 0;
799
- --utrecht-blockquote-border-block-start-width: 0;
895
+ --utrecht-blockquote-blue-corner-border-variation-border-block-end-width: 2px;
800
896
  --utrecht-blockquote-margin-inline-start: 0;
801
897
  --utrecht-blockquote-margin-inline-end: 0;
802
898
  --utrecht-blockquote-margin-block-start: 0;
803
899
  --utrecht-blockquote-margin-block-end: 0;
804
- --utrecht-blockquote-caption-color: #154273;
805
- --utrecht-blockquote-caption-padding-block-start: 0.75rem;
806
- --utrecht-blockquote-caption-font-weight: 400;
807
- --utrecht-blockquote-caption-line-height: 150%;
808
- --utrecht-blockquote-caption-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
809
- --utrecht-blockquote-caption-font-size: 1.25rem;
810
- --utrecht-blockquote-content-font-weight: 400;
811
- --utrecht-blockquote-content-line-height: 150%;
812
- --utrecht-blockquote-content-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
813
- --utrecht-blockquote-content-font-size: 1.25rem;
814
- --utrecht-blockquote-content-color: #154273;
815
- --utrecht-blockquote-attribution-font-size: 1.25rem;
816
- --utrecht-blockquote-attribution-color: #154273;
817
- --utrecht-blockquote-row-gap: 0.75rem;
818
- --utrecht-blockquote-padding-inline-start: 2rem;
819
- --utrecht-blockquote-padding-inline-end: 2rem;
820
- --utrecht-blockquote-padding-block-start: 2rem;
821
- --utrecht-blockquote-padding-block-end: 2rem;
822
- --utrecht-blockquote-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
823
- --utrecht-blockquote-font-size: 1.25rem;
824
- --utrecht-blockquote-color: #154273;
825
- --utrecht-blockquote-border-width: 0;
826
- --utrecht-blockquote-border-radius: 0;
827
- --utrecht-blockquote-border-color: transparent;
828
- --utrecht-blockquote-border-inline-start-width: 0;
829
- --utrecht-blockquote-background-color: transparent;
900
+ --utrecht-blockquote-border-start-start-radius: 0;
901
+ --utrecht-blockquote-border-start-end-radius: 0;
902
+ --utrecht-blockquote-border-inline-end-width: 0;
903
+ --utrecht-blockquote-border-end-start-radius: 0;
904
+ --utrecht-blockquote-border-end-end-radius: 0;
905
+ --utrecht-blockquote-border-block-start-width: 0;
906
+ --utrecht-blockquote-border-block-end-width: 0;
830
907
  --utrecht-breadcrumb-nav-separator-icon-size: 24px;
831
908
  --utrecht-breadcrumb-nav-separator-color: #334155;
832
909
  --utrecht-breadcrumb-nav-item-first-padding-inline-start: 0rem;
@@ -945,6 +1022,7 @@
945
1022
  --utrecht-button-pressed-color: #fff;
946
1023
  --utrecht-button-pressed-border-color: transparent;
947
1024
  --utrecht-button-pressed-background-color: #1E293B;
1025
+ --utrecht-button-icon-size: 24px;
948
1026
  --utrecht-button-padding-inline-start: 1rem;
949
1027
  --utrecht-button-padding-inline-end: 1rem;
950
1028
  --utrecht-button-padding-block-start: 0.5rem;
@@ -961,15 +1039,49 @@
961
1039
  --utrecht-button-border-radius: 5px;
962
1040
  --utrecht-button-border-color: transparent;
963
1041
  --utrecht-button-background-color: #0F172A;
964
- --utrecht-button-icon-size: 24px;
965
- --utrecht-button-icon-gap: 0.5rem;
966
- --utrecht-checkbox-active-border-color: #4f7196;
967
- --utrecht-checkbox-active-background-color: #fff;
968
- --utrecht-checkbox-active-border-width: 1px;
1042
+ --utrecht-checkbox-focus-border-width: 2px;
1043
+ --utrecht-checkbox-focus-border-color: #154273;
1044
+ --utrecht-checkbox-focus-background-color: #fff;
1045
+ --utrecht-checkbox-hover-border-width: 1px;
969
1046
  --utrecht-checkbox-hover-border-color: #738eab;
970
1047
  --utrecht-checkbox-hover-background-color: #fff;
971
- --utrecht-checkbox-hover-border-width: 1px;
1048
+ --utrecht-checkbox-disabled-border-color: #94A3B8;
1049
+ --utrecht-checkbox-disabled-background-color: #CBD5E1;
1050
+ --utrecht-checkbox-active-border-width: 1px;
1051
+ --utrecht-checkbox-active-border-color: #4f7196;
1052
+ --utrecht-checkbox-active-background-color: #fff;
1053
+ --utrecht-checkbox-invalid-border-width: 1px;
1054
+ --utrecht-checkbox-invalid-border-color: #d52b1e;
1055
+ --utrecht-checkbox-invalid-background-color: #f9dfdd;
1056
+ --utrecht-checkbox-icon-size: 24px;
1057
+ --utrecht-checkbox-size: 24px;
972
1058
  --utrecht-checkbox-border-width: 1px;
1059
+ --utrecht-checkbox-border-radius: 2.5px;
1060
+ --utrecht-checkbox-border-color: #154273;
1061
+ --utrecht-checkbox-background-color: #fff;
1062
+ --utrecht-checkbox-checked-color: #fff;
1063
+ --utrecht-checkbox-checked-border-width: 1px;
1064
+ --utrecht-checkbox-checked-border-color: transparent;
1065
+ --utrecht-checkbox-checked-background-color: #154273;
1066
+ --utrecht-checkbox-checked-focus-border-width: 2px;
1067
+ --utrecht-checkbox-checked-focus-color: #154273;
1068
+ --utrecht-checkbox-checked-focus-border-color: #154273;
1069
+ --utrecht-checkbox-checked-focus-background-color: #fff;
1070
+ --utrecht-checkbox-checked-hover-border-width: 1px;
1071
+ --utrecht-checkbox-checked-hover-color: #fff;
1072
+ --utrecht-checkbox-checked-hover-border-color: transparent;
1073
+ --utrecht-checkbox-checked-hover-background-color: #738eab;
1074
+ --utrecht-checkbox-checked-disabled-color: #475569;
1075
+ --utrecht-checkbox-checked-disabled-border-color: #94A3B8;
1076
+ --utrecht-checkbox-checked-disabled-background-color: #CBD5E1;
1077
+ --utrecht-checkbox-checked-active-border-width: 1px;
1078
+ --utrecht-checkbox-checked-active-color: #fff;
1079
+ --utrecht-checkbox-checked-active-border-color: transparent;
1080
+ --utrecht-checkbox-checked-active-background-color: #4f7196;
1081
+ --utrecht-checkbox-indeterminate-color: #fff;
1082
+ --utrecht-checkbox-indeterminate-border-width: 1px;
1083
+ --utrecht-checkbox-indeterminate-border-color: transparent;
1084
+ --utrecht-checkbox-indeterminate-background-color: #154273;
973
1085
  --utrecht-checkbox-indeterminate-focus-border-width: 2px;
974
1086
  --utrecht-checkbox-indeterminate-focus-color: #154273;
975
1087
  --utrecht-checkbox-indeterminate-focus-border-color: #154273;
@@ -978,62 +1090,13 @@
978
1090
  --utrecht-checkbox-indeterminate-hover-color: #fff;
979
1091
  --utrecht-checkbox-indeterminate-hover-border-color: transparent;
980
1092
  --utrecht-checkbox-indeterminate-hover-background-color: #738eab;
1093
+ --utrecht-checkbox-indeterminate-disabled-color: #475569;
1094
+ --utrecht-checkbox-indeterminate-disabled-border-color: #94A3B8;
1095
+ --utrecht-checkbox-indeterminate-disabled-background-color: #CBD5E1;
981
1096
  --utrecht-checkbox-indeterminate-active-border-width: 1px;
982
1097
  --utrecht-checkbox-indeterminate-active-color: #fff;
983
1098
  --utrecht-checkbox-indeterminate-active-border-color: transparent;
984
1099
  --utrecht-checkbox-indeterminate-active-background-color: #4f7196;
985
- --utrecht-checkbox-indeterminate-disabled-color: #475569;
986
- --utrecht-checkbox-indeterminate-disabled-border-color: #94A3B8;
987
- --utrecht-checkbox-indeterminate-disabled-background-color: #CBD5E1;
988
- --utrecht-checkbox-indeterminate-border-width: 1px;
989
- --utrecht-checkbox-indeterminate-color: #fff;
990
- --utrecht-checkbox-indeterminate-border-color: transparent;
991
- --utrecht-checkbox-indeterminate-background-color: #154273;
992
- --utrecht-checkbox-checked-active-color: #fff;
993
- --utrecht-checkbox-checked-active-border-color: transparent;
994
- --utrecht-checkbox-checked-active-background-color: #4f7196;
995
- --utrecht-checkbox-checked-active-border-width: 1px;
996
- --utrecht-checkbox-checked-hover-color: #fff;
997
- --utrecht-checkbox-checked-hover-border-color: transparent;
998
- --utrecht-checkbox-checked-hover-background-color: #738eab;
999
- --utrecht-checkbox-checked-hover-border-width: 1px;
1000
- --utrecht-checkbox-checked-focus-color: #154273;
1001
- --utrecht-checkbox-checked-focus-border-color: #154273;
1002
- --utrecht-checkbox-checked-focus-background-color: #fff;
1003
- --utrecht-checkbox-checked-focus-border-width: 2px;
1004
- --utrecht-checkbox-checked-disabled-color: #475569;
1005
- --utrecht-checkbox-checked-disabled-border-color: #94A3B8;
1006
- --utrecht-checkbox-checked-disabled-background-color: #CBD5E1;
1007
- --utrecht-checkbox-checked-border-width: 1px;
1008
- --utrecht-checkbox-checked-color: #fff;
1009
- --utrecht-checkbox-checked-border-color: transparent;
1010
- --utrecht-checkbox-checked-background-color: #154273;
1011
- --utrecht-checkbox-disabled-border-color: #94A3B8;
1012
- --utrecht-checkbox-disabled-background-color: #CBD5E1;
1013
- --utrecht-checkbox-focus-border-width: 2px;
1014
- --utrecht-checkbox-focus-border-color: #154273;
1015
- --utrecht-checkbox-focus-background-color: #fff;
1016
- --utrecht-checkbox-invalid-border-width: 1px;
1017
- --utrecht-checkbox-invalid-border-color: #d52b1e;
1018
- --utrecht-checkbox-invalid-background-color: #f9dfdd;
1019
- --utrecht-checkbox-border-color: #154273;
1020
- --utrecht-checkbox-background-color: #fff;
1021
- --utrecht-checkbox-icon-size: 24px;
1022
- --utrecht-checkbox-size: 24px;
1023
- --utrecht-checkbox-border-radius: 2.5px;
1024
- --utrecht-number-badge-padding-block: 0.125rem;
1025
- --utrecht-number-badge-padding-inline: 0.5rem;
1026
- --utrecht-number-badge-color: #fff;
1027
- --utrecht-number-badge-border-color: transparent;
1028
- --utrecht-number-badge-background-color: #154273;
1029
- --utrecht-number-badge-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1030
- --utrecht-number-badge-border-radius: 999px;
1031
- --utrecht-number-badge-border-width: 0px;
1032
- --utrecht-number-badge-font-weight: 700;
1033
- --utrecht-number-badge-min-inline-size: 24px;
1034
- --utrecht-number-badge-min-block-size: 24px;
1035
- --utrecht-number-badge-line-height: 125%;
1036
- --utrecht-number-badge-font-size: 1.25rem;
1037
1100
  --utrecht-data-badge-padding-inline: 0.75rem;
1038
1101
  --utrecht-data-badge-padding-block: 0.125rem;
1039
1102
  --utrecht-data-badge-color: #154273;
@@ -1054,12 +1117,12 @@
1054
1117
  --utrecht-figure-img-border-start-end-radius: 0;
1055
1118
  --utrecht-figure-img-border-end-start-radius: 0;
1056
1119
  --utrecht-figure-img-border-end-end-radius: 0;
1057
- --utrecht-figure-caption-font-size: 1.25rem;
1058
1120
  --utrecht-figure-caption-line-height: 150%;
1121
+ --utrecht-figure-caption-font-size: 1.25rem;
1122
+ --utrecht-figure-caption-color: #0F172A;
1059
1123
  --utrecht-figure-caption-padding-inline-start: 1rem;
1060
1124
  --utrecht-figure-caption-padding-block-start: 0.5rem;
1061
1125
  --utrecht-figure-caption-padding-block-end: 0.5rem;
1062
- --utrecht-figure-caption-color: #154273;
1063
1126
  --utrecht-figure-caption-border-width: 4px;
1064
1127
  --utrecht-figure-caption-border-color: #CBD5E1;
1065
1128
  --utrecht-page-footer-padding-inline-end: 80px;
@@ -1068,33 +1131,39 @@
1068
1131
  --utrecht-page-footer-padding-block-start: 3rem;
1069
1132
  --utrecht-page-footer-color: #fff;
1070
1133
  --utrecht-page-footer-background-color: #154273;
1071
- --utrecht-form-field-error-message-line-height: normal;
1072
- --utrecht-form-field-label-margin-block-end: 0.5rem;
1073
1134
  --utrecht-form-field-invalid-padding-inline-start: 0rem;
1074
1135
  --utrecht-form-field-invalid-border-inline-start-width: 0px;
1075
1136
  --utrecht-form-field-invalid-border-inline-start-color: #d52b1e;
1076
- --utrecht-form-field-margin-block-end: 0.5rem;
1077
1137
  --utrecht-form-field-margin-block-start: 0.5rem;
1078
- --utrecht-form-field-description-padding-block-end: 0.5rem;
1079
- --utrecht-form-field-description-margin-block-end: 0.5rem;
1138
+ --utrecht-form-field-margin-block-end: 0.5rem;
1139
+ --utrecht-form-field-label-margin-block-end: 0.5rem;
1080
1140
  --utrecht-form-field-description-margin-block-start: -0.5rem;
1141
+ --utrecht-form-field-description-margin-block-end: 0.5rem;
1081
1142
  --utrecht-form-field-description-line-height: 150%;
1082
1143
  --utrecht-form-field-description-font-size: 1.25rem;
1083
1144
  --utrecht-form-field-description-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1084
1145
  --utrecht-form-field-description-color: #334155;
1146
+ --utrecht-form-field-description-padding-block-end: 0.5rem;
1147
+ --utrecht-form-field-error-message-padding-inline-start: 0rem;
1148
+ --utrecht-form-field-error-message-padding-inline-end: 0rem;
1149
+ --utrecht-form-field-error-message-padding-block-start: 0rem;
1085
1150
  --utrecht-form-field-error-message-padding-block-end: 0.5rem;
1151
+ --utrecht-form-field-error-message-margin-block-start: 0rem;
1086
1152
  --utrecht-form-field-error-message-margin-block-end: 0.5rem;
1153
+ --utrecht-form-field-error-message-line-height: normal;
1087
1154
  --utrecht-form-field-error-message-font-weight: 400;
1088
1155
  --utrecht-form-field-error-message-font-size: 1.25rem;
1089
1156
  --utrecht-form-field-error-message-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1090
1157
  --utrecht-form-field-error-message-color: #d52b1e;
1091
- --utrecht-form-field-error-message-icon-margin-inline-end: 0.5rem;
1158
+ --utrecht-form-field-error-message-background-color: transparent;
1092
1159
  --utrecht-form-field-error-message-icon-size: 24px;
1093
- --utrecht-form-field-label-line-height: 150%;
1094
- --utrecht-form-field-label-font-weight: 700;
1095
- --utrecht-form-field-label-font-size: 1.25rem;
1096
- --utrecht-form-field-label-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1097
- --utrecht-form-field-label-color: #0F172A;
1160
+ --utrecht-form-field-error-message-icon-margin-inline-end: 0.5rem;
1161
+ --utrecht-form-label-disabled-color: #94A3B8;
1162
+ --utrecht-form-label-checked-font-weight: 400;
1163
+ --utrecht-form-label-radio-font-weight: 400;
1164
+ --utrecht-form-label-radio-color: #0F172A;
1165
+ --utrecht-form-label-checkbox-font-weight: 400;
1166
+ --utrecht-form-label-checkbox-color: #0F172A;
1098
1167
  --utrecht-form-label-font-weight: 700;
1099
1168
  --utrecht-form-label-font-size: 1.25rem;
1100
1169
  --utrecht-form-label-color: #0F172A;
@@ -1177,6 +1246,19 @@
1177
1246
  --utrecht-link-list-margin-block-end: 0rem;
1178
1247
  --utrecht-link-list-item-column-gap: 0.5rem;
1179
1248
  --utrecht-link-list-item-text-decoration: None;
1249
+ --utrecht-number-badge-padding-inline: 0.5rem;
1250
+ --utrecht-number-badge-padding-block: 0.125rem;
1251
+ --utrecht-number-badge-min-inline-size: 24px;
1252
+ --utrecht-number-badge-min-block-size: 24px;
1253
+ --utrecht-number-badge-font-weight: 700;
1254
+ --utrecht-number-badge-font-size: 1.25rem;
1255
+ --utrecht-number-badge-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1256
+ --utrecht-number-badge-color: #fff;
1257
+ --utrecht-number-badge-border-width: 0px;
1258
+ --utrecht-number-badge-border-radius: 999px;
1259
+ --utrecht-number-badge-border-color: transparent;
1260
+ --utrecht-number-badge-background-color: #154273;
1261
+ --utrecht-number-badge-line-height: 125%;
1180
1262
  --utrecht-ordered-list-item-padding-inline-start: 0.5rem;
1181
1263
  --utrecht-ordered-list-item-margin-block-start: 0.25rem;
1182
1264
  --utrecht-ordered-list-item-margin-block-end: 0.25rem;
@@ -1209,82 +1291,91 @@
1209
1291
  --utrecht-pre-heading-font-weight: 700;
1210
1292
  --utrecht-pre-heading-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1211
1293
  --utrecht-pre-heading-color: #0F172A;
1212
- --utrecht-radio-button-border-width: 1px;
1213
- --utrecht-radio-button-border-radius: 999px;
1294
+ --utrecht-radio-button-focus-border-width: 2px;
1295
+ --utrecht-radio-button-focus-color: #154273;
1296
+ --utrecht-radio-button-focus-border-color: #154273;
1297
+ --utrecht-radio-button-focus-background-color: #fff;
1214
1298
  --utrecht-radio-button-hover-border-width: 1px;
1299
+ --utrecht-radio-button-hover-color: #738eab;
1215
1300
  --utrecht-radio-button-hover-border-color: #738eab;
1216
1301
  --utrecht-radio-button-hover-background-color: #fff;
1217
- --utrecht-radio-button-checked-border-width: 1px;
1218
- --utrecht-radio-button-checked-disabled-color: #475569;
1219
- --utrecht-radio-button-checked-disabled-border-color: #94A3B8;
1220
- --utrecht-radio-button-checked-disabled-background-color: #CBD5E1;
1221
- --utrecht-radio-button-checked-focus-border-width: 2px;
1302
+ --utrecht-radio-button-disabled-color: #94A3B8;
1303
+ --utrecht-radio-button-disabled-border-color: #94A3B8;
1304
+ --utrecht-radio-button-disabled-background-color: #CBD5E1;
1305
+ --utrecht-radio-button-active-border-width: 1px;
1306
+ --utrecht-radio-button-active-color: #4f7196;
1307
+ --utrecht-radio-button-active-border-color: #4f7196;
1308
+ --utrecht-radio-button-active-background-color: #fff;
1309
+ --utrecht-radio-button-invalid-border-width: 1px;
1310
+ --utrecht-radio-button-invalid-color: #d52b1e;
1311
+ --utrecht-radio-button-invalid-border-color: #d52b1e;
1312
+ --utrecht-radio-button-invalid-background-color: #f9dfdd;
1313
+ --utrecht-radio-button-icon-size: 12px;
1314
+ --utrecht-radio-button-size: 24px;
1315
+ --utrecht-radio-button-border-width: 1px;
1316
+ --utrecht-radio-button-color: #154273;
1317
+ --utrecht-radio-button-border-color: #154273;
1318
+ --utrecht-radio-button-background-color: #fff;
1222
1319
  --utrecht-radio-button-checked-focus-color: #154273;
1320
+ --utrecht-radio-button-checked-focus-border-width: 2px;
1223
1321
  --utrecht-radio-button-checked-focus-border-color: #154273;
1224
1322
  --utrecht-radio-button-checked-focus-background-color: #fff;
1225
- --utrecht-radio-button-checked-active-border-width: 1px;
1226
- --utrecht-radio-button-checked-active-color: #fff;
1227
- --utrecht-radio-button-checked-active-border-color: transparent;
1228
- --utrecht-radio-button-checked-active-background-color: #4f7196;
1229
- --utrecht-radio-button-checked-hover-border-width: 1px;
1230
1323
  --utrecht-radio-button-checked-hover-color: #fff;
1324
+ --utrecht-radio-button-checked-hover-border-width: 1px;
1231
1325
  --utrecht-radio-button-checked-hover-border-color: transparent;
1232
1326
  --utrecht-radio-button-checked-hover-background-color: #738eab;
1327
+ --utrecht-radio-button-checked-active-color: #fff;
1328
+ --utrecht-radio-button-checked-active-border-width: 1px;
1329
+ --utrecht-radio-button-checked-active-border-color: transparent;
1330
+ --utrecht-radio-button-checked-active-background-color: #4f7196;
1233
1331
  --utrecht-radio-button-checked-color: #fff;
1332
+ --utrecht-radio-button-checked-border-width: 1px;
1234
1333
  --utrecht-radio-button-checked-border-color: transparent;
1235
1334
  --utrecht-radio-button-checked-background-color: #154273;
1236
- --utrecht-radio-button-disabled-color: #475569;
1237
- --utrecht-radio-button-disabled-border-color: #94A3B8;
1238
- --utrecht-radio-button-disabled-background-color: #CBD5E1;
1239
- --utrecht-radio-button-focus-border-width: 2px;
1240
- --utrecht-radio-button-focus-border-color: #154273;
1241
- --utrecht-radio-button-focus-background-color: #fff;
1242
- --utrecht-radio-button-invalid-border-width: 1px;
1243
- --utrecht-radio-button-invalid-border-color: #d52b1e;
1244
- --utrecht-radio-button-invalid-background-color: #f9dfdd;
1245
- --utrecht-radio-button-border-color: #154273;
1246
- --utrecht-radio-button-background-color: #fff;
1335
+ --utrecht-radio-button-checked-disabled-color: #475569;
1336
+ --utrecht-radio-button-checked-disabled-border-color: #94A3B8;
1337
+ --utrecht-radio-button-checked-disabled-background-color: #CBD5E1;
1247
1338
  --utrecht-radio-button-dot-size: 12px;
1248
- --utrecht-radio-button-size: 24px;
1249
- --utrecht-radio-button-active-border-color: #4f7196;
1250
- --utrecht-radio-button-active-background-color: #fff;
1251
- --utrecht-radio-button-active-border-width: 1px;
1252
- --utrecht-select-max-inline-size: 400px;
1253
- --utrecht-select-font-size: 1.25rem;
1254
- --utrecht-select-line-height: 150%;
1255
- --utrecht-select-font-weight: 400;
1256
- --utrecht-select-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1257
- --utrecht-select-border-width: 1px;
1258
- --utrecht-select-border-bottom-width: auto;
1259
- --utrecht-select-border-radius: 2.5px;
1260
- --utrecht-select-padding-inline-start: 0.75rem;
1261
- --utrecht-select-padding-inline-end: 0.75rem;
1262
- --utrecht-select-padding-block-start: 0.5rem;
1263
- --utrecht-select-padding-block-end: 0.5rem;
1264
- --utrecht-select-hover-border-width: 1px;
1265
- --utrecht-select-hover-color: #0F172A;
1266
- --utrecht-select-hover-border-color: #738eab;
1267
- --utrecht-select-hover-background-color: #fff;
1339
+ --utrecht-radio-button-border-radius: 999px;
1268
1340
  --utrecht-select-disabled-color: #475569;
1269
1341
  --utrecht-select-disabled-border-color: #94A3B8;
1270
1342
  --utrecht-select-disabled-background-color: #CBD5E1;
1271
- --utrecht-select-focus-border-width: 2px;
1343
+ --utrecht-select-min-block-size: 48px;
1344
+ --utrecht-select-line-height: 150%;
1345
+ --utrecht-select-font-weight: 400;
1346
+ --utrecht-select-font-size: 1.25rem;
1347
+ --utrecht-select-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1348
+ --utrecht-select-color: #0F172A;
1349
+ --utrecht-select-border-color: #154273;
1350
+ --utrecht-select-border-block-end-width: 1px;
1351
+ --utrecht-select-background-color: #fff;
1272
1352
  --utrecht-select-focus-color: #0F172A;
1273
1353
  --utrecht-select-focus-border-color: #154273;
1274
1354
  --utrecht-select-focus-background-color: #fff;
1275
- --utrecht-select-invalid-border-width: 1px;
1276
- --utrecht-select-invalid-color: #0F172A;
1355
+ --utrecht-select-focus-border-width: 2px;
1356
+ --utrecht-select-hover-color: #0F172A;
1357
+ --utrecht-select-hover-border-color: #738eab;
1358
+ --utrecht-select-hover-background-color: #fff;
1359
+ --utrecht-select-hover-border-width: 1px;
1277
1360
  --utrecht-select-invalid-border-color: #d52b1e;
1361
+ --utrecht-select-invalid-border-block-end-width: 1px;
1278
1362
  --utrecht-select-invalid-background-color: #f9dfdd;
1279
- --utrecht-select-color: #0F172A;
1280
- --utrecht-select-border-color: #154273;
1281
- --utrecht-select-background-color: #fff;
1363
+ --utrecht-select-invalid-color: #0F172A;
1364
+ --utrecht-select-invalid-border-width: 1px;
1282
1365
  --utrecht-select-icon-size: 24px;
1366
+ --utrecht-select-padding-inline-start: 0.75rem;
1367
+ --utrecht-select-padding-inline-end: 0.75rem;
1368
+ --utrecht-select-padding-block-start: 0.5rem;
1369
+ --utrecht-select-padding-block-end: 0.5rem;
1370
+ --utrecht-select-max-inline-size: 400px;
1283
1371
  --utrecht-select-image-background-position: right 0.5rem center;
1372
+ --utrecht-select-border-width: 1px;
1373
+ --utrecht-select-border-radius: 2.5px;
1374
+ --utrecht-select-border-bottom-width: auto;
1284
1375
  --utrecht-separator-margin-block-start: 0.75rem;
1285
1376
  --utrecht-separator-margin-block-end: 0.75rem;
1286
- --utrecht-separator-block-size: 2px;
1287
1377
  --utrecht-separator-color: #CBD5E1;
1378
+ --utrecht-separator-block-size: 2px;
1288
1379
  --utrecht-skip-link-text-decoration: underline;
1289
1380
  --utrecht-skip-link-padding-inline-start: 1rem;
1290
1381
  --utrecht-skip-link-padding-inline-end: 1rem;
@@ -1360,74 +1451,79 @@
1360
1451
  --utrecht-table-header-cell-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1361
1452
  --utrecht-table-header-cell-color: #0F172A;
1362
1453
  --utrecht-table-header-cell-line-height: 150%;
1363
- --utrecht-textarea-font-size: 1.25rem;
1364
- --utrecht-textarea-line-height: 150%;
1365
- --utrecht-textarea-font-weight: 400;
1366
- --utrecht-textarea-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1367
- --utrecht-textarea-border-width: 1px;
1368
- --utrecht-textarea-border-bottom-width: 1px;
1369
- --utrecht-textarea-border-radius: 2.5px;
1370
- --utrecht-textarea-hover-border-width: 1px;
1371
- --utrecht-textarea-hover-color: #0F172A;
1372
- --utrecht-textarea-hover-border-color: #738eab;
1373
- --utrecht-textarea-hover-background-color: #fff;
1374
- --utrecht-textarea-read-only-color: #0F172A;
1375
- --utrecht-textarea-read-only-border-color: transparent;
1376
- --utrecht-textarea-read-only-background-color: #F1F5F9;
1377
1454
  --utrecht-textarea-disabled-color: #475569;
1378
1455
  --utrecht-textarea-disabled-border-color: #94A3B8;
1379
1456
  --utrecht-textarea-disabled-background-color: #CBD5E1;
1380
- --utrecht-textarea-focus-border-width: 2px;
1381
- --utrecht-textarea-focus-color: #0F172A;
1382
- --utrecht-textarea-focus-border-color: #154273;
1383
- --utrecht-textarea-focus-background-color: #fff;
1457
+ --utrecht-textarea-read-only-color: #0F172A;
1458
+ --utrecht-textarea-read-only-border-color: transparent;
1459
+ --utrecht-textarea-read-only-background-color: #F1F5F9;
1384
1460
  --utrecht-textarea-placeholder-color: #64748B;
1385
- --utrecht-textarea-invalid-border-width: 1px;
1386
1461
  --utrecht-textarea-invalid-color: #0F172A;
1462
+ --utrecht-textarea-invalid-border-width: 1px;
1387
1463
  --utrecht-textarea-invalid-border-color: #d52b1e;
1464
+ --utrecht-textarea-invalid-border-block-end-width: 1px;
1388
1465
  --utrecht-textarea-invalid-background-color: #f9dfdd;
1389
- --utrecht-textarea-color: #0F172A;
1390
- --utrecht-textarea-border-color: #154273;
1391
- --utrecht-textarea-background-color: #fff;
1392
1466
  --utrecht-textarea-padding-inline-start: 0.75rem;
1393
1467
  --utrecht-textarea-padding-inline-end: 0.75rem;
1394
1468
  --utrecht-textarea-padding-block-start: 0.5rem;
1395
1469
  --utrecht-textarea-padding-block-end: 0.5rem;
1470
+ --utrecht-textarea-min-block-size: 48px;
1396
1471
  --utrecht-textarea-max-inline-size: 400px;
1397
- --utrecht-textbox-hover-color: #0F172A;
1398
- --utrecht-textbox-hover-border-color: #738eab;
1399
- --utrecht-textbox-hover-background-color: #fff;
1400
- --utrecht-textbox-hover-border-width: 1px;
1401
- --utrecht-textbox-read-only-color: #0F172A;
1402
- --utrecht-textbox-read-only-border-color: transparent;
1403
- --utrecht-textbox-read-only-background-color: #F1F5F9;
1472
+ --utrecht-textarea-line-height: 150%;
1473
+ --utrecht-textarea-font-weight: 400;
1474
+ --utrecht-textarea-font-size: 1.25rem;
1475
+ --utrecht-textarea-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1476
+ --utrecht-textarea-color: #0F172A;
1477
+ --utrecht-textarea-border-width: 1px;
1478
+ --utrecht-textarea-border-radius: 2.5px;
1479
+ --utrecht-textarea-border-color: #154273;
1480
+ --utrecht-textarea-border-block-end-width: 1px;
1481
+ --utrecht-textarea-background-color: #fff;
1482
+ --utrecht-textarea-focus-color: #0F172A;
1483
+ --utrecht-textarea-focus-border-color: #154273;
1484
+ --utrecht-textarea-focus-background-color: #fff;
1485
+ --utrecht-textarea-focus-border-width: 2px;
1486
+ --utrecht-textarea-hover-color: #0F172A;
1487
+ --utrecht-textarea-hover-border-width: 1px;
1488
+ --utrecht-textarea-hover-border-color: #738eab;
1489
+ --utrecht-textarea-hover-background-color: #fff;
1490
+ --utrecht-textarea-border-bottom-width: 1px;
1404
1491
  --utrecht-textbox-disabled-color: #475569;
1405
1492
  --utrecht-textbox-disabled-border-color: #94A3B8;
1406
1493
  --utrecht-textbox-disabled-background-color: #CBD5E1;
1407
- --utrecht-textbox-focus-color: #0F172A;
1408
- --utrecht-textbox-focus-border-color: #154273;
1409
- --utrecht-textbox-focus-background-color: #fff;
1410
- --utrecht-textbox-focus-border-width: 2px;
1411
- --utrecht-textbox-border-width: 1px;
1412
- --utrecht-textbox-border-block-end-width: auto;
1494
+ --utrecht-textbox-read-only-color: #0F172A;
1495
+ --utrecht-textbox-read-only-border-color: transparent;
1496
+ --utrecht-textbox-read-only-background-color: #F1F5F9;
1413
1497
  --utrecht-textbox-placeholder-color: #64748B;
1414
- --utrecht-textbox-invalid-border-width: 1px;
1415
1498
  --utrecht-textbox-invalid-color: #0F172A;
1499
+ --utrecht-textbox-invalid-border-width: 1px;
1416
1500
  --utrecht-textbox-invalid-border-color: #d52b1e;
1501
+ --utrecht-textbox-invalid-border-block-end-width: 1px;
1417
1502
  --utrecht-textbox-invalid-background-color: #f9dfdd;
1418
- --utrecht-textbox-color: #0F172A;
1419
- --utrecht-textbox-border-color: #154273;
1420
- --utrecht-textbox-background-color: #fff;
1421
1503
  --utrecht-textbox-padding-inline-start: 0.75rem;
1422
1504
  --utrecht-textbox-padding-inline-end: 0.75rem;
1423
1505
  --utrecht-textbox-padding-block-start: 0.5rem;
1424
1506
  --utrecht-textbox-padding-block-end: 0.5rem;
1507
+ --utrecht-textbox-min-block-size: 48px;
1425
1508
  --utrecht-textbox-max-inline-size: 400px;
1426
1509
  --utrecht-textbox-line-height: 150%;
1427
1510
  --utrecht-textbox-font-weight: 400;
1428
1511
  --utrecht-textbox-font-size: 1.25rem;
1429
1512
  --utrecht-textbox-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1513
+ --utrecht-textbox-color: #0F172A;
1514
+ --utrecht-textbox-border-width: 1px;
1430
1515
  --utrecht-textbox-border-radius: 2.5px;
1516
+ --utrecht-textbox-border-color: #154273;
1517
+ --utrecht-textbox-border-block-end-width: auto;
1518
+ --utrecht-textbox-background-color: #fff;
1519
+ --utrecht-textbox-focus-color: #0F172A;
1520
+ --utrecht-textbox-focus-border-color: #154273;
1521
+ --utrecht-textbox-focus-background-color: #fff;
1522
+ --utrecht-textbox-focus-border-width: 2px;
1523
+ --utrecht-textbox-hover-color: #0F172A;
1524
+ --utrecht-textbox-hover-border-width: 1px;
1525
+ --utrecht-textbox-hover-border-color: #738eab;
1526
+ --utrecht-textbox-hover-background-color: #fff;
1431
1527
  --utrecht-unordered-list-item-padding-inline-start: 0.5rem;
1432
1528
  --utrecht-unordered-list-item-margin-block-start: 0.25rem;
1433
1529
  --utrecht-unordered-list-item-margin-block-end: 0.25rem;