@skyux/theme 12.21.0 → 12.23.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/css/themes/modern/styles.css +205 -302
  2. package/fesm2022/skyux-theme.mjs +264 -84
  3. package/fesm2022/skyux-theme.mjs.map +1 -1
  4. package/lib/theming/theme-brand.d.ts +11 -0
  5. package/lib/theming/theme-mode.d.ts +11 -0
  6. package/lib/theming/theme-serialization-types.d.ts +47 -0
  7. package/lib/theming/theme-settings.d.ts +8 -0
  8. package/lib/theming/theme-spacing.d.ts +11 -0
  9. package/lib/theming/theme.d.ts +11 -0
  10. package/package.json +4 -4
  11. package/scss/mixins.scss +1 -1
  12. package/scss/variables.scss +2 -2
package/css/themes/modern/styles.css CHANGED
@@ -1,3 +1,8 @@
1
+ @property --bb-image-logo-primary-src {
2
+ syntax: "<url>";
3
+ inherits: true;
4
+ initial-value: url("data:,");
5
+ }
1
6
  .sky-theme-modern.sky-theme-brand-base {
2
7
  --bb-border-radius-0: 0rem;
3
8
  --bb-border-radius-012: .125rem;
@@ -12,9 +17,10 @@
12
17
  --bb-color-blue-100: #eef3fc;
13
18
  --bb-color-blue-1000: #09152b;
14
19
  --bb-color-blue-200: #d0e1f7;
15
- --bb-color-blue-25: #fbfcfe;
20
+ --bb-color-blue-25: #f1f5fa;
16
21
  --bb-color-blue-300: #aac4ee;
17
22
  --bb-color-blue-400: #80a6e6;
23
+ --bb-color-blue-50: #f4f8fd;
18
24
  --bb-color-blue-500: #5589dd;
19
25
  --bb-color-blue-600: #2b6bd5;
20
26
  --bb-color-blue-700: #2256aa;
@@ -120,16 +126,12 @@
120
126
  --bb-font-blkb_sans-fallback: Helvetica Neue, Arial, sans-serif;
121
127
  --bb-font-blkb_sans-name: BLKB Sans;
122
128
  --bb-font-monospaced-family: Menlo, Monaco, Consolas, Courier New, monospace;
123
- --bb-font-size-100: 0.75rem;
124
- --bb-font-size-1000: 3.25rem;
125
- --bb-font-size-200: 0.875rem;
126
- --bb-font-size-300: 1rem;
127
- --bb-font-size-400: 1.25rem;
128
- --bb-font-size-500: 1.5rem;
129
- --bb-font-size-600: 1.75rem;
130
- --bb-font-size-700: 2rem;
131
- --bb-font-size-800: 2.25rem;
132
- --bb-font-size-900: 2.625rem;
129
+ --bb-font-size-300: 0.8125rem;
130
+ --bb-font-size-400: 0.9375rem;
131
+ --bb-font-size-500: 1.0625rem;
132
+ --bb-font-size-600: 1.1875rem;
133
+ --bb-font-size-700: 1.5rem;
134
+ --bb-font-size-800: 1.6875rem;
133
135
  --bb-font-style-italic-style: italic;
134
136
  --bb-font-style-italic-weight: 400;
135
137
  --bb-font-style-light: 300;
@@ -145,26 +147,25 @@
145
147
  --bb-font-weight-light: 300;
146
148
  --bb-font-weight-regular: 400;
147
149
  --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");
148
151
  --bb-letter_spacing-normal: normal;
149
- --bb-letter_spacing-wider: 0.32px;
150
- --bb-line_height-100: calc(16/12);
151
- --bb-line_height-1000: calc(64/52);
152
- --bb-line_height-200: calc(20/14);
153
- --bb-line_height-300: calc(24/16);
154
- --bb-line_height-400: calc(28/20);
155
- --bb-line_height-500: calc(32/24);
156
- --bb-line_height-600: calc(36/28);
157
- --bb-line_height-700: calc(40/32);
158
- --bb-line_height-800: calc(40/36);
159
- --bb-line_height-900: calc(48/42);
152
+ --bb-letter_spacing-wider: 0.16px;
153
+ --bb-line_height-300: calc(18/13);
154
+ --bb-line_height-400: calc(20/15);
155
+ --bb-line_height-500: calc(24/17);
156
+ --bb-line_height-600: calc(28/19);
157
+ --bb-line_height-700: calc(32/24);
158
+ --bb-line_height-800: calc(36/26);
160
159
  --bb-opacity-600: .6;
161
160
  --bb-shadow-gray-0: 0 0 0 0 #000000;
162
- --bb-shadow-gray-1: 0 1px 3px 0 rgba(0,0,0,0.2), 0 2px 1px -1px rgba(0,0,0,0.12), 0 1px 1px 0 rgba(0,0,0,0.14);
163
- --bb-shadow-gray-16: 0 8px 10px -5px rgba(0,0,0,0.2), 0 6px 30px 5px rgba(0,0,0,0.12), 0 16px 24px 2px rgba(0,0,0,0.14);
164
- --bb-shadow-gray-2: 0 1px 8px 0 rgba(0,0,0,0.2), 0 3px 3px -2px rgba(0,0,0,0.12), 0 3px 4px 0 rgba(0,0,0,0.14);
165
- --bb-shadow-gray-24: 0 11px 15px -7px rgba(0,0,0,0.2), 0 9px 46px 8px rgba(0,0,0,0.12), 0 24px 38px 3px rgba(0,0,0,0.14);
166
- --bb-shadow-gray-4: 0 2px 4px -1px rgba(0,0,0,0.2), 0 1px 10px 0 rgba(0,0,0,0.12), 0 4px 5px 0 rgba(0,0,0,0.14);
167
- --bb-shadow-gray-8: 0 5px 5px -3px rgba(0,0,0,0.2), 0 3px 14px 2px rgba(0,0,0,0.12), 0 8px 10px 1px rgba(0,0,0,0.14);
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);
168
169
  --bb-size-0: 0rem;
169
170
  --bb-size-fixed-100: 16px;
170
171
  --bb-size-fixed-12: 2px;
@@ -235,7 +236,7 @@
235
236
  --sky-space-inset-letterbox-top-l: var(--bb-size-fluid-125);
236
237
  --sky-space-inset-letterbox-top-m: var(--bb-size-fluid-75);
237
238
  --sky-space-inset-letterbox-top-s: var(--bb-size-fluid-25);
238
- --sky-type-body-m: var(--bb-font-size-100) sans-serif;
239
+ --sky-type-body-m: var(--bb-font-size-300) sans-serif;
239
240
  }
240
241
 
241
242
  .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-dark {
@@ -374,51 +375,51 @@
374
375
  --sky-color-text-inverse: var(--bb-color-gray-1100);
375
376
  --sky-color-text-link_highlighted: var(--bb-color-blue-300);
376
377
  --sky-color-text-selected: var(--bb-color-blue-400);
377
- --sky-elevation-focus: var(--bb-shadow-gray-2);
378
+ --sky-elevation-focus: var(--bb-shadow-gray-200);
378
379
  --sky-elevation-none: var(--bb-shadow-gray-0);
379
- --sky-elevation-overflow: var(--bb-shadow-gray-2);
380
- --sky-elevation-overlay-100: var(--bb-shadow-gray-4);
381
- --sky-elevation-overlay-200: var(--bb-shadow-gray-8);
382
- --sky-elevation-overlay-300: var(--bb-shadow-gray-16);
383
- --sky-elevation-overlay-400: var(--bb-shadow-gray-24);
384
- --sky-elevation-raised-100: var(--bb-shadow-gray-1);
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);
385
386
  --sky-opacity-wait: var(--bb-opacity-600);
386
387
  }
387
388
 
388
389
  .sky-theme-modern.sky-theme-brand-base {
389
- --sky-color-background-action-danger-active: var(--bb-color-red-600);
390
+ --sky-color-background-action-danger-active: var(--bb-color-red-800);
390
391
  --sky-color-background-action-danger-base: var(--bb-color-red-600);
391
392
  --sky-color-background-action-danger-disabled: var(--bb-color-gray-50);
392
393
  --sky-color-background-action-danger-focus: var(--bb-color-red-600);
393
- --sky-color-background-action-danger-hover: var(--bb-color-red-600);
394
- --sky-color-background-action-input-active: var(--bb-color-transparent);
394
+ --sky-color-background-action-danger-hover: var(--bb-color-red-700);
395
+ --sky-color-background-action-input-active: var(--bb-color-blue-100);
395
396
  --sky-color-background-action-input-base: var(--bb-color-transparent);
396
397
  --sky-color-background-action-input-disabled: var(--bb-color-gray-50);
397
398
  --sky-color-background-action-input-focus: var(--bb-color-transparent);
398
- --sky-color-background-action-input-hover: var(--bb-color-transparent);
399
- --sky-color-background-action-primary-active: var(--bb-color-blue-600);
399
+ --sky-color-background-action-input-hover: var(--bb-color-blue-50);
400
+ --sky-color-background-action-primary-active: var(--bb-color-blue-800);
400
401
  --sky-color-background-action-primary-base: var(--bb-color-blue-600);
401
402
  --sky-color-background-action-primary-disabled: var(--bb-color-gray-50);
402
403
  --sky-color-background-action-primary-focus: var(--bb-color-blue-600);
403
- --sky-color-background-action-primary-hover: var(--bb-color-blue-600);
404
- --sky-color-background-action-secondary-active: var(--bb-color-white);
404
+ --sky-color-background-action-primary-hover: var(--bb-color-blue-700);
405
+ --sky-color-background-action-secondary-active: var(--bb-color-blue-100);
405
406
  --sky-color-background-action-secondary-base: var(--bb-color-white);
406
407
  --sky-color-background-action-secondary-disabled: var(--bb-color-gray-50);
407
408
  --sky-color-background-action-secondary-focus: var(--bb-color-white);
408
- --sky-color-background-action-secondary-hover: var(--bb-color-white);
409
- --sky-color-background-action-tertiary-active: var(--bb-color-transparent);
409
+ --sky-color-background-action-secondary-hover: var(--bb-color-blue-50);
410
+ --sky-color-background-action-tertiary-active: var(--bb-color-blue-100);
410
411
  --sky-color-background-action-tertiary-base: var(--bb-color-transparent);
411
412
  --sky-color-background-action-tertiary-disabled: var(--bb-color-gray-50);
412
413
  --sky-color-background-action-tertiary-focus: var(--bb-color-transparent);
413
- --sky-color-background-action-tertiary-hover: var(--bb-color-transparent);
414
+ --sky-color-background-action-tertiary-hover: var(--bb-color-blue-50);
414
415
  --sky-color-background-blocking: var(--bb-color-blocking);
415
416
  --sky-color-background-container-base: var(--bb-color-white);
416
417
  --sky-color-background-container-danger: var(--bb-color-red-300);
417
- --sky-color-background-container-info: var(--bb-color-blue-100);
418
+ --sky-color-background-container-info: var(--bb-color-blue-200);
418
419
  --sky-color-background-container-menu: var(--bb-color-white);
419
420
  --sky-color-background-container-success: var(--bb-color-green-300);
420
421
  --sky-color-background-container-warning: var(--bb-color-yellow-300);
421
- --sky-color-background-file_drop: var(--bb-color-gray-25);
422
+ --sky-color-background-file_drop: var(--bb-color-blue-25);
422
423
  --sky-color-background-icon_matte-action-heavy: var(--bb-color-blue-600);
423
424
  --sky-color-background-icon_matte-action-soft: var(--bb-color-blue-100);
424
425
  --sky-color-background-icon_matte-danger: var(--bb-color-red-600);
@@ -426,17 +427,17 @@
426
427
  --sky-color-background-icon_matte-warning: var(--bb-color-yellow-600);
427
428
  --sky-color-background-input-base: var(--bb-color-blue-25);
428
429
  --sky-color-background-input-disabled: var(--bb-color-gray-50);
429
- --sky-color-background-list-active: var(--bb-color-transparent);
430
+ --sky-color-background-list-active: var(--bb-color-blue-100);
430
431
  --sky-color-background-list-base: var(--bb-color-transparent);
431
432
  --sky-color-background-list-disabled: var(--bb-color-gray-50);
432
433
  --sky-color-background-list-focus: var(--bb-color-transparent);
433
- --sky-color-background-list-hover: var(--bb-color-transparent);
434
- --sky-color-background-nav-active: var(--bb-color-transparent);
434
+ --sky-color-background-list-hover: var(--bb-color-blue-50);
435
+ --sky-color-background-nav-active: var(--bb-color-blue-100);
435
436
  --sky-color-background-nav-base: var(--bb-color-transparent);
436
437
  --sky-color-background-nav-disabled: var(--bb-color-gray-50);
437
438
  --sky-color-background-nav-focus: var(--bb-color-transparent);
438
- --sky-color-background-nav-hover: var(--bb-color-transparent);
439
- --sky-color-background-page: var(--bb-color-gray-25);
439
+ --sky-color-background-nav-hover: var(--bb-color-blue-50);
440
+ --sky-color-background-page: var(--bb-color-blue-25);
440
441
  --sky-color-background-scrim: var(--bb-color-scrim);
441
442
  --sky-color-background-selected-danger: var(--bb-color-red-300);
442
443
  --sky-color-background-selected-heavy: var(--bb-color-blue-600);
@@ -447,58 +448,58 @@
447
448
  --sky-color-background-thumb-base: var(--bb-color-white);
448
449
  --sky-color-background-thumb-disabled: var(--bb-color-gray-50);
449
450
  --sky-color-background-thumbnail_matte: var(--bb-color-white);
450
- --sky-color-border-action-danger-active: var(--bb-color-red-200);
451
+ --sky-color-border-action-danger-active: var(--bb-color-red-1000);
451
452
  --sky-color-border-action-danger-base: var(--bb-color-red-600);
452
- --sky-color-border-action-danger-disabled: var(--bb-color-gray-100);
453
- --sky-color-border-action-danger-focus: var(--bb-color-red-200);
454
- --sky-color-border-action-danger-hover: var(--bb-color-red-200);
453
+ --sky-color-border-action-danger-disabled: var(--bb-color-gray-200);
454
+ --sky-color-border-action-danger-focus: var(--bb-color-red-1000);
455
+ --sky-color-border-action-danger-hover: var(--bb-color-red-1000);
455
456
  --sky-color-border-action-input-active: var(--bb-color-blue-600);
456
457
  --sky-color-border-action-input-base: var(--bb-color-blue-200);
457
- --sky-color-border-action-input-disabled: var(--bb-color-gray-400);
458
+ --sky-color-border-action-input-disabled: var(--bb-color-gray-200);
458
459
  --sky-color-border-action-input-focus: var(--bb-color-blue-600);
459
460
  --sky-color-border-action-input-hover: var(--bb-color-blue-600);
460
- --sky-color-border-action-primary-active: var(--bb-color-blue-200);
461
+ --sky-color-border-action-primary-active: var(--bb-color-blue-1000);
461
462
  --sky-color-border-action-primary-base: var(--bb-color-blue-600);
462
- --sky-color-border-action-primary-disabled: var(--bb-color-gray-100);
463
- --sky-color-border-action-primary-focus: var(--bb-color-blue-200);
464
- --sky-color-border-action-primary-hover: var(--bb-color-blue-200);
463
+ --sky-color-border-action-primary-disabled: var(--bb-color-gray-200);
464
+ --sky-color-border-action-primary-focus: var(--bb-color-blue-1000);
465
+ --sky-color-border-action-primary-hover: var(--bb-color-blue-1000);
465
466
  --sky-color-border-action-secondary-active: var(--bb-color-blue-600);
466
- --sky-color-border-action-secondary-base: var(--bb-color-gray-100);
467
- --sky-color-border-action-secondary-disabled: var(--bb-color-gray-100);
467
+ --sky-color-border-action-secondary-base: var(--bb-color-blue-300);
468
+ --sky-color-border-action-secondary-disabled: var(--bb-color-gray-200);
468
469
  --sky-color-border-action-secondary-focus: var(--bb-color-blue-600);
469
470
  --sky-color-border-action-secondary-hover: var(--bb-color-blue-600);
470
471
  --sky-color-border-action-tertiary-active: var(--bb-color-blue-600);
471
472
  --sky-color-border-action-tertiary-base: var(--bb-color-transparent);
472
- --sky-color-border-action-tertiary-disabled: var(--bb-color-gray-100);
473
+ --sky-color-border-action-tertiary-disabled: var(--bb-color-gray-200);
473
474
  --sky-color-border-action-tertiary-focus: var(--bb-color-blue-600);
474
475
  --sky-color-border-action-tertiary-hover: var(--bb-color-blue-600);
475
476
  --sky-color-border-column_divider: var(--bb-color-blue-600);
476
- --sky-color-border-container-base: var(--bb-color-gray-100);
477
+ --sky-color-border-container-base: var(--bb-color-blue-200);
477
478
  --sky-color-border-danger: var(--bb-color-red-600);
478
- --sky-color-border-divider: var(--bb-color-gray-100);
479
- --sky-color-border-elevation: var(--bb-color-gray-100);
479
+ --sky-color-border-divider: var(--bb-color-blue-300);
480
+ --sky-color-border-elevation: var(--bb-color-blue-200);
480
481
  --sky-color-border-info: var(--bb-color-blue-600);
481
482
  --sky-color-border-input-active: var(--bb-color-blue-600);
482
483
  --sky-color-border-input-base: var(--bb-color-blue-200);
483
- --sky-color-border-input-disabled: var(--bb-color-gray-400);
484
+ --sky-color-border-input-disabled: var(--bb-color-gray-200);
484
485
  --sky-color-border-input-error: var(--bb-color-red-600);
485
486
  --sky-color-border-input-focus: var(--bb-color-blue-600);
486
487
  --sky-color-border-input-hover: var(--bb-color-blue-600);
487
488
  --sky-color-border-progress_step: var(--bb-color-gray-400);
488
489
  --sky-color-border-selected: var(--bb-color-blue-600);
489
490
  --sky-color-border-selected_soft: var(--bb-color-blue-300);
490
- --sky-color-border-separator-light: var(--bb-color-gray-50);
491
- --sky-color-border-separator-row: var(--bb-color-gray-50);
491
+ --sky-color-border-separator-light: var(--bb-color-blue-200);
492
+ --sky-color-border-separator-row: var(--bb-color-blue-200);
492
493
  --sky-color-border-success: var(--bb-color-green-700);
493
494
  --sky-color-border-switch-active: var(--bb-color-blue-600);
494
495
  --sky-color-border-switch-base: var(--bb-color-blue-500);
495
- --sky-color-border-switch-disabled: var(--bb-color-gray-400);
496
+ --sky-color-border-switch-disabled: var(--bb-color-gray-200);
496
497
  --sky-color-border-switch-error: var(--bb-color-red-600);
497
498
  --sky-color-border-switch-focus: var(--bb-color-blue-600);
498
499
  --sky-color-border-switch-hover: var(--bb-color-blue-600);
499
500
  --sky-color-border-switch-selected-active: var(--bb-color-blue-1000);
500
501
  --sky-color-border-switch-selected-base: var(--bb-color-transparent);
501
- --sky-color-border-switch-selected-disabled: var(--bb-color-gray-400);
502
+ --sky-color-border-switch-selected-disabled: var(--bb-color-gray-200);
502
503
  --sky-color-border-switch-selected-focus: var(--bb-color-blue-1000);
503
504
  --sky-color-border-switch-selected-hover: var(--bb-color-blue-1000);
504
505
  --sky-color-border-text_highlight: var(--bb-color-yellow-800);
@@ -523,18 +524,46 @@
523
524
  --sky-color-text-danger: var(--bb-color-red-600);
524
525
  --sky-color-text-deemphasized: var(--bb-color-gray-600);
525
526
  --sky-color-text-default: var(--bb-color-gray-900);
526
- --sky-color-text-heading: var(--bb-color-blue-800);
527
+ --sky-color-text-heading: var(--bb-color-blue-900);
527
528
  --sky-color-text-inverse: var(--bb-color-white);
528
- --sky-color-text-link_highlighted: var(--bb-color-blue-800);
529
+ --sky-color-text-link_highlighted: var(--bb-color-blue-700);
529
530
  --sky-color-text-selected: var(--bb-color-blue-600);
530
- --sky-elevation-focus: var(--bb-shadow-gray-2);
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);
531
559
  --sky-elevation-none: var(--bb-shadow-gray-0);
532
- --sky-elevation-overflow: var(--bb-shadow-gray-2);
533
- --sky-elevation-overlay-100: var(--bb-shadow-gray-4);
534
- --sky-elevation-overlay-200: var(--bb-shadow-gray-8);
535
- --sky-elevation-overlay-300: var(--bb-shadow-gray-16);
536
- --sky-elevation-overlay-400: var(--bb-shadow-gray-24);
537
- --sky-elevation-raised-100: var(--bb-shadow-gray-1);
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);
566
+ --sky-image-logo-primary-src: var(--bb-image-logo-primary-src);
538
567
  --sky-opacity-wait: var(--bb-opacity-600);
539
568
  }
540
569
 
@@ -558,7 +587,6 @@
558
587
  --sky-space-gap-stacked_supplemental-0: 0rem;
559
588
  --sky-space-gap-text_action-0: 0rem;
560
589
  --sky-space-inset-balanced-none: 0rem;
561
- --sky-space-inset-floated-top-0: 0rem;
562
590
  --sky-border-radius-0: var(--bb-border-radius-0);
563
591
  --sky-border-radius-m: var(--bb-border-radius-050);
564
592
  --sky-border-radius-pill: var(--bb-border-radius-pill);
@@ -571,7 +599,7 @@
571
599
  --sky-border-style-elevation: var(--bb-border-style-solid);
572
600
  --sky-border-style-separator-dark: var(--bb-border-style-solid);
573
601
  --sky-border-style-separator-light: var(--bb-border-style-solid);
574
- --sky-border-style-separator-row: var(--bb-border-style-dotted);
602
+ --sky-border-style-separator-row: var(--bb-border-style-solid);
575
603
  --sky-border-width-accent: var(--bb-size-fixed-37);
576
604
  --sky-border-width-action-active: var(--bb-size-fixed-12);
577
605
  --sky-border-width-action-base: var(--bb-size-fixed-6);
@@ -651,6 +679,10 @@
651
679
  --sky-comp-datepicker-header-space-inset-left: var(--bb-size-fluid-75);
652
680
  --sky-comp-datepicker-header-space-inset-right: var(--bb-size-fluid-75);
653
681
  --sky-comp-datepicker-header-space-inset-top: var(--bb-size-fluid-75);
682
+ --sky-comp-datepicker-m_y_button-space-inset-bottom: var(--bb-size-fluid-50);
683
+ --sky-comp-datepicker-m_y_button-space-inset-left: var(--bb-size-fluid-50);
684
+ --sky-comp-datepicker-m_y_button-space-inset-right: var(--bb-size-fluid-50);
685
+ --sky-comp-datepicker-m_y_button-space-inset-top: var(--bb-size-fluid-50);
654
686
  --sky-comp-dropdown-menu-space-inset-bottom: var(--bb-size-fluid-50);
655
687
  --sky-comp-dropdown-menu-space-inset-left: var(--bb-size-fluid-50);
656
688
  --sky-comp-dropdown-menu-space-inset-right: var(--bb-size-fluid-50);
@@ -904,65 +936,65 @@
904
936
  --sky-comp-wizard-tabset-tabs-space-inset-right: var(--bb-size-fluid-150);
905
937
  --sky-comp-wizard-tabset-tabs-space-inset-top: var(--bb-size-0);
906
938
  --sky-font-family-monospaced: var(--bb-font-monospaced-family);
907
- --sky-font-letter_spacing-hint-s: var(--bb-letter_spacing-normal);
939
+ --sky-font-letter_spacing-hint-s: var(--bb-letter_spacing-wider);
908
940
  --sky-font-letter_spacing-input-label: var(--bb-letter_spacing-wider);
909
- --sky-font-line_height-body-l: var(--bb-line_height-300);
910
- --sky-font-line_height-body-m: var(--bb-line_height-200);
911
- --sky-font-line_height-body-s: var(--bb-line_height-100);
912
- --sky-font-line_height-display-1: var(--bb-line_height-800);
913
- --sky-font-line_height-display-2: var(--bb-line_height-500);
914
- --sky-font-line_height-display-3: var(--bb-line_height-300);
915
- --sky-font-line_height-display-4: var(--bb-line_height-200);
916
- --sky-font-line_height-heading-1: var(--bb-line_height-500);
917
- --sky-font-line_height-heading-2: var(--bb-line_height-400);
918
- --sky-font-line_height-heading-3: var(--bb-line_height-300);
919
- --sky-font-line_height-heading-4: var(--bb-line_height-200);
920
- --sky-font-line_height-heading-5: var(--bb-line_height-200);
921
- --sky-font-line_height-hint-m: var(--bb-line_height-200);
922
- --sky-font-line_height-hint-s: var(--bb-line_height-100);
923
- --sky-font-line_height-input-label: var(--bb-line_height-100);
924
- --sky-font-line_height-input-val: var(--bb-line_height-200);
925
- --sky-font-size-body-l: var(--bb-font-size-300);
926
- --sky-font-size-body-m: var(--bb-font-size-200);
927
- --sky-font-size-body-s: var(--bb-font-size-100);
928
- --sky-font-size-display-1: var(--bb-font-size-800);
929
- --sky-font-size-display-2: var(--bb-font-size-500);
930
- --sky-font-size-display-3: var(--bb-font-size-300);
931
- --sky-font-size-display-4: var(--bb-font-size-200);
932
- --sky-font-size-heading-1: var(--bb-font-size-500);
933
- --sky-font-size-heading-2: var(--bb-font-size-400);
934
- --sky-font-size-heading-3: var(--bb-font-size-300);
935
- --sky-font-size-heading-4: var(--bb-font-size-200);
936
- --sky-font-size-heading-5: var(--bb-font-size-200);
937
- --sky-font-size-hint-m: var(--bb-font-size-200);
938
- --sky-font-size-hint-s: var(--bb-font-size-100);
939
- --sky-font-size-input-label: var(--bb-font-size-100);
940
- --sky-font-size-input-val: var(--bb-font-size-200);
941
+ --sky-font-line_height-body-l: var(--bb-line_height-500);
942
+ --sky-font-line_height-body-m: var(--bb-line_height-400);
943
+ --sky-font-line_height-body-s: var(--bb-line_height-300);
944
+ --sky-font-line_height-display-1: var(--bb-line_height-700);
945
+ --sky-font-line_height-display-2: var(--bb-line_height-600);
946
+ --sky-font-line_height-display-3: var(--bb-line_height-500);
947
+ --sky-font-line_height-display-4: var(--bb-line_height-400);
948
+ --sky-font-line_height-heading-1: var(--bb-line_height-800);
949
+ --sky-font-line_height-heading-2: var(--bb-line_height-600);
950
+ --sky-font-line_height-heading-3: var(--bb-line_height-500);
951
+ --sky-font-line_height-heading-4: var(--bb-line_height-400);
952
+ --sky-font-line_height-heading-5: var(--bb-line_height-400);
953
+ --sky-font-line_height-hint-m: var(--bb-line_height-400);
954
+ --sky-font-line_height-hint-s: var(--bb-line_height-300);
955
+ --sky-font-line_height-input-label: var(--bb-line_height-300);
956
+ --sky-font-line_height-input-val: var(--bb-line_height-400);
957
+ --sky-font-size-body-l: var(--bb-font-size-500);
958
+ --sky-font-size-body-m: var(--bb-font-size-400);
959
+ --sky-font-size-body-s: var(--bb-font-size-300);
960
+ --sky-font-size-display-1: var(--bb-font-size-700);
961
+ --sky-font-size-display-2: var(--bb-font-size-600);
962
+ --sky-font-size-display-3: var(--bb-font-size-500);
963
+ --sky-font-size-display-4: var(--bb-font-size-400);
964
+ --sky-font-size-heading-1: var(--bb-font-size-800);
965
+ --sky-font-size-heading-2: var(--bb-font-size-600);
966
+ --sky-font-size-heading-3: var(--bb-font-size-500);
967
+ --sky-font-size-heading-4: var(--bb-font-size-400);
968
+ --sky-font-size-heading-5: var(--bb-font-size-400);
969
+ --sky-font-size-hint-m: var(--bb-font-size-400);
970
+ --sky-font-size-hint-s: var(--bb-font-size-300);
971
+ --sky-font-size-input-label: var(--bb-font-size-300);
972
+ --sky-font-size-input-val: var(--bb-font-size-400);
941
973
  --sky-font-style-body-l: var(--bb-font-style-regular);
942
974
  --sky-font-style-body-m: var(--bb-font-style-regular);
943
975
  --sky-font-style-body-s: var(--bb-font-style-regular);
944
- --sky-font-style-display-1: var(--bb-font-style-light);
945
- --sky-font-style-display-2: var(--bb-font-style-light);
946
- --sky-font-style-display-3: var(--bb-font-style-light);
947
- --sky-font-style-display-4: var(--bb-font-style-light);
976
+ --sky-font-style-display-1: var(--bb-font-style-regular);
977
+ --sky-font-style-display-2: var(--bb-font-style-regular);
978
+ --sky-font-style-display-3: var(--bb-font-style-regular);
979
+ --sky-font-style-display-4: var(--bb-font-style-regular);
948
980
  --sky-font-style-emphasized: var(--bb-font-style-semibold);
949
- --sky-font-style-heading-1: var(--bb-font-style-regular);
950
- --sky-font-style-heading-2: var(--bb-font-style-regular);
951
- --sky-font-style-heading-3: var(--bb-font-style-regular);
981
+ --sky-font-style-heading-1: var(--bb-font-style-semibold);
982
+ --sky-font-style-heading-2: var(--bb-font-style-semibold);
983
+ --sky-font-style-heading-3: var(--bb-font-style-semibold);
952
984
  --sky-font-style-heading-4: var(--bb-font-style-semibold);
953
985
  --sky-font-style-heading-5: var(--bb-font-style-semibold);
954
986
  --sky-font-style-input-label: var(--bb-font-style-regular);
955
987
  --sky-font-weight-body-l: var(--bb-font-weight-regular);
956
988
  --sky-font-weight-body-m: var(--bb-font-weight-regular);
957
- --sky-font-weight-body-s: var(--bb-font-weight-regular);
958
- --sky-font-weight-display-1: var(--bb-font-weight-light);
959
- --sky-font-weight-display-2: var(--bb-font-weight-light);
960
- --sky-font-weight-display-3: var(--bb-font-weight-light);
961
- --sky-font-weight-display-4: var(--bb-font-weight-light);
989
+ --sky-font-weight-body-s: var(--bb-font-weight-semibold);
990
+ --sky-font-weight-display-1: var(--bb-font-weight-regular);
991
+ --sky-font-weight-display-2: var(--bb-font-weight-regular);
992
+ --sky-font-weight-display-3: var(--bb-font-weight-semibold);
993
+ --sky-font-weight-display-4: var(--bb-font-weight-semibold);
962
994
  --sky-font-weight-emphasized: var(--bb-font-weight-semibold);
963
995
  --sky-font-weight-heading-1: var(--bb-font-weight-regular);
964
- --sky-font-weight-heading-2: var(--bb-font-weight-regular);
965
- --sky-font-weight-heading-3: var(--bb-font-weight-regular);
996
+ --sky-font-weight-heading-2: var(--bb-font-weight-semibold);
997
+ --sky-font-weight-heading-3: var(--bb-font-weight-semibold);
966
998
  --sky-font-weight-heading-4: var(--bb-font-weight-semibold);
967
999
  --sky-font-weight-heading-5: var(--bb-font-weight-semibold);
968
1000
  --sky-font-weight-hint-m: var(--bb-font-weight-regular);
@@ -1029,36 +1061,12 @@
1029
1061
  --sky-space-inline-xs: var(--bb-size-fluid-25);
1030
1062
  --sky-space-inline-xxl: var(--bb-size-fluid-300);
1031
1063
  --sky-space-inline-xxs: var(--bb-size-fluid-12);
1032
- --sky-space-inset-balanced-fixed-l: var(--bb-size-fixed-100);
1033
- --sky-space-inset-balanced-fixed-m: var(--bb-size-fixed-75);
1034
- --sky-space-inset-balanced-fixed-s: var(--bb-size-fixed-50);
1035
- --sky-space-inset-balanced-fixed-xl: var(--bb-size-fixed-150);
1036
1064
  --sky-space-inset-balanced-l: var(--bb-size-fluid-100);
1037
1065
  --sky-space-inset-balanced-m: var(--bb-size-fluid-75);
1038
1066
  --sky-space-inset-balanced-s: var(--bb-size-fluid-50);
1039
1067
  --sky-space-inset-balanced-xl: var(--bb-size-fluid-150);
1040
1068
  --sky-space-inset-balanced-xs: var(--bb-size-fluid-25);
1041
1069
  --sky-space-inset-balanced-xxs: var(--bb-size-fluid-12);
1042
- --sky-space-inset-bottomless-bottom-l: var(--bb-size-0);
1043
- --sky-space-inset-bottomless-bottom-m: var(--bb-size-0);
1044
- --sky-space-inset-bottomless-bottom-xl: var(--bb-size-0);
1045
- --sky-space-inset-bottomless-left-l: var(--bb-size-fluid-100);
1046
- --sky-space-inset-bottomless-left-m: var(--bb-size-fluid-75);
1047
- --sky-space-inset-bottomless-left-xl: var(--bb-size-fluid-150);
1048
- --sky-space-inset-bottomless-right-l: var(--bb-size-fluid-100);
1049
- --sky-space-inset-bottomless-right-m: var(--bb-size-fluid-75);
1050
- --sky-space-inset-bottomless-right-xl: var(--bb-size-fluid-150);
1051
- --sky-space-inset-bottomless-top-l: var(--bb-size-fluid-100);
1052
- --sky-space-inset-bottomless-top-m: var(--bb-size-fluid-75);
1053
- --sky-space-inset-bottomless-top-xl: var(--bb-size-fluid-150);
1054
- --sky-space-inset-floated-bottom-m: var(--bb-size-fluid-150);
1055
- --sky-space-inset-floated-bottom-s: var(--bb-size-fluid-100);
1056
- --sky-space-inset-floated-left-m: var(--bb-size-fluid-150);
1057
- --sky-space-inset-floated-left-s: var(--bb-size-fluid-100);
1058
- --sky-space-inset-floated-right-m: var(--bb-size-fluid-150);
1059
- --sky-space-inset-floated-right-s: var(--bb-size-fluid-100);
1060
- --sky-space-inset-floated-top-m: var(--bb-size-fluid-50);
1061
- --sky-space-inset-floated-top-s: var(--bb-size-fluid-25);
1062
1070
  --sky-space-inset-horizontal-bottom-0: var(--bb-size-0);
1063
1071
  --sky-space-inset-horizontal-bottom-l: var(--bb-size-0);
1064
1072
  --sky-space-inset-horizontal-bottom-m: var(--bb-size-0);
@@ -1079,68 +1087,10 @@
1079
1087
  --sky-space-inset-horizontal-top-m: var(--bb-size-0);
1080
1088
  --sky-space-inset-horizontal-top-s: var(--bb-size-0);
1081
1089
  --sky-space-inset-horizontal-top-xl: var(--bb-size-0);
1082
- --sky-space-inset-input-bottom-m: var(--bb-size-fluid-50);
1083
- --sky-space-inset-input-left-m: var(--bb-size-fluid-100);
1084
- --sky-space-inset-input-right-m: var(--bb-size-fluid-100);
1085
- --sky-space-inset-input-top-m: var(--bb-size-fluid-50);
1086
- --sky-space-inset-input_label-bottom-m: var(--bb-size-fluid-12);
1087
- --sky-space-inset-input_label-top-m: var(--bb-size-fluid-37);
1088
- --sky-space-inset-letterbox-1_2-bottom-m: var(--bb-size-fluid-100);
1089
- --sky-space-inset-letterbox-1_2-left-m: var(--bb-size-fluid-50);
1090
- --sky-space-inset-letterbox-1_2-right-m: var(--bb-size-fluid-50);
1091
- --sky-space-inset-letterbox-1_2-top-m: var(--bb-size-fluid-100);
1092
- --sky-space-inset-letterbox-1_3-bottom-m: var(--bb-size-fluid-150);
1093
- --sky-space-inset-letterbox-1_3-left-m: var(--bb-size-fluid-50);
1094
- --sky-space-inset-letterbox-1_3-right-m: var(--bb-size-fluid-50);
1095
- --sky-space-inset-letterbox-1_3-top-m: var(--bb-size-fluid-150);
1096
1090
  --sky-space-inset-letterbox-2_3-bottom-m: var(--bb-size-fluid-75);
1097
1091
  --sky-space-inset-letterbox-2_3-left-m: var(--bb-size-fluid-50);
1098
1092
  --sky-space-inset-letterbox-2_3-right-m: var(--bb-size-fluid-50);
1099
1093
  --sky-space-inset-letterbox-2_3-top-m: var(--bb-size-fluid-75);
1100
- --sky-space-inset-pillarbox-1_2-bottom-l: var(--bb-size-fluid-75);
1101
- --sky-space-inset-pillarbox-1_2-bottom-m: var(--bb-size-fluid-50);
1102
- --sky-space-inset-pillarbox-1_2-bottom-s: var(--bb-size-fluid-25);
1103
- --sky-space-inset-pillarbox-1_2-left-l: var(--bb-size-fluid-150);
1104
- --sky-space-inset-pillarbox-1_2-left-m: var(--bb-size-fluid-100);
1105
- --sky-space-inset-pillarbox-1_2-left-s: var(--bb-size-fluid-50);
1106
- --sky-space-inset-pillarbox-1_2-right-l: var(--bb-size-fluid-150);
1107
- --sky-space-inset-pillarbox-1_2-right-m: var(--bb-size-fluid-100);
1108
- --sky-space-inset-pillarbox-1_2-right-s: var(--bb-size-fluid-50);
1109
- --sky-space-inset-pillarbox-1_2-top-l: var(--bb-size-fluid-75);
1110
- --sky-space-inset-pillarbox-1_2-top-m: var(--bb-size-fluid-50);
1111
- --sky-space-inset-pillarbox-1_2-top-s: var(--bb-size-fluid-25);
1112
- --sky-space-inset-pillarbox-1_3-bottom-m: var(--bb-size-fluid-50);
1113
- --sky-space-inset-pillarbox-1_3-left-m: var(--bb-size-fluid-150);
1114
- --sky-space-inset-pillarbox-1_3-right-m: var(--bb-size-fluid-150);
1115
- --sky-space-inset-pillarbox-1_3-top-m: var(--bb-size-fluid-50);
1116
- --sky-space-inset-pillarbox-1_4-bottom-s: var(--bb-size-fluid-12);
1117
- --sky-space-inset-pillarbox-1_4-bottom-xs: var(--bb-size-fluid-6);
1118
- --sky-space-inset-pillarbox-1_4-left-s: var(--bb-size-fluid-50);
1119
- --sky-space-inset-pillarbox-1_4-left-xs: var(--bb-size-fluid-25);
1120
- --sky-space-inset-pillarbox-1_4-right-s: var(--bb-size-fluid-50);
1121
- --sky-space-inset-pillarbox-1_4-right-xs: var(--bb-size-fluid-25);
1122
- --sky-space-inset-pillarbox-1_4-top-s: var(--bb-size-fluid-12);
1123
- --sky-space-inset-pillarbox-1_4-top-xs: var(--bb-size-fluid-6);
1124
- --sky-space-inset-pillarbox-2_3-bottom-l: var(--bb-size-fluid-100);
1125
- --sky-space-inset-pillarbox-2_3-bottom-m: var(--bb-size-fluid-50);
1126
- --sky-space-inset-pillarbox-2_3-left-l: var(--bb-size-fluid-150);
1127
- --sky-space-inset-pillarbox-2_3-left-m: var(--bb-size-fluid-75);
1128
- --sky-space-inset-pillarbox-2_3-right-l: var(--bb-size-fluid-150);
1129
- --sky-space-inset-pillarbox-2_3-right-m: var(--bb-size-fluid-75);
1130
- --sky-space-inset-pillarbox-2_3-top-l: var(--bb-size-fluid-100);
1131
- --sky-space-inset-pillarbox-2_3-top-m: var(--bb-size-fluid-50);
1132
- --sky-space-inset-sunk-bottom-l: var(--bb-size-fluid-100);
1133
- --sky-space-inset-sunk-left-l: var(--bb-size-fluid-150);
1134
- --sky-space-inset-sunk-right-l: var(--bb-size-fluid-150);
1135
- --sky-space-inset-sunk-top-l: var(--bb-size-fluid-150);
1136
- --sky-space-inset-switch_icon-bottom: var(--bb-size-fluid-50);
1137
- --sky-space-inset-switch_icon-left: var(--bb-size-fluid-50);
1138
- --sky-space-inset-switch_icon-right: var(--bb-size-fluid-50);
1139
- --sky-space-inset-switch_icon-top: var(--bb-size-fluid-50);
1140
- --sky-space-inset-tabs-l: var(--bb-size-fluid-100);
1141
- --sky-space-inset-tabs-m: var(--bb-size-fluid-75);
1142
- --sky-space-inset-tabs-s: var(--bb-size-fluid-50);
1143
- --sky-space-inset-tabs-xl: var(--bb-size-fluid-150);
1144
1094
  --sky-space-inset-thumb: var(--bb-size-fixed-6);
1145
1095
  --sky-space-inset-thumbnail_matte-l: var(--bb-size-fluid-25);
1146
1096
  --sky-space-inset-thumbnail_matte-m: var(--bb-size-fluid-18);
@@ -1151,8 +1101,6 @@
1151
1101
  --sky-space-inset-vertical-bottom-m: var(--bb-size-fluid-75);
1152
1102
  --sky-space-inset-vertical-bottom-s: var(--bb-size-fluid-50);
1153
1103
  --sky-space-inset-vertical-bottom-xl: var(--bb-size-fluid-150);
1154
- --sky-space-inset-vertical-fixed-bottom-l: var(--bb-size-fixed-100);
1155
- --sky-space-inset-vertical-fixed-top-l: var(--bb-size-fixed-100);
1156
1104
  --sky-space-inset-vertical-left-0: var(--bb-size-0);
1157
1105
  --sky-space-inset-vertical-left-l: var(--bb-size-0);
1158
1106
  --sky-space-inset-vertical-left-m: var(--bb-size-0);
@@ -1346,6 +1294,11 @@
1346
1294
  --sky-comp-tile-dashboard-space-inset-top: var(--bb-size-0);
1347
1295
  }
1348
1296
 
1297
+ @property --modern-image-logo-primary-src {
1298
+ syntax: "<url>";
1299
+ inherits: true;
1300
+ initial-value: url("data:,");
1301
+ }
1349
1302
  .sky-theme-modern {
1350
1303
  --modern-border-radius-0: 0rem;
1351
1304
  --modern-border-radius-md: 6px;
@@ -1415,6 +1368,7 @@
1415
1368
  --modern-font-weight-light: 300;
1416
1369
  --modern-font-weight-regular: 400;
1417
1370
  --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");
1418
1372
  --modern-letter_spacing-normal: normal;
1419
1373
  --modern-line_height-110: 1.1;
1420
1374
  --modern-line_height-115: 1.15;
@@ -1619,8 +1573,36 @@
1619
1573
  --sky-color-text-inverse: var(--modern-color-white);
1620
1574
  --sky-color-text-link_highlight: var(--modern-color-blue-80);
1621
1575
  --sky-color-text-selected: var(--modern-color-blue-74);
1576
+ --sky-elevation-action-danger-active: var(--modern-shadow-size-0);
1577
+ --sky-elevation-action-danger-base: var(--modern-shadow-size-0);
1578
+ --sky-elevation-action-danger-disabled: var(--modern-shadow-size-0);
1579
+ --sky-elevation-action-danger-hover: var(--modern-shadow-size-0);
1580
+ --sky-elevation-action-input-active: var(--modern-shadow-size-0);
1581
+ --sky-elevation-action-input-base: var(--modern-shadow-size-0);
1582
+ --sky-elevation-action-input-disabled: var(--modern-shadow-size-0);
1583
+ --sky-elevation-action-input-hover: var(--modern-shadow-size-0);
1584
+ --sky-elevation-action-primary-active: var(--modern-shadow-size-0);
1585
+ --sky-elevation-action-primary-base: var(--modern-shadow-size-0);
1586
+ --sky-elevation-action-primary-disabled: var(--modern-shadow-size-0);
1587
+ --sky-elevation-action-primary-hover: var(--modern-shadow-size-0);
1588
+ --sky-elevation-action-secondary-active: var(--modern-shadow-size-0);
1589
+ --sky-elevation-action-secondary-base: var(--modern-shadow-size-0);
1590
+ --sky-elevation-action-secondary-disabled: var(--modern-shadow-size-0);
1591
+ --sky-elevation-action-secondary-hover: var(--modern-shadow-size-0);
1592
+ --sky-elevation-action-tertiary-active: var(--modern-shadow-size-0);
1593
+ --sky-elevation-action-tertiary-base: var(--modern-shadow-size-0);
1594
+ --sky-elevation-action-tertiary-disabled: var(--modern-shadow-size-0);
1595
+ --sky-elevation-action-tertiary-hover: var(--modern-shadow-size-0);
1596
+ --sky-elevation-input-base: var(--modern-shadow-size-0);
1597
+ --sky-elevation-input-disabled: var(--modern-shadow-size-0);
1622
1598
  --sky-elevation-none: var(--modern-shadow-size-0);
1599
+ --sky-image-logo-primary-src: var(--modern-image-logo-primary-src);
1623
1600
  --sky-opacity-wait: var(--modern-opacity-600);
1601
+ --sky-elevation-action-danger-focus: var(--modern-shadow-size-3);
1602
+ --sky-elevation-action-input-focus: var(--modern-shadow-size-3);
1603
+ --sky-elevation-action-primary-focus: var(--modern-shadow-size-3);
1604
+ --sky-elevation-action-secondary-focus: var(--modern-shadow-size-3);
1605
+ --sky-elevation-action-tertiary-focus: var(--modern-shadow-size-3);
1624
1606
  --sky-elevation-focus: var(--modern-shadow-size-3);
1625
1607
  --sky-elevation-overflow: var(--modern-shadow-size-3);
1626
1608
  --sky-elevation-overlay-100: var(--modern-shadow-size-4);
@@ -1742,6 +1724,10 @@
1742
1724
  --sky-comp-datepicker-header-space-inset-left: var(--modern-size-15);
1743
1725
  --sky-comp-datepicker-header-space-inset-right: var(--modern-size-15);
1744
1726
  --sky-comp-datepicker-header-space-inset-top: var(--modern-size-15);
1727
+ --sky-comp-datepicker-m_y_button-space-inset-bottom: var(--modern-size-5);
1728
+ --sky-comp-datepicker-m_y_button-space-inset-left: var(--modern-size-10);
1729
+ --sky-comp-datepicker-m_y_button-space-inset-right: var(--modern-size-10);
1730
+ --sky-comp-datepicker-m_y_button-space-inset-top: var(--modern-size-5);
1745
1731
  --sky-comp-dropdown-menu-space-inset-bottom: var(--modern-size-10);
1746
1732
  --sky-comp-dropdown-menu-space-inset-left: var(--modern-size-0);
1747
1733
  --sky-comp-dropdown-menu-space-inset-right: var(--modern-size-0);
@@ -2120,37 +2106,12 @@
2120
2106
  --sky-space-inline-xs: var(--modern-space-xs);
2121
2107
  --sky-space-inline-xxl: var(--modern-space-xxl);
2122
2108
  --sky-space-inline-xxs: var(--modern-size-2);
2123
- --sky-space-inset-balanced-fixed-l: var(--modern-size-20);
2124
- --sky-space-inset-balanced-fixed-m: var(--modern-size-15);
2125
- --sky-space-inset-balanced-fixed-s: var(--modern-size-10);
2126
- --sky-space-inset-balanced-fixed-xl: var(--modern-size-30);
2127
2109
  --sky-space-inset-balanced-l: var(--modern-space-lg);
2128
2110
  --sky-space-inset-balanced-m: var(--modern-space-md);
2129
2111
  --sky-space-inset-balanced-s: var(--modern-space-s);
2130
2112
  --sky-space-inset-balanced-xl: var(--modern-space-xl);
2131
2113
  --sky-space-inset-balanced-xs: var(--modern-space-xs);
2132
2114
  --sky-space-inset-balanced-xxs: var(--modern-size-2);
2133
- --sky-space-inset-bottomless-bottom-l: var(--modern-space-none);
2134
- --sky-space-inset-bottomless-bottom-m: var(--modern-space-none);
2135
- --sky-space-inset-bottomless-bottom-xl: var(--modern-space-none);
2136
- --sky-space-inset-bottomless-left-l: var(--modern-space-lg);
2137
- --sky-space-inset-bottomless-left-m: var(--modern-size-15);
2138
- --sky-space-inset-bottomless-left-xl: var(--modern-space-xl);
2139
- --sky-space-inset-bottomless-right-l: var(--modern-space-lg);
2140
- --sky-space-inset-bottomless-right-m: var(--modern-size-15);
2141
- --sky-space-inset-bottomless-right-xl: var(--modern-space-xl);
2142
- --sky-space-inset-bottomless-top-l: var(--modern-space-lg);
2143
- --sky-space-inset-bottomless-top-m: var(--modern-size-15);
2144
- --sky-space-inset-bottomless-top-xl: var(--modern-space-xl);
2145
- --sky-space-inset-floated-bottom-m: var(--modern-space-xl);
2146
- --sky-space-inset-floated-bottom-s: var(--modern-space-lg);
2147
- --sky-space-inset-floated-left-m: var(--modern-space-xl);
2148
- --sky-space-inset-floated-left-s: var(--modern-space-lg);
2149
- --sky-space-inset-floated-right-m: var(--modern-space-xl);
2150
- --sky-space-inset-floated-right-s: var(--modern-space-lg);
2151
- --sky-space-inset-floated-top-0: var(--modern-space-none);
2152
- --sky-space-inset-floated-top-m: var(--modern-space-s);
2153
- --sky-space-inset-floated-top-s: var(--modern-space-xs);
2154
2115
  --sky-space-inset-horizontal-bottom-0: var(--modern-space-none);
2155
2116
  --sky-space-inset-horizontal-bottom-l: var(--modern-size-0);
2156
2117
  --sky-space-inset-horizontal-bottom-m: var(--modern-size-0);
@@ -2171,68 +2132,10 @@
2171
2132
  --sky-space-inset-horizontal-top-m: var(--modern-size-0);
2172
2133
  --sky-space-inset-horizontal-top-s: var(--modern-size-0);
2173
2134
  --sky-space-inset-horizontal-top-xl: var(--modern-size-0);
2174
- --sky-space-inset-input-bottom-m: var(--modern-size-9);
2175
- --sky-space-inset-input-left-m: var(--modern-size-15);
2176
- --sky-space-inset-input-right-m: var(--modern-size-15);
2177
- --sky-space-inset-input-top-m: var(--modern-size-10);
2178
- --sky-space-inset-input_label-bottom-m: var(--modern-size-2);
2179
- --sky-space-inset-input_label-top-m: var(--modern-size-6);
2180
- --sky-space-inset-letterbox-1_2-bottom-m: var(--modern-space-lg);
2181
- --sky-space-inset-letterbox-1_2-left-m: var(--modern-space-s);
2182
- --sky-space-inset-letterbox-1_2-right-m: var(--modern-space-s);
2183
- --sky-space-inset-letterbox-1_2-top-m: var(--modern-space-lg);
2184
- --sky-space-inset-letterbox-1_3-bottom-m: var(--modern-space-xl);
2185
- --sky-space-inset-letterbox-1_3-left-m: var(--modern-space-s);
2186
- --sky-space-inset-letterbox-1_3-right-m: var(--modern-space-s);
2187
- --sky-space-inset-letterbox-1_3-top-m: var(--modern-space-xl);
2188
2135
  --sky-space-inset-letterbox-2_3-bottom-m: var(--modern-space-md);
2189
2136
  --sky-space-inset-letterbox-2_3-left-m: var(--modern-space-s);
2190
2137
  --sky-space-inset-letterbox-2_3-right-m: var(--modern-space-s);
2191
2138
  --sky-space-inset-letterbox-2_3-top-m: var(--modern-space-md);
2192
- --sky-space-inset-pillarbox-1_2-bottom-l: var(--modern-size-15);
2193
- --sky-space-inset-pillarbox-1_2-bottom-m: var(--modern-size-10);
2194
- --sky-space-inset-pillarbox-1_2-bottom-s: var(--modern-size-5);
2195
- --sky-space-inset-pillarbox-1_2-left-l: var(--modern-size-30);
2196
- --sky-space-inset-pillarbox-1_2-left-m: var(--modern-size-20);
2197
- --sky-space-inset-pillarbox-1_2-left-s: var(--modern-size-10);
2198
- --sky-space-inset-pillarbox-1_2-right-l: var(--modern-size-30);
2199
- --sky-space-inset-pillarbox-1_2-right-m: var(--modern-size-20);
2200
- --sky-space-inset-pillarbox-1_2-right-s: var(--modern-size-10);
2201
- --sky-space-inset-pillarbox-1_2-top-l: var(--modern-size-15);
2202
- --sky-space-inset-pillarbox-1_2-top-m: var(--modern-size-10);
2203
- --sky-space-inset-pillarbox-1_2-top-s: var(--modern-size-5);
2204
- --sky-space-inset-pillarbox-1_3-bottom-m: var(--modern-size-10);
2205
- --sky-space-inset-pillarbox-1_3-left-m: var(--modern-size-30);
2206
- --sky-space-inset-pillarbox-1_3-right-m: var(--modern-size-30);
2207
- --sky-space-inset-pillarbox-1_3-top-m: var(--modern-size-10);
2208
- --sky-space-inset-pillarbox-1_4-bottom-s: var(--modern-size-4);
2209
- --sky-space-inset-pillarbox-1_4-bottom-xs: var(--modern-size-1);
2210
- --sky-space-inset-pillarbox-1_4-left-s: var(--modern-size-15);
2211
- --sky-space-inset-pillarbox-1_4-left-xs: var(--modern-size-5);
2212
- --sky-space-inset-pillarbox-1_4-right-s: var(--modern-size-15);
2213
- --sky-space-inset-pillarbox-1_4-right-xs: var(--modern-size-5);
2214
- --sky-space-inset-pillarbox-1_4-top-s: var(--modern-size-4);
2215
- --sky-space-inset-pillarbox-1_4-top-xs: var(--modern-size-1);
2216
- --sky-space-inset-pillarbox-2_3-bottom-l: var(--modern-size-20);
2217
- --sky-space-inset-pillarbox-2_3-bottom-m: var(--modern-size-10);
2218
- --sky-space-inset-pillarbox-2_3-left-l: var(--modern-size-30);
2219
- --sky-space-inset-pillarbox-2_3-left-m: var(--modern-size-15);
2220
- --sky-space-inset-pillarbox-2_3-right-l: var(--modern-size-30);
2221
- --sky-space-inset-pillarbox-2_3-right-m: var(--modern-size-15);
2222
- --sky-space-inset-pillarbox-2_3-top-l: var(--modern-size-20);
2223
- --sky-space-inset-pillarbox-2_3-top-m: var(--modern-size-10);
2224
- --sky-space-inset-sunk-bottom-l: var(--modern-space-lg);
2225
- --sky-space-inset-sunk-left-l: var(--modern-space-xl);
2226
- --sky-space-inset-sunk-right-l: var(--modern-space-xl);
2227
- --sky-space-inset-sunk-top-l: var(--modern-space-xl);
2228
- --sky-space-inset-switch_icon-bottom: var(--modern-space-s);
2229
- --sky-space-inset-switch_icon-left: var(--modern-space-s);
2230
- --sky-space-inset-switch_icon-right: var(--modern-space-s);
2231
- --sky-space-inset-switch_icon-top: var(--modern-space-s);
2232
- --sky-space-inset-tabs-l: var(--modern-space-lg);
2233
- --sky-space-inset-tabs-m: var(--modern-space-md);
2234
- --sky-space-inset-tabs-s: var(--modern-space-s);
2235
- --sky-space-inset-tabs-xl: var(--modern-space-xl);
2236
2139
  --sky-space-inset-thumb: var(--modern-size-1);
2237
2140
  --sky-space-inset-thumbnail_matte-l: var(--modern-size-5);
2238
2141
  --sky-space-inset-thumbnail_matte-m: var(--modern-size-3);
@@ -2243,8 +2146,6 @@
2243
2146
  --sky-space-inset-vertical-bottom-m: var(--modern-space-md);
2244
2147
  --sky-space-inset-vertical-bottom-s: var(--modern-space-s);
2245
2148
  --sky-space-inset-vertical-bottom-xl: var(--modern-space-xl);
2246
- --sky-space-inset-vertical-fixed-bottom-l: var(--modern-size-20);
2247
- --sky-space-inset-vertical-fixed-top-l: var(--modern-size-20);
2248
2149
  --sky-space-inset-vertical-left-0: var(--modern-space-none);
2249
2150
  --sky-space-inset-vertical-left-l: var(--modern-size-0);
2250
2151
  --sky-space-inset-vertical-left-m: var(--modern-size-0);
@@ -3283,7 +3184,9 @@
3283
3184
  color: var(--sky-override-switch-checked-color, var(--sky-color-icon-inverse));
3284
3185
  }
3285
3186
  .sky-theme-modern .sky-switch .sky-switch-input:checked:not(:disabled) + .sky-switch-control.sky-switch-control-icon, .sky-theme-modern .sky-switch .sky-switch-input[type=checkbox]:indeterminate:not(:disabled) + .sky-switch-control.sky-switch-control-icon {
3286
- color: var(--sky-override-switch-icon-checked-color-no-group, var(--sky-color-icon-inverse));
3187
+ background-color: var(--sky-color-background-selected-soft);
3188
+ color: var(--sky-override-switch-icon-checked-color-no-group, var(--sky-color-icon-selected));
3189
+ border-color: var(--sky-color-border-selected);
3287
3190
  }
3288
3191
  .sky-theme-modern .sky-switch .sky-switch-input:checked:not(:disabled) + .sky-switch-control:is(.sky-switch-control-success,
3289
3192
  .sky-switch-control-warning,
@@ -3394,7 +3297,7 @@
3394
3297
  }
3395
3298
  .sky-theme-modern .sky-switch-icon-group .sky-switch-input:checked:not(:disabled) + .sky-switch-control.sky-switch-control-icon, .sky-theme-modern .sky-switch-icon-group .sky-switch-input[type=checkbox]:indeterminate:not(:disabled) + .sky-switch-control.sky-switch-control-icon {
3396
3299
  border-width: var(--sky-border-width-selected-s);
3397
- color: var(--sky-override-switch-checked-color, var(--sky-color-icon-inverse));
3300
+ color: var(--sky-override-switch-checked-color, var(--sky-color-icon-action));
3398
3301
  }
3399
3302
  .sky-theme-modern .sky-switch-icon-group .sky-switch-input:disabled + .sky-switch-control.sky-switch-control-icon {
3400
3303
  border-color: var(--sky-color-border-action-tertiary-disabled);