@skyux/theme 15.0.0-alpha.0 → 15.0.0-alpha.10

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.
@@ -3,6 +3,11 @@
3
3
  inherits: true;
4
4
  initial-value: url("data:,");
5
5
  }
6
+ @property --bb-image-logo-primary-white-src {
7
+ syntax: "<url>";
8
+ inherits: true;
9
+ initial-value: url("data:,");
10
+ }
6
11
  @property --bb-image-select_icon-base-dark-src {
7
12
  syntax: "<url>";
8
13
  inherits: true;
@@ -51,6 +56,7 @@
51
56
  --bb-border-radius-pill: 999rem;
52
57
  --bb-border-radius-round: 50%;
53
58
  --bb-border-style-dotted: dotted;
59
+ --bb-border-style-none: none;
54
60
  --bb-border-style-solid: solid;
55
61
  --bb-brand-name: 'Blackbaud';
56
62
  --bb-color-black: #000000;
@@ -70,6 +76,17 @@
70
76
  --bb-color-blue-800: #1a4080;
71
77
  --bb-color-blue-850: #16366b;
72
78
  --bb-color-blue-900: #112b55;
79
+ --bb-color-blue-dark-100: #ddf0ff;
80
+ --bb-color-blue-dark-1000: #00112b;
81
+ --bb-color-blue-dark-200: #b4dbff;
82
+ --bb-color-blue-dark-300: #83c1ff;
83
+ --bb-color-blue-dark-375: #79adf1;
84
+ --bb-color-blue-dark-400: #59a6ff;
85
+ --bb-color-blue-dark-500: #2885ef;
86
+ --bb-color-blue-dark-600: #0066cd;
87
+ --bb-color-blue-dark-700: #0049a1;
88
+ --bb-color-blue-dark-800: #003275;
89
+ --bb-color-blue-dark-900: #00204b;
73
90
  --bb-color-brand-impact_green: #0cd973;
74
91
  --bb-color-brand-trusted_blue: #004054;
75
92
  --bb-color-gray-100: #eeeeef;
@@ -102,6 +119,17 @@
102
119
  --bb-color-green-700: #077e43;
103
120
  --bb-color-green-800: #055f33;
104
121
  --bb-color-green-900: #044525;
122
+ --bb-color-green-dark-100: #daf7e3;
123
+ --bb-color-green-dark-1000: #001905;
124
+ --bb-color-green-dark-200: #aee8c1;
125
+ --bb-color-green-dark-300: #72d699;
126
+ --bb-color-green-dark-400: #35c177;
127
+ --bb-color-green-dark-500: #00a452;
128
+ --bb-color-green-dark-600: #008435;
129
+ --bb-color-green-dark-700: #00641f;
130
+ --bb-color-green-dark-800: #004712;
131
+ --bb-color-green-dark-900: #002d0c;
132
+ --bb-color-oklch-blue-375: #79adf1;
105
133
  --bb-color-orange-100: #feede0;
106
134
  --bb-color-orange-1000: #451d00;
107
135
  --bb-color-orange-1100: #311400;
@@ -116,6 +144,16 @@
116
144
  --bb-color-orange-700: #a74500;
117
145
  --bb-color-orange-800: #7f3500;
118
146
  --bb-color-orange-900: #622900;
147
+ --bb-color-orange-dark-100: #ffe9df;
148
+ --bb-color-orange-dark-1000: #200b03;
149
+ --bb-color-orange-dark-200: #fbccb6;
150
+ --bb-color-orange-dark-300: #f3aa88;
151
+ --bb-color-orange-dark-400: #e5895d;
152
+ --bb-color-orange-dark-500: #ca6633;
153
+ --bb-color-orange-dark-600: #a74500;
154
+ --bb-color-orange-dark-700: #822f00;
155
+ --bb-color-orange-dark-800: #5c2000;
156
+ --bb-color-orange-dark-900: #3a1503;
119
157
  --bb-color-pink-100: #fdecfd;
120
158
  --bb-color-pink-1000: #3f193d;
121
159
  --bb-color-pink-1100: #30132f;
@@ -130,6 +168,16 @@
130
168
  --bb-color-pink-700: #a542a0;
131
169
  --bb-color-pink-800: #853581;
132
170
  --bb-color-pink-900: #5c2559;
171
+ --bb-color-pink-dark-100: #fbe8f9;
172
+ --bb-color-pink-dark-1000: #1b0a1b;
173
+ --bb-color-pink-dark-200: #f0c9ec;
174
+ --bb-color-pink-dark-300: #e3a6de;
175
+ --bb-color-pink-dark-400: #d285cd;
176
+ --bb-color-pink-dark-500: #b562b1;
177
+ --bb-color-pink-dark-600: #923f8f;
178
+ --bb-color-pink-dark-700: #722c70;
179
+ --bb-color-pink-dark-800: #501d4f;
180
+ --bb-color-pink-dark-900: #331431;
133
181
  --bb-color-purple-100: #f2e6fd;
134
182
  --bb-color-purple-1000: #351d49;
135
183
  --bb-color-purple-1100: #271535;
@@ -144,6 +192,16 @@
144
192
  --bb-color-purple-700: #8d4ec2;
145
193
  --bb-color-purple-800: #6d3c96;
146
194
  --bb-color-purple-900: #4d2b6a;
195
+ --bb-color-purple-dark-100: #f4e9ff;
196
+ --bb-color-purple-dark-1000: #170b23;
197
+ --bb-color-purple-dark-200: #e3ccff;
198
+ --bb-color-purple-dark-300: #d0aafb;
199
+ --bb-color-purple-dark-400: #bc89f1;
200
+ --bb-color-purple-dark-500: #9f65d7;
201
+ --bb-color-purple-dark-600: #7a3daf;
202
+ --bb-color-purple-dark-700: #622e8f;
203
+ --bb-color-purple-dark-800: #441f65;
204
+ --bb-color-purple-dark-900: #2b153f;
147
205
  --bb-color-red-100: #fae7e8;
148
206
  --bb-color-red-1000: #4a1415;
149
207
  --bb-color-red-1100: #380f10;
@@ -158,11 +216,40 @@
158
216
  --bb-color-red-700: #ae2e31;
159
217
  --bb-color-red-800: #822325;
160
218
  --bb-color-red-900: #641b1c;
219
+ --bb-color-red-dark-100: #fdecea;
220
+ --bb-color-red-dark-1000: #27090a;
221
+ --bb-color-red-dark-200: #facac8;
222
+ --bb-color-red-dark-300: #f59a98;
223
+ --bb-color-red-dark-400: #e96063;
224
+ --bb-color-red-dark-500: #d93a3d;
225
+ --bb-color-red-dark-600: #b52f32;
226
+ --bb-color-red-dark-700: #912528;
227
+ --bb-color-red-dark-800: #6d1b1d;
228
+ --bb-color-red-dark-900: #4a1213;
161
229
  --bb-color-rgba-black-70: rgba(0, 0, 0, 0.7);
230
+ --bb-color-rgba-blue-600-25: rgba(43, 107, 213, 0.25);
231
+ --bb-color-rgba-blue-600-35: rgba(43, 107, 213, 0.35);
232
+ --bb-color-rgba-blue-600-50: rgba(43, 107, 213, 0.5);
233
+ --bb-color-rgba-blue-dark-600-20: rgba(0, 102, 205, 0.2);
234
+ --bb-color-rgba-green-600-35: rgba(9, 156, 83, 0.35);
235
+ --bb-color-rgba-green-600-50: rgba(9, 156, 83, 0.5);
162
236
  --bb-color-rgba-purple-600-40: rgba(176, 97, 242, 0.4);
237
+ --bb-color-rgba-red-dark-600-35: rgba(181, 47, 50, 0.35);
238
+ --bb-color-rgba-red-dark-600-50: rgba(181, 47, 50, 0.5);
163
239
  --bb-color-rgba-sky-600-40: rgba(0, 207, 255, 0.4);
240
+ --bb-color-rgba-steel-fusion-100-5: rgba(243, 246, 249, 0.05);
241
+ --bb-color-rgba-steel-fusion-1100-70: rgba(28, 34, 40, 0.7);
242
+ --bb-color-rgba-steel-gray-100-10: rgba(245, 246, 247, 0.1);
243
+ --bb-color-rgba-steel-gray-100-15: rgba(245, 246, 247, 0.15);
244
+ --bb-color-rgba-steel-gray-100-25: rgba(245, 246, 247, 0.25);
245
+ --bb-color-rgba-steel-gray-100-7: rgba(245, 246, 247, 0.07);
246
+ --bb-color-rgba-white-18: rgba(255, 255, 255, 0.18);
247
+ --bb-color-rgba-white-5: rgba(255, 255, 255, 0.05);
164
248
  --bb-color-rgba-white-70: rgba(255, 255, 255, 0.7);
165
- --bb-color-scrim: rgba(37, 43, 51, 0.5);
249
+ --bb-color-rgba-yellow-dark-600-25: rgba(162, 81, 0, 0.25);
250
+ --bb-color-rgba-yellow-dark-600-35: rgba(162, 81, 0, 0.35);
251
+ --bb-color-scrim-heavy: rgba(0, 0, 0, 0.6);
252
+ --bb-color-scrim-soft: rgba(37, 43, 51, 0.5);
166
253
  --bb-color-sky-100: #d6f7ff;
167
254
  --bb-color-sky-1000: #002933;
168
255
  --bb-color-sky-1100: #002129;
@@ -177,6 +264,16 @@
177
264
  --bb-color-sky-700: #007894;
178
265
  --bb-color-sky-800: #005b70;
179
266
  --bb-color-sky-900: #004252;
267
+ --bb-color-sky-dark-100: #e3f1f7;
268
+ --bb-color-sky-dark-1000: #051419;
269
+ --bb-color-sky-dark-200: #bfdde9;
270
+ --bb-color-sky-dark-300: #96c6d9;
271
+ --bb-color-sky-dark-400: #6fafc7;
272
+ --bb-color-sky-dark-500: #4791ab;
273
+ --bb-color-sky-dark-600: #005f78;
274
+ --bb-color-sky-dark-700: #0c556b;
275
+ --bb-color-sky-dark-800: #083b4b;
276
+ --bb-color-sky-dark-900: #09252f;
180
277
  --bb-color-slate-100: #f1f3f7;
181
278
  --bb-color-slate-1000: #1a2231;
182
279
  --bb-color-slate-1100: #141b26;
@@ -193,6 +290,46 @@
193
290
  --bb-color-slate-800: #32435e;
194
291
  --bb-color-slate-850: #2a384f;
195
292
  --bb-color-slate-900: #212c3f;
293
+ --bb-color-steel-blue-dark-100: #617695;
294
+ --bb-color-steel-blue-dark-1000: #06152e;
295
+ --bb-color-steel-blue-dark-200: #566a88;
296
+ --bb-color-steel-blue-dark-300: #4b5f7c;
297
+ --bb-color-steel-blue-dark-400: #405371;
298
+ --bb-color-steel-blue-dark-500: #354865;
299
+ --bb-color-steel-blue-dark-600: #2b3e5a;
300
+ --bb-color-steel-blue-dark-700: #21334e;
301
+ --bb-color-steel-blue-dark-800: #172943;
302
+ --bb-color-steel-blue-dark-900: #0e1f39;
303
+ --bb-color-steel-fusion-100: #f3f6f9;
304
+ --bb-color-steel-fusion-1000: #2a313c;
305
+ --bb-color-steel-fusion-1050: #21282f;
306
+ --bb-color-steel-fusion-1100: #1c2228;
307
+ --bb-color-steel-fusion-1150: #181e25;
308
+ --bb-color-steel-fusion-1200: #141a1f;
309
+ --bb-color-steel-fusion-200: #e0e4e8;
310
+ --bb-color-steel-fusion-300: #c8cdd3;
311
+ --bb-color-steel-fusion-400: #b0b6bc;
312
+ --bb-color-steel-fusion-500: #929ba4;
313
+ --bb-color-steel-fusion-600: #757e88;
314
+ --bb-color-steel-fusion-700: #5e6770;
315
+ --bb-color-steel-fusion-800: #4a5259;
316
+ --bb-color-steel-fusion-900: #363d44;
317
+ --bb-color-steel-gray-100: #f5f6f7;
318
+ --bb-color-steel-gray-1000: #2e3135;
319
+ --bb-color-steel-gray-1050: #25272a;
320
+ --bb-color-steel-gray-1075: #222427;
321
+ --bb-color-steel-gray-1100: #1f2224;
322
+ --bb-color-steel-gray-1125: #1e2022;
323
+ --bb-color-steel-gray-1150: #1c1e20;
324
+ --bb-color-steel-gray-1200: #17191b;
325
+ --bb-color-steel-gray-200: #e2e4e5;
326
+ --bb-color-steel-gray-300: #cbcdcf;
327
+ --bb-color-steel-gray-400: #b3b5b8;
328
+ --bb-color-steel-gray-500: #979a9d;
329
+ --bb-color-steel-gray-600: #7a7d81;
330
+ --bb-color-steel-gray-700: #636669;
331
+ --bb-color-steel-gray-800: #4e5154;
332
+ --bb-color-steel-gray-900: #3a3c3f;
196
333
  --bb-color-teal-100: #dcf6f5;
197
334
  --bb-color-teal-1000: #022a28;
198
335
  --bb-color-teal-1100: #011e1d;
@@ -207,6 +344,16 @@
207
344
  --bb-color-teal-700: #046e6b;
208
345
  --bb-color-teal-800: #035755;
209
346
  --bb-color-teal-900: #02413f;
347
+ --bb-color-teal-dark-100: #e1f3f1;
348
+ --bb-color-teal-dark-1000: #031514;
349
+ --bb-color-teal-dark-200: #bce0dd;
350
+ --bb-color-teal-dark-300: #8fcbc7;
351
+ --bb-color-teal-dark-400: #63b5b0;
352
+ --bb-color-teal-dark-500: #359793;
353
+ --bb-color-teal-dark-600: #047e7a;
354
+ --bb-color-teal-dark-700: #005b57;
355
+ --bb-color-teal-dark-800: #003f3d;
356
+ --bb-color-teal-dark-900: #022826;
210
357
  --bb-color-transparent: rgba(0, 0, 0, 0);
211
358
  --bb-color-white: #ffffff;
212
359
  --bb-color-yellow-100: #feefd6;
@@ -223,6 +370,16 @@
223
370
  --bb-color-yellow-700: #92661e;
224
371
  --bb-color-yellow-800: #6e4d17;
225
372
  --bb-color-yellow-900: #503811;
373
+ --bb-color-yellow-dark-100: #fff8ec;
374
+ --bb-color-yellow-dark-1000: #200c00;
375
+ --bb-color-yellow-dark-200: #fef0d0;
376
+ --bb-color-yellow-dark-300: #fde0a8;
377
+ --bb-color-yellow-dark-400: #fbb034;
378
+ --bb-color-yellow-dark-500: #c37000;
379
+ --bb-color-yellow-dark-600: #a25100;
380
+ --bb-color-yellow-dark-700: #7d3800;
381
+ --bb-color-yellow-dark-800: #5a2500;
382
+ --bb-color-yellow-dark-900: #391800;
226
383
  --bb-duration-150: 150ms;
227
384
  --bb-duration-250: 250ms;
228
385
  --bb-font-blkb_sans-fallback: Helvetica Neue, Arial, sans-serif;
@@ -253,15 +410,16 @@
253
410
  --bb-font-weight-light: 300;
254
411
  --bb-font-weight-regular: 400;
255
412
  --bb-font-weight-semibold: 600;
256
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/bb-logo.png');
257
- --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-base-dark.svg');
258
- --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-base-light.svg');
259
- --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-bb-dark.svg');
260
- --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-bb-light.svg');
261
- --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
262
- --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
263
- --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
264
- --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
413
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/bb-logo.png');
414
+ --bb-image-logo-primary-white-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/bb-logo-white.png');
415
+ --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-base-dark.svg');
416
+ --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-base-light.svg');
417
+ --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-bb-dark.svg');
418
+ --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-bb-light.svg');
419
+ --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
420
+ --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
421
+ --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
422
+ --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
265
423
  --bb-letter_spacing-normal: normal;
266
424
  --bb-letter_spacing-wider: 0.01rem;
267
425
  --bb-letter_spacing-widest: 0.046875rem;
@@ -276,8 +434,8 @@
276
434
  --bb-line_height-700: calc(32/24);
277
435
  --bb-line_height-800: calc(36/27);
278
436
  --bb-opacity-600: .6;
279
- --bb-shadow-gray-0: 0 0 0 0 rgba(0, 0, 0, 0);
280
437
  --bb-shadow-slate-0: 0 0 0 0 rgba(0, 0, 0, 0);
438
+ --bb-shadow-steel-fusion-0: 0 0 0 0 rgba(0, 0, 0, 0);
281
439
  --bb-size-0: 0rem;
282
440
  --bb-size-fixed-100: 16px;
283
441
  --bb-size-fixed-12: 2px;
@@ -328,8 +486,10 @@
328
486
  --bb-space-8: 24px;
329
487
  --bb-space-9: 36px;
330
488
  --bb-color-gradient-blue: linear-gradient( var(--bb-color-blue-500), var(--bb-color-blue-700));
331
- --bb-color-gradient-brand-secondary: linear-gradient(90deg, var(--bb-color-rgba-sky-600-40), var(--bb-color-rgba-purple-600-40));
489
+ --bb-color-gradient-brand-secondary: linear-gradient(90deg, var(--bb-color-rgba-sky-600-40) , var(--bb-color-rgba-purple-600-40));
490
+ --bb-color-gradient-container-primary: linear-gradient(90deg, var(--bb-color-steel-fusion-700), var(--bb-color-steel-fusion-800));
332
491
  --bb-font-blkb_sans-family: var(--bb-font-blkb_sans-name), var(--bb-font-blkb_sans-fallback);
492
+ --bb-shadow-gray-0: 0 0 0 0 rgba(22, 26, 31, 0);
333
493
  --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);
334
494
  --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);
335
495
  --bb-shadow-gray-200: 0 1px 8px 0 rgba(22, 26, 31, 0.2), 0 3px 3px -2px rgba(22, 26, 31, 0.12), 0 3px 4px 0 rgba(22, 26, 31, 0.14);
@@ -339,6 +499,16 @@
339
499
  --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);
340
500
  --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);
341
501
  --bb-shadow-gray-simple-400: 1px 2px 4px 0 rgba(22, 26, 31, 0.5);
502
+ --bb-shadow-heavy-black-0: 0 0 0 0 rgba(0, 0, 0, 0);
503
+ --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);
504
+ --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);
505
+ --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);
506
+ --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);
507
+ --bb-shadow-heavy-black-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
508
+ --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);
509
+ --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);
510
+ --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);
511
+ --bb-shadow-heavy-black-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
342
512
  --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);
343
513
  --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);
344
514
  --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);
@@ -348,9 +518,37 @@
348
518
  --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);
349
519
  --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);
350
520
  --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(33, 44, 63, 0.5);
521
+ --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);
522
+ --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);
523
+ --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);
524
+ --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);
525
+ --bb-shadow-steel-fusion-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
526
+ --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);
527
+ --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);
528
+ --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);
529
+ --bb-shadow-steel-fusion-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
530
+ --bb-shadow-steel-gray-0: 0 0 0 0 rgba(33, 44, 63, 0);
531
+ --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);
532
+ --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);
533
+ --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);
534
+ --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);
535
+ --bb-shadow-steel-gray-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
536
+ --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);
537
+ --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);
538
+ --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);
539
+ --bb-shadow-steel-gray-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
351
540
  }
352
541
 
353
- .sky-theme-modern.sky-theme-brand-base {
542
+ :root:has(body.sky-theme-modern.sky-theme-brand-base) {
543
+ --bb-color-scrollbar-base-dark-thumb: #51555c;
544
+ --bb-color-scrollbar-base-dark-track: #1e2229;
545
+ --bb-color-scrollbar-base-light-thumb: #85888d;
546
+ --bb-color-scrollbar-base-light-track: #ffffff;
547
+ --bb-color-scrollbar-bb-dark-thumb: #51555c;
548
+ --bb-color-scrollbar-bb-dark-track: #1c2228;
549
+ }
550
+
551
+ .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-light {
354
552
  --sky-brand-name: var(--bb-brand-name);
355
553
  --sky-color-background-action-accent-active: var(--bb-color-blue-100);
356
554
  --sky-color-background-action-accent-base: var(--bb-color-white);
@@ -372,17 +570,28 @@
372
570
  --sky-color-background-action-secondary-base: var(--bb-color-white);
373
571
  --sky-color-background-action-secondary-focus: var(--bb-color-white);
374
572
  --sky-color-background-action-secondary-hover: var(--bb-color-blue-50);
573
+ --sky-color-background-action-secondary-on_scrim-active: var(--bb-color-blue-100);
574
+ --sky-color-background-action-secondary-on_scrim-base: var(--bb-color-white);
575
+ --sky-color-background-action-secondary-on_scrim-focus: var(--bb-color-white);
576
+ --sky-color-background-action-secondary-on_scrim-hover: var(--bb-color-blue-50);
375
577
  --sky-color-background-action-tertiary-active: var(--bb-color-blue-100);
376
578
  --sky-color-background-action-tertiary-base: var(--bb-color-transparent);
377
579
  --sky-color-background-action-tertiary-focus: var(--bb-color-transparent);
378
580
  --sky-color-background-action-tertiary-hover: var(--bb-color-blue-50);
581
+ --sky-color-background-action-tertiary-on_prominent-active: var(--bb-color-slate-600);
582
+ --sky-color-background-action-tertiary-on_prominent-base: var(--bb-color-transparent);
583
+ --sky-color-background-action-tertiary-on_prominent-disabled: var(--bb-color-gray-700);
584
+ --sky-color-background-action-tertiary-on_prominent-focus: var(--bb-color-transparent);
585
+ --sky-color-background-action-tertiary-on_prominent-hover: var(--bb-color-slate-700);
379
586
  --sky-color-background-blocking: var(--bb-color-rgba-white-70);
380
587
  --sky-color-background-container-backdrop: var(--bb-color-gray-200);
381
588
  --sky-color-background-container-base: var(--bb-color-white);
382
589
  --sky-color-background-container-danger: var(--bb-color-red-200);
383
590
  --sky-color-background-container-dimmed: var(--bb-color-gray-25);
591
+ --sky-color-background-container-header-prominent: var(--bb-color-slate-800);
384
592
  --sky-color-background-container-info: var(--bb-color-blue-200);
385
593
  --sky-color-background-container-menu: var(--bb-color-white);
594
+ --sky-color-background-container-prominent: var(--bb-color-slate-50);
386
595
  --sky-color-background-container-success: var(--bb-color-green-200);
387
596
  --sky-color-background-container-tooltip: var(--bb-color-gray-1000);
388
597
  --sky-color-background-container-warning: var(--bb-color-yellow-200);
@@ -404,7 +613,7 @@
404
613
  --sky-color-background-row-base: var(--bb-color-white);
405
614
  --sky-color-background-row-focus: var(--bb-color-white);
406
615
  --sky-color-background-row-hover: var(--bb-color-blue-50);
407
- --sky-color-background-scrim: var(--bb-color-scrim);
616
+ --sky-color-background-scrim: var(--bb-color-scrim-soft);
408
617
  --sky-color-background-selected-danger: var(--bb-color-red-200);
409
618
  --sky-color-background-selected-heavy: var(--bb-color-blue-600);
410
619
  --sky-color-background-selected-soft: var(--bb-color-blue-100);
@@ -433,6 +642,10 @@
433
642
  --sky-color-border-action-input-base: var(--bb-color-gray-300);
434
643
  --sky-color-border-action-input-focus: var(--bb-color-blue-600);
435
644
  --sky-color-border-action-input-hover: var(--bb-color-blue-600);
645
+ --sky-color-border-action-on_status-active: var(--bb-color-gray-1000);
646
+ --sky-color-border-action-on_status-base: var(--bb-color-transparent);
647
+ --sky-color-border-action-on_status-focus: var(--bb-color-gray-1000);
648
+ --sky-color-border-action-on_status-hover: var(--bb-color-gray-1000);
436
649
  --sky-color-border-action-primary-active: var(--bb-color-blue-1000);
437
650
  --sky-color-border-action-primary-base: var(--bb-color-blue-600);
438
651
  --sky-color-border-action-primary-focus: var(--bb-color-blue-1000);
@@ -445,8 +658,14 @@
445
658
  --sky-color-border-action-tertiary-base: var(--bb-color-transparent);
446
659
  --sky-color-border-action-tertiary-focus: var(--bb-color-blue-600);
447
660
  --sky-color-border-action-tertiary-hover: var(--bb-color-blue-600);
661
+ --sky-color-border-action-tertiary-on_prominent-active: var(--bb-color-blue-300);
662
+ --sky-color-border-action-tertiary-on_prominent-base: var(--bb-color-transparent);
663
+ --sky-color-border-action-tertiary-on_prominent-disabled: var(--bb-color-gray-800);
664
+ --sky-color-border-action-tertiary-on_prominent-focus: var(--bb-color-blue-300);
665
+ --sky-color-border-action-tertiary-on_prominent-hover: var(--bb-color-blue-300);
448
666
  --sky-color-border-column_divider: var(--bb-color-blue-600);
449
667
  --sky-color-border-container-base: var(--bb-color-gray-200);
668
+ --sky-color-border-container-header-prominent: var(--bb-color-slate-500);
450
669
  --sky-color-border-danger: var(--bb-color-red-600);
451
670
  --sky-color-border-disabled: var(--bb-color-gray-300);
452
671
  --sky-color-border-divider: var(--bb-color-gray-300);
@@ -512,6 +731,10 @@
512
731
  --sky-color-icon-info: var(--bb-color-blue-600);
513
732
  --sky-color-icon-input-action: var(--bb-color-gray-600);
514
733
  --sky-color-icon-inverse: var(--bb-color-white);
734
+ --sky-color-icon-on_prominent-base: var(--bb-color-white);
735
+ --sky-color-icon-on_prominent-disabled: var(--bb-color-gray-600);
736
+ --sky-color-icon-on_status: var(--bb-color-white);
737
+ --sky-color-icon-on_status_bg: var(--bb-color-gray-1000);
515
738
  --sky-color-icon-selected: var(--bb-color-blue-600);
516
739
  --sky-color-icon-success: var(--bb-color-green-600);
517
740
  --sky-color-icon-warning: var(--bb-color-yellow-400);
@@ -521,11 +744,14 @@
521
744
  --sky-color-illustration-stroke: var(--bb-color-brand-trusted_blue);
522
745
  --sky-color-text-action: var(--bb-color-blue-600);
523
746
  --sky-color-text-action_contrast: var(--bb-color-blue-700);
747
+ --sky-color-text-action_on_status: var(--bb-color-gray-1000);
524
748
  --sky-color-text-danger: var(--bb-color-red-600);
525
749
  --sky-color-text-deemphasized: var(--bb-color-gray-600);
526
750
  --sky-color-text-default: var(--bb-color-gray-1000);
527
751
  --sky-color-text-heading: var(--bb-color-gray-1100);
528
752
  --sky-color-text-inverse: var(--bb-color-white);
753
+ --sky-color-text-on_prominent: var(--bb-color-white);
754
+ --sky-color-text-on_status: var(--bb-color-gray-1000);
529
755
  --sky-color-text-selected: var(--bb-color-blue-600);
530
756
  --sky-color-viz-axis: var(--bb-color-gray-500);
531
757
  --sky-color-viz-category-1: var(--bb-color-teal-500);
@@ -568,6 +794,34 @@
568
794
  --sky-color-viz-sequence-7: var(--bb-color-teal-700);
569
795
  --sky-color-viz-sequence-8: var(--bb-color-teal-800);
570
796
  --sky-color-viz-sequence-9: var(--bb-color-teal-900);
797
+ --sky-image-logo-primary-src: var(--bb-image-logo-primary-src);
798
+ --sky-image-select_icon-base: var(--bb-image-select_icon-base-light-src);
799
+ --sky-image-select_icon-disabled: var(--bb-image-select_icon-disabled-base-light-src);
800
+ --sky-opacity-wait: var(--bb-opacity-600);
801
+ --sky-color-background-action-accent-disabled: var(--sky-color-background-disabled);
802
+ --sky-color-background-action-danger-disabled: var(--sky-color-background-disabled);
803
+ --sky-color-background-action-input-disabled: var(--sky-color-background-disabled);
804
+ --sky-color-background-action-primary-disabled: var(--sky-color-background-disabled);
805
+ --sky-color-background-action-secondary-disabled: var(--sky-color-background-disabled);
806
+ --sky-color-background-action-secondary-on_scrim-disabled: var(--sky-color-background-disabled);
807
+ --sky-color-background-action-tertiary-disabled: var(--sky-color-background-disabled);
808
+ --sky-color-background-input-disabled: var(--sky-color-background-disabled);
809
+ --sky-color-background-nav-disabled: var(--sky-color-background-disabled);
810
+ --sky-color-background-row-disabled: var(--sky-color-background-disabled);
811
+ --sky-color-background-selected-switch-disabled: var(--sky-color-background-disabled);
812
+ --sky-color-background-tab-disabled: var(--sky-color-background-disabled);
813
+ --sky-color-border-action-accent-disabled: var(--sky-color-border-disabled);
814
+ --sky-color-border-action-danger-disabled: var(--sky-color-border-disabled);
815
+ --sky-color-border-action-input-disabled: var(--sky-color-border-disabled);
816
+ --sky-color-border-action-on_status-disabled: var(--sky-color-border-disabled);
817
+ --sky-color-border-action-primary-disabled: var(--sky-color-border-disabled);
818
+ --sky-color-border-action-secondary-disabled: var(--sky-color-border-disabled);
819
+ --sky-color-border-action-tertiary-disabled: var(--sky-color-border-disabled);
820
+ --sky-color-border-input-disabled: var(--sky-color-border-disabled);
821
+ --sky-color-border-nav-disabled: var(--sky-color-border-disabled);
822
+ --sky-color-border-switch-disabled: var(--sky-color-border-disabled);
823
+ --sky-color-border-switch-selected-disabled: var(--sky-color-border-disabled);
824
+ --sky-color-border-tab-disabled: var(--sky-color-border-disabled);
571
825
  --sky-elevation-action-danger-active: var(--bb-shadow-gray-0);
572
826
  --sky-elevation-action-danger-base: var(--bb-shadow-gray-0);
573
827
  --sky-elevation-action-danger-disabled: var(--bb-shadow-gray-0);
@@ -598,36 +852,10 @@
598
852
  --sky-elevation-action-toolbar-disabled: var(--bb-shadow-gray-0);
599
853
  --sky-elevation-action-toolbar-focus: var(--bb-shadow-gray-0);
600
854
  --sky-elevation-action-toolbar-hover: var(--bb-shadow-gray-0);
855
+ --sky-elevation-focus: var(--bb-shadow-gray-200);
601
856
  --sky-elevation-input-base: var(--bb-shadow-gray-0);
602
857
  --sky-elevation-input-disabled: var(--bb-shadow-gray-0);
603
858
  --sky-elevation-none: var(--bb-shadow-gray-0);
604
- --sky-image-logo-primary-src: var(--bb-image-logo-primary-src);
605
- --sky-image-select_icon-base: var(--bb-image-select_icon-base-light-src);
606
- --sky-image-select_icon-disabled: var(--bb-image-select_icon-disabled-base-light-src);
607
- --sky-opacity-wait: var(--bb-opacity-600);
608
- --sky-color-background-action-accent-disabled: var(--sky-color-background-disabled);
609
- --sky-color-background-action-danger-disabled: var(--sky-color-background-disabled);
610
- --sky-color-background-action-input-disabled: var(--sky-color-background-disabled);
611
- --sky-color-background-action-primary-disabled: var(--sky-color-background-disabled);
612
- --sky-color-background-action-secondary-disabled: var(--sky-color-background-disabled);
613
- --sky-color-background-action-tertiary-disabled: var(--sky-color-background-disabled);
614
- --sky-color-background-input-disabled: var(--sky-color-background-disabled);
615
- --sky-color-background-nav-disabled: var(--sky-color-background-disabled);
616
- --sky-color-background-row-disabled: var(--sky-color-background-disabled);
617
- --sky-color-background-selected-switch-disabled: var(--sky-color-background-disabled);
618
- --sky-color-background-tab-disabled: var(--sky-color-background-disabled);
619
- --sky-color-border-action-accent-disabled: var(--sky-color-border-disabled);
620
- --sky-color-border-action-danger-disabled: var(--sky-color-border-disabled);
621
- --sky-color-border-action-input-disabled: var(--sky-color-border-disabled);
622
- --sky-color-border-action-primary-disabled: var(--sky-color-border-disabled);
623
- --sky-color-border-action-secondary-disabled: var(--sky-color-border-disabled);
624
- --sky-color-border-action-tertiary-disabled: var(--sky-color-border-disabled);
625
- --sky-color-border-input-disabled: var(--sky-color-border-disabled);
626
- --sky-color-border-nav-disabled: var(--sky-color-border-disabled);
627
- --sky-color-border-switch-disabled: var(--sky-color-border-disabled);
628
- --sky-color-border-switch-selected-disabled: var(--sky-color-border-disabled);
629
- --sky-color-border-tab-disabled: var(--sky-color-border-disabled);
630
- --sky-elevation-focus: var(--bb-shadow-gray-200);
631
859
  --sky-elevation-overflow: var(--bb-shadow-gray-200);
632
860
  --sky-elevation-overlay-100: var(--bb-shadow-gray-400);
633
861
  --sky-elevation-overlay-200: var(--bb-shadow-gray-800);
@@ -637,7 +865,13 @@
637
865
  --sky-elevation-raised-100: var(--bb-shadow-gray-100);
638
866
  }
639
867
 
868
+ :root:has(body.sky-theme-modern.sky-theme-brand-base.sky-theme-mode-light) {
869
+ --sky-color-scrollbar-thumb: var(--bb-color-scrollbar-base-light-thumb);
870
+ --sky-color-scrollbar-track: var(--bb-color-scrollbar-base-light-track);
871
+ }
872
+
640
873
  .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-dark {
874
+ --sky-brand-name: var(--bb-brand-name);
641
875
  --sky-color-background-action-accent-active: var(--bb-color-gray-600);
642
876
  --sky-color-background-action-accent-base: var(--bb-color-blue-900);
643
877
  --sky-color-background-action-accent-focus: var(--bb-color-gray-700);
@@ -658,17 +892,27 @@
658
892
  --sky-color-background-action-secondary-base: var(--bb-color-gray-800);
659
893
  --sky-color-background-action-secondary-focus: var(--bb-color-gray-700);
660
894
  --sky-color-background-action-secondary-hover: var(--bb-color-gray-700);
895
+ --sky-color-background-action-secondary-on_scrim-active: var(--bb-color-gray-600);
896
+ --sky-color-background-action-secondary-on_scrim-base: var(--bb-color-gray-800);
897
+ --sky-color-background-action-secondary-on_scrim-focus: var(--bb-color-gray-800);
898
+ --sky-color-background-action-secondary-on_scrim-hover: var(--bb-color-gray-700);
661
899
  --sky-color-background-action-tertiary-active: var(--bb-color-transparent);
662
900
  --sky-color-background-action-tertiary-base: var(--bb-color-transparent);
663
901
  --sky-color-background-action-tertiary-focus: var(--bb-color-transparent);
664
902
  --sky-color-background-action-tertiary-hover: var(--bb-color-transparent);
665
- --sky-color-background-blocking: var(--bb-color-rgba-black-70);
903
+ --sky-color-background-action-tertiary-on_prominent-active: var(--bb-color-slate-600);
904
+ --sky-color-background-action-tertiary-on_prominent-base: var(--bb-color-transparent);
905
+ --sky-color-background-action-tertiary-on_prominent-focus: var(--bb-color-transparent);
906
+ --sky-color-background-action-tertiary-on_prominent-hover: var(--bb-color-slate-700);
907
+ --sky-color-background-blocking: var(--bb-color-rgba-steel-fusion-1100-70);
666
908
  --sky-color-background-container-backdrop: var(--bb-color-gray-900);
667
909
  --sky-color-background-container-base: var(--bb-color-gray-1000);
668
910
  --sky-color-background-container-danger: var(--bb-color-red-800);
669
911
  --sky-color-background-container-dimmed: var(--bb-color-gray-1000);
912
+ --sky-color-background-container-header-prominent: var(--bb-color-slate-800);
670
913
  --sky-color-background-container-info: var(--bb-color-blue-800);
671
914
  --sky-color-background-container-menu: var(--bb-color-gray-900);
915
+ --sky-color-background-container-prominent: var(--bb-color-steel-gray-1125);
672
916
  --sky-color-background-container-success: var(--bb-color-green-900);
673
917
  --sky-color-background-container-tooltip: var(--bb-color-gray-25);
674
918
  --sky-color-background-container-warning: var(--bb-color-yellow-800);
@@ -690,12 +934,12 @@
690
934
  --sky-color-background-row-base: var(--bb-color-gray-1000);
691
935
  --sky-color-background-row-focus: var(--bb-color-gray-1000);
692
936
  --sky-color-background-row-hover: var(--bb-color-transparent);
693
- --sky-color-background-scrim: var(--bb-color-scrim);
937
+ --sky-color-background-scrim: var(--bb-color-scrim-heavy);
694
938
  --sky-color-background-selected-danger: var(--bb-color-red-900);
695
- --sky-color-background-selected-heavy: var(--bb-color-blue-600);
696
- --sky-color-background-selected-soft: var(--bb-color-blue-900);
939
+ --sky-color-background-selected-heavy: var(--bb-color-blue-dark-375);
940
+ --sky-color-background-selected-soft: var(--bb-color-rgba-blue-dark-600-20);
697
941
  --sky-color-background-selected-success: var(--bb-color-green-900);
698
- --sky-color-background-selected-switch-base: var(--bb-color-blue-600);
942
+ --sky-color-background-selected-switch-base: var(--bb-color-blue-dark-375);
699
943
  --sky-color-background-selected-warning: var(--bb-color-yellow-900);
700
944
  --sky-color-background-tab-active: var(--bb-color-transparent);
701
945
  --sky-color-background-tab-base: var(--bb-color-transparent);
@@ -703,10 +947,10 @@
703
947
  --sky-color-background-tab-hover: var(--bb-color-transparent);
704
948
  --sky-color-background-tab-selected: var(--bb-color-transparent);
705
949
  --sky-color-background-tab-wizard-disabled: var(--bb-color-transparent);
706
- --sky-color-background-text_highlight: var(--bb-color-yellow-800);
950
+ --sky-color-background-text_highlight: var(--bb-color-yellow-dark-700);
707
951
  --sky-color-background-thumb-base: var(--bb-color-white);
708
952
  --sky-color-background-thumb-disabled: var(--bb-color-gray-600);
709
- --sky-color-background-thumbnail_matte: var(--bb-color-white);
953
+ --sky-color-background-thumbnail_matte: var(--bb-color-rgba-steel-gray-100-7);
710
954
  --sky-color-border-action-accent-active: var(--bb-color-sky-500);
711
955
  --sky-color-border-action-accent-base: var(--bb-color-gray-700);
712
956
  --sky-color-border-action-accent-focus: var(--bb-color-sky-600);
@@ -719,20 +963,29 @@
719
963
  --sky-color-border-action-input-base: var(--bb-color-blue-400);
720
964
  --sky-color-border-action-input-focus: var(--bb-color-blue-600);
721
965
  --sky-color-border-action-input-hover: var(--bb-color-blue-600);
722
- --sky-color-border-action-primary-active: var(--bb-color-sky-500);
723
- --sky-color-border-action-primary-base: var(--bb-color-sky-600);
724
- --sky-color-border-action-primary-focus: var(--bb-color-sky-600);
725
- --sky-color-border-action-primary-hover: var(--bb-color-sky-600);
966
+ --sky-color-border-action-on_status-active: var(--bb-color-gray-1000);
967
+ --sky-color-border-action-on_status-base: var(--bb-color-transparent);
968
+ --sky-color-border-action-on_status-focus: var(--bb-color-gray-1000);
969
+ --sky-color-border-action-on_status-hover: var(--bb-color-gray-1000);
970
+ --sky-color-border-action-primary-active: var(--bb-color-blue-dark-100);
971
+ --sky-color-border-action-primary-base: var(--bb-color-blue-dark-375);
972
+ --sky-color-border-action-primary-focus: var(--bb-color-blue-dark-100);
973
+ --sky-color-border-action-primary-hover: var(--bb-color-blue-dark-100);
726
974
  --sky-color-border-action-secondary-active: var(--bb-color-sky-500);
727
975
  --sky-color-border-action-secondary-base: var(--bb-color-gray-700);
728
976
  --sky-color-border-action-secondary-focus: var(--bb-color-sky-600);
729
977
  --sky-color-border-action-secondary-hover: var(--bb-color-sky-600);
730
- --sky-color-border-action-tertiary-active: var(--bb-color-sky-500);
978
+ --sky-color-border-action-tertiary-active: var(--bb-color-blue-dark-375);
731
979
  --sky-color-border-action-tertiary-base: var(--bb-color-transparent);
732
- --sky-color-border-action-tertiary-focus: var(--bb-color-sky-600);
733
- --sky-color-border-action-tertiary-hover: var(--bb-color-sky-600);
734
- --sky-color-border-column_divider: var(--bb-color-blue-400);
980
+ --sky-color-border-action-tertiary-focus: var(--bb-color-blue-dark-375);
981
+ --sky-color-border-action-tertiary-hover: var(--bb-color-blue-dark-375);
982
+ --sky-color-border-action-tertiary-on_prominent-active: var(--bb-color-blue-300);
983
+ --sky-color-border-action-tertiary-on_prominent-base: var(--bb-color-transparent);
984
+ --sky-color-border-action-tertiary-on_prominent-focus: var(--bb-color-blue-300);
985
+ --sky-color-border-action-tertiary-on_prominent-hover: var(--bb-color-blue-300);
986
+ --sky-color-border-column_divider: var(--bb-color-blue-dark-400);
735
987
  --sky-color-border-container-base: var(--bb-color-blue-900);
988
+ --sky-color-border-container-header-prominent: var(--bb-color-slate-500);
736
989
  --sky-color-border-danger: var(--bb-color-red-400);
737
990
  --sky-color-border-disabled: var(--bb-color-gray-800);
738
991
  --sky-color-border-divider: var(--bb-color-gray-800);
@@ -740,7 +993,7 @@
740
993
  --sky-color-border-info: var(--bb-color-blue-400);
741
994
  --sky-color-border-input-active: var(--bb-color-blue-600);
742
995
  --sky-color-border-input-base: var(--bb-color-blue-200);
743
- --sky-color-border-input-error: var(--bb-color-red-600);
996
+ --sky-color-border-input-error: var(--bb-color-red-dark-600);
744
997
  --sky-color-border-input-focus: var(--bb-color-blue-600);
745
998
  --sky-color-border-input-hover: var(--bb-color-blue-600);
746
999
  --sky-color-border-nav-active: var(--bb-color-sky-500);
@@ -748,27 +1001,26 @@
748
1001
  --sky-color-border-nav-focus: var(--bb-color-sky-600);
749
1002
  --sky-color-border-nav-hover: var(--bb-color-sky-600);
750
1003
  --sky-color-border-progress_step: var(--bb-color-gray-600);
751
- --sky-color-border-selected: var(--bb-color-blue-400);
752
- --sky-color-border-selected_soft: var(--bb-color-blue-500);
753
- --sky-color-border-separator-dark: var(--bb-color-gray-800);
1004
+ --sky-color-border-selected: var(--bb-color-blue-dark-375);
1005
+ --sky-color-border-selected_soft: var(--bb-color-blue-dark-600);
754
1006
  --sky-color-border-separator-light: var(--bb-color-gray-700);
755
1007
  --sky-color-border-separator-row: var(--bb-color-gray-800);
756
1008
  --sky-color-border-success: var(--bb-color-green-400);
757
1009
  --sky-color-border-switch-active: var(--bb-color-blue-600);
758
1010
  --sky-color-border-switch-base: var(--bb-color-blue-500);
759
- --sky-color-border-switch-error: var(--bb-color-red-600);
1011
+ --sky-color-border-switch-error: var(--bb-color-red-dark-600);
760
1012
  --sky-color-border-switch-focus: var(--bb-color-blue-600);
761
1013
  --sky-color-border-switch-hover: var(--bb-color-blue-600);
762
- --sky-color-border-switch-selected-active: var(--bb-color-blue-900);
1014
+ --sky-color-border-switch-selected-active: var(--bb-color-blue-dark-100);
763
1015
  --sky-color-border-switch-selected-base: var(--bb-color-transparent);
764
- --sky-color-border-switch-selected-focus: var(--bb-color-blue-900);
765
- --sky-color-border-switch-selected-hover: var(--bb-color-blue-900);
1016
+ --sky-color-border-switch-selected-focus: var(--bb-color-blue-dark-100);
1017
+ --sky-color-border-switch-selected-hover: var(--bb-color-blue-dark-100);
766
1018
  --sky-color-border-tab-active: var(--bb-color-sky-500);
767
1019
  --sky-color-border-tab-base: var(--bb-color-transparent);
768
1020
  --sky-color-border-tab-focus: var(--bb-color-sky-600);
769
1021
  --sky-color-border-tab-hover: var(--bb-color-sky-600);
770
1022
  --sky-color-border-tab-wizard-disabled: var(--bb-color-transparent);
771
- --sky-color-border-text_highlight: var(--bb-color-yellow-600);
1023
+ --sky-color-border-text_highlight: var(--bb-color-yellow-dark-400);
772
1024
  --sky-color-border-warning: var(--bb-color-yellow-400);
773
1025
  --sky-color-category-blue: var(--bb-color-sky-900);
774
1026
  --sky-color-category-green: var(--bb-color-green-900);
@@ -799,30 +1051,37 @@
799
1051
  --sky-color-icon-info: var(--bb-color-blue-600);
800
1052
  --sky-color-icon-input-action: var(--bb-color-sky-600);
801
1053
  --sky-color-icon-inverse: var(--bb-color-gray-1100);
1054
+ --sky-color-icon-on_prominent-base: var(--bb-color-white);
1055
+ --sky-color-icon-on_prominent-disabled: var(--bb-color-gray-600);
1056
+ --sky-color-icon-on_status: var(--bb-color-white);
1057
+ --sky-color-icon-on_status_bg: var(--bb-color-gray-1000);
802
1058
  --sky-color-icon-selected: var(--bb-color-blue-600);
803
1059
  --sky-color-icon-success: var(--bb-color-green-700);
804
1060
  --sky-color-icon-warning: var(--bb-color-yellow-600);
805
- --sky-color-illustration-fill-heavy: var(--bb-color-green-700);
806
- --sky-color-illustration-fill-soft: var(--bb-color-green-900);
807
- --sky-color-illustration-fill-softest: var(--bb-color-gray-900);
808
- --sky-color-illustration-stroke: var(--bb-color-green-200);
1061
+ --sky-color-illustration-fill-heavy: var(--bb-color-teal-dark-600);
1062
+ --sky-color-illustration-fill-soft: var(--bb-color-teal-dark-800);
1063
+ --sky-color-illustration-fill-softest: var(--bb-color-steel-gray-1100);
1064
+ --sky-color-illustration-stroke: var(--bb-color-teal-dark-100);
809
1065
  --sky-color-text-action: var(--bb-color-sky-600);
810
- --sky-color-text-action_contrast: var(--bb-color-blue-300);
1066
+ --sky-color-text-action_contrast: var(--bb-color-blue-dark-200);
1067
+ --sky-color-text-action_on_status: var(--bb-color-gray-1000);
811
1068
  --sky-color-text-danger: var(--bb-color-red-400);
812
1069
  --sky-color-text-deemphasized: var(--bb-color-gray-300);
813
1070
  --sky-color-text-default: var(--bb-color-gray-25);
814
1071
  --sky-color-text-heading: var(--bb-color-gray-50);
815
1072
  --sky-color-text-inverse: var(--bb-color-gray-1100);
1073
+ --sky-color-text-on_prominent: var(--bb-color-white);
1074
+ --sky-color-text-on_status: var(--bb-color-gray-1000);
816
1075
  --sky-color-text-selected: var(--bb-color-blue-400);
817
1076
  --sky-color-viz-axis: var(--bb-color-gray-600);
818
- --sky-color-viz-category-1: var(--bb-color-teal-600);
819
- --sky-color-viz-category-2: var(--bb-color-purple-300);
820
- --sky-color-viz-category-3: var(--bb-color-blue-600);
821
- --sky-color-viz-category-4: var(--bb-color-sky-200);
822
- --sky-color-viz-category-5: var(--bb-color-orange-500);
823
- --sky-color-viz-category-6: var(--bb-color-red-300);
824
- --sky-color-viz-category-7: var(--bb-color-pink-500);
825
- --sky-color-viz-category-8: var(--bb-color-green-400);
1077
+ --sky-color-viz-category-1: var(--bb-color-teal-dark-600);
1078
+ --sky-color-viz-category-2: var(--bb-color-purple-dark-300);
1079
+ --sky-color-viz-category-3: var(--bb-color-blue-dark-600);
1080
+ --sky-color-viz-category-4: var(--bb-color-sky-dark-200);
1081
+ --sky-color-viz-category-5: var(--bb-color-orange-dark-500);
1082
+ --sky-color-viz-category-6: var(--bb-color-red-dark-300);
1083
+ --sky-color-viz-category-7: var(--bb-color-pink-dark-500);
1084
+ --sky-color-viz-category-8: var(--bb-color-green-dark-400);
826
1085
  --sky-color-viz-diverge-neg-1: var(--bb-color-red-1000);
827
1086
  --sky-color-viz-diverge-neg-10: var(--bb-color-red-100);
828
1087
  --sky-color-viz-diverge-neg-2: var(--bb-color-red-900);
@@ -855,7 +1114,7 @@
855
1114
  --sky-color-viz-sequence-7: var(--bb-color-teal-400);
856
1115
  --sky-color-viz-sequence-8: var(--bb-color-teal-300);
857
1116
  --sky-color-viz-sequence-9: var(--bb-color-teal-200);
858
- --sky-elevation-none: var(--bb-shadow-gray-0);
1117
+ --sky-image-logo-primary-src: var(--bb-image-logo-primary-white-src);
859
1118
  --sky-image-select_icon-base: var(--bb-image-select_icon-base-dark-src);
860
1119
  --sky-image-select_icon-disabled: var(--bb-image-select_icon-disabled-base-dark-src);
861
1120
  --sky-opacity-wait: var(--bb-opacity-600);
@@ -864,7 +1123,9 @@
864
1123
  --sky-color-background-action-input-disabled: var(--sky-color-background-disabled);
865
1124
  --sky-color-background-action-primary-disabled: var(--sky-color-background-disabled);
866
1125
  --sky-color-background-action-secondary-disabled: var(--sky-color-background-disabled);
1126
+ --sky-color-background-action-secondary-on_scrim-disabled: var(--sky-color-background-disabled);
867
1127
  --sky-color-background-action-tertiary-disabled: var(--sky-color-background-disabled);
1128
+ --sky-color-background-action-tertiary-on_prominent-disabled: var(--sky-color-background-disabled);
868
1129
  --sky-color-background-input-disabled: var(--sky-color-background-disabled);
869
1130
  --sky-color-background-nav-disabled: var(--sky-color-background-disabled);
870
1131
  --sky-color-background-row-disabled: var(--sky-color-background-disabled);
@@ -873,15 +1134,50 @@
873
1134
  --sky-color-border-action-accent-disabled: var(--sky-color-background-disabled);
874
1135
  --sky-color-border-action-danger-disabled: var(--sky-color-border-disabled);
875
1136
  --sky-color-border-action-input-disabled: var(--sky-color-border-disabled);
1137
+ --sky-color-border-action-on_status-disabled: var(--sky-color-border-disabled);
876
1138
  --sky-color-border-action-primary-disabled: var(--sky-color-border-disabled);
877
1139
  --sky-color-border-action-secondary-disabled: var(--sky-color-border-disabled);
878
1140
  --sky-color-border-action-tertiary-disabled: var(--sky-color-border-disabled);
1141
+ --sky-color-border-action-tertiary-on_prominent-disabled: var(--sky-color-border-disabled);
879
1142
  --sky-color-border-input-disabled: var(--sky-color-border-disabled);
880
1143
  --sky-color-border-nav-disabled: var(--sky-color-border-disabled);
881
1144
  --sky-color-border-switch-disabled: var(--sky-color-border-disabled);
882
1145
  --sky-color-border-switch-selected-disabled: var(--sky-color-border-disabled);
883
1146
  --sky-color-border-tab-disabled: var(--sky-color-border-disabled);
1147
+ --sky-elevation-action-danger-active: var(--bb-shadow-gray-0);
1148
+ --sky-elevation-action-danger-base: var(--bb-shadow-gray-0);
1149
+ --sky-elevation-action-danger-disabled: var(--bb-shadow-gray-0);
1150
+ --sky-elevation-action-danger-focus: var(--bb-shadow-gray-0);
1151
+ --sky-elevation-action-danger-hover: var(--bb-shadow-gray-0);
1152
+ --sky-elevation-action-input-active: var(--bb-shadow-gray-0);
1153
+ --sky-elevation-action-input-base: var(--bb-shadow-gray-0);
1154
+ --sky-elevation-action-input-disabled: var(--bb-shadow-gray-0);
1155
+ --sky-elevation-action-input-focus: var(--bb-shadow-gray-0);
1156
+ --sky-elevation-action-input-hover: var(--bb-shadow-gray-0);
1157
+ --sky-elevation-action-primary-active: var(--bb-shadow-gray-0);
1158
+ --sky-elevation-action-primary-base: var(--bb-shadow-gray-0);
1159
+ --sky-elevation-action-primary-disabled: var(--bb-shadow-gray-0);
1160
+ --sky-elevation-action-primary-focus: var(--bb-shadow-gray-0);
1161
+ --sky-elevation-action-primary-hover: var(--bb-shadow-gray-0);
1162
+ --sky-elevation-action-secondary-active: var(--bb-shadow-gray-0);
1163
+ --sky-elevation-action-secondary-base: var(--bb-shadow-gray-0);
1164
+ --sky-elevation-action-secondary-disabled: var(--bb-shadow-gray-0);
1165
+ --sky-elevation-action-secondary-focus: var(--bb-shadow-gray-0);
1166
+ --sky-elevation-action-secondary-hover: var(--bb-shadow-gray-0);
1167
+ --sky-elevation-action-tertiary-active: var(--bb-shadow-gray-0);
1168
+ --sky-elevation-action-tertiary-base: var(--bb-shadow-gray-0);
1169
+ --sky-elevation-action-tertiary-disabled: var(--bb-shadow-gray-0);
1170
+ --sky-elevation-action-tertiary-focus: var(--bb-shadow-gray-0);
1171
+ --sky-elevation-action-tertiary-hover: var(--bb-shadow-gray-0);
1172
+ --sky-elevation-action-toolbar-active: var(--bb-shadow-gray-0);
1173
+ --sky-elevation-action-toolbar-base: var(--bb-shadow-gray-0);
1174
+ --sky-elevation-action-toolbar-disabled: var(--bb-shadow-gray-0);
1175
+ --sky-elevation-action-toolbar-focus: var(--bb-shadow-gray-0);
1176
+ --sky-elevation-action-toolbar-hover: var(--bb-shadow-gray-0);
884
1177
  --sky-elevation-focus: var(--bb-shadow-gray-200);
1178
+ --sky-elevation-input-base: var(--bb-shadow-gray-0);
1179
+ --sky-elevation-input-disabled: var(--bb-shadow-gray-0);
1180
+ --sky-elevation-none: var(--bb-shadow-gray-0);
885
1181
  --sky-elevation-overflow: var(--bb-shadow-gray-200);
886
1182
  --sky-elevation-overlay-100: var(--bb-shadow-gray-400);
887
1183
  --sky-elevation-overlay-200: var(--bb-shadow-gray-800);
@@ -891,6 +1187,11 @@
891
1187
  --sky-elevation-raised-100: var(--bb-shadow-gray-100);
892
1188
  }
893
1189
 
1190
+ :root:has(body.sky-theme-modern.sky-theme-brand-base.sky-theme-mode-dark) {
1191
+ --sky-color-scrollbar-thumb: var(--bb-color-scrollbar-base-dark-thumb);
1192
+ --sky-color-scrollbar-track: var(--bb-color-scrollbar-base-dark-track);
1193
+ }
1194
+
894
1195
  .sky-theme-modern.sky-theme-brand-base {
895
1196
  --sky-font-style-deemphasized-style: italic;
896
1197
  --sky-font-style-deemphasized-weight: 400;
@@ -900,11 +1201,26 @@
900
1201
  --sky-font-style-hint-m-weight: 400;
901
1202
  --sky-font-style-hint-s-style: italic;
902
1203
  --sky-font-style-hint-s-weight: 400;
1204
+ --sky-font-text_decoration-action-tertiary-active: none;
1205
+ --sky-font-text_decoration-action-tertiary-base: none;
1206
+ --sky-font-text_decoration-action-tertiary-disabled: none;
1207
+ --sky-font-text_decoration-action-tertiary-focus: none;
1208
+ --sky-font-text_decoration-action-tertiary-hover: none;
1209
+ --sky-font-text_decoration-action-tertiary-on_status-active: underline;
1210
+ --sky-font-text_decoration-action-tertiary-on_status-base: underline;
1211
+ --sky-font-text_decoration-action-tertiary-on_status-disabled: none;
1212
+ --sky-font-text_decoration-action-tertiary-on_status-focus: underline;
1213
+ --sky-font-text_decoration-action-tertiary-on_status-hover: underline;
903
1214
  --sky-font-text_decoration-inline_link-active: underline;
904
1215
  --sky-font-text_decoration-inline_link-base: none;
905
1216
  --sky-font-text_decoration-inline_link-disabled: none;
906
1217
  --sky-font-text_decoration-inline_link-focus: none;
907
1218
  --sky-font-text_decoration-inline_link-hover: underline;
1219
+ --sky-font-text_decoration-standalone_link-active: none;
1220
+ --sky-font-text_decoration-standalone_link-base: none;
1221
+ --sky-font-text_decoration-standalone_link-disabled: none;
1222
+ --sky-font-text_decoration-standalone_link-focus: none;
1223
+ --sky-font-text_decoration-standalone_link-hover: none;
908
1224
  --sky-font-text_decoration-visible_link: underline;
909
1225
  --sky-space-gap-action_group-0: 0rem;
910
1226
  --sky-space-gap-form-0: 0rem;
@@ -921,6 +1237,7 @@
921
1237
  --sky-border-radius-thumb: var(--bb-border-radius-round);
922
1238
  --sky-border-radius-xs: var(--bb-border-radius-012);
923
1239
  --sky-border-style-accent: var(--bb-border-style-solid);
1240
+ --sky-border-style-container-overlay: var(--bb-border-style-none);
924
1241
  --sky-border-style-divider: var(--bb-border-style-solid);
925
1242
  --sky-border-style-elevation: var(--bb-border-style-solid);
926
1243
  --sky-border-style-separator-dark: var(--bb-border-style-solid);
@@ -1502,6 +1819,8 @@
1502
1819
  --sky-size-picker_btn: var(--bb-size-fluid-200);
1503
1820
  --sky-size-progress_step: var(--bb-size-fluid-75);
1504
1821
  --sky-size-switch: var(--bb-size-fluid-125);
1822
+ --sky-size-text_underline-offset: var(--bb-size-fluid-12);
1823
+ --sky-size-text_underline-thickness: var(--bb-size-fluid-6);
1505
1824
  --sky-size-thumbnail-l: var(--bb-size-fixed-600);
1506
1825
  --sky-size-width-modal-l: var(--bb-size-fixed-6000);
1507
1826
  --sky-size-width-modal-m: var(--bb-size-fixed-4000);
@@ -1625,11 +1944,26 @@
1625
1944
  --sky-type-input-val: var(--sky-font-style-body-s) var(--sky-font-size-input-val)/20 'var(--bb-font-blkb_sans-name)';
1626
1945
  }
1627
1946
 
1947
+ .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-dark {
1948
+ --sky-font-text_decoration-action-tertiary-active: underline;
1949
+ --sky-font-text_decoration-action-tertiary-base: underline;
1950
+ --sky-font-text_decoration-action-tertiary-focus: underline;
1951
+ --sky-font-text_decoration-action-tertiary-hover: underline;
1952
+ --sky-font-text_decoration-inline_link-base: underline;
1953
+ --sky-font-text_decoration-inline_link-focus: underline;
1954
+ --sky-border-style-container-overlay: var(--bb-border-style-solid);
1955
+ }
1956
+
1628
1957
  @property --bb-image-logo-primary-src {
1629
1958
  syntax: "<url>";
1630
1959
  inherits: true;
1631
1960
  initial-value: url("data:,");
1632
1961
  }
1962
+ @property --bb-image-logo-primary-white-src {
1963
+ syntax: "<url>";
1964
+ inherits: true;
1965
+ initial-value: url("data:,");
1966
+ }
1633
1967
  @property --bb-image-select_icon-base-dark-src {
1634
1968
  syntax: "<url>";
1635
1969
  inherits: true;
@@ -1678,6 +2012,7 @@
1678
2012
  --bb-border-radius-pill: 999rem;
1679
2013
  --bb-border-radius-round: 50%;
1680
2014
  --bb-border-style-dotted: dotted;
2015
+ --bb-border-style-none: none;
1681
2016
  --bb-border-style-solid: solid;
1682
2017
  --bb-brand-name: 'Blackbaud';
1683
2018
  --bb-color-black: #000000;
@@ -1697,6 +2032,17 @@
1697
2032
  --bb-color-blue-800: #1a4080;
1698
2033
  --bb-color-blue-850: #16366b;
1699
2034
  --bb-color-blue-900: #112b55;
2035
+ --bb-color-blue-dark-100: #ddf0ff;
2036
+ --bb-color-blue-dark-1000: #00112b;
2037
+ --bb-color-blue-dark-200: #b4dbff;
2038
+ --bb-color-blue-dark-300: #83c1ff;
2039
+ --bb-color-blue-dark-375: #79adf1;
2040
+ --bb-color-blue-dark-400: #59a6ff;
2041
+ --bb-color-blue-dark-500: #2885ef;
2042
+ --bb-color-blue-dark-600: #0066cd;
2043
+ --bb-color-blue-dark-700: #0049a1;
2044
+ --bb-color-blue-dark-800: #003275;
2045
+ --bb-color-blue-dark-900: #00204b;
1700
2046
  --bb-color-brand-impact_green: #0cd973;
1701
2047
  --bb-color-brand-trusted_blue: #004054;
1702
2048
  --bb-color-gray-100: #eeeeef;
@@ -1729,6 +2075,17 @@
1729
2075
  --bb-color-green-700: #077e43;
1730
2076
  --bb-color-green-800: #055f33;
1731
2077
  --bb-color-green-900: #044525;
2078
+ --bb-color-green-dark-100: #daf7e3;
2079
+ --bb-color-green-dark-1000: #001905;
2080
+ --bb-color-green-dark-200: #aee8c1;
2081
+ --bb-color-green-dark-300: #72d699;
2082
+ --bb-color-green-dark-400: #35c177;
2083
+ --bb-color-green-dark-500: #00a452;
2084
+ --bb-color-green-dark-600: #008435;
2085
+ --bb-color-green-dark-700: #00641f;
2086
+ --bb-color-green-dark-800: #004712;
2087
+ --bb-color-green-dark-900: #002d0c;
2088
+ --bb-color-oklch-blue-375: #79adf1;
1732
2089
  --bb-color-orange-100: #feede0;
1733
2090
  --bb-color-orange-1000: #451d00;
1734
2091
  --bb-color-orange-1100: #311400;
@@ -1743,6 +2100,16 @@
1743
2100
  --bb-color-orange-700: #a74500;
1744
2101
  --bb-color-orange-800: #7f3500;
1745
2102
  --bb-color-orange-900: #622900;
2103
+ --bb-color-orange-dark-100: #ffe9df;
2104
+ --bb-color-orange-dark-1000: #200b03;
2105
+ --bb-color-orange-dark-200: #fbccb6;
2106
+ --bb-color-orange-dark-300: #f3aa88;
2107
+ --bb-color-orange-dark-400: #e5895d;
2108
+ --bb-color-orange-dark-500: #ca6633;
2109
+ --bb-color-orange-dark-600: #a74500;
2110
+ --bb-color-orange-dark-700: #822f00;
2111
+ --bb-color-orange-dark-800: #5c2000;
2112
+ --bb-color-orange-dark-900: #3a1503;
1746
2113
  --bb-color-pink-100: #fdecfd;
1747
2114
  --bb-color-pink-1000: #3f193d;
1748
2115
  --bb-color-pink-1100: #30132f;
@@ -1757,6 +2124,16 @@
1757
2124
  --bb-color-pink-700: #a542a0;
1758
2125
  --bb-color-pink-800: #853581;
1759
2126
  --bb-color-pink-900: #5c2559;
2127
+ --bb-color-pink-dark-100: #fbe8f9;
2128
+ --bb-color-pink-dark-1000: #1b0a1b;
2129
+ --bb-color-pink-dark-200: #f0c9ec;
2130
+ --bb-color-pink-dark-300: #e3a6de;
2131
+ --bb-color-pink-dark-400: #d285cd;
2132
+ --bb-color-pink-dark-500: #b562b1;
2133
+ --bb-color-pink-dark-600: #923f8f;
2134
+ --bb-color-pink-dark-700: #722c70;
2135
+ --bb-color-pink-dark-800: #501d4f;
2136
+ --bb-color-pink-dark-900: #331431;
1760
2137
  --bb-color-purple-100: #f2e6fd;
1761
2138
  --bb-color-purple-1000: #351d49;
1762
2139
  --bb-color-purple-1100: #271535;
@@ -1771,6 +2148,16 @@
1771
2148
  --bb-color-purple-700: #8d4ec2;
1772
2149
  --bb-color-purple-800: #6d3c96;
1773
2150
  --bb-color-purple-900: #4d2b6a;
2151
+ --bb-color-purple-dark-100: #f4e9ff;
2152
+ --bb-color-purple-dark-1000: #170b23;
2153
+ --bb-color-purple-dark-200: #e3ccff;
2154
+ --bb-color-purple-dark-300: #d0aafb;
2155
+ --bb-color-purple-dark-400: #bc89f1;
2156
+ --bb-color-purple-dark-500: #9f65d7;
2157
+ --bb-color-purple-dark-600: #7a3daf;
2158
+ --bb-color-purple-dark-700: #622e8f;
2159
+ --bb-color-purple-dark-800: #441f65;
2160
+ --bb-color-purple-dark-900: #2b153f;
1774
2161
  --bb-color-red-100: #fae7e8;
1775
2162
  --bb-color-red-1000: #4a1415;
1776
2163
  --bb-color-red-1100: #380f10;
@@ -1785,11 +2172,40 @@
1785
2172
  --bb-color-red-700: #ae2e31;
1786
2173
  --bb-color-red-800: #822325;
1787
2174
  --bb-color-red-900: #641b1c;
2175
+ --bb-color-red-dark-100: #fdecea;
2176
+ --bb-color-red-dark-1000: #27090a;
2177
+ --bb-color-red-dark-200: #facac8;
2178
+ --bb-color-red-dark-300: #f59a98;
2179
+ --bb-color-red-dark-400: #e96063;
2180
+ --bb-color-red-dark-500: #d93a3d;
2181
+ --bb-color-red-dark-600: #b52f32;
2182
+ --bb-color-red-dark-700: #912528;
2183
+ --bb-color-red-dark-800: #6d1b1d;
2184
+ --bb-color-red-dark-900: #4a1213;
1788
2185
  --bb-color-rgba-black-70: rgba(0, 0, 0, 0.7);
2186
+ --bb-color-rgba-blue-600-25: rgba(43, 107, 213, 0.25);
2187
+ --bb-color-rgba-blue-600-35: rgba(43, 107, 213, 0.35);
2188
+ --bb-color-rgba-blue-600-50: rgba(43, 107, 213, 0.5);
2189
+ --bb-color-rgba-blue-dark-600-20: rgba(0, 102, 205, 0.2);
2190
+ --bb-color-rgba-green-600-35: rgba(9, 156, 83, 0.35);
2191
+ --bb-color-rgba-green-600-50: rgba(9, 156, 83, 0.5);
1789
2192
  --bb-color-rgba-purple-600-40: rgba(176, 97, 242, 0.4);
2193
+ --bb-color-rgba-red-dark-600-35: rgba(181, 47, 50, 0.35);
2194
+ --bb-color-rgba-red-dark-600-50: rgba(181, 47, 50, 0.5);
1790
2195
  --bb-color-rgba-sky-600-40: rgba(0, 207, 255, 0.4);
2196
+ --bb-color-rgba-steel-fusion-100-5: rgba(243, 246, 249, 0.05);
2197
+ --bb-color-rgba-steel-fusion-1100-70: rgba(28, 34, 40, 0.7);
2198
+ --bb-color-rgba-steel-gray-100-10: rgba(245, 246, 247, 0.1);
2199
+ --bb-color-rgba-steel-gray-100-15: rgba(245, 246, 247, 0.15);
2200
+ --bb-color-rgba-steel-gray-100-25: rgba(245, 246, 247, 0.25);
2201
+ --bb-color-rgba-steel-gray-100-7: rgba(245, 246, 247, 0.07);
2202
+ --bb-color-rgba-white-18: rgba(255, 255, 255, 0.18);
2203
+ --bb-color-rgba-white-5: rgba(255, 255, 255, 0.05);
1791
2204
  --bb-color-rgba-white-70: rgba(255, 255, 255, 0.7);
1792
- --bb-color-scrim: rgba(37, 43, 51, 0.5);
2205
+ --bb-color-rgba-yellow-dark-600-25: rgba(162, 81, 0, 0.25);
2206
+ --bb-color-rgba-yellow-dark-600-35: rgba(162, 81, 0, 0.35);
2207
+ --bb-color-scrim-heavy: rgba(0, 0, 0, 0.6);
2208
+ --bb-color-scrim-soft: rgba(37, 43, 51, 0.5);
1793
2209
  --bb-color-sky-100: #d6f7ff;
1794
2210
  --bb-color-sky-1000: #002933;
1795
2211
  --bb-color-sky-1100: #002129;
@@ -1804,6 +2220,16 @@
1804
2220
  --bb-color-sky-700: #007894;
1805
2221
  --bb-color-sky-800: #005b70;
1806
2222
  --bb-color-sky-900: #004252;
2223
+ --bb-color-sky-dark-100: #e3f1f7;
2224
+ --bb-color-sky-dark-1000: #051419;
2225
+ --bb-color-sky-dark-200: #bfdde9;
2226
+ --bb-color-sky-dark-300: #96c6d9;
2227
+ --bb-color-sky-dark-400: #6fafc7;
2228
+ --bb-color-sky-dark-500: #4791ab;
2229
+ --bb-color-sky-dark-600: #005f78;
2230
+ --bb-color-sky-dark-700: #0c556b;
2231
+ --bb-color-sky-dark-800: #083b4b;
2232
+ --bb-color-sky-dark-900: #09252f;
1807
2233
  --bb-color-slate-100: #f1f3f7;
1808
2234
  --bb-color-slate-1000: #1a2231;
1809
2235
  --bb-color-slate-1100: #141b26;
@@ -1820,6 +2246,46 @@
1820
2246
  --bb-color-slate-800: #32435e;
1821
2247
  --bb-color-slate-850: #2a384f;
1822
2248
  --bb-color-slate-900: #212c3f;
2249
+ --bb-color-steel-blue-dark-100: #617695;
2250
+ --bb-color-steel-blue-dark-1000: #06152e;
2251
+ --bb-color-steel-blue-dark-200: #566a88;
2252
+ --bb-color-steel-blue-dark-300: #4b5f7c;
2253
+ --bb-color-steel-blue-dark-400: #405371;
2254
+ --bb-color-steel-blue-dark-500: #354865;
2255
+ --bb-color-steel-blue-dark-600: #2b3e5a;
2256
+ --bb-color-steel-blue-dark-700: #21334e;
2257
+ --bb-color-steel-blue-dark-800: #172943;
2258
+ --bb-color-steel-blue-dark-900: #0e1f39;
2259
+ --bb-color-steel-fusion-100: #f3f6f9;
2260
+ --bb-color-steel-fusion-1000: #2a313c;
2261
+ --bb-color-steel-fusion-1050: #21282f;
2262
+ --bb-color-steel-fusion-1100: #1c2228;
2263
+ --bb-color-steel-fusion-1150: #181e25;
2264
+ --bb-color-steel-fusion-1200: #141a1f;
2265
+ --bb-color-steel-fusion-200: #e0e4e8;
2266
+ --bb-color-steel-fusion-300: #c8cdd3;
2267
+ --bb-color-steel-fusion-400: #b0b6bc;
2268
+ --bb-color-steel-fusion-500: #929ba4;
2269
+ --bb-color-steel-fusion-600: #757e88;
2270
+ --bb-color-steel-fusion-700: #5e6770;
2271
+ --bb-color-steel-fusion-800: #4a5259;
2272
+ --bb-color-steel-fusion-900: #363d44;
2273
+ --bb-color-steel-gray-100: #f5f6f7;
2274
+ --bb-color-steel-gray-1000: #2e3135;
2275
+ --bb-color-steel-gray-1050: #25272a;
2276
+ --bb-color-steel-gray-1075: #222427;
2277
+ --bb-color-steel-gray-1100: #1f2224;
2278
+ --bb-color-steel-gray-1125: #1e2022;
2279
+ --bb-color-steel-gray-1150: #1c1e20;
2280
+ --bb-color-steel-gray-1200: #17191b;
2281
+ --bb-color-steel-gray-200: #e2e4e5;
2282
+ --bb-color-steel-gray-300: #cbcdcf;
2283
+ --bb-color-steel-gray-400: #b3b5b8;
2284
+ --bb-color-steel-gray-500: #979a9d;
2285
+ --bb-color-steel-gray-600: #7a7d81;
2286
+ --bb-color-steel-gray-700: #636669;
2287
+ --bb-color-steel-gray-800: #4e5154;
2288
+ --bb-color-steel-gray-900: #3a3c3f;
1823
2289
  --bb-color-teal-100: #dcf6f5;
1824
2290
  --bb-color-teal-1000: #022a28;
1825
2291
  --bb-color-teal-1100: #011e1d;
@@ -1834,6 +2300,16 @@
1834
2300
  --bb-color-teal-700: #046e6b;
1835
2301
  --bb-color-teal-800: #035755;
1836
2302
  --bb-color-teal-900: #02413f;
2303
+ --bb-color-teal-dark-100: #e1f3f1;
2304
+ --bb-color-teal-dark-1000: #031514;
2305
+ --bb-color-teal-dark-200: #bce0dd;
2306
+ --bb-color-teal-dark-300: #8fcbc7;
2307
+ --bb-color-teal-dark-400: #63b5b0;
2308
+ --bb-color-teal-dark-500: #359793;
2309
+ --bb-color-teal-dark-600: #047e7a;
2310
+ --bb-color-teal-dark-700: #005b57;
2311
+ --bb-color-teal-dark-800: #003f3d;
2312
+ --bb-color-teal-dark-900: #022826;
1837
2313
  --bb-color-transparent: rgba(0, 0, 0, 0);
1838
2314
  --bb-color-white: #ffffff;
1839
2315
  --bb-color-yellow-100: #feefd6;
@@ -1850,6 +2326,16 @@
1850
2326
  --bb-color-yellow-700: #92661e;
1851
2327
  --bb-color-yellow-800: #6e4d17;
1852
2328
  --bb-color-yellow-900: #503811;
2329
+ --bb-color-yellow-dark-100: #fff8ec;
2330
+ --bb-color-yellow-dark-1000: #200c00;
2331
+ --bb-color-yellow-dark-200: #fef0d0;
2332
+ --bb-color-yellow-dark-300: #fde0a8;
2333
+ --bb-color-yellow-dark-400: #fbb034;
2334
+ --bb-color-yellow-dark-500: #c37000;
2335
+ --bb-color-yellow-dark-600: #a25100;
2336
+ --bb-color-yellow-dark-700: #7d3800;
2337
+ --bb-color-yellow-dark-800: #5a2500;
2338
+ --bb-color-yellow-dark-900: #391800;
1853
2339
  --bb-duration-150: 150ms;
1854
2340
  --bb-duration-250: 250ms;
1855
2341
  --bb-font-blkb_sans-fallback: Helvetica Neue, Arial, sans-serif;
@@ -1880,15 +2366,16 @@
1880
2366
  --bb-font-weight-light: 300;
1881
2367
  --bb-font-weight-regular: 400;
1882
2368
  --bb-font-weight-semibold: 600;
1883
- --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/bb-logo.png');
1884
- --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-base-dark.svg');
1885
- --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-base-light.svg');
1886
- --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-bb-dark.svg');
1887
- --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-bb-light.svg');
1888
- --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
1889
- --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
1890
- --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
1891
- --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/6.0.2/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
2369
+ --bb-image-logo-primary-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/bb-logo.png');
2370
+ --bb-image-logo-primary-white-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/bb-logo-white.png');
2371
+ --bb-image-select_icon-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-base-dark.svg');
2372
+ --bb-image-select_icon-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-base-light.svg');
2373
+ --bb-image-select_icon-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-bb-dark.svg');
2374
+ --bb-image-select_icon-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-bb-light.svg');
2375
+ --bb-image-select_icon-disabled-base-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-disabled-base-dark.svg');
2376
+ --bb-image-select_icon-disabled-base-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-disabled-base-light.svg');
2377
+ --bb-image-select_icon-disabled-bb-dark-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-disabled-bb-dark.svg');
2378
+ --bb-image-select_icon-disabled-bb-light-src: url('https://sky.blackbaudcdn.net/static/skyux-design-tokens/7.0.0-alpha.10/assets/images/chevron_up_down_20_fill-disabled-bb-light.svg');
1892
2379
  --bb-letter_spacing-normal: normal;
1893
2380
  --bb-letter_spacing-wider: 0.01rem;
1894
2381
  --bb-letter_spacing-widest: 0.046875rem;
@@ -1903,8 +2390,8 @@
1903
2390
  --bb-line_height-700: calc(32/24);
1904
2391
  --bb-line_height-800: calc(36/27);
1905
2392
  --bb-opacity-600: .6;
1906
- --bb-shadow-gray-0: 0 0 0 0 rgba(0, 0, 0, 0);
1907
2393
  --bb-shadow-slate-0: 0 0 0 0 rgba(0, 0, 0, 0);
2394
+ --bb-shadow-steel-fusion-0: 0 0 0 0 rgba(0, 0, 0, 0);
1908
2395
  --bb-size-0: 0rem;
1909
2396
  --bb-size-fixed-100: 16px;
1910
2397
  --bb-size-fixed-12: 2px;
@@ -1955,8 +2442,10 @@
1955
2442
  --bb-space-8: 24px;
1956
2443
  --bb-space-9: 36px;
1957
2444
  --bb-color-gradient-blue: linear-gradient( var(--bb-color-blue-500), var(--bb-color-blue-700));
1958
- --bb-color-gradient-brand-secondary: linear-gradient(90deg, var(--bb-color-rgba-sky-600-40), var(--bb-color-rgba-purple-600-40));
2445
+ --bb-color-gradient-brand-secondary: linear-gradient(90deg, var(--bb-color-rgba-sky-600-40) , var(--bb-color-rgba-purple-600-40));
2446
+ --bb-color-gradient-container-primary: linear-gradient(90deg, var(--bb-color-steel-fusion-700), var(--bb-color-steel-fusion-800));
1959
2447
  --bb-font-blkb_sans-family: var(--bb-font-blkb_sans-name), var(--bb-font-blkb_sans-fallback);
2448
+ --bb-shadow-gray-0: 0 0 0 0 rgba(22, 26, 31, 0);
1960
2449
  --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);
1961
2450
  --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);
1962
2451
  --bb-shadow-gray-200: 0 1px 8px 0 rgba(22, 26, 31, 0.2), 0 3px 3px -2px rgba(22, 26, 31, 0.12), 0 3px 4px 0 rgba(22, 26, 31, 0.14);
@@ -1966,6 +2455,16 @@
1966
2455
  --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);
1967
2456
  --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);
1968
2457
  --bb-shadow-gray-simple-400: 1px 2px 4px 0 rgba(22, 26, 31, 0.5);
2458
+ --bb-shadow-heavy-black-0: 0 0 0 0 rgba(0, 0, 0, 0);
2459
+ --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);
2460
+ --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);
2461
+ --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);
2462
+ --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);
2463
+ --bb-shadow-heavy-black-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
2464
+ --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);
2465
+ --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);
2466
+ --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);
2467
+ --bb-shadow-heavy-black-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
1969
2468
  --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);
1970
2469
  --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);
1971
2470
  --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);
@@ -1975,9 +2474,37 @@
1975
2474
  --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);
1976
2475
  --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);
1977
2476
  --bb-shadow-slate-simple-400: 1px 2px 4px 0 rgba(33, 44, 63, 0.5);
2477
+ --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);
2478
+ --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);
2479
+ --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);
2480
+ --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);
2481
+ --bb-shadow-steel-fusion-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
2482
+ --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);
2483
+ --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);
2484
+ --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);
2485
+ --bb-shadow-steel-fusion-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
2486
+ --bb-shadow-steel-gray-0: 0 0 0 0 rgba(33, 44, 63, 0);
2487
+ --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);
2488
+ --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);
2489
+ --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);
2490
+ --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);
2491
+ --bb-shadow-steel-gray-25: 0 1px 1px 0 rgba(0, 0, 0, 0.35);
2492
+ --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);
2493
+ --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);
2494
+ --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);
2495
+ --bb-shadow-steel-gray-simple-400: 1px 2px 4px 0 rgba(0, 0, 0, 0.65);
1978
2496
  }
1979
2497
 
1980
- .sky-theme-modern.sky-theme-brand-base.sky-theme-brand-blackbaud {
2498
+ :root:has(body.sky-theme-modern.sky-theme-brand-base.sky-theme-brand-blackbaud) {
2499
+ --bb-color-scrollbar-base-dark-thumb: #51555c;
2500
+ --bb-color-scrollbar-base-dark-track: #1e2229;
2501
+ --bb-color-scrollbar-base-light-thumb: #85888d;
2502
+ --bb-color-scrollbar-base-light-track: #ffffff;
2503
+ --bb-color-scrollbar-bb-dark-thumb: #51555c;
2504
+ --bb-color-scrollbar-bb-dark-track: #1c2228;
2505
+ }
2506
+
2507
+ .sky-theme-modern.sky-theme-brand-base.sky-theme-brand-blackbaud.sky-theme-mode-light {
1981
2508
  --sky-brand-name: var(--bb-brand-name);
1982
2509
  --sky-color-background-action-accent-base: var(--bb-color-blue-25);
1983
2510
  --sky-color-background-container-backdrop: var(--bb-color-slate-200);
@@ -1985,7 +2512,7 @@
1985
2512
  --sky-color-background-file_drop: var(--bb-color-slate-25);
1986
2513
  --sky-color-background-input-base: var(--bb-color-slate-25);
1987
2514
  --sky-color-background-page: var(--bb-color-slate-100);
1988
- --sky-color-background-scrim: var(--bb-color-scrim);
2515
+ --sky-color-background-scrim: var(--bb-color-scrim-soft);
1989
2516
  --sky-color-border-action-input-base: var(--bb-color-slate-250);
1990
2517
  --sky-color-border-action-secondary-base: var(--bb-color-slate-300);
1991
2518
  --sky-color-border-container-base: var(--bb-color-slate-250);
@@ -2051,188 +2578,233 @@
2051
2578
  }
2052
2579
 
2053
2580
  .sky-theme-modern.sky-theme-brand-base.sky-theme-brand-blackbaud.sky-theme-mode-dark {
2054
- --sky-color-background-action-accent-active: var(--bb-color-gray-600);
2055
- --sky-color-background-action-accent-base: var(--bb-color-blue-900);
2056
- --sky-color-background-action-accent-focus: var(--bb-color-gray-700);
2057
- --sky-color-background-action-accent-hover: var(--bb-color-gray-700);
2058
- --sky-color-background-action-danger-active: var(--bb-color-red-600);
2059
- --sky-color-background-action-danger-base: var(--bb-color-red-600);
2060
- --sky-color-background-action-danger-disabled: var(--bb-color-gray-700);
2061
- --sky-color-background-action-danger-focus: var(--bb-color-red-600);
2062
- --sky-color-background-action-danger-hover: var(--bb-color-red-600);
2581
+ --sky-color-background-action-accent-active: var(--bb-color-steel-gray-1000);
2582
+ --sky-color-background-action-accent-base: var(--bb-color-steel-gray-1100);
2583
+ --sky-color-background-action-accent-focus: var(--bb-color-steel-gray-1000);
2584
+ --sky-color-background-action-accent-hover: var(--bb-color-steel-gray-1000);
2585
+ --sky-color-background-action-danger-active: var(--bb-color-red-dark-300);
2586
+ --sky-color-background-action-danger-base: var(--bb-color-red-dark-400);
2587
+ --sky-color-background-action-danger-focus: var(--bb-color-red-dark-300);
2588
+ --sky-color-background-action-danger-hover: var(--bb-color-red-dark-300);
2063
2589
  --sky-color-background-action-input-active: var(--bb-color-transparent);
2064
- --sky-color-background-action-input-base: var(--bb-color-blue-900);
2065
- --sky-color-background-action-input-disabled: var(--bb-color-gray-700);
2590
+ --sky-color-background-action-input-base: var(--bb-color-transparent);
2066
2591
  --sky-color-background-action-input-focus: var(--bb-color-transparent);
2067
2592
  --sky-color-background-action-input-hover: var(--bb-color-transparent);
2068
- --sky-color-background-action-primary-active: var(--bb-color-sky-500);
2069
- --sky-color-background-action-primary-base: var(--bb-color-sky-600);
2070
- --sky-color-background-action-primary-disabled: var(--bb-color-gray-700);
2071
- --sky-color-background-action-primary-focus: var(--bb-color-sky-600);
2072
- --sky-color-background-action-primary-hover: var(--bb-color-sky-600);
2073
- --sky-color-background-action-secondary-active: var(--bb-color-gray-600);
2074
- --sky-color-background-action-secondary-base: var(--bb-color-gray-800);
2075
- --sky-color-background-action-secondary-disabled: var(--bb-color-gray-700);
2076
- --sky-color-background-action-secondary-focus: var(--bb-color-gray-700);
2077
- --sky-color-background-action-secondary-hover: var(--bb-color-gray-700);
2593
+ --sky-color-background-action-primary-active: var(--bb-color-blue-dark-400);
2594
+ --sky-color-background-action-primary-base: var(--bb-color-blue-dark-375);
2595
+ --sky-color-background-action-primary-focus: var(--bb-color-blue-dark-400);
2596
+ --sky-color-background-action-primary-hover: var(--bb-color-blue-dark-300);
2597
+ --sky-color-background-action-secondary-active: var(--bb-color-transparent);
2598
+ --sky-color-background-action-secondary-base: var(--bb-color-rgba-steel-gray-100-7);
2599
+ --sky-color-background-action-secondary-focus: var(--bb-color-transparent);
2600
+ --sky-color-background-action-secondary-hover: var(--bb-color-rgba-steel-gray-100-10);
2601
+ --sky-color-background-action-secondary-on_scrim-active: var(--bb-color-steel-gray-800);
2602
+ --sky-color-background-action-secondary-on_scrim-base: var(--bb-color-steel-gray-1000);
2603
+ --sky-color-background-action-secondary-on_scrim-focus: var(--bb-color-steel-gray-1000);
2604
+ --sky-color-background-action-secondary-on_scrim-hover: var(--bb-color-steel-gray-900);
2078
2605
  --sky-color-background-action-tertiary-active: var(--bb-color-transparent);
2079
2606
  --sky-color-background-action-tertiary-base: var(--bb-color-transparent);
2080
- --sky-color-background-action-tertiary-disabled: var(--bb-color-gray-700);
2081
2607
  --sky-color-background-action-tertiary-focus: var(--bb-color-transparent);
2082
2608
  --sky-color-background-action-tertiary-hover: var(--bb-color-transparent);
2083
- --sky-color-background-blocking: var(--bb-color-rgba-black-70);
2084
- --sky-color-background-container-base: var(--bb-color-gray-1000);
2085
- --sky-color-background-container-danger: var(--bb-color-red-800);
2086
- --sky-color-background-container-dimmed: var(--bb-color-gray-1000);
2087
- --sky-color-background-container-info: var(--bb-color-blue-800);
2088
- --sky-color-background-container-menu: var(--bb-color-gray-900);
2089
- --sky-color-background-container-success: var(--bb-color-green-900);
2090
- --sky-color-background-container-warning: var(--bb-color-yellow-800);
2609
+ --sky-color-background-action-tertiary-on_prominent-active: var(--bb-color-slate-600);
2610
+ --sky-color-background-action-tertiary-on_prominent-base: var(--bb-color-transparent);
2611
+ --sky-color-background-action-tertiary-on_prominent-focus: var(--bb-color-transparent);
2612
+ --sky-color-background-action-tertiary-on_prominent-hover: var(--bb-color-slate-700);
2613
+ --sky-color-background-blocking: var(--bb-color-rgba-steel-fusion-1100-70);
2614
+ --sky-color-background-container-backdrop: var(--bb-color-steel-gray-1000);
2615
+ --sky-color-background-container-base: var(--bb-color-steel-gray-1050);
2616
+ --sky-color-background-container-danger: var(--bb-color-red-dark-400);
2617
+ --sky-color-background-container-dimmed: var(--bb-color-steel-gray-1100);
2618
+ --sky-color-background-container-header-prominent: var(--bb-color-slate-800);
2619
+ --sky-color-background-container-info: var(--bb-color-blue-dark-400);
2620
+ --sky-color-background-container-menu: var(--bb-color-steel-gray-900);
2621
+ --sky-color-background-container-prominent: var(--bb-color-steel-gray-1125);
2622
+ --sky-color-background-container-success: var(--bb-color-green-dark-400);
2623
+ --sky-color-background-container-warning: var(--bb-color-yellow-dark-400);
2091
2624
  --sky-color-background-disabled: var(--bb-color-gray-700);
2092
2625
  --sky-color-background-file_drop: var(--bb-color-gray-1000);
2093
- --sky-color-background-icon_matte-action-heavy: var(--bb-color-blue-600);
2094
- --sky-color-background-icon_matte-action-soft: var(--bb-color-blue-900);
2095
- --sky-color-background-icon_matte-danger: var(--bb-color-red-600);
2096
- --sky-color-background-icon_matte-info: var(--bb-color-blue-600);
2097
- --sky-color-background-icon_matte-success: var(--bb-color-green-700);
2098
- --sky-color-background-icon_matte-warning: var(--bb-color-yellow-600);
2099
- --sky-color-background-input-base: var(--bb-color-gray-900);
2100
- --sky-color-background-input-disabled: var(--bb-color-gray-700);
2626
+ --sky-color-background-icon_matte-action-heavy: var(--bb-color-blue-dark-400);
2627
+ --sky-color-background-icon_matte-action-soft: var(--bb-color-blue-dark-900);
2628
+ --sky-color-background-icon_matte-danger: var(--bb-color-red-dark-600);
2629
+ --sky-color-background-icon_matte-info: var(--bb-color-blue-dark-600);
2630
+ --sky-color-background-icon_matte-success: var(--bb-color-green-dark-700);
2631
+ --sky-color-background-icon_matte-warning: var(--bb-color-yellow-dark-600);
2632
+ --sky-color-background-input-base: var(--bb-color-steel-gray-1000);
2101
2633
  --sky-color-background-nav-active: var(--bb-color-transparent);
2102
2634
  --sky-color-background-nav-base: var(--bb-color-transparent);
2103
- --sky-color-background-nav-disabled: var(--bb-color-gray-700);
2104
2635
  --sky-color-background-nav-focus: var(--bb-color-transparent);
2105
2636
  --sky-color-background-nav-hover: var(--bb-color-transparent);
2106
- --sky-color-background-page: var(--bb-color-gray-1100);
2637
+ --sky-color-background-page: var(--bb-color-steel-gray-1200);
2107
2638
  --sky-color-background-row-active: var(--bb-color-transparent);
2108
- --sky-color-background-row-base: var(--bb-color-gray-1000);
2109
- --sky-color-background-row-disabled: var(--bb-color-gray-700);
2639
+ --sky-color-background-row-base: var(--bb-color-steel-gray-1050);
2110
2640
  --sky-color-background-row-focus: var(--bb-color-transparent);
2111
2641
  --sky-color-background-row-hover: var(--bb-color-transparent);
2112
- --sky-color-background-scrim: var(--bb-color-scrim);
2113
- --sky-color-background-selected-danger: var(--bb-color-red-900);
2114
- --sky-color-background-selected-heavy: var(--bb-color-blue-600);
2115
- --sky-color-background-selected-soft: var(--bb-color-blue-900);
2116
- --sky-color-background-selected-success: var(--bb-color-green-900);
2117
- --sky-color-background-selected-switch-base: var(--bb-color-blue-600);
2118
- --sky-color-background-selected-switch-disabled: var(--bb-color-gray-700);
2119
- --sky-color-background-selected-warning: var(--bb-color-yellow-900);
2642
+ --sky-color-background-scrim: var(--bb-color-scrim-heavy);
2643
+ --sky-color-background-selected-danger: var(--bb-color-red-dark-900);
2644
+ --sky-color-background-selected-heavy: var(--bb-color-blue-dark-375);
2645
+ --sky-color-background-selected-soft: var(--bb-color-steel-blue-dark-700);
2646
+ --sky-color-background-selected-success: var(--bb-color-green-dark-900);
2647
+ --sky-color-background-selected-switch-base: var(--bb-color-blue-dark-375);
2648
+ --sky-color-background-selected-warning: var(--bb-color-yellow-dark-900);
2120
2649
  --sky-color-background-tab-active: var(--bb-color-transparent);
2121
2650
  --sky-color-background-tab-base: var(--bb-color-transparent);
2122
- --sky-color-background-tab-disabled: var(--bb-color-gray-700);
2123
2651
  --sky-color-background-tab-focus: var(--bb-color-transparent);
2124
2652
  --sky-color-background-tab-hover: var(--bb-color-transparent);
2125
2653
  --sky-color-background-tab-selected: var(--bb-color-transparent);
2126
2654
  --sky-color-background-tab-wizard-disabled: var(--bb-color-transparent);
2127
- --sky-color-background-text_highlight: var(--bb-color-yellow-800);
2655
+ --sky-color-background-text_highlight: var(--bb-color-yellow-dark-700);
2128
2656
  --sky-color-background-thumb-base: var(--bb-color-white);
2129
- --sky-color-background-thumb-disabled: var(--bb-color-gray-600);
2130
- --sky-color-background-thumbnail_matte: var(--bb-color-white);
2131
- --sky-color-border-action-danger-active: var(--bb-color-red-200);
2132
- --sky-color-border-action-danger-base: var(--bb-color-red-600);
2133
- --sky-color-border-action-danger-disabled: var(--bb-color-gray-800);
2134
- --sky-color-border-action-danger-focus: var(--bb-color-red-200);
2135
- --sky-color-border-action-danger-hover: var(--bb-color-red-200);
2136
- --sky-color-border-action-input-active: var(--bb-color-blue-600);
2137
- --sky-color-border-action-input-base: var(--bb-color-blue-400);
2138
- --sky-color-border-action-input-disabled: var(--bb-color-gray-800);
2139
- --sky-color-border-action-input-focus: var(--bb-color-blue-600);
2140
- --sky-color-border-action-input-hover: var(--bb-color-blue-600);
2141
- --sky-color-border-action-primary-active: var(--bb-color-sky-500);
2142
- --sky-color-border-action-primary-base: var(--bb-color-sky-600);
2143
- --sky-color-border-action-primary-disabled: var(--bb-color-gray-800);
2144
- --sky-color-border-action-primary-focus: var(--bb-color-sky-600);
2145
- --sky-color-border-action-primary-hover: var(--bb-color-sky-600);
2146
- --sky-color-border-action-secondary-active: var(--bb-color-sky-500);
2147
- --sky-color-border-action-secondary-base: var(--bb-color-gray-700);
2148
- --sky-color-border-action-secondary-disabled: var(--bb-color-gray-800);
2149
- --sky-color-border-action-secondary-focus: var(--bb-color-sky-600);
2150
- --sky-color-border-action-secondary-hover: var(--bb-color-sky-600);
2151
- --sky-color-border-action-tertiary-active: var(--bb-color-sky-500);
2657
+ --sky-color-background-thumb-disabled: var(--bb-color-gray-400);
2658
+ --sky-color-background-thumbnail_matte: var(--bb-color-rgba-steel-gray-100-7);
2659
+ --sky-color-border-action-accent-hover: var(--bb-color-blue-dark-400);
2660
+ --sky-color-border-action-danger-active: var(--bb-color-red-dark-300);
2661
+ --sky-color-border-action-danger-base: var(--bb-color-red-dark-400);
2662
+ --sky-color-border-action-danger-focus: var(--bb-color-red-dark-300);
2663
+ --sky-color-border-action-danger-hover: var(--bb-color-red-dark-300);
2664
+ --sky-color-border-action-input-active: var(--bb-color-blue-dark-400);
2665
+ --sky-color-border-action-input-base: var(--bb-color-steel-gray-800);
2666
+ --sky-color-border-action-input-disabled: var(--bb-color-steel-gray-500);
2667
+ --sky-color-border-action-input-focus: var(--bb-color-blue-dark-400);
2668
+ --sky-color-border-action-input-hover: var(--bb-color-blue-dark-400);
2669
+ --sky-color-border-action-primary-active: var(--bb-color-blue-dark-100);
2670
+ --sky-color-border-action-primary-base: var(--bb-color-blue-dark-375);
2671
+ --sky-color-border-action-primary-focus: var(--bb-color-blue-dark-100);
2672
+ --sky-color-border-action-primary-hover: var(--bb-color-blue-dark-100);
2673
+ --sky-color-border-action-secondary-active: var(--bb-color-blue-dark-375);
2674
+ --sky-color-border-action-secondary-base: var(--bb-color-steel-gray-700);
2675
+ --sky-color-border-action-secondary-focus: var(--bb-color-blue-dark-375);
2676
+ --sky-color-border-action-secondary-hover: var(--bb-color-blue-dark-375);
2677
+ --sky-color-border-action-tertiary-active: var(--bb-color-blue-dark-375);
2152
2678
  --sky-color-border-action-tertiary-base: var(--bb-color-transparent);
2153
- --sky-color-border-action-tertiary-disabled: var(--bb-color-gray-800);
2154
- --sky-color-border-action-tertiary-focus: var(--bb-color-sky-600);
2155
- --sky-color-border-action-tertiary-hover: var(--bb-color-sky-600);
2156
- --sky-color-border-column_divider: var(--bb-color-blue-400);
2157
- --sky-color-border-container-base: var(--bb-color-blue-900);
2158
- --sky-color-border-danger: var(--bb-color-red-400);
2159
- --sky-color-border-disabled: var(--bb-color-gray-800);
2160
- --sky-color-border-divider: var(--bb-color-gray-800);
2161
- --sky-color-border-elevation: var(--bb-color-gray-800);
2162
- --sky-color-border-info: var(--bb-color-blue-400);
2163
- --sky-color-border-input-active: var(--bb-color-blue-600);
2164
- --sky-color-border-input-base: var(--bb-color-blue-200);
2165
- --sky-color-border-input-disabled: var(--bb-color-gray-400);
2166
- --sky-color-border-input-error: var(--bb-color-red-600);
2167
- --sky-color-border-input-focus: var(--bb-color-blue-600);
2168
- --sky-color-border-input-hover: var(--bb-color-blue-600);
2169
- --sky-color-border-nav-active: var(--bb-color-sky-500);
2679
+ --sky-color-border-action-tertiary-focus: var(--bb-color-blue-dark-375);
2680
+ --sky-color-border-action-tertiary-hover: var(--bb-color-blue-dark-375);
2681
+ --sky-color-border-action-tertiary-on_prominent-active: var(--bb-color-blue-300);
2682
+ --sky-color-border-action-tertiary-on_prominent-base: var(--bb-color-transparent);
2683
+ --sky-color-border-action-tertiary-on_prominent-focus: var(--bb-color-blue-300);
2684
+ --sky-color-border-action-tertiary-on_prominent-hover: var(--bb-color-blue-300);
2685
+ --sky-color-border-column_divider: var(--bb-color-blue-dark-400);
2686
+ --sky-color-border-container-base: var(--bb-color-rgba-white-18);
2687
+ --sky-color-border-container-header-prominent: var(--bb-color-slate-500);
2688
+ --sky-color-border-danger: var(--bb-color-red-dark-700);
2689
+ --sky-color-border-disabled: var(--bb-color-steel-gray-700);
2690
+ --sky-color-border-divider: var(--bb-color-rgba-white-18);
2691
+ --sky-color-border-elevation: var(--bb-color-rgba-white-18);
2692
+ --sky-color-border-info: var(--bb-color-blue-dark-600);
2693
+ --sky-color-border-input-active: var(--bb-color-blue-dark-400);
2694
+ --sky-color-border-input-base: var(--bb-color-steel-gray-800);
2695
+ --sky-color-border-input-disabled: var(--bb-color-steel-gray-500);
2696
+ --sky-color-border-input-error: var(--bb-color-red-dark-600);
2697
+ --sky-color-border-input-focus: var(--bb-color-blue-dark-400);
2698
+ --sky-color-border-input-hover: var(--bb-color-blue-dark-400);
2699
+ --sky-color-border-nav-active: var(--bb-color-blue-dark-375);
2170
2700
  --sky-color-border-nav-base: var(--bb-color-transparent);
2171
- --sky-color-border-nav-disabled: var(--bb-color-gray-800);
2172
- --sky-color-border-nav-focus: var(--bb-color-sky-600);
2173
- --sky-color-border-nav-hover: var(--bb-color-sky-600);
2701
+ --sky-color-border-nav-disabled: var(--bb-color-steel-gray-500);
2702
+ --sky-color-border-nav-focus: var(--bb-color-blue-dark-375);
2703
+ --sky-color-border-nav-hover: var(--bb-color-blue-dark-375);
2174
2704
  --sky-color-border-progress_step: var(--bb-color-gray-600);
2175
- --sky-color-border-selected: var(--bb-color-blue-400);
2176
- --sky-color-border-selected_soft: var(--bb-color-blue-500);
2177
- --sky-color-border-separator-dark: var(--bb-color-gray-800);
2178
- --sky-color-border-separator-light: var(--bb-color-gray-700);
2179
- --sky-color-border-separator-row: var(--bb-color-gray-800);
2180
- --sky-color-border-success: var(--bb-color-green-400);
2181
- --sky-color-border-switch-active: var(--bb-color-blue-600);
2182
- --sky-color-border-switch-base: var(--bb-color-blue-500);
2183
- --sky-color-border-switch-disabled: var(--bb-color-gray-400);
2184
- --sky-color-border-switch-error: var(--bb-color-red-600);
2185
- --sky-color-border-switch-focus: var(--bb-color-blue-600);
2186
- --sky-color-border-switch-hover: var(--bb-color-blue-600);
2187
- --sky-color-border-switch-selected-active: var(--bb-color-blue-900);
2705
+ --sky-color-border-selected: var(--bb-color-blue-dark-375);
2706
+ --sky-color-border-selected_soft: var(--bb-color-steel-blue-dark-100);
2707
+ --sky-color-border-separator-dark: var(--bb-color-rgba-white-18);
2708
+ --sky-color-border-separator-light: var(--bb-color-rgba-white-18);
2709
+ --sky-color-border-separator-row: var(--bb-color-rgba-white-18);
2710
+ --sky-color-border-success: var(--bb-color-green-dark-700);
2711
+ --sky-color-border-switch-active: var(--bb-color-blue-dark-400);
2712
+ --sky-color-border-switch-base: var(--bb-color-steel-gray-500);
2713
+ --sky-color-border-switch-disabled: var(--bb-color-steel-gray-500);
2714
+ --sky-color-border-switch-error: var(--bb-color-red-dark-600);
2715
+ --sky-color-border-switch-focus: var(--bb-color-blue-dark-400);
2716
+ --sky-color-border-switch-hover: var(--bb-color-blue-dark-400);
2717
+ --sky-color-border-switch-selected-active: var(--bb-color-blue-dark-100);
2188
2718
  --sky-color-border-switch-selected-base: var(--bb-color-transparent);
2189
- --sky-color-border-switch-selected-disabled: var(--bb-color-gray-400);
2190
- --sky-color-border-switch-selected-focus: var(--bb-color-blue-900);
2191
- --sky-color-border-switch-selected-hover: var(--bb-color-blue-900);
2192
- --sky-color-border-tab-active: var(--bb-color-sky-500);
2719
+ --sky-color-border-switch-selected-disabled: var(--bb-color-steel-gray-500);
2720
+ --sky-color-border-switch-selected-focus: var(--bb-color-blue-dark-100);
2721
+ --sky-color-border-switch-selected-hover: var(--bb-color-blue-dark-100);
2722
+ --sky-color-border-tab-active: var(--bb-color-blue-dark-300);
2193
2723
  --sky-color-border-tab-base: var(--bb-color-transparent);
2194
- --sky-color-border-tab-disabled: var(--bb-color-gray-800);
2195
- --sky-color-border-tab-focus: var(--bb-color-sky-600);
2196
- --sky-color-border-tab-hover: var(--bb-color-sky-600);
2724
+ --sky-color-border-tab-focus: var(--bb-color-blue-dark-400);
2725
+ --sky-color-border-tab-hover: var(--bb-color-blue-dark-300);
2197
2726
  --sky-color-border-tab-wizard-disabled: var(--bb-color-transparent);
2198
- --sky-color-border-text_highlight: var(--bb-color-yellow-600);
2199
- --sky-color-border-warning: var(--bb-color-yellow-400);
2200
- --sky-color-icon-action: var(--bb-color-sky-600);
2201
- --sky-color-icon-danger: var(--bb-color-red-400);
2202
- --sky-color-icon-deemphasized: var(--bb-color-gray-300);
2203
- --sky-color-icon-default: var(--bb-color-gray-25);
2204
- --sky-color-icon-info: var(--bb-color-blue-600);
2205
- --sky-color-icon-input-action: var(--bb-color-sky-600);
2206
- --sky-color-icon-inverse: var(--bb-color-gray-1100);
2207
- --sky-color-icon-selected: var(--bb-color-blue-600);
2208
- --sky-color-icon-success: var(--bb-color-green-700);
2209
- --sky-color-icon-warning: var(--bb-color-yellow-600);
2210
- --sky-color-illustration-fill-heavy: var(--bb-color-green-700);
2211
- --sky-color-illustration-fill-soft: var(--bb-color-green-900);
2212
- --sky-color-illustration-fill-softest: var(--bb-color-gray-900);
2213
- --sky-color-illustration-stroke: var(--bb-color-green-200);
2214
- --sky-color-text-action: var(--bb-color-sky-600);
2215
- --sky-color-text-action_contrast: var(--bb-color-blue-300);
2216
- --sky-color-text-danger: var(--bb-color-red-400);
2217
- --sky-color-text-deemphasized: var(--bb-color-gray-300);
2218
- --sky-color-text-default: var(--bb-color-gray-25);
2219
- --sky-color-text-heading: var(--bb-color-gray-50);
2220
- --sky-color-text-inverse: var(--bb-color-gray-1100);
2221
- --sky-color-text-selected: var(--bb-color-blue-400);
2222
- --sky-elevation-none: var(--bb-shadow-slate-0);
2727
+ --sky-color-border-text_highlight: var(--bb-color-yellow-dark-400);
2728
+ --sky-color-border-warning: var(--bb-color-yellow-dark-600);
2729
+ --sky-color-classify-1-heavy: var(--bb-color-teal-dark-300);
2730
+ --sky-color-classify-1-soft: var(--bb-color-teal-dark-700);
2731
+ --sky-color-classify-2-heavy: var(--bb-color-purple-dark-300);
2732
+ --sky-color-classify-2-soft: var(--bb-color-purple-dark-700);
2733
+ --sky-color-classify-3-heavy: var(--bb-color-sky-dark-300);
2734
+ --sky-color-classify-3-soft: var(--bb-color-sky-dark-700);
2735
+ --sky-color-classify-4-heavy: var(--bb-color-orange-dark-300);
2736
+ --sky-color-classify-4-soft: var(--bb-color-orange-dark-700);
2737
+ --sky-color-classify-5-heavy: var(--bb-color-pink-dark-300);
2738
+ --sky-color-classify-5-soft: var(--bb-color-pink-dark-700);
2739
+ --sky-color-classify-6-heavy: var(--bb-color-green-dark-300);
2740
+ --sky-color-classify-6-soft: var(--bb-color-green-dark-700);
2741
+ --sky-color-classify-7-heavy: var(--bb-color-red-dark-300);
2742
+ --sky-color-classify-7-soft: var(--bb-color-red-dark-700);
2743
+ --sky-color-icon-action: var(--bb-color-blue-dark-400);
2744
+ --sky-color-icon-danger: var(--bb-color-red-dark-400);
2745
+ --sky-color-icon-deemphasized: var(--bb-color-steel-gray-400);
2746
+ --sky-color-icon-default: var(--bb-color-steel-gray-100);
2747
+ --sky-color-icon-info: var(--bb-color-blue-dark-400);
2748
+ --sky-color-icon-input-action: var(--bb-color-oklch-blue-375);
2749
+ --sky-color-icon-inverse: var(--bb-color-steel-gray-1100);
2750
+ --sky-color-icon-on_prominent-base: var(--bb-color-white);
2751
+ --sky-color-icon-on_prominent-disabled: var(--bb-color-gray-600);
2752
+ --sky-color-icon-on_status: var(--bb-color-white);
2753
+ --sky-color-icon-on_status_bg: var(--bb-color-steel-gray-1100);
2754
+ --sky-color-icon-selected: var(--bb-color-blue-dark-300);
2755
+ --sky-color-icon-success: var(--bb-color-green-dark-400);
2756
+ --sky-color-icon-warning: var(--bb-color-yellow-dark-400);
2757
+ --sky-color-illustration-fill-heavy: var(--bb-color-teal-dark-600);
2758
+ --sky-color-illustration-fill-soft: var(--bb-color-teal-dark-800);
2759
+ --sky-color-illustration-fill-softest: var(--bb-color-steel-gray-1100);
2760
+ --sky-color-illustration-stroke: var(--bb-color-teal-dark-100);
2761
+ --sky-color-text-action: var(--bb-color-blue-dark-375);
2762
+ --sky-color-text-action_contrast: var(--bb-color-blue-dark-200);
2763
+ --sky-color-text-danger: var(--bb-color-red-dark-400);
2764
+ --sky-color-text-deemphasized: var(--bb-color-steel-gray-400);
2765
+ --sky-color-text-default: var(--bb-color-steel-gray-200);
2766
+ --sky-color-text-heading: var(--bb-color-steel-gray-100);
2767
+ --sky-color-text-inverse: var(--bb-color-steel-gray-1100);
2768
+ --sky-color-text-on_prominent: var(--bb-color-white);
2769
+ --sky-color-text-on_status: var(--bb-color-gray-1000);
2770
+ --sky-color-text-selected: var(--bb-color-steel-gray-100);
2223
2771
  --sky-image-select_icon-base: var(--bb-image-select_icon-bb-dark-src);
2224
2772
  --sky-image-select_icon-disabled: var(--bb-image-select_icon-disabled-bb-dark-src);
2225
2773
  --sky-opacity-wait: var(--bb-opacity-600);
2226
2774
  --sky-color-background-action-accent-disabled: var(--sky-color-background-disabled);
2775
+ --sky-color-background-action-danger-disabled: var(--sky-color-background-disabled);
2776
+ --sky-color-background-action-input-disabled: var(--sky-color-background-disabled);
2777
+ --sky-color-background-action-primary-disabled: var(--sky-color-background-disabled);
2778
+ --sky-color-background-action-secondary-disabled: var(--sky-color-background-disabled);
2779
+ --sky-color-background-action-secondary-on_scrim-disabled: var(--sky-color-background-disabled);
2780
+ --sky-color-background-action-tertiary-disabled: var(--sky-color-background-disabled);
2781
+ --sky-color-background-action-tertiary-on_prominent-disabled: var(--sky-color-background-disabled);
2782
+ --sky-color-background-input-disabled: var(--sky-color-background-disabled);
2783
+ --sky-color-background-nav-disabled: var(--sky-color-background-disabled);
2784
+ --sky-color-background-row-disabled: var(--sky-color-background-disabled);
2785
+ --sky-color-background-selected-switch-disabled: var(--sky-color-background-disabled);
2786
+ --sky-color-background-tab-disabled: var(--sky-color-background-disabled);
2227
2787
  --sky-color-border-action-accent-base: var(--bb-color-gradient-brand-secondary);
2228
- --sky-elevation-focus: var(--bb-shadow-slate-200);
2229
- --sky-elevation-overflow: var(--bb-shadow-slate-200);
2230
- --sky-elevation-overlay-100: var(--bb-shadow-slate-400);
2231
- --sky-elevation-overlay-200: var(--bb-shadow-slate-800);
2232
- --sky-elevation-overlay-300: var(--bb-shadow-slate-1600);
2233
- --sky-elevation-overlay-400: var(--bb-shadow-slate-2400);
2234
- --sky-elevation-overlay-simple-100: var(--bb-shadow-slate-simple-400);
2235
- --sky-elevation-raised-100: var(--bb-shadow-slate-100);
2788
+ --sky-color-border-action-danger-disabled: var(--sky-color-border-disabled);
2789
+ --sky-color-border-action-primary-disabled: var(--sky-color-border-disabled);
2790
+ --sky-color-border-action-secondary-disabled: var(--sky-color-border-disabled);
2791
+ --sky-color-border-action-tertiary-disabled: var(--sky-color-border-disabled);
2792
+ --sky-color-border-action-tertiary-on_prominent-disabled: var(--sky-color-border-disabled);
2793
+ --sky-color-border-tab-disabled: var(--sky-color-border-disabled);
2794
+ --sky-elevation-focus: var(--bb-shadow-steel-gray-200);
2795
+ --sky-elevation-none: var(--bb-shadow-steel-gray-0);
2796
+ --sky-elevation-overflow: var(--bb-shadow-steel-gray-200);
2797
+ --sky-elevation-overlay-100: var(--bb-shadow-steel-gray-400);
2798
+ --sky-elevation-overlay-200: var(--bb-shadow-steel-gray-800);
2799
+ --sky-elevation-overlay-300: var(--bb-shadow-steel-gray-1600);
2800
+ --sky-elevation-overlay-400: var(--bb-shadow-steel-gray-2400);
2801
+ --sky-elevation-overlay-simple-100: var(--bb-shadow-steel-gray-simple-400);
2802
+ --sky-elevation-raised-100: var(--bb-shadow-steel-gray-100);
2803
+ }
2804
+
2805
+ :root:has(body.sky-theme-modern.sky-theme-brand-base.sky-theme-brand-blackbaud.sky-theme-mode-dark) {
2806
+ --sky-color-scrollbar-thumb: var(--bb-color-scrollbar-bb-dark-thumb);
2807
+ --sky-color-scrollbar-track: var(--bb-color-scrollbar-bb-dark-track);
2236
2808
  }
2237
2809
 
2238
2810
  .sky-theme-modern {
@@ -2323,6 +2895,12 @@
2323
2895
  transition: box-shadow var(--sky-global-duration-short);
2324
2896
  line-height: var(--sky-font-line_height-body-m);
2325
2897
  }
2898
+ .sky-theme-modern a.sky-btn:not(.sky-btn-link):not(.sky-btn-link-inline) {
2899
+ text-decoration-line: none;
2900
+ }
2901
+ .sky-theme-modern a.sky-btn:not(.sky-btn-link):not(.sky-btn-link-inline):hover, .sky-theme-modern a.sky-btn:not(.sky-btn-link):not(.sky-btn-link-inline):active, .sky-theme-modern a.sky-btn:not(.sky-btn-link):not(.sky-btn-link-inline):focus-visible {
2902
+ text-decoration-line: none;
2903
+ }
2326
2904
  .sky-theme-modern .sky-btn-default,
2327
2905
  .sky-theme-modern .sky-btn-primary,
2328
2906
  .sky-theme-modern .sky-btn-danger,
@@ -2336,6 +2914,7 @@
2336
2914
  .sky-theme-modern .sky-btn-link,
2337
2915
  .sky-theme-modern .sky-btn-borderless,
2338
2916
  .sky-theme-modern .sky-btn-icon-borderless,
2917
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent,
2339
2918
  .sky-theme-modern .sky-btn-icon,
2340
2919
  .sky-theme-modern .sky-btn-link-inline,
2341
2920
  .sky-theme-modern .sky-btn-borderless-inline {
@@ -2348,10 +2927,11 @@
2348
2927
  .sky-theme-modern .sky-btn-link:hover,
2349
2928
  .sky-theme-modern .sky-btn-borderless:hover,
2350
2929
  .sky-theme-modern .sky-btn-icon-borderless:hover,
2930
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent:hover,
2351
2931
  .sky-theme-modern .sky-btn-icon:hover,
2352
2932
  .sky-theme-modern .sky-btn-link-inline:hover,
2353
2933
  .sky-theme-modern .sky-btn-borderless-inline:hover {
2354
- text-decoration: none;
2934
+ text-decoration-line: none;
2355
2935
  }
2356
2936
  .sky-theme-modern .sky-btn-default.sky-btn-disabled, .sky-theme-modern .sky-btn-default.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-default.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-default.sky-btn-disabled:active, .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-default[disabled], .sky-theme-modern .sky-btn-default[disabled]:hover, .sky-theme-modern .sky-btn-default[disabled]:focus-visible, .sky-theme-modern .sky-btn-default[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-default[disabled]:active, .sky-theme-modern .sky-btn-default[disabled].sky-btn-active,
2357
2937
  .sky-theme-modern .sky-btn-primary.sky-btn-disabled,
@@ -2414,6 +2994,18 @@
2414
2994
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-focus,
2415
2995
  .sky-theme-modern .sky-btn-icon-borderless[disabled]:active,
2416
2996
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active,
2997
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled,
2998
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled:hover,
2999
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled:focus-visible,
3000
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled.sky-btn-focus,
3001
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled:active,
3002
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled.sky-btn-active,
3003
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled],
3004
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled]:hover,
3005
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled]:focus-visible,
3006
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled].sky-btn-focus,
3007
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled]:active,
3008
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled].sky-btn-active,
2417
3009
  .sky-theme-modern .sky-btn-icon.sky-btn-disabled,
2418
3010
  .sky-theme-modern .sky-btn-icon.sky-btn-disabled:hover,
2419
3011
  .sky-theme-modern .sky-btn-icon.sky-btn-disabled:focus-visible,
@@ -2515,6 +3107,18 @@
2515
3107
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-focus.sky-btn-link-inline,
2516
3108
  .sky-theme-modern .sky-btn-icon-borderless[disabled]:active.sky-btn-link-inline,
2517
3109
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active.sky-btn-link-inline,
3110
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled.sky-btn-link-inline,
3111
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled:hover.sky-btn-link-inline,
3112
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled:focus-visible.sky-btn-link-inline,
3113
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled.sky-btn-focus.sky-btn-link-inline,
3114
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled:active.sky-btn-link-inline,
3115
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled.sky-btn-active.sky-btn-link-inline,
3116
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled].sky-btn-link-inline,
3117
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled]:hover.sky-btn-link-inline,
3118
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled]:focus-visible.sky-btn-link-inline,
3119
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled].sky-btn-focus.sky-btn-link-inline,
3120
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled]:active.sky-btn-link-inline,
3121
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled].sky-btn-active.sky-btn-link-inline,
2518
3122
  .sky-theme-modern .sky-btn-icon.sky-btn-disabled.sky-btn-link-inline,
2519
3123
  .sky-theme-modern .sky-btn-icon.sky-btn-disabled:hover.sky-btn-link-inline,
2520
3124
  .sky-theme-modern .sky-btn-icon.sky-btn-disabled:focus-visible.sky-btn-link-inline,
@@ -2662,12 +3266,28 @@
2662
3266
  }
2663
3267
  .sky-theme-modern .sky-btn-link {
2664
3268
  color: var(--sky-color-text-action);
3269
+ text-decoration-line: var(--sky-comp-override-link-text-decoration-line, var(--sky-font-text_decoration-action-tertiary-base));
3270
+ text-underline-offset: var(--sky-size-text_underline-offset);
3271
+ text-decoration-thickness: var(--sky-size-text_underline-thickness);
3272
+ }
3273
+ .sky-theme-modern .sky-btn-link:hover {
3274
+ text-decoration-line: var(--sky-comp-override-link-text-decoration-line-hover, var(--sky-font-text_decoration-action-tertiary-hover));
3275
+ }
3276
+ .sky-theme-modern .sky-btn-link:active {
3277
+ text-decoration-line: var(--sky-comp-override-link-text-decoration-line-active, var(--sky-font-text_decoration-action-tertiary-active));
3278
+ }
3279
+ .sky-theme-modern .sky-btn-link:focus-visible {
3280
+ text-decoration-line: var(--sky-comp-override-link-text-decoration-line-focus, var(--sky-font-text_decoration-action-tertiary-focus));
3281
+ }
3282
+ .sky-theme-modern .sky-btn-link.sky-btn-disabled, .sky-theme-modern .sky-btn-link.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-link.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-link.sky-btn-disabled:active, .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-link[disabled], .sky-theme-modern .sky-btn-link[disabled]:hover, .sky-theme-modern .sky-btn-link[disabled]:focus-visible, .sky-theme-modern .sky-btn-link[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-link[disabled]:active, .sky-theme-modern .sky-btn-link[disabled].sky-btn-active {
3283
+ text-decoration-line: var(--sky-comp-override-link-text-decoration-line-disabled, var(--sky-font-text_decoration-action-tertiary-disabled));
2665
3284
  }
2666
3285
  .sky-theme-modern .sky-btn-borderless,
2667
3286
  .sky-theme-modern .sky-btn-icon-borderless {
2668
3287
  color: var(--sky-color-icon-deemphasized);
2669
3288
  }
2670
- .sky-theme-modern .sky-btn-icon-borderless {
3289
+ .sky-theme-modern .sky-btn-icon-borderless,
3290
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent {
2671
3291
  padding: var(--sky-comp-button-borderless-space-inset-top) var(--sky-comp-button-borderless-space-inset-right) var(--sky-comp-button-borderless-space-inset-bottom) var(--sky-comp-button-borderless-space-inset-left);
2672
3292
  height: auto;
2673
3293
  width: auto;
@@ -2755,27 +3375,58 @@
2755
3375
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
2756
3376
  box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-tertiary-disabled), var(--sky-comp-override-toolbar-button-elevation-disabled, var(--sky-elevation-action-tertiary-disabled));
2757
3377
  }
3378
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent {
3379
+ background-color: var(--sky-color-background-action-tertiary-on_prominent-base);
3380
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-tertiary-on_prominent-base), var(--sky-elevation-action-tertiary-base);
3381
+ color: var(--sky-color-icon-on_prominent-base);
3382
+ }
3383
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent:hover {
3384
+ background-color: var(--sky-color-background-action-tertiary-on_prominent-hover);
3385
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-on_prominent-hover), var(--sky-elevation-action-tertiary-hover);
3386
+ color: var(--sky-color-icon-on_prominent-base);
3387
+ }
3388
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent:active, .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-active {
3389
+ background-color: var(--sky-color-background-action-tertiary-on_prominent-active);
3390
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-on_prominent-active), var(--sky-elevation-action-tertiary-active);
3391
+ transition: none;
3392
+ }
3393
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent:focus-visible:not(:active) {
3394
+ background-color: var(--sky-color-background-action-tertiary-on_prominent-focus);
3395
+ border: none;
3396
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-on_prominent-focus), var(--sky-elevation-action-tertiary-focus);
3397
+ }
3398
+ .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled, .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled:active, .sky-theme-modern .sky-btn-icon-borderless-on_prominent.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled], .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled]:hover, .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled]:focus-visible, .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled]:active, .sky-theme-modern .sky-btn-icon-borderless-on_prominent[disabled].sky-btn-active {
3399
+ background-color: var(--sky-color-background-action-tertiary-on_prominent-disabled);
3400
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-tertiary-on_prominent-disabled), var(--sky-elevation-action-tertiary-disabled);
3401
+ color: var(--sky-color-icon-on_prominent-disabled);
3402
+ }
2758
3403
  .sky-theme-modern .sky-btn-link-inline {
2759
3404
  background-color: transparent;
2760
3405
  border-radius: var(--sky-border-radius-s);
2761
3406
  padding: var(--sky-space-inset-balanced-none);
2762
3407
  color: var(--sky-color-text-action);
3408
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line, var(--sky-font-text_decoration-inline_link-base));
3409
+ text-underline-offset: var(--sky-size-text_underline-offset);
3410
+ text-decoration-thickness: var(--sky-size-text_underline-thickness);
2763
3411
  }
2764
3412
  .sky-theme-modern .sky-btn-link-inline:focus-visible:not(:active) {
2765
3413
  background-color: transparent;
2766
3414
  box-shadow: 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus);
3415
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-focus, var(--sky-font-text_decoration-inline_link-focus));
2767
3416
  }
2768
3417
  .sky-theme-modern .sky-btn-link-inline:active {
2769
3418
  background-color: transparent;
3419
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-active, var(--sky-font-text_decoration-inline_link-active));
2770
3420
  }
2771
3421
  .sky-theme-modern .sky-btn-link-inline:hover {
2772
3422
  background-color: transparent;
3423
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-hover, var(--sky-font-text_decoration-inline_link-hover));
2773
3424
  }
2774
3425
  .sky-theme-modern .sky-btn-link-inline:hover, .sky-theme-modern .sky-btn-link-inline:active {
2775
- color: var(--sky-color-text-action);
2776
- text-decoration: underline;
3426
+ color: var(--sky-color-text-action_contrast);
2777
3427
  }
2778
3428
  .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:active, .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-link-inline[disabled], .sky-theme-modern .sky-btn-link-inline[disabled]:hover, .sky-theme-modern .sky-btn-link-inline[disabled]:focus-visible, .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-link-inline[disabled]:active, .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-active {
3429
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-disabled, var(--sky-font-text_decoration-inline_link-disabled));
2779
3430
  box-shadow: inset 0 0 0 0 var(--sky-color-border-action-tertiary-disabled);
2780
3431
  }
2781
3432
  .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link-inline[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
@@ -2830,16 +3481,19 @@
2830
3481
  line-height: var(--sky-font-line_height-body-m);
2831
3482
  padding: var(--sky-comp-tab-horizontal-space-inset-top) var(--sky-comp-tab-horizontal-space-inset-right) var(--sky-comp-tab-horizontal-space-inset-bottom) var(--sky-comp-tab-horizontal-space-inset-left);
2832
3483
  transition: box-shadow var(--sky-global-duration-short);
3484
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line, var(--sky-font-text_decoration-standalone_link-base));
2833
3485
  }
2834
3486
  .sky-theme-modern .sky-btn-tab:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(.sky-dropdown-button-type-tab):not(:focus-visible) {
2835
3487
  background-color: var(--sky-color-background-tab-hover);
2836
3488
  border-bottom: var(--sky-border-width-selected-s) var(--sky-border-style-accent) var(--sky-color-border-tab-hover);
2837
3489
  color: var(--sky-color-text-default);
2838
3490
  padding-bottom: calc(var(--sky-comp-tab-horizontal-space-inset-bottom) - var(--sky-border-width-selected-s));
3491
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-hover, var(--sky-font-text_decoration-standalone_link-hover));
2839
3492
  }
2840
3493
  .sky-theme-modern .sky-btn-tab:focus-visible {
2841
3494
  background-color: var(--sky-color-background-tab-focus);
2842
3495
  outline: none;
3496
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-focus, var(--sky-font-text_decoration-standalone_link-focus));
2843
3497
  }
2844
3498
  .sky-theme-modern .sky-btn-tab:focus-visible:not(.sky-btn-tab-selected) {
2845
3499
  color: var(--sky-color-text-default);
@@ -2860,6 +3514,7 @@
2860
3514
  background-color: var(--sky-color-background-tab-active);
2861
3515
  border-bottom: var(--sky-border-width-selected-s) var(--sky-border-style-accent) var(--sky-color-border-tab-active);
2862
3516
  padding-bottom: calc(var(--sky-comp-tab-horizontal-space-inset-bottom) - var(--sky-border-width-selected-s));
3517
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-active, var(--sky-font-text_decoration-standalone_link-active));
2863
3518
  }
2864
3519
  .sky-theme-modern .sky-btn-tab:active.sky-btn-tab-selected, .sky-theme-modern .sky-btn-tab:active:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(:focus-visible).sky-btn-tab-selected {
2865
3520
  background-color: var(--sky-color-background-selected-soft);
@@ -2891,6 +3546,7 @@
2891
3546
  .sky-theme-modern .sky-btn-tab-selected:not(.sky-btn-tab-disabled):hover:not(.sky-btn-tab-disabled) {
2892
3547
  background-color: var(--sky-color-background-tab-selected);
2893
3548
  color: var(--sky-color-text-selected);
3549
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-hover, var(--sky-font-text_decoration-standalone_link-hover));
2894
3550
  }
2895
3551
  .sky-theme-modern .sky-btn-tab-selected:not(.sky-btn-tab-disabled) .sky-btn-tab-close,
2896
3552
  .sky-theme-modern .sky-btn-tab-selected:not(.sky-btn-tab-disabled) .sky-tab-header-count {
@@ -2923,7 +3579,7 @@
2923
3579
  outline: solid var(--sky-border-width-action-active) var(--sky-color-border-action-secondary-focus);
2924
3580
  outline-offset: calc(var(--sky-border-width-action-active) * -1);
2925
3581
  }
2926
- .sky-theme-modern .sky-tab-dropdown-menu-item .sky-btn-tab.sky-btn-tab-selected {
3582
+ .sky-theme-modern .sky-tab-dropdown-menu-item .sky-btn-tab.sky-btn-tab-selected:not(.sky-btn-tab-disabled) {
2927
3583
  background-color: var(--sky-color-background-selected-soft);
2928
3584
  color: var(--sky-color-text-default);
2929
3585
  border-bottom: none;
@@ -3197,10 +3853,26 @@ body.sky-theme-modern {
3197
3853
  .sky-theme-modern a {
3198
3854
  color: var(--sky-color-text-action);
3199
3855
  border-radius: var(--sky-border-radius-s);
3856
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line, var(--sky-font-text_decoration-inline_link-base));
3857
+ text-underline-offset: var(--sky-size-text_underline-offset);
3858
+ text-decoration-thickness: var(--sky-size-text_underline-thickness);
3859
+ }
3860
+ .sky-theme-modern a:hover {
3861
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-hover, var(--sky-font-text_decoration-inline_link-hover));
3862
+ }
3863
+ .sky-theme-modern a:active {
3864
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-active, var(--sky-font-text_decoration-inline_link-active));
3865
+ }
3866
+ .sky-theme-modern a:hover:not(.sky-btn) {
3867
+ color: var(--sky-color-text-action_contrast);
3868
+ }
3869
+ .sky-theme-modern a:active:not(.sky-btn) {
3870
+ color: var(--sky-color-text-action_contrast);
3200
3871
  }
3201
3872
  .sky-theme-modern a:focus-visible:not(:active) {
3202
3873
  outline: none;
3203
3874
  box-shadow: 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus);
3875
+ text-decoration-line: var(--sky-comp-override-inline-link-text-decoration-line-focus, var(--sky-font-text_decoration-inline_link-focus));
3204
3876
  }
3205
3877
  .sky-theme-modern .sky-font-heading-1 {
3206
3878
  color: var(--sky-color-text-heading);
@@ -3230,7 +3902,7 @@ body.sky-theme-modern {
3230
3902
  line-height: var(--sky-font-line_height-heading-4);
3231
3903
  }
3232
3904
  .sky-theme-modern .sky-font-heading-5 {
3233
- color: var(--sky-color-text-heading);
3905
+ color: var(--sky-color-text-deemphasized);
3234
3906
  font-size: var(--sky-font-size-heading-5);
3235
3907
  font-weight: var(--sky-font-style-heading-5);
3236
3908
  text-transform: none;
@@ -3250,22 +3922,6 @@ body.sky-theme-modern {
3250
3922
  .sky-theme-modern .sky-rounded-corners {
3251
3923
  border-radius: var(--sky-border-radius-s);
3252
3924
  }
3253
- .sky-theme-modern .sky-illustration-svg {
3254
- height: 100%;
3255
- width: 100%;
3256
- }
3257
- .sky-theme-modern .sky-illustration-svg .sky-illustration-fill-softest {
3258
- fill: var(--sky-color-illustration-fill-softest);
3259
- }
3260
- .sky-theme-modern .sky-illustration-svg .sky-illustration-fill-soft {
3261
- fill: var(--sky-color-illustration-fill-soft);
3262
- }
3263
- .sky-theme-modern .sky-illustration-svg .sky-illustration-fill-heavy {
3264
- fill: var(--sky-color-illustration-fill-heavy);
3265
- }
3266
- .sky-theme-modern .sky-illustration-svg .sky-illustration-outline {
3267
- stroke: var(--sky-color-illustration-stroke);
3268
- }
3269
3925
 
3270
3926
  .sky-theme-modern .sky-font-body-default {
3271
3927
  color: var(--sky-color-text-default);