@utrecht/component-library-css 1.0.0-alpha.114 → 1.0.0-alpha.115

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 (5) hide show
  1. package/dist/bem.css +154 -46
  2. package/dist/html.css +222 -91
  3. package/dist/index.css +423 -169
  4. package/dist/root-theme.css +1 -1
  5. package/package.json +3 -3
package/dist/index.css CHANGED
@@ -375,7 +375,9 @@ ol.utrecht-breadcrumb__list {
375
375
  cursor: var(--utrecht-action-submit-cursor);
376
376
  }
377
377
 
378
- .utrecht-button--busy, .utrecht-html button[aria-busy=true] {
378
+ .utrecht-button--busy, .utrecht-html button[aria-busy=true],
379
+ .utrecht-html button[aria-disabled=true][aria-busy=true],
380
+ .utrecht-html button:disabled[aria-busy=true] {
379
381
  cursor: var(--utrecht-action-busy-cursor);
380
382
  }
381
383
 
@@ -383,27 +385,27 @@ ol.utrecht-breadcrumb__list {
383
385
  .utrecht-html input[type=reset i]:disabled,
384
386
  .utrecht-html input[type=submit i]:disabled,
385
387
  .utrecht-html button:disabled,
386
- .utrecht-button--disabled {
388
+ .utrecht-button--disabled,
389
+ .utrecht-html button[aria-disabled=true] {
387
390
  background-color: var(--utrecht-button-disabled-background-color, var(--utrecht-button-background-color));
388
391
  color: var(--utrecht-button-disabled-color, var(--utrecht-button-color));
389
392
  cursor: var(--utrecht-action-disabled-cursor);
390
393
  }
391
394
 
392
- .utrecht-button:active, .utrecht-html input[type=button i]:active,
393
- .utrecht-html input[type=reset i]:active,
394
- .utrecht-html input[type=submit i]:active,
395
- .utrecht-html button:active,
396
- .utrecht-button--active {
395
+ .utrecht-button:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled), .utrecht-html input[type=button i]:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
396
+ .utrecht-html input[type=reset i]:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
397
+ .utrecht-html input[type=submit i]:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
398
+ .utrecht-button--active,
399
+ .utrecht-html button:active:not([aria-disabled=true]):not(:disabled) {
397
400
  background-color: var(--utrecht-button-active-background-color, var(--utrecht-button-background-color));
398
401
  color: var(--utrecht-button-active-color, var(--utrecht-button-color));
399
402
  }
400
403
 
401
- .utrecht-button--focus-visible,
402
- .utrecht-button:focus-visible,
403
- .utrecht-html input[type=button i]:focus-visible,
404
- .utrecht-html input[type=reset i]:focus-visible,
405
- .utrecht-html input[type=submit i]:focus-visible,
406
- .utrecht-html button:focus-visible {
404
+ .utrecht-button--focus-visible, .utrecht-html button:focus-visible, .utrecht-button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled), .utrecht-html input[type=button i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
405
+ .utrecht-html input[type=reset i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
406
+ .utrecht-html input[type=submit i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
407
+ .utrecht-html button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled) {
408
+ /* the pseudo-class for `:focus-visible` is implemented via the mixin */
407
409
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
408
410
  outline-color: var(--utrecht-focus-outline-color, transparent);
409
411
  outline-offset: 0;
@@ -411,20 +413,30 @@ ol.utrecht-breadcrumb__list {
411
413
  outline-width: var(--utrecht-focus-outline-width, 0);
412
414
  }
413
415
 
414
- .utrecht-button--focus, .utrecht-html button:focus,
415
- .utrecht-button:not(.utrecht-button--disabled):focus,
416
- .utrecht-html input[type=button i]:not(.utrecht-button--disabled):focus,
417
- .utrecht-html input[type=reset i]:not(.utrecht-button--disabled):focus,
418
- .utrecht-html input[type=submit i]:not(.utrecht-button--disabled):focus {
416
+ .utrecht-button--focus, .utrecht-html button:focus:not([aria-disabled=true]):not(:disabled), .utrecht-button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled), .utrecht-html input[type=button i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
417
+ .utrecht-html input[type=reset i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
418
+ .utrecht-html input[type=submit i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
419
+ .utrecht-html button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled) {
419
420
  background-color: var(--utrecht-button-focus-background-color, var(--utrecht-button-background-color));
420
421
  color: var(--utrecht-button-focus-color, var(--utrecht-button-color));
421
422
  }
422
423
 
423
- .utrecht-button--hover:not(:disabled), .utrecht-html button:not(:disabled):hover,
424
- .utrecht-button:hover:not(:disabled):not(.utrecht-button--disabled),
425
- .utrecht-html input[type=button i]:hover:not(:disabled):not(.utrecht-button--disabled),
426
- .utrecht-html input[type=reset i]:hover:not(:disabled):not(.utrecht-button--disabled),
427
- .utrecht-html input[type=submit i]:hover:not(:disabled):not(.utrecht-button--disabled) {
424
+ /* override the `:focus` selector above */
425
+ /* stylelint-disable-next-line no-descending-specificity */
426
+ .utrecht-button:focus:not(:focus-visible), .utrecht-html input[type=button i]:focus:not(:focus-visible),
427
+ .utrecht-html input[type=reset i]:focus:not(:focus-visible),
428
+ .utrecht-html input[type=submit i]:focus:not(:focus-visible),
429
+ .utrecht-html button:focus:not(:focus-visible) {
430
+ /* undo focus ring */
431
+ box-shadow: none;
432
+ outline-style: none;
433
+ }
434
+
435
+ .utrecht-button--hover:not(:disabled), .utrecht-html button:not(:disabled):hover:not([aria-disabled=true]),
436
+ .utrecht-button:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
437
+ .utrecht-html input[type=button i]:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
438
+ .utrecht-html input[type=reset i]:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
439
+ .utrecht-html input[type=submit i]:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled) {
428
440
  background-color: var(--utrecht-button-hover-background-color, var(--utrecht-button-background-color));
429
441
  color: var(--utrecht-button-hover-color, var(--utrecht-button-color));
430
442
  transform: scale(var(--utrecht-button-focus-transform-scale, 1));
@@ -453,13 +465,26 @@ ol.utrecht-breadcrumb__list {
453
465
  cursor: var(--utrecht-action-disabled-cursor);
454
466
  }
455
467
 
456
- .utrecht-checkbox--focus-visible, .utrecht-checkbox--html-input:focus-visible, .utrecht-html input[type=checkbox i]:focus-visible {
468
+ .utrecht-checkbox--focus-visible {
469
+ box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
470
+ outline-color: var(--utrecht-focus-outline-color, transparent);
471
+ outline-offset: 0;
472
+ outline-style: var(--utrecht-focus-outline-style, solid);
473
+ outline-width: var(--utrecht-focus-outline-width, 0);
474
+ }
475
+
476
+ .utrecht-checkbox--html-input:focus, .utrecht-html input[type=checkbox i]:focus {
457
477
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
458
478
  outline-color: var(--utrecht-focus-outline-color, transparent);
459
479
  outline-offset: 0;
460
480
  outline-style: var(--utrecht-focus-outline-style, solid);
461
481
  outline-width: var(--utrecht-focus-outline-width, 0);
462
482
  }
483
+ .utrecht-checkbox--html-input:focus:not(:focus-visible), .utrecht-html input[type=checkbox i]:focus:not(:focus-visible) {
484
+ /* undo focus ring */
485
+ box-shadow: none;
486
+ outline-style: none;
487
+ }
463
488
 
464
489
  /**
465
490
  * @license EUPL-1.2
@@ -488,7 +513,7 @@ ol.utrecht-breadcrumb__list {
488
513
  cursor: var(--utrecht-action-disabled-cursor);
489
514
  }
490
515
 
491
- .utrecht-checkbox--focus-visible, .utrecht-checkbox--html-input:focus-visible, .utrecht-html input[type=checkbox i]:focus-visible {
516
+ .utrecht-checkbox--focus-visible {
492
517
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
493
518
  outline-color: var(--utrecht-focus-outline-color, transparent);
494
519
  outline-offset: 0;
@@ -496,6 +521,19 @@ ol.utrecht-breadcrumb__list {
496
521
  outline-width: var(--utrecht-focus-outline-width, 0);
497
522
  }
498
523
 
524
+ .utrecht-checkbox--html-input:focus, .utrecht-html input[type=checkbox i]:focus {
525
+ box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
526
+ outline-color: var(--utrecht-focus-outline-color, transparent);
527
+ outline-offset: 0;
528
+ outline-style: var(--utrecht-focus-outline-style, solid);
529
+ outline-width: var(--utrecht-focus-outline-width, 0);
530
+ }
531
+ .utrecht-checkbox--html-input:focus:not(:focus-visible), .utrecht-html input[type=checkbox i]:focus:not(:focus-visible) {
532
+ /* undo focus ring */
533
+ box-shadow: none;
534
+ outline-style: none;
535
+ }
536
+
499
537
  /**
500
538
  * @license EUPL-1.2
501
539
  * Copyright (c) 2021 Gemeente Utrecht
@@ -586,7 +624,7 @@ ol.utrecht-breadcrumb__list {
586
624
  color: var(--utrecht-custom-checkbox-focus-color, var(--utrecht-custom-checkbox-color));
587
625
  }
588
626
 
589
- .utrecht-custom-checkbox__box--focus-visible, .utrecht-custom-checkbox__input:focus-visible ~ .utrecht-custom-checkbox__box {
627
+ .utrecht-custom-checkbox__box--focus-visible {
590
628
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
591
629
  outline-color: var(--utrecht-focus-outline-color, transparent);
592
630
  outline-offset: 0;
@@ -594,6 +632,20 @@ ol.utrecht-breadcrumb__list {
594
632
  outline-width: var(--utrecht-focus-outline-width, 0);
595
633
  }
596
634
 
635
+ .utrecht-custom-checkbox__input:focus ~ .utrecht-custom-checkbox__box {
636
+ box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
637
+ outline-color: var(--utrecht-focus-outline-color, transparent);
638
+ outline-offset: 0;
639
+ outline-style: var(--utrecht-focus-outline-style, solid);
640
+ outline-width: var(--utrecht-focus-outline-width, 0);
641
+ }
642
+
643
+ .utrecht-custom-checkbox__input:focus:not(:focus-visible) ~ .utrecht-custom-checkbox__box {
644
+ /* undo focus ring */
645
+ box-shadow: none;
646
+ outline-style: none;
647
+ }
648
+
597
649
  .utrecht-custom-checkbox__icon--checked,
598
650
  .utrecht-custom-checkbox__icon--indeterminate {
599
651
  display: none;
@@ -1216,16 +1268,12 @@ ol.utrecht-breadcrumb__list {
1216
1268
  color: var(--utrecht-link-active-color, var(--utrecht-link-color));
1217
1269
  }
1218
1270
 
1219
- .utrecht-link:focus,
1220
- .utrecht-link--focus,
1221
- .utrecht-html a:focus {
1271
+ .utrecht-link--focus, .utrecht-html a:focus, .utrecht-link:focus {
1222
1272
  color: var(--utrecht-link-focus-color, var(--utrecht-link-color));
1223
1273
  text-decoration: var(--utrecht-link-focus-text-decoration, var(--utrecht-link-text-decoration, underline));
1224
1274
  }
1225
1275
 
1226
- .utrecht-link:focus-visible,
1227
- .utrecht-link--focus-visible,
1228
- .utrecht-html a:focus-visible {
1276
+ .utrecht-link--focus-visible, .utrecht-html a:focus, .utrecht-link:focus {
1229
1277
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1230
1278
  outline-color: var(--utrecht-focus-outline-color, transparent);
1231
1279
  outline-offset: 0;
@@ -1233,6 +1281,12 @@ ol.utrecht-breadcrumb__list {
1233
1281
  outline-width: var(--utrecht-focus-outline-width, 0);
1234
1282
  }
1235
1283
 
1284
+ .utrecht-link:focus:not(:focus-visible), .utrecht-html a:focus:not(:focus-visible):link {
1285
+ /* undo focus ring */
1286
+ box-shadow: none;
1287
+ outline-style: none;
1288
+ }
1289
+
1236
1290
  /* stylelint-disable-next-line block-no-empty */
1237
1291
  /* stylelint-disable-next-line block-no-empty */
1238
1292
  .utrecht-link--telephone, .utrecht-html a[href^="tel:" i] {
@@ -1259,6 +1313,11 @@ ol.utrecht-breadcrumb__list {
1259
1313
  order: 2;
1260
1314
  }
1261
1315
 
1316
+ /**
1317
+ * @license EUPL-1.2
1318
+ * Copyright (c) 2021 Gemeente Utrecht
1319
+ * Copyright (c) 2021 Robbert Broersma
1320
+ */
1262
1321
  .utrecht-logo {
1263
1322
  max-height: var(--utrecht-logo-max-height, 192px);
1264
1323
  max-width: var(--utrecht-logo-max-width, 96px);
@@ -1315,8 +1374,7 @@ ol.utrecht-breadcrumb__list {
1315
1374
  color: var(--utrecht-mapcontrolbutton-disabled-color);
1316
1375
  }
1317
1376
 
1318
- .utrecht-mapcontrolbutton--focus-visible,
1319
- .utrecht-mapcontrolbutton:focus-visible {
1377
+ .utrecht-mapcontrolbutton--focus-visible, .utrecht-mapcontrolbutton:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-mapcontrolbutton--disabled) {
1320
1378
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1321
1379
  outline-color: var(--utrecht-focus-outline-color, transparent);
1322
1380
  outline-offset: 0;
@@ -1324,11 +1382,18 @@ ol.utrecht-breadcrumb__list {
1324
1382
  outline-width: var(--utrecht-focus-outline-width, 0);
1325
1383
  }
1326
1384
 
1327
- .utrecht-mapcontrolbutton--focus,
1328
- .utrecht-mapcontrolbutton:not(.utrecht-mapcontrolbutton--disabled):focus {
1385
+ .utrecht-mapcontrolbutton--focus, .utrecht-mapcontrolbutton:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-mapcontrolbutton--disabled) {
1329
1386
  --utrecht-icon-color: var(--utrecht-mapcontrolbutton-focus-color, var(--utrecht-mapcontrolbutton-color));
1330
1387
  }
1331
1388
 
1389
+ /* override the `:focus` selector above */
1390
+ /* stylelint-disable-next-line no-descending-specificity */
1391
+ .utrecht-mapcontrolbutton:focus:not(:focus-visible) {
1392
+ /* undo focus ring */
1393
+ box-shadow: none;
1394
+ outline-style: none;
1395
+ }
1396
+
1332
1397
  .utrecht-mapcontrolbutton--hover:not(:disabled),
1333
1398
  .utrecht-mapcontrolbutton:hover:not(:disabled):not(.utrecht-mapcontrolbutton--disabled) {
1334
1399
  background-color: var(--utrecht-mapcontrolbutton-hover-background-color);
@@ -1341,6 +1406,10 @@ ol.utrecht-breadcrumb__list {
1341
1406
  padding-inline-start: var(--utrecht-mapcontrolbutton-label-margin-inline-start);
1342
1407
  }
1343
1408
 
1409
+ /**
1410
+ * @license EUPL-1.2
1411
+ * Copyright (c) 2021 Gemeente Utrecht
1412
+ */
1344
1413
  /**
1345
1414
  * @license EUPL-1.2
1346
1415
  * Copyright (c) 2021 Gemeente Utrecht
@@ -1377,7 +1446,7 @@ ol.utrecht-breadcrumb__list {
1377
1446
  color: var(--utrecht-menulijst-item-hover-color, var(--utrecht-link-hover-color, red));
1378
1447
  }
1379
1448
 
1380
- .utrecht-menulijst__link--focus-visible {
1449
+ .utrecht-menulijst__link--focus-visible, .utrecht-menulijst__link:focus {
1381
1450
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1382
1451
  outline-color: var(--utrecht-focus-outline-color, transparent);
1383
1452
  outline-offset: 0;
@@ -1385,10 +1454,15 @@ ol.utrecht-breadcrumb__list {
1385
1454
  outline-width: var(--utrecht-focus-outline-width, 0);
1386
1455
  }
1387
1456
 
1457
+ .utrecht-menulijst__link:focus:not(:focus-visible) {
1458
+ /* undo focus ring */
1459
+ box-shadow: none;
1460
+ outline-style: none;
1461
+ }
1462
+
1388
1463
  /**
1389
1464
  * @license EUPL-1.2
1390
1465
  * Copyright (c) 2021 Gemeente Utrecht
1391
- * Copyright (c) 2021 A Herring
1392
1466
  */
1393
1467
  /**
1394
1468
  * @license EUPL-1.2
@@ -1446,14 +1520,14 @@ ol.utrecht-breadcrumb__list {
1446
1520
  text-decoration: underline;
1447
1521
  }
1448
1522
 
1449
- .utrecht-topnav__link--focus {
1523
+ .utrecht-topnav__link--focus, .utrecht-topnav__link:focus {
1450
1524
  background-color: var(--utrecht-topnav-link-focus-background-color);
1451
1525
  /*#ffd633*/
1452
1526
  color: var(--utrecht-topnav-link-focus-color, var(--utrecht-topnav-link-color));
1453
1527
  text-decoration: var(--utrecht-topnav-link-focus-text-decoration, var(--utrecht-topnav-link-text-decoration, underline));
1454
1528
  }
1455
1529
 
1456
- .utrecht-topnav__link--focus-visible {
1530
+ .utrecht-topnav__link--focus-visible, .utrecht-topnav__link:focus {
1457
1531
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1458
1532
  outline-color: var(--utrecht-focus-outline-color, transparent);
1459
1533
  outline-offset: 0;
@@ -1461,11 +1535,12 @@ ol.utrecht-breadcrumb__list {
1461
1535
  outline-width: var(--utrecht-focus-outline-width, 0);
1462
1536
  }
1463
1537
 
1464
- /**
1465
- * @license EUPL-1.2
1466
- * Copyright (c) 2021 Gemeente Utrecht
1467
- * Copyright (c) 2021 A Herring
1468
- */
1538
+ .utrecht-topnav__link:focus:not(:focus-visible) {
1539
+ /* undo focus ring */
1540
+ box-shadow: none;
1541
+ outline-style: none;
1542
+ }
1543
+
1469
1544
  /**
1470
1545
  * @license EUPL-1.2
1471
1546
  * Copyright (c) 2021 The Knights Who Say NIH! B.V.
@@ -1697,8 +1772,7 @@ ol.utrecht-breadcrumb__list {
1697
1772
  display: none;
1698
1773
  }
1699
1774
 
1700
- .utrecht-sidenav__link:focus-visible,
1701
- .utrecht-sidenav__link--focus-visible {
1775
+ .utrecht-sidenav__link--focus-visible, .utrecht-sidenav__link:focus {
1702
1776
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1703
1777
  outline-color: var(--utrecht-focus-outline-color, transparent);
1704
1778
  outline-offset: 0;
@@ -1706,10 +1780,15 @@ ol.utrecht-breadcrumb__list {
1706
1780
  outline-width: var(--utrecht-focus-outline-width, 0);
1707
1781
  }
1708
1782
 
1783
+ .utrecht-sidenav__link:focus:not(:focus-visible) {
1784
+ /* undo focus ring */
1785
+ box-shadow: none;
1786
+ outline-style: none;
1787
+ }
1788
+
1709
1789
  /**
1710
1790
  * @license EUPL-1.2
1711
1791
  * Copyright (c) 2021 Gemeente Utrecht
1712
- * Copyright (c) 2021 A Herring
1713
1792
  */
1714
1793
  /**
1715
1794
  * @license EUPL-1.2
@@ -1767,14 +1846,12 @@ ol.utrecht-breadcrumb__list {
1767
1846
  text-decoration: underline;
1768
1847
  }
1769
1848
 
1770
- .utrecht-topnav__link:focus,
1771
- .utrecht-topnav__link--focus {
1849
+ .utrecht-topnav__link--focus, .utrecht-topnav__link:focus {
1772
1850
  background-color: var(--utrecht-topnav-link-focus-background-color, var(--utrecht-topnav-link-background-color));
1773
1851
  color: var(--utrecht-topnav-link-focus-color, var(--utrecht-topnav-link-color));
1774
1852
  }
1775
1853
 
1776
- .utrecht-topnav__link:focus-visible,
1777
- .utrecht-topnav__link--focus-visible {
1854
+ .utrecht-topnav__link--focus-visible, .utrecht-topnav__link:focus {
1778
1855
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1779
1856
  outline-color: var(--utrecht-focus-outline-color, transparent);
1780
1857
  outline-offset: 0;
@@ -1782,6 +1859,12 @@ ol.utrecht-breadcrumb__list {
1782
1859
  outline-width: var(--utrecht-focus-outline-width, 0);
1783
1860
  }
1784
1861
 
1862
+ .utrecht-topnav__link:focus:not(:focus-visible) {
1863
+ /* undo focus ring */
1864
+ box-shadow: none;
1865
+ outline-style: none;
1866
+ }
1867
+
1785
1868
  /**
1786
1869
  * @license EUPL-1.2
1787
1870
  * Copyright (c) 2021 Robbert Broersma
@@ -1948,15 +2031,6 @@ ol.utrecht-breadcrumb__list {
1948
2031
  color: var(--utrecht-pagination-relative-link-disabled-color, var(--utrecht-pagination-relative-link-color));
1949
2032
  }
1950
2033
 
1951
- .utrecht-pagination__relative-link--focus-visible,
1952
- .utrecht-pagination__relative-link:focus-visible {
1953
- box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1954
- outline-color: var(--utrecht-focus-outline-color, transparent);
1955
- outline-offset: 0;
1956
- outline-style: var(--utrecht-focus-outline-style, solid);
1957
- outline-width: var(--utrecht-focus-outline-width, 0);
1958
- }
1959
-
1960
2034
  .utrecht-pagination__relative-link--hover,
1961
2035
  .utrecht-pagination__relative-link:hover {
1962
2036
  background-color: var(--utrecht-pagination-relative-link-hover-background-color, var(--utrecht-pagination-relative-link-background-color));
@@ -1998,6 +2072,22 @@ ol.utrecht-breadcrumb__list {
1998
2072
  color: var(--utrecht-pagination-page-link-hover-color, var(--utrecht-pagination-page-link-color));
1999
2073
  }
2000
2074
 
2075
+ .utrecht-pagination__page-link:focus,
2076
+ .utrecht-pagination__relative-link:focus {
2077
+ box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
2078
+ outline-color: var(--utrecht-focus-outline-color, transparent);
2079
+ outline-offset: 0;
2080
+ outline-style: var(--utrecht-focus-outline-style, solid);
2081
+ outline-width: var(--utrecht-focus-outline-width, 0);
2082
+ }
2083
+
2084
+ .utrecht-pagination__page-link:focus:not(:focus-visible),
2085
+ .utrecht-pagination__relative-link:focus:not(:focus-visible) {
2086
+ /* undo focus ring */
2087
+ box-shadow: none;
2088
+ outline-style: none;
2089
+ }
2090
+
2001
2091
  /**
2002
2092
  * @license EUPL-1.2
2003
2093
  * Copyright (c) 2021 The Knights Who Say NIH! B.V.
@@ -2069,7 +2159,7 @@ ol.utrecht-breadcrumb__list {
2069
2159
  cursor: var(--utrecht-action-disabled-cursor);
2070
2160
  }
2071
2161
 
2072
- .utrecht-radio-button--focus-visible, .utrecht-radio-button--html-input:focus-visible, .utrecht-html input[type=radio i]:focus-visible {
2162
+ .utrecht-radio-button--focus-visible, .utrecht-radio-button--html-input:focus, .utrecht-html input[type=radio i]:focus {
2073
2163
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
2074
2164
  outline-color: var(--utrecht-focus-outline-color, transparent);
2075
2165
  outline-offset: 0;
@@ -2077,6 +2167,12 @@ ol.utrecht-breadcrumb__list {
2077
2167
  outline-width: var(--utrecht-focus-outline-width, 0);
2078
2168
  }
2079
2169
 
2170
+ .utrecht-radio-button--html-input:focus:not(:focus-visible), .utrecht-html input[type=radio i]:focus:not(:focus-visible) {
2171
+ /* undo focus ring */
2172
+ box-shadow: none;
2173
+ outline-style: none;
2174
+ }
2175
+
2080
2176
  /**
2081
2177
  * @license EUPL-1.2
2082
2178
  * Copyright (c) 2021 Gemeente Utrecht
@@ -2163,7 +2259,7 @@ ol.utrecht-breadcrumb__list {
2163
2259
  color: var(--utrecht-select-focus-color, var(--utrecht-form-input-focus-color, var(--utrecht-select-color, var(--utrecht-form-input-color))));
2164
2260
  }
2165
2261
 
2166
- .utrecht-select--focus-visible, .utrecht-select--html-select:focus-visible, .utrecht-html select:focus-visible {
2262
+ .utrecht-select--focus-visible, .utrecht-select--html-select:focus, .utrecht-html select:focus {
2167
2263
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
2168
2264
  outline-color: var(--utrecht-focus-outline-color, transparent);
2169
2265
  outline-offset: 0;
@@ -2181,6 +2277,11 @@ ol.utrecht-breadcrumb__list {
2181
2277
  .utrecht-select--html-select, .utrecht-html select {
2182
2278
  /* <select> does not support :read-only */
2183
2279
  }
2280
+ .utrecht-select--html-select:focus:not(:focus-visible), .utrecht-html select:focus:not(:focus-visible) {
2281
+ /* undo focus ring */
2282
+ box-shadow: none;
2283
+ outline-style: none;
2284
+ }
2184
2285
  /**
2185
2286
  * @license EUPL-1.2
2186
2287
  * Copyright (c) 2021 Gemeente Utrecht
@@ -2362,7 +2463,7 @@ ol.utrecht-breadcrumb__list {
2362
2463
  color: var(--utrecht-textarea-focus-color, var(--utrecht-form-input-focus-color, var(--utrecht-textarea-color, var(--utrecht-form-input-color))));
2363
2464
  }
2364
2465
 
2365
- .utrecht-textarea--focus-visible, .utrecht-textarea--html-textarea:focus-visible, .utrecht-html textarea:focus-visible {
2466
+ .utrecht-textarea--focus-visible, .utrecht-textarea--html-textarea:focus, .utrecht-html textarea:focus {
2366
2467
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
2367
2468
  outline-color: var(--utrecht-focus-outline-color, transparent);
2368
2469
  outline-offset: 0;
@@ -2381,6 +2482,11 @@ ol.utrecht-breadcrumb__list {
2381
2482
  opacity: 100%;
2382
2483
  }
2383
2484
 
2485
+ .utrecht-textarea--html-textarea:focus:not(:focus-visible), .utrecht-html textarea:focus:not(:focus-visible) {
2486
+ /* undo focus ring */
2487
+ box-shadow: none;
2488
+ outline-style: none;
2489
+ }
2384
2490
  /**
2385
2491
  * @license EUPL-1.2
2386
2492
  * Copyright (c) 2021 Robbert Broersma
@@ -2489,19 +2595,19 @@ ol.utrecht-breadcrumb__list {
2489
2595
  color: var(--utrecht-textbox-focus-color, var(--utrecht-form-input-focus-color, var(--utrecht-textarea-color, var(--utrecht-form-input-color))));
2490
2596
  }
2491
2597
 
2492
- .utrecht-textbox--focus-visible, .utrecht-textbox--html-input:focus-visible, .utrecht-html input:focus-visible:not([type]),
2493
- .utrecht-html input[type=date i]:focus-visible,
2494
- .utrecht-html input[type=datetime-local i]:focus-visible,
2495
- .utrecht-html input[type=email i]:focus-visible,
2496
- .utrecht-html input[type=month i]:focus-visible,
2497
- .utrecht-html input[type=number i]:focus-visible,
2498
- .utrecht-html input[type=password i]:focus-visible,
2499
- .utrecht-html input[type=search i]:focus-visible,
2500
- .utrecht-html input[type=tel i]:focus-visible,
2501
- .utrecht-html input[type=text i]:focus-visible,
2502
- .utrecht-html input[type=time i]:focus-visible,
2503
- .utrecht-html input[type=url i]:focus-visible,
2504
- .utrecht-html input[type=week i]:focus-visible {
2598
+ .utrecht-textbox--focus-visible, .utrecht-textbox--html-input:focus, .utrecht-html input:focus:not([type]),
2599
+ .utrecht-html input[type=date i]:focus,
2600
+ .utrecht-html input[type=datetime-local i]:focus,
2601
+ .utrecht-html input[type=email i]:focus,
2602
+ .utrecht-html input[type=month i]:focus,
2603
+ .utrecht-html input[type=number i]:focus,
2604
+ .utrecht-html input[type=password i]:focus,
2605
+ .utrecht-html input[type=search i]:focus,
2606
+ .utrecht-html input[type=tel i]:focus,
2607
+ .utrecht-html input[type=text i]:focus,
2608
+ .utrecht-html input[type=time i]:focus,
2609
+ .utrecht-html input[type=url i]:focus,
2610
+ .utrecht-html input[type=week i]:focus {
2505
2611
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
2506
2612
  outline-color: var(--utrecht-focus-outline-color, transparent);
2507
2613
  outline-offset: 0;
@@ -2578,6 +2684,23 @@ ol.utrecht-breadcrumb__list {
2578
2684
  font-variant-ligatures: none;
2579
2685
  }
2580
2686
 
2687
+ .utrecht-textbox--html-input:focus:not(:focus-visible), .utrecht-html input:focus:not(:focus-visible):not([type]),
2688
+ .utrecht-html input[type=date i]:focus:not(:focus-visible),
2689
+ .utrecht-html input[type=datetime-local i]:focus:not(:focus-visible),
2690
+ .utrecht-html input[type=email i]:focus:not(:focus-visible),
2691
+ .utrecht-html input[type=month i]:focus:not(:focus-visible),
2692
+ .utrecht-html input[type=number i]:focus:not(:focus-visible),
2693
+ .utrecht-html input[type=password i]:focus:not(:focus-visible),
2694
+ .utrecht-html input[type=search i]:focus:not(:focus-visible),
2695
+ .utrecht-html input[type=tel i]:focus:not(:focus-visible),
2696
+ .utrecht-html input[type=text i]:focus:not(:focus-visible),
2697
+ .utrecht-html input[type=time i]:focus:not(:focus-visible),
2698
+ .utrecht-html input[type=url i]:focus:not(:focus-visible),
2699
+ .utrecht-html input[type=week i]:focus:not(:focus-visible) {
2700
+ /* undo focus ring */
2701
+ box-shadow: none;
2702
+ outline-style: none;
2703
+ }
2581
2704
  /**
2582
2705
  * @license EUPL-1.2
2583
2706
  * Copyright (c) 2021 Robbert Broersma
@@ -2737,7 +2860,9 @@ ol.utrecht-breadcrumb__list {
2737
2860
  cursor: var(--utrecht-action-submit-cursor);
2738
2861
  }
2739
2862
 
2740
- .utrecht-button--busy, .utrecht-html button[aria-busy=true] {
2863
+ .utrecht-button--busy, .utrecht-html button[aria-busy=true],
2864
+ .utrecht-html button[aria-disabled=true][aria-busy=true],
2865
+ .utrecht-html button:disabled[aria-busy=true] {
2741
2866
  cursor: var(--utrecht-action-busy-cursor);
2742
2867
  }
2743
2868
 
@@ -2745,27 +2870,27 @@ ol.utrecht-breadcrumb__list {
2745
2870
  .utrecht-html input[type=reset i]:disabled,
2746
2871
  .utrecht-html input[type=submit i]:disabled,
2747
2872
  .utrecht-html button:disabled,
2748
- .utrecht-button--disabled {
2873
+ .utrecht-button--disabled,
2874
+ .utrecht-html button[aria-disabled=true] {
2749
2875
  background-color: var(--utrecht-button-disabled-background-color, var(--utrecht-button-background-color));
2750
2876
  color: var(--utrecht-button-disabled-color, var(--utrecht-button-color));
2751
2877
  cursor: var(--utrecht-action-disabled-cursor);
2752
2878
  }
2753
2879
 
2754
- .utrecht-button:active, .utrecht-html input[type=button i]:active,
2755
- .utrecht-html input[type=reset i]:active,
2756
- .utrecht-html input[type=submit i]:active,
2757
- .utrecht-html button:active,
2758
- .utrecht-button--active {
2880
+ .utrecht-button:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled), .utrecht-html input[type=button i]:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2881
+ .utrecht-html input[type=reset i]:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2882
+ .utrecht-html input[type=submit i]:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2883
+ .utrecht-button--active,
2884
+ .utrecht-html button:active:not([aria-disabled=true]):not(:disabled) {
2759
2885
  background-color: var(--utrecht-button-active-background-color, var(--utrecht-button-background-color));
2760
2886
  color: var(--utrecht-button-active-color, var(--utrecht-button-color));
2761
2887
  }
2762
2888
 
2763
- .utrecht-button--focus-visible,
2764
- .utrecht-button:focus-visible,
2765
- .utrecht-html input[type=button i]:focus-visible,
2766
- .utrecht-html input[type=reset i]:focus-visible,
2767
- .utrecht-html input[type=submit i]:focus-visible,
2768
- .utrecht-html button:focus-visible {
2889
+ .utrecht-button--focus-visible, .utrecht-html button:focus-visible, .utrecht-button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled), .utrecht-html input[type=button i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2890
+ .utrecht-html input[type=reset i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2891
+ .utrecht-html input[type=submit i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2892
+ .utrecht-html button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled) {
2893
+ /* the pseudo-class for `:focus-visible` is implemented via the mixin */
2769
2894
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
2770
2895
  outline-color: var(--utrecht-focus-outline-color, transparent);
2771
2896
  outline-offset: 0;
@@ -2773,25 +2898,37 @@ ol.utrecht-breadcrumb__list {
2773
2898
  outline-width: var(--utrecht-focus-outline-width, 0);
2774
2899
  }
2775
2900
 
2776
- .utrecht-button--focus, .utrecht-html button:focus,
2777
- .utrecht-button:not(.utrecht-button--disabled):focus,
2778
- .utrecht-html input[type=button i]:not(.utrecht-button--disabled):focus,
2779
- .utrecht-html input[type=reset i]:not(.utrecht-button--disabled):focus,
2780
- .utrecht-html input[type=submit i]:not(.utrecht-button--disabled):focus {
2901
+ .utrecht-button--focus, .utrecht-html button:focus:not([aria-disabled=true]):not(:disabled), .utrecht-button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled), .utrecht-html input[type=button i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2902
+ .utrecht-html input[type=reset i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2903
+ .utrecht-html input[type=submit i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2904
+ .utrecht-html button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled) {
2781
2905
  background-color: var(--utrecht-button-focus-background-color, var(--utrecht-button-background-color));
2782
2906
  color: var(--utrecht-button-focus-color, var(--utrecht-button-color));
2783
2907
  }
2784
2908
 
2785
- .utrecht-button--hover:not(:disabled), .utrecht-html button:not(:disabled):hover,
2786
- .utrecht-button:hover:not(:disabled):not(.utrecht-button--disabled),
2787
- .utrecht-html input[type=button i]:hover:not(:disabled):not(.utrecht-button--disabled),
2788
- .utrecht-html input[type=reset i]:hover:not(:disabled):not(.utrecht-button--disabled),
2789
- .utrecht-html input[type=submit i]:hover:not(:disabled):not(.utrecht-button--disabled) {
2909
+ /* override the `:focus` selector above */
2910
+ /* stylelint-disable-next-line no-descending-specificity */
2911
+ .utrecht-button:focus:not(:focus-visible), .utrecht-html input[type=button i]:focus:not(:focus-visible),
2912
+ .utrecht-html input[type=reset i]:focus:not(:focus-visible),
2913
+ .utrecht-html input[type=submit i]:focus:not(:focus-visible),
2914
+ .utrecht-html button:focus:not(:focus-visible) {
2915
+ /* undo focus ring */
2916
+ box-shadow: none;
2917
+ outline-style: none;
2918
+ }
2919
+
2920
+ .utrecht-button--hover:not(:disabled), .utrecht-html button:not(:disabled):hover:not([aria-disabled=true]),
2921
+ .utrecht-button:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2922
+ .utrecht-html input[type=button i]:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2923
+ .utrecht-html input[type=reset i]:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
2924
+ .utrecht-html input[type=submit i]:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled) {
2790
2925
  background-color: var(--utrecht-button-hover-background-color, var(--utrecht-button-background-color));
2791
2926
  color: var(--utrecht-button-hover-color, var(--utrecht-button-color));
2792
2927
  transform: scale(var(--utrecht-button-focus-transform-scale, 1));
2793
2928
  }
2794
2929
 
2930
+ /* override the `:focus` selector above */
2931
+ /* stylelint-disable-next-line no-descending-specificity */
2795
2932
  /**
2796
2933
  * @license EUPL-1.2
2797
2934
  * Copyright (c) 2021 Robbert Broersma
@@ -2819,7 +2956,7 @@ ol.utrecht-breadcrumb__list {
2819
2956
  cursor: var(--utrecht-action-disabled-cursor);
2820
2957
  }
2821
2958
 
2822
- .utrecht-checkbox--focus-visible, .utrecht-checkbox--html-input:focus-visible, .utrecht-html input[type=checkbox i]:focus-visible {
2959
+ .utrecht-checkbox--focus-visible {
2823
2960
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
2824
2961
  outline-color: var(--utrecht-focus-outline-color, transparent);
2825
2962
  outline-offset: 0;
@@ -2827,6 +2964,19 @@ ol.utrecht-breadcrumb__list {
2827
2964
  outline-width: var(--utrecht-focus-outline-width, 0);
2828
2965
  }
2829
2966
 
2967
+ .utrecht-checkbox--html-input:focus, .utrecht-html input[type=checkbox i]:focus {
2968
+ box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
2969
+ outline-color: var(--utrecht-focus-outline-color, transparent);
2970
+ outline-offset: 0;
2971
+ outline-style: var(--utrecht-focus-outline-style, solid);
2972
+ outline-width: var(--utrecht-focus-outline-width, 0);
2973
+ }
2974
+ .utrecht-checkbox--html-input:focus:not(:focus-visible), .utrecht-html input[type=checkbox i]:focus:not(:focus-visible) {
2975
+ /* undo focus ring */
2976
+ box-shadow: none;
2977
+ outline-style: none;
2978
+ }
2979
+
2830
2980
  /**
2831
2981
  * @license EUPL-1.2
2832
2982
  * Copyright (c) 2021 Robbert Broersma
@@ -3222,7 +3372,9 @@ ol.utrecht-breadcrumb__list {
3222
3372
  cursor: var(--utrecht-action-submit-cursor);
3223
3373
  }
3224
3374
 
3225
- .utrecht-button--busy, .utrecht-html button[aria-busy=true] {
3375
+ .utrecht-button--busy, .utrecht-html button[aria-busy=true],
3376
+ .utrecht-html button[aria-disabled=true][aria-busy=true],
3377
+ .utrecht-html button:disabled[aria-busy=true] {
3226
3378
  cursor: var(--utrecht-action-busy-cursor);
3227
3379
  }
3228
3380
 
@@ -3230,27 +3382,27 @@ ol.utrecht-breadcrumb__list {
3230
3382
  .utrecht-html input[type=reset i]:disabled,
3231
3383
  .utrecht-html input[type=submit i]:disabled,
3232
3384
  .utrecht-html button:disabled,
3233
- .utrecht-button--disabled {
3385
+ .utrecht-button--disabled,
3386
+ .utrecht-html button[aria-disabled=true] {
3234
3387
  background-color: var(--utrecht-button-disabled-background-color, var(--utrecht-button-background-color));
3235
3388
  color: var(--utrecht-button-disabled-color, var(--utrecht-button-color));
3236
3389
  cursor: var(--utrecht-action-disabled-cursor);
3237
3390
  }
3238
3391
 
3239
- .utrecht-button:active, .utrecht-html input[type=button i]:active,
3240
- .utrecht-html input[type=reset i]:active,
3241
- .utrecht-html input[type=submit i]:active,
3242
- .utrecht-html button:active,
3243
- .utrecht-button--active {
3392
+ .utrecht-button:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled), .utrecht-html input[type=button i]:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3393
+ .utrecht-html input[type=reset i]:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3394
+ .utrecht-html input[type=submit i]:active:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3395
+ .utrecht-button--active,
3396
+ .utrecht-html button:active:not([aria-disabled=true]):not(:disabled) {
3244
3397
  background-color: var(--utrecht-button-active-background-color, var(--utrecht-button-background-color));
3245
3398
  color: var(--utrecht-button-active-color, var(--utrecht-button-color));
3246
3399
  }
3247
3400
 
3248
- .utrecht-button--focus-visible,
3249
- .utrecht-button:focus-visible,
3250
- .utrecht-html input[type=button i]:focus-visible,
3251
- .utrecht-html input[type=reset i]:focus-visible,
3252
- .utrecht-html input[type=submit i]:focus-visible,
3253
- .utrecht-html button:focus-visible {
3401
+ .utrecht-button--focus-visible, .utrecht-button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled), .utrecht-html input[type=button i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3402
+ .utrecht-html input[type=reset i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3403
+ .utrecht-html input[type=submit i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3404
+ .utrecht-html button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled), .utrecht-html button:focus-visible {
3405
+ /* the pseudo-class for `:focus-visible` is implemented via the mixin */
3254
3406
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
3255
3407
  outline-color: var(--utrecht-focus-outline-color, transparent);
3256
3408
  outline-offset: 0;
@@ -3258,25 +3410,37 @@ ol.utrecht-breadcrumb__list {
3258
3410
  outline-width: var(--utrecht-focus-outline-width, 0);
3259
3411
  }
3260
3412
 
3261
- .utrecht-button--focus, .utrecht-html button:focus,
3262
- .utrecht-button:not(.utrecht-button--disabled):focus,
3263
- .utrecht-html input[type=button i]:not(.utrecht-button--disabled):focus,
3264
- .utrecht-html input[type=reset i]:not(.utrecht-button--disabled):focus,
3265
- .utrecht-html input[type=submit i]:not(.utrecht-button--disabled):focus {
3413
+ .utrecht-button--focus, .utrecht-button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled), .utrecht-html input[type=button i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3414
+ .utrecht-html input[type=reset i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3415
+ .utrecht-html input[type=submit i]:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3416
+ .utrecht-html button:focus:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled), .utrecht-html button:focus:not([aria-disabled=true]):not(:disabled) {
3266
3417
  background-color: var(--utrecht-button-focus-background-color, var(--utrecht-button-background-color));
3267
3418
  color: var(--utrecht-button-focus-color, var(--utrecht-button-color));
3268
3419
  }
3269
3420
 
3270
- .utrecht-button--hover:not(:disabled), .utrecht-html button:not(:disabled):hover,
3271
- .utrecht-button:hover:not(:disabled):not(.utrecht-button--disabled),
3272
- .utrecht-html input[type=button i]:hover:not(:disabled):not(.utrecht-button--disabled),
3273
- .utrecht-html input[type=reset i]:hover:not(:disabled):not(.utrecht-button--disabled),
3274
- .utrecht-html input[type=submit i]:hover:not(:disabled):not(.utrecht-button--disabled) {
3421
+ /* override the `:focus` selector above */
3422
+ /* stylelint-disable-next-line no-descending-specificity */
3423
+ .utrecht-button:focus:not(:focus-visible), .utrecht-html input[type=button i]:focus:not(:focus-visible),
3424
+ .utrecht-html input[type=reset i]:focus:not(:focus-visible),
3425
+ .utrecht-html input[type=submit i]:focus:not(:focus-visible),
3426
+ .utrecht-html button:focus:not(:focus-visible) {
3427
+ /* undo focus ring */
3428
+ box-shadow: none;
3429
+ outline-style: none;
3430
+ }
3431
+
3432
+ .utrecht-button--hover:not(:disabled), .utrecht-html button:not(:disabled):hover:not([aria-disabled=true]),
3433
+ .utrecht-button:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3434
+ .utrecht-html input[type=button i]:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3435
+ .utrecht-html input[type=reset i]:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled),
3436
+ .utrecht-html input[type=submit i]:hover:not(:disabled):not([aria-disabled=true]):not(.utrecht-button--disabled) {
3275
3437
  background-color: var(--utrecht-button-hover-background-color, var(--utrecht-button-background-color));
3276
3438
  color: var(--utrecht-button-hover-color, var(--utrecht-button-color));
3277
3439
  transform: scale(var(--utrecht-button-focus-transform-scale, 1));
3278
3440
  }
3279
3441
 
3442
+ /* override the `:focus` selector above */
3443
+ /* stylelint-disable-next-line no-descending-specificity */
3280
3444
  /**
3281
3445
  * @license EUPL-1.2
3282
3446
  * Copyright (c) 2021 Robbert Broersma
@@ -3304,13 +3468,26 @@ ol.utrecht-breadcrumb__list {
3304
3468
  cursor: var(--utrecht-action-disabled-cursor);
3305
3469
  }
3306
3470
 
3307
- .utrecht-checkbox--focus-visible, .utrecht-checkbox--html-input:focus-visible, .utrecht-html input[type=checkbox i]:focus-visible {
3471
+ .utrecht-checkbox--focus-visible {
3472
+ box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
3473
+ outline-color: var(--utrecht-focus-outline-color, transparent);
3474
+ outline-offset: 0;
3475
+ outline-style: var(--utrecht-focus-outline-style, solid);
3476
+ outline-width: var(--utrecht-focus-outline-width, 0);
3477
+ }
3478
+
3479
+ .utrecht-checkbox--html-input:focus, .utrecht-html input[type=checkbox i]:focus {
3308
3480
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
3309
3481
  outline-color: var(--utrecht-focus-outline-color, transparent);
3310
3482
  outline-offset: 0;
3311
3483
  outline-style: var(--utrecht-focus-outline-style, solid);
3312
3484
  outline-width: var(--utrecht-focus-outline-width, 0);
3313
3485
  }
3486
+ .utrecht-checkbox--html-input:focus:not(:focus-visible), .utrecht-html input[type=checkbox i]:focus:not(:focus-visible) {
3487
+ /* undo focus ring */
3488
+ box-shadow: none;
3489
+ outline-style: none;
3490
+ }
3314
3491
 
3315
3492
  /**
3316
3493
  * @license EUPL-1.2
@@ -3608,16 +3785,12 @@ ol.utrecht-breadcrumb__list {
3608
3785
  color: var(--utrecht-link-active-color, var(--utrecht-link-color));
3609
3786
  }
3610
3787
 
3611
- .utrecht-link:focus,
3612
- .utrecht-link--focus,
3613
- .utrecht-html a:focus {
3788
+ .utrecht-link--focus, .utrecht-html a:focus, .utrecht-link:focus {
3614
3789
  color: var(--utrecht-link-focus-color, var(--utrecht-link-color));
3615
3790
  text-decoration: var(--utrecht-link-focus-text-decoration, var(--utrecht-link-text-decoration, underline));
3616
3791
  }
3617
3792
 
3618
- .utrecht-link:focus-visible,
3619
- .utrecht-link--focus-visible,
3620
- .utrecht-html a:focus-visible {
3793
+ .utrecht-link--focus-visible, .utrecht-html a:focus, .utrecht-link:focus {
3621
3794
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
3622
3795
  outline-color: var(--utrecht-focus-outline-color, transparent);
3623
3796
  outline-offset: 0;
@@ -3625,12 +3798,24 @@ ol.utrecht-breadcrumb__list {
3625
3798
  outline-width: var(--utrecht-focus-outline-width, 0);
3626
3799
  }
3627
3800
 
3801
+ .utrecht-link:focus:not(:focus-visible), .utrecht-html a:focus:not(:focus-visible):link {
3802
+ /* undo focus ring */
3803
+ box-shadow: none;
3804
+ outline-style: none;
3805
+ }
3806
+
3628
3807
  /* stylelint-disable-next-line block-no-empty */
3629
3808
  /* stylelint-disable-next-line block-no-empty */
3630
3809
  .utrecht-link--telephone, .utrecht-html a[href^="tel:" i] {
3631
3810
  white-space: nowrap;
3632
3811
  }
3633
3812
 
3813
+ .utrecht-html a:focus:not(:focus-visible) {
3814
+ /* undo focus ring */
3815
+ box-shadow: none;
3816
+ outline-style: none;
3817
+ }
3818
+
3634
3819
  /**
3635
3820
  * @license EUPL-1.2
3636
3821
  * Copyright (c) 2021 Robbert Broersma
@@ -3720,7 +3905,7 @@ ol.utrecht-breadcrumb__list {
3720
3905
  cursor: var(--utrecht-action-disabled-cursor);
3721
3906
  }
3722
3907
 
3723
- .utrecht-radio-button--focus-visible, .utrecht-radio-button--html-input:focus-visible, .utrecht-html input[type=radio i]:focus-visible {
3908
+ .utrecht-radio-button--focus-visible, .utrecht-radio-button--html-input:focus, .utrecht-html input[type=radio i]:focus {
3724
3909
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
3725
3910
  outline-color: var(--utrecht-focus-outline-color, transparent);
3726
3911
  outline-offset: 0;
@@ -3728,6 +3913,12 @@ ol.utrecht-breadcrumb__list {
3728
3913
  outline-width: var(--utrecht-focus-outline-width, 0);
3729
3914
  }
3730
3915
 
3916
+ .utrecht-radio-button--html-input:focus:not(:focus-visible), .utrecht-html input[type=radio i]:focus:not(:focus-visible) {
3917
+ /* undo focus ring */
3918
+ box-shadow: none;
3919
+ outline-style: none;
3920
+ }
3921
+
3731
3922
  /**
3732
3923
  * @license EUPL-1.2
3733
3924
  * Copyright (c) 2021 Robbert Broersma
@@ -3906,7 +4097,7 @@ ol.utrecht-breadcrumb__list {
3906
4097
  color: var(--utrecht-textarea-focus-color, var(--utrecht-form-input-focus-color, var(--utrecht-textarea-color, var(--utrecht-form-input-color))));
3907
4098
  }
3908
4099
 
3909
- .utrecht-textarea--focus-visible, .utrecht-textarea--html-textarea:focus-visible, .utrecht-html textarea:focus-visible {
4100
+ .utrecht-textarea--focus-visible, .utrecht-textarea--html-textarea:focus, .utrecht-html textarea:focus {
3910
4101
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
3911
4102
  outline-color: var(--utrecht-focus-outline-color, transparent);
3912
4103
  outline-offset: 0;
@@ -3925,6 +4116,11 @@ ol.utrecht-breadcrumb__list {
3925
4116
  opacity: 100%;
3926
4117
  }
3927
4118
 
4119
+ .utrecht-textarea--html-textarea:focus:not(:focus-visible), .utrecht-html textarea:focus:not(:focus-visible) {
4120
+ /* undo focus ring */
4121
+ box-shadow: none;
4122
+ outline-style: none;
4123
+ }
3928
4124
  /**
3929
4125
  * @license EUPL-1.2
3930
4126
  * Copyright (c) 2021 Robbert Broersma
@@ -4037,19 +4233,19 @@ ol.utrecht-breadcrumb__list {
4037
4233
  color: var(--utrecht-textbox-focus-color, var(--utrecht-form-input-focus-color, var(--utrecht-textarea-color, var(--utrecht-form-input-color))));
4038
4234
  }
4039
4235
 
4040
- .utrecht-textbox--focus-visible, .utrecht-textbox--html-input:focus-visible, .utrecht-html input:focus-visible:not([type]),
4041
- .utrecht-html input[type=date i]:focus-visible,
4042
- .utrecht-html input[type=datetime-local i]:focus-visible,
4043
- .utrecht-html input[type=email i]:focus-visible,
4044
- .utrecht-html input[type=month i]:focus-visible,
4045
- .utrecht-html input[type=number i]:focus-visible,
4046
- .utrecht-html input[type=password i]:focus-visible,
4047
- .utrecht-html input[type=search i]:focus-visible,
4048
- .utrecht-html input[type=tel i]:focus-visible,
4049
- .utrecht-html input[type=text i]:focus-visible,
4050
- .utrecht-html input[type=time i]:focus-visible,
4051
- .utrecht-html input[type=url i]:focus-visible,
4052
- .utrecht-html input[type=week i]:focus-visible {
4236
+ .utrecht-textbox--focus-visible, .utrecht-textbox--html-input:focus, .utrecht-html input:focus:not([type]),
4237
+ .utrecht-html input[type=date i]:focus,
4238
+ .utrecht-html input[type=datetime-local i]:focus,
4239
+ .utrecht-html input[type=email i]:focus,
4240
+ .utrecht-html input[type=month i]:focus,
4241
+ .utrecht-html input[type=number i]:focus,
4242
+ .utrecht-html input[type=password i]:focus,
4243
+ .utrecht-html input[type=search i]:focus,
4244
+ .utrecht-html input[type=tel i]:focus,
4245
+ .utrecht-html input[type=text i]:focus,
4246
+ .utrecht-html input[type=time i]:focus,
4247
+ .utrecht-html input[type=url i]:focus,
4248
+ .utrecht-html input[type=week i]:focus {
4053
4249
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
4054
4250
  outline-color: var(--utrecht-focus-outline-color, transparent);
4055
4251
  outline-offset: 0;
@@ -4126,6 +4322,23 @@ ol.utrecht-breadcrumb__list {
4126
4322
  font-variant-ligatures: none;
4127
4323
  }
4128
4324
 
4325
+ .utrecht-textbox--html-input:focus:not(:focus-visible), .utrecht-html input:focus:not(:focus-visible):not([type]),
4326
+ .utrecht-html input[type=date i]:focus:not(:focus-visible),
4327
+ .utrecht-html input[type=datetime-local i]:focus:not(:focus-visible),
4328
+ .utrecht-html input[type=email i]:focus:not(:focus-visible),
4329
+ .utrecht-html input[type=month i]:focus:not(:focus-visible),
4330
+ .utrecht-html input[type=number i]:focus:not(:focus-visible),
4331
+ .utrecht-html input[type=password i]:focus:not(:focus-visible),
4332
+ .utrecht-html input[type=search i]:focus:not(:focus-visible),
4333
+ .utrecht-html input[type=tel i]:focus:not(:focus-visible),
4334
+ .utrecht-html input[type=text i]:focus:not(:focus-visible),
4335
+ .utrecht-html input[type=time i]:focus:not(:focus-visible),
4336
+ .utrecht-html input[type=url i]:focus:not(:focus-visible),
4337
+ .utrecht-html input[type=week i]:focus:not(:focus-visible) {
4338
+ /* undo focus ring */
4339
+ box-shadow: none;
4340
+ outline-style: none;
4341
+ }
4129
4342
  /**
4130
4343
  * @license EUPL-1.2
4131
4344
  * Copyright (c) 2021 Robbert Broersma
@@ -4207,16 +4420,12 @@ ol.utrecht-breadcrumb__list {
4207
4420
  color: var(--utrecht-link-active-color, var(--utrecht-link-color));
4208
4421
  }
4209
4422
 
4210
- .utrecht-link:focus,
4211
- .utrecht-link--focus,
4212
- .utrecht-html a:focus {
4423
+ .utrecht-link--focus, .utrecht-link:focus, .utrecht-html a:focus {
4213
4424
  color: var(--utrecht-link-focus-color, var(--utrecht-link-color));
4214
4425
  text-decoration: var(--utrecht-link-focus-text-decoration, var(--utrecht-link-text-decoration, underline));
4215
4426
  }
4216
4427
 
4217
- .utrecht-link:focus-visible,
4218
- .utrecht-link--focus-visible,
4219
- .utrecht-html a:focus-visible {
4428
+ .utrecht-link--focus-visible, .utrecht-link:focus, .utrecht-html a:focus {
4220
4429
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
4221
4430
  outline-color: var(--utrecht-focus-outline-color, transparent);
4222
4431
  outline-offset: 0;
@@ -4224,12 +4433,24 @@ ol.utrecht-breadcrumb__list {
4224
4433
  outline-width: var(--utrecht-focus-outline-width, 0);
4225
4434
  }
4226
4435
 
4436
+ .utrecht-link:focus:not(:focus-visible), .utrecht-html a:focus:not(:focus-visible):link {
4437
+ /* undo focus ring */
4438
+ box-shadow: none;
4439
+ outline-style: none;
4440
+ }
4441
+
4227
4442
  /* stylelint-disable-next-line block-no-empty */
4228
4443
  /* stylelint-disable-next-line block-no-empty */
4229
4444
  .utrecht-link--telephone, .utrecht-html a[href^="tel:" i] {
4230
4445
  white-space: nowrap;
4231
4446
  }
4232
4447
 
4448
+ .utrecht-html a:focus:not(:focus-visible) {
4449
+ /* undo focus ring */
4450
+ box-shadow: none;
4451
+ outline-style: none;
4452
+ }
4453
+
4233
4454
  /**
4234
4455
  * @license EUPL-1.2
4235
4456
  * Copyright (c) 2021 Robbert Broersma
@@ -4319,7 +4540,7 @@ ol.utrecht-breadcrumb__list {
4319
4540
  cursor: var(--utrecht-action-disabled-cursor);
4320
4541
  }
4321
4542
 
4322
- .utrecht-radio-button--focus-visible, .utrecht-radio-button--html-input:focus-visible, .utrecht-html input[type=radio i]:focus-visible {
4543
+ .utrecht-radio-button--focus-visible, .utrecht-radio-button--html-input:focus, .utrecht-html input[type=radio i]:focus {
4323
4544
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
4324
4545
  outline-color: var(--utrecht-focus-outline-color, transparent);
4325
4546
  outline-offset: 0;
@@ -4327,6 +4548,12 @@ ol.utrecht-breadcrumb__list {
4327
4548
  outline-width: var(--utrecht-focus-outline-width, 0);
4328
4549
  }
4329
4550
 
4551
+ .utrecht-radio-button--html-input:focus:not(:focus-visible), .utrecht-html input[type=radio i]:focus:not(:focus-visible) {
4552
+ /* undo focus ring */
4553
+ box-shadow: none;
4554
+ outline-style: none;
4555
+ }
4556
+
4330
4557
  /**
4331
4558
  * @license EUPL-1.2
4332
4559
  * Copyright (c) 2021 Robbert Broersma
@@ -4381,7 +4608,7 @@ ol.utrecht-breadcrumb__list {
4381
4608
  color: var(--utrecht-select-focus-color, var(--utrecht-form-input-focus-color, var(--utrecht-select-color, var(--utrecht-form-input-color))));
4382
4609
  }
4383
4610
 
4384
- .utrecht-select--focus-visible, .utrecht-select--html-select:focus-visible, .utrecht-html select:focus-visible {
4611
+ .utrecht-select--focus-visible, .utrecht-select--html-select:focus, .utrecht-html select:focus {
4385
4612
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
4386
4613
  outline-color: var(--utrecht-focus-outline-color, transparent);
4387
4614
  outline-offset: 0;
@@ -4399,6 +4626,11 @@ ol.utrecht-breadcrumb__list {
4399
4626
  .utrecht-select--html-select, .utrecht-html select {
4400
4627
  /* <select> does not support :read-only */
4401
4628
  }
4629
+ .utrecht-select--html-select:focus:not(:focus-visible), .utrecht-html select:focus:not(:focus-visible) {
4630
+ /* undo focus ring */
4631
+ box-shadow: none;
4632
+ outline-style: none;
4633
+ }
4402
4634
  /**
4403
4635
  * @license EUPL-1.2
4404
4636
  * Copyright (c) 2021 Robbert Broersma
@@ -4577,7 +4809,7 @@ ol.utrecht-breadcrumb__list {
4577
4809
  color: var(--utrecht-textarea-focus-color, var(--utrecht-form-input-focus-color, var(--utrecht-textarea-color, var(--utrecht-form-input-color))));
4578
4810
  }
4579
4811
 
4580
- .utrecht-textarea--focus-visible, .utrecht-textarea--html-textarea:focus-visible, .utrecht-html textarea:focus-visible {
4812
+ .utrecht-textarea--focus-visible, .utrecht-textarea--html-textarea:focus, .utrecht-html textarea:focus {
4581
4813
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
4582
4814
  outline-color: var(--utrecht-focus-outline-color, transparent);
4583
4815
  outline-offset: 0;
@@ -4596,6 +4828,11 @@ ol.utrecht-breadcrumb__list {
4596
4828
  opacity: 100%;
4597
4829
  }
4598
4830
 
4831
+ .utrecht-textarea--html-textarea:focus:not(:focus-visible), .utrecht-html textarea:focus:not(:focus-visible) {
4832
+ /* undo focus ring */
4833
+ box-shadow: none;
4834
+ outline-style: none;
4835
+ }
4599
4836
  /**
4600
4837
  * @license EUPL-1.2
4601
4838
  * Copyright (c) 2021 Robbert Broersma
@@ -4708,19 +4945,19 @@ ol.utrecht-breadcrumb__list {
4708
4945
  color: var(--utrecht-textbox-focus-color, var(--utrecht-form-input-focus-color, var(--utrecht-textarea-color, var(--utrecht-form-input-color))));
4709
4946
  }
4710
4947
 
4711
- .utrecht-textbox--focus-visible, .utrecht-textbox--html-input:focus-visible, .utrecht-html input:focus-visible:not([type]),
4712
- .utrecht-html input[type=date i]:focus-visible,
4713
- .utrecht-html input[type=datetime-local i]:focus-visible,
4714
- .utrecht-html input[type=email i]:focus-visible,
4715
- .utrecht-html input[type=month i]:focus-visible,
4716
- .utrecht-html input[type=number i]:focus-visible,
4717
- .utrecht-html input[type=password i]:focus-visible,
4718
- .utrecht-html input[type=search i]:focus-visible,
4719
- .utrecht-html input[type=tel i]:focus-visible,
4720
- .utrecht-html input[type=text i]:focus-visible,
4721
- .utrecht-html input[type=time i]:focus-visible,
4722
- .utrecht-html input[type=url i]:focus-visible,
4723
- .utrecht-html input[type=week i]:focus-visible {
4948
+ .utrecht-textbox--focus-visible, .utrecht-textbox--html-input:focus, .utrecht-html input:focus:not([type]),
4949
+ .utrecht-html input[type=date i]:focus,
4950
+ .utrecht-html input[type=datetime-local i]:focus,
4951
+ .utrecht-html input[type=email i]:focus,
4952
+ .utrecht-html input[type=month i]:focus,
4953
+ .utrecht-html input[type=number i]:focus,
4954
+ .utrecht-html input[type=password i]:focus,
4955
+ .utrecht-html input[type=search i]:focus,
4956
+ .utrecht-html input[type=tel i]:focus,
4957
+ .utrecht-html input[type=text i]:focus,
4958
+ .utrecht-html input[type=time i]:focus,
4959
+ .utrecht-html input[type=url i]:focus,
4960
+ .utrecht-html input[type=week i]:focus {
4724
4961
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
4725
4962
  outline-color: var(--utrecht-focus-outline-color, transparent);
4726
4963
  outline-offset: 0;
@@ -4797,6 +5034,23 @@ ol.utrecht-breadcrumb__list {
4797
5034
  font-variant-ligatures: none;
4798
5035
  }
4799
5036
 
5037
+ .utrecht-textbox--html-input:focus:not(:focus-visible), .utrecht-html input:focus:not(:focus-visible):not([type]),
5038
+ .utrecht-html input[type=date i]:focus:not(:focus-visible),
5039
+ .utrecht-html input[type=datetime-local i]:focus:not(:focus-visible),
5040
+ .utrecht-html input[type=email i]:focus:not(:focus-visible),
5041
+ .utrecht-html input[type=month i]:focus:not(:focus-visible),
5042
+ .utrecht-html input[type=number i]:focus:not(:focus-visible),
5043
+ .utrecht-html input[type=password i]:focus:not(:focus-visible),
5044
+ .utrecht-html input[type=search i]:focus:not(:focus-visible),
5045
+ .utrecht-html input[type=tel i]:focus:not(:focus-visible),
5046
+ .utrecht-html input[type=text i]:focus:not(:focus-visible),
5047
+ .utrecht-html input[type=time i]:focus:not(:focus-visible),
5048
+ .utrecht-html input[type=url i]:focus:not(:focus-visible),
5049
+ .utrecht-html input[type=week i]:focus:not(:focus-visible) {
5050
+ /* undo focus ring */
5051
+ box-shadow: none;
5052
+ outline-style: none;
5053
+ }
4800
5054
  /**
4801
5055
  * @license EUPL-1.2
4802
5056
  * Copyright (c) 2021 Robbert Broersma
@@ -4844,7 +5098,7 @@ ol.utrecht-breadcrumb__list {
4844
5098
  /* Collection of CSS variables for Utrecht theme applied to `:root` */
4845
5099
  /**
4846
5100
  * Do not edit directly
4847
- * Generated on Thu, 21 Oct 2021 08:52:09 GMT
5101
+ * Generated on Thu, 21 Oct 2021 16:04:20 GMT
4848
5102
  */
4849
5103
  :root {
4850
5104
  --utrecht-searchbar-hover-transform: 1;