@blackbaud/skyux-design-tokens 6.11.1 → 6.12.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,19 @@
1
1
  # Changelog
2
2
 
3
+ ## [6.12.0](https://github.com/blackbaud/skyux-design-tokens/compare/6.11.2...6.12.0) (2026-09-25)
4
+
5
+
6
+ ### Features
7
+
8
+ * add shadow color tokens and refactor shadow definitions ([#491](https://github.com/blackbaud/skyux-design-tokens/issues/491)) ([153705c](https://github.com/blackbaud/skyux-design-tokens/commit/153705c54c7ff0e35899334ea892d0118405dc30))
9
+
10
+ ## [6.11.2](https://github.com/blackbaud/skyux-design-tokens/compare/6.11.1...6.11.2) (2026-09-17)
11
+
12
+
13
+ ### Bug Fixes
14
+
15
+ * brand action tokens and dark mode border fixes ([#482](https://github.com/blackbaud/skyux-design-tokens/issues/482)) ([bcf5ae3](https://github.com/blackbaud/skyux-design-tokens/commit/bcf5ae39eddb26698902de458441ad2fccc92c15))
16
+
3
17
  ## [6.11.1](https://github.com/blackbaud/skyux-design-tokens/compare/6.11.0...6.11.1) (2026-09-17)
4
18
 
5
19
 
@@ -2,7 +2,7 @@
2
2
  "fonts": [],
3
3
  "images": {
4
4
  "favicon": {
5
- "src": "https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.1/assets/images/favicon.ico"
5
+ "src": "https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/favicon.ico"
6
6
  }
7
7
  },
8
8
  "strings": {
@@ -236,6 +236,22 @@
236
236
  --bb-color-red_dark-700: #912528;
237
237
  --bb-color-red_dark-800: #6d1b1d;
238
238
  --bb-color-red_dark-900: #4a1213;
239
+ --bb-color-rgba-black-10: rgba(0, 0, 0, 0.1);
240
+ --bb-color-rgba-black-12: rgba(0, 0, 0, 0.12);
241
+ --bb-color-rgba-black-16: rgba(0, 0, 0, 0.16);
242
+ --bb-color-rgba-black-20: rgba(0, 0, 0, 0.2);
243
+ --bb-color-rgba-black-21: rgba(0, 0, 0, 0.21);
244
+ --bb-color-rgba-black-22: rgba(0, 0, 0, 0.22);
245
+ --bb-color-rgba-black-24: rgba(0, 0, 0, 0.24);
246
+ --bb-color-rgba-black-25: rgba(0, 0, 0, 0.25);
247
+ --bb-color-rgba-black-28: rgba(0, 0, 0, 0.28);
248
+ --bb-color-rgba-black-30: rgba(0, 0, 0, 0.3);
249
+ --bb-color-rgba-black-34: rgba(0, 0, 0, 0.34);
250
+ --bb-color-rgba-black-35: rgba(0, 0, 0, 0.35);
251
+ --bb-color-rgba-black-36: rgba(0, 0, 0, 0.36);
252
+ --bb-color-rgba-black-50: rgba(0, 0, 0, 0.5);
253
+ --bb-color-rgba-black-60: rgba(0, 0, 0, 0.6);
254
+ --bb-color-rgba-black-65: rgba(0, 0, 0, 0.65);
239
255
  --bb-color-rgba-black-70: rgba(0, 0, 0, 0.7);
240
256
  --bb-color-rgba-blue-600-25: rgba(43, 107, 213, 0.25);
241
257
  --bb-color-rgba-blue-600-35: rgba(43, 107, 213, 0.35);
@@ -247,6 +263,11 @@
247
263
  --bb-color-rgba-red_dark-600-35: rgba(181, 47, 50, 0.35);
248
264
  --bb-color-rgba-red_dark-600-50: rgba(181, 47, 50, 0.5);
249
265
  --bb-color-rgba-sky-600-40: rgba(0, 207, 255, 0.4);
266
+ --bb-color-rgba-slate-900-12: rgba(33, 44, 63, 0.12);
267
+ --bb-color-rgba-slate-900-14: rgba(33, 44, 63, 0.14);
268
+ --bb-color-rgba-slate-900-20: rgba(33, 44, 63, 0.2);
269
+ --bb-color-rgba-slate-900-5: rgba(33, 44, 63, 0.05);
270
+ --bb-color-rgba-slate-900-50: rgba(33, 44, 63, 0.5);
250
271
  --bb-color-rgba-steel_fusion-100-5: rgba(243, 246, 249, 0.05);
251
272
  --bb-color-rgba-steel_fusion-1100-70: rgba(28, 34, 40, 0.7);
252
273
  --bb-color-rgba-steel_gray-100-10: rgba(245, 246, 247, 0.1);
@@ -421,16 +442,16 @@
421
442
  --bb-font-weight-light: 300;
422
443
  --bb-font-weight-regular: 400;
423
444
  --bb-font-weight-semibold: 600;
424
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.1/assets/images/bb-logo.png');
425
- --bb-image-logo-primary-white-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.1/assets/images/bb-logo-white.png');
426
- --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.1/assets/images/chevron_up_down_20_fill-base-dark.svg');
427
- --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.1/assets/images/chevron_up_down_20_fill-base-light.svg');
428
- --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.1/assets/images/chevron_up_down_20_fill-bb-dark.svg');
429
- --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.1/assets/images/chevron_up_down_20_fill-bb-light.svg');
430
- --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.1/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
431
- --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.1/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
432
- --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.1/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
433
- --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.1/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
445
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/bb-logo.png');
446
+ --bb-image-logo-primary-white-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/bb-logo-white.png');
447
+ --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/chevron_up_down_20_fill-base-dark.svg');
448
+ --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/chevron_up_down_20_fill-base-light.svg');
449
+ --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/chevron_up_down_20_fill-bb-dark.svg');
450
+ --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/chevron_up_down_20_fill-bb-light.svg');
451
+ --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
452
+ --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
453
+ --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
454
+ --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
434
455
  --bb-letter_spacing-normal: normal;
435
456
  --bb-letter_spacing-wider: 0.01rem;
436
457
  --bb-letter_spacing-widest: 0.046875rem;
@@ -446,7 +467,7 @@
446
467
  --bb-line_height-800: calc(36/27);
447
468
  --bb-opacity-600: .6;
448
469
  --bb-shadow-slate-0: 0 0 0 0 rgba(0, 0, 0, 0);
449
- --bb-shadow-steel-fusion-0: 0 0 0 0 rgba(0, 0, 0, 0);
470
+ --bb-shadow-steel_fusion-0: 0 0 0 0 rgba(0, 0, 0, 0);
450
471
  --bb-size-0: 0rem;
451
472
  --bb-size-fixed-100: 16px;
452
473
  --bb-size-fixed-12: 2px;
@@ -497,9 +518,19 @@
497
518
  --bb-space-8: 24px;
498
519
  --bb-space-9: 36px;
499
520
  --bb-color-gradient-blue: linear-gradient( var(--bb-color-blue-500), var(--bb-color-blue-700));
500
- --bb-color-gradient-brand-secondary: linear-gradient(90deg, var(--bb-color-rgba-sky-600-40) , var(--bb-color-rgba-purple-600-40));
521
+ --bb-color-gradient-brand-secondary-40: linear-gradient(90deg, var(--bb-color-rgba-sky-600-40) , var(--bb-color-rgba-purple-600-40));
501
522
  --bb-color-gradient-container-primary: linear-gradient(90deg, var(--bb-color-steel_fusion-700), var(--bb-color-steel_fusion-800));
502
523
  --bb-font-blkb_sans-family: var(--bb-font-blkb_sans-name), var(--bb-font-blkb_sans-fallback);
524
+ --bb-shadow-black-0: 0 0 0 0 rgba(33, 44, 63, 0);
525
+ --bb-shadow-black-100: 0 1px 3px 0 var(--bb-color-rgba-black-30), 0 2px 1px -1px var(--bb-color-rgba-black-25), 0 1px 1px 0 var(--bb-color-rgba-black-28);
526
+ --bb-shadow-black-1600: 0 8px 10px -5px var(--bb-color-rgba-black-36), 0 6px 30px 5px var(--bb-color-rgba-black-22), 0 16px 24px 2px var(--bb-color-rgba-black-25);
527
+ --bb-shadow-black-200: 0 1px 8px 0 var(--bb-color-rgba-black-50), 0 3px 3px -2px var(--bb-color-rgba-black-30), 0 3px 4px 0 var(--bb-color-rgba-black-35);
528
+ --bb-shadow-black-2400: 0 11px 15px -7px var(--bb-color-rgba-black-34), 0 9px 46px 8px var(--bb-color-rgba-black-20), 0 24px 38px 3px var(--bb-color-rgba-black-24);
529
+ --bb-shadow-black-25: 0 1px 1px 0 var(--bb-color-rgba-black-35);
530
+ --bb-shadow-black-400: 0 2px 4px -1px var(--bb-color-rgba-black-24), 0 1px 10px 0 var(--bb-color-rgba-black-16), 0 4px 5px 0 var(--bb-color-rgba-black-21);
531
+ --bb-shadow-black-50: 0 1px 1px 0 var(--bb-color-rgba-black-30), 0 1.5px 1px -1px var(--bb-color-rgba-black-60);
532
+ --bb-shadow-black-800: 0 5px 5px -3px var(--bb-color-rgba-black-24), 0 3px 14px 2px var(--bb-color-rgba-black-12), 0 8px 10px 1px var(--bb-color-rgba-black-10);
533
+ --bb-shadow-black-simple-400: 1px 2px 4px 0 var(--bb-color-rgba-black-65);
503
534
  --bb-shadow-gray-0: 0 0 0 0 rgba(22, 26, 31, 0);
504
535
  --bb-shadow-gray-100: 0 1px 3px 0 rgba(22, 26, 31, 0.2), 0 2px 1px -1px rgba(22, 26, 31, 0.12), 0 1px 1px 0 rgba(22, 26, 31, 0.14);
505
536
  --bb-shadow-gray-1600: 0 8px 10px -5px rgba(22, 26, 31, 0.2), 0 6px 30px 5px rgba(22, 26, 31, 0.12), 0 16px 24px 2px rgba(30, 34, 41, 0.14);
@@ -510,44 +541,34 @@
510
541
  --bb-shadow-gray-50: 0 1px 1px 0 rgba(22, 26, 31, 0.12), 0 1.5px 1px -1px rgba(22, 26, 31, 0.12);
511
542
  --bb-shadow-gray-800: 0 5px 5px -3px rgba(22, 26, 31, 0.2), 0 3px 14px 2px rgba(22, 26, 31, 0.12), 0 8px 10px 1px rgba(22, 26, 31, 0.14);
512
543
  --bb-shadow-gray-simple-400: 1px 2px 4px 0 rgba(22, 26, 31, 0.5);
513
- --bb-shadow-heavy-black-0: 0 0 0 0 rgba(0, 0, 0, 0);
514
- --bb-shadow-heavy-black-100: 0 1px 3px 0 rgba(0, 0, 0, .3), 0 2px 1px -1px rgba(0, 0, 0, .25), 0 1px 1px 0 rgba(0, 0, 0, .28);
515
- --bb-shadow-heavy-black-1600: 0 8px 10px -5px rgba(0, 0, 0, 0.36), 0 6px 30px 5px rgba(0, 0, 0, 0.22), 0 16px 24px 2px rgba(0, 0, 0, 0.25);
516
- --bb-shadow-heavy-black-200: 0 1px 8px 0 rgba(0, 0, 0, 0.5), 0 3px 3px -2px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.35);
517
- --bb-shadow-heavy-black-2400: 0 11px 15px -7px rgba(0, 0, 0, 0.34), 0 9px 46px 8px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.24);
518
- --bb-shadow-heavy-black-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
519
- --bb-shadow-heavy-black-400: 0 2px 4px -1px rgba(0, 0, 0, 0.24), 0 1px 10px 0 rgba(0, 0, 0, 0.16), 0 4px 5px 0 rgba(0, 0, 0, 0.21);
520
- --bb-shadow-heavy-black-50: 0 1px 1px 0 rgba(0, 0, 0, 0.3), 0 1.5px 1px -1px rgba(0, 0, 0, 0.6);
521
- --bb-shadow-heavy-black-800: 0 5px 5px -3px rgba(0, 0, 0, 0.24), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 8px 10px 1px rgba(0, 0, 0, 0.1);
522
- --bb-shadow-heavy-black-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
523
- --bb-shadow-slate-100: 0 1px 3px 0 rgba(33, 44, 63, 0.2), 0 2px 1px -1px rgba(33, 44, 63, 0.12), 0 1px 1px 0 rgba(33, 44, 63, 0.14);
544
+ --bb-shadow-heavy_black-0: 0 0 0 0 rgba(0, 0, 0, 0);
545
+ --bb-shadow-heavy_black-100: 0 1px 3px 0 rgba(0, 0, 0, .3), 0 2px 1px -1px rgba(0, 0, 0, .25), 0 1px 1px 0 rgba(0, 0, 0, .28);
546
+ --bb-shadow-heavy_black-1600: 0 8px 10px -5px rgba(0, 0, 0, 0.36), 0 6px 30px 5px rgba(0, 0, 0, 0.22), 0 16px 24px 2px rgba(0, 0, 0, 0.25);
547
+ --bb-shadow-heavy_black-200: 0 1px 8px 0 rgba(0, 0, 0, 0.5), 0 3px 3px -2px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.35);
548
+ --bb-shadow-heavy_black-2400: 0 11px 15px -7px rgba(0, 0, 0, 0.34), 0 9px 46px 8px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.24);
549
+ --bb-shadow-heavy_black-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
550
+ --bb-shadow-heavy_black-400: 0 2px 4px -1px rgba(0, 0, 0, 0.24), 0 1px 10px 0 rgba(0, 0, 0, 0.16), 0 4px 5px 0 rgba(0, 0, 0, 0.21);
551
+ --bb-shadow-heavy_black-50: 0 1px 1px 0 rgba(0, 0, 0, 0.3), 0 1.5px 1px -1px rgba(0, 0, 0, 0.6);
552
+ --bb-shadow-heavy_black-800: 0 5px 5px -3px rgba(0, 0, 0, 0.24), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 8px 10px 1px rgba(0, 0, 0, 0.1);
553
+ --bb-shadow-heavy_black-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
554
+ --bb-shadow-slate-100: 0 1px 3px 0 var(--bb-color-rgba-slate-900-20), 0 2px 1px -1px var(--bb-color-rgba-slate-900-12), 0 1px 1px 0 var(--bb-color-rgba-slate-900-14);
524
555
  --bb-shadow-slate-1600: 0 8px 10px -5px rgba(33, 44, 63, 0.2), 0 6px 30px 5px rgba(33, 44, 63, 0.12), 0 16px 24px 2px rgba(33, 44, 63, 0.14);
525
- --bb-shadow-slate-200: 0 1px 8px 0 rgba(33, 44, 63, 0.2), 0 3px 3px -2px rgba(33, 44, 63, 0.12), 0 3px 4px 0 rgba(33, 44, 63, 0.14);
526
- --bb-shadow-slate-2400: 0 11px 15px -7px rgba(33, 44, 63, 0.2), 0 9px 46px 8px rgba(33, 44, 63, 0.12), 0 24px 38px 3px rgba(33, 44, 63, 0.14);
527
- --bb-shadow-slate-25: 0 1px 1px 0 rgba(33, 44, 63, 0.05);
528
- --bb-shadow-slate-400: 0 2px 4px -1px rgba(33, 44, 63, 0.2), 0 1px 10px 0 rgba(33, 44, 63, 0.12), 0 4px 5px 0 rgba(33, 44, 63, 0.14);
529
- --bb-shadow-slate-50: 0 1px 1px 0 rgba(33, 44, 63, 0.12), 0 1.5px 1px -1px rgba(33, 44, 63, 0.12);
530
- --bb-shadow-slate-800: 0 5px 5px -3px rgba(33, 44, 63, 0.2), 0 3px 14px 2px rgba(33, 44, 63, 0.12), 0 8px 10px 1px rgba(33, 44, 63, 0.14);
531
- --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(33, 44, 63, 0.5);
532
- --bb-shadow-steel-fusion-100: 0 1px 3px 0 rgba(0, 0, 0, .3), 0 2px 1px -1px rgba(0, 0, 0, .25), 0 1px 1px 0 rgba(0, 0, 0, .28);
533
- --bb-shadow-steel-fusion-1600: 0 8px 10px -5px rgba(0, 0, 0, 0.36), 0 6px 30px 5px rgba(0, 0, 0, 0.22), 0 16px 24px 2px rgba(0, 0, 0, 0.25);
534
- --bb-shadow-steel-fusion-200: 0 1px 8px 0 rgba(0, 0, 0, 0.5), 0 3px 3px -2px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.35);
535
- --bb-shadow-steel-fusion-2400: 0 11px 15px -7px rgba(0, 0, 0, 0.34), 0 9px 46px 8px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.24);
536
- --bb-shadow-steel-fusion-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
537
- --bb-shadow-steel-fusion-400: 0 2px 4px -1px rgba(0, 0, 0, 0.24), 0 1px 10px 0 rgba(0, 0, 0, 0.16), 0 4px 5px 0 rgba(0, 0, 0, 0.21);
538
- --bb-shadow-steel-fusion-50: 0 1px 1px 0 rgba(0, 0, 0, 0.3), 0 1.5px 1px -1px rgba(0, 0, 0, 0.6);
539
- --bb-shadow-steel-fusion-800: 0 5px 5px -3px rgba(0, 0, 0, 0.24), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 8px 10px 1px rgba(0, 0, 0, 0.1);
540
- --bb-shadow-steel-fusion-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
541
- --bb-shadow-steel-gray-0: 0 0 0 0 rgba(33, 44, 63, 0);
542
- --bb-shadow-steel-gray-100: 0 1px 3px 0 rgba(0, 0, 0, .3), 0 2px 1px -1px rgba(0, 0, 0, .25), 0 1px 1px 0 rgba(0, 0, 0, .28);
543
- --bb-shadow-steel-gray-1600: 0 8px 10px -5px rgba(0, 0, 0, 0.36), 0 6px 30px 5px rgba(0, 0, 0, 0.22), 0 16px 24px 2px rgba(0, 0, 0, 0.25);
544
- --bb-shadow-steel-gray-200: 0 1px 8px 0 rgba(0, 0, 0, 0.5), 0 3px 3px -2px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.35);
545
- --bb-shadow-steel-gray-2400: 0 11px 15px -7px rgba(0, 0, 0, 0.34), 0 9px 46px 8px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.24);
546
- --bb-shadow-steel-gray-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
547
- --bb-shadow-steel-gray-400: 0 2px 4px -1px rgba(0, 0, 0, 0.24), 0 1px 10px 0 rgba(0, 0, 0, 0.16), 0 4px 5px 0 rgba(0, 0, 0, 0.21);
548
- --bb-shadow-steel-gray-50: 0 1px 1px 0 rgba(0, 0, 0, 0.3), 0 1.5px 1px -1px rgba(0, 0, 0, 0.6);
549
- --bb-shadow-steel-gray-800: 0 5px 5px -3px rgba(0, 0, 0, 0.24), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 8px 10px 1px rgba(0, 0, 0, 0.1);
550
- --bb-shadow-steel-gray-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
556
+ --bb-shadow-slate-200: 0 1px 8px 0 var(--bb-color-rgba-slate-900-20), 0 3px 3px -2px var(--bb-color-rgba-slate-900-12), 0 3px 4px 0 var(--bb-color-rgba-slate-900-14);
557
+ --bb-shadow-slate-2400: 0 11px 15px -7px var(--bb-color-rgba-slate-900-20), 0 9px 46px 8px var(--bb-color-rgba-slate-900-12), 0 24px 38px 3px var(--bb-color-rgba-slate-900-14);
558
+ --bb-shadow-slate-25: 0 1px 1px 0 var(--bb-color-rgba-slate-900-5);
559
+ --bb-shadow-slate-400: 0 2px 4px -1px var(--bb-color-rgba-slate-900-20), 0 1px 10px 0 var(--bb-color-rgba-slate-900-12), 0 4px 5px 0 var(--bb-color-rgba-slate-900-14);
560
+ --bb-shadow-slate-50: 0 1px 1px 0 var(--bb-color-rgba-slate-900-12), 0 1.5px 1px -1px var(--bb-color-rgba-slate-900-12);
561
+ --bb-shadow-slate-800: 0 5px 5px -3px var(--bb-color-rgba-slate-900-20), 0 3px 14px 2px var(--bb-color-rgba-slate-900-12), 0 8px 10px 1px var(--bb-color-rgba-slate-900-14);
562
+ --bb-shadow-slate-simple-400: 1px 2px 4px 0 var(--bb-color-rgba-slate-900-50);
563
+ --bb-shadow-steel_fusion-100: 0 1px 3px 0 rgba(0, 0, 0, .3), 0 2px 1px -1px rgba(0, 0, 0, .25), 0 1px 1px 0 rgba(0, 0, 0, .28);
564
+ --bb-shadow-steel_fusion-1600: 0 8px 10px -5px rgba(0, 0, 0, 0.36), 0 6px 30px 5px rgba(0, 0, 0, 0.22), 0 16px 24px 2px rgba(0, 0, 0, 0.25);
565
+ --bb-shadow-steel_fusion-200: 0 1px 8px 0 rgba(0, 0, 0, 0.5), 0 3px 3px -2px rgba(0, 0, 0, 0.3), 0 3px 4px 0 rgba(0, 0, 0, 0.35);
566
+ --bb-shadow-steel_fusion-2400: 0 11px 15px -7px rgba(0, 0, 0, 0.34), 0 9px 46px 8px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.24);
567
+ --bb-shadow-steel_fusion-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
568
+ --bb-shadow-steel_fusion-400: 0 2px 4px -1px rgba(0, 0, 0, 0.24), 0 1px 10px 0 rgba(0, 0, 0, 0.16), 0 4px 5px 0 rgba(0, 0, 0, 0.21);
569
+ --bb-shadow-steel_fusion-50: 0 1px 1px 0 rgba(0, 0, 0, 0.3), 0 1.5px 1px -1px rgba(0, 0, 0, 0.6);
570
+ --bb-shadow-steel_fusion-800: 0 5px 5px -3px rgba(0, 0, 0, 0.24), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 8px 10px 1px rgba(0, 0, 0, 0.1);
571
+ --bb-shadow-steel_fusion-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
551
572
  }
552
573
  :root:has(body.sky-theme-modern.sky-theme-brand-base) {
553
574
  --bb-color-scrollbar-base-dark-thumb: #51555c;
@@ -564,6 +585,10 @@
564
585
  --sky-color-background-action-accent-base: var(--bb-color-white);
565
586
  --sky-color-background-action-accent-focus: var(--bb-color-white);
566
587
  --sky-color-background-action-accent-hover: var(--bb-color-blue-50);
588
+ --sky-color-background-action-brand-active: var(--bb-color-blue-100);
589
+ --sky-color-background-action-brand-base: var(--bb-color-gray-25);
590
+ --sky-color-background-action-brand-focus: var(--bb-color-sky-25);
591
+ --sky-color-background-action-brand-hover: var(--bb-color-blue-50);
567
592
  --sky-color-background-action-danger-active: var(--bb-color-red-800);
568
593
  --sky-color-background-action-danger-base: var(--bb-color-red-600);
569
594
  --sky-color-background-action-danger-focus: var(--bb-color-red-600);
@@ -644,6 +669,10 @@
644
669
  --sky-color-border-action-accent-base: var(--bb-color-gray-200);
645
670
  --sky-color-border-action-accent-focus: var(--bb-color-blue-600);
646
671
  --sky-color-border-action-accent-hover: var(--bb-color-blue-600);
672
+ --sky-color-border-action-brand-active: var(--bb-color-blue-600);
673
+ --sky-color-border-action-brand-base: var(--bb-color-gray-200);
674
+ --sky-color-border-action-brand-focus: var(--bb-color-blue-600);
675
+ --sky-color-border-action-brand-hover: var(--bb-color-blue-600);
647
676
  --sky-color-border-action-danger-active: var(--bb-color-red-1000);
648
677
  --sky-color-border-action-danger-base: var(--bb-color-red-600);
649
678
  --sky-color-border-action-danger-focus: var(--bb-color-red-1000);
@@ -734,6 +763,7 @@
734
763
  --sky-color-classify-7-heavy: var(--bb-color-red-700);
735
764
  --sky-color-classify-7-soft: var(--bb-color-red-200);
736
765
  --sky-color-icon-action: var(--bb-color-blue-600);
766
+ --sky-color-icon-action_brand: var(--bb-color-gray-1000);
737
767
  --sky-color-icon-danger: var(--bb-color-red-600);
738
768
  --sky-color-icon-deemphasized: var(--bb-color-gray-600);
739
769
  --sky-color-icon-default: var(--bb-color-gray-1000);
@@ -753,6 +783,7 @@
753
783
  --sky-color-illustration-fill-softest: var(--bb-color-white);
754
784
  --sky-color-illustration-stroke: var(--bb-color-brand-trusted_blue);
755
785
  --sky-color-text-action: var(--bb-color-blue-600);
786
+ --sky-color-text-action_brand: var(--bb-color-gray-1000);
756
787
  --sky-color-text-action_contrast: var(--bb-color-blue-700);
757
788
  --sky-color-text-action_on_status: var(--bb-color-gray-1000);
758
789
  --sky-color-text-danger: var(--bb-color-red-600);
@@ -809,6 +840,7 @@
809
840
  --sky-image-select_icon-disabled: var(--bb-image-select_icon-disabled-base-light-src);
810
841
  --sky-opacity-wait: var(--bb-opacity-600);
811
842
  --sky-color-background-action-accent-disabled: var(--sky-color-background-disabled);
843
+ --sky-color-background-action-brand-disabled: var(--sky-color-background-disabled);
812
844
  --sky-color-background-action-danger-disabled: var(--sky-color-background-disabled);
813
845
  --sky-color-background-action-input-disabled: var(--sky-color-background-disabled);
814
846
  --sky-color-background-action-primary-disabled: var(--sky-color-background-disabled);
@@ -821,6 +853,7 @@
821
853
  --sky-color-background-selected-switch-disabled: var(--sky-color-background-disabled);
822
854
  --sky-color-background-tab-disabled: var(--sky-color-background-disabled);
823
855
  --sky-color-border-action-accent-disabled: var(--sky-color-border-disabled);
856
+ --sky-color-border-action-brand-disabled: var(--sky-color-border-disabled);
824
857
  --sky-color-border-action-danger-disabled: var(--sky-color-border-disabled);
825
858
  --sky-color-border-action-input-disabled: var(--sky-color-border-disabled);
826
859
  --sky-color-border-action-on_status-disabled: var(--sky-color-border-disabled);
@@ -885,6 +918,10 @@
885
918
  --sky-color-background-action-accent-base: var(--bb-color-blue-900);
886
919
  --sky-color-background-action-accent-focus: var(--bb-color-gray-700);
887
920
  --sky-color-background-action-accent-hover: var(--bb-color-gray-700);
921
+ --sky-color-background-action-brand-active: var(--bb-color-gray-600);
922
+ --sky-color-background-action-brand-base: var(--bb-color-blue-900);
923
+ --sky-color-background-action-brand-focus: var(--bb-color-blue-900);
924
+ --sky-color-background-action-brand-hover: var(--bb-color-gray-700);
888
925
  --sky-color-background-action-danger-active: var(--bb-color-red-600);
889
926
  --sky-color-background-action-danger-base: var(--bb-color-red-600);
890
927
  --sky-color-background-action-danger-focus: var(--bb-color-red-600);
@@ -964,6 +1001,10 @@
964
1001
  --sky-color-border-action-accent-base: var(--bb-color-gray-700);
965
1002
  --sky-color-border-action-accent-focus: var(--bb-color-sky-600);
966
1003
  --sky-color-border-action-accent-hover: var(--bb-color-sky-600);
1004
+ --sky-color-border-action-brand-active: var(--bb-color-blue_dark-375);
1005
+ --sky-color-border-action-brand-base: var(--bb-color-gray-700);
1006
+ --sky-color-border-action-brand-focus: var(--bb-color-blue_dark-375);
1007
+ --sky-color-border-action-brand-hover: var(--bb-color-blue_dark-375);
967
1008
  --sky-color-border-action-danger-active: var(--bb-color-red-200);
968
1009
  --sky-color-border-action-danger-base: var(--bb-color-red-600);
969
1010
  --sky-color-border-action-danger-focus: var(--bb-color-red-200);
@@ -1053,6 +1094,7 @@
1053
1094
  --sky-color-classify-7-heavy: var(--bb-color-red-400);
1054
1095
  --sky-color-classify-7-soft: var(--bb-color-red-900);
1055
1096
  --sky-color-icon-action: var(--bb-color-sky-600);
1097
+ --sky-color-icon-action_brand: var(--bb-color-gray-25);
1056
1098
  --sky-color-icon-danger: var(--bb-color-red-400);
1057
1099
  --sky-color-icon-deemphasized: var(--bb-color-gray-300);
1058
1100
  --sky-color-icon-default: var(--bb-color-gray-25);
@@ -1072,6 +1114,7 @@
1072
1114
  --sky-color-illustration-fill-softest: var(--bb-color-steel_gray-1100);
1073
1115
  --sky-color-illustration-stroke: var(--bb-color-teal_dark-100);
1074
1116
  --sky-color-text-action: var(--bb-color-sky-600);
1117
+ --sky-color-text-action_brand: var(--bb-color-gray-25);
1075
1118
  --sky-color-text-action_contrast: var(--bb-color-blue_dark-200);
1076
1119
  --sky-color-text-action_on_status: var(--bb-color-gray-1000);
1077
1120
  --sky-color-text-danger: var(--bb-color-red-400);
@@ -1128,6 +1171,7 @@
1128
1171
  --sky-image-select_icon-disabled: var(--bb-image-select_icon-disabled-base-dark-src);
1129
1172
  --sky-opacity-wait: var(--bb-opacity-600);
1130
1173
  --sky-color-background-action-accent-disabled: var(--sky-color-background-disabled);
1174
+ --sky-color-background-action-brand-disabled: var(--sky-color-background-disabled);
1131
1175
  --sky-color-background-action-danger-disabled: var(--sky-color-background-disabled);
1132
1176
  --sky-color-background-action-input-disabled: var(--sky-color-background-disabled);
1133
1177
  --sky-color-background-action-primary-disabled: var(--sky-color-background-disabled);
@@ -1141,6 +1185,7 @@
1141
1185
  --sky-color-background-selected-switch-disabled: var(--sky-color-background-disabled);
1142
1186
  --sky-color-background-tab-disabled: var(--sky-color-background-disabled);
1143
1187
  --sky-color-border-action-accent-disabled: var(--sky-color-background-disabled);
1188
+ --sky-color-border-action-brand-disabled: var(--sky-color-border-disabled);
1144
1189
  --sky-color-border-action-danger-disabled: var(--sky-color-border-disabled);
1145
1190
  --sky-color-border-action-input-disabled: var(--sky-color-border-disabled);
1146
1191
  --sky-color-border-action-on_status-disabled: var(--sky-color-border-disabled);