@skyux/theme 13.0.0-alpha.0 → 13.0.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -12,12 +12,14 @@
12
12
  --bb-border-radius-round: 50%;
13
13
  --bb-border-style-dotted: dotted;
14
14
  --bb-border-style-solid: solid;
15
+ --bb-brand-name: Blackbaud;
15
16
  --bb-color-black: #000000;
16
17
  --bb-color-blocking: rgba(255, 255, 255, 0.7);
17
18
  --bb-color-blue-100: #eef3fc;
18
19
  --bb-color-blue-1000: #09152b;
19
- --bb-color-blue-200: #d0e1f7;
20
- --bb-color-blue-25: #f1f5fa;
20
+ --bb-color-blue-200: #d5e1f7;
21
+ --bb-color-blue-25: #fbfcfe;
22
+ --bb-color-blue-250: #bfd3f2;
21
23
  --bb-color-blue-300: #aac4ee;
22
24
  --bb-color-blue-400: #80a6e6;
23
25
  --bb-color-blue-50: #f4f8fd;
@@ -101,6 +103,7 @@
101
103
  --bb-color-sky-700: #00a6cc;
102
104
  --bb-color-sky-800: #007c99;
103
105
  --bb-color-sky-900: #005366;
106
+ --bb-color-slate-100: #f1f5fa;
104
107
  --bb-color-teal-100: #ebfaf9;
105
108
  --bb-color-teal-1000: #012625;
106
109
  --bb-color-teal-200: #cdf2f1;
@@ -147,7 +150,7 @@
147
150
  --bb-font-weight-light: 300;
148
151
  --bb-font-weight-regular: 400;
149
152
  --bb-font-weight-semibold: 600;
150
- --bb-image-logo-primary-src: url("https://sky.blackbaudcdn.net/static/skyux-design-tokens/0.0.69/assets/images/bb-logo.png");
153
+ --bb-image-logo-primary-src: url("https://sky.blackbaudcdn.net/static/skyux-design-tokens/2.0.0-alpha.3/assets/images/bb-logo.png");
151
154
  --bb-letter_spacing-normal: normal;
152
155
  --bb-letter_spacing-wider: 0.16px;
153
156
  --bb-line_height-300: calc(18/13);
@@ -157,15 +160,7 @@
157
160
  --bb-line_height-700: calc(32/24);
158
161
  --bb-line_height-800: calc(36/26);
159
162
  --bb-opacity-600: .6;
160
- --bb-shadow-gray-0: 0 0 0 0 #000000;
161
- --bb-shadow-gray-100: 0 1px 3px 0 rgba(13,62,130,0.2), 0 2px 1px -1px rgba(13,62,130,0.12), 0 1px 1px 0 rgba(13,62,130,0.14);
162
- --bb-shadow-gray-1600: 0 8px 10px -5px rgba(13,62,130,0.2), 0 6px 30px 5px rgba(13,62,130,0.12), 0 16px 24px 2px rgba(13,62,130,0.14);
163
- --bb-shadow-gray-200: 0 1px 8px 0 rgba(13,62,130,0.2), 0 3px 3px -2px rgba(13,62,130,0.12), 0 3px 4px 0 rgba(13,62,130,0.14);
164
- --bb-shadow-gray-2400: 0 11px 15px -7px rgba(13,62,130,0.2), 0 9px 46px 8px rgba(13,62,130,0.12), 0 24px 38px 3px rgba(13,62,130,0.14);
165
- --bb-shadow-gray-25: 0 1px 1px 0 rgba(13,62,130,0.05);
166
- --bb-shadow-gray-400: 0 2px 4px -1px rgba(13,62,130,0.2), 0 1px 10px 0 rgba(13,62,130,0.12), 0 4px 5px 0 rgba(13,62,130,0.14);
167
- --bb-shadow-gray-50: 0 1px 1px 0 rgba(13,62,130,0.12), 0 1.5px 1px -1px rgba(13,62,130,0.12);
168
- --bb-shadow-gray-800: 0 5px 5px -3px rgba(13,62,130,0.2), 0 3px 14px 2px rgba(13,62,130,0.12), 0 8px 10px 1px rgba(13,62,130,0.14);
163
+ --bb-shadow-blue-0: 0 0 0 0 rgba(0, 0, 0, 0);
169
164
  --bb-size-0: 0rem;
170
165
  --bb-size-fixed-100: 16px;
171
166
  --bb-size-fixed-12: 2px;
@@ -216,6 +211,14 @@
216
211
  --bb-space-9: 36px;
217
212
  --bb-color-gradient-blue: linear-gradient( var(--bb-color-blue-500), var(--bb-color-blue-700));
218
213
  --bb-font-blkb_sans-family: var(--bb-font-blkb_sans-name), var(--bb-font-blkb_sans-fallback);
214
+ --bb-shadow-blue-100: 0 1px 3px 0 rgba(17, 43, 85, 0.2), 0 2px 1px -1px rgba(17, 43, 85, 0.12), 0 1px 1px 0 rgba(17, 43, 85, 0.14);
215
+ --bb-shadow-blue-1600: 0 8px 10px -5px rgba(17, 43, 85, 0.2), 0 6px 30px 5px rgba(17, 43, 85, 0.12), 0 16px 24px 2px rgba(17, 43, 85, 0.14);
216
+ --bb-shadow-blue-200: 0 1px 8px 0 rgba(17, 43, 85, 0.2), 0 3px 3px -2px rgba(17, 43, 85, 0.12), 0 3px 4px 0 rgba(17, 43, 85, 0.14);
217
+ --bb-shadow-blue-2400: 0 11px 15px -7px rgba(17, 43, 85, 0.2), 0 9px 46px 8px rgba(17, 43, 85, 0.12), 0 24px 38px 3px rgba(17, 43, 85, 0.14);
218
+ --bb-shadow-blue-25: 0 1px 1px 0 rgba(17, 43, 85, 0.05);
219
+ --bb-shadow-blue-400: 0 2px 4px -1px rgba(17, 43, 85, 0.2), 0 1px 10px 0 rgba(17, 43, 85, 0.12), 0 4px 5px 0 rgba(17, 43, 85, 0.14);
220
+ --bb-shadow-blue-50: 0 1px 1px 0 rgba(17, 43, 85, 0.12), 0 1.5px 1px -1px rgba(17, 43, 85, 0.12);
221
+ --bb-shadow-blue-800: 0 5px 5px -3px rgba(17, 43, 85, 0.2), 0 3px 14px 2px rgba(17, 43, 85, 0.12), 0 8px 10px 1px rgba(17, 43, 85, 0.14);
219
222
  }
220
223
 
221
224
  .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-compact {
@@ -265,6 +268,11 @@
265
268
  --sky-color-background-action-tertiary-disabled: var(--bb-color-gray-700);
266
269
  --sky-color-background-action-tertiary-focus: var(--bb-color-transparent);
267
270
  --sky-color-background-action-tertiary-hover: var(--bb-color-transparent);
271
+ --sky-color-background-action-toolbar-active: var(--bb-color-transparent);
272
+ --sky-color-background-action-toolbar-base: var(--bb-color-transparent);
273
+ --sky-color-background-action-toolbar-disabled: var(--bb-color-gray-700);
274
+ --sky-color-background-action-toolbar-focus: var(--bb-color-transparent);
275
+ --sky-color-background-action-toolbar-hover: var(--bb-color-transparent);
268
276
  --sky-color-background-blocking: var(--bb-color-blocking);
269
277
  --sky-color-background-container-base: var(--bb-color-gray-1000);
270
278
  --sky-color-background-container-danger: var(--bb-color-red-800);
@@ -297,6 +305,11 @@
297
305
  --sky-color-background-selected-soft: var(--bb-color-blue-900);
298
306
  --sky-color-background-selected-success: var(--bb-color-green-900);
299
307
  --sky-color-background-selected-warning: var(--bb-color-yellow-900);
308
+ --sky-color-background-tab-active: var(--bb-color-transparent);
309
+ --sky-color-background-tab-base: var(--bb-color-transparent);
310
+ --sky-color-background-tab-disabled: var(--bb-color-gray-700);
311
+ --sky-color-background-tab-focus: var(--bb-color-transparent);
312
+ --sky-color-background-tab-hover: var(--bb-color-transparent);
300
313
  --sky-color-background-text_highlight: var(--bb-color-yellow-800);
301
314
  --sky-color-background-thumb-base: var(--bb-color-white);
302
315
  --sky-color-background-thumb-disabled: var(--bb-color-gray-50);
@@ -326,6 +339,11 @@
326
339
  --sky-color-border-action-tertiary-disabled: var(--bb-color-gray-800);
327
340
  --sky-color-border-action-tertiary-focus: var(--bb-color-sky-600);
328
341
  --sky-color-border-action-tertiary-hover: var(--bb-color-sky-600);
342
+ --sky-color-border-action-toolbar-active: var(--bb-color-sky-500);
343
+ --sky-color-border-action-toolbar-base: var(--bb-color-transparent);
344
+ --sky-color-border-action-toolbar-disabled: var(--bb-color-gray-800);
345
+ --sky-color-border-action-toolbar-focus: var(--bb-color-sky-600);
346
+ --sky-color-border-action-toolbar-hover: var(--bb-color-sky-600);
329
347
  --sky-color-border-column_divider: var(--bb-color-blue-400);
330
348
  --sky-color-border-container-base: var(--bb-color-blue-900);
331
349
  --sky-color-border-danger: var(--bb-color-red-400);
@@ -338,6 +356,11 @@
338
356
  --sky-color-border-input-error: var(--bb-color-red-600);
339
357
  --sky-color-border-input-focus: var(--bb-color-blue-600);
340
358
  --sky-color-border-input-hover: var(--bb-color-blue-600);
359
+ --sky-color-border-nav-active: var(--bb-color-sky-500);
360
+ --sky-color-border-nav-base: var(--bb-color-transparent);
361
+ --sky-color-border-nav-disabled: var(--bb-color-gray-800);
362
+ --sky-color-border-nav-focus: var(--bb-color-sky-600);
363
+ --sky-color-border-nav-hover: var(--bb-color-sky-600);
341
364
  --sky-color-border-progress_step: var(--bb-color-gray-600);
342
365
  --sky-color-border-selected: var(--bb-color-blue-400);
343
366
  --sky-color-border-selected_soft: var(--bb-color-blue-500);
@@ -356,6 +379,11 @@
356
379
  --sky-color-border-switch-selected-disabled: var(--bb-color-gray-400);
357
380
  --sky-color-border-switch-selected-focus: var(--bb-color-blue-900);
358
381
  --sky-color-border-switch-selected-hover: var(--bb-color-blue-900);
382
+ --sky-color-border-tab-active: var(--bb-color-sky-500);
383
+ --sky-color-border-tab-base: var(--bb-color-transparent);
384
+ --sky-color-border-tab-disabled: var(--bb-color-gray-800);
385
+ --sky-color-border-tab-focus: var(--bb-color-sky-600);
386
+ --sky-color-border-tab-hover: var(--bb-color-sky-600);
359
387
  --sky-color-border-text_highlight: var(--bb-color-yellow-600);
360
388
  --sky-color-border-warning: var(--bb-color-yellow-400);
361
389
  --sky-color-icon-action: var(--bb-color-sky-600);
@@ -363,37 +391,39 @@
363
391
  --sky-color-icon-deemphasized: var(--bb-color-gray-300);
364
392
  --sky-color-icon-default: var(--bb-color-gray-25);
365
393
  --sky-color-icon-info: var(--bb-color-blue-600);
394
+ --sky-color-icon-input-action: var(--bb-color-sky-600);
366
395
  --sky-color-icon-inverse: var(--bb-color-gray-1100);
367
396
  --sky-color-icon-selected: var(--bb-color-blue-600);
368
397
  --sky-color-icon-success: var(--bb-color-green-700);
369
398
  --sky-color-icon-warning: var(--bb-color-yellow-600);
370
399
  --sky-color-text-action: var(--bb-color-sky-600);
400
+ --sky-color-text-action_contrast: var(--bb-color-blue-300);
371
401
  --sky-color-text-danger: var(--bb-color-red-400);
372
402
  --sky-color-text-deemphasized: var(--bb-color-gray-300);
373
403
  --sky-color-text-default: var(--bb-color-gray-25);
374
404
  --sky-color-text-heading: var(--bb-color-gray-50);
375
405
  --sky-color-text-inverse: var(--bb-color-gray-1100);
376
- --sky-color-text-link_highlighted: var(--bb-color-blue-300);
377
406
  --sky-color-text-selected: var(--bb-color-blue-400);
378
- --sky-elevation-focus: var(--bb-shadow-gray-200);
379
- --sky-elevation-none: var(--bb-shadow-gray-0);
380
- --sky-elevation-overflow: var(--bb-shadow-gray-200);
381
- --sky-elevation-overlay-100: var(--bb-shadow-gray-400);
382
- --sky-elevation-overlay-200: var(--bb-shadow-gray-800);
383
- --sky-elevation-overlay-300: var(--bb-shadow-gray-1600);
384
- --sky-elevation-overlay-400: var(--bb-shadow-gray-2400);
385
- --sky-elevation-raised-100: var(--bb-shadow-gray-100);
407
+ --sky-elevation-none: var(--bb-shadow-blue-0);
386
408
  --sky-opacity-wait: var(--bb-opacity-600);
409
+ --sky-elevation-focus: var(--bb-shadow-blue-200);
410
+ --sky-elevation-overflow: var(--bb-shadow-blue-200);
411
+ --sky-elevation-overlay-100: var(--bb-shadow-blue-400);
412
+ --sky-elevation-overlay-200: var(--bb-shadow-blue-800);
413
+ --sky-elevation-overlay-300: var(--bb-shadow-blue-1600);
414
+ --sky-elevation-overlay-400: var(--bb-shadow-blue-2400);
415
+ --sky-elevation-raised-100: var(--bb-shadow-blue-100);
387
416
  }
388
417
 
389
418
  .sky-theme-modern.sky-theme-brand-base {
419
+ --sky-brand-name: var(--bb-brand-name);
390
420
  --sky-color-background-action-danger-active: var(--bb-color-red-800);
391
421
  --sky-color-background-action-danger-base: var(--bb-color-red-600);
392
422
  --sky-color-background-action-danger-disabled: var(--bb-color-gray-50);
393
423
  --sky-color-background-action-danger-focus: var(--bb-color-red-600);
394
424
  --sky-color-background-action-danger-hover: var(--bb-color-red-700);
395
425
  --sky-color-background-action-input-active: var(--bb-color-blue-100);
396
- --sky-color-background-action-input-base: var(--bb-color-transparent);
426
+ --sky-color-background-action-input-base: var(--bb-color-white);
397
427
  --sky-color-background-action-input-disabled: var(--bb-color-gray-50);
398
428
  --sky-color-background-action-input-focus: var(--bb-color-transparent);
399
429
  --sky-color-background-action-input-hover: var(--bb-color-blue-50);
@@ -412,6 +442,11 @@
412
442
  --sky-color-background-action-tertiary-disabled: var(--bb-color-gray-50);
413
443
  --sky-color-background-action-tertiary-focus: var(--bb-color-transparent);
414
444
  --sky-color-background-action-tertiary-hover: var(--bb-color-blue-50);
445
+ --sky-color-background-action-toolbar-active: var(--bb-color-blue-100);
446
+ --sky-color-background-action-toolbar-base: var(--bb-color-white);
447
+ --sky-color-background-action-toolbar-disabled: var(--bb-color-gray-50);
448
+ --sky-color-background-action-toolbar-focus: var(--bb-color-white);
449
+ --sky-color-background-action-toolbar-hover: var(--bb-color-blue-50);
415
450
  --sky-color-background-blocking: var(--bb-color-blocking);
416
451
  --sky-color-background-container-base: var(--bb-color-white);
417
452
  --sky-color-background-container-danger: var(--bb-color-red-300);
@@ -437,13 +472,18 @@
437
472
  --sky-color-background-nav-disabled: var(--bb-color-gray-50);
438
473
  --sky-color-background-nav-focus: var(--bb-color-transparent);
439
474
  --sky-color-background-nav-hover: var(--bb-color-blue-50);
440
- --sky-color-background-page: var(--bb-color-blue-25);
475
+ --sky-color-background-page: var(--bb-color-slate-100);
441
476
  --sky-color-background-scrim: var(--bb-color-scrim);
442
477
  --sky-color-background-selected-danger: var(--bb-color-red-300);
443
478
  --sky-color-background-selected-heavy: var(--bb-color-blue-600);
444
479
  --sky-color-background-selected-soft: var(--bb-color-blue-100);
445
480
  --sky-color-background-selected-success: var(--bb-color-green-300);
446
481
  --sky-color-background-selected-warning: var(--bb-color-yellow-300);
482
+ --sky-color-background-tab-active: var(--bb-color-transparent);
483
+ --sky-color-background-tab-base: var(--bb-color-transparent);
484
+ --sky-color-background-tab-disabled: var(--bb-color-gray-50);
485
+ --sky-color-background-tab-focus: var(--bb-color-transparent);
486
+ --sky-color-background-tab-hover: var(--bb-color-transparent);
447
487
  --sky-color-background-text_highlight: var(--bb-color-yellow-400);
448
488
  --sky-color-background-thumb-base: var(--bb-color-white);
449
489
  --sky-color-background-thumb-disabled: var(--bb-color-gray-50);
@@ -454,7 +494,7 @@
454
494
  --sky-color-border-action-danger-focus: var(--bb-color-red-1000);
455
495
  --sky-color-border-action-danger-hover: var(--bb-color-red-1000);
456
496
  --sky-color-border-action-input-active: var(--bb-color-blue-600);
457
- --sky-color-border-action-input-base: var(--bb-color-blue-200);
497
+ --sky-color-border-action-input-base: var(--bb-color-blue-250);
458
498
  --sky-color-border-action-input-disabled: var(--bb-color-gray-200);
459
499
  --sky-color-border-action-input-focus: var(--bb-color-blue-600);
460
500
  --sky-color-border-action-input-hover: var(--bb-color-blue-600);
@@ -473,6 +513,11 @@
473
513
  --sky-color-border-action-tertiary-disabled: var(--bb-color-gray-200);
474
514
  --sky-color-border-action-tertiary-focus: var(--bb-color-blue-600);
475
515
  --sky-color-border-action-tertiary-hover: var(--bb-color-blue-600);
516
+ --sky-color-border-action-toolbar-active: var(--bb-color-blue-600);
517
+ --sky-color-border-action-toolbar-base: var(--bb-color-blue-300);
518
+ --sky-color-border-action-toolbar-disabled: var(--bb-color-gray-200);
519
+ --sky-color-border-action-toolbar-focus: var(--bb-color-blue-600);
520
+ --sky-color-border-action-toolbar-hover: var(--bb-color-blue-600);
476
521
  --sky-color-border-column_divider: var(--bb-color-blue-600);
477
522
  --sky-color-border-container-base: var(--bb-color-blue-200);
478
523
  --sky-color-border-danger: var(--bb-color-red-600);
@@ -480,16 +525,21 @@
480
525
  --sky-color-border-elevation: var(--bb-color-blue-200);
481
526
  --sky-color-border-info: var(--bb-color-blue-600);
482
527
  --sky-color-border-input-active: var(--bb-color-blue-600);
483
- --sky-color-border-input-base: var(--bb-color-blue-200);
528
+ --sky-color-border-input-base: var(--bb-color-blue-250);
484
529
  --sky-color-border-input-disabled: var(--bb-color-gray-200);
485
530
  --sky-color-border-input-error: var(--bb-color-red-600);
486
531
  --sky-color-border-input-focus: var(--bb-color-blue-600);
487
532
  --sky-color-border-input-hover: var(--bb-color-blue-600);
533
+ --sky-color-border-nav-active: var(--bb-color-blue-600);
534
+ --sky-color-border-nav-base: var(--bb-color-transparent);
535
+ --sky-color-border-nav-disabled: var(--bb-color-gray-200);
536
+ --sky-color-border-nav-focus: var(--bb-color-blue-600);
537
+ --sky-color-border-nav-hover: var(--bb-color-blue-600);
488
538
  --sky-color-border-progress_step: var(--bb-color-gray-400);
489
539
  --sky-color-border-selected: var(--bb-color-blue-600);
490
540
  --sky-color-border-selected_soft: var(--bb-color-blue-300);
491
- --sky-color-border-separator-light: var(--bb-color-blue-200);
492
- --sky-color-border-separator-row: var(--bb-color-blue-200);
541
+ --sky-color-border-separator-light: var(--bb-color-blue-250);
542
+ --sky-color-border-separator-row: var(--bb-color-blue-250);
493
543
  --sky-color-border-success: var(--bb-color-green-700);
494
544
  --sky-color-border-switch-active: var(--bb-color-blue-600);
495
545
  --sky-color-border-switch-base: var(--bb-color-blue-500);
@@ -502,6 +552,11 @@
502
552
  --sky-color-border-switch-selected-disabled: var(--bb-color-gray-200);
503
553
  --sky-color-border-switch-selected-focus: var(--bb-color-blue-1000);
504
554
  --sky-color-border-switch-selected-hover: var(--bb-color-blue-1000);
555
+ --sky-color-border-tab-active: var(--bb-color-blue-600);
556
+ --sky-color-border-tab-base: var(--bb-color-transparent);
557
+ --sky-color-border-tab-disabled: var(--bb-color-gray-200);
558
+ --sky-color-border-tab-focus: var(--bb-color-blue-600);
559
+ --sky-color-border-tab-hover: var(--bb-color-blue-600);
505
560
  --sky-color-border-text_highlight: var(--bb-color-yellow-800);
506
561
  --sky-color-border-warning: var(--bb-color-yellow-600);
507
562
  --sky-color-category-blue: var(--bb-color-sky-300);
@@ -516,58 +571,64 @@
516
571
  --sky-color-icon-deemphasized: var(--bb-color-gray-600);
517
572
  --sky-color-icon-default: var(--bb-color-gray-900);
518
573
  --sky-color-icon-info: var(--bb-color-blue-600);
574
+ --sky-color-icon-input-action: var(--bb-color-blue-600);
519
575
  --sky-color-icon-inverse: var(--bb-color-white);
520
576
  --sky-color-icon-selected: var(--bb-color-blue-600);
521
577
  --sky-color-icon-success: var(--bb-color-green-700);
522
578
  --sky-color-icon-warning: var(--bb-color-yellow-600);
523
579
  --sky-color-text-action: var(--bb-color-blue-600);
580
+ --sky-color-text-action_contrast: var(--bb-color-blue-700);
524
581
  --sky-color-text-danger: var(--bb-color-red-600);
525
582
  --sky-color-text-deemphasized: var(--bb-color-gray-600);
526
583
  --sky-color-text-default: var(--bb-color-gray-900);
527
584
  --sky-color-text-heading: var(--bb-color-blue-900);
528
585
  --sky-color-text-inverse: var(--bb-color-white);
529
- --sky-color-text-link_highlighted: var(--bb-color-blue-700);
530
586
  --sky-color-text-selected: var(--bb-color-blue-600);
531
- --sky-elevation-action-danger-active: var(--bb-shadow-gray-0);
532
- --sky-elevation-action-danger-base: var(--bb-shadow-gray-50);
533
- --sky-elevation-action-danger-disabled: var(--bb-shadow-gray-0);
534
- --sky-elevation-action-danger-focus: var(--bb-shadow-gray-50);
535
- --sky-elevation-action-danger-hover: var(--bb-shadow-gray-50);
536
- --sky-elevation-action-input-active: var(--bb-shadow-gray-25);
537
- --sky-elevation-action-input-base: var(--bb-shadow-gray-25);
538
- --sky-elevation-action-input-disabled: var(--bb-shadow-gray-0);
539
- --sky-elevation-action-input-focus: var(--bb-shadow-gray-25);
540
- --sky-elevation-action-input-hover: var(--bb-shadow-gray-25);
541
- --sky-elevation-action-primary-active: var(--bb-shadow-gray-0);
542
- --sky-elevation-action-primary-base: var(--bb-shadow-gray-50);
543
- --sky-elevation-action-primary-disabled: var(--bb-shadow-gray-0);
544
- --sky-elevation-action-primary-focus: var(--bb-shadow-gray-50);
545
- --sky-elevation-action-primary-hover: var(--bb-shadow-gray-50);
546
- --sky-elevation-action-secondary-active: var(--bb-shadow-gray-0);
547
- --sky-elevation-action-secondary-base: var(--bb-shadow-gray-50);
548
- --sky-elevation-action-secondary-disabled: var(--bb-shadow-gray-0);
549
- --sky-elevation-action-secondary-focus: var(--bb-shadow-gray-50);
550
- --sky-elevation-action-secondary-hover: var(--bb-shadow-gray-50);
551
- --sky-elevation-action-tertiary-active: var(--bb-shadow-gray-0);
552
- --sky-elevation-action-tertiary-base: var(--bb-shadow-gray-0);
553
- --sky-elevation-action-tertiary-disabled: var(--bb-shadow-gray-0);
554
- --sky-elevation-action-tertiary-focus: var(--bb-shadow-gray-0);
555
- --sky-elevation-action-tertiary-hover: var(--bb-shadow-gray-50);
556
- --sky-elevation-focus: var(--bb-shadow-gray-200);
557
- --sky-elevation-input-base: var(--bb-shadow-gray-25);
558
- --sky-elevation-input-disabled: var(--bb-shadow-gray-0);
559
- --sky-elevation-none: var(--bb-shadow-gray-0);
560
- --sky-elevation-overflow: var(--bb-shadow-gray-200);
561
- --sky-elevation-overlay-100: var(--bb-shadow-gray-400);
562
- --sky-elevation-overlay-200: var(--bb-shadow-gray-800);
563
- --sky-elevation-overlay-300: var(--bb-shadow-gray-1600);
564
- --sky-elevation-overlay-400: var(--bb-shadow-gray-2400);
565
- --sky-elevation-raised-100: var(--bb-shadow-gray-100);
587
+ --sky-elevation-action-danger-active: var(--bb-shadow-blue-0);
588
+ --sky-elevation-action-danger-disabled: var(--bb-shadow-blue-0);
589
+ --sky-elevation-action-input-disabled: var(--bb-shadow-blue-0);
590
+ --sky-elevation-action-primary-active: var(--bb-shadow-blue-0);
591
+ --sky-elevation-action-primary-disabled: var(--bb-shadow-blue-0);
592
+ --sky-elevation-action-secondary-active: var(--bb-shadow-blue-0);
593
+ --sky-elevation-action-secondary-disabled: var(--bb-shadow-blue-0);
594
+ --sky-elevation-action-tertiary-active: var(--bb-shadow-blue-0);
595
+ --sky-elevation-action-tertiary-base: var(--bb-shadow-blue-0);
596
+ --sky-elevation-action-tertiary-disabled: var(--bb-shadow-blue-0);
597
+ --sky-elevation-action-tertiary-focus: var(--bb-shadow-blue-0);
598
+ --sky-elevation-action-toolbar-active: var(--bb-shadow-blue-0);
599
+ --sky-elevation-action-toolbar-base: var(--bb-shadow-blue-0);
600
+ --sky-elevation-action-toolbar-disabled: var(--bb-shadow-blue-0);
601
+ --sky-elevation-action-toolbar-focus: var(--bb-shadow-blue-0);
602
+ --sky-elevation-input-disabled: var(--bb-shadow-blue-0);
603
+ --sky-elevation-none: var(--bb-shadow-blue-0);
566
604
  --sky-image-logo-primary-src: var(--bb-image-logo-primary-src);
567
605
  --sky-opacity-wait: var(--bb-opacity-600);
606
+ --sky-elevation-action-danger-base: var(--bb-shadow-blue-50);
607
+ --sky-elevation-action-danger-focus: var(--bb-shadow-blue-50);
608
+ --sky-elevation-action-danger-hover: var(--bb-shadow-blue-50);
609
+ --sky-elevation-action-input-active: var(--bb-shadow-blue-25);
610
+ --sky-elevation-action-input-base: var(--bb-shadow-blue-25);
611
+ --sky-elevation-action-input-focus: var(--bb-shadow-blue-25);
612
+ --sky-elevation-action-input-hover: var(--bb-shadow-blue-25);
613
+ --sky-elevation-action-primary-base: var(--bb-shadow-blue-50);
614
+ --sky-elevation-action-primary-focus: var(--bb-shadow-blue-50);
615
+ --sky-elevation-action-primary-hover: var(--bb-shadow-blue-50);
616
+ --sky-elevation-action-secondary-base: var(--bb-shadow-blue-50);
617
+ --sky-elevation-action-secondary-focus: var(--bb-shadow-blue-50);
618
+ --sky-elevation-action-secondary-hover: var(--bb-shadow-blue-50);
619
+ --sky-elevation-action-tertiary-hover: var(--bb-shadow-blue-50);
620
+ --sky-elevation-action-toolbar-hover: var(--bb-shadow-blue-50);
621
+ --sky-elevation-focus: var(--bb-shadow-blue-200);
622
+ --sky-elevation-input-base: var(--bb-shadow-blue-25);
623
+ --sky-elevation-overflow: var(--bb-shadow-blue-200);
624
+ --sky-elevation-overlay-100: var(--bb-shadow-blue-400);
625
+ --sky-elevation-overlay-200: var(--bb-shadow-blue-800);
626
+ --sky-elevation-overlay-300: var(--bb-shadow-blue-1600);
627
+ --sky-elevation-overlay-400: var(--bb-shadow-blue-2400);
628
+ --sky-elevation-raised-100: var(--bb-shadow-blue-100);
568
629
  }
569
630
 
570
- .sky-theme-modern.sky-theme-brand-base, .sky-theme-modern.sky-theme-brand-base .sky-responsive-container-xs, .sky-theme-modern.sky-theme-brand-base .sky-responsive-container-sm, .sky-theme-modern.sky-theme-brand-base .sky-responsive-container-md, .sky-theme-modern.sky-theme-brand-base .sky-responsive-container-lg {
631
+ .sky-theme-modern.sky-theme-brand-base {
571
632
  --sky-font-style-deemphasized-style: italic;
572
633
  --sky-font-style-deemphasized-weight: 400;
573
634
  --sky-font-style-hint-m-style: italic;
@@ -667,6 +728,30 @@
667
728
  --sky-comp-button-toolbar-space-inset-left: var(--bb-size-fluid-50);
668
729
  --sky-comp-button-toolbar-space-inset-right: var(--bb-size-fluid-50);
669
730
  --sky-comp-button-toolbar-space-inset-top: var(--bb-size-fluid-50);
731
+ --sky-comp-card-large-actions-space-inset-bottom: var(--bb-size-fluid-50);
732
+ --sky-comp-card-large-actions-space-inset-left: var(--bb-size-fluid-150);
733
+ --sky-comp-card-large-actions-space-inset-right: var(--bb-size-fluid-150);
734
+ --sky-comp-card-large-actions-space-inset-top: var(--bb-size-fluid-50);
735
+ --sky-comp-card-large-content-space-inset-bottom: var(--bb-size-fluid-150);
736
+ --sky-comp-card-large-content-space-inset-left: var(--bb-size-fluid-150);
737
+ --sky-comp-card-large-content-space-inset-right: var(--bb-size-fluid-150);
738
+ --sky-comp-card-large-content-space-inset-top: var(--bb-size-fluid-150);
739
+ --sky-comp-card-large-header-space-inset-bottom: var(--bb-size-0);
740
+ --sky-comp-card-large-header-space-inset-left: var(--bb-size-fluid-150);
741
+ --sky-comp-card-large-header-space-inset-right: var(--bb-size-fluid-150);
742
+ --sky-comp-card-large-header-space-inset-top: var(--bb-size-fluid-150);
743
+ --sky-comp-card-small-actions-space-inset-bottom: var(--bb-size-fluid-50);
744
+ --sky-comp-card-small-actions-space-inset-left: var(--bb-size-fluid-100);
745
+ --sky-comp-card-small-actions-space-inset-right: var(--bb-size-fluid-100);
746
+ --sky-comp-card-small-actions-space-inset-top: var(--bb-size-fluid-50);
747
+ --sky-comp-card-small-content-space-inset-bottom: var(--bb-size-fluid-100);
748
+ --sky-comp-card-small-content-space-inset-left: var(--bb-size-fluid-100);
749
+ --sky-comp-card-small-content-space-inset-right: var(--bb-size-fluid-100);
750
+ --sky-comp-card-small-content-space-inset-top: var(--bb-size-fluid-100);
751
+ --sky-comp-card-small-header-space-inset-bottom: var(--bb-size-0);
752
+ --sky-comp-card-small-header-space-inset-left: var(--bb-size-fluid-100);
753
+ --sky-comp-card-small-header-space-inset-right: var(--bb-size-fluid-100);
754
+ --sky-comp-card-small-header-space-inset-top: var(--bb-size-fluid-100);
670
755
  --sky-comp-colorpicker-content-space-inset-bottom: var(--bb-size-fluid-50);
671
756
  --sky-comp-colorpicker-content-space-inset-left: var(--bb-size-fluid-75);
672
757
  --sky-comp-colorpicker-content-space-inset-right: var(--bb-size-fluid-75);
@@ -731,74 +816,130 @@
731
816
  --sky-comp-modal-footer-space-inset-left: var(--bb-size-fluid-150);
732
817
  --sky-comp-modal-footer-space-inset-right: var(--bb-size-fluid-150);
733
818
  --sky-comp-modal-footer-space-inset-top: var(--bb-size-fluid-100);
734
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--bb-size-fixed-50);
735
- --sky-comp-modal-fullscreen-space-offset-left: var(--bb-size-fixed-50);
736
- --sky-comp-modal-fullscreen-space-offset-right: var(--bb-size-fixed-50);
737
- --sky-comp-modal-fullscreen-space-offset-top: var(--bb-size-fixed-50);
819
+ --sky-comp-modal-fullscreen-space-offset-sm-bottom: var(--bb-size-fixed-75);
820
+ --sky-comp-modal-fullscreen-space-offset-sm-left: var(--bb-size-fixed-75);
821
+ --sky-comp-modal-fullscreen-space-offset-sm-right: var(--bb-size-fixed-75);
822
+ --sky-comp-modal-fullscreen-space-offset-sm-top: var(--bb-size-fixed-75);
823
+ --sky-comp-modal-fullscreen-space-offset-xs-bottom: var(--bb-size-fixed-50);
824
+ --sky-comp-modal-fullscreen-space-offset-xs-left: var(--bb-size-fixed-50);
825
+ --sky-comp-modal-fullscreen-space-offset-xs-right: var(--bb-size-fixed-50);
826
+ --sky-comp-modal-fullscreen-space-offset-xs-top: var(--bb-size-fixed-50);
738
827
  --sky-comp-modal-header-space-inset-bottom: var(--bb-size-fluid-75);
739
828
  --sky-comp-modal-header-space-inset-left: var(--bb-size-fluid-150);
740
829
  --sky-comp-modal-header-space-inset-right: var(--bb-size-fluid-150);
741
830
  --sky-comp-modal-header-space-inset-top: var(--bb-size-fluid-75);
742
- --sky-comp-modal-space-offset-bottom: var(--bb-size-fixed-50);
743
- --sky-comp-modal-space-offset-left: var(--bb-size-fixed-50);
744
- --sky-comp-modal-space-offset-right: var(--bb-size-fixed-50);
745
- --sky-comp-modal-space-offset-top: var(--bb-size-fixed-50);
831
+ --sky-comp-modal-space-offset-sm-bottom: var(--bb-size-fixed-100);
832
+ --sky-comp-modal-space-offset-sm-left: var(--bb-size-fixed-100);
833
+ --sky-comp-modal-space-offset-sm-right: var(--bb-size-fixed-100);
834
+ --sky-comp-modal-space-offset-sm-top: var(--bb-size-fixed-100);
835
+ --sky-comp-modal-space-offset-xs-bottom: var(--bb-size-fixed-50);
836
+ --sky-comp-modal-space-offset-xs-left: var(--bb-size-fixed-50);
837
+ --sky-comp-modal-space-offset-xs-right: var(--bb-size-fixed-50);
838
+ --sky-comp-modal-space-offset-xs-top: var(--bb-size-fixed-50);
746
839
  --sky-comp-navbar_item-space-inset-bottom: var(--bb-size-fluid-75);
747
840
  --sky-comp-navbar_item-space-inset-left: var(--bb-size-fluid-50);
748
841
  --sky-comp-navbar_item-space-inset-right: var(--bb-size-fluid-50);
749
842
  --sky-comp-navbar_item-space-inset-top: var(--bb-size-fluid-75);
750
- --sky-comp-page-content-blocks-space-inset-bottom: var(--bb-size-fluid-50);
751
- --sky-comp-page-content-blocks-space-inset-left: var(--bb-size-fluid-50);
752
- --sky-comp-page-content-blocks-space-inset-right: var(--bb-size-fluid-50);
753
- --sky-comp-page-content-blocks-space-inset-top: var(--bb-size-fluid-50);
754
- --sky-comp-page-content-fit-space-inset-bottom: var(--bb-size-0);
755
- --sky-comp-page-content-fit-space-inset-left: var(--bb-size-fluid-50);
756
- --sky-comp-page-content-fit-space-inset-right: var(--bb-size-fluid-50);
757
- --sky-comp-page-content-fit-space-inset-top: var(--bb-size-0);
758
- --sky-comp-page-content-list-space-inset-bottom: var(--bb-size-0);
759
- --sky-comp-page-content-list-space-inset-left: var(--bb-size-fluid-50);
760
- --sky-comp-page-content-list-space-inset-right: var(--bb-size-fluid-50);
761
- --sky-comp-page-content-list-space-inset-top: var(--bb-size-0);
762
- --sky-comp-page-content-tabs-space-inset-bottom: var(--bb-size-0);
763
- --sky-comp-page-content-tabs-space-inset-left: var(--bb-size-0);
764
- --sky-comp-page-content-tabs-space-inset-right: var(--bb-size-0);
765
- --sky-comp-page-content-tabs-space-inset-top: var(--bb-size-0);
766
- --sky-comp-page-header-blocks-space-inset-bottom: var(--bb-size-fluid-100);
767
- --sky-comp-page-header-blocks-space-inset-left: var(--bb-size-fluid-50);
768
- --sky-comp-page-header-blocks-space-inset-right: var(--bb-size-fluid-50);
769
- --sky-comp-page-header-blocks-space-inset-top: var(--bb-size-fluid-100);
770
- --sky-comp-page-header-fit-space-inset-bottom: var(--bb-size-fluid-100);
771
- --sky-comp-page-header-fit-space-inset-left: var(--bb-size-fluid-50);
772
- --sky-comp-page-header-fit-space-inset-right: var(--bb-size-fluid-50);
773
- --sky-comp-page-header-fit-space-inset-top: var(--bb-size-fluid-100);
774
- --sky-comp-page-header-list-space-inset-bottom: var(--bb-size-fluid-100);
775
- --sky-comp-page-header-list-space-inset-left: var(--bb-size-fluid-50);
776
- --sky-comp-page-header-list-space-inset-right: var(--bb-size-fluid-50);
777
- --sky-comp-page-header-list-space-inset-top: var(--bb-size-fluid-100);
778
- --sky-comp-page-header-tabs-space-inset-bottom: var(--bb-size-fluid-100);
779
- --sky-comp-page-header-tabs-space-inset-left: var(--bb-size-fluid-50);
780
- --sky-comp-page-header-tabs-space-inset-right: var(--bb-size-fluid-50);
781
- --sky-comp-page-header-tabs-space-inset-top: var(--bb-size-fluid-100);
782
- --sky-comp-page-links-blocks-space-inset-bottom: var(--bb-size-fluid-150);
783
- --sky-comp-page-links-blocks-space-inset-left: var(--bb-size-fluid-50);
784
- --sky-comp-page-links-blocks-space-inset-right: var(--bb-size-fluid-50);
785
- --sky-comp-page-links-blocks-space-inset-top: var(--bb-size-fluid-150);
786
- --sky-comp-page-links-list-space-inset-bottom: var(--bb-size-fluid-150);
787
- --sky-comp-page-links-list-space-inset-left: var(--bb-size-fluid-50);
788
- --sky-comp-page-links-list-space-inset-right: var(--bb-size-fluid-50);
789
- --sky-comp-page-links-list-space-inset-top: var(--bb-size-fluid-150);
790
- --sky-comp-page-links-tabs-space-inset-bottom: var(--bb-size-fluid-150);
791
- --sky-comp-page-links-tabs-space-inset-left: var(--bb-size-fluid-50);
792
- --sky-comp-page-links-tabs-space-inset-right: var(--bb-size-fluid-50);
793
- --sky-comp-page-links-tabs-space-inset-top: var(--bb-size-fluid-150);
794
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--bb-size-0);
795
- --sky-comp-page-tabset-tabs-space-inset-left: var(--bb-size-fluid-50);
796
- --sky-comp-page-tabset-tabs-space-inset-right: var(--bb-size-0);
797
- --sky-comp-page-tabset-tabs-space-inset-top: var(--bb-size-0);
798
- --sky-comp-paging_button-space-inset-bottom: var(--bb-size-fluid-12);
843
+ --sky-comp-page-content-blocks-space-inset-sm-bottom: var(--bb-size-fluid-150);
844
+ --sky-comp-page-content-blocks-space-inset-sm-left: var(--bb-size-fluid-150);
845
+ --sky-comp-page-content-blocks-space-inset-sm-right: var(--bb-size-fluid-150);
846
+ --sky-comp-page-content-blocks-space-inset-sm-top: var(--bb-size-fluid-150);
847
+ --sky-comp-page-content-blocks-space-inset-xs-bottom: var(--bb-size-fluid-50);
848
+ --sky-comp-page-content-blocks-space-inset-xs-left: var(--bb-size-fluid-50);
849
+ --sky-comp-page-content-blocks-space-inset-xs-right: var(--bb-size-fluid-50);
850
+ --sky-comp-page-content-blocks-space-inset-xs-top: var(--bb-size-fluid-50);
851
+ --sky-comp-page-content-fit-space-inset-sm-bottom: var(--bb-size-0);
852
+ --sky-comp-page-content-fit-space-inset-sm-left: var(--bb-size-0);
853
+ --sky-comp-page-content-fit-space-inset-sm-right: var(--bb-size-0);
854
+ --sky-comp-page-content-fit-space-inset-sm-top: var(--bb-size-0);
855
+ --sky-comp-page-content-fit-space-inset-xs-bottom: var(--bb-size-0);
856
+ --sky-comp-page-content-fit-space-inset-xs-left: var(--bb-size-0);
857
+ --sky-comp-page-content-fit-space-inset-xs-right: var(--bb-size-0);
858
+ --sky-comp-page-content-fit-space-inset-xs-top: var(--bb-size-0);
859
+ --sky-comp-page-content-list-space-inset-sm-bottom: var(--bb-size-0);
860
+ --sky-comp-page-content-list-space-inset-sm-left: var(--bb-size-0);
861
+ --sky-comp-page-content-list-space-inset-sm-right: var(--bb-size-0);
862
+ --sky-comp-page-content-list-space-inset-sm-top: var(--bb-size-0);
863
+ --sky-comp-page-content-list-space-inset-xs-bottom: var(--bb-size-0);
864
+ --sky-comp-page-content-list-space-inset-xs-left: var(--bb-size-0);
865
+ --sky-comp-page-content-list-space-inset-xs-right: var(--bb-size-0);
866
+ --sky-comp-page-content-list-space-inset-xs-top: var(--bb-size-0);
867
+ --sky-comp-page-content-tabs-space-inset-sm-bottom: var(--bb-size-0);
868
+ --sky-comp-page-content-tabs-space-inset-sm-left: var(--bb-size-0);
869
+ --sky-comp-page-content-tabs-space-inset-sm-right: var(--bb-size-0);
870
+ --sky-comp-page-content-tabs-space-inset-sm-top: var(--bb-size-0);
871
+ --sky-comp-page-content-tabs-space-inset-xs-bottom: var(--bb-size-0);
872
+ --sky-comp-page-content-tabs-space-inset-xs-left: var(--bb-size-0);
873
+ --sky-comp-page-content-tabs-space-inset-xs-right: var(--bb-size-0);
874
+ --sky-comp-page-content-tabs-space-inset-xs-top: var(--bb-size-0);
875
+ --sky-comp-page-header-blocks-space-inset-sm-bottom: var(--bb-size-0);
876
+ --sky-comp-page-header-blocks-space-inset-sm-left: var(--bb-size-fluid-150);
877
+ --sky-comp-page-header-blocks-space-inset-sm-right: var(--bb-size-fluid-150);
878
+ --sky-comp-page-header-blocks-space-inset-sm-top: var(--bb-size-fluid-150);
879
+ --sky-comp-page-header-blocks-space-inset-xs-bottom: var(--bb-size-fluid-100);
880
+ --sky-comp-page-header-blocks-space-inset-xs-left: var(--bb-size-fluid-50);
881
+ --sky-comp-page-header-blocks-space-inset-xs-right: var(--bb-size-fluid-50);
882
+ --sky-comp-page-header-blocks-space-inset-xs-top: var(--bb-size-fluid-100);
883
+ --sky-comp-page-header-fit-space-inset-sm-bottom: var(--bb-size-fluid-100);
884
+ --sky-comp-page-header-fit-space-inset-sm-left: var(--bb-size-fluid-150);
885
+ --sky-comp-page-header-fit-space-inset-sm-right: var(--bb-size-fluid-150);
886
+ --sky-comp-page-header-fit-space-inset-sm-top: var(--bb-size-fluid-150);
887
+ --sky-comp-page-header-fit-space-inset-xs-bottom: var(--bb-size-fluid-100);
888
+ --sky-comp-page-header-fit-space-inset-xs-left: var(--bb-size-fluid-50);
889
+ --sky-comp-page-header-fit-space-inset-xs-right: var(--bb-size-fluid-50);
890
+ --sky-comp-page-header-fit-space-inset-xs-top: var(--bb-size-fluid-100);
891
+ --sky-comp-page-header-list-space-inset-sm-bottom: var(--bb-size-fluid-100);
892
+ --sky-comp-page-header-list-space-inset-sm-left: var(--bb-size-fluid-150);
893
+ --sky-comp-page-header-list-space-inset-sm-right: var(--bb-size-fluid-150);
894
+ --sky-comp-page-header-list-space-inset-sm-top: var(--bb-size-fluid-150);
895
+ --sky-comp-page-header-list-space-inset-xs-bottom: var(--bb-size-fluid-100);
896
+ --sky-comp-page-header-list-space-inset-xs-left: var(--bb-size-fluid-50);
897
+ --sky-comp-page-header-list-space-inset-xs-right: var(--bb-size-fluid-50);
898
+ --sky-comp-page-header-list-space-inset-xs-top: var(--bb-size-fluid-100);
899
+ --sky-comp-page-header-tabs-space-inset-sm-bottom: var(--bb-size-fluid-100);
900
+ --sky-comp-page-header-tabs-space-inset-sm-left: var(--bb-size-fluid-150);
901
+ --sky-comp-page-header-tabs-space-inset-sm-right: var(--bb-size-fluid-150);
902
+ --sky-comp-page-header-tabs-space-inset-sm-top: var(--bb-size-fluid-150);
903
+ --sky-comp-page-header-tabs-space-inset-xs-bottom: var(--bb-size-fluid-100);
904
+ --sky-comp-page-header-tabs-space-inset-xs-left: var(--bb-size-fluid-50);
905
+ --sky-comp-page-header-tabs-space-inset-xs-right: var(--bb-size-fluid-50);
906
+ --sky-comp-page-header-tabs-space-inset-xs-top: var(--bb-size-fluid-100);
907
+ --sky-comp-page-links-blocks-space-inset-sm-bottom: var(--bb-size-fluid-150);
908
+ --sky-comp-page-links-blocks-space-inset-sm-left: var(--bb-size-fluid-150);
909
+ --sky-comp-page-links-blocks-space-inset-sm-right: var(--bb-size-fluid-150);
910
+ --sky-comp-page-links-blocks-space-inset-sm-top: var(--bb-size-fluid-150);
911
+ --sky-comp-page-links-blocks-space-inset-xs-bottom: var(--bb-size-fluid-150);
912
+ --sky-comp-page-links-blocks-space-inset-xs-left: var(--bb-size-fluid-50);
913
+ --sky-comp-page-links-blocks-space-inset-xs-right: var(--bb-size-fluid-50);
914
+ --sky-comp-page-links-blocks-space-inset-xs-top: var(--bb-size-fluid-150);
915
+ --sky-comp-page-links-list-space-inset-sm-bottom: var(--bb-size-fluid-150);
916
+ --sky-comp-page-links-list-space-inset-sm-left: var(--bb-size-fluid-150);
917
+ --sky-comp-page-links-list-space-inset-sm-right: var(--bb-size-fluid-150);
918
+ --sky-comp-page-links-list-space-inset-sm-top: var(--bb-size-fluid-150);
919
+ --sky-comp-page-links-list-space-inset-xs-bottom: var(--bb-size-fluid-150);
920
+ --sky-comp-page-links-list-space-inset-xs-left: var(--bb-size-fluid-50);
921
+ --sky-comp-page-links-list-space-inset-xs-right: var(--bb-size-fluid-50);
922
+ --sky-comp-page-links-list-space-inset-xs-top: var(--bb-size-fluid-150);
923
+ --sky-comp-page-links-tabs-space-inset-sm-bottom: var(--bb-size-fluid-150);
924
+ --sky-comp-page-links-tabs-space-inset-sm-left: var(--bb-size-fluid-150);
925
+ --sky-comp-page-links-tabs-space-inset-sm-right: var(--bb-size-fluid-150);
926
+ --sky-comp-page-links-tabs-space-inset-sm-top: var(--bb-size-fluid-150);
927
+ --sky-comp-page-links-tabs-space-inset-xs-bottom: var(--bb-size-fluid-150);
928
+ --sky-comp-page-links-tabs-space-inset-xs-left: var(--bb-size-fluid-50);
929
+ --sky-comp-page-links-tabs-space-inset-xs-right: var(--bb-size-fluid-50);
930
+ --sky-comp-page-links-tabs-space-inset-xs-top: var(--bb-size-fluid-150);
931
+ --sky-comp-page-tabset-tabs-space-inset-sm-bottom: var(--bb-size-0);
932
+ --sky-comp-page-tabset-tabs-space-inset-sm-left: var(--bb-size-fluid-150);
933
+ --sky-comp-page-tabset-tabs-space-inset-sm-right: var(--bb-size-0);
934
+ --sky-comp-page-tabset-tabs-space-inset-sm-top: var(--bb-size-0);
935
+ --sky-comp-page-tabset-tabs-space-inset-xs-bottom: var(--bb-size-0);
936
+ --sky-comp-page-tabset-tabs-space-inset-xs-left: var(--bb-size-fluid-50);
937
+ --sky-comp-page-tabset-tabs-space-inset-xs-right: var(--bb-size-0);
938
+ --sky-comp-page-tabset-tabs-space-inset-xs-top: var(--bb-size-0);
939
+ --sky-comp-paging_button-space-inset-bottom: var(--bb-size-fluid-25);
799
940
  --sky-comp-paging_button-space-inset-left: var(--bb-size-fluid-50);
800
941
  --sky-comp-paging_button-space-inset-right: var(--bb-size-fluid-50);
801
- --sky-comp-paging_button-space-inset-top: var(--bb-size-fluid-12);
942
+ --sky-comp-paging_button-space-inset-top: var(--bb-size-fluid-25);
802
943
  --sky-comp-popover-content-space-inset-bottom: var(--bb-size-fluid-100);
803
944
  --sky-comp-popover-content-space-inset-left: var(--bb-size-fluid-100);
804
945
  --sky-comp-popover-content-space-inset-right: var(--bb-size-fluid-100);
@@ -807,6 +948,10 @@
807
948
  --sky-comp-popover-header-space-inset-left: var(--bb-size-fluid-100);
808
949
  --sky-comp-popover-header-space-inset-right: var(--bb-size-fluid-100);
809
950
  --sky-comp-popover-header-space-inset-top: var(--bb-size-fluid-100);
951
+ --sky-comp-repeater_item-checkbox-space-offset-bottom: var(--bb-size-fluid-25);
952
+ --sky-comp-repeater_item-checkbox-space-offset-left: var(--bb-size-0);
953
+ --sky-comp-repeater_item-checkbox-space-offset-right: var(--bb-size-0);
954
+ --sky-comp-repeater_item-checkbox-space-offset-top: var(--bb-size-fluid-25);
810
955
  --sky-comp-repeater_item-space-inset-bottom: var(--bb-size-fluid-75);
811
956
  --sky-comp-repeater_item-space-inset-left: var(--bb-size-fluid-50);
812
957
  --sky-comp-repeater_item-space-inset-right: var(--bb-size-fluid-50);
@@ -839,6 +984,14 @@
839
984
  --sky-comp-selection_box-expanded-space-inset-left: var(--bb-size-fluid-150);
840
985
  --sky-comp-selection_box-expanded-space-inset-right: var(--bb-size-fluid-150);
841
986
  --sky-comp-selection_box-expanded-space-inset-top: var(--bb-size-fluid-150);
987
+ --sky-comp-split_view-drawer-space-inset-sm-bottom: var(--bb-size-fluid-75);
988
+ --sky-comp-split_view-drawer-space-inset-sm-left: var(--bb-size-fluid-75);
989
+ --sky-comp-split_view-drawer-space-inset-sm-right: var(--bb-size-0);
990
+ --sky-comp-split_view-drawer-space-inset-sm-top: var(--bb-size-fluid-75);
991
+ --sky-comp-split_view-drawer-space-inset-xs-bottom: var(--bb-size-fluid-50);
992
+ --sky-comp-split_view-drawer-space-inset-xs-left: var(--bb-size-fluid-50);
993
+ --sky-comp-split_view-drawer-space-inset-xs-right: var(--bb-size-0);
994
+ --sky-comp-split_view-drawer-space-inset-xs-top: var(--bb-size-fluid-50);
842
995
  --sky-comp-split_view-footer-space-inset-bottom: var(--bb-size-fluid-50);
843
996
  --sky-comp-split_view-footer-space-inset-left: var(--bb-size-fluid-50);
844
997
  --sky-comp-split_view-footer-space-inset-right: var(--bb-size-fluid-50);
@@ -847,10 +1000,14 @@
847
1000
  --sky-comp-tab-horizontal-space-inset-left: var(--bb-size-fluid-75);
848
1001
  --sky-comp-tab-horizontal-space-inset-right: var(--bb-size-fluid-75);
849
1002
  --sky-comp-tab-horizontal-space-inset-top: var(--bb-size-fluid-50);
850
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--bb-size-fluid-75);
851
- --sky-comp-tab-vertical-content-space-inset-left: var(--bb-size-fluid-75);
852
- --sky-comp-tab-vertical-content-space-inset-right: var(--bb-size-fluid-75);
853
- --sky-comp-tab-vertical-content-space-inset-top: var(--bb-size-fluid-75);
1003
+ --sky-comp-tab-vertical-content-space-inset-sm-bottom: var(--bb-size-fluid-50);
1004
+ --sky-comp-tab-vertical-content-space-inset-sm-left: var(--bb-size-fluid-75);
1005
+ --sky-comp-tab-vertical-content-space-inset-sm-right: var(--bb-size-fluid-75);
1006
+ --sky-comp-tab-vertical-content-space-inset-sm-top: var(--bb-size-fluid-50);
1007
+ --sky-comp-tab-vertical-content-space-inset-xs-bottom: var(--bb-size-fluid-75);
1008
+ --sky-comp-tab-vertical-content-space-inset-xs-left: var(--bb-size-fluid-75);
1009
+ --sky-comp-tab-vertical-content-space-inset-xs-right: var(--bb-size-fluid-75);
1010
+ --sky-comp-tab-vertical-content-space-inset-xs-top: var(--bb-size-fluid-75);
854
1011
  --sky-comp-tab-vertical-group-button-space-inset-bottom: var(--bb-size-fluid-50);
855
1012
  --sky-comp-tab-vertical-group-button-space-inset-left: var(--bb-size-fluid-50);
856
1013
  --sky-comp-tab-vertical-group-button-space-inset-right: var(--bb-size-fluid-50);
@@ -875,14 +1032,22 @@
875
1032
  --sky-comp-text_editor-space-inset-left: var(--bb-size-fluid-75);
876
1033
  --sky-comp-text_editor-space-inset-right: var(--bb-size-fluid-75);
877
1034
  --sky-comp-text_editor-space-inset-top: var(--bb-size-fluid-75);
878
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--bb-size-0);
879
- --sky-comp-tile-dashboard-column-space-inset-left: var(--bb-size-0);
880
- --sky-comp-tile-dashboard-column-space-inset-right: var(--bb-size-0);
881
- --sky-comp-tile-dashboard-column-space-inset-top: var(--bb-size-0);
882
- --sky-comp-tile-dashboard-space-inset-bottom: var(--bb-size-0);
883
- --sky-comp-tile-dashboard-space-inset-left: var(--bb-size-0);
884
- --sky-comp-tile-dashboard-space-inset-right: var(--bb-size-0);
885
- --sky-comp-tile-dashboard-space-inset-top: var(--bb-size-0);
1035
+ --sky-comp-tile-dashboard-column-space-inset-sm-bottom: var(--bb-size-0);
1036
+ --sky-comp-tile-dashboard-column-space-inset-sm-left: var(--bb-size-fluid-75);
1037
+ --sky-comp-tile-dashboard-column-space-inset-sm-right: var(--bb-size-fluid-75);
1038
+ --sky-comp-tile-dashboard-column-space-inset-sm-top: var(--bb-size-0);
1039
+ --sky-comp-tile-dashboard-column-space-inset-xs-bottom: var(--bb-size-0);
1040
+ --sky-comp-tile-dashboard-column-space-inset-xs-left: var(--bb-size-0);
1041
+ --sky-comp-tile-dashboard-column-space-inset-xs-right: var(--bb-size-0);
1042
+ --sky-comp-tile-dashboard-column-space-inset-xs-top: var(--bb-size-0);
1043
+ --sky-comp-tile-dashboard-space-inset-sm-bottom: var(--bb-size-0);
1044
+ --sky-comp-tile-dashboard-space-inset-sm-left: var(--bb-size-fluid-50);
1045
+ --sky-comp-tile-dashboard-space-inset-sm-right: var(--bb-size-fluid-50);
1046
+ --sky-comp-tile-dashboard-space-inset-sm-top: var(--bb-size-0);
1047
+ --sky-comp-tile-dashboard-space-inset-xs-bottom: var(--bb-size-0);
1048
+ --sky-comp-tile-dashboard-space-inset-xs-left: var(--bb-size-0);
1049
+ --sky-comp-tile-dashboard-space-inset-xs-right: var(--bb-size-0);
1050
+ --sky-comp-tile-dashboard-space-inset-xs-top: var(--bb-size-0);
886
1051
  --sky-comp-tile-section-space-inset-bottom: var(--bb-size-fluid-75);
887
1052
  --sky-comp-tile-section-space-inset-left: var(--bb-size-0);
888
1053
  --sky-comp-tile-section-space-inset-right: var(--bb-size-0);
@@ -978,7 +1143,7 @@
978
1143
  --sky-font-style-display-3: var(--bb-font-style-regular);
979
1144
  --sky-font-style-display-4: var(--bb-font-style-regular);
980
1145
  --sky-font-style-emphasized: var(--bb-font-style-semibold);
981
- --sky-font-style-heading-1: var(--bb-font-style-semibold);
1146
+ --sky-font-style-heading-1: var(--bb-font-style-regular);
982
1147
  --sky-font-style-heading-2: var(--bb-font-style-semibold);
983
1148
  --sky-font-style-heading-3: var(--bb-font-style-semibold);
984
1149
  --sky-font-style-heading-4: var(--bb-font-style-semibold);
@@ -1049,6 +1214,7 @@
1049
1214
  --sky-space-gap-stacked_supplemental-m: var(--bb-size-fluid-50);
1050
1215
  --sky-space-gap-stacked_supplemental-s: var(--bb-size-fluid-25);
1051
1216
  --sky-space-gap-stacked_supplemental-xl: var(--bb-size-fluid-100);
1217
+ --sky-space-gap-stacked_supplemental-xs: var(--bb-size-fluid-12);
1052
1218
  --sky-space-gap-text_action-l: var(--bb-size-fluid-100);
1053
1219
  --sky-space-gap-text_action-m: var(--bb-size-fluid-75);
1054
1220
  --sky-space-gap-text_action-s: var(--bb-size-fluid-50);
@@ -1143,157 +1309,6 @@
1143
1309
  --sky-type-input-label: var(--sky-font-style-input-label) var(--sky-font-size-input-label)/var(--sky-font-line_height-input-label) var(--sky-font-family-primary);
1144
1310
  }
1145
1311
 
1146
- @media (min-width: 768px) {
1147
- .sky-theme-modern.sky-theme-brand-base {
1148
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--bb-size-fixed-75);
1149
- --sky-comp-modal-fullscreen-space-offset-left: var(--bb-size-fixed-75);
1150
- --sky-comp-modal-fullscreen-space-offset-right: var(--bb-size-fixed-75);
1151
- --sky-comp-modal-fullscreen-space-offset-top: var(--bb-size-fixed-75);
1152
- --sky-comp-modal-space-offset-bottom: var(--bb-size-fixed-100);
1153
- --sky-comp-modal-space-offset-left: var(--bb-size-fixed-100);
1154
- --sky-comp-modal-space-offset-right: var(--bb-size-fixed-100);
1155
- --sky-comp-modal-space-offset-top: var(--bb-size-fixed-100);
1156
- --sky-comp-page-content-blocks-space-inset-bottom: var(--bb-size-fluid-150);
1157
- --sky-comp-page-content-blocks-space-inset-left: var(--bb-size-fluid-150);
1158
- --sky-comp-page-content-blocks-space-inset-right: var(--bb-size-fluid-150);
1159
- --sky-comp-page-content-blocks-space-inset-top: var(--bb-size-fluid-150);
1160
- --sky-comp-page-content-fit-space-inset-bottom: var(--bb-size-0);
1161
- --sky-comp-page-content-fit-space-inset-left: var(--bb-size-fluid-150);
1162
- --sky-comp-page-content-fit-space-inset-right: var(--bb-size-fluid-150);
1163
- --sky-comp-page-content-fit-space-inset-top: var(--bb-size-0);
1164
- --sky-comp-page-content-list-space-inset-bottom: var(--bb-size-0);
1165
- --sky-comp-page-content-list-space-inset-left: var(--bb-size-fluid-150);
1166
- --sky-comp-page-content-list-space-inset-right: var(--bb-size-fluid-150);
1167
- --sky-comp-page-content-list-space-inset-top: var(--bb-size-0);
1168
- --sky-comp-page-content-tabs-space-inset-bottom: var(--bb-size-0);
1169
- --sky-comp-page-content-tabs-space-inset-left: var(--bb-size-0);
1170
- --sky-comp-page-content-tabs-space-inset-right: var(--bb-size-0);
1171
- --sky-comp-page-content-tabs-space-inset-top: var(--bb-size-0);
1172
- --sky-comp-page-header-blocks-space-inset-bottom: var(--bb-size-0);
1173
- --sky-comp-page-header-blocks-space-inset-left: var(--bb-size-fluid-150);
1174
- --sky-comp-page-header-blocks-space-inset-right: var(--bb-size-fluid-150);
1175
- --sky-comp-page-header-blocks-space-inset-top: var(--bb-size-fluid-150);
1176
- --sky-comp-page-header-fit-space-inset-bottom: var(--bb-size-fluid-100);
1177
- --sky-comp-page-header-fit-space-inset-left: var(--bb-size-fluid-150);
1178
- --sky-comp-page-header-fit-space-inset-right: var(--bb-size-fluid-150);
1179
- --sky-comp-page-header-fit-space-inset-top: var(--bb-size-fluid-150);
1180
- --sky-comp-page-header-list-space-inset-bottom: var(--bb-size-fluid-100);
1181
- --sky-comp-page-header-list-space-inset-left: var(--bb-size-fluid-150);
1182
- --sky-comp-page-header-list-space-inset-right: var(--bb-size-fluid-150);
1183
- --sky-comp-page-header-list-space-inset-top: var(--bb-size-fluid-150);
1184
- --sky-comp-page-header-tabs-space-inset-bottom: var(--bb-size-fluid-100);
1185
- --sky-comp-page-header-tabs-space-inset-left: var(--bb-size-fluid-150);
1186
- --sky-comp-page-header-tabs-space-inset-right: var(--bb-size-fluid-150);
1187
- --sky-comp-page-header-tabs-space-inset-top: var(--bb-size-fluid-150);
1188
- --sky-comp-page-links-blocks-space-inset-bottom: var(--bb-size-fluid-150);
1189
- --sky-comp-page-links-blocks-space-inset-left: var(--bb-size-fluid-150);
1190
- --sky-comp-page-links-blocks-space-inset-right: var(--bb-size-fluid-150);
1191
- --sky-comp-page-links-blocks-space-inset-top: var(--bb-size-fluid-150);
1192
- --sky-comp-page-links-list-space-inset-bottom: var(--bb-size-fluid-150);
1193
- --sky-comp-page-links-list-space-inset-left: var(--bb-size-fluid-150);
1194
- --sky-comp-page-links-list-space-inset-right: var(--bb-size-fluid-150);
1195
- --sky-comp-page-links-list-space-inset-top: var(--bb-size-fluid-150);
1196
- --sky-comp-page-links-tabs-space-inset-bottom: var(--bb-size-fluid-150);
1197
- --sky-comp-page-links-tabs-space-inset-left: var(--bb-size-fluid-150);
1198
- --sky-comp-page-links-tabs-space-inset-right: var(--bb-size-fluid-150);
1199
- --sky-comp-page-links-tabs-space-inset-top: var(--bb-size-fluid-150);
1200
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--bb-size-0);
1201
- --sky-comp-page-tabset-tabs-space-inset-left: var(--bb-size-fluid-150);
1202
- --sky-comp-page-tabset-tabs-space-inset-right: var(--bb-size-0);
1203
- --sky-comp-page-tabset-tabs-space-inset-top: var(--bb-size-0);
1204
- --sky-comp-search-space-inset-bottom: var(--bb-size-fluid-50);
1205
- --sky-comp-search-space-inset-left: var(--bb-size-fluid-50);
1206
- --sky-comp-search-space-inset-right: var(--bb-size-fluid-50);
1207
- --sky-comp-search-space-inset-top: var(--bb-size-fluid-50);
1208
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--bb-size-fluid-50);
1209
- --sky-comp-tab-vertical-content-space-inset-left: var(--bb-size-fluid-75);
1210
- --sky-comp-tab-vertical-content-space-inset-right: var(--bb-size-fluid-75);
1211
- --sky-comp-tab-vertical-content-space-inset-top: var(--bb-size-fluid-50);
1212
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--bb-size-0);
1213
- --sky-comp-tile-dashboard-column-space-inset-left: var(--bb-size-fluid-75);
1214
- --sky-comp-tile-dashboard-column-space-inset-right: var(--bb-size-fluid-75);
1215
- --sky-comp-tile-dashboard-column-space-inset-top: var(--bb-size-0);
1216
- --sky-comp-tile-dashboard-space-inset-bottom: var(--bb-size-0);
1217
- --sky-comp-tile-dashboard-space-inset-left: var(--bb-size-fluid-50);
1218
- --sky-comp-tile-dashboard-space-inset-right: var(--bb-size-fluid-50);
1219
- --sky-comp-tile-dashboard-space-inset-top: var(--bb-size-0);
1220
- }
1221
- }
1222
- .sky-theme-modern.sky-theme-brand-base .sky-responsive-container-sm, .sky-theme-modern.sky-theme-brand-base .sky-responsive-container-md, .sky-theme-modern.sky-theme-brand-base .sky-responsive-container-lg {
1223
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--bb-size-fixed-75);
1224
- --sky-comp-modal-fullscreen-space-offset-left: var(--bb-size-fixed-75);
1225
- --sky-comp-modal-fullscreen-space-offset-right: var(--bb-size-fixed-75);
1226
- --sky-comp-modal-fullscreen-space-offset-top: var(--bb-size-fixed-75);
1227
- --sky-comp-modal-space-offset-bottom: var(--bb-size-fixed-100);
1228
- --sky-comp-modal-space-offset-left: var(--bb-size-fixed-100);
1229
- --sky-comp-modal-space-offset-right: var(--bb-size-fixed-100);
1230
- --sky-comp-modal-space-offset-top: var(--bb-size-fixed-100);
1231
- --sky-comp-page-content-blocks-space-inset-bottom: var(--bb-size-fluid-150);
1232
- --sky-comp-page-content-blocks-space-inset-left: var(--bb-size-fluid-150);
1233
- --sky-comp-page-content-blocks-space-inset-right: var(--bb-size-fluid-150);
1234
- --sky-comp-page-content-blocks-space-inset-top: var(--bb-size-fluid-150);
1235
- --sky-comp-page-content-fit-space-inset-bottom: var(--bb-size-0);
1236
- --sky-comp-page-content-fit-space-inset-left: var(--bb-size-fluid-150);
1237
- --sky-comp-page-content-fit-space-inset-right: var(--bb-size-fluid-150);
1238
- --sky-comp-page-content-fit-space-inset-top: var(--bb-size-0);
1239
- --sky-comp-page-content-list-space-inset-bottom: var(--bb-size-0);
1240
- --sky-comp-page-content-list-space-inset-left: var(--bb-size-fluid-150);
1241
- --sky-comp-page-content-list-space-inset-right: var(--bb-size-fluid-150);
1242
- --sky-comp-page-content-list-space-inset-top: var(--bb-size-0);
1243
- --sky-comp-page-content-tabs-space-inset-bottom: var(--bb-size-0);
1244
- --sky-comp-page-content-tabs-space-inset-left: var(--bb-size-0);
1245
- --sky-comp-page-content-tabs-space-inset-right: var(--bb-size-0);
1246
- --sky-comp-page-content-tabs-space-inset-top: var(--bb-size-0);
1247
- --sky-comp-page-header-blocks-space-inset-bottom: var(--bb-size-0);
1248
- --sky-comp-page-header-blocks-space-inset-left: var(--bb-size-fluid-150);
1249
- --sky-comp-page-header-blocks-space-inset-right: var(--bb-size-fluid-150);
1250
- --sky-comp-page-header-blocks-space-inset-top: var(--bb-size-fluid-150);
1251
- --sky-comp-page-header-fit-space-inset-bottom: var(--bb-size-fluid-100);
1252
- --sky-comp-page-header-fit-space-inset-left: var(--bb-size-fluid-150);
1253
- --sky-comp-page-header-fit-space-inset-right: var(--bb-size-fluid-150);
1254
- --sky-comp-page-header-fit-space-inset-top: var(--bb-size-fluid-150);
1255
- --sky-comp-page-header-list-space-inset-bottom: var(--bb-size-fluid-100);
1256
- --sky-comp-page-header-list-space-inset-left: var(--bb-size-fluid-150);
1257
- --sky-comp-page-header-list-space-inset-right: var(--bb-size-fluid-150);
1258
- --sky-comp-page-header-list-space-inset-top: var(--bb-size-fluid-150);
1259
- --sky-comp-page-header-tabs-space-inset-bottom: var(--bb-size-fluid-100);
1260
- --sky-comp-page-header-tabs-space-inset-left: var(--bb-size-fluid-150);
1261
- --sky-comp-page-header-tabs-space-inset-right: var(--bb-size-fluid-150);
1262
- --sky-comp-page-header-tabs-space-inset-top: var(--bb-size-fluid-150);
1263
- --sky-comp-page-links-blocks-space-inset-bottom: var(--bb-size-fluid-150);
1264
- --sky-comp-page-links-blocks-space-inset-left: var(--bb-size-fluid-150);
1265
- --sky-comp-page-links-blocks-space-inset-right: var(--bb-size-fluid-150);
1266
- --sky-comp-page-links-blocks-space-inset-top: var(--bb-size-fluid-150);
1267
- --sky-comp-page-links-list-space-inset-bottom: var(--bb-size-fluid-150);
1268
- --sky-comp-page-links-list-space-inset-left: var(--bb-size-fluid-150);
1269
- --sky-comp-page-links-list-space-inset-right: var(--bb-size-fluid-150);
1270
- --sky-comp-page-links-list-space-inset-top: var(--bb-size-fluid-150);
1271
- --sky-comp-page-links-tabs-space-inset-bottom: var(--bb-size-fluid-150);
1272
- --sky-comp-page-links-tabs-space-inset-left: var(--bb-size-fluid-150);
1273
- --sky-comp-page-links-tabs-space-inset-right: var(--bb-size-fluid-150);
1274
- --sky-comp-page-links-tabs-space-inset-top: var(--bb-size-fluid-150);
1275
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--bb-size-0);
1276
- --sky-comp-page-tabset-tabs-space-inset-left: var(--bb-size-fluid-150);
1277
- --sky-comp-page-tabset-tabs-space-inset-right: var(--bb-size-0);
1278
- --sky-comp-page-tabset-tabs-space-inset-top: var(--bb-size-0);
1279
- --sky-comp-search-space-inset-bottom: var(--bb-size-fluid-50);
1280
- --sky-comp-search-space-inset-left: var(--bb-size-fluid-50);
1281
- --sky-comp-search-space-inset-right: var(--bb-size-fluid-50);
1282
- --sky-comp-search-space-inset-top: var(--bb-size-fluid-50);
1283
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--bb-size-fluid-50);
1284
- --sky-comp-tab-vertical-content-space-inset-left: var(--bb-size-fluid-75);
1285
- --sky-comp-tab-vertical-content-space-inset-right: var(--bb-size-fluid-75);
1286
- --sky-comp-tab-vertical-content-space-inset-top: var(--bb-size-fluid-50);
1287
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--bb-size-0);
1288
- --sky-comp-tile-dashboard-column-space-inset-left: var(--bb-size-fluid-75);
1289
- --sky-comp-tile-dashboard-column-space-inset-right: var(--bb-size-fluid-75);
1290
- --sky-comp-tile-dashboard-column-space-inset-top: var(--bb-size-0);
1291
- --sky-comp-tile-dashboard-space-inset-bottom: var(--bb-size-0);
1292
- --sky-comp-tile-dashboard-space-inset-left: var(--bb-size-fluid-50);
1293
- --sky-comp-tile-dashboard-space-inset-right: var(--bb-size-fluid-50);
1294
- --sky-comp-tile-dashboard-space-inset-top: var(--bb-size-0);
1295
- }
1296
-
1297
1312
  @property --modern-image-logo-primary-src {
1298
1313
  syntax: "<url>";
1299
1314
  inherits: true;
@@ -1306,6 +1321,7 @@
1306
1321
  --modern-border-radius-round: 50%;
1307
1322
  --modern-border-style-dotted: dotted;
1308
1323
  --modern-border-style-solid: solid;
1324
+ --modern-brand-name: Blackbaud;
1309
1325
  --modern-color-black: #000000;
1310
1326
  --modern-color-blocking: rgba(255, 255, 255, 0.7);
1311
1327
  --modern-color-blue-05: #ebfbff;
@@ -1368,7 +1384,7 @@
1368
1384
  --modern-font-weight-light: 300;
1369
1385
  --modern-font-weight-regular: 400;
1370
1386
  --modern-font-weight-semibold: 600;
1371
- --modern-image-logo-primary-src: url("https://sky.blackbaudcdn.net/static/skyux-design-tokens/0.0.69/assets/images/bb-logo.png");
1387
+ --modern-image-logo-primary-src: url("https://sky.blackbaudcdn.net/static/skyux-design-tokens/2.0.0-alpha.3/assets/images/bb-logo.png");
1372
1388
  --modern-letter_spacing-normal: normal;
1373
1389
  --modern-line_height-110: 1.1;
1374
1390
  --modern-line_height-115: 1.15;
@@ -1376,7 +1392,7 @@
1376
1392
  --modern-line_height-20: 20px;
1377
1393
  --modern-line_height-normal: normal;
1378
1394
  --modern-opacity-600: .6;
1379
- --modern-shadow-size-0: 0 0 0 0 #000000;
1395
+ --modern-shadow-size-0: 0 0 0 0 rgba(0, 0, 0, 0);
1380
1396
  --modern-shadow-thumb: 0 1px 2px 0 rgba(0,0,0,0.5);
1381
1397
  --modern-size-0: 0rem;
1382
1398
  --modern-size-1: 1px;
@@ -1432,6 +1448,7 @@
1432
1448
  }
1433
1449
 
1434
1450
  .sky-theme-modern {
1451
+ --sky-brand-name: var(--modern-brand-name);
1435
1452
  --sky-color-background-action-danger-active: var(--modern-color-red-70);
1436
1453
  --sky-color-background-action-danger-base: var(--modern-color-red-70);
1437
1454
  --sky-color-background-action-danger-disabled: var(--modern-color-gray-07);
@@ -1457,6 +1474,11 @@
1457
1474
  --sky-color-background-action-tertiary-disabled: var(--modern-color-gray-07);
1458
1475
  --sky-color-background-action-tertiary-focus: var(--modern-color-transparent);
1459
1476
  --sky-color-background-action-tertiary-hover: var(--modern-color-transparent);
1477
+ --sky-color-background-action-toolbar-active: var(--modern-color-transparent);
1478
+ --sky-color-background-action-toolbar-base: var(--modern-color-transparent);
1479
+ --sky-color-background-action-toolbar-disabled: var(--modern-color-gray-07);
1480
+ --sky-color-background-action-toolbar-focus: var(--modern-color-transparent);
1481
+ --sky-color-background-action-toolbar-hover: var(--modern-color-transparent);
1460
1482
  --sky-color-background-blocking: var(--modern-color-blocking);
1461
1483
  --sky-color-background-container-base: var(--modern-color-white);
1462
1484
  --sky-color-background-container-danger: var(--modern-color-red-30);
@@ -1489,6 +1511,11 @@
1489
1511
  --sky-color-background-selected-soft: var(--modern-color-blue-05);
1490
1512
  --sky-color-background-selected-success: var(--modern-color-green-30);
1491
1513
  --sky-color-background-selected-warning: var(--modern-color-yellow-30);
1514
+ --sky-color-background-tab-active: var(--modern-color-transparent);
1515
+ --sky-color-background-tab-base: var(--modern-color-transparent);
1516
+ --sky-color-background-tab-disabled: var(--modern-color-transparent);
1517
+ --sky-color-background-tab-focus: var(--modern-color-transparent);
1518
+ --sky-color-background-tab-hover: var(--modern-color-transparent);
1492
1519
  --sky-color-background-text_highlight: var(--modern-color-yellow-40);
1493
1520
  --sky-color-background-thumb-base: var(--modern-color-white);
1494
1521
  --sky-color-background-thumb-disabled: var(--modern-color-gray-07);
@@ -1518,6 +1545,11 @@
1518
1545
  --sky-color-border-action-tertiary-disabled: var(--modern-color-gray-15);
1519
1546
  --sky-color-border-action-tertiary-focus: var(--modern-color-blue-74);
1520
1547
  --sky-color-border-action-tertiary-hover: var(--modern-color-blue-74);
1548
+ --sky-color-border-action-toolbar-active: var(--modern-color-blue-74);
1549
+ --sky-color-border-action-toolbar-base: var(--modern-color-transparent);
1550
+ --sky-color-border-action-toolbar-disabled: var(--modern-color-gray-15);
1551
+ --sky-color-border-action-toolbar-focus: var(--modern-color-blue-74);
1552
+ --sky-color-border-action-toolbar-hover: var(--modern-color-blue-74);
1521
1553
  --sky-color-border-column_divider: var(--modern-color-gray-70);
1522
1554
  --sky-color-border-container-base: var(--modern-color-gray-15);
1523
1555
  --sky-color-border-danger: var(--modern-color-red-50);
@@ -1530,6 +1562,11 @@
1530
1562
  --sky-color-border-input-error: var(--modern-color-red-50);
1531
1563
  --sky-color-border-input-focus: var(--modern-color-blue-74);
1532
1564
  --sky-color-border-input-hover: var(--modern-color-blue-74);
1565
+ --sky-color-border-nav-active: var(--modern-color-transparent);
1566
+ --sky-color-border-nav-base: var(--modern-color-transparent);
1567
+ --sky-color-border-nav-disabled: var(--modern-color-transparent);
1568
+ --sky-color-border-nav-focus: var(--modern-color-blue-74);
1569
+ --sky-color-border-nav-hover: var(--modern-color-transparent);
1533
1570
  --sky-color-border-progress_step: var(--modern-color-gray-50);
1534
1571
  --sky-color-border-selected: var(--modern-color-blue-74);
1535
1572
  --sky-color-border-selected_soft: var(--modern-color-blue-30);
@@ -1547,6 +1584,11 @@
1547
1584
  --sky-color-border-switch-selected-disabled: var(--modern-color-gray-50);
1548
1585
  --sky-color-border-switch-selected-focus: var(--modern-color-blue-74);
1549
1586
  --sky-color-border-switch-selected-hover: var(--modern-color-blue-74);
1587
+ --sky-color-border-tab-active: var(--modern-color-blue-50);
1588
+ --sky-color-border-tab-base: var(--modern-color-transparent);
1589
+ --sky-color-border-tab-disabled: var(--modern-color-transparent);
1590
+ --sky-color-border-tab-focus: var(--modern-color-blue-74);
1591
+ --sky-color-border-tab-hover: var(--modern-color-blue-50);
1550
1592
  --sky-color-border-text_highlight: var(--modern-color-yellow-80);
1551
1593
  --sky-color-border-warning: var(--modern-color-yellow-50);
1552
1594
  --sky-color-category-blue: var(--modern-color-category-sky_blue-40);
@@ -1561,17 +1603,18 @@
1561
1603
  --sky-color-icon-deemphasized: var(--modern-color-gray-70);
1562
1604
  --sky-color-icon-default: var(--modern-color-gray-105);
1563
1605
  --sky-color-icon-info: var(--modern-color-blue-50);
1606
+ --sky-color-icon-input-action: var(--modern-color-gray-70);
1564
1607
  --sky-color-icon-inverse: var(--modern-color-white);
1565
1608
  --sky-color-icon-selected: var(--modern-color-blue-74);
1566
1609
  --sky-color-icon-success: var(--modern-color-green-50);
1567
1610
  --sky-color-icon-warning: var(--modern-color-yellow-50);
1568
1611
  --sky-color-text-action: var(--modern-color-blue-74);
1612
+ --sky-color-text-action_contrast: var(--modern-color-blue-80);
1569
1613
  --sky-color-text-danger: var(--modern-color-red-70);
1570
1614
  --sky-color-text-deemphasized: var(--modern-color-gray-70);
1571
1615
  --sky-color-text-default: var(--modern-color-gray-105);
1572
1616
  --sky-color-text-heading: var(--modern-color-gray-105);
1573
1617
  --sky-color-text-inverse: var(--modern-color-white);
1574
- --sky-color-text-link_highlight: var(--modern-color-blue-80);
1575
1618
  --sky-color-text-selected: var(--modern-color-blue-74);
1576
1619
  --sky-elevation-action-danger-active: var(--modern-shadow-size-0);
1577
1620
  --sky-elevation-action-danger-base: var(--modern-shadow-size-0);
@@ -1593,6 +1636,10 @@
1593
1636
  --sky-elevation-action-tertiary-base: var(--modern-shadow-size-0);
1594
1637
  --sky-elevation-action-tertiary-disabled: var(--modern-shadow-size-0);
1595
1638
  --sky-elevation-action-tertiary-hover: var(--modern-shadow-size-0);
1639
+ --sky-elevation-action-toolbar-active: var(--modern-shadow-size-0);
1640
+ --sky-elevation-action-toolbar-base: var(--modern-shadow-size-0);
1641
+ --sky-elevation-action-toolbar-disabled: var(--modern-shadow-size-0);
1642
+ --sky-elevation-action-toolbar-hover: var(--modern-shadow-size-0);
1596
1643
  --sky-elevation-input-base: var(--modern-shadow-size-0);
1597
1644
  --sky-elevation-input-disabled: var(--modern-shadow-size-0);
1598
1645
  --sky-elevation-none: var(--modern-shadow-size-0);
@@ -1603,6 +1650,7 @@
1603
1650
  --sky-elevation-action-primary-focus: var(--modern-shadow-size-3);
1604
1651
  --sky-elevation-action-secondary-focus: var(--modern-shadow-size-3);
1605
1652
  --sky-elevation-action-tertiary-focus: var(--modern-shadow-size-3);
1653
+ --sky-elevation-action-toolbar-focus: var(--modern-shadow-size-3);
1606
1654
  --sky-elevation-focus: var(--modern-shadow-size-3);
1607
1655
  --sky-elevation-overflow: var(--modern-shadow-size-3);
1608
1656
  --sky-elevation-overlay-100: var(--modern-shadow-size-4);
@@ -1612,7 +1660,7 @@
1612
1660
  --sky-elevation-raised-100: var(--modern-shadow-size-1);
1613
1661
  }
1614
1662
 
1615
- .sky-theme-modern, .sky-theme-modern .sky-responsive-container-xs, .sky-theme-modern .sky-responsive-container-sm, .sky-theme-modern .sky-responsive-container-md, .sky-theme-modern .sky-responsive-container-lg {
1663
+ .sky-theme-modern {
1616
1664
  --sky-font-style-deemphasized-style: italic;
1617
1665
  --sky-font-style-deemphasized-weight: 400;
1618
1666
  --sky-font-style-hint-m-style: italic;
@@ -1712,6 +1760,30 @@
1712
1760
  --sky-comp-button-toolbar-space-inset-left: var(--modern-size-10);
1713
1761
  --sky-comp-button-toolbar-space-inset-right: var(--modern-size-10);
1714
1762
  --sky-comp-button-toolbar-space-inset-top: var(--modern-size-10);
1763
+ --sky-comp-card-large-actions-space-inset-bottom: var(--modern-size-10);
1764
+ --sky-comp-card-large-actions-space-inset-left: var(--modern-size-30);
1765
+ --sky-comp-card-large-actions-space-inset-right: var(--modern-size-30);
1766
+ --sky-comp-card-large-actions-space-inset-top: var(--modern-size-10);
1767
+ --sky-comp-card-large-content-space-inset-bottom: var(--modern-size-30);
1768
+ --sky-comp-card-large-content-space-inset-left: var(--modern-size-30);
1769
+ --sky-comp-card-large-content-space-inset-right: var(--modern-size-30);
1770
+ --sky-comp-card-large-content-space-inset-top: var(--modern-size-30);
1771
+ --sky-comp-card-large-header-space-inset-bottom: var(--modern-size-0);
1772
+ --sky-comp-card-large-header-space-inset-left: var(--modern-size-30);
1773
+ --sky-comp-card-large-header-space-inset-right: var(--modern-size-30);
1774
+ --sky-comp-card-large-header-space-inset-top: var(--modern-size-30);
1775
+ --sky-comp-card-small-actions-space-inset-bottom: var(--modern-size-10);
1776
+ --sky-comp-card-small-actions-space-inset-left: var(--modern-size-15);
1777
+ --sky-comp-card-small-actions-space-inset-right: var(--modern-size-15);
1778
+ --sky-comp-card-small-actions-space-inset-top: var(--modern-size-10);
1779
+ --sky-comp-card-small-content-space-inset-bottom: var(--modern-size-15);
1780
+ --sky-comp-card-small-content-space-inset-left: var(--modern-size-15);
1781
+ --sky-comp-card-small-content-space-inset-right: var(--modern-size-15);
1782
+ --sky-comp-card-small-content-space-inset-top: var(--modern-size-15);
1783
+ --sky-comp-card-small-header-space-inset-bottom: var(--modern-size-0);
1784
+ --sky-comp-card-small-header-space-inset-left: var(--modern-size-15);
1785
+ --sky-comp-card-small-header-space-inset-right: var(--modern-size-15);
1786
+ --sky-comp-card-small-header-space-inset-top: var(--modern-size-15);
1715
1787
  --sky-comp-colorpicker-content-space-inset-bottom: var(--modern-size-15);
1716
1788
  --sky-comp-colorpicker-content-space-inset-left: var(--modern-size-30);
1717
1789
  --sky-comp-colorpicker-content-space-inset-right: var(--modern-size-30);
@@ -1776,70 +1848,126 @@
1776
1848
  --sky-comp-modal-footer-space-inset-left: var(--modern-size-30);
1777
1849
  --sky-comp-modal-footer-space-inset-right: var(--modern-size-30);
1778
1850
  --sky-comp-modal-footer-space-inset-top: var(--modern-size-20);
1779
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-10);
1780
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-10);
1781
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-10);
1782
- --sky-comp-modal-fullscreen-space-offset-top: var(--modern-size-10);
1851
+ --sky-comp-modal-fullscreen-space-offset-sm-bottom: var(--modern-size-15);
1852
+ --sky-comp-modal-fullscreen-space-offset-sm-left: var(--modern-size-15);
1853
+ --sky-comp-modal-fullscreen-space-offset-sm-right: var(--modern-size-15);
1854
+ --sky-comp-modal-fullscreen-space-offset-sm-top: var(--modern-size-15);
1855
+ --sky-comp-modal-fullscreen-space-offset-xs-bottom: var(--modern-size-10);
1856
+ --sky-comp-modal-fullscreen-space-offset-xs-left: var(--modern-size-10);
1857
+ --sky-comp-modal-fullscreen-space-offset-xs-right: var(--modern-size-10);
1858
+ --sky-comp-modal-fullscreen-space-offset-xs-top: var(--modern-size-10);
1783
1859
  --sky-comp-modal-header-space-inset-bottom: var(--modern-size-15);
1784
1860
  --sky-comp-modal-header-space-inset-left: var(--modern-size-30);
1785
1861
  --sky-comp-modal-header-space-inset-right: var(--modern-size-30);
1786
1862
  --sky-comp-modal-header-space-inset-top: var(--modern-size-15);
1787
- --sky-comp-modal-space-offset-bottom: var(--modern-size-10);
1788
- --sky-comp-modal-space-offset-left: var(--modern-size-10);
1789
- --sky-comp-modal-space-offset-right: var(--modern-size-10);
1790
- --sky-comp-modal-space-offset-top: var(--modern-size-10);
1863
+ --sky-comp-modal-space-offset-sm-bottom: var(--modern-size-20);
1864
+ --sky-comp-modal-space-offset-sm-left: var(--modern-size-20);
1865
+ --sky-comp-modal-space-offset-sm-right: var(--modern-size-20);
1866
+ --sky-comp-modal-space-offset-sm-top: var(--modern-size-20);
1867
+ --sky-comp-modal-space-offset-xs-bottom: var(--modern-size-10);
1868
+ --sky-comp-modal-space-offset-xs-left: var(--modern-size-10);
1869
+ --sky-comp-modal-space-offset-xs-right: var(--modern-size-10);
1870
+ --sky-comp-modal-space-offset-xs-top: var(--modern-size-10);
1791
1871
  --sky-comp-navbar_item-space-inset-bottom: var(--modern-space-md);
1792
1872
  --sky-comp-navbar_item-space-inset-left: var(--modern-space-s);
1793
1873
  --sky-comp-navbar_item-space-inset-right: var(--modern-space-s);
1794
1874
  --sky-comp-navbar_item-space-inset-top: var(--modern-space-md);
1795
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-s);
1796
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-s);
1797
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-s);
1798
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-s);
1799
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
1800
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-s);
1801
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-s);
1802
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
1803
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
1804
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-s);
1805
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-s);
1806
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
1807
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
1808
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
1809
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
1810
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
1811
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-space-lg);
1812
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-s);
1813
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-s);
1814
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-lg);
1815
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
1816
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-s);
1817
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-s);
1818
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-lg);
1819
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
1820
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-s);
1821
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-s);
1822
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-lg);
1823
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
1824
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-s);
1825
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-s);
1826
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-lg);
1827
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
1828
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-s);
1829
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-s);
1830
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
1831
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
1832
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-s);
1833
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-s);
1834
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
1835
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
1836
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-s);
1837
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-s);
1838
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
1839
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
1840
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-md);
1841
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
1842
- --sky-comp-page-tabset-tabs-space-inset-top: var(--modern-size-0);
1875
+ --sky-comp-page-content-blocks-space-inset-sm-bottom: var(--modern-space-xl);
1876
+ --sky-comp-page-content-blocks-space-inset-sm-left: var(--modern-space-xl);
1877
+ --sky-comp-page-content-blocks-space-inset-sm-right: var(--modern-space-xl);
1878
+ --sky-comp-page-content-blocks-space-inset-sm-top: var(--modern-space-xl);
1879
+ --sky-comp-page-content-blocks-space-inset-xs-bottom: var(--modern-space-s);
1880
+ --sky-comp-page-content-blocks-space-inset-xs-left: var(--modern-space-s);
1881
+ --sky-comp-page-content-blocks-space-inset-xs-right: var(--modern-space-s);
1882
+ --sky-comp-page-content-blocks-space-inset-xs-top: var(--modern-space-s);
1883
+ --sky-comp-page-content-fit-space-inset-sm-bottom: var(--modern-size-0);
1884
+ --sky-comp-page-content-fit-space-inset-sm-left: var(--modern-space-xl);
1885
+ --sky-comp-page-content-fit-space-inset-sm-right: var(--modern-space-xl);
1886
+ --sky-comp-page-content-fit-space-inset-sm-top: var(--modern-size-0);
1887
+ --sky-comp-page-content-fit-space-inset-xs-bottom: var(--modern-size-0);
1888
+ --sky-comp-page-content-fit-space-inset-xs-left: var(--modern-space-s);
1889
+ --sky-comp-page-content-fit-space-inset-xs-right: var(--modern-space-s);
1890
+ --sky-comp-page-content-fit-space-inset-xs-top: var(--modern-size-0);
1891
+ --sky-comp-page-content-list-space-inset-sm-bottom: var(--modern-size-0);
1892
+ --sky-comp-page-content-list-space-inset-sm-left: var(--modern-space-xl);
1893
+ --sky-comp-page-content-list-space-inset-sm-right: var(--modern-space-xl);
1894
+ --sky-comp-page-content-list-space-inset-sm-top: var(--modern-size-0);
1895
+ --sky-comp-page-content-list-space-inset-xs-bottom: var(--modern-size-0);
1896
+ --sky-comp-page-content-list-space-inset-xs-left: var(--modern-space-s);
1897
+ --sky-comp-page-content-list-space-inset-xs-right: var(--modern-space-s);
1898
+ --sky-comp-page-content-list-space-inset-xs-top: var(--modern-size-0);
1899
+ --sky-comp-page-content-tabs-space-inset-sm-bottom: var(--modern-size-0);
1900
+ --sky-comp-page-content-tabs-space-inset-sm-left: var(--modern-size-0);
1901
+ --sky-comp-page-content-tabs-space-inset-sm-right: var(--modern-size-0);
1902
+ --sky-comp-page-content-tabs-space-inset-sm-top: var(--modern-size-0);
1903
+ --sky-comp-page-content-tabs-space-inset-xs-bottom: var(--modern-size-0);
1904
+ --sky-comp-page-content-tabs-space-inset-xs-left: var(--modern-size-0);
1905
+ --sky-comp-page-content-tabs-space-inset-xs-right: var(--modern-size-0);
1906
+ --sky-comp-page-content-tabs-space-inset-xs-top: var(--modern-size-0);
1907
+ --sky-comp-page-header-blocks-space-inset-sm-bottom: var(--modern-size-0);
1908
+ --sky-comp-page-header-blocks-space-inset-sm-left: var(--modern-space-xl);
1909
+ --sky-comp-page-header-blocks-space-inset-sm-right: var(--modern-space-xl);
1910
+ --sky-comp-page-header-blocks-space-inset-sm-top: var(--modern-space-xl);
1911
+ --sky-comp-page-header-blocks-space-inset-xs-bottom: var(--modern-space-lg);
1912
+ --sky-comp-page-header-blocks-space-inset-xs-left: var(--modern-space-s);
1913
+ --sky-comp-page-header-blocks-space-inset-xs-right: var(--modern-space-s);
1914
+ --sky-comp-page-header-blocks-space-inset-xs-top: var(--modern-space-lg);
1915
+ --sky-comp-page-header-fit-space-inset-sm-bottom: var(--modern-space-lg);
1916
+ --sky-comp-page-header-fit-space-inset-sm-left: var(--modern-space-xl);
1917
+ --sky-comp-page-header-fit-space-inset-sm-right: var(--modern-space-xl);
1918
+ --sky-comp-page-header-fit-space-inset-sm-top: var(--modern-space-xl);
1919
+ --sky-comp-page-header-fit-space-inset-xs-bottom: var(--modern-space-lg);
1920
+ --sky-comp-page-header-fit-space-inset-xs-left: var(--modern-space-s);
1921
+ --sky-comp-page-header-fit-space-inset-xs-right: var(--modern-space-s);
1922
+ --sky-comp-page-header-fit-space-inset-xs-top: var(--modern-space-lg);
1923
+ --sky-comp-page-header-list-space-inset-sm-bottom: var(--modern-space-lg);
1924
+ --sky-comp-page-header-list-space-inset-sm-left: var(--modern-space-xl);
1925
+ --sky-comp-page-header-list-space-inset-sm-right: var(--modern-space-xl);
1926
+ --sky-comp-page-header-list-space-inset-sm-top: var(--modern-space-xl);
1927
+ --sky-comp-page-header-list-space-inset-xs-bottom: var(--modern-space-lg);
1928
+ --sky-comp-page-header-list-space-inset-xs-left: var(--modern-space-s);
1929
+ --sky-comp-page-header-list-space-inset-xs-right: var(--modern-space-s);
1930
+ --sky-comp-page-header-list-space-inset-xs-top: var(--modern-space-lg);
1931
+ --sky-comp-page-header-tabs-space-inset-sm-bottom: var(--modern-space-lg);
1932
+ --sky-comp-page-header-tabs-space-inset-sm-left: var(--modern-space-xl);
1933
+ --sky-comp-page-header-tabs-space-inset-sm-right: var(--modern-space-xl);
1934
+ --sky-comp-page-header-tabs-space-inset-sm-top: var(--modern-space-xl);
1935
+ --sky-comp-page-header-tabs-space-inset-xs-bottom: var(--modern-space-lg);
1936
+ --sky-comp-page-header-tabs-space-inset-xs-left: var(--modern-space-s);
1937
+ --sky-comp-page-header-tabs-space-inset-xs-right: var(--modern-space-s);
1938
+ --sky-comp-page-header-tabs-space-inset-xs-top: var(--modern-space-lg);
1939
+ --sky-comp-page-links-blocks-space-inset-sm-bottom: var(--modern-space-xl);
1940
+ --sky-comp-page-links-blocks-space-inset-sm-left: var(--modern-space-xl);
1941
+ --sky-comp-page-links-blocks-space-inset-sm-right: var(--modern-space-xl);
1942
+ --sky-comp-page-links-blocks-space-inset-sm-top: var(--modern-space-xl);
1943
+ --sky-comp-page-links-blocks-space-inset-xs-bottom: var(--modern-space-xl);
1944
+ --sky-comp-page-links-blocks-space-inset-xs-left: var(--modern-space-s);
1945
+ --sky-comp-page-links-blocks-space-inset-xs-right: var(--modern-space-s);
1946
+ --sky-comp-page-links-blocks-space-inset-xs-top: var(--modern-space-xl);
1947
+ --sky-comp-page-links-list-space-inset-sm-bottom: var(--modern-space-xl);
1948
+ --sky-comp-page-links-list-space-inset-sm-left: var(--modern-space-xl);
1949
+ --sky-comp-page-links-list-space-inset-sm-right: var(--modern-space-xl);
1950
+ --sky-comp-page-links-list-space-inset-sm-top: var(--modern-space-xl);
1951
+ --sky-comp-page-links-list-space-inset-xs-bottom: var(--modern-space-xl);
1952
+ --sky-comp-page-links-list-space-inset-xs-left: var(--modern-space-s);
1953
+ --sky-comp-page-links-list-space-inset-xs-right: var(--modern-space-s);
1954
+ --sky-comp-page-links-list-space-inset-xs-top: var(--modern-space-xl);
1955
+ --sky-comp-page-links-tabs-space-inset-sm-bottom: var(--modern-space-xl);
1956
+ --sky-comp-page-links-tabs-space-inset-sm-left: var(--modern-space-xl);
1957
+ --sky-comp-page-links-tabs-space-inset-sm-right: var(--modern-space-xl);
1958
+ --sky-comp-page-links-tabs-space-inset-sm-top: var(--modern-space-xl);
1959
+ --sky-comp-page-links-tabs-space-inset-xs-bottom: var(--modern-space-xl);
1960
+ --sky-comp-page-links-tabs-space-inset-xs-left: var(--modern-space-s);
1961
+ --sky-comp-page-links-tabs-space-inset-xs-right: var(--modern-space-s);
1962
+ --sky-comp-page-links-tabs-space-inset-xs-top: var(--modern-space-xl);
1963
+ --sky-comp-page-tabset-tabs-space-inset-sm-bottom: var(--modern-size-0);
1964
+ --sky-comp-page-tabset-tabs-space-inset-sm-left: var(--modern-space-xl);
1965
+ --sky-comp-page-tabset-tabs-space-inset-sm-right: var(--modern-size-0);
1966
+ --sky-comp-page-tabset-tabs-space-inset-sm-top: var(--modern-size-0);
1967
+ --sky-comp-page-tabset-tabs-space-inset-xs-bottom: var(--modern-size-0);
1968
+ --sky-comp-page-tabset-tabs-space-inset-xs-left: var(--modern-space-md);
1969
+ --sky-comp-page-tabset-tabs-space-inset-xs-right: var(--modern-size-0);
1970
+ --sky-comp-page-tabset-tabs-space-inset-xs-top: var(--modern-size-0);
1843
1971
  --sky-comp-paging_button-space-inset-bottom: var(--modern-size-4);
1844
1972
  --sky-comp-paging_button-space-inset-left: var(--modern-size-15);
1845
1973
  --sky-comp-paging_button-space-inset-right: var(--modern-size-15);
@@ -1852,6 +1980,10 @@
1852
1980
  --sky-comp-popover-header-space-inset-left: var(--modern-space-lg);
1853
1981
  --sky-comp-popover-header-space-inset-right: var(--modern-space-lg);
1854
1982
  --sky-comp-popover-header-space-inset-top: var(--modern-space-lg);
1983
+ --sky-comp-repeater_item-checkbox-space-offset-bottom: var(--modern-size-0);
1984
+ --sky-comp-repeater_item-checkbox-space-offset-left: var(--modern-size-0);
1985
+ --sky-comp-repeater_item-checkbox-space-offset-right: var(--modern-size-0);
1986
+ --sky-comp-repeater_item-checkbox-space-offset-top: var(--modern-size-0);
1855
1987
  --sky-comp-repeater_item-space-inset-bottom: var(--modern-space-md);
1856
1988
  --sky-comp-repeater_item-space-inset-left: var(--modern-space-s);
1857
1989
  --sky-comp-repeater_item-space-inset-right: var(--modern-space-s);
@@ -1884,6 +2016,14 @@
1884
2016
  --sky-comp-selection_box-expanded-space-inset-left: var(--modern-space-xl);
1885
2017
  --sky-comp-selection_box-expanded-space-inset-right: var(--modern-space-xl);
1886
2018
  --sky-comp-selection_box-expanded-space-inset-top: var(--modern-space-xl);
2019
+ --sky-comp-split_view-drawer-space-inset-sm-bottom: var(--modern-size-0);
2020
+ --sky-comp-split_view-drawer-space-inset-sm-left: var(--modern-size-0);
2021
+ --sky-comp-split_view-drawer-space-inset-sm-right: var(--modern-size-0);
2022
+ --sky-comp-split_view-drawer-space-inset-sm-top: var(--modern-size-0);
2023
+ --sky-comp-split_view-drawer-space-inset-xs-bottom: var(--modern-size-0);
2024
+ --sky-comp-split_view-drawer-space-inset-xs-left: var(--modern-size-0);
2025
+ --sky-comp-split_view-drawer-space-inset-xs-right: var(--modern-size-0);
2026
+ --sky-comp-split_view-drawer-space-inset-xs-top: var(--modern-size-0);
1887
2027
  --sky-comp-split_view-footer-space-inset-bottom: var(--modern-space-s);
1888
2028
  --sky-comp-split_view-footer-space-inset-left: var(--modern-space-s);
1889
2029
  --sky-comp-split_view-footer-space-inset-right: var(--modern-space-s);
@@ -1892,10 +2032,14 @@
1892
2032
  --sky-comp-tab-horizontal-space-inset-left: var(--modern-size-15);
1893
2033
  --sky-comp-tab-horizontal-space-inset-right: var(--modern-size-15);
1894
2034
  --sky-comp-tab-horizontal-space-inset-top: var(--modern-size-10);
1895
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-15);
1896
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
1897
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
1898
- --sky-comp-tab-vertical-content-space-inset-top: var(--modern-size-15);
2035
+ --sky-comp-tab-vertical-content-space-inset-sm-bottom: var(--modern-size-10);
2036
+ --sky-comp-tab-vertical-content-space-inset-sm-left: var(--modern-size-15);
2037
+ --sky-comp-tab-vertical-content-space-inset-sm-right: var(--modern-size-15);
2038
+ --sky-comp-tab-vertical-content-space-inset-sm-top: var(--modern-size-10);
2039
+ --sky-comp-tab-vertical-content-space-inset-xs-bottom: var(--modern-size-15);
2040
+ --sky-comp-tab-vertical-content-space-inset-xs-left: var(--modern-size-15);
2041
+ --sky-comp-tab-vertical-content-space-inset-xs-right: var(--modern-size-15);
2042
+ --sky-comp-tab-vertical-content-space-inset-xs-top: var(--modern-size-15);
1899
2043
  --sky-comp-tab-vertical-group-button-space-inset-bottom: var(--modern-space-s);
1900
2044
  --sky-comp-tab-vertical-group-button-space-inset-left: var(--modern-space-s);
1901
2045
  --sky-comp-tab-vertical-group-button-space-inset-right: var(--modern-space-s);
@@ -1920,14 +2064,22 @@
1920
2064
  --sky-comp-text_editor-space-inset-left: var(--modern-space-md);
1921
2065
  --sky-comp-text_editor-space-inset-right: var(--modern-space-md);
1922
2066
  --sky-comp-text_editor-space-inset-top: var(--modern-space-md);
1923
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
1924
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-size-0);
1925
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-size-0);
1926
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
1927
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
1928
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-size-0);
1929
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-size-0);
1930
- --sky-comp-tile-dashboard-space-inset-top: var(--modern-size-0);
2067
+ --sky-comp-tile-dashboard-column-space-inset-sm-bottom: var(--modern-size-0);
2068
+ --sky-comp-tile-dashboard-column-space-inset-sm-left: var(--modern-space-md);
2069
+ --sky-comp-tile-dashboard-column-space-inset-sm-right: var(--modern-space-md);
2070
+ --sky-comp-tile-dashboard-column-space-inset-sm-top: var(--modern-size-0);
2071
+ --sky-comp-tile-dashboard-column-space-inset-xs-bottom: var(--modern-size-0);
2072
+ --sky-comp-tile-dashboard-column-space-inset-xs-left: var(--modern-size-0);
2073
+ --sky-comp-tile-dashboard-column-space-inset-xs-right: var(--modern-size-0);
2074
+ --sky-comp-tile-dashboard-column-space-inset-xs-top: var(--modern-size-0);
2075
+ --sky-comp-tile-dashboard-space-inset-sm-bottom: var(--modern-size-0);
2076
+ --sky-comp-tile-dashboard-space-inset-sm-left: var(--modern-space-s);
2077
+ --sky-comp-tile-dashboard-space-inset-sm-right: var(--modern-space-s);
2078
+ --sky-comp-tile-dashboard-space-inset-sm-top: var(--modern-size-0);
2079
+ --sky-comp-tile-dashboard-space-inset-xs-bottom: var(--modern-size-0);
2080
+ --sky-comp-tile-dashboard-space-inset-xs-left: var(--modern-size-0);
2081
+ --sky-comp-tile-dashboard-space-inset-xs-right: var(--modern-size-0);
2082
+ --sky-comp-tile-dashboard-space-inset-xs-top: var(--modern-size-0);
1931
2083
  --sky-comp-tile-section-space-inset-bottom: var(--modern-space-md);
1932
2084
  --sky-comp-tile-section-space-inset-left: var(--modern-size-0);
1933
2085
  --sky-comp-tile-section-space-inset-right: var(--modern-size-0);
@@ -2094,6 +2246,7 @@
2094
2246
  --sky-space-gap-stacked_supplemental-m: var(--modern-size-10);
2095
2247
  --sky-space-gap-stacked_supplemental-s: var(--modern-size-5);
2096
2248
  --sky-space-gap-stacked_supplemental-xl: var(--modern-size-20);
2249
+ --sky-space-gap-stacked_supplemental-xs: var(--modern-size-5);
2097
2250
  --sky-space-gap-text_action-l: var(--modern-space-lg);
2098
2251
  --sky-space-gap-text_action-m: var(--modern-space-md);
2099
2252
  --sky-space-gap-text_action-s: var(--modern-space-s);
@@ -2172,165 +2325,21 @@
2172
2325
  --sky-space-inset-switch: calc(var(--sky-size-switch) + var(--sky-space-gap-label-s));
2173
2326
  }
2174
2327
 
2175
- @media (min-width: 768px) {
2176
- .sky-theme-modern {
2177
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-15);
2178
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-15);
2179
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-15);
2180
- --sky-comp-modal-fullscreen-space-offset-top: var(--modern-size-15);
2181
- --sky-comp-modal-space-offset-bottom: var(--modern-size-20);
2182
- --sky-comp-modal-space-offset-left: var(--modern-size-20);
2183
- --sky-comp-modal-space-offset-right: var(--modern-size-20);
2184
- --sky-comp-modal-space-offset-top: var(--modern-size-20);
2185
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-xl);
2186
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-xl);
2187
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-xl);
2188
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-xl);
2189
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
2190
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-xl);
2191
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-xl);
2192
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
2193
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
2194
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-xl);
2195
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-xl);
2196
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
2197
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
2198
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
2199
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
2200
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
2201
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-size-0);
2202
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-xl);
2203
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-xl);
2204
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-xl);
2205
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
2206
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-xl);
2207
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-xl);
2208
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-xl);
2209
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
2210
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-xl);
2211
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-xl);
2212
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-xl);
2213
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
2214
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-xl);
2215
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-xl);
2216
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-xl);
2217
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
2218
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-xl);
2219
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-xl);
2220
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
2221
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
2222
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-xl);
2223
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-xl);
2224
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
2225
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
2226
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-xl);
2227
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-xl);
2228
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
2229
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
2230
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-xl);
2231
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
2232
- --sky-comp-page-tabset-tabs-space-inset-top: var(--modern-size-0);
2233
- --sky-comp-search-space-inset-bottom: var(--modern-space-s);
2234
- --sky-comp-search-space-inset-left: var(--modern-space-s);
2235
- --sky-comp-search-space-inset-right: var(--modern-space-s);
2236
- --sky-comp-search-space-inset-top: var(--modern-space-s);
2237
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-10);
2238
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
2239
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
2240
- --sky-comp-tab-vertical-content-space-inset-top: var(--modern-size-10);
2241
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
2242
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-space-md);
2243
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-space-md);
2244
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
2245
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
2246
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-space-s);
2247
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-space-s);
2248
- --sky-comp-tile-dashboard-space-inset-top: var(--modern-size-0);
2249
- }
2250
- }
2251
- .sky-theme-modern .sky-responsive-container-sm, .sky-theme-modern .sky-responsive-container-md, .sky-theme-modern .sky-responsive-container-lg {
2252
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-15);
2253
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-15);
2254
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-15);
2255
- --sky-comp-modal-fullscreen-space-offset-top: var(--modern-size-15);
2256
- --sky-comp-modal-space-offset-bottom: var(--modern-size-20);
2257
- --sky-comp-modal-space-offset-left: var(--modern-size-20);
2258
- --sky-comp-modal-space-offset-right: var(--modern-size-20);
2259
- --sky-comp-modal-space-offset-top: var(--modern-size-20);
2260
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-xl);
2261
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-xl);
2262
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-xl);
2263
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-xl);
2264
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
2265
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-xl);
2266
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-xl);
2267
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
2268
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
2269
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-xl);
2270
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-xl);
2271
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
2272
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
2273
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
2274
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
2275
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
2276
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-size-0);
2277
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-xl);
2278
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-xl);
2279
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-xl);
2280
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
2281
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-xl);
2282
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-xl);
2283
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-xl);
2284
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
2285
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-xl);
2286
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-xl);
2287
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-xl);
2288
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
2289
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-xl);
2290
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-xl);
2291
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-xl);
2292
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
2293
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-xl);
2294
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-xl);
2295
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
2296
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
2297
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-xl);
2298
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-xl);
2299
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
2300
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
2301
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-xl);
2302
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-xl);
2303
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
2304
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
2305
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-xl);
2306
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
2307
- --sky-comp-page-tabset-tabs-space-inset-top: var(--modern-size-0);
2308
- --sky-comp-search-space-inset-bottom: var(--modern-space-s);
2309
- --sky-comp-search-space-inset-left: var(--modern-space-s);
2310
- --sky-comp-search-space-inset-right: var(--modern-space-s);
2311
- --sky-comp-search-space-inset-top: var(--modern-space-s);
2312
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-10);
2313
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
2314
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
2315
- --sky-comp-tab-vertical-content-space-inset-top: var(--modern-size-10);
2316
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
2317
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-space-md);
2318
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-space-md);
2319
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
2320
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
2321
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-space-s);
2322
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-space-s);
2323
- --sky-comp-tile-dashboard-space-inset-top: var(--modern-size-0);
2324
- }
2325
-
2326
2328
  .sky-theme-modern {
2327
2329
  /* color */
2328
2330
  --sky-background-color-page-default: var(--sky-color-background-page);
2329
- --sky-background-color-neutral-light: #fcfcfc;
2330
- --sky-background-color-primary-dark: #1870B8;
2331
- --sky-background-color-disabled: #ededee;
2332
- --sky-border-color-neutral-medium: #d2d2d2;
2333
- --sky-border-color-neutral-medium-dark: #8c929c;
2331
+ --sky-background-color-container-default: var(
2332
+ --sky-color-background-container-base
2333
+ );
2334
+ --sky-background-color-neutral-light: var(--sky-color-background-page);
2335
+ --sky-background-color-primary-dark: var(
2336
+ --sky-color-background-action-primary-base
2337
+ );
2338
+ --sky-background-color-disabled: var(
2339
+ --sky-color-background-action-primary-disabled
2340
+ );
2341
+ --sky-border-color-neutral-medium: var(--sky-color-border-container-base);
2342
+ --sky-border-color-neutral-medium-dark: var(--sky-color-border-switch-base);
2334
2343
  --sky-category-color-light-blue: var(--sky-color-category-green);
2335
2344
  --sky-category-color-teal: var(--sky-color-category-teal);
2336
2345
  --sky-category-color-purple: var(--sky-color-category-purple);
@@ -2338,13 +2347,17 @@
2338
2347
  --sky-category-color-blue: var(--sky-color-category-blue);
2339
2348
  --sky-category-color-yellow: var(--sky-color-category-yellow);
2340
2349
  --sky-category-color-red: var(--sky-color-category-red);
2341
- --sky-highlight-color-info: #00b4f1;
2342
- --sky-highlight-color-success: #72bf44;
2343
- --sky-highlight-color-warning: #fbb034;
2344
- --sky-highlight-color-danger: #ef4044;
2345
- --sky-text-color-deemphasized: #686c73;
2346
- --sky-text-color-action-primary: #1870B8;
2347
- --sky-text-color-action-primary-hover: rgb(18.1153846154, 84.5384615385, 138.8846153846);
2350
+ --sky-highlight-color-info: var(--sky-color-border-info);
2351
+ --sky-highlight-color-success: var(--sky-color-border-success);
2352
+ --sky-highlight-color-warning: var(--sky-color-border-warning);
2353
+ --sky-highlight-color-danger: var(--sky-color-border-danger);
2354
+ --sky-text-color-default: var(--sky-color-text-default);
2355
+ --sky-text-color-deemphasized: var(--sky-color-text-deemphasized);
2356
+ --sky-text-color-action-primary: var(--sky-color-text-action);
2357
+ --sky-text-color-action-primary-hover: darken(
2358
+ var(--sky-color-text-action),
2359
+ 10%
2360
+ );
2348
2361
  /* margin */
2349
2362
  --sky-margin-inline-xs: 5px;
2350
2363
  --sky-margin-inline-sm: 10px;
@@ -2361,8 +2374,12 @@
2361
2374
  --sky-padding-even-xl: 30px;
2362
2375
  --sky-padding-half: 5px;
2363
2376
  /* component colors */
2364
- --sky-background-color-input-selected: #ebfbff;
2365
- --sky-background-color-item-selected: #ebfbff;
2377
+ --sky-background-color-input-selected: var(
2378
+ --sky-color-background-selected-soft
2379
+ );
2380
+ --sky-background-color-item-selected: var(
2381
+ --sky-color-background-selected-soft
2382
+ );
2366
2383
  /* switch */
2367
2384
  --sky-switch-size: 26px;
2368
2385
  /* viewkeeper */
@@ -2378,6 +2395,8 @@
2378
2395
 
2379
2396
  .sky-theme-modern:not(.sky-theme-brand-base) .sky-btn {
2380
2397
  --sky-override-borderless-icon-size: 26px;
2398
+ --sky-override-button-box-shadow-hover-transition: box-shadow
2399
+ 150ms;
2381
2400
  --sky-override-button-default-box-shadow-focus:
2382
2401
  inset 0 0 0 var(--sky-border-width-action-focus)
2383
2402
  var(--sky-color-border-action-secondary-focus),
@@ -2449,6 +2468,26 @@
2449
2468
 
2450
2469
  .sky-theme-modern:not(.sky-theme-brand-base) .sky-btn-tab {
2451
2470
  --sky-override-tab-box-shadow-focus-elevation: var(--sky-elevation-focus);
2471
+ --sky-override-tab-selected-active-background-color: var(
2472
+ --sky-color-background-tab-active
2473
+ );
2474
+ --sky-override-tab-selected-active-border-bottom: var(
2475
+ --sky-border-width-selected-s
2476
+ )
2477
+ var(--sky-border-style-accent)
2478
+ var(
2479
+ --sky-override-tab-hover-border-bottom-color,
2480
+ var(--sky-color-border-tab-active)
2481
+ );
2482
+ --sky-override-tab-selected-active-padding-bottom: calc(
2483
+ var(--sky-comp-tab-horizontal-space-inset-bottom) - var(
2484
+ --sky-border-width-selected-s
2485
+ )
2486
+ );
2487
+ --sky-override-tab-selected-focus-color: var(--sky-color-text-default);
2488
+ --sky-override-tab-selected-focus-background-color: var(
2489
+ --sky-color-background-tab-focus
2490
+ );
2452
2491
  --sky-override-tab-selected-background-color: var(--modern-color-transparent);
2453
2492
  --sky-override-tab-selected-border-bottom-size: var(--modern-size-3);
2454
2493
  --sky-override-tab-hover-border-bottom-color: var(--modern-color-blue-50);
@@ -2709,23 +2748,24 @@
2709
2748
  .sky-theme-modern .sky-btn-icon {
2710
2749
  background-color: var(--sky-color-background-action-secondary-base);
2711
2750
  color: var(--sky-color-text-default);
2712
- box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-secondary-base);
2751
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-secondary-base), var(--sky-comp-override-toolbar-button-elevation-base, var(--sky-elevation-action-secondary-base));
2713
2752
  }
2714
2753
  .sky-theme-modern .sky-btn-default:hover,
2715
2754
  .sky-theme-modern .sky-btn-icon:hover {
2716
2755
  background-color: var(--sky-color-background-action-secondary-hover);
2717
- box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-secondary-hover);
2756
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-secondary-hover), var(--sky-comp-override-toolbar-button-elevation-hover, var(--sky-elevation-action-secondary-hover));
2718
2757
  }
2719
2758
  .sky-theme-modern .sky-btn-default:active, .sky-theme-modern .sky-btn-default.sky-btn-active,
2720
2759
  .sky-theme-modern .sky-btn-icon:active,
2721
2760
  .sky-theme-modern .sky-btn-icon.sky-btn-active {
2722
2761
  background-color: var(--sky-color-background-action-secondary-active);
2723
- box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-secondary-active);
2762
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-secondary-active), var(--sky-comp-override-toolbar-button-elevation-active, var(--sky-elevation-action-secondary-active));
2763
+ transition: var(--sky-override-button-box-shadow-hover-transition, none);
2724
2764
  }
2725
2765
  .sky-theme-modern .sky-btn-default:focus-visible:not(:active),
2726
2766
  .sky-theme-modern .sky-btn-icon:focus-visible:not(:active) {
2727
2767
  background-color: var(--sky-color-background-action-secondary-focus);
2728
- box-shadow: var(--sky-override-button-default-box-shadow-focus, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-secondary-focus));
2768
+ box-shadow: var(--sky-override-button-default-box-shadow-focus, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-secondary-focus), var(--sky-comp-override-toolbar-button-elevation-focus, var(--sky-elevation-action-secondary-focus)));
2729
2769
  }
2730
2770
  .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,
2731
2771
  .sky-theme-modern .sky-btn-icon.sky-btn-disabled,
@@ -2740,7 +2780,7 @@
2740
2780
  .sky-theme-modern .sky-btn-icon[disabled].sky-btn-focus,
2741
2781
  .sky-theme-modern .sky-btn-icon[disabled]:active,
2742
2782
  .sky-theme-modern .sky-btn-icon[disabled].sky-btn-active {
2743
- box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-secondary-disabled);
2783
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-secondary-disabled), var(--sky-comp-override-toolbar-button-elevation-disabled, var(--sky-elevation-action-secondary-disabled));
2744
2784
  background-color: var(--sky-color-background-action-secondary-disabled);
2745
2785
  }
2746
2786
  .sky-theme-modern .sky-btn-default.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-default[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus),
@@ -2756,55 +2796,57 @@
2756
2796
  .sky-theme-modern .sky-btn-icon[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus),
2757
2797
  .sky-theme-modern .sky-btn-icon[disabled]:active:is(:focus-visible, .sky-btn-focus),
2758
2798
  .sky-theme-modern .sky-btn-icon[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
2759
- box-shadow: var(--sky-override-button-icon-disabled-box-shadow, inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-secondary-disabled));
2799
+ box-shadow: var(--sky-override-button-icon-disabled-box-shadow, inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-secondary-disabled), var(--sky-comp-override-toolbar-button-elevation-disabled, var(--sky-elevation-action-secondary-disabled)));
2760
2800
  }
2761
2801
  .sky-theme-modern .sky-btn-primary {
2762
2802
  background-color: var(--sky-color-background-action-primary-base);
2763
2803
  color: var(--sky-color-text-inverse);
2764
- box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-primary-base);
2804
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-primary-base), var(--sky-comp-override-toolbar-button-elevation-base, var(--sky-elevation-action-primary-base));
2765
2805
  }
2766
2806
  .sky-theme-modern .sky-btn-primary:hover {
2767
2807
  background-color: var(--sky-color-background-action-primary-hover);
2768
- box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-primary-hover);
2808
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-primary-hover), var(--sky-comp-override-toolbar-button-elevation-hover, var(--sky-elevation-action-primary-hover));
2769
2809
  }
2770
2810
  .sky-theme-modern .sky-btn-primary:active, .sky-theme-modern .sky-btn-primary.sky-btn-active {
2771
2811
  background-color: var(--sky-color-background-action-primary-active);
2772
- box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-primary-active);
2812
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-primary-active), var(--sky-comp-override-toolbar-button-elevation-active, var(--sky-elevation-action-primary-active));
2813
+ transition: var(--sky-override-button-box-shadow-hover-transition, none);
2773
2814
  }
2774
2815
  .sky-theme-modern .sky-btn-primary:focus-visible:not(:active) {
2775
2816
  background-color: var(--sky-color-background-action-primary-focus);
2776
- box-shadow: var(--sky-override-button-primary-box-shadow-focus, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-primary-focus));
2817
+ box-shadow: var(--sky-override-button-primary-box-shadow-focus, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-primary-focus), var(--sky-comp-override-toolbar-button-elevation-focus, var(--sky-elevation-action-primary-focus)));
2777
2818
  }
2778
2819
  .sky-theme-modern .sky-btn-primary.sky-btn-disabled, .sky-theme-modern .sky-btn-primary.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-primary.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-primary.sky-btn-disabled:active, .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-primary[disabled], .sky-theme-modern .sky-btn-primary[disabled]:hover, .sky-theme-modern .sky-btn-primary[disabled]:focus-visible, .sky-theme-modern .sky-btn-primary[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-primary[disabled]:active, .sky-theme-modern .sky-btn-primary[disabled].sky-btn-active {
2779
- box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-primary-disabled);
2820
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-primary-disabled), var(--sky-comp-override-toolbar-button-elevation-disabled, var(--sky-elevation-action-primary-disabled));
2780
2821
  background-color: var(--sky-color-background-action-primary-disabled);
2781
2822
  }
2782
2823
  .sky-theme-modern .sky-btn-primary.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-primary[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
2783
- box-shadow: var(--sky-override-button-primary-disabled-box-shadow, inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-primary-disabled));
2824
+ box-shadow: var(--sky-override-button-primary-disabled-box-shadow, inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-primary-disabled), var(--sky-comp-override-toolbar-button-elevation-disabled, var(--sky-elevation-action-primary-disabled)));
2784
2825
  }
2785
2826
  .sky-theme-modern .sky-btn-danger {
2786
2827
  background-color: var(--sky-color-background-action-danger-base);
2787
2828
  color: var(--sky-color-text-inverse);
2788
- box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-danger-base);
2829
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-danger-base), var(--sky-comp-override-toolbar-button-elevation-base, var(--sky-elevation-action-danger-base));
2789
2830
  }
2790
2831
  .sky-theme-modern .sky-btn-danger:hover {
2791
2832
  background-color: var(--sky-color-background-action-danger-hover);
2792
- box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-danger-hover);
2833
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-danger-hover), var(--sky-comp-override-toolbar-button-elevation-hover, var(--sky-elevation-action-danger-hover));
2793
2834
  }
2794
2835
  .sky-theme-modern .sky-btn-danger:active, .sky-theme-modern .sky-btn-danger.sky-btn-active {
2795
2836
  background-color: var(--sky-color-background-action-danger-active);
2796
- box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-danger-active);
2837
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-danger-active), var(--sky-comp-override-toolbar-button-elevation-active, var(--sky-elevation-action-danger-active));
2838
+ transition: var(--sky-override-button-box-shadow-hover-transition, none);
2797
2839
  }
2798
2840
  .sky-theme-modern .sky-btn-danger:focus-visible:not(:active) {
2799
2841
  background-color: var(--sky-color-background-action-danger-focus);
2800
- box-shadow: var(--sky-override-button-danger-box-shadow-focus, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-danger-focus));
2842
+ box-shadow: var(--sky-override-button-danger-box-shadow-focus, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-danger-focus), var(--sky-comp-override-toolbar-button-elevation-focus, var(--sky-elevation-action-danger-focus)));
2801
2843
  }
2802
2844
  .sky-theme-modern .sky-btn-danger.sky-btn-disabled, .sky-theme-modern .sky-btn-danger.sky-btn-disabled:hover, .sky-theme-modern .sky-btn-danger.sky-btn-disabled:focus-visible, .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-focus, .sky-theme-modern .sky-btn-danger.sky-btn-disabled:active, .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-active, .sky-theme-modern .sky-btn-danger[disabled], .sky-theme-modern .sky-btn-danger[disabled]:hover, .sky-theme-modern .sky-btn-danger[disabled]:focus-visible, .sky-theme-modern .sky-btn-danger[disabled].sky-btn-focus, .sky-theme-modern .sky-btn-danger[disabled]:active, .sky-theme-modern .sky-btn-danger[disabled].sky-btn-active {
2803
- box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-danger-disabled);
2845
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-danger-disabled), var(--sky-comp-override-toolbar-button-elevation-disabled, var(--sky-elevation-action-danger-disabled));
2804
2846
  background-color: var(--sky-color-background-action-danger-disabled);
2805
2847
  }
2806
2848
  .sky-theme-modern .sky-btn-danger.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-danger[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
2807
- box-shadow: var(--sky-override-button-danger-disabled-box-shadow, inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-danger-disabled));
2849
+ box-shadow: var(--sky-override-button-danger-disabled-box-shadow, inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-danger-disabled), var(--sky-comp-override-toolbar-button-elevation-disabled, var(--sky-elevation-action-danger-disabled)));
2808
2850
  }
2809
2851
  .sky-theme-modern .sky-btn-link {
2810
2852
  color: var(--sky-color-text-action);
@@ -2823,13 +2865,13 @@
2823
2865
  .sky-theme-modern .sky-btn-borderless,
2824
2866
  .sky-theme-modern .sky-btn-icon-borderless {
2825
2867
  background-color: var(--sky-color-background-action-tertiary-base);
2826
- box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-tertiary-base);
2868
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-tertiary-base), var(--sky-comp-override-toolbar-button-elevation-base, var(--sky-elevation-action-tertiary-base));
2827
2869
  }
2828
2870
  .sky-theme-modern .sky-btn-link:hover,
2829
2871
  .sky-theme-modern .sky-btn-borderless:hover,
2830
2872
  .sky-theme-modern .sky-btn-icon-borderless:hover {
2831
2873
  background-color: var(--sky-color-background-action-tertiary-hover);
2832
- box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-hover);
2874
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-hover), var(--sky-comp-override-toolbar-button-elevation-hover, var(--sky-elevation-action-tertiary-hover));
2833
2875
  }
2834
2876
  .sky-theme-modern .sky-btn-link:active, .sky-theme-modern .sky-btn-link.sky-btn-active,
2835
2877
  .sky-theme-modern .sky-btn-borderless:active,
@@ -2837,13 +2879,14 @@
2837
2879
  .sky-theme-modern .sky-btn-icon-borderless:active,
2838
2880
  .sky-theme-modern .sky-btn-icon-borderless.sky-btn-active {
2839
2881
  background-color: var(--sky-color-background-action-tertiary-active);
2840
- box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-active);
2882
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-active), var(--sky-comp-override-toolbar-button-elevation-active, var(--sky-elevation-action-tertiary-active));
2883
+ transition: var(--sky-override-button-box-shadow-hover-transition, none);
2841
2884
  }
2842
2885
  .sky-theme-modern .sky-btn-link:focus-visible:not(:active),
2843
2886
  .sky-theme-modern .sky-btn-borderless:focus-visible:not(:active),
2844
2887
  .sky-theme-modern .sky-btn-icon-borderless:focus-visible:not(:active) {
2845
2888
  background-color: var(--sky-color-background-action-tertiary-focus);
2846
- box-shadow: var(--sky-override-button-tertiary-box-shadow-focus, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus));
2889
+ box-shadow: var(--sky-override-button-tertiary-box-shadow-focus, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus), var(--sky-comp-override-toolbar-button-elevation-focus, var(--sky-elevation-action-tertiary-focus)));
2847
2890
  }
2848
2891
  .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,
2849
2892
  .sky-theme-modern .sky-btn-borderless.sky-btn-disabled,
@@ -2870,7 +2913,7 @@
2870
2913
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-focus,
2871
2914
  .sky-theme-modern .sky-btn-icon-borderless[disabled]:active,
2872
2915
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active {
2873
- box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-tertiary-disabled);
2916
+ 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));
2874
2917
  background-color: var(--sky-color-background-action-tertiary-disabled);
2875
2918
  }
2876
2919
  .sky-theme-modern .sky-btn-link.sky-btn-disabled:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link.sky-btn-disabled:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link.sky-btn-disabled:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link.sky-btn-disabled:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link.sky-btn-disabled.sky-btn-active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled]:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled]:hover:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled]:focus-visible:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled]:active:is(:focus-visible, .sky-btn-focus), .sky-theme-modern .sky-btn-link[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus),
@@ -2898,7 +2941,7 @@
2898
2941
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus),
2899
2942
  .sky-theme-modern .sky-btn-icon-borderless[disabled]:active:is(:focus-visible, .sky-btn-focus),
2900
2943
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
2901
- box-shadow: var(--sky-override-button-tertiary-disabled-box-shadow, inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-tertiary-disabled));
2944
+ box-shadow: var(--sky-override-button-tertiary-disabled-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)));
2902
2945
  }
2903
2946
  .sky-theme-modern .sky-btn-link-inline {
2904
2947
  background-color: var(--sky-color-background-action-tertiary-base);
@@ -2966,7 +3009,7 @@
2966
3009
  left: var(--sky-comp-button-block-space-inset-left);
2967
3010
  }
2968
3011
  .sky-theme-modern .sky-btn-tab {
2969
- background-color: var(--sky-color-background-nav-base);
3012
+ background-color: var(--sky-color-background-tab-base);
2970
3013
  border: none;
2971
3014
  border-radius: 0;
2972
3015
  border-top-left-radius: var(--sky-override-tab-button-radius, var(--sky-border-radius-s));
@@ -2979,33 +3022,41 @@
2979
3022
  transition: box-shadow 150ms;
2980
3023
  }
2981
3024
  .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) {
2982
- background-color: var(--sky-color-background-nav-hover);
2983
- border-bottom: var(--sky-border-width-selected-s) var(--sky-border-style-accent) var(--sky-override-tab-hover-border-bottom-color, var(--sky-color-border-selected));
3025
+ background-color: var(--sky-color-background-tab-hover);
3026
+ border-bottom: var(--sky-border-width-selected-s) var(--sky-border-style-accent) var(--sky-override-tab-hover-border-bottom-color, var(--sky-color-border-tab-hover));
2984
3027
  color: var(--sky-color-text-default);
2985
3028
  padding-bottom: calc(var(--sky-comp-tab-horizontal-space-inset-bottom) - var(--sky-border-width-selected-s));
2986
3029
  }
2987
3030
  .sky-theme-modern .sky-btn-tab:focus-visible {
2988
- background-color: var(--sky-color-background-nav-focus);
3031
+ background-color: var(--sky-color-background-tab-focus);
2989
3032
  color: var(--sky-color-text-default);
2990
3033
  outline: none;
2991
3034
  }
3035
+ .sky-theme-modern .sky-btn-tab:focus-visible.sky-btn-tab-selected {
3036
+ background-color: var(--sky-override-tab-selected-focus-background-color, var(--sky-color-background-selected-soft));
3037
+ }
2992
3038
  .sky-theme-modern .sky-btn-tab:focus-visible:not(:active) {
2993
3039
  color: var(--sky-color-text-default);
2994
- outline: solid var(--sky-border-width-selected-m) var(--sky-color-border-selected);
3040
+ outline: solid var(--sky-border-width-selected-m) var(--sky-color-border-tab-focus);
2995
3041
  outline-offset: calc(var(--sky-border-width-selected-m) * -1);
2996
3042
  box-shadow: var(--sky-override-tab-box-shadow-focus-elevation, none);
2997
3043
  }
2998
- .sky-theme-modern .sky-btn-tab:active {
3044
+ .sky-theme-modern .sky-btn-tab:active, .sky-theme-modern .sky-btn-tab:active:hover:not(.sky-btn-tab-disabled):not(.sky-btn-tab-selected):not(:focus-visible) {
2999
3045
  color: var(--sky-color-text-default);
3000
- background-color: var(--sky-color-background-nav-active);
3001
- border-bottom: var(--sky-border-width-selected-s) var(--sky-border-style-accent) var(--sky-override-tab-hover-border-bottom-color, var(--sky-color-border-selected));
3002
- padding-bottom: calc(var(--sky-comp-tab-horizontal-space-inset-bottom) - var(--sky-override-tab-selected-border-bottom-size, var(--sky-border-width-selected-s)));
3046
+ background-color: var(--sky-color-background-tab-active);
3047
+ border-bottom: var(--sky-border-width-selected-s) var(--sky-border-style-accent) var(--sky-override-tab-hover-border-bottom-color, var(--sky-color-border-tab-active));
3048
+ padding-bottom: calc(var(--sky-comp-tab-horizontal-space-inset-bottom) - var(--sky-border-width-selected-s));
3049
+ }
3050
+ .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 {
3051
+ background-color: var(--sky-override-tab-selected-active-background-color, var(--sky-color-background-selected-soft));
3052
+ border-bottom: var(--sky-override-tab-selected-active-border-bottom, var(--sky-override-tab-selected-border-bottom-size, var(--sky-border-width-selected-m)) var(--sky-border-style-accent) var(--sky-color-border-selected));
3053
+ padding-bottom: var(--sky-override-tab-selected-active-padding-bottom, calc(var(--sky-comp-tab-horizontal-space-inset-bottom) - var(--sky-border-width-selected-m)));
3003
3054
  }
3004
3055
  .sky-theme-modern .sky-btn-tab .sky-btn-tab-close {
3005
3056
  margin-left: var(--sky-space-gap-text_action-xs);
3006
3057
  }
3007
3058
  .sky-theme-modern .sky-btn-tab.sky-btn-tab-disabled {
3008
- background-color: var(--sky-override-tab-disabled-background-color, var(--sky-color-background-nav-disabled));
3059
+ background-color: var(--sky-override-tab-disabled-background-color, var(--sky-color-background-tab-disabled));
3009
3060
  color: var(--sky-color-text-deemphasized);
3010
3061
  font-style: var(--sky-font-style-deemphasized-style);
3011
3062
  font-weight: var(--sky-font-style-deemphasized-weight);
@@ -3020,8 +3071,8 @@
3020
3071
  box-shadow: none;
3021
3072
  }
3022
3073
  .sky-theme-modern .sky-btn-tab-selected:not(.sky-btn-tab-disabled):not(:active) {
3023
- border-bottom: var(--sky-override-tab-selected-border-bottom-size, var(--sky-border-width-selected-l)) var(--sky-border-style-accent) var(--sky-color-border-selected);
3024
- padding-bottom: calc(var(--sky-comp-tab-horizontal-space-inset-bottom) - var(--sky-override-tab-selected-border-bottom-size, var(--sky-border-width-selected-l)));
3074
+ border-bottom: var(--sky-override-tab-selected-border-bottom-size, var(--sky-border-width-selected-m)) var(--sky-border-style-accent) var(--sky-color-border-selected);
3075
+ padding-bottom: calc(var(--sky-comp-tab-horizontal-space-inset-bottom) - var(--sky-override-tab-selected-border-bottom-size, var(--sky-border-width-selected-m)));
3025
3076
  }
3026
3077
  .sky-theme-modern .sky-btn-tab-selected:not(.sky-btn-tab-disabled):hover:not(.sky-btn-tab-disabled) {
3027
3078
  background-color: var(--sky-override-tab-selected-background-color, var(--sky-color-background-selected-soft));
@@ -3095,6 +3146,7 @@
3095
3146
 
3096
3147
  .sky-theme-modern:not(.sky-theme-brand-base) select {
3097
3148
  --sky-override-select-icon-size: var(--modern-size-15) var(--modern-size-30);
3149
+ --sky-override-select-icon-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1IDEwIiB3aWR0aD0iNSIgaGVpZ2h0PSIxMCI+Cgk8c3R5bGU+CgkJdHNwYW4geyB3aGl0ZS1zcGFjZTpwcmUgfQoJCS5zaHAwIHsgZmlsbDogIzQ0NDQ0NCB9IAoJPC9zdHlsZT4KCTxwYXRoIGlkPSJMYXllciIgY2xhc3M9InNocDAiIGQ9Ik0xLjQxIDQuNjdMMi40OCAzLjE4TDMuNTQgNC42N0wxLjQxIDQuNjdMMS40MSA0LjY3WiIgLz4KCTxwYXRoIGlkPSJMYXllciIgY2xhc3M9InNocDAiIGQ9Ik0zLjU0IDUuMzNMMi40OCA2LjgyTDEuNDEgNS4zM0wzLjU0IDUuMzNMMy41NCA1LjMzWiIgLz4KPC9zdmc+);
3098
3150
  }
3099
3151
 
3100
3152
  .sky-theme-modern:not(.sky-theme-brand-base) .sky-error-label {
@@ -3120,8 +3172,8 @@
3120
3172
  opacity: 1;
3121
3173
  }
3122
3174
  .sky-theme-modern select {
3123
- background: var(--sky-color-background-input-base) url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1IDEwIiB3aWR0aD0iNSIgaGVpZ2h0PSIxMCI+Cgk8c3R5bGU+CgkJdHNwYW4geyB3aGl0ZS1zcGFjZTpwcmUgfQoJCS5zaHAwIHsgZmlsbDogIzQ0NDQ0NCB9IAoJPC9zdHlsZT4KCTxwYXRoIGlkPSJMYXllciIgY2xhc3M9InNocDAiIGQ9Ik0xLjQxIDQuNjdMMi40OCAzLjE4TDMuNTQgNC42N0wxLjQxIDQuNjdMMS40MSA0LjY3WiIgLz4KCTxwYXRoIGlkPSJMYXllciIgY2xhc3M9InNocDAiIGQ9Ik0zLjU0IDUuMzNMMi40OCA2LjgyTDEuNDEgNS4zM0wzLjU0IDUuMzNMMy41NCA1LjMzWiIgLz4KPC9zdmc+) no-repeat right 50%;
3124
- background-size: var(--sky-override-select-icon-size, var(--sky-size-icon-s) var(--sky-size-icon-xl));
3175
+ background: var(--sky-color-background-input-base) var(--sky-override-select-icon-image, url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik0xMC41MzAzIDIuNzE5NjdDMTAuMjM3NCAyLjQyNjc4IDkuNzYyNTYgMi40MjY3OCA5LjQ2OTY3IDIuNzE5NjdMNS4yMTk2NyA2Ljk2OTY3QzQuOTI2NzggNy4yNjI1NiA0LjkyNjc4IDcuNzM3NDQgNS4yMTk2NyA4LjAzMDMzQzUuNTEyNTYgOC4zMjMyMiA1Ljk4NzQ0IDguMzIzMjIgNi4yODAzMyA4LjAzMDMzTDEwIDQuMzEwNjZMMTMuNzE5NyA4LjAzMDMzQzE0LjAxMjYgOC4zMjMyMiAxNC40ODc0IDguMzIzMjIgMTQuNzgwMyA4LjAzMDMzQzE1LjA3MzIgNy43Mzc0NCAxNS4wNzMyIDcuMjYyNTYgMTQuNzgwMyA2Ljk2OTY3TDEwLjUzMDMgMi43MTk2N1pNMTQuNzgwMyAxMy4wMzAzTDEwLjUzMDMgMTcuMjgwM0MxMC4yMzc0IDE3LjU3MzIgOS43NjI1NiAxNy41NzMyIDkuNDY5NjcgMTcuMjgwM0w1LjIxOTY3IDEzLjAzMDNDNC45MjY3OCAxMi43Mzc0IDQuOTI2NzggMTIuMjYyNiA1LjIxOTY3IDExLjk2OTdDNS41MTI1NiAxMS42NzY4IDUuOTg3NDQgMTEuNjc2OCA2LjI4MDMzIDExLjk2OTdMMTAgMTUuNjg5M0wxMy43MTk3IDExLjk2OTdDMTQuMDEyNiAxMS42NzY4IDE0LjQ4NzQgMTEuNjc2OCAxNC43ODAzIDExLjk2OTdDMTUuMDczMiAxMi4yNjI2IDE1LjA3MzIgMTIuNzM3NCAxNC43ODAzIDEzLjAzMDNaIiBmaWxsPSIjMmI2YmQ1Ii8+DQo8L3N2Zz4NCg==)) no-repeat right 50%;
3176
+ background-size: var(--sky-override-select-icon-size, var(--sky-input-box-button-width) var(--sky-size-icon-m));
3125
3177
  }
3126
3178
 
3127
3179
  .sky-theme-modern:not(.sky-theme-brand-base) {
@@ -3137,11 +3189,14 @@
3137
3189
  --sky-override-switch-background-color-warning: rgb(255, 233.5961538462, 202);
3138
3190
  --sky-override-switch-border-color: var(--modern-color-blue-74);
3139
3191
  --sky-override-switch-border-color-checked: var(--sky-color-border-selected);
3192
+ --sky-override-switch-box-shadow: none;
3193
+ --sky-override-switch-box-shadow-disabled: none;
3140
3194
  --sky-override-switch-box-shadow-focus-elevation: var(--sky-elevation-focus);
3141
3195
  --sky-override-switch-checked-color: var(--sky-color-icon-selected);
3142
3196
  --sky-override-switch-icon-checked-color-no-group: var(
3143
3197
  --sky-color-text-default
3144
3198
  );
3199
+ --sky-override-switch-label-color-disabled: var(--sky-color-text-default);
3145
3200
  --sky-switch-label-margin-right: 10px;
3146
3201
  }
3147
3202
 
@@ -3156,6 +3211,9 @@
3156
3211
  .sky-theme-modern .sky-switch.sky-switch-disabled {
3157
3212
  cursor: not-allowed;
3158
3213
  }
3214
+ .sky-theme-modern .sky-switch.sky-switch-disabled .sky-switch-label {
3215
+ color: var(--sky-override-switch-label-color-disabled, var(--sky-color-text-deemphasized));
3216
+ }
3159
3217
  .sky-theme-modern .sky-switch.sky-control-label-required .sky-switch-label {
3160
3218
  margin-right: 0;
3161
3219
  }
@@ -3220,8 +3278,12 @@
3220
3278
  background-color: var(--sky-color-background-input-disabled);
3221
3279
  border-width: var(--sky-border-width-input-disabled);
3222
3280
  border-color: var(--sky-color-border-switch-disabled);
3281
+ box-shadow: var(--sky-override-switch-box-shadow-disabled, var(--sky-elevation-input-disabled));
3223
3282
  color: var(--sky-color-text-deemphasized);
3224
3283
  }
3284
+ .sky-theme-modern .sky-switch .sky-switch-input:not(:disabled) + .sky-switch-control {
3285
+ box-shadow: var(--sky-override-switch-box-shadow, var(--sky-elevation-input-base));
3286
+ }
3225
3287
  .sky-theme-modern .sky-switch .sky-switch-input:not(:disabled):hover + .sky-switch-control {
3226
3288
  border-width: var(--sky-border-width-input-hover);
3227
3289
  border-color: var(--sky-color-border-switch-hover);
@@ -3235,7 +3297,7 @@
3235
3297
  border-color: var(--sky-color-border-switch-focus);
3236
3298
  }
3237
3299
  .sky-theme-modern .sky-switch .sky-switch-input:not(:disabled):focus-visible:not(:active) + .sky-switch-control {
3238
- box-shadow: var(--sky-override-switch-box-shadow-focus-elevation, none);
3300
+ box-shadow: var(--sky-override-switch-box-shadow-focus-elevation, var(--sky-elevation-input-base));
3239
3301
  outline: none;
3240
3302
  }
3241
3303
  .sky-theme-modern .sky-switch .sky-switch-input:not(:disabled):not(:hover):not(:active):not(:focus-visible):checked + .sky-switch-control.sky-switch-control-success, .sky-theme-modern .sky-switch .sky-switch-input:not(:disabled):not(:hover):not(:active):not(:focus-visible)[type=checkbox]:indeterminate + .sky-switch-control.sky-switch-control-success {
@@ -3306,6 +3368,9 @@
3306
3368
  .sky-theme-modern .sky-switch-icon-group .sky-switch-input:checked:disabled + .sky-switch-control.sky-switch-control-icon, .sky-theme-modern .sky-switch-icon-group .sky-switch-input[type=checkbox]:indeterminate:disabled + .sky-switch-control.sky-switch-control-icon {
3307
3369
  color: var(--sky-color-icon-action);
3308
3370
  }
3371
+ .sky-theme-modern .sky-switch-icon-group .sky-switch-input:not(:disabled):not(:checked):not(:hover):not(:active):not(:focus-visible) + .sky-switch-control.sky-switch-control-icon {
3372
+ box-shadow: none;
3373
+ }
3309
3374
  .sky-theme-modern .sky-switch-icon-group .sky-switch-input:not(:disabled):hover + .sky-switch-control {
3310
3375
  border-width: var(--sky-border-width-action-hover);
3311
3376
  border-color: var(--sky-color-border-action-tertiary-hover);
@@ -3422,7 +3487,7 @@ body.sky-theme-modern {
3422
3487
  border-bottom: var(--sky-border-width-text_highlight) var(--sky-border-style-accent) var(--sky-color-border-text_highlight);
3423
3488
  }
3424
3489
  .sky-theme-modern :is(a, .sky-btn-link-inline) mark.sky-highlight-mark {
3425
- color: var(--sky-color-text-link_highlighted);
3490
+ color: var(--sky-color-text-action_contrast);
3426
3491
  }
3427
3492
  .sky-theme-modern .sky-rounded-corners {
3428
3493
  border-radius: var(--sky-border-radius-s);