@rijkshuisstijl-community/design-tokens 4.0.0 → 4.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (104) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/_variables.scss +351 -260
  3. package/dist/index.css +351 -260
  4. package/dist/index.d.ts +350 -259
  5. package/dist/index.js +351 -260
  6. package/dist/index.json +350 -259
  7. package/dist/index.tokens.json +507 -354
  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 +351 -260
  18. package/dist/tokens.d.ts +475 -322
  19. package/dist/tokens.js +18021 -15800
  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 +2138 -1495
  93. package/package.json +1 -1
  94. package/src/generated/base.tokens.json +1876 -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/root.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 Mon, 28 Jul 2025 08:31:48 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -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;
@@ -713,120 +765,140 @@
713
765
  --utrecht-rich-text-friend-margin-block-end: 0.5rem;
714
766
  --utrecht-rich-text-acquaintance-margin-block-end: 1rem;
715
767
  --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;
768
+ --utrecht-accordion-section-margin-block-start: 0rem;
769
+ --utrecht-accordion-section-margin-block-end: 0rem;
770
+ --utrecht-accordion-section-border-width: 1px;
771
+ --utrecht-accordion-section-hover-border-color: #94A3B8;
772
+ --utrecht-accordion-section-border-color: #94A3B8;
732
773
  --utrecht-accordion-panel-padding-inline-start: 1rem;
733
774
  --utrecht-accordion-panel-padding-inline-end: 1rem;
734
775
  --utrecht-accordion-panel-padding-block-start: 1rem;
735
776
  --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;
777
+ --utrecht-accordion-panel-border-width: 1px;
778
+ --utrecht-accordion-panel-border-color: transparent;
779
+ --utrecht-accordion-row-gap: 0rem;
780
+ --utrecht-accordion-margin-block-start: 0rem;
781
+ --utrecht-accordion-margin-block-end: 0rem;
782
+ --utrecht-accordion-button-focus-visible-color: #0F172A;
783
+ --utrecht-accordion-button-focus-visible-border-width: 1px;
784
+ --utrecht-accordion-button-focus-visible-border-color: transparent;
785
+ --utrecht-accordion-button-focus-visible-background-color: #dce3ea;
786
+ --utrecht-accordion-button-hover-color: #0F172A;
787
+ --utrecht-accordion-button-hover-border-color: transparent;
788
+ --utrecht-accordion-button-hover-background-color: #F8FAFC;
789
+ --utrecht-accordion-button-icon-size: 24px;
790
+ --utrecht-accordion-button-padding-inline-start: 1rem;
791
+ --utrecht-accordion-button-padding-inline-end: 1rem;
792
+ --utrecht-accordion-button-padding-block-start: 0.75rem;
793
+ --utrecht-accordion-button-padding-block-end: 0.75rem;
794
+ --utrecht-accordion-button-gap: 0.5rem;
795
+ --utrecht-accordion-button-color: #0F172A;
796
+ --utrecht-accordion-button-border-width: 1px;
797
+ --utrecht-accordion-button-border-radius: 0px;
798
+ --utrecht-accordion-button-border-color: transparent;
799
+ --utrecht-accordion-button-background-color: #fff;
800
+ --utrecht-accordion-button-focus-color: #0F172A;
801
+ --utrecht-accordion-button-focus-border-color: #154273;
802
+ --utrecht-accordion-button-focus-background-color: #dce3ea;
803
+ --utrecht-accordion-button-active-color: #0F172A;
804
+ --utrecht-accordion-button-active-border-color: transparent;
805
+ --utrecht-accordion-button-active-background-color: #F1F5F9;
806
+ --utrecht-accordion-button-active-row-gap: 0;
742
807
  --utrecht-alert-icon-warning-color: #ffb612;
743
808
  --utrecht-alert-icon-ok-color: #39870c;
744
- --utrecht-alert-icon-error-color: #d52b1e;
745
809
  --utrecht-alert-icon-info-color: #007bc7;
810
+ --utrecht-alert-icon-error-color: #d52b1e;
811
+ --utrecht-alert-icon-size: 24px;
746
812
  --utrecht-alert-icon-inset-block-start: 3px;
813
+ --utrecht-alert-icon-color: #007bc7;
747
814
  --utrecht-alert-warning-color: #000;
748
815
  --utrecht-alert-warning-border-color: transparent;
749
816
  --utrecht-alert-warning-background-color: #fff4db;
750
817
  --utrecht-alert-ok-color: #000;
751
818
  --utrecht-alert-ok-border-color: transparent;
752
819
  --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
820
  --utrecht-alert-info-color: #000;
757
821
  --utrecht-alert-info-border-color: transparent;
758
822
  --utrecht-alert-info-background-color: #d9ebf7;
759
- --utrecht-alert-color: #000;
760
- --utrecht-alert-border-color: transparent;
761
- --utrecht-alert-background-color: #d9ebf7;
823
+ --utrecht-alert-error-color: #000;
824
+ --utrecht-alert-error-border-color: transparent;
825
+ --utrecht-alert-error-background-color: #f9dfdd;
826
+ --utrecht-alert-content-row-gap: 0.5rem;
762
827
  --utrecht-alert-padding-inline-start: 1rem;
763
828
  --utrecht-alert-padding-inline-end: 1rem;
764
829
  --utrecht-alert-padding-block-start: 1rem;
765
830
  --utrecht-alert-padding-block-end: 1rem;
766
831
  --utrecht-alert-margin-block-start: 0.75rem;
767
832
  --utrecht-alert-margin-block-end: 0.75rem;
768
- --utrecht-alert-border-width: 0px;
769
833
  --utrecht-alert-column-gap: 0.5rem;
770
- --utrecht-alert-heading-font-size: 1.25rem;
834
+ --utrecht-alert-color: #000;
835
+ --utrecht-alert-border-width: 0px;
836
+ --utrecht-alert-border-radius: 5px;
837
+ --utrecht-alert-border-color: transparent;
838
+ --utrecht-alert-background-color: #d9ebf7;
839
+ --utrecht-alert-message-row-gap: 0rem;
840
+ --utrecht-alert-message-line-height: 150%;
841
+ --utrecht-alert-message-column-gap: 0.5rem;
771
842
  --utrecht-alert-heading-line-height: 150%;
772
843
  --utrecht-alert-heading-font-weight: 700;
844
+ --utrecht-alert-heading-font-size: 1.25rem;
773
845
  --utrecht-alert-heading-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
774
846
  --utrecht-article-max-inline-size: 75ch;
847
+ --utrecht-blockquote-attribution-font-size: 1.25rem;
848
+ --utrecht-blockquote-attribution-color: #154273;
849
+ --utrecht-blockquote-row-gap: 0.75rem;
850
+ --utrecht-blockquote-padding-inline-start: 2rem;
851
+ --utrecht-blockquote-padding-inline-end: 2rem;
852
+ --utrecht-blockquote-padding-block-start: 2rem;
853
+ --utrecht-blockquote-padding-block-end: 2rem;
854
+ --utrecht-blockquote-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
855
+ --utrecht-blockquote-font-size: 1.25rem;
856
+ --utrecht-blockquote-color: #154273;
857
+ --utrecht-blockquote-border-width: 0px;
858
+ --utrecht-blockquote-border-radius: 0px;
859
+ --utrecht-blockquote-border-color: transparent;
860
+ --utrecht-blockquote-border-inline-start-width: 0px;
861
+ --utrecht-blockquote-background-color: transparent;
862
+ --utrecht-blockquote-pink-left-border-variation-padding-inline-start: 2.5rem;
863
+ --utrecht-blockquote-pink-left-border-variation-padding-inline-end: 2.5rem;
864
+ --utrecht-blockquote-pink-left-border-variation-padding-block-start: 1.5rem;
865
+ --utrecht-blockquote-pink-left-border-variation-padding-block-end: 1.5rem;
866
+ --utrecht-blockquote-pink-left-border-variation-border-inline-start-width: 0.75rem;
867
+ --utrecht-blockquote-pink-left-border-variation-border-color: #F6BDE1;
775
868
  --utrecht-blockquote-pink-corner-border-variation-padding: 2.5rem;
776
869
  --utrecht-blockquote-pink-corner-border-variation-border-start-start-radius: 3rem;
777
870
  --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
871
  --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;
872
+ --utrecht-blockquote-pink-corner-border-variation-border-block-start-width: 0.25rem;
786
873
  --utrecht-blockquote-pink-background-variation-padding: 2.5rem;
787
874
  --utrecht-blockquote-pink-background-variation-border-end-start-radius: 3rem;
788
875
  --utrecht-blockquote-pink-background-variation-background-color: #F6BDE1;
789
- --utrecht-blockquote-blue-corner-border-variation-border-end-end-radius: 3rem;
876
+ --utrecht-blockquote-content-font-size: 1.25rem;
877
+ --utrecht-blockquote-content-color: #154273;
878
+ --utrecht-blockquote-content-line-height: 150%;
879
+ --utrecht-blockquote-content-font-weight: 400;
880
+ --utrecht-blockquote-content-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
881
+ --utrecht-blockquote-caption-padding-block-start: 0.75rem;
882
+ --utrecht-blockquote-caption-line-height: 150%;
883
+ --utrecht-blockquote-caption-font-weight: 400;
884
+ --utrecht-blockquote-caption-font-size: 1.25rem;
885
+ --utrecht-blockquote-caption-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
886
+ --utrecht-blockquote-caption-color: #154273;
790
887
  --utrecht-blockquote-blue-corner-border-variation-border-inline-end-width: 2px;
791
- --utrecht-blockquote-blue-corner-border-variation-border-block-end-width: 2px;
888
+ --utrecht-blockquote-blue-corner-border-variation-border-end-end-radius: 3rem;
792
889
  --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;
890
+ --utrecht-blockquote-blue-corner-border-variation-border-block-end-width: 2px;
800
891
  --utrecht-blockquote-margin-inline-start: 0;
801
892
  --utrecht-blockquote-margin-inline-end: 0;
802
893
  --utrecht-blockquote-margin-block-start: 0;
803
894
  --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;
895
+ --utrecht-blockquote-border-start-start-radius: 0;
896
+ --utrecht-blockquote-border-start-end-radius: 0;
897
+ --utrecht-blockquote-border-inline-end-width: 0;
898
+ --utrecht-blockquote-border-end-start-radius: 0;
899
+ --utrecht-blockquote-border-end-end-radius: 0;
900
+ --utrecht-blockquote-border-block-start-width: 0;
901
+ --utrecht-blockquote-border-block-end-width: 0;
830
902
  --utrecht-breadcrumb-nav-separator-icon-size: 24px;
831
903
  --utrecht-breadcrumb-nav-separator-color: #334155;
832
904
  --utrecht-breadcrumb-nav-item-first-padding-inline-start: 0rem;
@@ -945,6 +1017,7 @@
945
1017
  --utrecht-button-pressed-color: #fff;
946
1018
  --utrecht-button-pressed-border-color: transparent;
947
1019
  --utrecht-button-pressed-background-color: #1E293B;
1020
+ --utrecht-button-icon-size: 24px;
948
1021
  --utrecht-button-padding-inline-start: 1rem;
949
1022
  --utrecht-button-padding-inline-end: 1rem;
950
1023
  --utrecht-button-padding-block-start: 0.5rem;
@@ -961,15 +1034,49 @@
961
1034
  --utrecht-button-border-radius: 5px;
962
1035
  --utrecht-button-border-color: transparent;
963
1036
  --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;
1037
+ --utrecht-checkbox-focus-border-width: 2px;
1038
+ --utrecht-checkbox-focus-border-color: #154273;
1039
+ --utrecht-checkbox-focus-background-color: #fff;
1040
+ --utrecht-checkbox-hover-border-width: 1px;
969
1041
  --utrecht-checkbox-hover-border-color: #738eab;
970
1042
  --utrecht-checkbox-hover-background-color: #fff;
971
- --utrecht-checkbox-hover-border-width: 1px;
1043
+ --utrecht-checkbox-disabled-border-color: #94A3B8;
1044
+ --utrecht-checkbox-disabled-background-color: #CBD5E1;
1045
+ --utrecht-checkbox-active-border-width: 1px;
1046
+ --utrecht-checkbox-active-border-color: #4f7196;
1047
+ --utrecht-checkbox-active-background-color: #fff;
1048
+ --utrecht-checkbox-invalid-border-width: 1px;
1049
+ --utrecht-checkbox-invalid-border-color: #d52b1e;
1050
+ --utrecht-checkbox-invalid-background-color: #f9dfdd;
1051
+ --utrecht-checkbox-icon-size: 24px;
1052
+ --utrecht-checkbox-size: 24px;
972
1053
  --utrecht-checkbox-border-width: 1px;
1054
+ --utrecht-checkbox-border-radius: 2.5px;
1055
+ --utrecht-checkbox-border-color: #154273;
1056
+ --utrecht-checkbox-background-color: #fff;
1057
+ --utrecht-checkbox-checked-color: #fff;
1058
+ --utrecht-checkbox-checked-border-width: 1px;
1059
+ --utrecht-checkbox-checked-border-color: transparent;
1060
+ --utrecht-checkbox-checked-background-color: #154273;
1061
+ --utrecht-checkbox-checked-focus-border-width: 2px;
1062
+ --utrecht-checkbox-checked-focus-color: #154273;
1063
+ --utrecht-checkbox-checked-focus-border-color: #154273;
1064
+ --utrecht-checkbox-checked-focus-background-color: #fff;
1065
+ --utrecht-checkbox-checked-hover-border-width: 1px;
1066
+ --utrecht-checkbox-checked-hover-color: #fff;
1067
+ --utrecht-checkbox-checked-hover-border-color: transparent;
1068
+ --utrecht-checkbox-checked-hover-background-color: #738eab;
1069
+ --utrecht-checkbox-checked-disabled-color: #475569;
1070
+ --utrecht-checkbox-checked-disabled-border-color: #94A3B8;
1071
+ --utrecht-checkbox-checked-disabled-background-color: #CBD5E1;
1072
+ --utrecht-checkbox-checked-active-border-width: 1px;
1073
+ --utrecht-checkbox-checked-active-color: #fff;
1074
+ --utrecht-checkbox-checked-active-border-color: transparent;
1075
+ --utrecht-checkbox-checked-active-background-color: #4f7196;
1076
+ --utrecht-checkbox-indeterminate-color: #fff;
1077
+ --utrecht-checkbox-indeterminate-border-width: 1px;
1078
+ --utrecht-checkbox-indeterminate-border-color: transparent;
1079
+ --utrecht-checkbox-indeterminate-background-color: #154273;
973
1080
  --utrecht-checkbox-indeterminate-focus-border-width: 2px;
974
1081
  --utrecht-checkbox-indeterminate-focus-color: #154273;
975
1082
  --utrecht-checkbox-indeterminate-focus-border-color: #154273;
@@ -978,62 +1085,13 @@
978
1085
  --utrecht-checkbox-indeterminate-hover-color: #fff;
979
1086
  --utrecht-checkbox-indeterminate-hover-border-color: transparent;
980
1087
  --utrecht-checkbox-indeterminate-hover-background-color: #738eab;
1088
+ --utrecht-checkbox-indeterminate-disabled-color: #475569;
1089
+ --utrecht-checkbox-indeterminate-disabled-border-color: #94A3B8;
1090
+ --utrecht-checkbox-indeterminate-disabled-background-color: #CBD5E1;
981
1091
  --utrecht-checkbox-indeterminate-active-border-width: 1px;
982
1092
  --utrecht-checkbox-indeterminate-active-color: #fff;
983
1093
  --utrecht-checkbox-indeterminate-active-border-color: transparent;
984
1094
  --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
1095
  --utrecht-data-badge-padding-inline: 0.75rem;
1038
1096
  --utrecht-data-badge-padding-block: 0.125rem;
1039
1097
  --utrecht-data-badge-color: #154273;
@@ -1054,12 +1112,12 @@
1054
1112
  --utrecht-figure-img-border-start-end-radius: 0;
1055
1113
  --utrecht-figure-img-border-end-start-radius: 0;
1056
1114
  --utrecht-figure-img-border-end-end-radius: 0;
1057
- --utrecht-figure-caption-font-size: 1.25rem;
1058
1115
  --utrecht-figure-caption-line-height: 150%;
1116
+ --utrecht-figure-caption-font-size: 1.25rem;
1117
+ --utrecht-figure-caption-color: #0F172A;
1059
1118
  --utrecht-figure-caption-padding-inline-start: 1rem;
1060
1119
  --utrecht-figure-caption-padding-block-start: 0.5rem;
1061
1120
  --utrecht-figure-caption-padding-block-end: 0.5rem;
1062
- --utrecht-figure-caption-color: #154273;
1063
1121
  --utrecht-figure-caption-border-width: 4px;
1064
1122
  --utrecht-figure-caption-border-color: #CBD5E1;
1065
1123
  --utrecht-page-footer-padding-inline-end: 80px;
@@ -1068,33 +1126,39 @@
1068
1126
  --utrecht-page-footer-padding-block-start: 3rem;
1069
1127
  --utrecht-page-footer-color: #fff;
1070
1128
  --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
1129
  --utrecht-form-field-invalid-padding-inline-start: 0rem;
1074
1130
  --utrecht-form-field-invalid-border-inline-start-width: 0px;
1075
1131
  --utrecht-form-field-invalid-border-inline-start-color: #d52b1e;
1076
- --utrecht-form-field-margin-block-end: 0.5rem;
1077
1132
  --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;
1133
+ --utrecht-form-field-margin-block-end: 0.5rem;
1134
+ --utrecht-form-field-label-margin-block-end: 0.5rem;
1080
1135
  --utrecht-form-field-description-margin-block-start: -0.5rem;
1136
+ --utrecht-form-field-description-margin-block-end: 0.5rem;
1081
1137
  --utrecht-form-field-description-line-height: 150%;
1082
1138
  --utrecht-form-field-description-font-size: 1.25rem;
1083
1139
  --utrecht-form-field-description-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1084
1140
  --utrecht-form-field-description-color: #334155;
1141
+ --utrecht-form-field-description-padding-block-end: 0.5rem;
1142
+ --utrecht-form-field-error-message-padding-inline-start: 0rem;
1143
+ --utrecht-form-field-error-message-padding-inline-end: 0rem;
1144
+ --utrecht-form-field-error-message-padding-block-start: 0rem;
1085
1145
  --utrecht-form-field-error-message-padding-block-end: 0.5rem;
1146
+ --utrecht-form-field-error-message-margin-block-start: 0rem;
1086
1147
  --utrecht-form-field-error-message-margin-block-end: 0.5rem;
1148
+ --utrecht-form-field-error-message-line-height: normal;
1087
1149
  --utrecht-form-field-error-message-font-weight: 400;
1088
1150
  --utrecht-form-field-error-message-font-size: 1.25rem;
1089
1151
  --utrecht-form-field-error-message-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1090
1152
  --utrecht-form-field-error-message-color: #d52b1e;
1091
- --utrecht-form-field-error-message-icon-margin-inline-end: 0.5rem;
1153
+ --utrecht-form-field-error-message-background-color: transparent;
1092
1154
  --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;
1155
+ --utrecht-form-field-error-message-icon-margin-inline-end: 0.5rem;
1156
+ --utrecht-form-label-disabled-color: #94A3B8;
1157
+ --utrecht-form-label-checked-font-weight: 400;
1158
+ --utrecht-form-label-radio-font-weight: 400;
1159
+ --utrecht-form-label-radio-color: #0F172A;
1160
+ --utrecht-form-label-checkbox-font-weight: 400;
1161
+ --utrecht-form-label-checkbox-color: #0F172A;
1098
1162
  --utrecht-form-label-font-weight: 700;
1099
1163
  --utrecht-form-label-font-size: 1.25rem;
1100
1164
  --utrecht-form-label-color: #0F172A;
@@ -1177,6 +1241,19 @@
1177
1241
  --utrecht-link-list-margin-block-end: 0rem;
1178
1242
  --utrecht-link-list-item-column-gap: 0.5rem;
1179
1243
  --utrecht-link-list-item-text-decoration: None;
1244
+ --utrecht-number-badge-padding-inline: 0.5rem;
1245
+ --utrecht-number-badge-padding-block: 0.125rem;
1246
+ --utrecht-number-badge-min-inline-size: 24px;
1247
+ --utrecht-number-badge-min-block-size: 24px;
1248
+ --utrecht-number-badge-font-weight: 700;
1249
+ --utrecht-number-badge-font-size: 1.25rem;
1250
+ --utrecht-number-badge-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1251
+ --utrecht-number-badge-color: #fff;
1252
+ --utrecht-number-badge-border-width: 0px;
1253
+ --utrecht-number-badge-border-radius: 999px;
1254
+ --utrecht-number-badge-border-color: transparent;
1255
+ --utrecht-number-badge-background-color: #154273;
1256
+ --utrecht-number-badge-line-height: 125%;
1180
1257
  --utrecht-ordered-list-item-padding-inline-start: 0.5rem;
1181
1258
  --utrecht-ordered-list-item-margin-block-start: 0.25rem;
1182
1259
  --utrecht-ordered-list-item-margin-block-end: 0.25rem;
@@ -1209,82 +1286,91 @@
1209
1286
  --utrecht-pre-heading-font-weight: 700;
1210
1287
  --utrecht-pre-heading-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1211
1288
  --utrecht-pre-heading-color: #0F172A;
1212
- --utrecht-radio-button-border-width: 1px;
1213
- --utrecht-radio-button-border-radius: 999px;
1289
+ --utrecht-radio-button-focus-border-width: 2px;
1290
+ --utrecht-radio-button-focus-color: #154273;
1291
+ --utrecht-radio-button-focus-border-color: #154273;
1292
+ --utrecht-radio-button-focus-background-color: #fff;
1214
1293
  --utrecht-radio-button-hover-border-width: 1px;
1294
+ --utrecht-radio-button-hover-color: #738eab;
1215
1295
  --utrecht-radio-button-hover-border-color: #738eab;
1216
1296
  --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;
1297
+ --utrecht-radio-button-disabled-color: #94A3B8;
1298
+ --utrecht-radio-button-disabled-border-color: #94A3B8;
1299
+ --utrecht-radio-button-disabled-background-color: #CBD5E1;
1300
+ --utrecht-radio-button-active-border-width: 1px;
1301
+ --utrecht-radio-button-active-color: #4f7196;
1302
+ --utrecht-radio-button-active-border-color: #4f7196;
1303
+ --utrecht-radio-button-active-background-color: #fff;
1304
+ --utrecht-radio-button-invalid-border-width: 1px;
1305
+ --utrecht-radio-button-invalid-color: #d52b1e;
1306
+ --utrecht-radio-button-invalid-border-color: #d52b1e;
1307
+ --utrecht-radio-button-invalid-background-color: #f9dfdd;
1308
+ --utrecht-radio-button-icon-size: 12px;
1309
+ --utrecht-radio-button-size: 24px;
1310
+ --utrecht-radio-button-border-width: 1px;
1311
+ --utrecht-radio-button-color: #154273;
1312
+ --utrecht-radio-button-border-color: #154273;
1313
+ --utrecht-radio-button-background-color: #fff;
1222
1314
  --utrecht-radio-button-checked-focus-color: #154273;
1315
+ --utrecht-radio-button-checked-focus-border-width: 2px;
1223
1316
  --utrecht-radio-button-checked-focus-border-color: #154273;
1224
1317
  --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
1318
  --utrecht-radio-button-checked-hover-color: #fff;
1319
+ --utrecht-radio-button-checked-hover-border-width: 1px;
1231
1320
  --utrecht-radio-button-checked-hover-border-color: transparent;
1232
1321
  --utrecht-radio-button-checked-hover-background-color: #738eab;
1322
+ --utrecht-radio-button-checked-active-color: #fff;
1323
+ --utrecht-radio-button-checked-active-border-width: 1px;
1324
+ --utrecht-radio-button-checked-active-border-color: transparent;
1325
+ --utrecht-radio-button-checked-active-background-color: #4f7196;
1233
1326
  --utrecht-radio-button-checked-color: #fff;
1327
+ --utrecht-radio-button-checked-border-width: 1px;
1234
1328
  --utrecht-radio-button-checked-border-color: transparent;
1235
1329
  --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;
1330
+ --utrecht-radio-button-checked-disabled-color: #475569;
1331
+ --utrecht-radio-button-checked-disabled-border-color: #94A3B8;
1332
+ --utrecht-radio-button-checked-disabled-background-color: #CBD5E1;
1247
1333
  --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;
1334
+ --utrecht-radio-button-border-radius: 999px;
1268
1335
  --utrecht-select-disabled-color: #475569;
1269
1336
  --utrecht-select-disabled-border-color: #94A3B8;
1270
1337
  --utrecht-select-disabled-background-color: #CBD5E1;
1271
- --utrecht-select-focus-border-width: 2px;
1338
+ --utrecht-select-min-block-size: 48px;
1339
+ --utrecht-select-line-height: 150%;
1340
+ --utrecht-select-font-weight: 400;
1341
+ --utrecht-select-font-size: 1.25rem;
1342
+ --utrecht-select-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1343
+ --utrecht-select-color: #0F172A;
1344
+ --utrecht-select-border-color: #154273;
1345
+ --utrecht-select-border-block-end-width: 1px;
1346
+ --utrecht-select-background-color: #fff;
1272
1347
  --utrecht-select-focus-color: #0F172A;
1273
1348
  --utrecht-select-focus-border-color: #154273;
1274
1349
  --utrecht-select-focus-background-color: #fff;
1275
- --utrecht-select-invalid-border-width: 1px;
1276
- --utrecht-select-invalid-color: #0F172A;
1350
+ --utrecht-select-focus-border-width: 2px;
1351
+ --utrecht-select-hover-color: #0F172A;
1352
+ --utrecht-select-hover-border-color: #738eab;
1353
+ --utrecht-select-hover-background-color: #fff;
1354
+ --utrecht-select-hover-border-width: 1px;
1277
1355
  --utrecht-select-invalid-border-color: #d52b1e;
1356
+ --utrecht-select-invalid-border-block-end-width: 1px;
1278
1357
  --utrecht-select-invalid-background-color: #f9dfdd;
1279
- --utrecht-select-color: #0F172A;
1280
- --utrecht-select-border-color: #154273;
1281
- --utrecht-select-background-color: #fff;
1358
+ --utrecht-select-invalid-color: #0F172A;
1359
+ --utrecht-select-invalid-border-width: 1px;
1282
1360
  --utrecht-select-icon-size: 24px;
1361
+ --utrecht-select-padding-inline-start: 0.75rem;
1362
+ --utrecht-select-padding-inline-end: 0.75rem;
1363
+ --utrecht-select-padding-block-start: 0.5rem;
1364
+ --utrecht-select-padding-block-end: 0.5rem;
1365
+ --utrecht-select-max-inline-size: 400px;
1283
1366
  --utrecht-select-image-background-position: right 0.5rem center;
1367
+ --utrecht-select-border-width: 1px;
1368
+ --utrecht-select-border-radius: 2.5px;
1369
+ --utrecht-select-border-bottom-width: auto;
1284
1370
  --utrecht-separator-margin-block-start: 0.75rem;
1285
1371
  --utrecht-separator-margin-block-end: 0.75rem;
1286
- --utrecht-separator-block-size: 2px;
1287
1372
  --utrecht-separator-color: #CBD5E1;
1373
+ --utrecht-separator-block-size: 2px;
1288
1374
  --utrecht-skip-link-text-decoration: underline;
1289
1375
  --utrecht-skip-link-padding-inline-start: 1rem;
1290
1376
  --utrecht-skip-link-padding-inline-end: 1rem;
@@ -1360,74 +1446,79 @@
1360
1446
  --utrecht-table-header-cell-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1361
1447
  --utrecht-table-header-cell-color: #0F172A;
1362
1448
  --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
1449
  --utrecht-textarea-disabled-color: #475569;
1378
1450
  --utrecht-textarea-disabled-border-color: #94A3B8;
1379
1451
  --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;
1452
+ --utrecht-textarea-read-only-color: #0F172A;
1453
+ --utrecht-textarea-read-only-border-color: transparent;
1454
+ --utrecht-textarea-read-only-background-color: #F1F5F9;
1384
1455
  --utrecht-textarea-placeholder-color: #64748B;
1385
- --utrecht-textarea-invalid-border-width: 1px;
1386
1456
  --utrecht-textarea-invalid-color: #0F172A;
1457
+ --utrecht-textarea-invalid-border-width: 1px;
1387
1458
  --utrecht-textarea-invalid-border-color: #d52b1e;
1459
+ --utrecht-textarea-invalid-border-block-end-width: 1px;
1388
1460
  --utrecht-textarea-invalid-background-color: #f9dfdd;
1389
- --utrecht-textarea-color: #0F172A;
1390
- --utrecht-textarea-border-color: #154273;
1391
- --utrecht-textarea-background-color: #fff;
1392
1461
  --utrecht-textarea-padding-inline-start: 0.75rem;
1393
1462
  --utrecht-textarea-padding-inline-end: 0.75rem;
1394
1463
  --utrecht-textarea-padding-block-start: 0.5rem;
1395
1464
  --utrecht-textarea-padding-block-end: 0.5rem;
1465
+ --utrecht-textarea-min-block-size: 48px;
1396
1466
  --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;
1467
+ --utrecht-textarea-line-height: 150%;
1468
+ --utrecht-textarea-font-weight: 400;
1469
+ --utrecht-textarea-font-size: 1.25rem;
1470
+ --utrecht-textarea-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1471
+ --utrecht-textarea-color: #0F172A;
1472
+ --utrecht-textarea-border-width: 1px;
1473
+ --utrecht-textarea-border-radius: 2.5px;
1474
+ --utrecht-textarea-border-color: #154273;
1475
+ --utrecht-textarea-border-block-end-width: 1px;
1476
+ --utrecht-textarea-background-color: #fff;
1477
+ --utrecht-textarea-focus-color: #0F172A;
1478
+ --utrecht-textarea-focus-border-color: #154273;
1479
+ --utrecht-textarea-focus-background-color: #fff;
1480
+ --utrecht-textarea-focus-border-width: 2px;
1481
+ --utrecht-textarea-hover-color: #0F172A;
1482
+ --utrecht-textarea-hover-border-width: 1px;
1483
+ --utrecht-textarea-hover-border-color: #738eab;
1484
+ --utrecht-textarea-hover-background-color: #fff;
1485
+ --utrecht-textarea-border-bottom-width: 1px;
1404
1486
  --utrecht-textbox-disabled-color: #475569;
1405
1487
  --utrecht-textbox-disabled-border-color: #94A3B8;
1406
1488
  --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;
1489
+ --utrecht-textbox-read-only-color: #0F172A;
1490
+ --utrecht-textbox-read-only-border-color: transparent;
1491
+ --utrecht-textbox-read-only-background-color: #F1F5F9;
1413
1492
  --utrecht-textbox-placeholder-color: #64748B;
1414
- --utrecht-textbox-invalid-border-width: 1px;
1415
1493
  --utrecht-textbox-invalid-color: #0F172A;
1494
+ --utrecht-textbox-invalid-border-width: 1px;
1416
1495
  --utrecht-textbox-invalid-border-color: #d52b1e;
1496
+ --utrecht-textbox-invalid-border-block-end-width: 1px;
1417
1497
  --utrecht-textbox-invalid-background-color: #f9dfdd;
1418
- --utrecht-textbox-color: #0F172A;
1419
- --utrecht-textbox-border-color: #154273;
1420
- --utrecht-textbox-background-color: #fff;
1421
1498
  --utrecht-textbox-padding-inline-start: 0.75rem;
1422
1499
  --utrecht-textbox-padding-inline-end: 0.75rem;
1423
1500
  --utrecht-textbox-padding-block-start: 0.5rem;
1424
1501
  --utrecht-textbox-padding-block-end: 0.5rem;
1502
+ --utrecht-textbox-min-block-size: 48px;
1425
1503
  --utrecht-textbox-max-inline-size: 400px;
1426
1504
  --utrecht-textbox-line-height: 150%;
1427
1505
  --utrecht-textbox-font-weight: 400;
1428
1506
  --utrecht-textbox-font-size: 1.25rem;
1429
1507
  --utrecht-textbox-font-family: 'Fira Sans', Arial, Verdana, sans-serif;
1508
+ --utrecht-textbox-color: #0F172A;
1509
+ --utrecht-textbox-border-width: 1px;
1430
1510
  --utrecht-textbox-border-radius: 2.5px;
1511
+ --utrecht-textbox-border-color: #154273;
1512
+ --utrecht-textbox-border-block-end-width: auto;
1513
+ --utrecht-textbox-background-color: #fff;
1514
+ --utrecht-textbox-focus-color: #0F172A;
1515
+ --utrecht-textbox-focus-border-color: #154273;
1516
+ --utrecht-textbox-focus-background-color: #fff;
1517
+ --utrecht-textbox-focus-border-width: 2px;
1518
+ --utrecht-textbox-hover-color: #0F172A;
1519
+ --utrecht-textbox-hover-border-width: 1px;
1520
+ --utrecht-textbox-hover-border-color: #738eab;
1521
+ --utrecht-textbox-hover-background-color: #fff;
1431
1522
  --utrecht-unordered-list-item-padding-inline-start: 0.5rem;
1432
1523
  --utrecht-unordered-list-item-margin-block-start: 0.25rem;
1433
1524
  --utrecht-unordered-list-item-margin-block-end: 0.25rem;