@utrecht/component-library-css 8.2.0 → 9.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.css +250 -40
  2. package/dist/prince-xml.css +249 -39
  3. package/package.json +5 -5
package/dist/index.css CHANGED
@@ -386,7 +386,7 @@
386
386
  flex-wrap: wrap;
387
387
  row-gap: var(--utrecht-badge-list-row-gap);
388
388
  }
389
- .utrecht-badge-status {
389
+ .utrecht-status-badge {
390
390
  background-color: var(--utrecht-badge-background-color, hsl(0, 0%, 0%));
391
391
  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
392
392
  color: var(--utrecht-badge-color, hsl(0, 0%, 100%));
@@ -405,65 +405,88 @@
405
405
  padding-inline-end: var(--utrecht-badge-padding-inline, 0.5ch);
406
406
  padding-inline-start: var(--utrecht-badge-padding-inline, 0.5ch);
407
407
  text-decoration: none;
408
- letter-spacing: var(--utrecht-badge-status-letter-spacing, inherit);
409
- text-transform: var(--utrecht-badge-status-text-transform, inherit);
408
+ --utrecht-badge-background-color: var(--utrecht-status-badge-background-color);
409
+ --utrecht-badge-border-radius: var(--utrecht-status-badge-border-radius);
410
+ --utrecht-badge-color: var(--utrecht-status-badge-color);
411
+ --utrecht-badge-font-size: var(--utrecht-status-badge-font-size, inherit);
412
+ --utrecht-badge-font-style: var(--utrecht-status-badge-font-style);
413
+ --utrecht-badge-font-weight: var(--utrecht-status-badge-font-weight);
414
+ --utrecht-badge-line-height: var(--utrecht-status-badge-line-height);
415
+ --utrecht-badge-padding-block: var(--utrecht-status-badge-padding-block);
416
+ --utrecht-badge-padding-inline: var(--utrecht-status-badge-padding-inline);
417
+ border-color: var(--utrecht-status-badge-border-color, transparent);
418
+ border-width: var(--utrecht-status-badge-border-width);
419
+ font-family: var(--utrecht-status-badge-font-family, inherit);
420
+ letter-spacing: var(--utrecht-status-badge-letter-spacing, inherit);
421
+ min-block-size: var(--utrecht-status-badge-min-block-size, 1em);
422
+ min-inline-size: var(--utrecht-status-badge-min-inline-size, 1em);
423
+ text-transform: var(--utrecht-status-badge-text-transform, inherit);
410
424
  }
411
425
  @media screen and (-ms-high-contrast: active), screen and (forced-colors: active) {
412
- .utrecht-badge-status {
426
+ .utrecht-status-badge {
413
427
  border-color: currentColor;
414
428
  border-style: solid;
415
429
  border-width: 1px;
416
430
  }
417
431
  }
418
432
 
419
- .utrecht-badge-status--danger {
420
- background-color: var(--utrecht-feedback-danger-fill-background-color, hsl(0, 100%, 40%));
421
- color: var(--utrecht-feedback-danger-fill-color, white);
433
+ .utrecht-status-badge--danger {
434
+ background-color: var(--utrecht-status-badge-danger-background-color, hsl(0, 100%, 40%));
435
+ border-color: var(--utrecht-status-badge-danger-border-color);
436
+ color: var(--utrecht-status-badge-danger-color, white);
422
437
  }
423
438
 
424
- .utrecht-badge-status--warning {
425
- background-color: var(--utrecht-feedback-warning-fill-background-color, hsl(48, 100%, 50%));
426
- color: var(--utrecht-feedback-warning-fill-color, white);
439
+ .utrecht-status-badge--warning {
440
+ background-color: var(--utrecht-status-badge-warning-background-color, hsl(48, 100%, 50%));
441
+ border-color: var(--utrecht-status-badge-warning-border-color);
442
+ color: var(--utrecht-status-badge-warning-color, white);
427
443
  }
428
444
 
429
- .utrecht-badge-status--safe {
430
- background-color: var(--utrecht-feedback-safe-fill-background-color, hsl(90, 30%, 50%));
431
- color: var(--utrecht-feedback-safe-fill-color, white);
445
+ .utrecht-status-badge--safe {
446
+ background-color: var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%));
447
+ border-color: var(--utrecht-status-badge-safe-border-color);
448
+ color: var(--utrecht-status-badge-safe-color, white);
432
449
  }
433
450
 
434
- .utrecht-badge-status--neutral {
435
- background-color: var(--utrecht-feedback-neutral-fill-background-color, black);
436
- color: var(--utrecht-feedback-neutral-fill-color, white);
451
+ .utrecht-status-badge--neutral {
452
+ background-color: var(--utrecht-status-badge-neutral-background-color, black);
453
+ border-color: var(--utrecht-status-badge-neutral-border-color);
454
+ color: var(--utrecht-status-badge-neutral-color, white);
437
455
  }
438
456
 
439
- .utrecht-badge-status--valid {
440
- background-color: var(--utrecht-feedback-valid-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(90, 30%, 50%)));
441
- color: var(--utrecht-feedback-valid-fill-color, var(--utrecht-feedback-safe-fill-color, white));
457
+ .utrecht-status-badge--valid {
458
+ background-color: var(--utrecht-status-badge-valid-background-color, var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%)));
459
+ border-color: var(--utrecht-status-badge-valid-border-color);
460
+ color: var(--utrecht-status-badge-valid-color, var(--utrecht-status-badge-safe-color, white));
442
461
  }
443
462
 
444
- .utrecht-badge-status--invalid {
445
- background-color: var(--utrecht-feedback-invalid-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(39, 100%, 50%)));
446
- color: var(--utrecht-feedback-invalid-fill-color, var(--utrecht-feedback-danger-fill-color, white));
463
+ .utrecht-status-badge--invalid {
464
+ background-color: var(--utrecht-status-badge-invalid-background-color, var(--utrecht-status-badge-danger-background-color, hsl(39, 100%, 50%)));
465
+ border-color: var(--utrecht-status-badge-invalid-border-color);
466
+ color: var(--utrecht-status-badge-invalid-color, var(--utrecht-status-badge-danger-color, white));
447
467
  }
448
468
 
449
- .utrecht-badge-status--error {
450
- background-color: var(--utrecht-feedback-error-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(0, 100%, 30%)));
451
- color: var(--utrecht-feedback-error-fill-color, var(--utrecht-feedback-danger-fill-color, white));
469
+ .utrecht-status-badge--error {
470
+ background-color: var(--utrecht-status-badge-error-background-color, var(--utrecht-status-badge-danger-background-color, hsl(0, 100%, 30%)));
471
+ color: var(--utrecht-status-badge-error-color, var(--utrecht-status-badge-danger-color, white));
452
472
  }
453
473
 
454
- .utrecht-badge-status--success {
455
- background-color: var(--utrecht-feedback-success-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(90, 30%, 50%)));
456
- color: var(--utrecht-feedback-success-fill-color, var(--utrecht-feedback-safe-fill-color, white));
474
+ .utrecht-status-badge--success {
475
+ background-color: var(--utrecht-status-badge-success-background-color, var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%)));
476
+ border-color: var(--utrecht-status-badge-success-border-color);
477
+ color: var(--utrecht-status-badge-success-color, var(--utrecht-status-badge-safe-color, white));
457
478
  }
458
479
 
459
- .utrecht-badge-status--active {
460
- background-color: var(--utrecht-feedback-active-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(90, 30%, 50%)));
461
- color: var(--utrecht-feedback-active-fill-color, var(--utrecht-feedback-safe-fill-color, white));
480
+ .utrecht-status-badge--active {
481
+ background-color: var(--utrecht-status-badge-active-background-color, var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%)));
482
+ border-color: var(--utrecht-status-badge-active-border-color);
483
+ color: var(--utrecht-status-badge-active-color, var(--utrecht-status-badge-safe-color, white));
462
484
  }
463
485
 
464
- .utrecht-badge-status--inactive {
465
- background-color: var(--utrecht-feedback-inactive-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(0, 100%, 40%)));
466
- color: var(--utrecht-feedback-inactive-fill-color, var(--utrecht-feedback-danger-fill-color, white));
486
+ .utrecht-status-badge--inactive {
487
+ background-color: var(--utrecht-status-badge-inactive-background-color, var(--utrecht-status-badge-danger-background-color, hsl(0, 100%, 40%)));
488
+ border-color: var(--utrecht-status-badge-inactive-border-color);
489
+ color: var(--utrecht-status-badge-inactive-color, var(--utrecht-status-badge-danger-color, white));
467
490
  }
468
491
  .utrecht-blockquote {
469
492
  background-color: var(--utrecht-blockquote-background-color);
@@ -571,6 +594,7 @@
571
594
  font-family: var(--utrecht-document-font-family, inherit);
572
595
  font-size: var(--utrecht-breadcrumb-nav-font-size);
573
596
  line-height: var(--utrecht-breadcrumb-nav-line-height);
597
+ margin-block-end: var(--utrecht-breadcrumb-nav-margin-block-end);
574
598
  text-transform: var(--utrecht-document-text-transform, inherit);
575
599
  }
576
600
 
@@ -4351,8 +4375,6 @@
4351
4375
  }
4352
4376
 
4353
4377
  .utrecht-navigation__link {
4354
- --utrecht-link-focus-text-decoration: underline;
4355
- --utrecht-link-focus-text-decoration-thickness: var(--utrecht-navigation-link-focus-text-decoration-thickness);
4356
4378
  --utrecht-link-text-decoration: none;
4357
4379
  --utrecht-link-active-color: var(--utrecht-navigation-link-active-color);
4358
4380
  --utrecht-link-hover-text-decoration-thickness: var(--utrecht-navigation-link-hover-decoration-thickness);
@@ -4381,18 +4403,37 @@
4381
4403
  --utrecht-navigation-marker-outline-hover-fill: currentColor;
4382
4404
  }
4383
4405
 
4384
- .utrecht-navigation__link:focus {
4406
+ .utrecht-link.utrecht-link--html-a.utrecht-navigation__link:focus-visible {
4407
+ --utrecht-navigation-link-active-focus-color: var(--utrecht-navigation-link-focus-visible-color);
4408
+ --utrecht-link-focus-color: var(--utrecht-navigation-link-focus-visible-color);
4409
+ --utrecht-link-focus-background-color: var(--utrecht-navigation-link-focus-visible-background-color);
4410
+ --utrecht-navigation-link-focus-color: var(--utrecht-navigation-link-focus-visible-color);
4411
+ --utrecht-navigation-link-focus-background-color: var(--utrecht-navigation-link-focus-visible-background-color);
4412
+ --utrecht-link-focus-visible-text-decoration-thickness: var(
4413
+ --utrecht-navigation-link-focus-visible-text-decoration-thickness
4414
+ );
4415
+ --utrecht-link-focus-visible-text-decoration: underline;
4416
+ --utrecht-navigation-marker-color: currentColor;
4417
+ --utrecht-navigation-marker-outline-hover-fill: currentColor;
4418
+ }
4419
+
4420
+ .utrecht-link.utrecht-link--html-a.utrecht-navigation__link:focus {
4385
4421
  --utrecht-link-focus-color: var(--utrecht-navigation-link-focus-color);
4386
- --utrecht-link-focus-background-color: var(--utrecht-color-yellow-80);
4422
+ --utrecht-link-focus-background-color: var(--utrecht-navigation-link-focus-background-color);
4387
4423
  --utrecht-navigation-marker-color: currentColor;
4388
4424
  --utrecht-navigation-marker-outline-hover-fill: currentColor;
4425
+ --utrecht-link-text-decoration-thickness: var(--utrecht-navigation-link-focus-text-decoration-thickness);
4426
+ --utrecht-link-text-decoration: underline;
4389
4427
  }
4390
4428
 
4391
- .utrecht-navigation__link:active:focus {
4392
- --utrecht-link-focus-color: var(--utrecht-navigation-link-active-focus-color);
4429
+ .utrecht-navigation__link:active {
4430
+ --utrecht-link-active-color: var(--utrecht-navigation-link-active-focus-color);
4393
4431
  }
4394
4432
 
4395
4433
  .utrecht-navigation__link--mobile {
4434
+ --utrecht-navigation-link-focus-color: var(--utrecht-navigation-link-mobile-focus-color);
4435
+ --utrecht-navigation-link-focus-background-color: var(--utrecht-navigation-link-mobile-focus-background-color);
4436
+ --utrecht-link-active-color: var(--utrecht-navigation-link-mobile-active-color);
4396
4437
  --_utrecht-navigation-link-align-items: center;
4397
4438
  --_utrecht-navigation-link-justify-content: normal;
4398
4439
  --utrecht-navigation-link-padding-inline-start: var(--utrecht-navigation-link-mobile-padding-inline-start);
@@ -4418,6 +4459,7 @@
4418
4459
  }
4419
4460
 
4420
4461
  .utrecht-navigation__link--is-current {
4462
+ --utrecht-navigation-link-mobile-hover-font-weight: var(--utrecht-navigation-link-is-current-font-weight);
4421
4463
  --utrecht-navigation-link-font-weight: var(--utrecht-navigation-link-is-current-font-weight);
4422
4464
  }
4423
4465
 
@@ -4521,6 +4563,21 @@
4521
4563
  justify-content: flex-end;
4522
4564
  padding-inline-end: var(--utrecht-navigation-toggle-button-padding-inline-end);
4523
4565
  }
4566
+ .utrecht-navigation__toggle-button button:hover {
4567
+ --utrecht-button-subtle-hover-color: var(--utrecht-navigation-toggle-button-hover-color);
4568
+ --utrecht-button-subtle-hover-border-color: var(--utrecht-navigation-toggle-button-hover-border-color);
4569
+ --utrecht-button-subtle-hover-background-color: var(--utrecht-navigation-toggle-button-hover-background-color);
4570
+ }
4571
+ .utrecht-navigation__toggle-button button:focus {
4572
+ --utrecht-button-subtle-focus-color: var(--utrecht-navigation-toggle-button-focus-color);
4573
+ --utrecht-button-subtle-focus-border-color: var(--utrecht-navigation-toggle-button-focus-border-color);
4574
+ --utrecht-button-subtle-focus-background-color: var(--utrecht-navigation-toggle-button-focus-background-color);
4575
+ }
4576
+ .utrecht-navigation__toggle-button button:active {
4577
+ --utrecht-button-subtle-active-color: var(--utrecht-navigation-toggle-button-active-color);
4578
+ --utrecht-button-subtle-active-border-color: var(--utrecht-navigation-toggle-button-active-border-color);
4579
+ --utrecht-button-subtle-active-background-color: var(--utrecht-navigation-toggle-button-active-background-color);
4580
+ }
4524
4581
 
4525
4582
  .utrecht-icon-custom {
4526
4583
  margin-inline-end: var(--utrecht-icon-custom-margin-inline-end);
@@ -5236,6 +5293,9 @@
5236
5293
  .utrecht-rich-text .utrecht-heading-1:has(+ .utrecht-paragraph) {
5237
5294
  --utrecht-heading-1-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5238
5295
  }
5296
+ .utrecht-rich-text .utrecht-heading-1:has(+ .utrecht-spotlight-section) {
5297
+ --utrecht-heading-1-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5298
+ }
5239
5299
  .utrecht-rich-text .utrecht-heading-1:has(+ .utrecht-separator) {
5240
5300
  --utrecht-heading-1-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5241
5301
  }
@@ -5299,6 +5359,9 @@
5299
5359
  .utrecht-rich-text .utrecht-heading-2:has(+ .utrecht-paragraph) {
5300
5360
  --utrecht-heading-2-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5301
5361
  }
5362
+ .utrecht-rich-text .utrecht-heading-2:has(+ .utrecht-spotlight-section) {
5363
+ --utrecht-heading-2-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5364
+ }
5302
5365
  .utrecht-rich-text .utrecht-heading-2:has(+ .utrecht-separator) {
5303
5366
  --utrecht-heading-2-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5304
5367
  }
@@ -5365,6 +5428,9 @@
5365
5428
  .utrecht-rich-text .utrecht-heading-3:has(+ .utrecht-paragraph) {
5366
5429
  --utrecht-heading-3-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5367
5430
  }
5431
+ .utrecht-rich-text .utrecht-heading-3:has(+ .utrecht-spotlight-section) {
5432
+ --utrecht-heading-3-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5433
+ }
5368
5434
  .utrecht-rich-text .utrecht-heading-3:has(+ .utrecht-separator) {
5369
5435
  --utrecht-heading-3-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5370
5436
  }
@@ -5431,6 +5497,9 @@
5431
5497
  .utrecht-rich-text .utrecht-heading-4:has(+ .utrecht-paragraph) {
5432
5498
  --utrecht-heading-4-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5433
5499
  }
5500
+ .utrecht-rich-text .utrecht-heading-4:has(+ .utrecht-spotlight-section) {
5501
+ --utrecht-heading-4-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5502
+ }
5434
5503
  .utrecht-rich-text .utrecht-heading-4:has(+ .utrecht-separator) {
5435
5504
  --utrecht-heading-4-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5436
5505
  }
@@ -5497,6 +5566,9 @@
5497
5566
  .utrecht-rich-text .utrecht-heading-5:has(+ .utrecht-paragraph) {
5498
5567
  --utrecht-heading-5-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5499
5568
  }
5569
+ .utrecht-rich-text .utrecht-heading-5:has(+ .utrecht-spotlight-section) {
5570
+ --utrecht-heading-5-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5571
+ }
5500
5572
  .utrecht-rich-text .utrecht-heading-5:has(+ .utrecht-separator) {
5501
5573
  --utrecht-heading-5-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5502
5574
  }
@@ -5560,6 +5632,9 @@
5560
5632
  .utrecht-rich-text .utrecht-heading-6:has(+ .utrecht-paragraph) {
5561
5633
  --utrecht-heading-6-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5562
5634
  }
5635
+ .utrecht-rich-text .utrecht-heading-6:has(+ .utrecht-spotlight-section) {
5636
+ --utrecht-heading-6-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5637
+ }
5563
5638
  .utrecht-rich-text .utrecht-heading-6:has(+ .utrecht-separator) {
5564
5639
  --utrecht-heading-6-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5565
5640
  }
@@ -5635,6 +5710,9 @@
5635
5710
  .utrecht-rich-text .utrecht-accordion:has(+ .utrecht-paragraph) {
5636
5711
  --utrecht-accordion-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5637
5712
  }
5713
+ .utrecht-rich-text .utrecht-accordion:has(+ .utrecht-spotlight-section) {
5714
+ --utrecht-accordion-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5715
+ }
5638
5716
  .utrecht-rich-text .utrecht-accordion:has(+ .utrecht-separator) {
5639
5717
  --utrecht-accordion-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5640
5718
  }
@@ -5785,6 +5863,9 @@
5785
5863
  .utrecht-rich-text .utrecht-badge-list:has(+ .utrecht-paragraph) {
5786
5864
  --utrecht-badge-list-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5787
5865
  }
5866
+ .utrecht-rich-text .utrecht-badge-list:has(+ .utrecht-spotlight-section) {
5867
+ --utrecht-badge-list-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5868
+ }
5788
5869
  .utrecht-rich-text .utrecht-badge-list:has(+ .utrecht-separator) {
5789
5870
  --utrecht-badge-list-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5790
5871
  }
@@ -5857,6 +5938,9 @@
5857
5938
  .utrecht-rich-text .utrecht-blockquote:has(+ .utrecht-paragraph) {
5858
5939
  --utrecht-blockquote-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5859
5940
  }
5941
+ .utrecht-rich-text .utrecht-blockquote:has(+ .utrecht-spotlight-section) {
5942
+ --utrecht-blockquote-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5943
+ }
5860
5944
  .utrecht-rich-text .utrecht-blockquote:has(+ .utrecht-separator) {
5861
5945
  --utrecht-blockquote-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5862
5946
  }
@@ -5932,6 +6016,9 @@
5932
6016
  .utrecht-rich-text .utrecht-breadcrumb-nav:has(+ .utrecht-paragraph) {
5933
6017
  --utrecht-breadcrumb-nav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5934
6018
  }
6019
+ .utrecht-rich-text .utrecht-breadcrumb-nav:has(+ .utrecht-spotlight-section) {
6020
+ --utrecht-breadcrumb-nav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6021
+ }
5935
6022
  .utrecht-rich-text .utrecht-breadcrumb-nav:has(+ .utrecht-separator) {
5936
6023
  --utrecht-breadcrumb-nav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5937
6024
  }
@@ -6004,6 +6091,9 @@
6004
6091
  .utrecht-rich-text .utrecht-button:has(+ .utrecht-paragraph) {
6005
6092
  --utrecht-button-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6006
6093
  }
6094
+ .utrecht-rich-text .utrecht-button:has(+ .utrecht-spotlight-section) {
6095
+ --utrecht-button-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6096
+ }
6007
6097
  .utrecht-rich-text .utrecht-button:has(+ .utrecht-separator) {
6008
6098
  --utrecht-button-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6009
6099
  }
@@ -6073,6 +6163,9 @@
6073
6163
  .utrecht-rich-text .utrecht-button-group:has(+ .utrecht-paragraph) {
6074
6164
  --utrecht-button-group-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6075
6165
  }
6166
+ .utrecht-rich-text .utrecht-button-group:has(+ .utrecht-spotlight-section) {
6167
+ --utrecht-button-group-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6168
+ }
6076
6169
  .utrecht-rich-text .utrecht-button-group:has(+ .utrecht-separator) {
6077
6170
  --utrecht-button-group-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6078
6171
  }
@@ -6142,6 +6235,9 @@
6142
6235
  .utrecht-rich-text .utrecht-action-group:has(+ .utrecht-paragraph) {
6143
6236
  --utrecht-action-group-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6144
6237
  }
6238
+ .utrecht-rich-text .utrecht-action-group:has(+ .utrecht-spotlight-section) {
6239
+ --utrecht-action-group-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6240
+ }
6145
6241
  .utrecht-rich-text .utrecht-action-group:has(+ .utrecht-separator) {
6146
6242
  --utrecht-action-group-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6147
6243
  }
@@ -6217,6 +6313,9 @@
6217
6313
  .utrecht-rich-text .utrecht-data-list:has(+ .utrecht-paragraph) {
6218
6314
  --utrecht-data-list-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6219
6315
  }
6316
+ .utrecht-rich-text .utrecht-data-list:has(+ .utrecht-spotlight-section) {
6317
+ --utrecht-data-list-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6318
+ }
6220
6319
  .utrecht-rich-text .utrecht-data-list:has(+ .utrecht-separator) {
6221
6320
  --utrecht-data-list-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6222
6321
  }
@@ -6355,6 +6454,9 @@
6355
6454
  .utrecht-rich-text .utrecht-form-field:has(+ .utrecht-paragraph) {
6356
6455
  --utrecht-form-field-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6357
6456
  }
6457
+ .utrecht-rich-text .utrecht-form-field:has(+ .utrecht-spotlight-section) {
6458
+ --utrecht-form-field-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6459
+ }
6358
6460
  .utrecht-rich-text .utrecht-form-field:has(+ .utrecht-separator) {
6359
6461
  --utrecht-form-field-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6360
6462
  }
@@ -6475,6 +6577,9 @@
6475
6577
  .utrecht-rich-text .utrecht-img:has(+ .utrecht-paragraph) {
6476
6578
  --utrecht-img-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6477
6579
  }
6580
+ .utrecht-rich-text .utrecht-img:has(+ .utrecht-spotlight-section) {
6581
+ --utrecht-img-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6582
+ }
6478
6583
  .utrecht-rich-text .utrecht-img:has(+ .utrecht-separator) {
6479
6584
  --utrecht-img-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6480
6585
  }
@@ -6541,6 +6646,9 @@
6541
6646
  .utrecht-rich-text .utrecht-link:has(+ .utrecht-paragraph) {
6542
6647
  --utrecht-link-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6543
6648
  }
6649
+ .utrecht-rich-text .utrecht-link:has(+ .utrecht-spotlight-section) {
6650
+ --utrecht-link-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6651
+ }
6544
6652
  .utrecht-rich-text .utrecht-link:has(+ .utrecht-separator) {
6545
6653
  --utrecht-link-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6546
6654
  }
@@ -6613,6 +6721,9 @@
6613
6721
  .utrecht-rich-text .utrecht-ordered-list:has(+ .utrecht-paragraph) {
6614
6722
  --utrecht-ordered-list-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6615
6723
  }
6724
+ .utrecht-rich-text .utrecht-ordered-list:has(+ .utrecht-spotlight-section) {
6725
+ --utrecht-ordered-list-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6726
+ }
6616
6727
  .utrecht-rich-text .utrecht-ordered-list:has(+ .utrecht-separator) {
6617
6728
  --utrecht-ordered-list-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6618
6729
  }
@@ -6679,6 +6790,9 @@
6679
6790
  .utrecht-rich-text .utrecht-pagination:has(+ .utrecht-paragraph) {
6680
6791
  --utrecht-pagination-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6681
6792
  }
6793
+ .utrecht-rich-text .utrecht-pagination:has(+ .utrecht-spotlight-section) {
6794
+ --utrecht-pagination-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6795
+ }
6682
6796
  .utrecht-rich-text .utrecht-pagination:has(+ .utrecht-separator) {
6683
6797
  --utrecht-pagination-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6684
6798
  }
@@ -6748,6 +6862,9 @@
6748
6862
  .utrecht-rich-text .utrecht-paragraph:has(+ .utrecht-paragraph) {
6749
6863
  --utrecht-paragraph-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6750
6864
  }
6865
+ .utrecht-rich-text .utrecht-paragraph:has(+ .utrecht-spotlight-section) {
6866
+ --utrecht-paragraph-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6867
+ }
6751
6868
  .utrecht-rich-text .utrecht-paragraph:has(+ .utrecht-separator) {
6752
6869
  --utrecht-paragraph-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6753
6870
  }
@@ -6829,6 +6946,9 @@
6829
6946
  .utrecht-rich-text .utrecht-separator:has(+ .utrecht-paragraph) {
6830
6947
  --utrecht-separator-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6831
6948
  }
6949
+ .utrecht-rich-text .utrecht-separator:has(+ .utrecht-spotlight-section) {
6950
+ --utrecht-separator-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6951
+ }
6832
6952
  .utrecht-rich-text .utrecht-separator:has(+ .utrecht-separator) {
6833
6953
  --utrecht-separator-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6834
6954
  }
@@ -6841,6 +6961,87 @@
6841
6961
  .utrecht-rich-text .utrecht-separator:has(+ .utrecht-unordered-list) {
6842
6962
  --utrecht-separator-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6843
6963
  }
6964
+ .utrecht-rich-text .utrecht-spotlight-section:first-child {
6965
+ --utrecht-spotlight-section-margin-block-start: 0;
6966
+ }
6967
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-1) {
6968
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6969
+ }
6970
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-2) {
6971
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6972
+ }
6973
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-3) {
6974
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6975
+ }
6976
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-4) {
6977
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6978
+ }
6979
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-5) {
6980
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6981
+ }
6982
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-6) {
6983
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6984
+ }
6985
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-accordion) {
6986
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6987
+ }
6988
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-badge-list) {
6989
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6990
+ }
6991
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-blockquote) {
6992
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6993
+ }
6994
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-button) {
6995
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6996
+ }
6997
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-button-group) {
6998
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6999
+ }
7000
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-action-group) {
7001
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
7002
+ }
7003
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-badge-counter) {
7004
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7005
+ }
7006
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-data-list) {
7007
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7008
+ }
7009
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-figure) {
7010
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
7011
+ }
7012
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-form-field) {
7013
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7014
+ }
7015
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-img) {
7016
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7017
+ }
7018
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-link) {
7019
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7020
+ }
7021
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-ordered-list) {
7022
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7023
+ }
7024
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-pagination) {
7025
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
7026
+ }
7027
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-paragraph) {
7028
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7029
+ }
7030
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-spotlight-section) {
7031
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7032
+ }
7033
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-separator) {
7034
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
7035
+ }
7036
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-badge-status) {
7037
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
7038
+ }
7039
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-table) {
7040
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7041
+ }
7042
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-unordered-list) {
7043
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7044
+ }
6844
7045
  .utrecht-rich-text .utrecht-sidenav:first-child {
6845
7046
  --utrecht-sidenav-margin-block-start: 0;
6846
7047
  }
@@ -6901,6 +7102,9 @@
6901
7102
  .utrecht-rich-text .utrecht-sidenav:has(+ .utrecht-pagination) {
6902
7103
  --utrecht-sidenav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6903
7104
  }
7105
+ .utrecht-rich-text .utrecht-sidenav:has(+ .utrecht-spotlight-section) {
7106
+ --utrecht-sidenav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
7107
+ }
6904
7108
  .utrecht-rich-text .utrecht-sidenav:has(+ .utrecht-separator) {
6905
7109
  --utrecht-sidenav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6906
7110
  }
@@ -6991,6 +7195,9 @@
6991
7195
  .utrecht-rich-text .utrecht-table:has(+ .utrecht-paragraph) {
6992
7196
  --utrecht-table-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6993
7197
  }
7198
+ .utrecht-rich-text .utrecht-table:has(+ .utrecht-spotlight-section) {
7199
+ --utrecht-table-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7200
+ }
6994
7201
  .utrecht-rich-text .utrecht-table:has(+ .utrecht-separator) {
6995
7202
  --utrecht-table-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6996
7203
  }
@@ -7078,6 +7285,9 @@
7078
7285
  .utrecht-rich-text .utrecht-unordered-list:has(+ .utrecht-paragraph) {
7079
7286
  --utrecht-unordered-list-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
7080
7287
  }
7288
+ .utrecht-rich-text .utrecht-unordered-list:has(+ .utrecht-spotlight-section) {
7289
+ --utrecht-unordered-list-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7290
+ }
7081
7291
  .utrecht-rich-text .utrecht-unordered-list:has(+ .utrecht-separator) {
7082
7292
  --utrecht-unordered-list-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
7083
7293
  }
package/dist/prince-xml.css CHANGED
@@ -358,7 +358,7 @@
358
358
  flex-wrap: wrap;
359
359
  row-gap: var(--utrecht-badge-list-row-gap);
360
360
  }
361
- .utrecht-badge-status {
361
+ .utrecht-status-badge {
362
362
  background-color: var(--utrecht-badge-background-color, hsl(0, 0%, 0%));
363
363
  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
364
364
  color: var(--utrecht-badge-color, hsl(0, 0%, 100%));
@@ -377,58 +377,81 @@
377
377
  padding-right: var(--utrecht-badge-padding-inline, 0.5ch);
378
378
  padding-left: var(--utrecht-badge-padding-inline, 0.5ch);
379
379
  text-decoration: none;
380
- letter-spacing: var(--utrecht-badge-status-letter-spacing, inherit);
381
- text-transform: var(--utrecht-badge-status-text-transform, inherit);
380
+ --utrecht-badge-background-color: var(--utrecht-status-badge-background-color);
381
+ --utrecht-badge-border-radius: var(--utrecht-status-badge-border-radius);
382
+ --utrecht-badge-color: var(--utrecht-status-badge-color);
383
+ --utrecht-badge-font-size: var(--utrecht-status-badge-font-size, inherit);
384
+ --utrecht-badge-font-style: var(--utrecht-status-badge-font-style);
385
+ --utrecht-badge-font-weight: var(--utrecht-status-badge-font-weight);
386
+ --utrecht-badge-line-height: var(--utrecht-status-badge-line-height);
387
+ --utrecht-badge-padding-block: var(--utrecht-status-badge-padding-block);
388
+ --utrecht-badge-padding-inline: var(--utrecht-status-badge-padding-inline);
389
+ border-color: var(--utrecht-status-badge-border-color, transparent);
390
+ border-width: var(--utrecht-status-badge-border-width);
391
+ font-family: var(--utrecht-status-badge-font-family, inherit);
392
+ letter-spacing: var(--utrecht-status-badge-letter-spacing, inherit);
393
+ min-height: var(--utrecht-status-badge-min-block-size, 1em);
394
+ min-width: var(--utrecht-status-badge-min-inline-size, 1em);
395
+ text-transform: var(--utrecht-status-badge-text-transform, inherit);
382
396
  }
383
397
 
384
- .utrecht-badge-status--danger {
385
- background-color: var(--utrecht-feedback-danger-fill-background-color, hsl(0, 100%, 40%));
386
- color: var(--utrecht-feedback-danger-fill-color, white);
398
+ .utrecht-status-badge--danger {
399
+ background-color: var(--utrecht-status-badge-danger-background-color, hsl(0, 100%, 40%));
400
+ border-color: var(--utrecht-status-badge-danger-border-color);
401
+ color: var(--utrecht-status-badge-danger-color, white);
387
402
  }
388
403
 
389
- .utrecht-badge-status--warning {
390
- background-color: var(--utrecht-feedback-warning-fill-background-color, hsl(48, 100%, 50%));
391
- color: var(--utrecht-feedback-warning-fill-color, white);
404
+ .utrecht-status-badge--warning {
405
+ background-color: var(--utrecht-status-badge-warning-background-color, hsl(48, 100%, 50%));
406
+ border-color: var(--utrecht-status-badge-warning-border-color);
407
+ color: var(--utrecht-status-badge-warning-color, white);
392
408
  }
393
409
 
394
- .utrecht-badge-status--safe {
395
- background-color: var(--utrecht-feedback-safe-fill-background-color, hsl(90, 30%, 50%));
396
- color: var(--utrecht-feedback-safe-fill-color, white);
410
+ .utrecht-status-badge--safe {
411
+ background-color: var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%));
412
+ border-color: var(--utrecht-status-badge-safe-border-color);
413
+ color: var(--utrecht-status-badge-safe-color, white);
397
414
  }
398
415
 
399
- .utrecht-badge-status--neutral {
400
- background-color: var(--utrecht-feedback-neutral-fill-background-color, black);
401
- color: var(--utrecht-feedback-neutral-fill-color, white);
416
+ .utrecht-status-badge--neutral {
417
+ background-color: var(--utrecht-status-badge-neutral-background-color, black);
418
+ border-color: var(--utrecht-status-badge-neutral-border-color);
419
+ color: var(--utrecht-status-badge-neutral-color, white);
402
420
  }
403
421
 
404
- .utrecht-badge-status--valid {
405
- background-color: var(--utrecht-feedback-valid-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(90, 30%, 50%)));
406
- color: var(--utrecht-feedback-valid-fill-color, var(--utrecht-feedback-safe-fill-color, white));
422
+ .utrecht-status-badge--valid {
423
+ background-color: var(--utrecht-status-badge-valid-background-color, var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%)));
424
+ border-color: var(--utrecht-status-badge-valid-border-color);
425
+ color: var(--utrecht-status-badge-valid-color, var(--utrecht-status-badge-safe-color, white));
407
426
  }
408
427
 
409
- .utrecht-badge-status--invalid {
410
- background-color: var(--utrecht-feedback-invalid-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(39, 100%, 50%)));
411
- color: var(--utrecht-feedback-invalid-fill-color, var(--utrecht-feedback-danger-fill-color, white));
428
+ .utrecht-status-badge--invalid {
429
+ background-color: var(--utrecht-status-badge-invalid-background-color, var(--utrecht-status-badge-danger-background-color, hsl(39, 100%, 50%)));
430
+ border-color: var(--utrecht-status-badge-invalid-border-color);
431
+ color: var(--utrecht-status-badge-invalid-color, var(--utrecht-status-badge-danger-color, white));
412
432
  }
413
433
 
414
- .utrecht-badge-status--error {
415
- background-color: var(--utrecht-feedback-error-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(0, 100%, 30%)));
416
- color: var(--utrecht-feedback-error-fill-color, var(--utrecht-feedback-danger-fill-color, white));
434
+ .utrecht-status-badge--error {
435
+ background-color: var(--utrecht-status-badge-error-background-color, var(--utrecht-status-badge-danger-background-color, hsl(0, 100%, 30%)));
436
+ color: var(--utrecht-status-badge-error-color, var(--utrecht-status-badge-danger-color, white));
417
437
  }
418
438
 
419
- .utrecht-badge-status--success {
420
- background-color: var(--utrecht-feedback-success-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(90, 30%, 50%)));
421
- color: var(--utrecht-feedback-success-fill-color, var(--utrecht-feedback-safe-fill-color, white));
439
+ .utrecht-status-badge--success {
440
+ background-color: var(--utrecht-status-badge-success-background-color, var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%)));
441
+ border-color: var(--utrecht-status-badge-success-border-color);
442
+ color: var(--utrecht-status-badge-success-color, var(--utrecht-status-badge-safe-color, white));
422
443
  }
423
444
 
424
- .utrecht-badge-status--active {
425
- background-color: var(--utrecht-feedback-active-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(90, 30%, 50%)));
426
- color: var(--utrecht-feedback-active-fill-color, var(--utrecht-feedback-safe-fill-color, white));
445
+ .utrecht-status-badge--active {
446
+ background-color: var(--utrecht-status-badge-active-background-color, var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%)));
447
+ border-color: var(--utrecht-status-badge-active-border-color);
448
+ color: var(--utrecht-status-badge-active-color, var(--utrecht-status-badge-safe-color, white));
427
449
  }
428
450
 
429
- .utrecht-badge-status--inactive {
430
- background-color: var(--utrecht-feedback-inactive-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(0, 100%, 40%)));
431
- color: var(--utrecht-feedback-inactive-fill-color, var(--utrecht-feedback-danger-fill-color, white));
451
+ .utrecht-status-badge--inactive {
452
+ background-color: var(--utrecht-status-badge-inactive-background-color, var(--utrecht-status-badge-danger-background-color, hsl(0, 100%, 40%)));
453
+ border-color: var(--utrecht-status-badge-inactive-border-color);
454
+ color: var(--utrecht-status-badge-inactive-color, var(--utrecht-status-badge-danger-color, white));
432
455
  }
433
456
  .utrecht-blockquote {
434
457
  background-color: var(--utrecht-blockquote-background-color);
@@ -536,6 +559,7 @@
536
559
  font-family: var(--utrecht-document-font-family, inherit);
537
560
  font-size: var(--utrecht-breadcrumb-nav-font-size);
538
561
  line-height: var(--utrecht-breadcrumb-nav-line-height);
562
+ margin-bottom: var(--utrecht-breadcrumb-nav-margin-block-end);
539
563
  text-transform: var(--utrecht-document-text-transform, inherit);
540
564
  }
541
565
 
@@ -4213,8 +4237,6 @@
4213
4237
  }
4214
4238
 
4215
4239
  .utrecht-navigation__link {
4216
- --utrecht-link-focus-text-decoration: underline;
4217
- --utrecht-link-focus-text-decoration-thickness: var(--utrecht-navigation-link-focus-text-decoration-thickness);
4218
4240
  --utrecht-link-text-decoration: none;
4219
4241
  --utrecht-link-active-color: var(--utrecht-navigation-link-active-color);
4220
4242
  --utrecht-link-hover-text-decoration-thickness: var(--utrecht-navigation-link-hover-decoration-thickness);
@@ -4243,18 +4265,37 @@
4243
4265
  --utrecht-navigation-marker-outline-hover-fill: currentColor;
4244
4266
  }
4245
4267
 
4246
- .utrecht-navigation__link:focus {
4268
+ .utrecht-link.utrecht-link--html-a.utrecht-navigation__link[prince-xml-ignore-pseudo-class-focus-visible] {
4269
+ --utrecht-navigation-link-active-focus-color: var(--utrecht-navigation-link-focus-visible-color);
4270
+ --utrecht-link-focus-color: var(--utrecht-navigation-link-focus-visible-color);
4271
+ --utrecht-link-focus-background-color: var(--utrecht-navigation-link-focus-visible-background-color);
4272
+ --utrecht-navigation-link-focus-color: var(--utrecht-navigation-link-focus-visible-color);
4273
+ --utrecht-navigation-link-focus-background-color: var(--utrecht-navigation-link-focus-visible-background-color);
4274
+ --utrecht-link-focus-visible-text-decoration-thickness: var(
4275
+ --utrecht-navigation-link-focus-visible-text-decoration-thickness
4276
+ );
4277
+ --utrecht-link-focus-visible-text-decoration: underline;
4278
+ --utrecht-navigation-marker-color: currentColor;
4279
+ --utrecht-navigation-marker-outline-hover-fill: currentColor;
4280
+ }
4281
+
4282
+ .utrecht-link.utrecht-link--html-a.utrecht-navigation__link:focus {
4247
4283
  --utrecht-link-focus-color: var(--utrecht-navigation-link-focus-color);
4248
- --utrecht-link-focus-background-color: var(--utrecht-color-yellow-80);
4284
+ --utrecht-link-focus-background-color: var(--utrecht-navigation-link-focus-background-color);
4249
4285
  --utrecht-navigation-marker-color: currentColor;
4250
4286
  --utrecht-navigation-marker-outline-hover-fill: currentColor;
4287
+ --utrecht-link-text-decoration-thickness: var(--utrecht-navigation-link-focus-text-decoration-thickness);
4288
+ --utrecht-link-text-decoration: underline;
4251
4289
  }
4252
4290
 
4253
- .utrecht-navigation__link:active:focus {
4254
- --utrecht-link-focus-color: var(--utrecht-navigation-link-active-focus-color);
4291
+ .utrecht-navigation__link:active {
4292
+ --utrecht-link-active-color: var(--utrecht-navigation-link-active-focus-color);
4255
4293
  }
4256
4294
 
4257
4295
  .utrecht-navigation__link--mobile {
4296
+ --utrecht-navigation-link-focus-color: var(--utrecht-navigation-link-mobile-focus-color);
4297
+ --utrecht-navigation-link-focus-background-color: var(--utrecht-navigation-link-mobile-focus-background-color);
4298
+ --utrecht-link-active-color: var(--utrecht-navigation-link-mobile-active-color);
4258
4299
  --_utrecht-navigation-link-align-items: center;
4259
4300
  --_utrecht-navigation-link-justify-content: normal;
4260
4301
  --utrecht-navigation-link-padding-inline-start: var(--utrecht-navigation-link-mobile-padding-inline-start);
@@ -4280,6 +4321,7 @@
4280
4321
  }
4281
4322
 
4282
4323
  .utrecht-navigation__link--is-current {
4324
+ --utrecht-navigation-link-mobile-hover-font-weight: var(--utrecht-navigation-link-is-current-font-weight);
4283
4325
  --utrecht-navigation-link-font-weight: var(--utrecht-navigation-link-is-current-font-weight);
4284
4326
  }
4285
4327
 
@@ -4383,6 +4425,21 @@
4383
4425
  justify-content: flex-end;
4384
4426
  padding-right: var(--utrecht-navigation-toggle-button-padding-inline-end);
4385
4427
  }
4428
+ .utrecht-navigation__toggle-button button:hover {
4429
+ --utrecht-button-subtle-hover-color: var(--utrecht-navigation-toggle-button-hover-color);
4430
+ --utrecht-button-subtle-hover-border-color: var(--utrecht-navigation-toggle-button-hover-border-color);
4431
+ --utrecht-button-subtle-hover-background-color: var(--utrecht-navigation-toggle-button-hover-background-color);
4432
+ }
4433
+ .utrecht-navigation__toggle-button button:focus {
4434
+ --utrecht-button-subtle-focus-color: var(--utrecht-navigation-toggle-button-focus-color);
4435
+ --utrecht-button-subtle-focus-border-color: var(--utrecht-navigation-toggle-button-focus-border-color);
4436
+ --utrecht-button-subtle-focus-background-color: var(--utrecht-navigation-toggle-button-focus-background-color);
4437
+ }
4438
+ .utrecht-navigation__toggle-button button:active {
4439
+ --utrecht-button-subtle-active-color: var(--utrecht-navigation-toggle-button-active-color);
4440
+ --utrecht-button-subtle-active-border-color: var(--utrecht-navigation-toggle-button-active-border-color);
4441
+ --utrecht-button-subtle-active-background-color: var(--utrecht-navigation-toggle-button-active-background-color);
4442
+ }
4386
4443
 
4387
4444
  .utrecht-icon-custom {
4388
4445
  margin-right: var(--utrecht-icon-custom-margin-inline-end);
@@ -5092,6 +5149,9 @@
5092
5149
  .utrecht-rich-text .utrecht-heading-1:has(+ .utrecht-paragraph) {
5093
5150
  --utrecht-heading-1-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5094
5151
  }
5152
+ .utrecht-rich-text .utrecht-heading-1:has(+ .utrecht-spotlight-section) {
5153
+ --utrecht-heading-1-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5154
+ }
5095
5155
  .utrecht-rich-text .utrecht-heading-1:has(+ .utrecht-separator) {
5096
5156
  --utrecht-heading-1-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5097
5157
  }
@@ -5155,6 +5215,9 @@
5155
5215
  .utrecht-rich-text .utrecht-heading-2:has(+ .utrecht-paragraph) {
5156
5216
  --utrecht-heading-2-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5157
5217
  }
5218
+ .utrecht-rich-text .utrecht-heading-2:has(+ .utrecht-spotlight-section) {
5219
+ --utrecht-heading-2-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5220
+ }
5158
5221
  .utrecht-rich-text .utrecht-heading-2:has(+ .utrecht-separator) {
5159
5222
  --utrecht-heading-2-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5160
5223
  }
@@ -5221,6 +5284,9 @@
5221
5284
  .utrecht-rich-text .utrecht-heading-3:has(+ .utrecht-paragraph) {
5222
5285
  --utrecht-heading-3-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5223
5286
  }
5287
+ .utrecht-rich-text .utrecht-heading-3:has(+ .utrecht-spotlight-section) {
5288
+ --utrecht-heading-3-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5289
+ }
5224
5290
  .utrecht-rich-text .utrecht-heading-3:has(+ .utrecht-separator) {
5225
5291
  --utrecht-heading-3-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5226
5292
  }
@@ -5287,6 +5353,9 @@
5287
5353
  .utrecht-rich-text .utrecht-heading-4:has(+ .utrecht-paragraph) {
5288
5354
  --utrecht-heading-4-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5289
5355
  }
5356
+ .utrecht-rich-text .utrecht-heading-4:has(+ .utrecht-spotlight-section) {
5357
+ --utrecht-heading-4-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5358
+ }
5290
5359
  .utrecht-rich-text .utrecht-heading-4:has(+ .utrecht-separator) {
5291
5360
  --utrecht-heading-4-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5292
5361
  }
@@ -5353,6 +5422,9 @@
5353
5422
  .utrecht-rich-text .utrecht-heading-5:has(+ .utrecht-paragraph) {
5354
5423
  --utrecht-heading-5-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5355
5424
  }
5425
+ .utrecht-rich-text .utrecht-heading-5:has(+ .utrecht-spotlight-section) {
5426
+ --utrecht-heading-5-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5427
+ }
5356
5428
  .utrecht-rich-text .utrecht-heading-5:has(+ .utrecht-separator) {
5357
5429
  --utrecht-heading-5-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5358
5430
  }
@@ -5416,6 +5488,9 @@
5416
5488
  .utrecht-rich-text .utrecht-heading-6:has(+ .utrecht-paragraph) {
5417
5489
  --utrecht-heading-6-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5418
5490
  }
5491
+ .utrecht-rich-text .utrecht-heading-6:has(+ .utrecht-spotlight-section) {
5492
+ --utrecht-heading-6-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5493
+ }
5419
5494
  .utrecht-rich-text .utrecht-heading-6:has(+ .utrecht-separator) {
5420
5495
  --utrecht-heading-6-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5421
5496
  }
@@ -5491,6 +5566,9 @@
5491
5566
  .utrecht-rich-text .utrecht-accordion:has(+ .utrecht-paragraph) {
5492
5567
  --utrecht-accordion-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5493
5568
  }
5569
+ .utrecht-rich-text .utrecht-accordion:has(+ .utrecht-spotlight-section) {
5570
+ --utrecht-accordion-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5571
+ }
5494
5572
  .utrecht-rich-text .utrecht-accordion:has(+ .utrecht-separator) {
5495
5573
  --utrecht-accordion-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5496
5574
  }
@@ -5641,6 +5719,9 @@
5641
5719
  .utrecht-rich-text .utrecht-badge-list:has(+ .utrecht-paragraph) {
5642
5720
  --utrecht-badge-list-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5643
5721
  }
5722
+ .utrecht-rich-text .utrecht-badge-list:has(+ .utrecht-spotlight-section) {
5723
+ --utrecht-badge-list-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5724
+ }
5644
5725
  .utrecht-rich-text .utrecht-badge-list:has(+ .utrecht-separator) {
5645
5726
  --utrecht-badge-list-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5646
5727
  }
@@ -5713,6 +5794,9 @@
5713
5794
  .utrecht-rich-text .utrecht-blockquote:has(+ .utrecht-paragraph) {
5714
5795
  --utrecht-blockquote-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5715
5796
  }
5797
+ .utrecht-rich-text .utrecht-blockquote:has(+ .utrecht-spotlight-section) {
5798
+ --utrecht-blockquote-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
5799
+ }
5716
5800
  .utrecht-rich-text .utrecht-blockquote:has(+ .utrecht-separator) {
5717
5801
  --utrecht-blockquote-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5718
5802
  }
@@ -5788,6 +5872,9 @@
5788
5872
  .utrecht-rich-text .utrecht-breadcrumb-nav:has(+ .utrecht-paragraph) {
5789
5873
  --utrecht-breadcrumb-nav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5790
5874
  }
5875
+ .utrecht-rich-text .utrecht-breadcrumb-nav:has(+ .utrecht-spotlight-section) {
5876
+ --utrecht-breadcrumb-nav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5877
+ }
5791
5878
  .utrecht-rich-text .utrecht-breadcrumb-nav:has(+ .utrecht-separator) {
5792
5879
  --utrecht-breadcrumb-nav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5793
5880
  }
@@ -5860,6 +5947,9 @@
5860
5947
  .utrecht-rich-text .utrecht-button:has(+ .utrecht-paragraph) {
5861
5948
  --utrecht-button-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5862
5949
  }
5950
+ .utrecht-rich-text .utrecht-button:has(+ .utrecht-spotlight-section) {
5951
+ --utrecht-button-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5952
+ }
5863
5953
  .utrecht-rich-text .utrecht-button:has(+ .utrecht-separator) {
5864
5954
  --utrecht-button-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5865
5955
  }
@@ -5929,6 +6019,9 @@
5929
6019
  .utrecht-rich-text .utrecht-button-group:has(+ .utrecht-paragraph) {
5930
6020
  --utrecht-button-group-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
5931
6021
  }
6022
+ .utrecht-rich-text .utrecht-button-group:has(+ .utrecht-spotlight-section) {
6023
+ --utrecht-button-group-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6024
+ }
5932
6025
  .utrecht-rich-text .utrecht-button-group:has(+ .utrecht-separator) {
5933
6026
  --utrecht-button-group-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
5934
6027
  }
@@ -5998,6 +6091,9 @@
5998
6091
  .utrecht-rich-text .utrecht-action-group:has(+ .utrecht-paragraph) {
5999
6092
  --utrecht-action-group-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6000
6093
  }
6094
+ .utrecht-rich-text .utrecht-action-group:has(+ .utrecht-spotlight-section) {
6095
+ --utrecht-action-group-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6096
+ }
6001
6097
  .utrecht-rich-text .utrecht-action-group:has(+ .utrecht-separator) {
6002
6098
  --utrecht-action-group-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6003
6099
  }
@@ -6073,6 +6169,9 @@
6073
6169
  .utrecht-rich-text .utrecht-data-list:has(+ .utrecht-paragraph) {
6074
6170
  --utrecht-data-list-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6075
6171
  }
6172
+ .utrecht-rich-text .utrecht-data-list:has(+ .utrecht-spotlight-section) {
6173
+ --utrecht-data-list-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6174
+ }
6076
6175
  .utrecht-rich-text .utrecht-data-list:has(+ .utrecht-separator) {
6077
6176
  --utrecht-data-list-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6078
6177
  }
@@ -6211,6 +6310,9 @@
6211
6310
  .utrecht-rich-text .utrecht-form-field:has(+ .utrecht-paragraph) {
6212
6311
  --utrecht-form-field-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6213
6312
  }
6313
+ .utrecht-rich-text .utrecht-form-field:has(+ .utrecht-spotlight-section) {
6314
+ --utrecht-form-field-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6315
+ }
6214
6316
  .utrecht-rich-text .utrecht-form-field:has(+ .utrecht-separator) {
6215
6317
  --utrecht-form-field-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6216
6318
  }
@@ -6331,6 +6433,9 @@
6331
6433
  .utrecht-rich-text .utrecht-img:has(+ .utrecht-paragraph) {
6332
6434
  --utrecht-img-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6333
6435
  }
6436
+ .utrecht-rich-text .utrecht-img:has(+ .utrecht-spotlight-section) {
6437
+ --utrecht-img-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6438
+ }
6334
6439
  .utrecht-rich-text .utrecht-img:has(+ .utrecht-separator) {
6335
6440
  --utrecht-img-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6336
6441
  }
@@ -6397,6 +6502,9 @@
6397
6502
  .utrecht-rich-text .utrecht-link:has(+ .utrecht-paragraph) {
6398
6503
  --utrecht-link-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6399
6504
  }
6505
+ .utrecht-rich-text .utrecht-link:has(+ .utrecht-spotlight-section) {
6506
+ --utrecht-link-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6507
+ }
6400
6508
  .utrecht-rich-text .utrecht-link:has(+ .utrecht-separator) {
6401
6509
  --utrecht-link-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6402
6510
  }
@@ -6469,6 +6577,9 @@
6469
6577
  .utrecht-rich-text .utrecht-ordered-list:has(+ .utrecht-paragraph) {
6470
6578
  --utrecht-ordered-list-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6471
6579
  }
6580
+ .utrecht-rich-text .utrecht-ordered-list:has(+ .utrecht-spotlight-section) {
6581
+ --utrecht-ordered-list-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6582
+ }
6472
6583
  .utrecht-rich-text .utrecht-ordered-list:has(+ .utrecht-separator) {
6473
6584
  --utrecht-ordered-list-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6474
6585
  }
@@ -6535,6 +6646,9 @@
6535
6646
  .utrecht-rich-text .utrecht-pagination:has(+ .utrecht-paragraph) {
6536
6647
  --utrecht-pagination-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6537
6648
  }
6649
+ .utrecht-rich-text .utrecht-pagination:has(+ .utrecht-spotlight-section) {
6650
+ --utrecht-pagination-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6651
+ }
6538
6652
  .utrecht-rich-text .utrecht-pagination:has(+ .utrecht-separator) {
6539
6653
  --utrecht-pagination-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6540
6654
  }
@@ -6604,6 +6718,9 @@
6604
6718
  .utrecht-rich-text .utrecht-paragraph:has(+ .utrecht-paragraph) {
6605
6719
  --utrecht-paragraph-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6606
6720
  }
6721
+ .utrecht-rich-text .utrecht-paragraph:has(+ .utrecht-spotlight-section) {
6722
+ --utrecht-paragraph-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6723
+ }
6607
6724
  .utrecht-rich-text .utrecht-paragraph:has(+ .utrecht-separator) {
6608
6725
  --utrecht-paragraph-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6609
6726
  }
@@ -6685,6 +6802,9 @@
6685
6802
  .utrecht-rich-text .utrecht-separator:has(+ .utrecht-paragraph) {
6686
6803
  --utrecht-separator-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6687
6804
  }
6805
+ .utrecht-rich-text .utrecht-separator:has(+ .utrecht-spotlight-section) {
6806
+ --utrecht-separator-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6807
+ }
6688
6808
  .utrecht-rich-text .utrecht-separator:has(+ .utrecht-separator) {
6689
6809
  --utrecht-separator-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6690
6810
  }
@@ -6697,6 +6817,87 @@
6697
6817
  .utrecht-rich-text .utrecht-separator:has(+ .utrecht-unordered-list) {
6698
6818
  --utrecht-separator-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6699
6819
  }
6820
+ .utrecht-rich-text .utrecht-spotlight-section:first-child {
6821
+ --utrecht-spotlight-section-margin-block-start: 0;
6822
+ }
6823
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-1) {
6824
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6825
+ }
6826
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-2) {
6827
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6828
+ }
6829
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-3) {
6830
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6831
+ }
6832
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-4) {
6833
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6834
+ }
6835
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-5) {
6836
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6837
+ }
6838
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-heading-6) {
6839
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6840
+ }
6841
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-accordion) {
6842
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6843
+ }
6844
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-badge-list) {
6845
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6846
+ }
6847
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-blockquote) {
6848
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6849
+ }
6850
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-button) {
6851
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6852
+ }
6853
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-button-group) {
6854
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6855
+ }
6856
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-action-group) {
6857
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6858
+ }
6859
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-badge-counter) {
6860
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6861
+ }
6862
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-data-list) {
6863
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6864
+ }
6865
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-figure) {
6866
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6867
+ }
6868
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-form-field) {
6869
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6870
+ }
6871
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-img) {
6872
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6873
+ }
6874
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-link) {
6875
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6876
+ }
6877
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-ordered-list) {
6878
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6879
+ }
6880
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-pagination) {
6881
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6882
+ }
6883
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-paragraph) {
6884
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6885
+ }
6886
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-spotlight-section) {
6887
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6888
+ }
6889
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-separator) {
6890
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6891
+ }
6892
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-badge-status) {
6893
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6894
+ }
6895
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-table) {
6896
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6897
+ }
6898
+ .utrecht-rich-text .utrecht-spotlight-section:has(+ .utrecht-unordered-list) {
6899
+ --utrecht-spotlight-section-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
6900
+ }
6700
6901
  .utrecht-rich-text .utrecht-sidenav:first-child {
6701
6902
  --utrecht-sidenav-margin-block-start: 0;
6702
6903
  }
@@ -6757,6 +6958,9 @@
6757
6958
  .utrecht-rich-text .utrecht-sidenav:has(+ .utrecht-pagination) {
6758
6959
  --utrecht-sidenav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6759
6960
  }
6961
+ .utrecht-rich-text .utrecht-sidenav:has(+ .utrecht-spotlight-section) {
6962
+ --utrecht-sidenav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6963
+ }
6760
6964
  .utrecht-rich-text .utrecht-sidenav:has(+ .utrecht-separator) {
6761
6965
  --utrecht-sidenav-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6762
6966
  }
@@ -6847,6 +7051,9 @@
6847
7051
  .utrecht-rich-text .utrecht-table:has(+ .utrecht-paragraph) {
6848
7052
  --utrecht-table-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6849
7053
  }
7054
+ .utrecht-rich-text .utrecht-table:has(+ .utrecht-spotlight-section) {
7055
+ --utrecht-table-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7056
+ }
6850
7057
  .utrecht-rich-text .utrecht-table:has(+ .utrecht-separator) {
6851
7058
  --utrecht-table-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6852
7059
  }
@@ -6934,6 +7141,9 @@
6934
7141
  .utrecht-rich-text .utrecht-unordered-list:has(+ .utrecht-paragraph) {
6935
7142
  --utrecht-unordered-list-margin-block-end: var(--utrecht-rich-text-friend-margin-block-end);
6936
7143
  }
7144
+ .utrecht-rich-text .utrecht-unordered-list:has(+ .utrecht-spotlight-section) {
7145
+ --utrecht-unordered-list-margin-block-end: var(--utrecht-rich-text-acquaintance-margin-block-end);
7146
+ }
6937
7147
  .utrecht-rich-text .utrecht-unordered-list:has(+ .utrecht-separator) {
6938
7148
  --utrecht-unordered-list-margin-block-end: var(--utrecht-rich-text-stranger-margin-block-end);
6939
7149
  }
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "8.2.0",
2
+ "version": "9.0.0",
3
3
  "author": "Community for NL Design System",
4
4
  "description": "Component library bundle for the Municipality of Utrecht based on the NL Design System architecture",
5
5
  "license": "EUPL-1.2",
@@ -29,10 +29,9 @@
29
29
  "@utrecht/backdrop-css": "2.0.1",
30
30
  "@utrecht/badge-counter-css": "2.0.1",
31
31
  "@utrecht/badge-list-css": "3.0.1",
32
- "@utrecht/badge-status-css": "2.0.1",
33
32
  "@utrecht/blockquote-css": "2.0.1",
34
33
  "@utrecht/body-css": "2.0.1",
35
- "@utrecht/breadcrumb-nav-css": "2.0.1",
34
+ "@utrecht/breadcrumb-nav-css": "2.1.0",
36
35
  "@utrecht/button-css": "3.0.1",
37
36
  "@utrecht/button-group-css": "2.0.1",
38
37
  "@utrecht/button-link-css": "2.0.1",
@@ -87,7 +86,7 @@
87
86
  "@utrecht/multiline-data-css": "2.0.1",
88
87
  "@utrecht/nav-bar-css": "2.0.1",
89
88
  "@utrecht/nav-list-css": "1.3.2",
90
- "@utrecht/navigation-css": "1.0.1",
89
+ "@utrecht/navigation-css": "1.1.1",
91
90
  "@utrecht/number-badge-css": "3.0.1",
92
91
  "@utrecht/number-data-css": "2.0.1",
93
92
  "@utrecht/ordered-list-css": "3.0.1",
@@ -102,13 +101,14 @@
102
101
  "@utrecht/pre-heading-css": "2.0.1",
103
102
  "@utrecht/preserve-data-css": "2.0.1",
104
103
  "@utrecht/radio-button-css": "2.0.1",
105
- "@utrecht/rich-text-css": "2.0.1",
104
+ "@utrecht/rich-text-css": "2.1.0",
106
105
  "@utrecht/root-css": "2.0.1",
107
106
  "@utrecht/search-bar-css": "3.0.1",
108
107
  "@utrecht/select-css": "2.0.1",
109
108
  "@utrecht/separator-css": "2.0.1",
110
109
  "@utrecht/skip-link-css": "2.0.1",
111
110
  "@utrecht/spotlight-section-css": "2.0.1",
111
+ "@utrecht/status-badge-css": "1.0.0",
112
112
  "@utrecht/surface-css": "2.0.1",
113
113
  "@utrecht/table-css": "2.0.1",
114
114
  "@utrecht/table-of-contents-css": "1.0.1",