@skyux/theme 14.21.0 → 14.22.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/css/themes/modern/styles.css +195 -105
  2. package/package.json +2 -2
package/css/themes/modern/styles.css CHANGED
@@ -226,6 +226,22 @@
226
226
  --bb-color-red_dark-700: #912528;
227
227
  --bb-color-red_dark-800: #6d1b1d;
228
228
  --bb-color-red_dark-900: #4a1213;
229
+ --bb-color-rgba-black-10: rgba(0, 0, 0, 0.1);
230
+ --bb-color-rgba-black-12: rgba(0, 0, 0, 0.12);
231
+ --bb-color-rgba-black-16: rgba(0, 0, 0, 0.16);
232
+ --bb-color-rgba-black-20: rgba(0, 0, 0, 0.2);
233
+ --bb-color-rgba-black-21: rgba(0, 0, 0, 0.21);
234
+ --bb-color-rgba-black-22: rgba(0, 0, 0, 0.22);
235
+ --bb-color-rgba-black-24: rgba(0, 0, 0, 0.24);
236
+ --bb-color-rgba-black-25: rgba(0, 0, 0, 0.25);
237
+ --bb-color-rgba-black-28: rgba(0, 0, 0, 0.28);
238
+ --bb-color-rgba-black-30: rgba(0, 0, 0, 0.3);
239
+ --bb-color-rgba-black-34: rgba(0, 0, 0, 0.34);
240
+ --bb-color-rgba-black-35: rgba(0, 0, 0, 0.35);
241
+ --bb-color-rgba-black-36: rgba(0, 0, 0, 0.36);
242
+ --bb-color-rgba-black-50: rgba(0, 0, 0, 0.5);
243
+ --bb-color-rgba-black-60: rgba(0, 0, 0, 0.6);
244
+ --bb-color-rgba-black-65: rgba(0, 0, 0, 0.65);
229
245
  --bb-color-rgba-black-70: rgba(0, 0, 0, 0.7);
230
246
  --bb-color-rgba-blue-600-25: rgba(43, 107, 213, 0.25);
231
247
  --bb-color-rgba-blue-600-35: rgba(43, 107, 213, 0.35);
@@ -237,6 +253,11 @@
237
253
  --bb-color-rgba-red_dark-600-35: rgba(181, 47, 50, 0.35);
238
254
  --bb-color-rgba-red_dark-600-50: rgba(181, 47, 50, 0.5);
239
255
  --bb-color-rgba-sky-600-40: rgba(0, 207, 255, 0.4);
256
+ --bb-color-rgba-slate-900-12: rgba(33, 44, 63, 0.12);
257
+ --bb-color-rgba-slate-900-14: rgba(33, 44, 63, 0.14);
258
+ --bb-color-rgba-slate-900-20: rgba(33, 44, 63, 0.2);
259
+ --bb-color-rgba-slate-900-5: rgba(33, 44, 63, 0.05);
260
+ --bb-color-rgba-slate-900-50: rgba(33, 44, 63, 0.5);
240
261
  --bb-color-rgba-steel_fusion-100-5: rgba(243, 246, 249, 0.05);
241
262
  --bb-color-rgba-steel_fusion-1100-70: rgba(28, 34, 40, 0.7);
242
263
  --bb-color-rgba-steel_gray-100-10: rgba(245, 246, 247, 0.1);
@@ -411,16 +432,16 @@
411
432
  --bb-font-weight-light: 300;
412
433
  --bb-font-weight-regular: 400;
413
434
  --bb-font-weight-semibold: 600;
414
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/bb-logo.png');
415
- --bb-image-logo-primary-white-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/bb-logo-white.png');
416
- --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-base-dark.svg');
417
- --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-base-light.svg');
418
- --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-bb-dark.svg');
419
- --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-bb-light.svg');
420
- --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
421
- --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
422
- --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
423
- --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
435
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/bb-logo.png');
436
+ --bb-image-logo-primary-white-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/bb-logo-white.png');
437
+ --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');
438
+ --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');
439
+ --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');
440
+ --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');
441
+ --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');
442
+ --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');
443
+ --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');
444
+ --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');
424
445
  --bb-letter_spacing-normal: normal;
425
446
  --bb-letter_spacing-wider: 0.01rem;
426
447
  --bb-letter_spacing-widest: 0.046875rem;
@@ -436,7 +457,7 @@
436
457
  --bb-line_height-800: calc(36/27);
437
458
  --bb-opacity-600: .6;
438
459
  --bb-shadow-slate-0: 0 0 0 0 rgba(0, 0, 0, 0);
439
- --bb-shadow-steel-fusion-0: 0 0 0 0 rgba(0, 0, 0, 0);
460
+ --bb-shadow-steel_fusion-0: 0 0 0 0 rgba(0, 0, 0, 0);
440
461
  --bb-size-0: 0rem;
441
462
  --bb-size-fixed-100: 16px;
442
463
  --bb-size-fixed-12: 2px;
@@ -490,6 +511,16 @@
490
511
  --bb-color-gradient-brand-secondary-40: linear-gradient(90deg, var(--bb-color-rgba-sky-600-40) , var(--bb-color-rgba-purple-600-40));
491
512
  --bb-color-gradient-container-primary: linear-gradient(90deg, var(--bb-color-steel_fusion-700), var(--bb-color-steel_fusion-800));
492
513
  --bb-font-blkb_sans-family: var(--bb-font-blkb_sans-name), var(--bb-font-blkb_sans-fallback);
514
+ --bb-shadow-black-0: 0 0 0 0 rgba(33, 44, 63, 0);
515
+ --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);
516
+ --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);
517
+ --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);
518
+ --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);
519
+ --bb-shadow-black-25: 0 1px 1px 0 var(--bb-color-rgba-black-35);
520
+ --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);
521
+ --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);
522
+ --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);
523
+ --bb-shadow-black-simple-400: 1px 2px 4px 0 var(--bb-color-rgba-black-65);
493
524
  --bb-shadow-gray-0: 0 0 0 0 rgba(22, 26, 31, 0);
494
525
  --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);
495
526
  --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);
@@ -500,44 +531,34 @@
500
531
  --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);
501
532
  --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);
502
533
  --bb-shadow-gray-simple-400: 1px 2px 4px 0 rgba(22, 26, 31, 0.5);
503
- --bb-shadow-heavy-black-0: 0 0 0 0 rgba(0, 0, 0, 0);
504
- --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);
505
- --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);
506
- --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);
507
- --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);
508
- --bb-shadow-heavy-black-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
509
- --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);
510
- --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);
511
- --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);
512
- --bb-shadow-heavy-black-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
513
- --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);
534
+ --bb-shadow-heavy_black-0: 0 0 0 0 rgba(0, 0, 0, 0);
535
+ --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);
536
+ --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);
537
+ --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);
538
+ --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);
539
+ --bb-shadow-heavy_black-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
540
+ --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);
541
+ --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);
542
+ --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);
543
+ --bb-shadow-heavy_black-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
544
+ --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);
514
545
  --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);
515
- --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);
516
- --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);
517
- --bb-shadow-slate-25: 0 1px 1px 0 rgba(33, 44, 63, 0.05);
518
- --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);
519
- --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);
520
- --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);
521
- --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(33, 44, 63, 0.5);
522
- --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);
523
- --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);
524
- --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);
525
- --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);
526
- --bb-shadow-steel-fusion-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
527
- --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);
528
- --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);
529
- --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);
530
- --bb-shadow-steel-fusion-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
531
- --bb-shadow-steel-gray-0: 0 0 0 0 rgba(33, 44, 63, 0);
532
- --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);
533
- --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);
534
- --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);
535
- --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);
536
- --bb-shadow-steel-gray-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
537
- --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);
538
- --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);
539
- --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);
540
- --bb-shadow-steel-gray-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
546
+ --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);
547
+ --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);
548
+ --bb-shadow-slate-25: 0 1px 1px 0 var(--bb-color-rgba-slate-900-5);
549
+ --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);
550
+ --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);
551
+ --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);
552
+ --bb-shadow-slate-simple-400: 1px 2px 4px 0 var(--bb-color-rgba-slate-900-50);
553
+ --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);
554
+ --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);
555
+ --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);
556
+ --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);
557
+ --bb-shadow-steel_fusion-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
558
+ --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);
559
+ --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);
560
+ --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);
561
+ --bb-shadow-steel_fusion-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
541
562
  }
542
563
 
543
564
  :root:has(body.sky-theme-modern.sky-theme-brand-base) {
@@ -2209,6 +2230,22 @@
2209
2230
  --bb-color-red_dark-700: #912528;
2210
2231
  --bb-color-red_dark-800: #6d1b1d;
2211
2232
  --bb-color-red_dark-900: #4a1213;
2233
+ --bb-color-rgba-black-10: rgba(0, 0, 0, 0.1);
2234
+ --bb-color-rgba-black-12: rgba(0, 0, 0, 0.12);
2235
+ --bb-color-rgba-black-16: rgba(0, 0, 0, 0.16);
2236
+ --bb-color-rgba-black-20: rgba(0, 0, 0, 0.2);
2237
+ --bb-color-rgba-black-21: rgba(0, 0, 0, 0.21);
2238
+ --bb-color-rgba-black-22: rgba(0, 0, 0, 0.22);
2239
+ --bb-color-rgba-black-24: rgba(0, 0, 0, 0.24);
2240
+ --bb-color-rgba-black-25: rgba(0, 0, 0, 0.25);
2241
+ --bb-color-rgba-black-28: rgba(0, 0, 0, 0.28);
2242
+ --bb-color-rgba-black-30: rgba(0, 0, 0, 0.3);
2243
+ --bb-color-rgba-black-34: rgba(0, 0, 0, 0.34);
2244
+ --bb-color-rgba-black-35: rgba(0, 0, 0, 0.35);
2245
+ --bb-color-rgba-black-36: rgba(0, 0, 0, 0.36);
2246
+ --bb-color-rgba-black-50: rgba(0, 0, 0, 0.5);
2247
+ --bb-color-rgba-black-60: rgba(0, 0, 0, 0.6);
2248
+ --bb-color-rgba-black-65: rgba(0, 0, 0, 0.65);
2212
2249
  --bb-color-rgba-black-70: rgba(0, 0, 0, 0.7);
2213
2250
  --bb-color-rgba-blue-600-25: rgba(43, 107, 213, 0.25);
2214
2251
  --bb-color-rgba-blue-600-35: rgba(43, 107, 213, 0.35);
@@ -2220,6 +2257,11 @@
2220
2257
  --bb-color-rgba-red_dark-600-35: rgba(181, 47, 50, 0.35);
2221
2258
  --bb-color-rgba-red_dark-600-50: rgba(181, 47, 50, 0.5);
2222
2259
  --bb-color-rgba-sky-600-40: rgba(0, 207, 255, 0.4);
2260
+ --bb-color-rgba-slate-900-12: rgba(33, 44, 63, 0.12);
2261
+ --bb-color-rgba-slate-900-14: rgba(33, 44, 63, 0.14);
2262
+ --bb-color-rgba-slate-900-20: rgba(33, 44, 63, 0.2);
2263
+ --bb-color-rgba-slate-900-5: rgba(33, 44, 63, 0.05);
2264
+ --bb-color-rgba-slate-900-50: rgba(33, 44, 63, 0.5);
2223
2265
  --bb-color-rgba-steel_fusion-100-5: rgba(243, 246, 249, 0.05);
2224
2266
  --bb-color-rgba-steel_fusion-1100-70: rgba(28, 34, 40, 0.7);
2225
2267
  --bb-color-rgba-steel_gray-100-10: rgba(245, 246, 247, 0.1);
@@ -2394,16 +2436,16 @@
2394
2436
  --bb-font-weight-light: 300;
2395
2437
  --bb-font-weight-regular: 400;
2396
2438
  --bb-font-weight-semibold: 600;
2397
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/bb-logo.png');
2398
- --bb-image-logo-primary-white-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/bb-logo-white.png');
2399
- --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-base-dark.svg');
2400
- --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-base-light.svg');
2401
- --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-bb-dark.svg');
2402
- --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-bb-light.svg');
2403
- --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
2404
- --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
2405
- --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
2406
- --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.11.2/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
2439
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/bb-logo.png');
2440
+ --bb-image-logo-primary-white-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.12.0/assets/images/bb-logo-white.png');
2441
+ --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');
2442
+ --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');
2443
+ --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');
2444
+ --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');
2445
+ --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');
2446
+ --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');
2447
+ --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');
2448
+ --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');
2407
2449
  --bb-letter_spacing-normal: normal;
2408
2450
  --bb-letter_spacing-wider: 0.01rem;
2409
2451
  --bb-letter_spacing-widest: 0.046875rem;
@@ -2419,7 +2461,7 @@
2419
2461
  --bb-line_height-800: calc(36/27);
2420
2462
  --bb-opacity-600: .6;
2421
2463
  --bb-shadow-slate-0: 0 0 0 0 rgba(0, 0, 0, 0);
2422
- --bb-shadow-steel-fusion-0: 0 0 0 0 rgba(0, 0, 0, 0);
2464
+ --bb-shadow-steel_fusion-0: 0 0 0 0 rgba(0, 0, 0, 0);
2423
2465
  --bb-size-0: 0rem;
2424
2466
  --bb-size-fixed-100: 16px;
2425
2467
  --bb-size-fixed-12: 2px;
@@ -2473,6 +2515,16 @@
2473
2515
  --bb-color-gradient-brand-secondary-40: linear-gradient(90deg, var(--bb-color-rgba-sky-600-40) , var(--bb-color-rgba-purple-600-40));
2474
2516
  --bb-color-gradient-container-primary: linear-gradient(90deg, var(--bb-color-steel_fusion-700), var(--bb-color-steel_fusion-800));
2475
2517
  --bb-font-blkb_sans-family: var(--bb-font-blkb_sans-name), var(--bb-font-blkb_sans-fallback);
2518
+ --bb-shadow-black-0: 0 0 0 0 rgba(33, 44, 63, 0);
2519
+ --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);
2520
+ --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);
2521
+ --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);
2522
+ --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);
2523
+ --bb-shadow-black-25: 0 1px 1px 0 var(--bb-color-rgba-black-35);
2524
+ --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);
2525
+ --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);
2526
+ --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);
2527
+ --bb-shadow-black-simple-400: 1px 2px 4px 0 var(--bb-color-rgba-black-65);
2476
2528
  --bb-shadow-gray-0: 0 0 0 0 rgba(22, 26, 31, 0);
2477
2529
  --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);
2478
2530
  --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);
@@ -2483,44 +2535,34 @@
2483
2535
  --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);
2484
2536
  --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);
2485
2537
  --bb-shadow-gray-simple-400: 1px 2px 4px 0 rgba(22, 26, 31, 0.5);
2486
- --bb-shadow-heavy-black-0: 0 0 0 0 rgba(0, 0, 0, 0);
2487
- --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);
2488
- --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);
2489
- --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);
2490
- --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);
2491
- --bb-shadow-heavy-black-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
2492
- --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);
2493
- --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);
2494
- --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);
2495
- --bb-shadow-heavy-black-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
2496
- --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);
2538
+ --bb-shadow-heavy_black-0: 0 0 0 0 rgba(0, 0, 0, 0);
2539
+ --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);
2540
+ --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);
2541
+ --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);
2542
+ --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);
2543
+ --bb-shadow-heavy_black-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
2544
+ --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);
2545
+ --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);
2546
+ --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);
2547
+ --bb-shadow-heavy_black-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
2548
+ --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);
2497
2549
  --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);
2498
- --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);
2499
- --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);
2500
- --bb-shadow-slate-25: 0 1px 1px 0 rgba(33, 44, 63, 0.05);
2501
- --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);
2502
- --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);
2503
- --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);
2504
- --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(33, 44, 63, 0.5);
2505
- --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);
2506
- --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);
2507
- --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);
2508
- --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);
2509
- --bb-shadow-steel-fusion-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
2510
- --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);
2511
- --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);
2512
- --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);
2513
- --bb-shadow-steel-fusion-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
2514
- --bb-shadow-steel-gray-0: 0 0 0 0 rgba(33, 44, 63, 0);
2515
- --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);
2516
- --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);
2517
- --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);
2518
- --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);
2519
- --bb-shadow-steel-gray-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
2520
- --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);
2521
- --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);
2522
- --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);
2523
- --bb-shadow-steel-gray-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
2550
+ --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);
2551
+ --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);
2552
+ --bb-shadow-slate-25: 0 1px 1px 0 var(--bb-color-rgba-slate-900-5);
2553
+ --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);
2554
+ --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);
2555
+ --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);
2556
+ --bb-shadow-slate-simple-400: 1px 2px 4px 0 var(--bb-color-rgba-slate-900-50);
2557
+ --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);
2558
+ --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);
2559
+ --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);
2560
+ --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);
2561
+ --bb-shadow-steel_fusion-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
2562
+ --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);
2563
+ --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);
2564
+ --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);
2565
+ --bb-shadow-steel_fusion-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
2524
2566
  }
2525
2567
 
2526
2568
  :root:has(body.sky-theme-modern.sky-theme-brand-base.sky-theme-brand-blackbaud) {
@@ -2557,6 +2599,30 @@
2557
2599
  --sky-color-illustration-fill-soft: var(--bb-color-green-50);
2558
2600
  --sky-color-illustration-fill-softest: var(--bb-color-white);
2559
2601
  --sky-color-illustration-stroke: var(--bb-color-brand-trusted_blue);
2602
+ --sky-color-shadow-action: var(--bb-color-rgba-slate-900-12);
2603
+ --sky-color-shadow-focus-1: var(--bb-color-rgba-slate-900-20);
2604
+ --sky-color-shadow-focus-2: var(--bb-color-rgba-slate-900-12);
2605
+ --sky-color-shadow-focus-3: var(--bb-color-rgba-slate-900-14);
2606
+ --sky-color-shadow-input: var(--bb-color-rgba-slate-900-5);
2607
+ --sky-color-shadow-overflow-1: var(--bb-color-rgba-slate-900-20);
2608
+ --sky-color-shadow-overflow-2: var(--bb-color-rgba-slate-900-12);
2609
+ --sky-color-shadow-overflow-3: var(--bb-color-rgba-slate-900-14);
2610
+ --sky-color-shadow-overlay-100-1: var(--bb-color-rgba-slate-900-20);
2611
+ --sky-color-shadow-overlay-100-2: var(--bb-color-rgba-slate-900-12);
2612
+ --sky-color-shadow-overlay-100-3: var(--bb-color-rgba-slate-900-14);
2613
+ --sky-color-shadow-overlay-200-1: var(--bb-color-rgba-slate-900-20);
2614
+ --sky-color-shadow-overlay-200-2: var(--bb-color-rgba-slate-900-12);
2615
+ --sky-color-shadow-overlay-200-3: var(--bb-color-rgba-slate-900-14);
2616
+ --sky-color-shadow-overlay-300-1: var(--bb-color-rgba-slate-900-20);
2617
+ --sky-color-shadow-overlay-300-2: var(--bb-color-rgba-slate-900-12);
2618
+ --sky-color-shadow-overlay-300-3: var(--bb-color-rgba-slate-900-14);
2619
+ --sky-color-shadow-overlay-400-1: var(--bb-color-rgba-slate-900-20);
2620
+ --sky-color-shadow-overlay-400-2: var(--bb-color-rgba-slate-900-12);
2621
+ --sky-color-shadow-overlay-400-3: var(--bb-color-rgba-slate-900-14);
2622
+ --sky-color-shadow-overlay-simple-100: var(--bb-color-rgba-slate-900-50);
2623
+ --sky-color-shadow-raised-100-1: var(--bb-color-rgba-slate-900-20);
2624
+ --sky-color-shadow-raised-100-2: var(--bb-color-rgba-slate-900-12);
2625
+ --sky-color-shadow-raised-100-3: var(--bb-color-rgba-slate-900-14);
2560
2626
  --sky-color-text-action_brand: var(--bb-color-sky-900);
2561
2627
  --sky-color-text-heading: var(--bb-color-blue-900);
2562
2628
  --sky-elevation-action-danger-active: var(--bb-shadow-slate-0);
@@ -2795,6 +2861,30 @@
2795
2861
  --sky-color-illustration-fill-soft: var(--bb-color-teal_dark-800);
2796
2862
  --sky-color-illustration-fill-softest: var(--bb-color-steel_gray-1100);
2797
2863
  --sky-color-illustration-stroke: var(--bb-color-teal_dark-100);
2864
+ --sky-color-shadow-action: var(--bb-color-transparent);
2865
+ --sky-color-shadow-focus-1: var(--bb-color-rgba-black-50);
2866
+ --sky-color-shadow-focus-2: var(--bb-color-rgba-black-30);
2867
+ --sky-color-shadow-focus-3: var(--bb-color-rgba-black-35);
2868
+ --sky-color-shadow-input: var(--bb-color-transparent);
2869
+ --sky-color-shadow-overflow-1: var(--bb-color-rgba-black-50);
2870
+ --sky-color-shadow-overflow-2: var(--bb-color-rgba-black-30);
2871
+ --sky-color-shadow-overflow-3: var(--bb-color-rgba-black-35);
2872
+ --sky-color-shadow-overlay-100-1: var(--bb-color-rgba-black-24);
2873
+ --sky-color-shadow-overlay-100-2: var(--bb-color-rgba-black-16);
2874
+ --sky-color-shadow-overlay-100-3: var(--bb-color-rgba-black-21);
2875
+ --sky-color-shadow-overlay-200-1: var(--bb-color-rgba-black-24);
2876
+ --sky-color-shadow-overlay-200-2: var(--bb-color-rgba-black-12);
2877
+ --sky-color-shadow-overlay-200-3: var(--bb-color-rgba-black-10);
2878
+ --sky-color-shadow-overlay-300-1: var(--bb-color-rgba-black-36);
2879
+ --sky-color-shadow-overlay-300-2: var(--bb-color-rgba-black-22);
2880
+ --sky-color-shadow-overlay-300-3: var(--bb-color-rgba-black-25);
2881
+ --sky-color-shadow-overlay-400-1: var(--bb-color-rgba-black-34);
2882
+ --sky-color-shadow-overlay-400-2: var(--bb-color-rgba-black-20);
2883
+ --sky-color-shadow-overlay-400-3: var(--bb-color-rgba-black-24);
2884
+ --sky-color-shadow-overlay-simple-100: var(--bb-color-rgba-black-65);
2885
+ --sky-color-shadow-raised-100-1: var(--bb-color-rgba-black-30);
2886
+ --sky-color-shadow-raised-100-2: var(--bb-color-rgba-black-25);
2887
+ --sky-color-shadow-raised-100-3: var(--bb-color-rgba-black-28);
2798
2888
  --sky-color-text-action: var(--bb-color-blue_dark-375);
2799
2889
  --sky-color-text-action_brand: var(--bb-color-sky_dark-100);
2800
2890
  --sky-color-text-action_contrast: var(--bb-color-blue_dark-200);
@@ -2830,15 +2920,15 @@
2830
2920
  --sky-color-border-action-tertiary-disabled: var(--sky-color-border-disabled);
2831
2921
  --sky-color-border-action-tertiary-on_prominent-disabled: var(--sky-color-border-disabled);
2832
2922
  --sky-color-border-tab-disabled: var(--sky-color-border-disabled);
2833
- --sky-elevation-focus: var(--bb-shadow-steel-gray-200);
2834
- --sky-elevation-none: var(--bb-shadow-steel-gray-0);
2835
- --sky-elevation-overflow: var(--bb-shadow-steel-gray-200);
2836
- --sky-elevation-overlay-100: var(--bb-shadow-steel-gray-400);
2837
- --sky-elevation-overlay-200: var(--bb-shadow-steel-gray-800);
2838
- --sky-elevation-overlay-300: var(--bb-shadow-steel-gray-1600);
2839
- --sky-elevation-overlay-400: var(--bb-shadow-steel-gray-2400);
2840
- --sky-elevation-overlay-simple-100: var(--bb-shadow-steel-gray-simple-400);
2841
- --sky-elevation-raised-100: var(--bb-shadow-steel-gray-100);
2923
+ --sky-elevation-focus: var(--bb-shadow-black-200);
2924
+ --sky-elevation-none: var(--bb-shadow-black-0);
2925
+ --sky-elevation-overflow: var(--bb-shadow-black-200);
2926
+ --sky-elevation-overlay-100: var(--bb-shadow-black-400);
2927
+ --sky-elevation-overlay-200: var(--bb-shadow-black-800);
2928
+ --sky-elevation-overlay-300: var(--bb-shadow-black-1600);
2929
+ --sky-elevation-overlay-400: var(--bb-shadow-black-2400);
2930
+ --sky-elevation-overlay-simple-100: var(--bb-shadow-black-simple-400);
2931
+ --sky-elevation-raised-100: var(--bb-shadow-black-100);
2842
2932
  }
2843
2933
 
2844
2934
  :root:has(body.sky-theme-modern.sky-theme-brand-base.sky-theme-brand-blackbaud.sky-theme-mode-dark) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skyux/theme",
3
- "version": "14.21.0",
3
+ "version": "14.22.1",
4
4
  "author": "Blackbaud, Inc.",
5
5
  "keywords": [
6
6
  "blackbaud",
@@ -20,7 +20,7 @@
20
20
  "@angular/core": "^21.2.0"
21
21
  },
22
22
  "dependencies": {
23
- "@blackbaud/skyux-design-tokens": "6.11.2",
23
+ "@blackbaud/skyux-design-tokens": "6.12.0",
24
24
  "fontfaceobserver": "2.3.0",
25
25
  "tslib": "^2.8.1"
26
26
  },