@skyux/theme 12.22.0 → 12.24.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.
@@ -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,7 +17,7 @@
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: #f1f5fa;
20
+ --bb-color-blue-25: #fbfcfe;
16
21
  --bb-color-blue-300: #aac4ee;
17
22
  --bb-color-blue-400: #80a6e6;
18
23
  --bb-color-blue-50: #f4f8fd;
@@ -96,6 +101,7 @@
96
101
  --bb-color-sky-700: #00a6cc;
97
102
  --bb-color-sky-800: #007c99;
98
103
  --bb-color-sky-900: #005366;
104
+ --bb-color-slate-100: #f1f5fa;
99
105
  --bb-color-teal-100: #ebfaf9;
100
106
  --bb-color-teal-1000: #012625;
101
107
  --bb-color-teal-200: #cdf2f1;
@@ -142,6 +148,7 @@
142
148
  --bb-font-weight-light: 300;
143
149
  --bb-font-weight-regular: 400;
144
150
  --bb-font-weight-semibold: 600;
151
+ --bb-image-logo-primary-src: url("https://sky.blackbaudcdn.net/static/skyux-design-tokens/2.0.0-alpha.0/assets/images/bb-logo.png");
145
152
  --bb-letter_spacing-normal: normal;
146
153
  --bb-letter_spacing-wider: 0.16px;
147
154
  --bb-line_height-300: calc(18/13);
@@ -151,15 +158,7 @@
151
158
  --bb-line_height-700: calc(32/24);
152
159
  --bb-line_height-800: calc(36/26);
153
160
  --bb-opacity-600: .6;
154
- --bb-shadow-gray-0: 0 0 0 0 #000000;
155
- --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);
156
- --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);
157
- --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);
158
- --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);
159
- --bb-shadow-gray-25: 0 1px 1px 0 rgba(13,62,130,0.05);
160
- --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);
161
- --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);
162
- --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);
161
+ --bb-shadow-blue-0: 0 0 0 0 rgba(0, 0, 0, 0);
163
162
  --bb-size-0: 0rem;
164
163
  --bb-size-fixed-100: 16px;
165
164
  --bb-size-fixed-12: 2px;
@@ -210,6 +209,14 @@
210
209
  --bb-space-9: 36px;
211
210
  --bb-color-gradient-blue: linear-gradient( var(--bb-color-blue-500), var(--bb-color-blue-700));
212
211
  --bb-font-blkb_sans-family: var(--bb-font-blkb_sans-name), var(--bb-font-blkb_sans-fallback);
212
+ --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);
213
+ --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);
214
+ --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(var(--bb-color-blue-900)0.14);
215
+ --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);
216
+ --bb-shadow-blue-25: 0 1px 1px 0 rgba(17, 43, 85, 0.05);
217
+ --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);
218
+ --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);
219
+ --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);
213
220
  }
214
221
 
215
222
  .sky-theme-modern.sky-theme-brand-base.sky-theme-mode-compact {
@@ -259,6 +266,11 @@
259
266
  --sky-color-background-action-tertiary-disabled: var(--bb-color-gray-700);
260
267
  --sky-color-background-action-tertiary-focus: var(--bb-color-transparent);
261
268
  --sky-color-background-action-tertiary-hover: var(--bb-color-transparent);
269
+ --sky-color-background-action-toolbar-active: var(--bb-color-transparent);
270
+ --sky-color-background-action-toolbar-base: var(--bb-color-transparent);
271
+ --sky-color-background-action-toolbar-disabled: var(--bb-color-gray-700);
272
+ --sky-color-background-action-toolbar-focus: var(--bb-color-transparent);
273
+ --sky-color-background-action-toolbar-hover: var(--bb-color-transparent);
262
274
  --sky-color-background-blocking: var(--bb-color-blocking);
263
275
  --sky-color-background-container-base: var(--bb-color-gray-1000);
264
276
  --sky-color-background-container-danger: var(--bb-color-red-800);
@@ -320,6 +332,11 @@
320
332
  --sky-color-border-action-tertiary-disabled: var(--bb-color-gray-800);
321
333
  --sky-color-border-action-tertiary-focus: var(--bb-color-sky-600);
322
334
  --sky-color-border-action-tertiary-hover: var(--bb-color-sky-600);
335
+ --sky-color-border-action-toolbar-active: var(--bb-color-sky-500);
336
+ --sky-color-border-action-toolbar-base: var(--bb-color-transparent);
337
+ --sky-color-border-action-toolbar-disabled: var(--bb-color-gray-800);
338
+ --sky-color-border-action-toolbar-focus: var(--bb-color-sky-600);
339
+ --sky-color-border-action-toolbar-hover: var(--bb-color-sky-600);
323
340
  --sky-color-border-column_divider: var(--bb-color-blue-400);
324
341
  --sky-color-border-container-base: var(--bb-color-blue-900);
325
342
  --sky-color-border-danger: var(--bb-color-red-400);
@@ -357,27 +374,28 @@
357
374
  --sky-color-icon-deemphasized: var(--bb-color-gray-300);
358
375
  --sky-color-icon-default: var(--bb-color-gray-25);
359
376
  --sky-color-icon-info: var(--bb-color-blue-600);
377
+ --sky-color-icon-input-action: var(--bb-color-sky-600);
360
378
  --sky-color-icon-inverse: var(--bb-color-gray-1100);
361
379
  --sky-color-icon-selected: var(--bb-color-blue-600);
362
380
  --sky-color-icon-success: var(--bb-color-green-700);
363
381
  --sky-color-icon-warning: var(--bb-color-yellow-600);
364
382
  --sky-color-text-action: var(--bb-color-sky-600);
383
+ --sky-color-text-action_contrast: var(--bb-color-blue-300);
365
384
  --sky-color-text-danger: var(--bb-color-red-400);
366
385
  --sky-color-text-deemphasized: var(--bb-color-gray-300);
367
386
  --sky-color-text-default: var(--bb-color-gray-25);
368
387
  --sky-color-text-heading: var(--bb-color-gray-50);
369
388
  --sky-color-text-inverse: var(--bb-color-gray-1100);
370
- --sky-color-text-link_highlighted: var(--bb-color-blue-300);
371
389
  --sky-color-text-selected: var(--bb-color-blue-400);
372
- --sky-elevation-focus: var(--bb-shadow-gray-200);
373
- --sky-elevation-none: var(--bb-shadow-gray-0);
374
- --sky-elevation-overflow: var(--bb-shadow-gray-200);
375
- --sky-elevation-overlay-100: var(--bb-shadow-gray-400);
376
- --sky-elevation-overlay-200: var(--bb-shadow-gray-800);
377
- --sky-elevation-overlay-300: var(--bb-shadow-gray-1600);
378
- --sky-elevation-overlay-400: var(--bb-shadow-gray-2400);
379
- --sky-elevation-raised-100: var(--bb-shadow-gray-100);
390
+ --sky-elevation-none: var(--bb-shadow-blue-0);
380
391
  --sky-opacity-wait: var(--bb-opacity-600);
392
+ --sky-elevation-focus: var(--bb-shadow-blue-200);
393
+ --sky-elevation-overflow: var(--bb-shadow-blue-200);
394
+ --sky-elevation-overlay-100: var(--bb-shadow-blue-400);
395
+ --sky-elevation-overlay-200: var(--bb-shadow-blue-800);
396
+ --sky-elevation-overlay-300: var(--bb-shadow-blue-1600);
397
+ --sky-elevation-overlay-400: var(--bb-shadow-blue-2400);
398
+ --sky-elevation-raised-100: var(--bb-shadow-blue-100);
381
399
  }
382
400
 
383
401
  .sky-theme-modern.sky-theme-brand-base {
@@ -387,7 +405,7 @@
387
405
  --sky-color-background-action-danger-focus: var(--bb-color-red-600);
388
406
  --sky-color-background-action-danger-hover: var(--bb-color-red-700);
389
407
  --sky-color-background-action-input-active: var(--bb-color-blue-100);
390
- --sky-color-background-action-input-base: var(--bb-color-transparent);
408
+ --sky-color-background-action-input-base: var(--bb-color-white);
391
409
  --sky-color-background-action-input-disabled: var(--bb-color-gray-50);
392
410
  --sky-color-background-action-input-focus: var(--bb-color-transparent);
393
411
  --sky-color-background-action-input-hover: var(--bb-color-blue-50);
@@ -406,6 +424,11 @@
406
424
  --sky-color-background-action-tertiary-disabled: var(--bb-color-gray-50);
407
425
  --sky-color-background-action-tertiary-focus: var(--bb-color-transparent);
408
426
  --sky-color-background-action-tertiary-hover: var(--bb-color-blue-50);
427
+ --sky-color-background-action-toolbar-active: var(--bb-color-blue-100);
428
+ --sky-color-background-action-toolbar-base: var(--bb-color-white);
429
+ --sky-color-background-action-toolbar-disabled: var(--bb-color-gray-50);
430
+ --sky-color-background-action-toolbar-focus: var(--bb-color-white);
431
+ --sky-color-background-action-toolbar-hover: var(--bb-color-blue-50);
409
432
  --sky-color-background-blocking: var(--bb-color-blocking);
410
433
  --sky-color-background-container-base: var(--bb-color-white);
411
434
  --sky-color-background-container-danger: var(--bb-color-red-300);
@@ -431,7 +454,7 @@
431
454
  --sky-color-background-nav-disabled: var(--bb-color-gray-50);
432
455
  --sky-color-background-nav-focus: var(--bb-color-transparent);
433
456
  --sky-color-background-nav-hover: var(--bb-color-blue-50);
434
- --sky-color-background-page: var(--bb-color-blue-25);
457
+ --sky-color-background-page: var(--bb-color-slate-100);
435
458
  --sky-color-background-scrim: var(--bb-color-scrim);
436
459
  --sky-color-background-selected-danger: var(--bb-color-red-300);
437
460
  --sky-color-background-selected-heavy: var(--bb-color-blue-600);
@@ -467,6 +490,11 @@
467
490
  --sky-color-border-action-tertiary-disabled: var(--bb-color-gray-200);
468
491
  --sky-color-border-action-tertiary-focus: var(--bb-color-blue-600);
469
492
  --sky-color-border-action-tertiary-hover: var(--bb-color-blue-600);
493
+ --sky-color-border-action-toolbar-active: var(--bb-color-blue-600);
494
+ --sky-color-border-action-toolbar-base: var(--bb-color-blue-300);
495
+ --sky-color-border-action-toolbar-disabled: var(--bb-color-gray-200);
496
+ --sky-color-border-action-toolbar-focus: var(--bb-color-blue-600);
497
+ --sky-color-border-action-toolbar-hover: var(--bb-color-blue-600);
470
498
  --sky-color-border-column_divider: var(--bb-color-blue-600);
471
499
  --sky-color-border-container-base: var(--bb-color-blue-200);
472
500
  --sky-color-border-danger: var(--bb-color-red-600);
@@ -510,57 +538,64 @@
510
538
  --sky-color-icon-deemphasized: var(--bb-color-gray-600);
511
539
  --sky-color-icon-default: var(--bb-color-gray-900);
512
540
  --sky-color-icon-info: var(--bb-color-blue-600);
541
+ --sky-color-icon-input-action: var(--bb-color-blue-600);
513
542
  --sky-color-icon-inverse: var(--bb-color-white);
514
543
  --sky-color-icon-selected: var(--bb-color-blue-600);
515
544
  --sky-color-icon-success: var(--bb-color-green-700);
516
545
  --sky-color-icon-warning: var(--bb-color-yellow-600);
517
546
  --sky-color-text-action: var(--bb-color-blue-600);
547
+ --sky-color-text-action_contrast: var(--bb-color-blue-700);
518
548
  --sky-color-text-danger: var(--bb-color-red-600);
519
549
  --sky-color-text-deemphasized: var(--bb-color-gray-600);
520
550
  --sky-color-text-default: var(--bb-color-gray-900);
521
551
  --sky-color-text-heading: var(--bb-color-blue-900);
522
552
  --sky-color-text-inverse: var(--bb-color-white);
523
- --sky-color-text-link_highlighted: var(--bb-color-blue-700);
524
553
  --sky-color-text-selected: var(--bb-color-blue-600);
525
- --sky-elevation-action-danger-active: var(--bb-shadow-gray-0);
526
- --sky-elevation-action-danger-base: var(--bb-shadow-gray-50);
527
- --sky-elevation-action-danger-disabled: var(--bb-shadow-gray-0);
528
- --sky-elevation-action-danger-focus: var(--bb-shadow-gray-50);
529
- --sky-elevation-action-danger-hover: var(--bb-shadow-gray-50);
530
- --sky-elevation-action-input-active: var(--bb-shadow-gray-25);
531
- --sky-elevation-action-input-base: var(--bb-shadow-gray-25);
532
- --sky-elevation-action-input-disabled: var(--bb-shadow-gray-0);
533
- --sky-elevation-action-input-focus: var(--bb-shadow-gray-25);
534
- --sky-elevation-action-input-hover: var(--bb-shadow-gray-25);
535
- --sky-elevation-action-primary-active: var(--bb-shadow-gray-0);
536
- --sky-elevation-action-primary-base: var(--bb-shadow-gray-50);
537
- --sky-elevation-action-primary-disabled: var(--bb-shadow-gray-0);
538
- --sky-elevation-action-primary-focus: var(--bb-shadow-gray-50);
539
- --sky-elevation-action-primary-hover: var(--bb-shadow-gray-50);
540
- --sky-elevation-action-secondary-active: var(--bb-shadow-gray-0);
541
- --sky-elevation-action-secondary-base: var(--bb-shadow-gray-50);
542
- --sky-elevation-action-secondary-disabled: var(--bb-shadow-gray-0);
543
- --sky-elevation-action-secondary-focus: var(--bb-shadow-gray-50);
544
- --sky-elevation-action-secondary-hover: var(--bb-shadow-gray-50);
545
- --sky-elevation-action-tertiary-active: var(--bb-shadow-gray-0);
546
- --sky-elevation-action-tertiary-base: var(--bb-shadow-gray-0);
547
- --sky-elevation-action-tertiary-disabled: var(--bb-shadow-gray-0);
548
- --sky-elevation-action-tertiary-focus: var(--bb-shadow-gray-0);
549
- --sky-elevation-action-tertiary-hover: var(--bb-shadow-gray-50);
550
- --sky-elevation-focus: var(--bb-shadow-gray-200);
551
- --sky-elevation-input-base: var(--bb-shadow-gray-25);
552
- --sky-elevation-input-disabled: var(--bb-shadow-gray-0);
553
- --sky-elevation-none: var(--bb-shadow-gray-0);
554
- --sky-elevation-overflow: var(--bb-shadow-gray-200);
555
- --sky-elevation-overlay-100: var(--bb-shadow-gray-400);
556
- --sky-elevation-overlay-200: var(--bb-shadow-gray-800);
557
- --sky-elevation-overlay-300: var(--bb-shadow-gray-1600);
558
- --sky-elevation-overlay-400: var(--bb-shadow-gray-2400);
559
- --sky-elevation-raised-100: var(--bb-shadow-gray-100);
554
+ --sky-elevation-action-danger-active: var(--bb-shadow-blue-0);
555
+ --sky-elevation-action-danger-disabled: var(--bb-shadow-blue-0);
556
+ --sky-elevation-action-input-disabled: var(--bb-shadow-blue-0);
557
+ --sky-elevation-action-primary-active: var(--bb-shadow-blue-0);
558
+ --sky-elevation-action-primary-disabled: var(--bb-shadow-blue-0);
559
+ --sky-elevation-action-secondary-active: var(--bb-shadow-blue-0);
560
+ --sky-elevation-action-secondary-disabled: var(--bb-shadow-blue-0);
561
+ --sky-elevation-action-tertiary-active: var(--bb-shadow-blue-0);
562
+ --sky-elevation-action-tertiary-base: var(--bb-shadow-blue-0);
563
+ --sky-elevation-action-tertiary-disabled: var(--bb-shadow-blue-0);
564
+ --sky-elevation-action-tertiary-focus: var(--bb-shadow-blue-0);
565
+ --sky-elevation-action-toolbar-active: var(--bb-shadow-blue-0);
566
+ --sky-elevation-action-toolbar-base: var(--bb-shadow-blue-0);
567
+ --sky-elevation-action-toolbar-disabled: var(--bb-shadow-blue-0);
568
+ --sky-elevation-action-toolbar-focus: var(--bb-shadow-blue-0);
569
+ --sky-elevation-input-disabled: var(--bb-shadow-blue-0);
570
+ --sky-elevation-none: var(--bb-shadow-blue-0);
571
+ --sky-image-logo-primary-src: var(--bb-image-logo-primary-src);
560
572
  --sky-opacity-wait: var(--bb-opacity-600);
573
+ --sky-elevation-action-danger-base: var(--bb-shadow-blue-50);
574
+ --sky-elevation-action-danger-focus: var(--bb-shadow-blue-50);
575
+ --sky-elevation-action-danger-hover: var(--bb-shadow-blue-50);
576
+ --sky-elevation-action-input-active: var(--bb-shadow-blue-25);
577
+ --sky-elevation-action-input-base: var(--bb-shadow-blue-25);
578
+ --sky-elevation-action-input-focus: var(--bb-shadow-blue-25);
579
+ --sky-elevation-action-input-hover: var(--bb-shadow-blue-25);
580
+ --sky-elevation-action-primary-base: var(--bb-shadow-blue-50);
581
+ --sky-elevation-action-primary-focus: var(--bb-shadow-blue-50);
582
+ --sky-elevation-action-primary-hover: var(--bb-shadow-blue-50);
583
+ --sky-elevation-action-secondary-base: var(--bb-shadow-blue-50);
584
+ --sky-elevation-action-secondary-focus: var(--bb-shadow-blue-50);
585
+ --sky-elevation-action-secondary-hover: var(--bb-shadow-blue-50);
586
+ --sky-elevation-action-tertiary-hover: var(--bb-shadow-blue-50);
587
+ --sky-elevation-action-toolbar-hover: var(--bb-shadow-blue-50);
588
+ --sky-elevation-focus: var(--bb-shadow-blue-200);
589
+ --sky-elevation-input-base: var(--bb-shadow-blue-25);
590
+ --sky-elevation-overflow: var(--bb-shadow-blue-200);
591
+ --sky-elevation-overlay-100: var(--bb-shadow-blue-400);
592
+ --sky-elevation-overlay-200: var(--bb-shadow-blue-800);
593
+ --sky-elevation-overlay-300: var(--bb-shadow-blue-1600);
594
+ --sky-elevation-overlay-400: var(--bb-shadow-blue-2400);
595
+ --sky-elevation-raised-100: var(--bb-shadow-blue-100);
561
596
  }
562
597
 
563
- .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 {
598
+ .sky-theme-modern.sky-theme-brand-base {
564
599
  --sky-font-style-deemphasized-style: italic;
565
600
  --sky-font-style-deemphasized-weight: 400;
566
601
  --sky-font-style-hint-m-style: italic;
@@ -580,7 +615,6 @@
580
615
  --sky-space-gap-stacked_supplemental-0: 0rem;
581
616
  --sky-space-gap-text_action-0: 0rem;
582
617
  --sky-space-inset-balanced-none: 0rem;
583
- --sky-space-inset-floated-top-0: 0rem;
584
618
  --sky-border-radius-0: var(--bb-border-radius-0);
585
619
  --sky-border-radius-m: var(--bb-border-radius-050);
586
620
  --sky-border-radius-pill: var(--bb-border-radius-pill);
@@ -661,6 +695,30 @@
661
695
  --sky-comp-button-toolbar-space-inset-left: var(--bb-size-fluid-50);
662
696
  --sky-comp-button-toolbar-space-inset-right: var(--bb-size-fluid-50);
663
697
  --sky-comp-button-toolbar-space-inset-top: var(--bb-size-fluid-50);
698
+ --sky-comp-card-large-actions-space-inset-bottom: var(--bb-size-fluid-50);
699
+ --sky-comp-card-large-actions-space-inset-left: var(--bb-size-fluid-150);
700
+ --sky-comp-card-large-actions-space-inset-right: var(--bb-size-fluid-150);
701
+ --sky-comp-card-large-actions-space-inset-top: var(--bb-size-fluid-50);
702
+ --sky-comp-card-large-content-space-inset-bottom: var(--bb-size-fluid-150);
703
+ --sky-comp-card-large-content-space-inset-left: var(--bb-size-fluid-150);
704
+ --sky-comp-card-large-content-space-inset-right: var(--bb-size-fluid-150);
705
+ --sky-comp-card-large-content-space-inset-top: var(--bb-size-fluid-150);
706
+ --sky-comp-card-large-header-space-inset-bottom: var(--bb-size-0);
707
+ --sky-comp-card-large-header-space-inset-left: var(--bb-size-fluid-150);
708
+ --sky-comp-card-large-header-space-inset-right: var(--bb-size-fluid-150);
709
+ --sky-comp-card-large-header-space-inset-top: var(--bb-size-fluid-150);
710
+ --sky-comp-card-small-actions-space-inset-bottom: var(--bb-size-fluid-50);
711
+ --sky-comp-card-small-actions-space-inset-left: var(--bb-size-fluid-100);
712
+ --sky-comp-card-small-actions-space-inset-right: var(--bb-size-fluid-100);
713
+ --sky-comp-card-small-actions-space-inset-top: var(--bb-size-fluid-50);
714
+ --sky-comp-card-small-content-space-inset-bottom: var(--bb-size-fluid-100);
715
+ --sky-comp-card-small-content-space-inset-left: var(--bb-size-fluid-100);
716
+ --sky-comp-card-small-content-space-inset-right: var(--bb-size-fluid-100);
717
+ --sky-comp-card-small-content-space-inset-top: var(--bb-size-fluid-100);
718
+ --sky-comp-card-small-header-space-inset-bottom: var(--bb-size-0);
719
+ --sky-comp-card-small-header-space-inset-left: var(--bb-size-fluid-100);
720
+ --sky-comp-card-small-header-space-inset-right: var(--bb-size-fluid-100);
721
+ --sky-comp-card-small-header-space-inset-top: var(--bb-size-fluid-100);
664
722
  --sky-comp-colorpicker-content-space-inset-bottom: var(--bb-size-fluid-50);
665
723
  --sky-comp-colorpicker-content-space-inset-left: var(--bb-size-fluid-75);
666
724
  --sky-comp-colorpicker-content-space-inset-right: var(--bb-size-fluid-75);
@@ -725,74 +783,130 @@
725
783
  --sky-comp-modal-footer-space-inset-left: var(--bb-size-fluid-150);
726
784
  --sky-comp-modal-footer-space-inset-right: var(--bb-size-fluid-150);
727
785
  --sky-comp-modal-footer-space-inset-top: var(--bb-size-fluid-100);
728
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--bb-size-fixed-50);
729
- --sky-comp-modal-fullscreen-space-offset-left: var(--bb-size-fixed-50);
730
- --sky-comp-modal-fullscreen-space-offset-right: var(--bb-size-fixed-50);
731
- --sky-comp-modal-fullscreen-space-offset-top: var(--bb-size-fixed-50);
786
+ --sky-comp-modal-fullscreen-space-offset-sm-bottom: var(--bb-size-fixed-75);
787
+ --sky-comp-modal-fullscreen-space-offset-sm-left: var(--bb-size-fixed-75);
788
+ --sky-comp-modal-fullscreen-space-offset-sm-right: var(--bb-size-fixed-75);
789
+ --sky-comp-modal-fullscreen-space-offset-sm-top: var(--bb-size-fixed-75);
790
+ --sky-comp-modal-fullscreen-space-offset-xs-bottom: var(--bb-size-fixed-50);
791
+ --sky-comp-modal-fullscreen-space-offset-xs-left: var(--bb-size-fixed-50);
792
+ --sky-comp-modal-fullscreen-space-offset-xs-right: var(--bb-size-fixed-50);
793
+ --sky-comp-modal-fullscreen-space-offset-xs-top: var(--bb-size-fixed-50);
732
794
  --sky-comp-modal-header-space-inset-bottom: var(--bb-size-fluid-75);
733
795
  --sky-comp-modal-header-space-inset-left: var(--bb-size-fluid-150);
734
796
  --sky-comp-modal-header-space-inset-right: var(--bb-size-fluid-150);
735
797
  --sky-comp-modal-header-space-inset-top: var(--bb-size-fluid-75);
736
- --sky-comp-modal-space-offset-bottom: var(--bb-size-fixed-50);
737
- --sky-comp-modal-space-offset-left: var(--bb-size-fixed-50);
738
- --sky-comp-modal-space-offset-right: var(--bb-size-fixed-50);
739
- --sky-comp-modal-space-offset-top: var(--bb-size-fixed-50);
798
+ --sky-comp-modal-space-offset-sm-bottom: var(--bb-size-fixed-100);
799
+ --sky-comp-modal-space-offset-sm-left: var(--bb-size-fixed-100);
800
+ --sky-comp-modal-space-offset-sm-right: var(--bb-size-fixed-100);
801
+ --sky-comp-modal-space-offset-sm-top: var(--bb-size-fixed-100);
802
+ --sky-comp-modal-space-offset-xs-bottom: var(--bb-size-fixed-50);
803
+ --sky-comp-modal-space-offset-xs-left: var(--bb-size-fixed-50);
804
+ --sky-comp-modal-space-offset-xs-right: var(--bb-size-fixed-50);
805
+ --sky-comp-modal-space-offset-xs-top: var(--bb-size-fixed-50);
740
806
  --sky-comp-navbar_item-space-inset-bottom: var(--bb-size-fluid-75);
741
807
  --sky-comp-navbar_item-space-inset-left: var(--bb-size-fluid-50);
742
808
  --sky-comp-navbar_item-space-inset-right: var(--bb-size-fluid-50);
743
809
  --sky-comp-navbar_item-space-inset-top: var(--bb-size-fluid-75);
744
- --sky-comp-page-content-blocks-space-inset-bottom: var(--bb-size-fluid-50);
745
- --sky-comp-page-content-blocks-space-inset-left: var(--bb-size-fluid-50);
746
- --sky-comp-page-content-blocks-space-inset-right: var(--bb-size-fluid-50);
747
- --sky-comp-page-content-blocks-space-inset-top: var(--bb-size-fluid-50);
748
- --sky-comp-page-content-fit-space-inset-bottom: var(--bb-size-0);
749
- --sky-comp-page-content-fit-space-inset-left: var(--bb-size-fluid-50);
750
- --sky-comp-page-content-fit-space-inset-right: var(--bb-size-fluid-50);
751
- --sky-comp-page-content-fit-space-inset-top: var(--bb-size-0);
752
- --sky-comp-page-content-list-space-inset-bottom: var(--bb-size-0);
753
- --sky-comp-page-content-list-space-inset-left: var(--bb-size-fluid-50);
754
- --sky-comp-page-content-list-space-inset-right: var(--bb-size-fluid-50);
755
- --sky-comp-page-content-list-space-inset-top: var(--bb-size-0);
756
- --sky-comp-page-content-tabs-space-inset-bottom: var(--bb-size-0);
757
- --sky-comp-page-content-tabs-space-inset-left: var(--bb-size-0);
758
- --sky-comp-page-content-tabs-space-inset-right: var(--bb-size-0);
759
- --sky-comp-page-content-tabs-space-inset-top: var(--bb-size-0);
760
- --sky-comp-page-header-blocks-space-inset-bottom: var(--bb-size-fluid-100);
761
- --sky-comp-page-header-blocks-space-inset-left: var(--bb-size-fluid-50);
762
- --sky-comp-page-header-blocks-space-inset-right: var(--bb-size-fluid-50);
763
- --sky-comp-page-header-blocks-space-inset-top: var(--bb-size-fluid-100);
764
- --sky-comp-page-header-fit-space-inset-bottom: var(--bb-size-fluid-100);
765
- --sky-comp-page-header-fit-space-inset-left: var(--bb-size-fluid-50);
766
- --sky-comp-page-header-fit-space-inset-right: var(--bb-size-fluid-50);
767
- --sky-comp-page-header-fit-space-inset-top: var(--bb-size-fluid-100);
768
- --sky-comp-page-header-list-space-inset-bottom: var(--bb-size-fluid-100);
769
- --sky-comp-page-header-list-space-inset-left: var(--bb-size-fluid-50);
770
- --sky-comp-page-header-list-space-inset-right: var(--bb-size-fluid-50);
771
- --sky-comp-page-header-list-space-inset-top: var(--bb-size-fluid-100);
772
- --sky-comp-page-header-tabs-space-inset-bottom: var(--bb-size-fluid-100);
773
- --sky-comp-page-header-tabs-space-inset-left: var(--bb-size-fluid-50);
774
- --sky-comp-page-header-tabs-space-inset-right: var(--bb-size-fluid-50);
775
- --sky-comp-page-header-tabs-space-inset-top: var(--bb-size-fluid-100);
776
- --sky-comp-page-links-blocks-space-inset-bottom: var(--bb-size-fluid-150);
777
- --sky-comp-page-links-blocks-space-inset-left: var(--bb-size-fluid-50);
778
- --sky-comp-page-links-blocks-space-inset-right: var(--bb-size-fluid-50);
779
- --sky-comp-page-links-blocks-space-inset-top: var(--bb-size-fluid-150);
780
- --sky-comp-page-links-list-space-inset-bottom: var(--bb-size-fluid-150);
781
- --sky-comp-page-links-list-space-inset-left: var(--bb-size-fluid-50);
782
- --sky-comp-page-links-list-space-inset-right: var(--bb-size-fluid-50);
783
- --sky-comp-page-links-list-space-inset-top: var(--bb-size-fluid-150);
784
- --sky-comp-page-links-tabs-space-inset-bottom: var(--bb-size-fluid-150);
785
- --sky-comp-page-links-tabs-space-inset-left: var(--bb-size-fluid-50);
786
- --sky-comp-page-links-tabs-space-inset-right: var(--bb-size-fluid-50);
787
- --sky-comp-page-links-tabs-space-inset-top: var(--bb-size-fluid-150);
788
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--bb-size-0);
789
- --sky-comp-page-tabset-tabs-space-inset-left: var(--bb-size-fluid-50);
790
- --sky-comp-page-tabset-tabs-space-inset-right: var(--bb-size-0);
791
- --sky-comp-page-tabset-tabs-space-inset-top: var(--bb-size-0);
792
- --sky-comp-paging_button-space-inset-bottom: var(--bb-size-fluid-12);
810
+ --sky-comp-page-content-blocks-space-inset-sm-bottom: var(--bb-size-fluid-150);
811
+ --sky-comp-page-content-blocks-space-inset-sm-left: var(--bb-size-fluid-150);
812
+ --sky-comp-page-content-blocks-space-inset-sm-right: var(--bb-size-fluid-150);
813
+ --sky-comp-page-content-blocks-space-inset-sm-top: var(--bb-size-fluid-150);
814
+ --sky-comp-page-content-blocks-space-inset-xs-bottom: var(--bb-size-fluid-50);
815
+ --sky-comp-page-content-blocks-space-inset-xs-left: var(--bb-size-fluid-50);
816
+ --sky-comp-page-content-blocks-space-inset-xs-right: var(--bb-size-fluid-50);
817
+ --sky-comp-page-content-blocks-space-inset-xs-top: var(--bb-size-fluid-50);
818
+ --sky-comp-page-content-fit-space-inset-sm-bottom: var(--bb-size-0);
819
+ --sky-comp-page-content-fit-space-inset-sm-left: var(--bb-size-fluid-150);
820
+ --sky-comp-page-content-fit-space-inset-sm-right: var(--bb-size-fluid-150);
821
+ --sky-comp-page-content-fit-space-inset-sm-top: var(--bb-size-0);
822
+ --sky-comp-page-content-fit-space-inset-xs-bottom: var(--bb-size-0);
823
+ --sky-comp-page-content-fit-space-inset-xs-left: var(--bb-size-fluid-50);
824
+ --sky-comp-page-content-fit-space-inset-xs-right: var(--bb-size-fluid-50);
825
+ --sky-comp-page-content-fit-space-inset-xs-top: var(--bb-size-0);
826
+ --sky-comp-page-content-list-space-inset-sm-bottom: var(--bb-size-0);
827
+ --sky-comp-page-content-list-space-inset-sm-left: var(--bb-size-fluid-150);
828
+ --sky-comp-page-content-list-space-inset-sm-right: var(--bb-size-fluid-150);
829
+ --sky-comp-page-content-list-space-inset-sm-top: var(--bb-size-0);
830
+ --sky-comp-page-content-list-space-inset-xs-bottom: var(--bb-size-0);
831
+ --sky-comp-page-content-list-space-inset-xs-left: var(--bb-size-fluid-50);
832
+ --sky-comp-page-content-list-space-inset-xs-right: var(--bb-size-fluid-50);
833
+ --sky-comp-page-content-list-space-inset-xs-top: var(--bb-size-0);
834
+ --sky-comp-page-content-tabs-space-inset-sm-bottom: var(--bb-size-0);
835
+ --sky-comp-page-content-tabs-space-inset-sm-left: var(--bb-size-0);
836
+ --sky-comp-page-content-tabs-space-inset-sm-right: var(--bb-size-0);
837
+ --sky-comp-page-content-tabs-space-inset-sm-top: var(--bb-size-0);
838
+ --sky-comp-page-content-tabs-space-inset-xs-bottom: var(--bb-size-0);
839
+ --sky-comp-page-content-tabs-space-inset-xs-left: var(--bb-size-0);
840
+ --sky-comp-page-content-tabs-space-inset-xs-right: var(--bb-size-0);
841
+ --sky-comp-page-content-tabs-space-inset-xs-top: var(--bb-size-0);
842
+ --sky-comp-page-header-blocks-space-inset-sm-bottom: var(--bb-size-0);
843
+ --sky-comp-page-header-blocks-space-inset-sm-left: var(--bb-size-fluid-150);
844
+ --sky-comp-page-header-blocks-space-inset-sm-right: var(--bb-size-fluid-150);
845
+ --sky-comp-page-header-blocks-space-inset-sm-top: var(--bb-size-fluid-150);
846
+ --sky-comp-page-header-blocks-space-inset-xs-bottom: var(--bb-size-fluid-100);
847
+ --sky-comp-page-header-blocks-space-inset-xs-left: var(--bb-size-fluid-50);
848
+ --sky-comp-page-header-blocks-space-inset-xs-right: var(--bb-size-fluid-50);
849
+ --sky-comp-page-header-blocks-space-inset-xs-top: var(--bb-size-fluid-100);
850
+ --sky-comp-page-header-fit-space-inset-sm-bottom: var(--bb-size-fluid-100);
851
+ --sky-comp-page-header-fit-space-inset-sm-left: var(--bb-size-fluid-150);
852
+ --sky-comp-page-header-fit-space-inset-sm-right: var(--bb-size-fluid-150);
853
+ --sky-comp-page-header-fit-space-inset-sm-top: var(--bb-size-fluid-150);
854
+ --sky-comp-page-header-fit-space-inset-xs-bottom: var(--bb-size-fluid-100);
855
+ --sky-comp-page-header-fit-space-inset-xs-left: var(--bb-size-fluid-50);
856
+ --sky-comp-page-header-fit-space-inset-xs-right: var(--bb-size-fluid-50);
857
+ --sky-comp-page-header-fit-space-inset-xs-top: var(--bb-size-fluid-100);
858
+ --sky-comp-page-header-list-space-inset-sm-bottom: var(--bb-size-fluid-100);
859
+ --sky-comp-page-header-list-space-inset-sm-left: var(--bb-size-fluid-150);
860
+ --sky-comp-page-header-list-space-inset-sm-right: var(--bb-size-fluid-150);
861
+ --sky-comp-page-header-list-space-inset-sm-top: var(--bb-size-fluid-150);
862
+ --sky-comp-page-header-list-space-inset-xs-bottom: var(--bb-size-fluid-100);
863
+ --sky-comp-page-header-list-space-inset-xs-left: var(--bb-size-fluid-50);
864
+ --sky-comp-page-header-list-space-inset-xs-right: var(--bb-size-fluid-50);
865
+ --sky-comp-page-header-list-space-inset-xs-top: var(--bb-size-fluid-100);
866
+ --sky-comp-page-header-tabs-space-inset-sm-bottom: var(--bb-size-fluid-100);
867
+ --sky-comp-page-header-tabs-space-inset-sm-left: var(--bb-size-fluid-150);
868
+ --sky-comp-page-header-tabs-space-inset-sm-right: var(--bb-size-fluid-150);
869
+ --sky-comp-page-header-tabs-space-inset-sm-top: var(--bb-size-fluid-150);
870
+ --sky-comp-page-header-tabs-space-inset-xs-bottom: var(--bb-size-fluid-100);
871
+ --sky-comp-page-header-tabs-space-inset-xs-left: var(--bb-size-fluid-50);
872
+ --sky-comp-page-header-tabs-space-inset-xs-right: var(--bb-size-fluid-50);
873
+ --sky-comp-page-header-tabs-space-inset-xs-top: var(--bb-size-fluid-100);
874
+ --sky-comp-page-links-blocks-space-inset-sm-bottom: var(--bb-size-fluid-150);
875
+ --sky-comp-page-links-blocks-space-inset-sm-left: var(--bb-size-fluid-150);
876
+ --sky-comp-page-links-blocks-space-inset-sm-right: var(--bb-size-fluid-150);
877
+ --sky-comp-page-links-blocks-space-inset-sm-top: var(--bb-size-fluid-150);
878
+ --sky-comp-page-links-blocks-space-inset-xs-bottom: var(--bb-size-fluid-150);
879
+ --sky-comp-page-links-blocks-space-inset-xs-left: var(--bb-size-fluid-50);
880
+ --sky-comp-page-links-blocks-space-inset-xs-right: var(--bb-size-fluid-50);
881
+ --sky-comp-page-links-blocks-space-inset-xs-top: var(--bb-size-fluid-150);
882
+ --sky-comp-page-links-list-space-inset-sm-bottom: var(--bb-size-fluid-150);
883
+ --sky-comp-page-links-list-space-inset-sm-left: var(--bb-size-fluid-150);
884
+ --sky-comp-page-links-list-space-inset-sm-right: var(--bb-size-fluid-150);
885
+ --sky-comp-page-links-list-space-inset-sm-top: var(--bb-size-fluid-150);
886
+ --sky-comp-page-links-list-space-inset-xs-bottom: var(--bb-size-fluid-150);
887
+ --sky-comp-page-links-list-space-inset-xs-left: var(--bb-size-fluid-50);
888
+ --sky-comp-page-links-list-space-inset-xs-right: var(--bb-size-fluid-50);
889
+ --sky-comp-page-links-list-space-inset-xs-top: var(--bb-size-fluid-150);
890
+ --sky-comp-page-links-tabs-space-inset-sm-bottom: var(--bb-size-fluid-150);
891
+ --sky-comp-page-links-tabs-space-inset-sm-left: var(--bb-size-fluid-150);
892
+ --sky-comp-page-links-tabs-space-inset-sm-right: var(--bb-size-fluid-150);
893
+ --sky-comp-page-links-tabs-space-inset-sm-top: var(--bb-size-fluid-150);
894
+ --sky-comp-page-links-tabs-space-inset-xs-bottom: var(--bb-size-fluid-150);
895
+ --sky-comp-page-links-tabs-space-inset-xs-left: var(--bb-size-fluid-50);
896
+ --sky-comp-page-links-tabs-space-inset-xs-right: var(--bb-size-fluid-50);
897
+ --sky-comp-page-links-tabs-space-inset-xs-top: var(--bb-size-fluid-150);
898
+ --sky-comp-page-tabset-tabs-space-inset-sm-bottom: var(--bb-size-0);
899
+ --sky-comp-page-tabset-tabs-space-inset-sm-left: var(--bb-size-fluid-150);
900
+ --sky-comp-page-tabset-tabs-space-inset-sm-right: var(--bb-size-0);
901
+ --sky-comp-page-tabset-tabs-space-inset-sm-top: var(--bb-size-0);
902
+ --sky-comp-page-tabset-tabs-space-inset-xs-bottom: var(--bb-size-0);
903
+ --sky-comp-page-tabset-tabs-space-inset-xs-left: var(--bb-size-fluid-50);
904
+ --sky-comp-page-tabset-tabs-space-inset-xs-right: var(--bb-size-0);
905
+ --sky-comp-page-tabset-tabs-space-inset-xs-top: var(--bb-size-0);
906
+ --sky-comp-paging_button-space-inset-bottom: var(--bb-size-fluid-25);
793
907
  --sky-comp-paging_button-space-inset-left: var(--bb-size-fluid-50);
794
908
  --sky-comp-paging_button-space-inset-right: var(--bb-size-fluid-50);
795
- --sky-comp-paging_button-space-inset-top: var(--bb-size-fluid-12);
909
+ --sky-comp-paging_button-space-inset-top: var(--bb-size-fluid-25);
796
910
  --sky-comp-popover-content-space-inset-bottom: var(--bb-size-fluid-100);
797
911
  --sky-comp-popover-content-space-inset-left: var(--bb-size-fluid-100);
798
912
  --sky-comp-popover-content-space-inset-right: var(--bb-size-fluid-100);
@@ -801,6 +915,10 @@
801
915
  --sky-comp-popover-header-space-inset-left: var(--bb-size-fluid-100);
802
916
  --sky-comp-popover-header-space-inset-right: var(--bb-size-fluid-100);
803
917
  --sky-comp-popover-header-space-inset-top: var(--bb-size-fluid-100);
918
+ --sky-comp-repeater_item-checkbox-space-offset-bottom: var(--bb-size-fluid-25);
919
+ --sky-comp-repeater_item-checkbox-space-offset-left: var(--bb-size-0);
920
+ --sky-comp-repeater_item-checkbox-space-offset-right: var(--bb-size-0);
921
+ --sky-comp-repeater_item-checkbox-space-offset-top: var(--bb-size-fluid-25);
804
922
  --sky-comp-repeater_item-space-inset-bottom: var(--bb-size-fluid-75);
805
923
  --sky-comp-repeater_item-space-inset-left: var(--bb-size-fluid-50);
806
924
  --sky-comp-repeater_item-space-inset-right: var(--bb-size-fluid-50);
@@ -841,10 +959,14 @@
841
959
  --sky-comp-tab-horizontal-space-inset-left: var(--bb-size-fluid-75);
842
960
  --sky-comp-tab-horizontal-space-inset-right: var(--bb-size-fluid-75);
843
961
  --sky-comp-tab-horizontal-space-inset-top: var(--bb-size-fluid-50);
844
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--bb-size-fluid-75);
845
- --sky-comp-tab-vertical-content-space-inset-left: var(--bb-size-fluid-75);
846
- --sky-comp-tab-vertical-content-space-inset-right: var(--bb-size-fluid-75);
847
- --sky-comp-tab-vertical-content-space-inset-top: var(--bb-size-fluid-75);
962
+ --sky-comp-tab-vertical-content-space-inset-sm-bottom: var(--bb-size-fluid-50);
963
+ --sky-comp-tab-vertical-content-space-inset-sm-left: var(--bb-size-fluid-75);
964
+ --sky-comp-tab-vertical-content-space-inset-sm-right: var(--bb-size-fluid-75);
965
+ --sky-comp-tab-vertical-content-space-inset-sm-top: var(--bb-size-fluid-50);
966
+ --sky-comp-tab-vertical-content-space-inset-xs-bottom: var(--bb-size-fluid-75);
967
+ --sky-comp-tab-vertical-content-space-inset-xs-left: var(--bb-size-fluid-75);
968
+ --sky-comp-tab-vertical-content-space-inset-xs-right: var(--bb-size-fluid-75);
969
+ --sky-comp-tab-vertical-content-space-inset-xs-top: var(--bb-size-fluid-75);
848
970
  --sky-comp-tab-vertical-group-button-space-inset-bottom: var(--bb-size-fluid-50);
849
971
  --sky-comp-tab-vertical-group-button-space-inset-left: var(--bb-size-fluid-50);
850
972
  --sky-comp-tab-vertical-group-button-space-inset-right: var(--bb-size-fluid-50);
@@ -869,14 +991,22 @@
869
991
  --sky-comp-text_editor-space-inset-left: var(--bb-size-fluid-75);
870
992
  --sky-comp-text_editor-space-inset-right: var(--bb-size-fluid-75);
871
993
  --sky-comp-text_editor-space-inset-top: var(--bb-size-fluid-75);
872
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--bb-size-0);
873
- --sky-comp-tile-dashboard-column-space-inset-left: var(--bb-size-0);
874
- --sky-comp-tile-dashboard-column-space-inset-right: var(--bb-size-0);
875
- --sky-comp-tile-dashboard-column-space-inset-top: var(--bb-size-0);
876
- --sky-comp-tile-dashboard-space-inset-bottom: var(--bb-size-0);
877
- --sky-comp-tile-dashboard-space-inset-left: var(--bb-size-0);
878
- --sky-comp-tile-dashboard-space-inset-right: var(--bb-size-0);
879
- --sky-comp-tile-dashboard-space-inset-top: var(--bb-size-0);
994
+ --sky-comp-tile-dashboard-column-space-inset-sm-bottom: var(--bb-size-0);
995
+ --sky-comp-tile-dashboard-column-space-inset-sm-left: var(--bb-size-fluid-75);
996
+ --sky-comp-tile-dashboard-column-space-inset-sm-right: var(--bb-size-fluid-75);
997
+ --sky-comp-tile-dashboard-column-space-inset-sm-top: var(--bb-size-0);
998
+ --sky-comp-tile-dashboard-column-space-inset-xs-bottom: var(--bb-size-0);
999
+ --sky-comp-tile-dashboard-column-space-inset-xs-left: var(--bb-size-0);
1000
+ --sky-comp-tile-dashboard-column-space-inset-xs-right: var(--bb-size-0);
1001
+ --sky-comp-tile-dashboard-column-space-inset-xs-top: var(--bb-size-0);
1002
+ --sky-comp-tile-dashboard-space-inset-sm-bottom: var(--bb-size-0);
1003
+ --sky-comp-tile-dashboard-space-inset-sm-left: var(--bb-size-fluid-50);
1004
+ --sky-comp-tile-dashboard-space-inset-sm-right: var(--bb-size-fluid-50);
1005
+ --sky-comp-tile-dashboard-space-inset-sm-top: var(--bb-size-0);
1006
+ --sky-comp-tile-dashboard-space-inset-xs-bottom: var(--bb-size-0);
1007
+ --sky-comp-tile-dashboard-space-inset-xs-left: var(--bb-size-0);
1008
+ --sky-comp-tile-dashboard-space-inset-xs-right: var(--bb-size-0);
1009
+ --sky-comp-tile-dashboard-space-inset-xs-top: var(--bb-size-0);
880
1010
  --sky-comp-tile-section-space-inset-bottom: var(--bb-size-fluid-75);
881
1011
  --sky-comp-tile-section-space-inset-left: var(--bb-size-0);
882
1012
  --sky-comp-tile-section-space-inset-right: var(--bb-size-0);
@@ -1043,6 +1173,7 @@
1043
1173
  --sky-space-gap-stacked_supplemental-m: var(--bb-size-fluid-50);
1044
1174
  --sky-space-gap-stacked_supplemental-s: var(--bb-size-fluid-25);
1045
1175
  --sky-space-gap-stacked_supplemental-xl: var(--bb-size-fluid-100);
1176
+ --sky-space-gap-stacked_supplemental-xs: var(--bb-size-fluid-12);
1046
1177
  --sky-space-gap-text_action-l: var(--bb-size-fluid-100);
1047
1178
  --sky-space-gap-text_action-m: var(--bb-size-fluid-75);
1048
1179
  --sky-space-gap-text_action-s: var(--bb-size-fluid-50);
@@ -1055,36 +1186,12 @@
1055
1186
  --sky-space-inline-xs: var(--bb-size-fluid-25);
1056
1187
  --sky-space-inline-xxl: var(--bb-size-fluid-300);
1057
1188
  --sky-space-inline-xxs: var(--bb-size-fluid-12);
1058
- --sky-space-inset-balanced-fixed-l: var(--bb-size-fixed-100);
1059
- --sky-space-inset-balanced-fixed-m: var(--bb-size-fixed-75);
1060
- --sky-space-inset-balanced-fixed-s: var(--bb-size-fixed-50);
1061
- --sky-space-inset-balanced-fixed-xl: var(--bb-size-fixed-150);
1062
1189
  --sky-space-inset-balanced-l: var(--bb-size-fluid-100);
1063
1190
  --sky-space-inset-balanced-m: var(--bb-size-fluid-75);
1064
1191
  --sky-space-inset-balanced-s: var(--bb-size-fluid-50);
1065
1192
  --sky-space-inset-balanced-xl: var(--bb-size-fluid-150);
1066
1193
  --sky-space-inset-balanced-xs: var(--bb-size-fluid-25);
1067
1194
  --sky-space-inset-balanced-xxs: var(--bb-size-fluid-12);
1068
- --sky-space-inset-bottomless-bottom-l: var(--bb-size-0);
1069
- --sky-space-inset-bottomless-bottom-m: var(--bb-size-0);
1070
- --sky-space-inset-bottomless-bottom-xl: var(--bb-size-0);
1071
- --sky-space-inset-bottomless-left-l: var(--bb-size-fluid-100);
1072
- --sky-space-inset-bottomless-left-m: var(--bb-size-fluid-75);
1073
- --sky-space-inset-bottomless-left-xl: var(--bb-size-fluid-150);
1074
- --sky-space-inset-bottomless-right-l: var(--bb-size-fluid-100);
1075
- --sky-space-inset-bottomless-right-m: var(--bb-size-fluid-75);
1076
- --sky-space-inset-bottomless-right-xl: var(--bb-size-fluid-150);
1077
- --sky-space-inset-bottomless-top-l: var(--bb-size-fluid-100);
1078
- --sky-space-inset-bottomless-top-m: var(--bb-size-fluid-75);
1079
- --sky-space-inset-bottomless-top-xl: var(--bb-size-fluid-150);
1080
- --sky-space-inset-floated-bottom-m: var(--bb-size-fluid-150);
1081
- --sky-space-inset-floated-bottom-s: var(--bb-size-fluid-100);
1082
- --sky-space-inset-floated-left-m: var(--bb-size-fluid-150);
1083
- --sky-space-inset-floated-left-s: var(--bb-size-fluid-100);
1084
- --sky-space-inset-floated-right-m: var(--bb-size-fluid-150);
1085
- --sky-space-inset-floated-right-s: var(--bb-size-fluid-100);
1086
- --sky-space-inset-floated-top-m: var(--bb-size-fluid-50);
1087
- --sky-space-inset-floated-top-s: var(--bb-size-fluid-25);
1088
1195
  --sky-space-inset-horizontal-bottom-0: var(--bb-size-0);
1089
1196
  --sky-space-inset-horizontal-bottom-l: var(--bb-size-0);
1090
1197
  --sky-space-inset-horizontal-bottom-m: var(--bb-size-0);
@@ -1105,68 +1212,10 @@
1105
1212
  --sky-space-inset-horizontal-top-m: var(--bb-size-0);
1106
1213
  --sky-space-inset-horizontal-top-s: var(--bb-size-0);
1107
1214
  --sky-space-inset-horizontal-top-xl: var(--bb-size-0);
1108
- --sky-space-inset-input-bottom-m: var(--bb-size-fluid-50);
1109
- --sky-space-inset-input-left-m: var(--bb-size-fluid-100);
1110
- --sky-space-inset-input-right-m: var(--bb-size-fluid-100);
1111
- --sky-space-inset-input-top-m: var(--bb-size-fluid-50);
1112
- --sky-space-inset-input_label-bottom-m: var(--bb-size-fluid-12);
1113
- --sky-space-inset-input_label-top-m: var(--bb-size-fluid-37);
1114
- --sky-space-inset-letterbox-1_2-bottom-m: var(--bb-size-fluid-100);
1115
- --sky-space-inset-letterbox-1_2-left-m: var(--bb-size-fluid-50);
1116
- --sky-space-inset-letterbox-1_2-right-m: var(--bb-size-fluid-50);
1117
- --sky-space-inset-letterbox-1_2-top-m: var(--bb-size-fluid-100);
1118
- --sky-space-inset-letterbox-1_3-bottom-m: var(--bb-size-fluid-150);
1119
- --sky-space-inset-letterbox-1_3-left-m: var(--bb-size-fluid-50);
1120
- --sky-space-inset-letterbox-1_3-right-m: var(--bb-size-fluid-50);
1121
- --sky-space-inset-letterbox-1_3-top-m: var(--bb-size-fluid-150);
1122
1215
  --sky-space-inset-letterbox-2_3-bottom-m: var(--bb-size-fluid-75);
1123
1216
  --sky-space-inset-letterbox-2_3-left-m: var(--bb-size-fluid-50);
1124
1217
  --sky-space-inset-letterbox-2_3-right-m: var(--bb-size-fluid-50);
1125
1218
  --sky-space-inset-letterbox-2_3-top-m: var(--bb-size-fluid-75);
1126
- --sky-space-inset-pillarbox-1_2-bottom-l: var(--bb-size-fluid-75);
1127
- --sky-space-inset-pillarbox-1_2-bottom-m: var(--bb-size-fluid-50);
1128
- --sky-space-inset-pillarbox-1_2-bottom-s: var(--bb-size-fluid-25);
1129
- --sky-space-inset-pillarbox-1_2-left-l: var(--bb-size-fluid-150);
1130
- --sky-space-inset-pillarbox-1_2-left-m: var(--bb-size-fluid-100);
1131
- --sky-space-inset-pillarbox-1_2-left-s: var(--bb-size-fluid-50);
1132
- --sky-space-inset-pillarbox-1_2-right-l: var(--bb-size-fluid-150);
1133
- --sky-space-inset-pillarbox-1_2-right-m: var(--bb-size-fluid-100);
1134
- --sky-space-inset-pillarbox-1_2-right-s: var(--bb-size-fluid-50);
1135
- --sky-space-inset-pillarbox-1_2-top-l: var(--bb-size-fluid-75);
1136
- --sky-space-inset-pillarbox-1_2-top-m: var(--bb-size-fluid-50);
1137
- --sky-space-inset-pillarbox-1_2-top-s: var(--bb-size-fluid-25);
1138
- --sky-space-inset-pillarbox-1_3-bottom-m: var(--bb-size-fluid-50);
1139
- --sky-space-inset-pillarbox-1_3-left-m: var(--bb-size-fluid-150);
1140
- --sky-space-inset-pillarbox-1_3-right-m: var(--bb-size-fluid-150);
1141
- --sky-space-inset-pillarbox-1_3-top-m: var(--bb-size-fluid-50);
1142
- --sky-space-inset-pillarbox-1_4-bottom-s: var(--bb-size-fluid-12);
1143
- --sky-space-inset-pillarbox-1_4-bottom-xs: var(--bb-size-fluid-6);
1144
- --sky-space-inset-pillarbox-1_4-left-s: var(--bb-size-fluid-50);
1145
- --sky-space-inset-pillarbox-1_4-left-xs: var(--bb-size-fluid-25);
1146
- --sky-space-inset-pillarbox-1_4-right-s: var(--bb-size-fluid-50);
1147
- --sky-space-inset-pillarbox-1_4-right-xs: var(--bb-size-fluid-25);
1148
- --sky-space-inset-pillarbox-1_4-top-s: var(--bb-size-fluid-12);
1149
- --sky-space-inset-pillarbox-1_4-top-xs: var(--bb-size-fluid-6);
1150
- --sky-space-inset-pillarbox-2_3-bottom-l: var(--bb-size-fluid-100);
1151
- --sky-space-inset-pillarbox-2_3-bottom-m: var(--bb-size-fluid-50);
1152
- --sky-space-inset-pillarbox-2_3-left-l: var(--bb-size-fluid-150);
1153
- --sky-space-inset-pillarbox-2_3-left-m: var(--bb-size-fluid-75);
1154
- --sky-space-inset-pillarbox-2_3-right-l: var(--bb-size-fluid-150);
1155
- --sky-space-inset-pillarbox-2_3-right-m: var(--bb-size-fluid-75);
1156
- --sky-space-inset-pillarbox-2_3-top-l: var(--bb-size-fluid-100);
1157
- --sky-space-inset-pillarbox-2_3-top-m: var(--bb-size-fluid-50);
1158
- --sky-space-inset-sunk-bottom-l: var(--bb-size-fluid-100);
1159
- --sky-space-inset-sunk-left-l: var(--bb-size-fluid-150);
1160
- --sky-space-inset-sunk-right-l: var(--bb-size-fluid-150);
1161
- --sky-space-inset-sunk-top-l: var(--bb-size-fluid-150);
1162
- --sky-space-inset-switch_icon-bottom: var(--bb-size-fluid-50);
1163
- --sky-space-inset-switch_icon-left: var(--bb-size-fluid-50);
1164
- --sky-space-inset-switch_icon-right: var(--bb-size-fluid-50);
1165
- --sky-space-inset-switch_icon-top: var(--bb-size-fluid-50);
1166
- --sky-space-inset-tabs-l: var(--bb-size-fluid-100);
1167
- --sky-space-inset-tabs-m: var(--bb-size-fluid-75);
1168
- --sky-space-inset-tabs-s: var(--bb-size-fluid-50);
1169
- --sky-space-inset-tabs-xl: var(--bb-size-fluid-150);
1170
1219
  --sky-space-inset-thumb: var(--bb-size-fixed-6);
1171
1220
  --sky-space-inset-thumbnail_matte-l: var(--bb-size-fluid-25);
1172
1221
  --sky-space-inset-thumbnail_matte-m: var(--bb-size-fluid-18);
@@ -1177,8 +1226,6 @@
1177
1226
  --sky-space-inset-vertical-bottom-m: var(--bb-size-fluid-75);
1178
1227
  --sky-space-inset-vertical-bottom-s: var(--bb-size-fluid-50);
1179
1228
  --sky-space-inset-vertical-bottom-xl: var(--bb-size-fluid-150);
1180
- --sky-space-inset-vertical-fixed-bottom-l: var(--bb-size-fixed-100);
1181
- --sky-space-inset-vertical-fixed-top-l: var(--bb-size-fixed-100);
1182
1229
  --sky-space-inset-vertical-left-0: var(--bb-size-0);
1183
1230
  --sky-space-inset-vertical-left-l: var(--bb-size-0);
1184
1231
  --sky-space-inset-vertical-left-m: var(--bb-size-0);
@@ -1221,157 +1268,11 @@
1221
1268
  --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);
1222
1269
  }
1223
1270
 
1224
- @media (min-width: 768px) {
1225
- .sky-theme-modern.sky-theme-brand-base {
1226
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--bb-size-fixed-75);
1227
- --sky-comp-modal-fullscreen-space-offset-left: var(--bb-size-fixed-75);
1228
- --sky-comp-modal-fullscreen-space-offset-right: var(--bb-size-fixed-75);
1229
- --sky-comp-modal-fullscreen-space-offset-top: var(--bb-size-fixed-75);
1230
- --sky-comp-modal-space-offset-bottom: var(--bb-size-fixed-100);
1231
- --sky-comp-modal-space-offset-left: var(--bb-size-fixed-100);
1232
- --sky-comp-modal-space-offset-right: var(--bb-size-fixed-100);
1233
- --sky-comp-modal-space-offset-top: var(--bb-size-fixed-100);
1234
- --sky-comp-page-content-blocks-space-inset-bottom: var(--bb-size-fluid-150);
1235
- --sky-comp-page-content-blocks-space-inset-left: var(--bb-size-fluid-150);
1236
- --sky-comp-page-content-blocks-space-inset-right: var(--bb-size-fluid-150);
1237
- --sky-comp-page-content-blocks-space-inset-top: var(--bb-size-fluid-150);
1238
- --sky-comp-page-content-fit-space-inset-bottom: var(--bb-size-0);
1239
- --sky-comp-page-content-fit-space-inset-left: var(--bb-size-fluid-150);
1240
- --sky-comp-page-content-fit-space-inset-right: var(--bb-size-fluid-150);
1241
- --sky-comp-page-content-fit-space-inset-top: var(--bb-size-0);
1242
- --sky-comp-page-content-list-space-inset-bottom: var(--bb-size-0);
1243
- --sky-comp-page-content-list-space-inset-left: var(--bb-size-fluid-150);
1244
- --sky-comp-page-content-list-space-inset-right: var(--bb-size-fluid-150);
1245
- --sky-comp-page-content-list-space-inset-top: var(--bb-size-0);
1246
- --sky-comp-page-content-tabs-space-inset-bottom: var(--bb-size-0);
1247
- --sky-comp-page-content-tabs-space-inset-left: var(--bb-size-0);
1248
- --sky-comp-page-content-tabs-space-inset-right: var(--bb-size-0);
1249
- --sky-comp-page-content-tabs-space-inset-top: var(--bb-size-0);
1250
- --sky-comp-page-header-blocks-space-inset-bottom: var(--bb-size-0);
1251
- --sky-comp-page-header-blocks-space-inset-left: var(--bb-size-fluid-150);
1252
- --sky-comp-page-header-blocks-space-inset-right: var(--bb-size-fluid-150);
1253
- --sky-comp-page-header-blocks-space-inset-top: var(--bb-size-fluid-150);
1254
- --sky-comp-page-header-fit-space-inset-bottom: var(--bb-size-fluid-100);
1255
- --sky-comp-page-header-fit-space-inset-left: var(--bb-size-fluid-150);
1256
- --sky-comp-page-header-fit-space-inset-right: var(--bb-size-fluid-150);
1257
- --sky-comp-page-header-fit-space-inset-top: var(--bb-size-fluid-150);
1258
- --sky-comp-page-header-list-space-inset-bottom: var(--bb-size-fluid-100);
1259
- --sky-comp-page-header-list-space-inset-left: var(--bb-size-fluid-150);
1260
- --sky-comp-page-header-list-space-inset-right: var(--bb-size-fluid-150);
1261
- --sky-comp-page-header-list-space-inset-top: var(--bb-size-fluid-150);
1262
- --sky-comp-page-header-tabs-space-inset-bottom: var(--bb-size-fluid-100);
1263
- --sky-comp-page-header-tabs-space-inset-left: var(--bb-size-fluid-150);
1264
- --sky-comp-page-header-tabs-space-inset-right: var(--bb-size-fluid-150);
1265
- --sky-comp-page-header-tabs-space-inset-top: var(--bb-size-fluid-150);
1266
- --sky-comp-page-links-blocks-space-inset-bottom: var(--bb-size-fluid-150);
1267
- --sky-comp-page-links-blocks-space-inset-left: var(--bb-size-fluid-150);
1268
- --sky-comp-page-links-blocks-space-inset-right: var(--bb-size-fluid-150);
1269
- --sky-comp-page-links-blocks-space-inset-top: var(--bb-size-fluid-150);
1270
- --sky-comp-page-links-list-space-inset-bottom: var(--bb-size-fluid-150);
1271
- --sky-comp-page-links-list-space-inset-left: var(--bb-size-fluid-150);
1272
- --sky-comp-page-links-list-space-inset-right: var(--bb-size-fluid-150);
1273
- --sky-comp-page-links-list-space-inset-top: var(--bb-size-fluid-150);
1274
- --sky-comp-page-links-tabs-space-inset-bottom: var(--bb-size-fluid-150);
1275
- --sky-comp-page-links-tabs-space-inset-left: var(--bb-size-fluid-150);
1276
- --sky-comp-page-links-tabs-space-inset-right: var(--bb-size-fluid-150);
1277
- --sky-comp-page-links-tabs-space-inset-top: var(--bb-size-fluid-150);
1278
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--bb-size-0);
1279
- --sky-comp-page-tabset-tabs-space-inset-left: var(--bb-size-fluid-150);
1280
- --sky-comp-page-tabset-tabs-space-inset-right: var(--bb-size-0);
1281
- --sky-comp-page-tabset-tabs-space-inset-top: var(--bb-size-0);
1282
- --sky-comp-search-space-inset-bottom: var(--bb-size-fluid-50);
1283
- --sky-comp-search-space-inset-left: var(--bb-size-fluid-50);
1284
- --sky-comp-search-space-inset-right: var(--bb-size-fluid-50);
1285
- --sky-comp-search-space-inset-top: var(--bb-size-fluid-50);
1286
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--bb-size-fluid-50);
1287
- --sky-comp-tab-vertical-content-space-inset-left: var(--bb-size-fluid-75);
1288
- --sky-comp-tab-vertical-content-space-inset-right: var(--bb-size-fluid-75);
1289
- --sky-comp-tab-vertical-content-space-inset-top: var(--bb-size-fluid-50);
1290
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--bb-size-0);
1291
- --sky-comp-tile-dashboard-column-space-inset-left: var(--bb-size-fluid-75);
1292
- --sky-comp-tile-dashboard-column-space-inset-right: var(--bb-size-fluid-75);
1293
- --sky-comp-tile-dashboard-column-space-inset-top: var(--bb-size-0);
1294
- --sky-comp-tile-dashboard-space-inset-bottom: var(--bb-size-0);
1295
- --sky-comp-tile-dashboard-space-inset-left: var(--bb-size-fluid-50);
1296
- --sky-comp-tile-dashboard-space-inset-right: var(--bb-size-fluid-50);
1297
- --sky-comp-tile-dashboard-space-inset-top: var(--bb-size-0);
1298
- }
1299
- }
1300
- .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 {
1301
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--bb-size-fixed-75);
1302
- --sky-comp-modal-fullscreen-space-offset-left: var(--bb-size-fixed-75);
1303
- --sky-comp-modal-fullscreen-space-offset-right: var(--bb-size-fixed-75);
1304
- --sky-comp-modal-fullscreen-space-offset-top: var(--bb-size-fixed-75);
1305
- --sky-comp-modal-space-offset-bottom: var(--bb-size-fixed-100);
1306
- --sky-comp-modal-space-offset-left: var(--bb-size-fixed-100);
1307
- --sky-comp-modal-space-offset-right: var(--bb-size-fixed-100);
1308
- --sky-comp-modal-space-offset-top: var(--bb-size-fixed-100);
1309
- --sky-comp-page-content-blocks-space-inset-bottom: var(--bb-size-fluid-150);
1310
- --sky-comp-page-content-blocks-space-inset-left: var(--bb-size-fluid-150);
1311
- --sky-comp-page-content-blocks-space-inset-right: var(--bb-size-fluid-150);
1312
- --sky-comp-page-content-blocks-space-inset-top: var(--bb-size-fluid-150);
1313
- --sky-comp-page-content-fit-space-inset-bottom: var(--bb-size-0);
1314
- --sky-comp-page-content-fit-space-inset-left: var(--bb-size-fluid-150);
1315
- --sky-comp-page-content-fit-space-inset-right: var(--bb-size-fluid-150);
1316
- --sky-comp-page-content-fit-space-inset-top: var(--bb-size-0);
1317
- --sky-comp-page-content-list-space-inset-bottom: var(--bb-size-0);
1318
- --sky-comp-page-content-list-space-inset-left: var(--bb-size-fluid-150);
1319
- --sky-comp-page-content-list-space-inset-right: var(--bb-size-fluid-150);
1320
- --sky-comp-page-content-list-space-inset-top: var(--bb-size-0);
1321
- --sky-comp-page-content-tabs-space-inset-bottom: var(--bb-size-0);
1322
- --sky-comp-page-content-tabs-space-inset-left: var(--bb-size-0);
1323
- --sky-comp-page-content-tabs-space-inset-right: var(--bb-size-0);
1324
- --sky-comp-page-content-tabs-space-inset-top: var(--bb-size-0);
1325
- --sky-comp-page-header-blocks-space-inset-bottom: var(--bb-size-0);
1326
- --sky-comp-page-header-blocks-space-inset-left: var(--bb-size-fluid-150);
1327
- --sky-comp-page-header-blocks-space-inset-right: var(--bb-size-fluid-150);
1328
- --sky-comp-page-header-blocks-space-inset-top: var(--bb-size-fluid-150);
1329
- --sky-comp-page-header-fit-space-inset-bottom: var(--bb-size-fluid-100);
1330
- --sky-comp-page-header-fit-space-inset-left: var(--bb-size-fluid-150);
1331
- --sky-comp-page-header-fit-space-inset-right: var(--bb-size-fluid-150);
1332
- --sky-comp-page-header-fit-space-inset-top: var(--bb-size-fluid-150);
1333
- --sky-comp-page-header-list-space-inset-bottom: var(--bb-size-fluid-100);
1334
- --sky-comp-page-header-list-space-inset-left: var(--bb-size-fluid-150);
1335
- --sky-comp-page-header-list-space-inset-right: var(--bb-size-fluid-150);
1336
- --sky-comp-page-header-list-space-inset-top: var(--bb-size-fluid-150);
1337
- --sky-comp-page-header-tabs-space-inset-bottom: var(--bb-size-fluid-100);
1338
- --sky-comp-page-header-tabs-space-inset-left: var(--bb-size-fluid-150);
1339
- --sky-comp-page-header-tabs-space-inset-right: var(--bb-size-fluid-150);
1340
- --sky-comp-page-header-tabs-space-inset-top: var(--bb-size-fluid-150);
1341
- --sky-comp-page-links-blocks-space-inset-bottom: var(--bb-size-fluid-150);
1342
- --sky-comp-page-links-blocks-space-inset-left: var(--bb-size-fluid-150);
1343
- --sky-comp-page-links-blocks-space-inset-right: var(--bb-size-fluid-150);
1344
- --sky-comp-page-links-blocks-space-inset-top: var(--bb-size-fluid-150);
1345
- --sky-comp-page-links-list-space-inset-bottom: var(--bb-size-fluid-150);
1346
- --sky-comp-page-links-list-space-inset-left: var(--bb-size-fluid-150);
1347
- --sky-comp-page-links-list-space-inset-right: var(--bb-size-fluid-150);
1348
- --sky-comp-page-links-list-space-inset-top: var(--bb-size-fluid-150);
1349
- --sky-comp-page-links-tabs-space-inset-bottom: var(--bb-size-fluid-150);
1350
- --sky-comp-page-links-tabs-space-inset-left: var(--bb-size-fluid-150);
1351
- --sky-comp-page-links-tabs-space-inset-right: var(--bb-size-fluid-150);
1352
- --sky-comp-page-links-tabs-space-inset-top: var(--bb-size-fluid-150);
1353
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--bb-size-0);
1354
- --sky-comp-page-tabset-tabs-space-inset-left: var(--bb-size-fluid-150);
1355
- --sky-comp-page-tabset-tabs-space-inset-right: var(--bb-size-0);
1356
- --sky-comp-page-tabset-tabs-space-inset-top: var(--bb-size-0);
1357
- --sky-comp-search-space-inset-bottom: var(--bb-size-fluid-50);
1358
- --sky-comp-search-space-inset-left: var(--bb-size-fluid-50);
1359
- --sky-comp-search-space-inset-right: var(--bb-size-fluid-50);
1360
- --sky-comp-search-space-inset-top: var(--bb-size-fluid-50);
1361
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--bb-size-fluid-50);
1362
- --sky-comp-tab-vertical-content-space-inset-left: var(--bb-size-fluid-75);
1363
- --sky-comp-tab-vertical-content-space-inset-right: var(--bb-size-fluid-75);
1364
- --sky-comp-tab-vertical-content-space-inset-top: var(--bb-size-fluid-50);
1365
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--bb-size-0);
1366
- --sky-comp-tile-dashboard-column-space-inset-left: var(--bb-size-fluid-75);
1367
- --sky-comp-tile-dashboard-column-space-inset-right: var(--bb-size-fluid-75);
1368
- --sky-comp-tile-dashboard-column-space-inset-top: var(--bb-size-0);
1369
- --sky-comp-tile-dashboard-space-inset-bottom: var(--bb-size-0);
1370
- --sky-comp-tile-dashboard-space-inset-left: var(--bb-size-fluid-50);
1371
- --sky-comp-tile-dashboard-space-inset-right: var(--bb-size-fluid-50);
1372
- --sky-comp-tile-dashboard-space-inset-top: var(--bb-size-0);
1271
+ @property --modern-image-logo-primary-src {
1272
+ syntax: "<url>";
1273
+ inherits: true;
1274
+ initial-value: url("data:,");
1373
1275
  }
1374
-
1375
1276
  .sky-theme-modern {
1376
1277
  --modern-border-radius-0: 0rem;
1377
1278
  --modern-border-radius-md: 6px;
@@ -1441,6 +1342,7 @@
1441
1342
  --modern-font-weight-light: 300;
1442
1343
  --modern-font-weight-regular: 400;
1443
1344
  --modern-font-weight-semibold: 600;
1345
+ --modern-image-logo-primary-src: url("https://sky.blackbaudcdn.net/static/skyux-design-tokens/2.0.0-alpha.0/assets/images/bb-logo.png");
1444
1346
  --modern-letter_spacing-normal: normal;
1445
1347
  --modern-line_height-110: 1.1;
1446
1348
  --modern-line_height-115: 1.15;
@@ -1448,7 +1350,7 @@
1448
1350
  --modern-line_height-20: 20px;
1449
1351
  --modern-line_height-normal: normal;
1450
1352
  --modern-opacity-600: .6;
1451
- --modern-shadow-size-0: 0 0 0 0 #000000;
1353
+ --modern-shadow-size-0: 0 0 0 0 rgba(0, 0, 0, 0);
1452
1354
  --modern-shadow-thumb: 0 1px 2px 0 rgba(0,0,0,0.5);
1453
1355
  --modern-size-0: 0rem;
1454
1356
  --modern-size-1: 1px;
@@ -1529,6 +1431,11 @@
1529
1431
  --sky-color-background-action-tertiary-disabled: var(--modern-color-gray-07);
1530
1432
  --sky-color-background-action-tertiary-focus: var(--modern-color-transparent);
1531
1433
  --sky-color-background-action-tertiary-hover: var(--modern-color-transparent);
1434
+ --sky-color-background-action-toolbar-active: var(--modern-color-transparent);
1435
+ --sky-color-background-action-toolbar-base: var(--modern-color-transparent);
1436
+ --sky-color-background-action-toolbar-disabled: var(--modern-color-gray-07);
1437
+ --sky-color-background-action-toolbar-focus: var(--modern-color-transparent);
1438
+ --sky-color-background-action-toolbar-hover: var(--modern-color-transparent);
1532
1439
  --sky-color-background-blocking: var(--modern-color-blocking);
1533
1440
  --sky-color-background-container-base: var(--modern-color-white);
1534
1441
  --sky-color-background-container-danger: var(--modern-color-red-30);
@@ -1590,6 +1497,11 @@
1590
1497
  --sky-color-border-action-tertiary-disabled: var(--modern-color-gray-15);
1591
1498
  --sky-color-border-action-tertiary-focus: var(--modern-color-blue-74);
1592
1499
  --sky-color-border-action-tertiary-hover: var(--modern-color-blue-74);
1500
+ --sky-color-border-action-toolbar-active: var(--modern-color-blue-74);
1501
+ --sky-color-border-action-toolbar-base: var(--modern-color-transparent);
1502
+ --sky-color-border-action-toolbar-disabled: var(--modern-color-gray-15);
1503
+ --sky-color-border-action-toolbar-focus: var(--modern-color-blue-74);
1504
+ --sky-color-border-action-toolbar-hover: var(--modern-color-blue-74);
1593
1505
  --sky-color-border-column_divider: var(--modern-color-gray-70);
1594
1506
  --sky-color-border-container-base: var(--modern-color-gray-15);
1595
1507
  --sky-color-border-danger: var(--modern-color-red-50);
@@ -1633,17 +1545,18 @@
1633
1545
  --sky-color-icon-deemphasized: var(--modern-color-gray-70);
1634
1546
  --sky-color-icon-default: var(--modern-color-gray-105);
1635
1547
  --sky-color-icon-info: var(--modern-color-blue-50);
1548
+ --sky-color-icon-input-action: var(--modern-color-gray-70);
1636
1549
  --sky-color-icon-inverse: var(--modern-color-white);
1637
1550
  --sky-color-icon-selected: var(--modern-color-blue-74);
1638
1551
  --sky-color-icon-success: var(--modern-color-green-50);
1639
1552
  --sky-color-icon-warning: var(--modern-color-yellow-50);
1640
1553
  --sky-color-text-action: var(--modern-color-blue-74);
1554
+ --sky-color-text-action_contrast: var(--modern-color-blue-80);
1641
1555
  --sky-color-text-danger: var(--modern-color-red-70);
1642
1556
  --sky-color-text-deemphasized: var(--modern-color-gray-70);
1643
1557
  --sky-color-text-default: var(--modern-color-gray-105);
1644
1558
  --sky-color-text-heading: var(--modern-color-gray-105);
1645
1559
  --sky-color-text-inverse: var(--modern-color-white);
1646
- --sky-color-text-link_highlight: var(--modern-color-blue-80);
1647
1560
  --sky-color-text-selected: var(--modern-color-blue-74);
1648
1561
  --sky-elevation-action-danger-active: var(--modern-shadow-size-0);
1649
1562
  --sky-elevation-action-danger-base: var(--modern-shadow-size-0);
@@ -1665,15 +1578,21 @@
1665
1578
  --sky-elevation-action-tertiary-base: var(--modern-shadow-size-0);
1666
1579
  --sky-elevation-action-tertiary-disabled: var(--modern-shadow-size-0);
1667
1580
  --sky-elevation-action-tertiary-hover: var(--modern-shadow-size-0);
1581
+ --sky-elevation-action-toolbar-active: var(--modern-shadow-size-0);
1582
+ --sky-elevation-action-toolbar-base: var(--modern-shadow-size-0);
1583
+ --sky-elevation-action-toolbar-disabled: var(--modern-shadow-size-0);
1584
+ --sky-elevation-action-toolbar-hover: var(--modern-shadow-size-0);
1668
1585
  --sky-elevation-input-base: var(--modern-shadow-size-0);
1669
1586
  --sky-elevation-input-disabled: var(--modern-shadow-size-0);
1670
1587
  --sky-elevation-none: var(--modern-shadow-size-0);
1588
+ --sky-image-logo-primary-src: var(--modern-image-logo-primary-src);
1671
1589
  --sky-opacity-wait: var(--modern-opacity-600);
1672
1590
  --sky-elevation-action-danger-focus: var(--modern-shadow-size-3);
1673
1591
  --sky-elevation-action-input-focus: var(--modern-shadow-size-3);
1674
1592
  --sky-elevation-action-primary-focus: var(--modern-shadow-size-3);
1675
1593
  --sky-elevation-action-secondary-focus: var(--modern-shadow-size-3);
1676
1594
  --sky-elevation-action-tertiary-focus: var(--modern-shadow-size-3);
1595
+ --sky-elevation-action-toolbar-focus: var(--modern-shadow-size-3);
1677
1596
  --sky-elevation-focus: var(--modern-shadow-size-3);
1678
1597
  --sky-elevation-overflow: var(--modern-shadow-size-3);
1679
1598
  --sky-elevation-overlay-100: var(--modern-shadow-size-4);
@@ -1683,7 +1602,7 @@
1683
1602
  --sky-elevation-raised-100: var(--modern-shadow-size-1);
1684
1603
  }
1685
1604
 
1686
- .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 {
1605
+ .sky-theme-modern {
1687
1606
  --sky-font-style-deemphasized-style: italic;
1688
1607
  --sky-font-style-deemphasized-weight: 400;
1689
1608
  --sky-font-style-hint-m-style: italic;
@@ -1783,6 +1702,30 @@
1783
1702
  --sky-comp-button-toolbar-space-inset-left: var(--modern-size-10);
1784
1703
  --sky-comp-button-toolbar-space-inset-right: var(--modern-size-10);
1785
1704
  --sky-comp-button-toolbar-space-inset-top: var(--modern-size-10);
1705
+ --sky-comp-card-large-actions-space-inset-bottom: var(--modern-size-10);
1706
+ --sky-comp-card-large-actions-space-inset-left: var(--modern-size-30);
1707
+ --sky-comp-card-large-actions-space-inset-right: var(--modern-size-30);
1708
+ --sky-comp-card-large-actions-space-inset-top: var(--modern-size-10);
1709
+ --sky-comp-card-large-content-space-inset-bottom: var(--modern-size-30);
1710
+ --sky-comp-card-large-content-space-inset-left: var(--modern-size-30);
1711
+ --sky-comp-card-large-content-space-inset-right: var(--modern-size-30);
1712
+ --sky-comp-card-large-content-space-inset-top: var(--modern-size-30);
1713
+ --sky-comp-card-large-header-space-inset-bottom: var(--modern-size-0);
1714
+ --sky-comp-card-large-header-space-inset-left: var(--modern-size-30);
1715
+ --sky-comp-card-large-header-space-inset-right: var(--modern-size-30);
1716
+ --sky-comp-card-large-header-space-inset-top: var(--modern-size-30);
1717
+ --sky-comp-card-small-actions-space-inset-bottom: var(--modern-size-10);
1718
+ --sky-comp-card-small-actions-space-inset-left: var(--modern-size-15);
1719
+ --sky-comp-card-small-actions-space-inset-right: var(--modern-size-15);
1720
+ --sky-comp-card-small-actions-space-inset-top: var(--modern-size-10);
1721
+ --sky-comp-card-small-content-space-inset-bottom: var(--modern-size-15);
1722
+ --sky-comp-card-small-content-space-inset-left: var(--modern-size-15);
1723
+ --sky-comp-card-small-content-space-inset-right: var(--modern-size-15);
1724
+ --sky-comp-card-small-content-space-inset-top: var(--modern-size-15);
1725
+ --sky-comp-card-small-header-space-inset-bottom: var(--modern-size-0);
1726
+ --sky-comp-card-small-header-space-inset-left: var(--modern-size-15);
1727
+ --sky-comp-card-small-header-space-inset-right: var(--modern-size-15);
1728
+ --sky-comp-card-small-header-space-inset-top: var(--modern-size-15);
1786
1729
  --sky-comp-colorpicker-content-space-inset-bottom: var(--modern-size-15);
1787
1730
  --sky-comp-colorpicker-content-space-inset-left: var(--modern-size-30);
1788
1731
  --sky-comp-colorpicker-content-space-inset-right: var(--modern-size-30);
@@ -1847,70 +1790,126 @@
1847
1790
  --sky-comp-modal-footer-space-inset-left: var(--modern-size-30);
1848
1791
  --sky-comp-modal-footer-space-inset-right: var(--modern-size-30);
1849
1792
  --sky-comp-modal-footer-space-inset-top: var(--modern-size-20);
1850
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-10);
1851
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-10);
1852
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-10);
1853
- --sky-comp-modal-fullscreen-space-offset-top: var(--modern-size-10);
1793
+ --sky-comp-modal-fullscreen-space-offset-sm-bottom: var(--modern-size-15);
1794
+ --sky-comp-modal-fullscreen-space-offset-sm-left: var(--modern-size-15);
1795
+ --sky-comp-modal-fullscreen-space-offset-sm-right: var(--modern-size-15);
1796
+ --sky-comp-modal-fullscreen-space-offset-sm-top: var(--modern-size-15);
1797
+ --sky-comp-modal-fullscreen-space-offset-xs-bottom: var(--modern-size-10);
1798
+ --sky-comp-modal-fullscreen-space-offset-xs-left: var(--modern-size-10);
1799
+ --sky-comp-modal-fullscreen-space-offset-xs-right: var(--modern-size-10);
1800
+ --sky-comp-modal-fullscreen-space-offset-xs-top: var(--modern-size-10);
1854
1801
  --sky-comp-modal-header-space-inset-bottom: var(--modern-size-15);
1855
1802
  --sky-comp-modal-header-space-inset-left: var(--modern-size-30);
1856
1803
  --sky-comp-modal-header-space-inset-right: var(--modern-size-30);
1857
1804
  --sky-comp-modal-header-space-inset-top: var(--modern-size-15);
1858
- --sky-comp-modal-space-offset-bottom: var(--modern-size-10);
1859
- --sky-comp-modal-space-offset-left: var(--modern-size-10);
1860
- --sky-comp-modal-space-offset-right: var(--modern-size-10);
1861
- --sky-comp-modal-space-offset-top: var(--modern-size-10);
1805
+ --sky-comp-modal-space-offset-sm-bottom: var(--modern-size-20);
1806
+ --sky-comp-modal-space-offset-sm-left: var(--modern-size-20);
1807
+ --sky-comp-modal-space-offset-sm-right: var(--modern-size-20);
1808
+ --sky-comp-modal-space-offset-sm-top: var(--modern-size-20);
1809
+ --sky-comp-modal-space-offset-xs-bottom: var(--modern-size-10);
1810
+ --sky-comp-modal-space-offset-xs-left: var(--modern-size-10);
1811
+ --sky-comp-modal-space-offset-xs-right: var(--modern-size-10);
1812
+ --sky-comp-modal-space-offset-xs-top: var(--modern-size-10);
1862
1813
  --sky-comp-navbar_item-space-inset-bottom: var(--modern-space-md);
1863
1814
  --sky-comp-navbar_item-space-inset-left: var(--modern-space-s);
1864
1815
  --sky-comp-navbar_item-space-inset-right: var(--modern-space-s);
1865
1816
  --sky-comp-navbar_item-space-inset-top: var(--modern-space-md);
1866
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-s);
1867
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-s);
1868
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-s);
1869
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-s);
1870
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
1871
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-s);
1872
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-s);
1873
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
1874
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
1875
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-s);
1876
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-s);
1877
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
1878
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
1879
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
1880
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
1881
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
1882
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-space-lg);
1883
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-s);
1884
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-s);
1885
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-lg);
1886
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
1887
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-s);
1888
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-s);
1889
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-lg);
1890
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
1891
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-s);
1892
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-s);
1893
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-lg);
1894
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
1895
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-s);
1896
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-s);
1897
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-lg);
1898
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
1899
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-s);
1900
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-s);
1901
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
1902
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
1903
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-s);
1904
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-s);
1905
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
1906
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
1907
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-s);
1908
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-s);
1909
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
1910
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
1911
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-md);
1912
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
1913
- --sky-comp-page-tabset-tabs-space-inset-top: var(--modern-size-0);
1817
+ --sky-comp-page-content-blocks-space-inset-sm-bottom: var(--modern-space-xl);
1818
+ --sky-comp-page-content-blocks-space-inset-sm-left: var(--modern-space-xl);
1819
+ --sky-comp-page-content-blocks-space-inset-sm-right: var(--modern-space-xl);
1820
+ --sky-comp-page-content-blocks-space-inset-sm-top: var(--modern-space-xl);
1821
+ --sky-comp-page-content-blocks-space-inset-xs-bottom: var(--modern-space-s);
1822
+ --sky-comp-page-content-blocks-space-inset-xs-left: var(--modern-space-s);
1823
+ --sky-comp-page-content-blocks-space-inset-xs-right: var(--modern-space-s);
1824
+ --sky-comp-page-content-blocks-space-inset-xs-top: var(--modern-space-s);
1825
+ --sky-comp-page-content-fit-space-inset-sm-bottom: var(--modern-size-0);
1826
+ --sky-comp-page-content-fit-space-inset-sm-left: var(--modern-space-xl);
1827
+ --sky-comp-page-content-fit-space-inset-sm-right: var(--modern-space-xl);
1828
+ --sky-comp-page-content-fit-space-inset-sm-top: var(--modern-size-0);
1829
+ --sky-comp-page-content-fit-space-inset-xs-bottom: var(--modern-size-0);
1830
+ --sky-comp-page-content-fit-space-inset-xs-left: var(--modern-space-s);
1831
+ --sky-comp-page-content-fit-space-inset-xs-right: var(--modern-space-s);
1832
+ --sky-comp-page-content-fit-space-inset-xs-top: var(--modern-size-0);
1833
+ --sky-comp-page-content-list-space-inset-sm-bottom: var(--modern-size-0);
1834
+ --sky-comp-page-content-list-space-inset-sm-left: var(--modern-space-xl);
1835
+ --sky-comp-page-content-list-space-inset-sm-right: var(--modern-space-xl);
1836
+ --sky-comp-page-content-list-space-inset-sm-top: var(--modern-size-0);
1837
+ --sky-comp-page-content-list-space-inset-xs-bottom: var(--modern-size-0);
1838
+ --sky-comp-page-content-list-space-inset-xs-left: var(--modern-space-s);
1839
+ --sky-comp-page-content-list-space-inset-xs-right: var(--modern-space-s);
1840
+ --sky-comp-page-content-list-space-inset-xs-top: var(--modern-size-0);
1841
+ --sky-comp-page-content-tabs-space-inset-sm-bottom: var(--modern-size-0);
1842
+ --sky-comp-page-content-tabs-space-inset-sm-left: var(--modern-size-0);
1843
+ --sky-comp-page-content-tabs-space-inset-sm-right: var(--modern-size-0);
1844
+ --sky-comp-page-content-tabs-space-inset-sm-top: var(--modern-size-0);
1845
+ --sky-comp-page-content-tabs-space-inset-xs-bottom: var(--modern-size-0);
1846
+ --sky-comp-page-content-tabs-space-inset-xs-left: var(--modern-size-0);
1847
+ --sky-comp-page-content-tabs-space-inset-xs-right: var(--modern-size-0);
1848
+ --sky-comp-page-content-tabs-space-inset-xs-top: var(--modern-size-0);
1849
+ --sky-comp-page-header-blocks-space-inset-sm-bottom: var(--modern-size-0);
1850
+ --sky-comp-page-header-blocks-space-inset-sm-left: var(--modern-space-xl);
1851
+ --sky-comp-page-header-blocks-space-inset-sm-right: var(--modern-space-xl);
1852
+ --sky-comp-page-header-blocks-space-inset-sm-top: var(--modern-space-xl);
1853
+ --sky-comp-page-header-blocks-space-inset-xs-bottom: var(--modern-space-lg);
1854
+ --sky-comp-page-header-blocks-space-inset-xs-left: var(--modern-space-s);
1855
+ --sky-comp-page-header-blocks-space-inset-xs-right: var(--modern-space-s);
1856
+ --sky-comp-page-header-blocks-space-inset-xs-top: var(--modern-space-lg);
1857
+ --sky-comp-page-header-fit-space-inset-sm-bottom: var(--modern-space-lg);
1858
+ --sky-comp-page-header-fit-space-inset-sm-left: var(--modern-space-xl);
1859
+ --sky-comp-page-header-fit-space-inset-sm-right: var(--modern-space-xl);
1860
+ --sky-comp-page-header-fit-space-inset-sm-top: var(--modern-space-xl);
1861
+ --sky-comp-page-header-fit-space-inset-xs-bottom: var(--modern-space-lg);
1862
+ --sky-comp-page-header-fit-space-inset-xs-left: var(--modern-space-s);
1863
+ --sky-comp-page-header-fit-space-inset-xs-right: var(--modern-space-s);
1864
+ --sky-comp-page-header-fit-space-inset-xs-top: var(--modern-space-lg);
1865
+ --sky-comp-page-header-list-space-inset-sm-bottom: var(--modern-space-lg);
1866
+ --sky-comp-page-header-list-space-inset-sm-left: var(--modern-space-xl);
1867
+ --sky-comp-page-header-list-space-inset-sm-right: var(--modern-space-xl);
1868
+ --sky-comp-page-header-list-space-inset-sm-top: var(--modern-space-xl);
1869
+ --sky-comp-page-header-list-space-inset-xs-bottom: var(--modern-space-lg);
1870
+ --sky-comp-page-header-list-space-inset-xs-left: var(--modern-space-s);
1871
+ --sky-comp-page-header-list-space-inset-xs-right: var(--modern-space-s);
1872
+ --sky-comp-page-header-list-space-inset-xs-top: var(--modern-space-lg);
1873
+ --sky-comp-page-header-tabs-space-inset-sm-bottom: var(--modern-space-lg);
1874
+ --sky-comp-page-header-tabs-space-inset-sm-left: var(--modern-space-xl);
1875
+ --sky-comp-page-header-tabs-space-inset-sm-right: var(--modern-space-xl);
1876
+ --sky-comp-page-header-tabs-space-inset-sm-top: var(--modern-space-xl);
1877
+ --sky-comp-page-header-tabs-space-inset-xs-bottom: var(--modern-space-lg);
1878
+ --sky-comp-page-header-tabs-space-inset-xs-left: var(--modern-space-s);
1879
+ --sky-comp-page-header-tabs-space-inset-xs-right: var(--modern-space-s);
1880
+ --sky-comp-page-header-tabs-space-inset-xs-top: var(--modern-space-lg);
1881
+ --sky-comp-page-links-blocks-space-inset-sm-bottom: var(--modern-space-xl);
1882
+ --sky-comp-page-links-blocks-space-inset-sm-left: var(--modern-space-xl);
1883
+ --sky-comp-page-links-blocks-space-inset-sm-right: var(--modern-space-xl);
1884
+ --sky-comp-page-links-blocks-space-inset-sm-top: var(--modern-space-xl);
1885
+ --sky-comp-page-links-blocks-space-inset-xs-bottom: var(--modern-space-xl);
1886
+ --sky-comp-page-links-blocks-space-inset-xs-left: var(--modern-space-s);
1887
+ --sky-comp-page-links-blocks-space-inset-xs-right: var(--modern-space-s);
1888
+ --sky-comp-page-links-blocks-space-inset-xs-top: var(--modern-space-xl);
1889
+ --sky-comp-page-links-list-space-inset-sm-bottom: var(--modern-space-xl);
1890
+ --sky-comp-page-links-list-space-inset-sm-left: var(--modern-space-xl);
1891
+ --sky-comp-page-links-list-space-inset-sm-right: var(--modern-space-xl);
1892
+ --sky-comp-page-links-list-space-inset-sm-top: var(--modern-space-xl);
1893
+ --sky-comp-page-links-list-space-inset-xs-bottom: var(--modern-space-xl);
1894
+ --sky-comp-page-links-list-space-inset-xs-left: var(--modern-space-s);
1895
+ --sky-comp-page-links-list-space-inset-xs-right: var(--modern-space-s);
1896
+ --sky-comp-page-links-list-space-inset-xs-top: var(--modern-space-xl);
1897
+ --sky-comp-page-links-tabs-space-inset-sm-bottom: var(--modern-space-xl);
1898
+ --sky-comp-page-links-tabs-space-inset-sm-left: var(--modern-space-xl);
1899
+ --sky-comp-page-links-tabs-space-inset-sm-right: var(--modern-space-xl);
1900
+ --sky-comp-page-links-tabs-space-inset-sm-top: var(--modern-space-xl);
1901
+ --sky-comp-page-links-tabs-space-inset-xs-bottom: var(--modern-space-xl);
1902
+ --sky-comp-page-links-tabs-space-inset-xs-left: var(--modern-space-s);
1903
+ --sky-comp-page-links-tabs-space-inset-xs-right: var(--modern-space-s);
1904
+ --sky-comp-page-links-tabs-space-inset-xs-top: var(--modern-space-xl);
1905
+ --sky-comp-page-tabset-tabs-space-inset-sm-bottom: var(--modern-size-0);
1906
+ --sky-comp-page-tabset-tabs-space-inset-sm-left: var(--modern-space-xl);
1907
+ --sky-comp-page-tabset-tabs-space-inset-sm-right: var(--modern-size-0);
1908
+ --sky-comp-page-tabset-tabs-space-inset-sm-top: var(--modern-size-0);
1909
+ --sky-comp-page-tabset-tabs-space-inset-xs-bottom: var(--modern-size-0);
1910
+ --sky-comp-page-tabset-tabs-space-inset-xs-left: var(--modern-space-md);
1911
+ --sky-comp-page-tabset-tabs-space-inset-xs-right: var(--modern-size-0);
1912
+ --sky-comp-page-tabset-tabs-space-inset-xs-top: var(--modern-size-0);
1914
1913
  --sky-comp-paging_button-space-inset-bottom: var(--modern-size-4);
1915
1914
  --sky-comp-paging_button-space-inset-left: var(--modern-size-15);
1916
1915
  --sky-comp-paging_button-space-inset-right: var(--modern-size-15);
@@ -1923,6 +1922,10 @@
1923
1922
  --sky-comp-popover-header-space-inset-left: var(--modern-space-lg);
1924
1923
  --sky-comp-popover-header-space-inset-right: var(--modern-space-lg);
1925
1924
  --sky-comp-popover-header-space-inset-top: var(--modern-space-lg);
1925
+ --sky-comp-repeater_item-checkbox-space-offset-bottom: var(--modern-size-0);
1926
+ --sky-comp-repeater_item-checkbox-space-offset-left: var(--modern-size-0);
1927
+ --sky-comp-repeater_item-checkbox-space-offset-right: var(--modern-size-0);
1928
+ --sky-comp-repeater_item-checkbox-space-offset-top: var(--modern-size-0);
1926
1929
  --sky-comp-repeater_item-space-inset-bottom: var(--modern-space-md);
1927
1930
  --sky-comp-repeater_item-space-inset-left: var(--modern-space-s);
1928
1931
  --sky-comp-repeater_item-space-inset-right: var(--modern-space-s);
@@ -1963,10 +1966,14 @@
1963
1966
  --sky-comp-tab-horizontal-space-inset-left: var(--modern-size-15);
1964
1967
  --sky-comp-tab-horizontal-space-inset-right: var(--modern-size-15);
1965
1968
  --sky-comp-tab-horizontal-space-inset-top: var(--modern-size-10);
1966
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-15);
1967
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
1968
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
1969
- --sky-comp-tab-vertical-content-space-inset-top: var(--modern-size-15);
1969
+ --sky-comp-tab-vertical-content-space-inset-sm-bottom: var(--modern-size-10);
1970
+ --sky-comp-tab-vertical-content-space-inset-sm-left: var(--modern-size-15);
1971
+ --sky-comp-tab-vertical-content-space-inset-sm-right: var(--modern-size-15);
1972
+ --sky-comp-tab-vertical-content-space-inset-sm-top: var(--modern-size-10);
1973
+ --sky-comp-tab-vertical-content-space-inset-xs-bottom: var(--modern-size-15);
1974
+ --sky-comp-tab-vertical-content-space-inset-xs-left: var(--modern-size-15);
1975
+ --sky-comp-tab-vertical-content-space-inset-xs-right: var(--modern-size-15);
1976
+ --sky-comp-tab-vertical-content-space-inset-xs-top: var(--modern-size-15);
1970
1977
  --sky-comp-tab-vertical-group-button-space-inset-bottom: var(--modern-space-s);
1971
1978
  --sky-comp-tab-vertical-group-button-space-inset-left: var(--modern-space-s);
1972
1979
  --sky-comp-tab-vertical-group-button-space-inset-right: var(--modern-space-s);
@@ -1991,14 +1998,22 @@
1991
1998
  --sky-comp-text_editor-space-inset-left: var(--modern-space-md);
1992
1999
  --sky-comp-text_editor-space-inset-right: var(--modern-space-md);
1993
2000
  --sky-comp-text_editor-space-inset-top: var(--modern-space-md);
1994
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
1995
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-size-0);
1996
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-size-0);
1997
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
1998
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
1999
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-size-0);
2000
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-size-0);
2001
- --sky-comp-tile-dashboard-space-inset-top: var(--modern-size-0);
2001
+ --sky-comp-tile-dashboard-column-space-inset-sm-bottom: var(--modern-size-0);
2002
+ --sky-comp-tile-dashboard-column-space-inset-sm-left: var(--modern-space-md);
2003
+ --sky-comp-tile-dashboard-column-space-inset-sm-right: var(--modern-space-md);
2004
+ --sky-comp-tile-dashboard-column-space-inset-sm-top: var(--modern-size-0);
2005
+ --sky-comp-tile-dashboard-column-space-inset-xs-bottom: var(--modern-size-0);
2006
+ --sky-comp-tile-dashboard-column-space-inset-xs-left: var(--modern-size-0);
2007
+ --sky-comp-tile-dashboard-column-space-inset-xs-right: var(--modern-size-0);
2008
+ --sky-comp-tile-dashboard-column-space-inset-xs-top: var(--modern-size-0);
2009
+ --sky-comp-tile-dashboard-space-inset-sm-bottom: var(--modern-size-0);
2010
+ --sky-comp-tile-dashboard-space-inset-sm-left: var(--modern-space-s);
2011
+ --sky-comp-tile-dashboard-space-inset-sm-right: var(--modern-space-s);
2012
+ --sky-comp-tile-dashboard-space-inset-sm-top: var(--modern-size-0);
2013
+ --sky-comp-tile-dashboard-space-inset-xs-bottom: var(--modern-size-0);
2014
+ --sky-comp-tile-dashboard-space-inset-xs-left: var(--modern-size-0);
2015
+ --sky-comp-tile-dashboard-space-inset-xs-right: var(--modern-size-0);
2016
+ --sky-comp-tile-dashboard-space-inset-xs-top: var(--modern-size-0);
2002
2017
  --sky-comp-tile-section-space-inset-bottom: var(--modern-space-md);
2003
2018
  --sky-comp-tile-section-space-inset-left: var(--modern-size-0);
2004
2019
  --sky-comp-tile-section-space-inset-right: var(--modern-size-0);
@@ -2165,6 +2180,7 @@
2165
2180
  --sky-space-gap-stacked_supplemental-m: var(--modern-size-10);
2166
2181
  --sky-space-gap-stacked_supplemental-s: var(--modern-size-5);
2167
2182
  --sky-space-gap-stacked_supplemental-xl: var(--modern-size-20);
2183
+ --sky-space-gap-stacked_supplemental-xs: var(--modern-size-5);
2168
2184
  --sky-space-gap-text_action-l: var(--modern-space-lg);
2169
2185
  --sky-space-gap-text_action-m: var(--modern-space-md);
2170
2186
  --sky-space-gap-text_action-s: var(--modern-space-s);
@@ -2177,37 +2193,12 @@
2177
2193
  --sky-space-inline-xs: var(--modern-space-xs);
2178
2194
  --sky-space-inline-xxl: var(--modern-space-xxl);
2179
2195
  --sky-space-inline-xxs: var(--modern-size-2);
2180
- --sky-space-inset-balanced-fixed-l: var(--modern-size-20);
2181
- --sky-space-inset-balanced-fixed-m: var(--modern-size-15);
2182
- --sky-space-inset-balanced-fixed-s: var(--modern-size-10);
2183
- --sky-space-inset-balanced-fixed-xl: var(--modern-size-30);
2184
2196
  --sky-space-inset-balanced-l: var(--modern-space-lg);
2185
2197
  --sky-space-inset-balanced-m: var(--modern-space-md);
2186
2198
  --sky-space-inset-balanced-s: var(--modern-space-s);
2187
2199
  --sky-space-inset-balanced-xl: var(--modern-space-xl);
2188
2200
  --sky-space-inset-balanced-xs: var(--modern-space-xs);
2189
2201
  --sky-space-inset-balanced-xxs: var(--modern-size-2);
2190
- --sky-space-inset-bottomless-bottom-l: var(--modern-space-none);
2191
- --sky-space-inset-bottomless-bottom-m: var(--modern-space-none);
2192
- --sky-space-inset-bottomless-bottom-xl: var(--modern-space-none);
2193
- --sky-space-inset-bottomless-left-l: var(--modern-space-lg);
2194
- --sky-space-inset-bottomless-left-m: var(--modern-size-15);
2195
- --sky-space-inset-bottomless-left-xl: var(--modern-space-xl);
2196
- --sky-space-inset-bottomless-right-l: var(--modern-space-lg);
2197
- --sky-space-inset-bottomless-right-m: var(--modern-size-15);
2198
- --sky-space-inset-bottomless-right-xl: var(--modern-space-xl);
2199
- --sky-space-inset-bottomless-top-l: var(--modern-space-lg);
2200
- --sky-space-inset-bottomless-top-m: var(--modern-size-15);
2201
- --sky-space-inset-bottomless-top-xl: var(--modern-space-xl);
2202
- --sky-space-inset-floated-bottom-m: var(--modern-space-xl);
2203
- --sky-space-inset-floated-bottom-s: var(--modern-space-lg);
2204
- --sky-space-inset-floated-left-m: var(--modern-space-xl);
2205
- --sky-space-inset-floated-left-s: var(--modern-space-lg);
2206
- --sky-space-inset-floated-right-m: var(--modern-space-xl);
2207
- --sky-space-inset-floated-right-s: var(--modern-space-lg);
2208
- --sky-space-inset-floated-top-0: var(--modern-space-none);
2209
- --sky-space-inset-floated-top-m: var(--modern-space-s);
2210
- --sky-space-inset-floated-top-s: var(--modern-space-xs);
2211
2202
  --sky-space-inset-horizontal-bottom-0: var(--modern-space-none);
2212
2203
  --sky-space-inset-horizontal-bottom-l: var(--modern-size-0);
2213
2204
  --sky-space-inset-horizontal-bottom-m: var(--modern-size-0);
@@ -2228,68 +2219,10 @@
2228
2219
  --sky-space-inset-horizontal-top-m: var(--modern-size-0);
2229
2220
  --sky-space-inset-horizontal-top-s: var(--modern-size-0);
2230
2221
  --sky-space-inset-horizontal-top-xl: var(--modern-size-0);
2231
- --sky-space-inset-input-bottom-m: var(--modern-size-9);
2232
- --sky-space-inset-input-left-m: var(--modern-size-15);
2233
- --sky-space-inset-input-right-m: var(--modern-size-15);
2234
- --sky-space-inset-input-top-m: var(--modern-size-10);
2235
- --sky-space-inset-input_label-bottom-m: var(--modern-size-2);
2236
- --sky-space-inset-input_label-top-m: var(--modern-size-6);
2237
- --sky-space-inset-letterbox-1_2-bottom-m: var(--modern-space-lg);
2238
- --sky-space-inset-letterbox-1_2-left-m: var(--modern-space-s);
2239
- --sky-space-inset-letterbox-1_2-right-m: var(--modern-space-s);
2240
- --sky-space-inset-letterbox-1_2-top-m: var(--modern-space-lg);
2241
- --sky-space-inset-letterbox-1_3-bottom-m: var(--modern-space-xl);
2242
- --sky-space-inset-letterbox-1_3-left-m: var(--modern-space-s);
2243
- --sky-space-inset-letterbox-1_3-right-m: var(--modern-space-s);
2244
- --sky-space-inset-letterbox-1_3-top-m: var(--modern-space-xl);
2245
2222
  --sky-space-inset-letterbox-2_3-bottom-m: var(--modern-space-md);
2246
2223
  --sky-space-inset-letterbox-2_3-left-m: var(--modern-space-s);
2247
2224
  --sky-space-inset-letterbox-2_3-right-m: var(--modern-space-s);
2248
2225
  --sky-space-inset-letterbox-2_3-top-m: var(--modern-space-md);
2249
- --sky-space-inset-pillarbox-1_2-bottom-l: var(--modern-size-15);
2250
- --sky-space-inset-pillarbox-1_2-bottom-m: var(--modern-size-10);
2251
- --sky-space-inset-pillarbox-1_2-bottom-s: var(--modern-size-5);
2252
- --sky-space-inset-pillarbox-1_2-left-l: var(--modern-size-30);
2253
- --sky-space-inset-pillarbox-1_2-left-m: var(--modern-size-20);
2254
- --sky-space-inset-pillarbox-1_2-left-s: var(--modern-size-10);
2255
- --sky-space-inset-pillarbox-1_2-right-l: var(--modern-size-30);
2256
- --sky-space-inset-pillarbox-1_2-right-m: var(--modern-size-20);
2257
- --sky-space-inset-pillarbox-1_2-right-s: var(--modern-size-10);
2258
- --sky-space-inset-pillarbox-1_2-top-l: var(--modern-size-15);
2259
- --sky-space-inset-pillarbox-1_2-top-m: var(--modern-size-10);
2260
- --sky-space-inset-pillarbox-1_2-top-s: var(--modern-size-5);
2261
- --sky-space-inset-pillarbox-1_3-bottom-m: var(--modern-size-10);
2262
- --sky-space-inset-pillarbox-1_3-left-m: var(--modern-size-30);
2263
- --sky-space-inset-pillarbox-1_3-right-m: var(--modern-size-30);
2264
- --sky-space-inset-pillarbox-1_3-top-m: var(--modern-size-10);
2265
- --sky-space-inset-pillarbox-1_4-bottom-s: var(--modern-size-4);
2266
- --sky-space-inset-pillarbox-1_4-bottom-xs: var(--modern-size-1);
2267
- --sky-space-inset-pillarbox-1_4-left-s: var(--modern-size-15);
2268
- --sky-space-inset-pillarbox-1_4-left-xs: var(--modern-size-5);
2269
- --sky-space-inset-pillarbox-1_4-right-s: var(--modern-size-15);
2270
- --sky-space-inset-pillarbox-1_4-right-xs: var(--modern-size-5);
2271
- --sky-space-inset-pillarbox-1_4-top-s: var(--modern-size-4);
2272
- --sky-space-inset-pillarbox-1_4-top-xs: var(--modern-size-1);
2273
- --sky-space-inset-pillarbox-2_3-bottom-l: var(--modern-size-20);
2274
- --sky-space-inset-pillarbox-2_3-bottom-m: var(--modern-size-10);
2275
- --sky-space-inset-pillarbox-2_3-left-l: var(--modern-size-30);
2276
- --sky-space-inset-pillarbox-2_3-left-m: var(--modern-size-15);
2277
- --sky-space-inset-pillarbox-2_3-right-l: var(--modern-size-30);
2278
- --sky-space-inset-pillarbox-2_3-right-m: var(--modern-size-15);
2279
- --sky-space-inset-pillarbox-2_3-top-l: var(--modern-size-20);
2280
- --sky-space-inset-pillarbox-2_3-top-m: var(--modern-size-10);
2281
- --sky-space-inset-sunk-bottom-l: var(--modern-space-lg);
2282
- --sky-space-inset-sunk-left-l: var(--modern-space-xl);
2283
- --sky-space-inset-sunk-right-l: var(--modern-space-xl);
2284
- --sky-space-inset-sunk-top-l: var(--modern-space-xl);
2285
- --sky-space-inset-switch_icon-bottom: var(--modern-space-s);
2286
- --sky-space-inset-switch_icon-left: var(--modern-space-s);
2287
- --sky-space-inset-switch_icon-right: var(--modern-space-s);
2288
- --sky-space-inset-switch_icon-top: var(--modern-space-s);
2289
- --sky-space-inset-tabs-l: var(--modern-space-lg);
2290
- --sky-space-inset-tabs-m: var(--modern-space-md);
2291
- --sky-space-inset-tabs-s: var(--modern-space-s);
2292
- --sky-space-inset-tabs-xl: var(--modern-space-xl);
2293
2226
  --sky-space-inset-thumb: var(--modern-size-1);
2294
2227
  --sky-space-inset-thumbnail_matte-l: var(--modern-size-5);
2295
2228
  --sky-space-inset-thumbnail_matte-m: var(--modern-size-3);
@@ -2300,8 +2233,6 @@
2300
2233
  --sky-space-inset-vertical-bottom-m: var(--modern-space-md);
2301
2234
  --sky-space-inset-vertical-bottom-s: var(--modern-space-s);
2302
2235
  --sky-space-inset-vertical-bottom-xl: var(--modern-space-xl);
2303
- --sky-space-inset-vertical-fixed-bottom-l: var(--modern-size-20);
2304
- --sky-space-inset-vertical-fixed-top-l: var(--modern-size-20);
2305
2236
  --sky-space-inset-vertical-left-0: var(--modern-space-none);
2306
2237
  --sky-space-inset-vertical-left-l: var(--modern-size-0);
2307
2238
  --sky-space-inset-vertical-left-m: var(--modern-size-0);
@@ -2328,165 +2259,21 @@
2328
2259
  --sky-space-inset-switch: calc(var(--sky-size-switch) + var(--sky-space-gap-label-s));
2329
2260
  }
2330
2261
 
2331
- @media (min-width: 768px) {
2332
- .sky-theme-modern {
2333
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-15);
2334
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-15);
2335
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-15);
2336
- --sky-comp-modal-fullscreen-space-offset-top: var(--modern-size-15);
2337
- --sky-comp-modal-space-offset-bottom: var(--modern-size-20);
2338
- --sky-comp-modal-space-offset-left: var(--modern-size-20);
2339
- --sky-comp-modal-space-offset-right: var(--modern-size-20);
2340
- --sky-comp-modal-space-offset-top: var(--modern-size-20);
2341
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-xl);
2342
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-xl);
2343
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-xl);
2344
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-xl);
2345
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
2346
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-xl);
2347
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-xl);
2348
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
2349
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
2350
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-xl);
2351
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-xl);
2352
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
2353
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
2354
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
2355
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
2356
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
2357
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-size-0);
2358
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-xl);
2359
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-xl);
2360
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-xl);
2361
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
2362
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-xl);
2363
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-xl);
2364
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-xl);
2365
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
2366
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-xl);
2367
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-xl);
2368
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-xl);
2369
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
2370
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-xl);
2371
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-xl);
2372
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-xl);
2373
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
2374
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-xl);
2375
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-xl);
2376
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
2377
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
2378
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-xl);
2379
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-xl);
2380
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
2381
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
2382
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-xl);
2383
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-xl);
2384
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
2385
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
2386
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-xl);
2387
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
2388
- --sky-comp-page-tabset-tabs-space-inset-top: var(--modern-size-0);
2389
- --sky-comp-search-space-inset-bottom: var(--modern-space-s);
2390
- --sky-comp-search-space-inset-left: var(--modern-space-s);
2391
- --sky-comp-search-space-inset-right: var(--modern-space-s);
2392
- --sky-comp-search-space-inset-top: var(--modern-space-s);
2393
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-10);
2394
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
2395
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
2396
- --sky-comp-tab-vertical-content-space-inset-top: var(--modern-size-10);
2397
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
2398
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-space-md);
2399
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-space-md);
2400
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
2401
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
2402
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-space-s);
2403
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-space-s);
2404
- --sky-comp-tile-dashboard-space-inset-top: var(--modern-size-0);
2405
- }
2406
- }
2407
- .sky-theme-modern .sky-responsive-container-sm, .sky-theme-modern .sky-responsive-container-md, .sky-theme-modern .sky-responsive-container-lg {
2408
- --sky-comp-modal-fullscreen-space-offset-bottom: var(--modern-size-15);
2409
- --sky-comp-modal-fullscreen-space-offset-left: var(--modern-size-15);
2410
- --sky-comp-modal-fullscreen-space-offset-right: var(--modern-size-15);
2411
- --sky-comp-modal-fullscreen-space-offset-top: var(--modern-size-15);
2412
- --sky-comp-modal-space-offset-bottom: var(--modern-size-20);
2413
- --sky-comp-modal-space-offset-left: var(--modern-size-20);
2414
- --sky-comp-modal-space-offset-right: var(--modern-size-20);
2415
- --sky-comp-modal-space-offset-top: var(--modern-size-20);
2416
- --sky-comp-page-content-blocks-space-inset-bottom: var(--modern-space-xl);
2417
- --sky-comp-page-content-blocks-space-inset-left: var(--modern-space-xl);
2418
- --sky-comp-page-content-blocks-space-inset-right: var(--modern-space-xl);
2419
- --sky-comp-page-content-blocks-space-inset-top: var(--modern-space-xl);
2420
- --sky-comp-page-content-fit-space-inset-bottom: var(--modern-size-0);
2421
- --sky-comp-page-content-fit-space-inset-left: var(--modern-space-xl);
2422
- --sky-comp-page-content-fit-space-inset-right: var(--modern-space-xl);
2423
- --sky-comp-page-content-fit-space-inset-top: var(--modern-size-0);
2424
- --sky-comp-page-content-list-space-inset-bottom: var(--modern-size-0);
2425
- --sky-comp-page-content-list-space-inset-left: var(--modern-space-xl);
2426
- --sky-comp-page-content-list-space-inset-right: var(--modern-space-xl);
2427
- --sky-comp-page-content-list-space-inset-top: var(--modern-size-0);
2428
- --sky-comp-page-content-tabs-space-inset-bottom: var(--modern-size-0);
2429
- --sky-comp-page-content-tabs-space-inset-left: var(--modern-size-0);
2430
- --sky-comp-page-content-tabs-space-inset-right: var(--modern-size-0);
2431
- --sky-comp-page-content-tabs-space-inset-top: var(--modern-size-0);
2432
- --sky-comp-page-header-blocks-space-inset-bottom: var(--modern-size-0);
2433
- --sky-comp-page-header-blocks-space-inset-left: var(--modern-space-xl);
2434
- --sky-comp-page-header-blocks-space-inset-right: var(--modern-space-xl);
2435
- --sky-comp-page-header-blocks-space-inset-top: var(--modern-space-xl);
2436
- --sky-comp-page-header-fit-space-inset-bottom: var(--modern-space-lg);
2437
- --sky-comp-page-header-fit-space-inset-left: var(--modern-space-xl);
2438
- --sky-comp-page-header-fit-space-inset-right: var(--modern-space-xl);
2439
- --sky-comp-page-header-fit-space-inset-top: var(--modern-space-xl);
2440
- --sky-comp-page-header-list-space-inset-bottom: var(--modern-space-lg);
2441
- --sky-comp-page-header-list-space-inset-left: var(--modern-space-xl);
2442
- --sky-comp-page-header-list-space-inset-right: var(--modern-space-xl);
2443
- --sky-comp-page-header-list-space-inset-top: var(--modern-space-xl);
2444
- --sky-comp-page-header-tabs-space-inset-bottom: var(--modern-space-lg);
2445
- --sky-comp-page-header-tabs-space-inset-left: var(--modern-space-xl);
2446
- --sky-comp-page-header-tabs-space-inset-right: var(--modern-space-xl);
2447
- --sky-comp-page-header-tabs-space-inset-top: var(--modern-space-xl);
2448
- --sky-comp-page-links-blocks-space-inset-bottom: var(--modern-space-xl);
2449
- --sky-comp-page-links-blocks-space-inset-left: var(--modern-space-xl);
2450
- --sky-comp-page-links-blocks-space-inset-right: var(--modern-space-xl);
2451
- --sky-comp-page-links-blocks-space-inset-top: var(--modern-space-xl);
2452
- --sky-comp-page-links-list-space-inset-bottom: var(--modern-space-xl);
2453
- --sky-comp-page-links-list-space-inset-left: var(--modern-space-xl);
2454
- --sky-comp-page-links-list-space-inset-right: var(--modern-space-xl);
2455
- --sky-comp-page-links-list-space-inset-top: var(--modern-space-xl);
2456
- --sky-comp-page-links-tabs-space-inset-bottom: var(--modern-space-xl);
2457
- --sky-comp-page-links-tabs-space-inset-left: var(--modern-space-xl);
2458
- --sky-comp-page-links-tabs-space-inset-right: var(--modern-space-xl);
2459
- --sky-comp-page-links-tabs-space-inset-top: var(--modern-space-xl);
2460
- --sky-comp-page-tabset-tabs-space-inset-bottom: var(--modern-size-0);
2461
- --sky-comp-page-tabset-tabs-space-inset-left: var(--modern-space-xl);
2462
- --sky-comp-page-tabset-tabs-space-inset-right: var(--modern-size-0);
2463
- --sky-comp-page-tabset-tabs-space-inset-top: var(--modern-size-0);
2464
- --sky-comp-search-space-inset-bottom: var(--modern-space-s);
2465
- --sky-comp-search-space-inset-left: var(--modern-space-s);
2466
- --sky-comp-search-space-inset-right: var(--modern-space-s);
2467
- --sky-comp-search-space-inset-top: var(--modern-space-s);
2468
- --sky-comp-tab-vertical-content-space-inset-bottom: var(--modern-size-10);
2469
- --sky-comp-tab-vertical-content-space-inset-left: var(--modern-size-15);
2470
- --sky-comp-tab-vertical-content-space-inset-right: var(--modern-size-15);
2471
- --sky-comp-tab-vertical-content-space-inset-top: var(--modern-size-10);
2472
- --sky-comp-tile-dashboard-column-space-inset-bottom: var(--modern-size-0);
2473
- --sky-comp-tile-dashboard-column-space-inset-left: var(--modern-space-md);
2474
- --sky-comp-tile-dashboard-column-space-inset-right: var(--modern-space-md);
2475
- --sky-comp-tile-dashboard-column-space-inset-top: var(--modern-size-0);
2476
- --sky-comp-tile-dashboard-space-inset-bottom: var(--modern-size-0);
2477
- --sky-comp-tile-dashboard-space-inset-left: var(--modern-space-s);
2478
- --sky-comp-tile-dashboard-space-inset-right: var(--modern-space-s);
2479
- --sky-comp-tile-dashboard-space-inset-top: var(--modern-size-0);
2480
- }
2481
-
2482
2262
  .sky-theme-modern {
2483
2263
  /* color */
2484
2264
  --sky-background-color-page-default: var(--sky-color-background-page);
2485
- --sky-background-color-neutral-light: #fcfcfc;
2486
- --sky-background-color-primary-dark: #1870B8;
2487
- --sky-background-color-disabled: #ededee;
2488
- --sky-border-color-neutral-medium: #d2d2d2;
2489
- --sky-border-color-neutral-medium-dark: #8c929c;
2265
+ --sky-background-color-container-default: var(
2266
+ --sky-color-background-container-base
2267
+ );
2268
+ --sky-background-color-neutral-light: var(--sky-color-background-page);
2269
+ --sky-background-color-primary-dark: var(
2270
+ --sky-color-background-action-primary-base
2271
+ );
2272
+ --sky-background-color-disabled: var(
2273
+ --sky-color-background-action-primary-disabled
2274
+ );
2275
+ --sky-border-color-neutral-medium: var(--sky-color-border-container-base);
2276
+ --sky-border-color-neutral-medium-dark: var(--sky-color-border-switch-base);
2490
2277
  --sky-category-color-light-blue: var(--sky-color-category-green);
2491
2278
  --sky-category-color-teal: var(--sky-color-category-teal);
2492
2279
  --sky-category-color-purple: var(--sky-color-category-purple);
@@ -2494,13 +2281,17 @@
2494
2281
  --sky-category-color-blue: var(--sky-color-category-blue);
2495
2282
  --sky-category-color-yellow: var(--sky-color-category-yellow);
2496
2283
  --sky-category-color-red: var(--sky-color-category-red);
2497
- --sky-highlight-color-info: #00b4f1;
2498
- --sky-highlight-color-success: #72bf44;
2499
- --sky-highlight-color-warning: #fbb034;
2500
- --sky-highlight-color-danger: #ef4044;
2501
- --sky-text-color-deemphasized: #686c73;
2502
- --sky-text-color-action-primary: #1870B8;
2503
- --sky-text-color-action-primary-hover: rgb(18.1153846154, 84.5384615385, 138.8846153846);
2284
+ --sky-highlight-color-info: var(--sky-color-border-info);
2285
+ --sky-highlight-color-success: var(--sky-color-border-success);
2286
+ --sky-highlight-color-warning: var(--sky-color-border-warning);
2287
+ --sky-highlight-color-danger: var(--sky-color-border-danger);
2288
+ --sky-text-color-default: var(--sky-color-text-default);
2289
+ --sky-text-color-deemphasized: var(--sky-color-text-deemphasized);
2290
+ --sky-text-color-action-primary: var(--sky-color-text-action);
2291
+ --sky-text-color-action-primary-hover: darken(
2292
+ var(--sky-color-text-action),
2293
+ 10%
2294
+ );
2504
2295
  /* margin */
2505
2296
  --sky-margin-inline-xs: 5px;
2506
2297
  --sky-margin-inline-sm: 10px;
@@ -2517,8 +2308,12 @@
2517
2308
  --sky-padding-even-xl: 30px;
2518
2309
  --sky-padding-half: 5px;
2519
2310
  /* component colors */
2520
- --sky-background-color-input-selected: #ebfbff;
2521
- --sky-background-color-item-selected: #ebfbff;
2311
+ --sky-background-color-input-selected: var(
2312
+ --sky-color-background-selected-soft
2313
+ );
2314
+ --sky-background-color-item-selected: var(
2315
+ --sky-color-background-selected-soft
2316
+ );
2522
2317
  /* switch */
2523
2318
  --sky-switch-size: 26px;
2524
2319
  /* viewkeeper */
@@ -2534,6 +2329,8 @@
2534
2329
 
2535
2330
  .sky-theme-modern:not(.sky-theme-brand-base) .sky-btn {
2536
2331
  --sky-override-borderless-icon-size: 26px;
2332
+ --sky-override-button-box-shadow-hover-transition: box-shadow
2333
+ 150ms;
2537
2334
  --sky-override-button-default-box-shadow-focus:
2538
2335
  inset 0 0 0 var(--sky-border-width-action-focus)
2539
2336
  var(--sky-color-border-action-secondary-focus),
@@ -2865,23 +2662,24 @@
2865
2662
  .sky-theme-modern .sky-btn-icon {
2866
2663
  background-color: var(--sky-color-background-action-secondary-base);
2867
2664
  color: var(--sky-color-text-default);
2868
- box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-secondary-base);
2665
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-secondary-base), var(--sky-elevation-action-secondary-base);
2869
2666
  }
2870
2667
  .sky-theme-modern .sky-btn-default:hover,
2871
2668
  .sky-theme-modern .sky-btn-icon:hover {
2872
2669
  background-color: var(--sky-color-background-action-secondary-hover);
2873
- box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-secondary-hover);
2670
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-secondary-hover), var(--sky-elevation-action-secondary-hover);
2874
2671
  }
2875
2672
  .sky-theme-modern .sky-btn-default:active, .sky-theme-modern .sky-btn-default.sky-btn-active,
2876
2673
  .sky-theme-modern .sky-btn-icon:active,
2877
2674
  .sky-theme-modern .sky-btn-icon.sky-btn-active {
2878
2675
  background-color: var(--sky-color-background-action-secondary-active);
2879
- box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-secondary-active);
2676
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-secondary-active), var(--sky-elevation-action-secondary-active);
2677
+ transition: var(--sky-override-button-box-shadow-hover-transition, none);
2880
2678
  }
2881
2679
  .sky-theme-modern .sky-btn-default:focus-visible:not(:active),
2882
2680
  .sky-theme-modern .sky-btn-icon:focus-visible:not(:active) {
2883
2681
  background-color: var(--sky-color-background-action-secondary-focus);
2884
- 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));
2682
+ 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-elevation-action-secondary-focus));
2885
2683
  }
2886
2684
  .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,
2887
2685
  .sky-theme-modern .sky-btn-icon.sky-btn-disabled,
@@ -2896,7 +2694,7 @@
2896
2694
  .sky-theme-modern .sky-btn-icon[disabled].sky-btn-focus,
2897
2695
  .sky-theme-modern .sky-btn-icon[disabled]:active,
2898
2696
  .sky-theme-modern .sky-btn-icon[disabled].sky-btn-active {
2899
- box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-secondary-disabled);
2697
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-secondary-disabled), var(--sky-elevation-action-secondary-disabled);
2900
2698
  background-color: var(--sky-color-background-action-secondary-disabled);
2901
2699
  }
2902
2700
  .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),
@@ -2912,55 +2710,57 @@
2912
2710
  .sky-theme-modern .sky-btn-icon[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus),
2913
2711
  .sky-theme-modern .sky-btn-icon[disabled]:active:is(:focus-visible, .sky-btn-focus),
2914
2712
  .sky-theme-modern .sky-btn-icon[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
2915
- 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));
2713
+ 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-elevation-action-secondary-disabled));
2916
2714
  }
2917
2715
  .sky-theme-modern .sky-btn-primary {
2918
2716
  background-color: var(--sky-color-background-action-primary-base);
2919
2717
  color: var(--sky-color-text-inverse);
2920
- box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-primary-base);
2718
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-primary-base), var(--sky-elevation-action-primary-base);
2921
2719
  }
2922
2720
  .sky-theme-modern .sky-btn-primary:hover {
2923
2721
  background-color: var(--sky-color-background-action-primary-hover);
2924
- box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-primary-hover);
2722
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-primary-hover), var(--sky-elevation-action-primary-hover);
2925
2723
  }
2926
2724
  .sky-theme-modern .sky-btn-primary:active, .sky-theme-modern .sky-btn-primary.sky-btn-active {
2927
2725
  background-color: var(--sky-color-background-action-primary-active);
2928
- box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-primary-active);
2726
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-primary-active), var(--sky-elevation-action-primary-active);
2727
+ transition: var(--sky-override-button-box-shadow-hover-transition, none);
2929
2728
  }
2930
2729
  .sky-theme-modern .sky-btn-primary:focus-visible:not(:active) {
2931
2730
  background-color: var(--sky-color-background-action-primary-focus);
2932
- 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));
2731
+ 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-elevation-action-primary-focus));
2933
2732
  }
2934
2733
  .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 {
2935
- box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-primary-disabled);
2734
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-primary-disabled), var(--sky-elevation-action-primary-disabled);
2936
2735
  background-color: var(--sky-color-background-action-primary-disabled);
2937
2736
  }
2938
2737
  .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) {
2939
- 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));
2738
+ 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-elevation-action-primary-disabled));
2940
2739
  }
2941
2740
  .sky-theme-modern .sky-btn-danger {
2942
2741
  background-color: var(--sky-color-background-action-danger-base);
2943
2742
  color: var(--sky-color-text-inverse);
2944
- box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-danger-base);
2743
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-danger-base), var(--sky-elevation-action-danger-base);
2945
2744
  }
2946
2745
  .sky-theme-modern .sky-btn-danger:hover {
2947
2746
  background-color: var(--sky-color-background-action-danger-hover);
2948
- box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-danger-hover);
2747
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-danger-hover), var(--sky-elevation-action-danger-hover);
2949
2748
  }
2950
2749
  .sky-theme-modern .sky-btn-danger:active, .sky-theme-modern .sky-btn-danger.sky-btn-active {
2951
2750
  background-color: var(--sky-color-background-action-danger-active);
2952
- box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-danger-active);
2751
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-danger-active), var(--sky-elevation-action-danger-active);
2752
+ transition: var(--sky-override-button-box-shadow-hover-transition, none);
2953
2753
  }
2954
2754
  .sky-theme-modern .sky-btn-danger:focus-visible:not(:active) {
2955
2755
  background-color: var(--sky-color-background-action-danger-focus);
2956
- 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));
2756
+ 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-elevation-action-danger-focus));
2957
2757
  }
2958
2758
  .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 {
2959
- box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-danger-disabled);
2759
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-danger-disabled), var(--sky-elevation-action-danger-disabled);
2960
2760
  background-color: var(--sky-color-background-action-danger-disabled);
2961
2761
  }
2962
2762
  .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) {
2963
- 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));
2763
+ 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-elevation-action-danger-disabled));
2964
2764
  }
2965
2765
  .sky-theme-modern .sky-btn-link {
2966
2766
  color: var(--sky-color-text-action);
@@ -2979,13 +2779,13 @@
2979
2779
  .sky-theme-modern .sky-btn-borderless,
2980
2780
  .sky-theme-modern .sky-btn-icon-borderless {
2981
2781
  background-color: var(--sky-color-background-action-tertiary-base);
2982
- box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-tertiary-base);
2782
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-action-tertiary-base), var(--sky-elevation-action-tertiary-base);
2983
2783
  }
2984
2784
  .sky-theme-modern .sky-btn-link:hover,
2985
2785
  .sky-theme-modern .sky-btn-borderless:hover,
2986
2786
  .sky-theme-modern .sky-btn-icon-borderless:hover {
2987
2787
  background-color: var(--sky-color-background-action-tertiary-hover);
2988
- box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-hover);
2788
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-hover), var(--sky-elevation-action-tertiary-hover);
2989
2789
  }
2990
2790
  .sky-theme-modern .sky-btn-link:active, .sky-theme-modern .sky-btn-link.sky-btn-active,
2991
2791
  .sky-theme-modern .sky-btn-borderless:active,
@@ -2993,13 +2793,14 @@
2993
2793
  .sky-theme-modern .sky-btn-icon-borderless:active,
2994
2794
  .sky-theme-modern .sky-btn-icon-borderless.sky-btn-active {
2995
2795
  background-color: var(--sky-color-background-action-tertiary-active);
2996
- box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-active);
2796
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-active), var(--sky-elevation-action-tertiary-active);
2797
+ transition: var(--sky-override-button-box-shadow-hover-transition, none);
2997
2798
  }
2998
2799
  .sky-theme-modern .sky-btn-link:focus-visible:not(:active),
2999
2800
  .sky-theme-modern .sky-btn-borderless:focus-visible:not(:active),
3000
2801
  .sky-theme-modern .sky-btn-icon-borderless:focus-visible:not(:active) {
3001
2802
  background-color: var(--sky-color-background-action-tertiary-focus);
3002
- 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));
2803
+ 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-elevation-action-tertiary-focus));
3003
2804
  }
3004
2805
  .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,
3005
2806
  .sky-theme-modern .sky-btn-borderless.sky-btn-disabled,
@@ -3026,7 +2827,7 @@
3026
2827
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-focus,
3027
2828
  .sky-theme-modern .sky-btn-icon-borderless[disabled]:active,
3028
2829
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active {
3029
- box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-tertiary-disabled);
2830
+ box-shadow: inset 0 0 0 var(--sky-border-width-action-disabled) var(--sky-color-border-action-tertiary-disabled), var(--sky-elevation-action-tertiary-disabled);
3030
2831
  background-color: var(--sky-color-background-action-tertiary-disabled);
3031
2832
  }
3032
2833
  .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),
@@ -3054,7 +2855,7 @@
3054
2855
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-focus:is(:focus-visible, .sky-btn-focus),
3055
2856
  .sky-theme-modern .sky-btn-icon-borderless[disabled]:active:is(:focus-visible, .sky-btn-focus),
3056
2857
  .sky-theme-modern .sky-btn-icon-borderless[disabled].sky-btn-active:is(:focus-visible, .sky-btn-focus) {
3057
- 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));
2858
+ 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-elevation-action-tertiary-disabled));
3058
2859
  }
3059
2860
  .sky-theme-modern .sky-btn-link-inline {
3060
2861
  background-color: var(--sky-color-background-action-tertiary-base);
@@ -3340,7 +3141,9 @@
3340
3141
  color: var(--sky-override-switch-checked-color, var(--sky-color-icon-inverse));
3341
3142
  }
3342
3143
  .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 {
3343
- color: var(--sky-override-switch-icon-checked-color-no-group, var(--sky-color-icon-inverse));
3144
+ background-color: var(--sky-color-background-selected-soft);
3145
+ color: var(--sky-override-switch-icon-checked-color-no-group, var(--sky-color-icon-selected));
3146
+ border-color: var(--sky-color-border-selected);
3344
3147
  }
3345
3148
  .sky-theme-modern .sky-switch .sky-switch-input:checked:not(:disabled) + .sky-switch-control:is(.sky-switch-control-success,
3346
3149
  .sky-switch-control-warning,
@@ -3451,7 +3254,7 @@
3451
3254
  }
3452
3255
  .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 {
3453
3256
  border-width: var(--sky-border-width-selected-s);
3454
- color: var(--sky-override-switch-checked-color, var(--sky-color-icon-inverse));
3257
+ color: var(--sky-override-switch-checked-color, var(--sky-color-icon-action));
3455
3258
  }
3456
3259
  .sky-theme-modern .sky-switch-icon-group .sky-switch-input:disabled + .sky-switch-control.sky-switch-control-icon {
3457
3260
  border-color: var(--sky-color-border-action-tertiary-disabled);