@carbon/ibm-products 2.8.1 → 2.9.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -368,31 +368,31 @@
368
368
  display: block;
369
369
  }
370
370
 
371
- .cds--popover--tab-tip > .cds--popover .cds--popover-caret {
371
+ .cds--popover--tab-tip > .cds--popover > .cds--popover-caret {
372
372
  display: none;
373
373
  }
374
374
 
375
- .cds--popover--bottom > .cds--popover .cds--popover-content {
375
+ .cds--popover--bottom > .cds--popover > .cds--popover-content {
376
376
  bottom: 0;
377
377
  left: 50%;
378
378
  transform: translate(-50%, calc(100% + var(--cds-popover-offset, 0rem)));
379
379
  }
380
380
 
381
- .cds--popover--bottom-left > .cds--popover .cds--popover-content {
381
+ .cds--popover--bottom-left > .cds--popover > .cds--popover-content {
382
382
  bottom: 0;
383
383
  left: 0;
384
384
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(100% + var(--cds-popover-offset, 0rem)));
385
385
  }
386
386
 
387
- .cds--popover--bottom-right > .cds--popover .cds--popover-content {
387
+ .cds--popover--bottom-right > .cds--popover > .cds--popover-content {
388
388
  right: 0;
389
389
  bottom: 0;
390
390
  transform: translate(var(--cds-popover-offset, 0rem), calc(100% + var(--cds-popover-offset, 0rem)));
391
391
  }
392
392
 
393
- .cds--popover--bottom > .cds--popover .cds--popover-content::before,
394
- .cds--popover--bottom-left > .cds--popover .cds--popover-content::before,
395
- .cds--popover--bottom-right > .cds--popover .cds--popover-content::before {
393
+ .cds--popover--bottom > .cds--popover > .cds--popover-content::before,
394
+ .cds--popover--bottom-left > .cds--popover > .cds--popover-content::before,
395
+ .cds--popover--bottom-right > .cds--popover > .cds--popover-content::before {
396
396
  top: 0;
397
397
  right: 0;
398
398
  left: 0;
@@ -400,9 +400,9 @@
400
400
  transform: translateY(-100%);
401
401
  }
402
402
 
403
- .cds--popover--bottom > .cds--popover .cds--popover-caret,
404
- .cds--popover--bottom-left > .cds--popover .cds--popover-caret,
405
- .cds--popover--bottom-right > .cds--popover .cds--popover-caret {
403
+ .cds--popover--bottom > .cds--popover > .cds--popover-caret,
404
+ .cds--popover--bottom-left > .cds--popover > .cds--popover-caret,
405
+ .cds--popover--bottom-right > .cds--popover > .cds--popover-caret {
406
406
  bottom: 0;
407
407
  left: 50%;
408
408
  width: var(--cds-popover-caret-width, 0.75rem);
@@ -411,27 +411,27 @@
411
411
  transform: translate(-50%, var(--cds-popover-offset, 0rem));
412
412
  }
413
413
 
414
- .cds--popover--top > .cds--popover .cds--popover-content {
414
+ .cds--popover--top > .cds--popover > .cds--popover-content {
415
415
  top: 0;
416
416
  left: 50%;
417
417
  transform: translate(-50%, calc(-100% - var(--cds-popover-offset, 0rem)));
418
418
  }
419
419
 
420
- .cds--popover--top-left > .cds--popover .cds--popover-content {
420
+ .cds--popover--top-left > .cds--popover > .cds--popover-content {
421
421
  top: 0;
422
422
  left: 0;
423
423
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-100% - var(--cds-popover-offset, 0rem)));
424
424
  }
425
425
 
426
- .cds--popover--top-right > .cds--popover .cds--popover-content {
426
+ .cds--popover--top-right > .cds--popover > .cds--popover-content {
427
427
  top: 0;
428
428
  right: 0;
429
429
  transform: translate(var(--cds-popover-offset, 0rem), calc(-100% - var(--cds-popover-offset, 0rem)));
430
430
  }
431
431
 
432
- .cds--popover--top > .cds--popover .cds--popover-content::before,
433
- .cds--popover--top-left > .cds--popover .cds--popover-content::before,
434
- .cds--popover--top-right > .cds--popover .cds--popover-content::before {
432
+ .cds--popover--top > .cds--popover > .cds--popover-content::before,
433
+ .cds--popover--top-left > .cds--popover > .cds--popover-content::before,
434
+ .cds--popover--top-right > .cds--popover > .cds--popover-content::before {
435
435
  right: 0;
436
436
  bottom: 0;
437
437
  left: 0;
@@ -439,9 +439,9 @@
439
439
  transform: translateY(100%);
440
440
  }
441
441
 
442
- .cds--popover--top > .cds--popover .cds--popover-caret,
443
- .cds--popover--top-left > .cds--popover .cds--popover-caret,
444
- .cds--popover--top-right > .cds--popover .cds--popover-caret {
442
+ .cds--popover--top > .cds--popover > .cds--popover-caret,
443
+ .cds--popover--top-left > .cds--popover > .cds--popover-caret,
444
+ .cds--popover--top-right > .cds--popover > .cds--popover-caret {
445
445
  top: 0;
446
446
  left: 50%;
447
447
  width: var(--cds-popover-caret-width, 0.75rem);
@@ -450,27 +450,27 @@
450
450
  transform: translate(-50%, calc(-1 * var(--cds-popover-offset, 0rem)));
451
451
  }
452
452
 
453
- .cds--popover--right > .cds--popover .cds--popover-content {
453
+ .cds--popover--right > .cds--popover > .cds--popover-content {
454
454
  top: 50%;
455
455
  left: 100%;
456
456
  transform: translate(var(--cds-popover-offset, 0rem), -50%);
457
457
  }
458
458
 
459
- .cds--popover--right-top > .cds--popover .cds--popover-content {
459
+ .cds--popover--right-top > .cds--popover > .cds--popover-content {
460
460
  top: 50%;
461
461
  left: 100%;
462
462
  transform: translate(var(--cds-popover-offset, 0rem), calc(0.5 * var(--cds-popover-offset, 0rem) * -1 - 16px));
463
463
  }
464
464
 
465
- .cds--popover--right-bottom > .cds--popover .cds--popover-content {
465
+ .cds--popover--right-bottom > .cds--popover > .cds--popover-content {
466
466
  bottom: 50%;
467
467
  left: 100%;
468
468
  transform: translate(var(--cds-popover-offset, 0rem), calc(0.5 * var(--cds-popover-offset, 0rem) + 16px));
469
469
  }
470
470
 
471
- .cds--popover--right > .cds--popover .cds--popover-content::before,
472
- .cds--popover--right-top > .cds--popover .cds--popover-content::before,
473
- .cds--popover--right-bottom > .cds--popover .cds--popover-content::before {
471
+ .cds--popover--right > .cds--popover > .cds--popover-content::before,
472
+ .cds--popover--right-top > .cds--popover > .cds--popover-content::before,
473
+ .cds--popover--right-bottom > .cds--popover > .cds--popover-content::before {
474
474
  top: 0;
475
475
  bottom: 0;
476
476
  left: 0;
@@ -478,9 +478,9 @@
478
478
  transform: translateX(-100%);
479
479
  }
480
480
 
481
- .cds--popover--right > .cds--popover .cds--popover-caret,
482
- .cds--popover--right-top > .cds--popover .cds--popover-caret,
483
- .cds--popover--right-bottom > .cds--popover .cds--popover-caret {
481
+ .cds--popover--right > .cds--popover > .cds--popover-caret,
482
+ .cds--popover--right-top > .cds--popover > .cds--popover-caret,
483
+ .cds--popover--right-bottom > .cds--popover > .cds--popover-caret {
484
484
  top: 50%;
485
485
  left: 100%;
486
486
  width: var(--cds-popover-caret-height, 0.375rem);
@@ -489,27 +489,27 @@
489
489
  transform: translate(calc(var(--cds-popover-offset, 0rem) - 100%), -50%);
490
490
  }
491
491
 
492
- .cds--popover--left > .cds--popover .cds--popover-content {
492
+ .cds--popover--left > .cds--popover > .cds--popover-content {
493
493
  top: 50%;
494
494
  right: 100%;
495
495
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem) + 0.1px), -50%);
496
496
  }
497
497
 
498
- .cds--popover--left-top > .cds--popover .cds--popover-content {
498
+ .cds--popover--left-top > .cds--popover > .cds--popover-content {
499
499
  top: -50%;
500
500
  right: 100%;
501
501
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-0.5 * var(--cds-popover-offset, 0rem) + 16px));
502
502
  }
503
503
 
504
- .cds--popover--left-bottom > .cds--popover .cds--popover-content {
504
+ .cds--popover--left-bottom > .cds--popover > .cds--popover-content {
505
505
  right: 100%;
506
506
  bottom: -50%;
507
507
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(0.5 * var(--cds-popover-offset, 0rem) - 16px));
508
508
  }
509
509
 
510
- .cds--popover--left > .cds--popover .cds--popover-content::before,
511
- .cds--popover--left-top > .cds--popover .cds--popover-content::before,
512
- .cds--popover--left-bottom > .cds--popover .cds--popover-content::before {
510
+ .cds--popover--left > .cds--popover > .cds--popover-content::before,
511
+ .cds--popover--left-top > .cds--popover > .cds--popover-content::before,
512
+ .cds--popover--left-bottom > .cds--popover > .cds--popover-content::before {
513
513
  top: 0;
514
514
  right: 0;
515
515
  bottom: 0;
@@ -517,9 +517,9 @@
517
517
  transform: translateX(100%);
518
518
  }
519
519
 
520
- .cds--popover--left > .cds--popover .cds--popover-caret,
521
- .cds--popover--left-top > .cds--popover .cds--popover-caret,
522
- .cds--popover--left-bottom > .cds--popover .cds--popover-caret {
520
+ .cds--popover--left > .cds--popover > .cds--popover-caret,
521
+ .cds--popover--left-top > .cds--popover > .cds--popover-caret,
522
+ .cds--popover--left-bottom > .cds--popover > .cds--popover-caret {
523
523
  top: 50%;
524
524
  right: 100%;
525
525
  width: var(--cds-popover-caret-height, 0.375rem);
@@ -528,7 +528,7 @@
528
528
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem) + 100%), -50%);
529
529
  }
530
530
 
531
- .cds--popover--tab-tip > .cds--popover .cds--popover-content {
531
+ .cds--popover--tab-tip > .cds--popover > .cds--popover-content {
532
532
  border-radius: 0;
533
533
  }
534
534
 
@@ -847,14 +847,14 @@
847
847
  padding-inline-end: calc(var(--cds-layout-density-padding-inline-local) - 0.0625rem);
848
848
  }
849
849
  .cds--btn--ghost:hover {
850
- background-color: var(--cds-layer-hover);
850
+ background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
851
851
  }
852
852
  .cds--btn--ghost:focus {
853
853
  border-color: var(--cds-button-focus-color, var(--cds-focus, #0f62fe));
854
854
  box-shadow: inset 0 0 0 1px var(--cds-button-focus-color, var(--cds-focus, #0f62fe)), inset 0 0 0 2px var(--cds-background, #ffffff);
855
855
  }
856
856
  .cds--btn--ghost:active {
857
- background-color: var(--cds-layer-active);
857
+ background-color: var(--cds-background-active, rgba(141, 141, 141, 0.5));
858
858
  }
859
859
  .cds--btn--ghost .cds--btn__icon,
860
860
  .cds--btn--ghost .cds--btn__icon path:not([data-icon-path]):not([fill=none]) {
@@ -14531,71 +14531,71 @@ th.c4p--datagrid__select-all-toggle-on.button {
14531
14531
  }
14532
14532
  }
14533
14533
  :root {
14534
- --cds-layer:var(--cds-layer-01, #f4f4f4);
14535
- --cds-layer-active:var(--cds-layer-active-01, #c6c6c6);
14536
- --cds-layer-hover:var(--cds-layer-hover-01, #e8e8e8);
14537
- --cds-layer-selected:var(--cds-layer-selected-01, #e0e0e0);
14538
- --cds-layer-selected-hover:var(--cds-layer-selected-hover-01, #d1d1d1);
14539
- --cds-layer-accent:var(--cds-layer-accent-01, #e0e0e0);
14540
- --cds-layer-accent-hover:var(--cds-layer-accent-hover-01, #d1d1d1);
14541
- --cds-layer-accent-active:var(--cds-layer-accent-active-01, #a8a8a8);
14542
- --cds-field:var(--cds-field-01, #f4f4f4);
14543
- --cds-field-hover:var(--cds-field-hover-01, #e8e8e8);
14544
- --cds-border-subtle:var(--cds-border-subtle-00, #e0e0e0);
14545
- --cds-border-subtle-selected:var(--cds-border-subtle-selected-01, #c6c6c6);
14546
- --cds-border-strong:var(--cds-border-strong-01, #8d8d8d);
14547
- --cds-border-tile:var(--cds-border-tile-01, #c6c6c6);
14534
+ --cds-layer: var(--cds-layer-01, #f4f4f4);
14535
+ --cds-layer-active: var(--cds-layer-active-01, #c6c6c6);
14536
+ --cds-layer-hover: var(--cds-layer-hover-01, #e8e8e8);
14537
+ --cds-layer-selected: var(--cds-layer-selected-01, #e0e0e0);
14538
+ --cds-layer-selected-hover: var(--cds-layer-selected-hover-01, #d1d1d1);
14539
+ --cds-layer-accent: var(--cds-layer-accent-01, #e0e0e0);
14540
+ --cds-layer-accent-hover: var(--cds-layer-accent-hover-01, #d1d1d1);
14541
+ --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
14542
+ --cds-field: var(--cds-field-01, #f4f4f4);
14543
+ --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
14544
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
14545
+ --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
14546
+ --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
14547
+ --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
14548
14548
  }
14549
14549
 
14550
14550
  .cds--layer-one {
14551
- --cds-layer:var(--cds-layer-01, #f4f4f4);
14552
- --cds-layer-active:var(--cds-layer-active-01, #c6c6c6);
14553
- --cds-layer-hover:var(--cds-layer-hover-01, #e8e8e8);
14554
- --cds-layer-selected:var(--cds-layer-selected-01, #e0e0e0);
14555
- --cds-layer-selected-hover:var(--cds-layer-selected-hover-01, #d1d1d1);
14556
- --cds-layer-accent:var(--cds-layer-accent-01, #e0e0e0);
14557
- --cds-layer-accent-hover:var(--cds-layer-accent-hover-01, #d1d1d1);
14558
- --cds-layer-accent-active:var(--cds-layer-accent-active-01, #a8a8a8);
14559
- --cds-field:var(--cds-field-01, #f4f4f4);
14560
- --cds-field-hover:var(--cds-field-hover-01, #e8e8e8);
14561
- --cds-border-subtle:var(--cds-border-subtle-00, #e0e0e0);
14562
- --cds-border-subtle-selected:var(--cds-border-subtle-selected-01, #c6c6c6);
14563
- --cds-border-strong:var(--cds-border-strong-01, #8d8d8d);
14564
- --cds-border-tile:var(--cds-border-tile-01, #c6c6c6);
14551
+ --cds-layer: var(--cds-layer-01, #f4f4f4);
14552
+ --cds-layer-active: var(--cds-layer-active-01, #c6c6c6);
14553
+ --cds-layer-hover: var(--cds-layer-hover-01, #e8e8e8);
14554
+ --cds-layer-selected: var(--cds-layer-selected-01, #e0e0e0);
14555
+ --cds-layer-selected-hover: var(--cds-layer-selected-hover-01, #d1d1d1);
14556
+ --cds-layer-accent: var(--cds-layer-accent-01, #e0e0e0);
14557
+ --cds-layer-accent-hover: var(--cds-layer-accent-hover-01, #d1d1d1);
14558
+ --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
14559
+ --cds-field: var(--cds-field-01, #f4f4f4);
14560
+ --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
14561
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
14562
+ --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
14563
+ --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
14564
+ --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
14565
14565
  }
14566
14566
 
14567
14567
  .cds--layer-two {
14568
- --cds-layer:var(--cds-layer-02, #ffffff);
14569
- --cds-layer-active:var(--cds-layer-active-02, #c6c6c6);
14570
- --cds-layer-hover:var(--cds-layer-hover-02, #e8e8e8);
14571
- --cds-layer-selected:var(--cds-layer-selected-02, #e0e0e0);
14572
- --cds-layer-selected-hover:var(--cds-layer-selected-hover-02, #d1d1d1);
14573
- --cds-layer-accent:var(--cds-layer-accent-02, #e0e0e0);
14574
- --cds-layer-accent-hover:var(--cds-layer-accent-hover-02, #d1d1d1);
14575
- --cds-layer-accent-active:var(--cds-layer-accent-active-02, #a8a8a8);
14576
- --cds-field:var(--cds-field-02, #ffffff);
14577
- --cds-field-hover:var(--cds-field-hover-02, #e8e8e8);
14578
- --cds-border-subtle:var(--cds-border-subtle-01, #c6c6c6);
14579
- --cds-border-subtle-selected:var(--cds-border-subtle-selected-02, #c6c6c6);
14580
- --cds-border-strong:var(--cds-border-strong-02, #8d8d8d);
14581
- --cds-border-tile:var(--cds-border-tile-02, #a8a8a8);
14568
+ --cds-layer: var(--cds-layer-02, #ffffff);
14569
+ --cds-layer-active: var(--cds-layer-active-02, #c6c6c6);
14570
+ --cds-layer-hover: var(--cds-layer-hover-02, #e8e8e8);
14571
+ --cds-layer-selected: var(--cds-layer-selected-02, #e0e0e0);
14572
+ --cds-layer-selected-hover: var(--cds-layer-selected-hover-02, #d1d1d1);
14573
+ --cds-layer-accent: var(--cds-layer-accent-02, #e0e0e0);
14574
+ --cds-layer-accent-hover: var(--cds-layer-accent-hover-02, #d1d1d1);
14575
+ --cds-layer-accent-active: var(--cds-layer-accent-active-02, #a8a8a8);
14576
+ --cds-field: var(--cds-field-02, #ffffff);
14577
+ --cds-field-hover: var(--cds-field-hover-02, #e8e8e8);
14578
+ --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
14579
+ --cds-border-subtle-selected: var(--cds-border-subtle-selected-02, #c6c6c6);
14580
+ --cds-border-strong: var(--cds-border-strong-02, #8d8d8d);
14581
+ --cds-border-tile: var(--cds-border-tile-02, #a8a8a8);
14582
14582
  }
14583
14583
 
14584
14584
  .cds--layer-three {
14585
- --cds-layer:var(--cds-layer-03, #f4f4f4);
14586
- --cds-layer-active:var(--cds-layer-active-03, #c6c6c6);
14587
- --cds-layer-hover:var(--cds-layer-hover-03, #e8e8e8);
14588
- --cds-layer-selected:var(--cds-layer-selected-03, #e0e0e0);
14589
- --cds-layer-selected-hover:var(--cds-layer-selected-hover-03, #d1d1d1);
14590
- --cds-layer-accent:var(--cds-layer-accent-03, #e0e0e0);
14591
- --cds-layer-accent-hover:var(--cds-layer-accent-hover-03, #d1d1d1);
14592
- --cds-layer-accent-active:var(--cds-layer-accent-active-03, #a8a8a8);
14593
- --cds-field:var(--cds-field-03, #f4f4f4);
14594
- --cds-field-hover:var(--cds-field-hover-03, #e8e8e8);
14595
- --cds-border-subtle:var(--cds-border-subtle-02, #e0e0e0);
14596
- --cds-border-subtle-selected:var(--cds-border-subtle-selected-03, #c6c6c6);
14597
- --cds-border-strong:var(--cds-border-strong-03, #8d8d8d);
14598
- --cds-border-tile:var(--cds-border-tile-03, #c6c6c6);
14585
+ --cds-layer: var(--cds-layer-03, #f4f4f4);
14586
+ --cds-layer-active: var(--cds-layer-active-03, #c6c6c6);
14587
+ --cds-layer-hover: var(--cds-layer-hover-03, #e8e8e8);
14588
+ --cds-layer-selected: var(--cds-layer-selected-03, #e0e0e0);
14589
+ --cds-layer-selected-hover: var(--cds-layer-selected-hover-03, #d1d1d1);
14590
+ --cds-layer-accent: var(--cds-layer-accent-03, #e0e0e0);
14591
+ --cds-layer-accent-hover: var(--cds-layer-accent-hover-03, #d1d1d1);
14592
+ --cds-layer-accent-active: var(--cds-layer-accent-active-03, #a8a8a8);
14593
+ --cds-field: var(--cds-field-03, #f4f4f4);
14594
+ --cds-field-hover: var(--cds-field-hover-03, #e8e8e8);
14595
+ --cds-border-subtle: var(--cds-border-subtle-02, #e0e0e0);
14596
+ --cds-border-subtle-selected: var(--cds-border-subtle-selected-03, #c6c6c6);
14597
+ --cds-border-strong: var(--cds-border-strong-03, #8d8d8d);
14598
+ --cds-border-tile: var(--cds-border-tile-03, #c6c6c6);
14599
14599
  }
14600
14600
 
14601
14601
  .cds--side-nav {
@@ -15106,154 +15106,154 @@ a.cds--side-nav__link--current::before {
15106
15106
  }
15107
15107
  }
15108
15108
  .cds--layout--size-xs {
15109
- --cds-layout-size-height-context:var(--cds-layout-size-height-xs, 1.5rem);
15110
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15109
+ --cds-layout-size-height-context: var(--cds-layout-size-height-xs, 1.5rem);
15110
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15111
15111
  }
15112
15112
 
15113
15113
  .cds--layout-constraint--size__default-xs {
15114
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-xs, 1.5rem));
15114
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-xs, 1.5rem));
15115
15115
  }
15116
15116
 
15117
15117
  .cds--layout-constraint--size__min-xs {
15118
- --cds-layout-size-height-min:var(--cds-layout-size-height-xs, 1.5rem);
15118
+ --cds-layout-size-height-min: var(--cds-layout-size-height-xs, 1.5rem);
15119
15119
  }
15120
15120
 
15121
15121
  .cds--layout-constraint--size__max-xs {
15122
- --cds-layout-size-height-max:var(--cds-layout-size-height-xs, 1.5rem);
15122
+ --cds-layout-size-height-max: var(--cds-layout-size-height-xs, 1.5rem);
15123
15123
  }
15124
15124
 
15125
15125
  .cds--layout--size-sm {
15126
- --cds-layout-size-height-context:var(--cds-layout-size-height-sm, 2rem);
15127
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15126
+ --cds-layout-size-height-context: var(--cds-layout-size-height-sm, 2rem);
15127
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15128
15128
  }
15129
15129
 
15130
15130
  .cds--layout-constraint--size__default-sm {
15131
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-sm, 2rem));
15131
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-sm, 2rem));
15132
15132
  }
15133
15133
 
15134
15134
  .cds--layout-constraint--size__min-sm {
15135
- --cds-layout-size-height-min:var(--cds-layout-size-height-sm, 2rem);
15135
+ --cds-layout-size-height-min: var(--cds-layout-size-height-sm, 2rem);
15136
15136
  }
15137
15137
 
15138
15138
  .cds--layout-constraint--size__max-sm {
15139
- --cds-layout-size-height-max:var(--cds-layout-size-height-sm, 2rem);
15139
+ --cds-layout-size-height-max: var(--cds-layout-size-height-sm, 2rem);
15140
15140
  }
15141
15141
 
15142
15142
  .cds--layout--size-md {
15143
- --cds-layout-size-height-context:var(--cds-layout-size-height-md, 2.5rem);
15144
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15143
+ --cds-layout-size-height-context: var(--cds-layout-size-height-md, 2.5rem);
15144
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15145
15145
  }
15146
15146
 
15147
15147
  .cds--layout-constraint--size__default-md {
15148
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-md, 2.5rem));
15148
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-md, 2.5rem));
15149
15149
  }
15150
15150
 
15151
15151
  .cds--layout-constraint--size__min-md {
15152
- --cds-layout-size-height-min:var(--cds-layout-size-height-md, 2.5rem);
15152
+ --cds-layout-size-height-min: var(--cds-layout-size-height-md, 2.5rem);
15153
15153
  }
15154
15154
 
15155
15155
  .cds--layout-constraint--size__max-md {
15156
- --cds-layout-size-height-max:var(--cds-layout-size-height-md, 2.5rem);
15156
+ --cds-layout-size-height-max: var(--cds-layout-size-height-md, 2.5rem);
15157
15157
  }
15158
15158
 
15159
15159
  .cds--layout--size-lg {
15160
- --cds-layout-size-height-context:var(--cds-layout-size-height-lg, 3rem);
15161
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15160
+ --cds-layout-size-height-context: var(--cds-layout-size-height-lg, 3rem);
15161
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15162
15162
  }
15163
15163
 
15164
15164
  .cds--layout-constraint--size__default-lg {
15165
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-lg, 3rem));
15165
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-lg, 3rem));
15166
15166
  }
15167
15167
 
15168
15168
  .cds--layout-constraint--size__min-lg {
15169
- --cds-layout-size-height-min:var(--cds-layout-size-height-lg, 3rem);
15169
+ --cds-layout-size-height-min: var(--cds-layout-size-height-lg, 3rem);
15170
15170
  }
15171
15171
 
15172
15172
  .cds--layout-constraint--size__max-lg {
15173
- --cds-layout-size-height-max:var(--cds-layout-size-height-lg, 3rem);
15173
+ --cds-layout-size-height-max: var(--cds-layout-size-height-lg, 3rem);
15174
15174
  }
15175
15175
 
15176
15176
  .cds--layout--size-xl {
15177
- --cds-layout-size-height-context:var(--cds-layout-size-height-xl, 4rem);
15178
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15177
+ --cds-layout-size-height-context: var(--cds-layout-size-height-xl, 4rem);
15178
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15179
15179
  }
15180
15180
 
15181
15181
  .cds--layout-constraint--size__default-xl {
15182
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-xl, 4rem));
15182
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-xl, 4rem));
15183
15183
  }
15184
15184
 
15185
15185
  .cds--layout-constraint--size__min-xl {
15186
- --cds-layout-size-height-min:var(--cds-layout-size-height-xl, 4rem);
15186
+ --cds-layout-size-height-min: var(--cds-layout-size-height-xl, 4rem);
15187
15187
  }
15188
15188
 
15189
15189
  .cds--layout-constraint--size__max-xl {
15190
- --cds-layout-size-height-max:var(--cds-layout-size-height-xl, 4rem);
15190
+ --cds-layout-size-height-max: var(--cds-layout-size-height-xl, 4rem);
15191
15191
  }
15192
15192
 
15193
15193
  .cds--layout--size-2xl {
15194
- --cds-layout-size-height-context:var(--cds-layout-size-height-2xl, 5rem);
15195
- --cds-layout-size-height:var(--cds-layout-size-height-context);
15194
+ --cds-layout-size-height-context: var(--cds-layout-size-height-2xl, 5rem);
15195
+ --cds-layout-size-height: var(--cds-layout-size-height-context);
15196
15196
  }
15197
15197
 
15198
15198
  .cds--layout-constraint--size__default-2xl {
15199
- --cds-layout-size-height:var(--cds-layout-size-height-context, var(--cds-layout-size-height-2xl, 5rem));
15199
+ --cds-layout-size-height: var(--cds-layout-size-height-context, var(--cds-layout-size-height-2xl, 5rem));
15200
15200
  }
15201
15201
 
15202
15202
  .cds--layout-constraint--size__min-2xl {
15203
- --cds-layout-size-height-min:var(--cds-layout-size-height-2xl, 5rem);
15203
+ --cds-layout-size-height-min: var(--cds-layout-size-height-2xl, 5rem);
15204
15204
  }
15205
15205
 
15206
15206
  .cds--layout-constraint--size__max-2xl {
15207
- --cds-layout-size-height-max:var(--cds-layout-size-height-2xl, 5rem);
15207
+ --cds-layout-size-height-max: var(--cds-layout-size-height-2xl, 5rem);
15208
15208
  }
15209
15209
 
15210
15210
  .cds--layout--density-condensed {
15211
- --cds-layout-density-padding-inline-context:var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15212
- --cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context);
15211
+ --cds-layout-density-padding-inline-context: var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15212
+ --cds-layout-density-padding-inline: var(--cds-layout-density-padding-inline-context);
15213
15213
  }
15214
15214
 
15215
15215
  .cds--layout-constraint--density__default-condensed {
15216
- --cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context, var(--cds-layout-density-padding-inline-condensed, 0.5rem));
15216
+ --cds-layout-density-padding-inline: var(--cds-layout-density-padding-inline-context, var(--cds-layout-density-padding-inline-condensed, 0.5rem));
15217
15217
  }
15218
15218
 
15219
15219
  .cds--layout-constraint--density__min-condensed {
15220
- --cds-layout-density-padding-inline-min:var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15220
+ --cds-layout-density-padding-inline-min: var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15221
15221
  }
15222
15222
 
15223
15223
  .cds--layout-constraint--density__max-condensed {
15224
- --cds-layout-density-padding-inline-max:var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15224
+ --cds-layout-density-padding-inline-max: var(--cds-layout-density-padding-inline-condensed, 0.5rem);
15225
15225
  }
15226
15226
 
15227
15227
  .cds--layout--density-normal {
15228
- --cds-layout-density-padding-inline-context:var(--cds-layout-density-padding-inline-normal, 1rem);
15229
- --cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context);
15228
+ --cds-layout-density-padding-inline-context: var(--cds-layout-density-padding-inline-normal, 1rem);
15229
+ --cds-layout-density-padding-inline: var(--cds-layout-density-padding-inline-context);
15230
15230
  }
15231
15231
 
15232
15232
  .cds--layout-constraint--density__default-normal {
15233
- --cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context, var(--cds-layout-density-padding-inline-normal, 1rem));
15233
+ --cds-layout-density-padding-inline: var(--cds-layout-density-padding-inline-context, var(--cds-layout-density-padding-inline-normal, 1rem));
15234
15234
  }
15235
15235
 
15236
15236
  .cds--layout-constraint--density__min-normal {
15237
- --cds-layout-density-padding-inline-min:var(--cds-layout-density-padding-inline-normal, 1rem);
15237
+ --cds-layout-density-padding-inline-min: var(--cds-layout-density-padding-inline-normal, 1rem);
15238
15238
  }
15239
15239
 
15240
15240
  .cds--layout-constraint--density__max-normal {
15241
- --cds-layout-density-padding-inline-max:var(--cds-layout-density-padding-inline-normal, 1rem);
15241
+ --cds-layout-density-padding-inline-max: var(--cds-layout-density-padding-inline-normal, 1rem);
15242
15242
  }
15243
15243
 
15244
15244
  :root {
15245
- --cds-layout-size-height-xs:1.5rem;
15246
- --cds-layout-size-height-sm:2rem;
15247
- --cds-layout-size-height-md:2.5rem;
15248
- --cds-layout-size-height-lg:3rem;
15249
- --cds-layout-size-height-xl:4rem;
15250
- --cds-layout-size-height-2xl:5rem;
15251
- --cds-layout-size-height-min:0px;
15252
- --cds-layout-size-height-max:999999999px;
15253
- --cds-layout-density-padding-inline-condensed:0.5rem;
15254
- --cds-layout-density-padding-inline-normal:1rem;
15255
- --cds-layout-density-padding-inline-min:0px;
15256
- --cds-layout-density-padding-inline-max:999999999px;
15245
+ --cds-layout-size-height-xs: 1.5rem;
15246
+ --cds-layout-size-height-sm: 2rem;
15247
+ --cds-layout-size-height-md: 2.5rem;
15248
+ --cds-layout-size-height-lg: 3rem;
15249
+ --cds-layout-size-height-xl: 4rem;
15250
+ --cds-layout-size-height-2xl: 5rem;
15251
+ --cds-layout-size-height-min: 0px;
15252
+ --cds-layout-size-height-max: 999999999px;
15253
+ --cds-layout-density-padding-inline-condensed: 0.5rem;
15254
+ --cds-layout-density-padding-inline-normal: 1rem;
15255
+ --cds-layout-density-padding-inline-min: 0px;
15256
+ --cds-layout-density-padding-inline-max: 999999999px;
15257
15257
  }
15258
15258
 
15259
15259
  .c4p--action-set {