@carbon/styles 1.53.0 → 1.53.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/css/styles.css CHANGED
@@ -2762,21 +2762,22 @@ em {
2762
2762
  --cds-ai-aura-end: rgba(255, 255, 255, 0);
2763
2763
  --cds-ai-aura-hover-background: #edf5ff;
2764
2764
  --cds-ai-aura-hover-end: rgba(255, 255, 255, 0);
2765
- --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
2765
+ --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.32);
2766
2766
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
2767
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
2768
- --cds-ai-border-end: #d0e2ff;
2769
- --cds-ai-border-start: #78a9ff;
2767
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
2768
+ --cds-ai-border-end: #78a9ff;
2769
+ --cds-ai-border-start: rgba(166, 200, 255, 0.64);
2770
2770
  --cds-ai-border-strong: #4589ff;
2771
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
2772
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
2771
+ --cds-ai-drop-shadow: rgba(15, 98, 254, 0.1);
2772
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.1);
2773
2773
  --cds-ai-overlay: rgba(0, 17, 65, 0.5);
2774
- --cds-ai-popover-caret-bottom: #d0e2ff;
2775
- --cds-ai-popover-caret-bottom-background: #d5e5ff;
2776
- --cds-ai-popover-caret-bottom-background-actions: #dae5f8;
2777
- --cds-ai-popover-caret-center: #a7c7ff;
2778
- --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.25);
2779
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.1);
2774
+ --cds-ai-popover-background: #ffffff;
2775
+ --cds-ai-popover-caret-bottom: #78a9ff;
2776
+ --cds-ai-popover-caret-bottom-background: #eaf1ff;
2777
+ --cds-ai-popover-caret-bottom-background-actions: #e9effa;
2778
+ --cds-ai-popover-caret-center: #a0c3ff;
2779
+ --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.06);
2780
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.04);
2780
2781
  --cds-ai-skeleton-background: #d0e2ff;
2781
2782
  --cds-ai-skeleton-element-background: #4589ff;
2782
2783
  --cds-background: #ffffff;
@@ -2807,7 +2808,7 @@ em {
2807
2808
  --cds-chat-avatar-bot: #6f6f6f;
2808
2809
  --cds-chat-avatar-user: #0f62fe;
2809
2810
  --cds-chat-bubble-agent: #ffffff;
2810
- --cds-chat-bubble-agent-border: #e0e0e0;
2811
+ --cds-chat-bubble-border: #e0e0e0;
2811
2812
  --cds-chat-bubble-user: #e0e0e0;
2812
2813
  --cds-chat-button: #0f62fe;
2813
2814
  --cds-chat-button-active: rgba(141, 141, 141, 0.5);
@@ -2875,9 +2876,6 @@ em {
2875
2876
  --cds-shadow: rgba(0, 0, 0, 0.3);
2876
2877
  --cds-skeleton-background: #e8e8e8;
2877
2878
  --cds-skeleton-element: #c6c6c6;
2878
- --cds-slug-background: #525252;
2879
- --cds-slug-background-hover: #6f6f6f;
2880
- --cds-slug-hollow-hover: #474747;
2881
2879
  --cds-support-caution-major: #ff832b;
2882
2880
  --cds-support-caution-minor: #f1c21b;
2883
2881
  --cds-support-caution-undefined: #8a3ffc;
@@ -2986,21 +2984,22 @@ em {
2986
2984
  --cds-ai-aura-end: rgba(255, 255, 255, 0);
2987
2985
  --cds-ai-aura-hover-background: #edf5ff;
2988
2986
  --cds-ai-aura-hover-end: rgba(255, 255, 255, 0);
2989
- --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
2987
+ --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.32);
2990
2988
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
2991
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
2992
- --cds-ai-border-end: #d0e2ff;
2993
- --cds-ai-border-start: #78a9ff;
2989
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
2990
+ --cds-ai-border-end: #78a9ff;
2991
+ --cds-ai-border-start: rgba(166, 200, 255, 0.64);
2994
2992
  --cds-ai-border-strong: #4589ff;
2995
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
2996
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
2993
+ --cds-ai-drop-shadow: rgba(15, 98, 254, 0.1);
2994
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.1);
2997
2995
  --cds-ai-overlay: rgba(0, 17, 65, 0.5);
2998
- --cds-ai-popover-caret-bottom: #d0e2ff;
2999
- --cds-ai-popover-caret-bottom-background: #ccdbf8;
3000
- --cds-ai-popover-caret-bottom-background-actions: #d2dcee;
3001
- --cds-ai-popover-caret-center: #a7c7ff;
3002
- --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.25);
3003
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.1);
2996
+ --cds-ai-popover-background: #ffffff;
2997
+ --cds-ai-popover-caret-bottom: #78a9ff;
2998
+ --cds-ai-popover-caret-bottom-background: #eaf1ff;
2999
+ --cds-ai-popover-caret-bottom-background-actions: #e9effa;
3000
+ --cds-ai-popover-caret-center: #a0c3ff;
3001
+ --cds-ai-popover-shadow-outer-01: rgba(0, 67, 206, 0.06);
3002
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.04);
3004
3003
  --cds-ai-skeleton-background: #d0e2ff;
3005
3004
  --cds-ai-skeleton-element-background: #4589ff;
3006
3005
  --cds-background: #f4f4f4;
@@ -3031,7 +3030,7 @@ em {
3031
3030
  --cds-chat-avatar-bot: #6f6f6f;
3032
3031
  --cds-chat-avatar-user: #0f62fe;
3033
3032
  --cds-chat-bubble-agent: #ffffff;
3034
- --cds-chat-bubble-agent-border: #e0e0e0;
3033
+ --cds-chat-bubble-border: #e0e0e0;
3035
3034
  --cds-chat-bubble-user: #e0e0e0;
3036
3035
  --cds-chat-button: #0f62fe;
3037
3036
  --cds-chat-button-active: rgba(141, 141, 141, 0.5);
@@ -3099,9 +3098,6 @@ em {
3099
3098
  --cds-shadow: rgba(0, 0, 0, 0.3);
3100
3099
  --cds-skeleton-background: #e8e8e8;
3101
3100
  --cds-skeleton-element: #c6c6c6;
3102
- --cds-slug-background: #525252;
3103
- --cds-slug-background-hover: #6f6f6f;
3104
- --cds-slug-hollow-hover: #474747;
3105
3101
  --cds-support-caution-major: #ff832b;
3106
3102
  --cds-support-caution-minor: #f1c21b;
3107
3103
  --cds-support-caution-undefined: #8a3ffc;
@@ -3212,21 +3208,22 @@ em {
3212
3208
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
3213
3209
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
3214
3210
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
3215
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
3216
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
3217
- --cds-ai-border-start: #4589ff;
3211
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
3212
+ --cds-ai-border-end: #4589ff;
3213
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
3218
3214
  --cds-ai-border-strong: #78a9ff;
3219
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
3220
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
3221
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
3222
- --cds-ai-popover-caret-bottom: #465060;
3223
- --cds-ai-popover-caret-bottom-background: #2d3f5c;
3224
- --cds-ai-popover-caret-bottom-background-actions: #253042;
3225
- --cds-ai-popover-caret-center: #456fb5;
3226
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
3227
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
3228
- --cds-ai-skeleton-background: #a6c8ff;
3229
- --cds-ai-skeleton-element-background: #002d9c;
3215
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
3216
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
3217
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
3218
+ --cds-ai-popover-background: #161616;
3219
+ --cds-ai-popover-caret-bottom: #4589ff;
3220
+ --cds-ai-popover-caret-bottom-background: #202d45;
3221
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
3222
+ --cds-ai-popover-caret-center: #4870b5;
3223
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
3224
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
3225
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
3226
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
3230
3227
  --cds-background: #262626;
3231
3228
  --cds-background-active: rgba(141, 141, 141, 0.4);
3232
3229
  --cds-background-brand: #0f62fe;
@@ -3255,7 +3252,7 @@ em {
3255
3252
  --cds-chat-avatar-bot: #8d8d8d;
3256
3253
  --cds-chat-avatar-user: #4589ff;
3257
3254
  --cds-chat-bubble-agent: #262626;
3258
- --cds-chat-bubble-agent-border: #525252;
3255
+ --cds-chat-bubble-border: #525252;
3259
3256
  --cds-chat-bubble-user: #393939;
3260
3257
  --cds-chat-button: #78a9ff;
3261
3258
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -3323,9 +3320,6 @@ em {
3323
3320
  --cds-shadow: rgba(0, 0, 0, 0.8);
3324
3321
  --cds-skeleton-background: #333333;
3325
3322
  --cds-skeleton-element: #525252;
3326
- --cds-slug-background: #c6c6c6;
3327
- --cds-slug-background-hover: #e0e0e0;
3328
- --cds-slug-hollow-hover: #b5b5b5;
3329
3323
  --cds-support-caution-major: #ff832b;
3330
3324
  --cds-support-caution-minor: #f1c21b;
3331
3325
  --cds-support-caution-undefined: #a56eff;
@@ -3435,21 +3429,22 @@ em {
3435
3429
  --cds-ai-aura-hover-end: rgba(0, 0, 0, 0);
3436
3430
  --cds-ai-aura-hover-start: rgba(69, 137, 255, 0.4);
3437
3431
  --cds-ai-aura-start: rgba(69, 137, 255, 0.1);
3438
- --cds-ai-aura-start-table: rgba(69, 137, 255, 0.15);
3439
- --cds-ai-border-end: rgba(166, 200, 255, 0.24);
3440
- --cds-ai-border-start: #4589ff;
3432
+ --cds-ai-aura-start-sm: rgba(69, 137, 255, 0.16);
3433
+ --cds-ai-border-end: #4589ff;
3434
+ --cds-ai-border-start: rgba(166, 200, 255, 0.36);
3441
3435
  --cds-ai-border-strong: #78a9ff;
3442
- --cds-ai-drop-shadow: rgba(15, 98, 254, 0.32);
3443
- --cds-ai-inner-shadow: rgba(69, 137, 255, 0.2);
3444
- --cds-ai-overlay: rgba(0, 17, 65, 0.5);
3445
- --cds-ai-popover-caret-bottom: #3d4655;
3446
- --cds-ai-popover-caret-bottom-background: #213250;
3447
- --cds-ai-popover-caret-bottom-background-actions: #192436;
3448
- --cds-ai-popover-caret-center: #3f68af;
3449
- --cds-ai-popover-shadow-outer-01: rgba(0, 45, 156, 0.25);
3450
- --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.65);
3451
- --cds-ai-skeleton-background: #a6c8ff;
3452
- --cds-ai-skeleton-element-background: #002d9c;
3436
+ --cds-ai-drop-shadow: rgba(0, 0, 0, 0.28);
3437
+ --cds-ai-inner-shadow: rgba(69, 137, 255, 0.16);
3438
+ --cds-ai-overlay: rgba(0, 0, 0, 0.5);
3439
+ --cds-ai-popover-background: #161616;
3440
+ --cds-ai-popover-caret-bottom: #4589ff;
3441
+ --cds-ai-popover-caret-bottom-background: #202d45;
3442
+ --cds-ai-popover-caret-bottom-background-actions: #1e283a;
3443
+ --cds-ai-popover-caret-center: #4870b5;
3444
+ --cds-ai-popover-shadow-outer-01: rgba(0, 0, 0, 0.12);
3445
+ --cds-ai-popover-shadow-outer-02: rgba(0, 0, 0, 0.08);
3446
+ --cds-ai-skeleton-background: rgba(120, 169, 255, 0.5);
3447
+ --cds-ai-skeleton-element-background: rgba(120, 169, 255, 0.3);
3453
3448
  --cds-background: #161616;
3454
3449
  --cds-background-active: rgba(141, 141, 141, 0.4);
3455
3450
  --cds-background-brand: #0f62fe;
@@ -3478,7 +3473,7 @@ em {
3478
3473
  --cds-chat-avatar-bot: #8d8d8d;
3479
3474
  --cds-chat-avatar-user: #4589ff;
3480
3475
  --cds-chat-bubble-agent: #262626;
3481
- --cds-chat-bubble-agent-border: #525252;
3476
+ --cds-chat-bubble-border: #525252;
3482
3477
  --cds-chat-bubble-user: #393939;
3483
3478
  --cds-chat-button: #78a9ff;
3484
3479
  --cds-chat-button-active: rgba(141, 141, 141, 0.4);
@@ -3546,9 +3541,6 @@ em {
3546
3541
  --cds-shadow: rgba(0, 0, 0, 0.8);
3547
3542
  --cds-skeleton-background: #292929;
3548
3543
  --cds-skeleton-element: #393939;
3549
- --cds-slug-background: #c6c6c6;
3550
- --cds-slug-background-hover: #e0e0e0;
3551
- --cds-slug-hollow-hover: #b5b5b5;
3552
3544
  --cds-support-caution-major: #ff832b;
3553
3545
  --cds-support-caution-minor: #f1c21b;
3554
3546
  --cds-support-caution-undefined: #a56eff;
@@ -7698,7 +7690,7 @@ fieldset[disabled] .cds--form__helper-text {
7698
7690
  }
7699
7691
 
7700
7692
  .cds--text-input__field-wrapper--slug .cds--text-input:not(:has(~ .cds--slug--revert)) {
7701
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
7693
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
7702
7694
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
7703
7695
  padding-inline-end: 2.5rem;
7704
7696
  }
@@ -9087,7 +9079,7 @@ fieldset[disabled] .cds--form__helper-text {
9087
9079
  }
9088
9080
 
9089
9081
  .cds--list-box__wrapper--slug .cds--list-box:not(:has(.cds--slug--revert)) {
9090
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
9082
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
9091
9083
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
9092
9084
  }
9093
9085
 
@@ -11018,7 +11010,7 @@ tr.cds--data-table--selected:last-of-type td {
11018
11010
 
11019
11011
  tr.cds--data-table--slug-row,
11020
11012
  tr.cds--data-table--slug-row + .cds--expandable-row {
11021
- background: linear-gradient(to right, var(--cds-ai-aura-start-table, rgba(69, 137, 255, 0.15)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
11013
+ background: linear-gradient(to right, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
11022
11014
  background-attachment: fixed;
11023
11015
  }
11024
11016
 
@@ -11045,14 +11037,14 @@ tr.cds--data-table--slug-row:hover + .cds--expandable-row[data-child-row],
11045
11037
  tr.cds--expandable-row--hover + .cds--expandable-row[data-child-row]:hover,
11046
11038
  tr.cds--expandable-row--hover.cds--data-table--slug-row,
11047
11039
  tr.cds--data-table--selected.cds--parent-row.cds--expandable-row--hover.cds--data-table--slug-row {
11048
- background: linear-gradient(to right, var(--cds-ai-aura-hover-start, rgba(69, 137, 255, 0.4)) 0%, 15%, var(--cds-ai-aura-hover-end, rgba(255, 255, 255, 0)) 50%), var(--cds-ai-aura-hover-background, #edf5ff);
11040
+ background: linear-gradient(to right, var(--cds-ai-aura-hover-start, rgba(69, 137, 255, 0.32)) 0%, 15%, var(--cds-ai-aura-hover-end, rgba(255, 255, 255, 0)) 50%), var(--cds-ai-aura-hover-background, #edf5ff);
11049
11041
  background-attachment: fixed;
11050
11042
  }
11051
11043
 
11052
11044
  tr.cds--parent-row.cds--data-table--selected.cds--data-table--slug-row,
11053
11045
  .cds--data-table--selected.cds--data-table--slug-row,
11054
11046
  tr.cds--data-table--selected.cds--data-table--slug-row + .cds--expandable-row {
11055
- background: linear-gradient(to right, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%), var(--cds-layer-selected);
11047
+ background: linear-gradient(to right, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%), var(--cds-layer-selected);
11056
11048
  background-attachment: fixed;
11057
11049
  }
11058
11050
 
@@ -11073,7 +11065,7 @@ tr.cds--parent-row.cds--data-table--slug-row.cds--expandable-row:hover td:first-
11073
11065
 
11074
11066
  .cds--data-table thead th.cds--table-sort__header--slug .cds--table-sort,
11075
11067
  .cds--data-table thead th:has(> .cds--table-header-label--slug) {
11076
- background: linear-gradient(to right, var(--cds-ai-aura-start-table, rgba(69, 137, 255, 0.15)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
11068
+ background: linear-gradient(to right, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
11077
11069
  }
11078
11070
 
11079
11071
  .cds--table-column-slug .cds--slug {
@@ -11101,11 +11093,11 @@ th:has(.cds--table-header-label--slug) {
11101
11093
  }
11102
11094
 
11103
11095
  td.cds--table-cell--column-slug {
11104
- background: linear-gradient(to right, var(--cds-ai-aura-start-table, rgba(69, 137, 255, 0.15)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
11096
+ background: linear-gradient(to right, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
11105
11097
  }
11106
11098
 
11107
11099
  tr.cds--parent-row:not(.cds--expandable-row):not(:first-of-type) td.cds--table-cell--column-slug {
11108
- border-block-start: linear-gradient(to right, var(--cds-ai-aura-start-table, rgba(69, 137, 255, 0.15)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
11100
+ border-block-start: linear-gradient(to right, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 50%);
11109
11101
  }
11110
11102
 
11111
11103
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
@@ -13615,7 +13607,7 @@ th .cds--table-sort__flex {
13615
13607
  }
13616
13608
 
13617
13609
  .cds--date-picker-input__wrapper--slug .cds--date-picker__input:not(:has(~ .cds--slug--revert)) {
13618
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
13610
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
13619
13611
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
13620
13612
  padding-inline-end: 4rem;
13621
13613
  }
@@ -15368,7 +15360,7 @@ button.cds--dropdown-text:focus {
15368
15360
  }
15369
15361
 
15370
15362
  .cds--date-picker--fluid .cds--date-picker-input__wrapper--slug:not(:has(~ .cds--slug--revert)) {
15371
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
15363
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
15372
15364
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
15373
15365
  }
15374
15366
 
@@ -15930,7 +15922,7 @@ button.cds--dropdown-text:focus {
15930
15922
 
15931
15923
  .cds--number__input-wrapper--slug input[type=number]:not(:has(~ .cds--slug--revert)),
15932
15924
  .cds--number__input-wrapper--slug input[type=number]:disabled {
15933
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
15925
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
15934
15926
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
15935
15927
  padding-inline-end: 7rem;
15936
15928
  }
@@ -16191,7 +16183,7 @@ button.cds--dropdown-text:focus {
16191
16183
  }
16192
16184
 
16193
16185
  .cds--number-input--fluid .cds--number__input-wrapper--slug:not(:has(~ .cds--slug--revert)) {
16194
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
16186
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
16195
16187
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
16196
16188
  }
16197
16189
 
@@ -16561,7 +16553,7 @@ optgroup.cds--select-optgroup:disabled,
16561
16553
  }
16562
16554
 
16563
16555
  .cds--select--slug .cds--select-input:not(:has(~ .cds--slug--revert)) {
16564
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
16556
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
16565
16557
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
16566
16558
  padding-inline-end: 4rem;
16567
16559
  }
@@ -16873,7 +16865,7 @@ optgroup.cds--select-optgroup:disabled,
16873
16865
  }
16874
16866
 
16875
16867
  .cds--text-area__wrapper--slug .cds--text-area:not(:has(~ .cds--slug--revert)) {
16876
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
16868
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
16877
16869
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
16878
16870
  padding-inline-end: 2.5rem;
16879
16871
  }
@@ -17099,7 +17091,7 @@ optgroup.cds--select-optgroup:disabled,
17099
17091
  }
17100
17092
 
17101
17093
  .cds--text-area--fluid .cds--text-area__wrapper--slug:not(:has(~ .cds--slug--revert)) {
17102
- background-image: linear-gradient(0deg, var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
17094
+ background-image: linear-gradient(0deg, var(--cds-ai-aura-start-sm, rgba(69, 137, 255, 0.16)) 0%, 15%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%, transparent 100%);
17103
17095
  border-block-end-color: var(--cds-ai-border-strong, #4589ff);
17104
17096
  }
17105
17097
 
@@ -18046,15 +18038,15 @@ optgroup.cds--select-optgroup:disabled,
18046
18038
  }
18047
18039
 
18048
18040
  .cds--modal--slug .cds--modal-container {
18049
- background: linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) border-box;
18041
+ background: linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, rgba(166, 200, 255, 0.64)), var(--cds-ai-border-end, #78a9ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) border-box;
18050
18042
  border: 1px solid transparent;
18051
18043
  background-color: var(--cds-layer);
18052
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)), 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.32));
18044
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1)), 0 24px 40px -24px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
18053
18045
  }
18054
18046
 
18055
18047
  .cds--modal--slug .cds--modal-container:has(.cds--modal-footer) {
18056
- background: linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)) calc(0% + 64px), var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) calc(0% + 64px), var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) border-box;
18057
- box-shadow: inset 0 -80px 0 -16px var(--cds-layer), inset 0 -160px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)), 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.32));
18048
+ background: linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)) calc(0% + 64px), var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) calc(0% + 64px), var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, rgba(166, 200, 255, 0.64)), var(--cds-ai-border-end, #78a9ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) border-box;
18049
+ box-shadow: inset 0 -80px 0 -16px var(--cds-layer), inset 0 -160px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1)), 0 24px 40px -24px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
18058
18050
  }
18059
18051
 
18060
18052
  .cds--modal--slug .cds--slug {
@@ -21043,142 +21035,85 @@ span.cds--pagination__text.cds--pagination__items-count {
21043
21035
  display: flex;
21044
21036
  align-items: center;
21045
21037
  justify-content: center;
21046
- color: var(--cds-text-inverse, #ffffff);
21038
+ border: 1px solid var(--cds-border-inverse, #161616);
21039
+ background: transparent;
21040
+ color: var(--cds-text-primary, #161616);
21047
21041
  font-weight: 600;
21048
- transition: color 70ms cubic-bezier(0, 0, 0.38, 0.9), border-color 70ms cubic-bezier(0, 0, 0.38, 0.9), box-shadow 70ms cubic-bezier(0, 0, 0.38, 0.9);
21042
+ outline: none;
21043
+ transition: color 70ms cubic-bezier(0, 0, 0.38, 0.9), border-color 70ms cubic-bezier(0, 0, 0.38, 0.9), box-shadow 70ms cubic-bezier(0, 0, 0.38, 0.9), background 70ms cubic-bezier(0, 0, 0.38, 0.9);
21049
21044
  }
21050
21045
  .cds--slug .cds--slug__button--mini {
21051
21046
  height: 1rem;
21052
21047
  width: 1rem;
21053
21048
  font-size: 0.5625rem;
21054
21049
  line-height: 0.75rem;
21055
- background: var(--cds-slug-background, #525252);
21056
21050
  }
21057
21051
  .cds--slug .cds--slug__button--2xs {
21058
21052
  height: 1.25rem;
21059
21053
  width: 1.25rem;
21060
21054
  font-size: 0.75rem;
21061
21055
  line-height: 1rem;
21062
- background: var(--cds-slug-background, #525252);
21063
21056
  }
21064
21057
  .cds--slug .cds--slug__button--xs {
21065
21058
  height: 1.5rem;
21066
21059
  width: 1.5rem;
21067
21060
  font-size: 0.75rem;
21068
21061
  line-height: 1rem;
21069
- background: var(--cds-slug-gradient, #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%));
21070
21062
  }
21071
21063
  .cds--slug .cds--slug__button--sm {
21072
21064
  height: 2rem;
21073
21065
  width: 2rem;
21074
21066
  font-size: 1rem;
21075
21067
  line-height: 1.3125rem;
21076
- background: var(--cds-slug-gradient, #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%));
21077
21068
  }
21078
21069
  .cds--slug .cds--slug__button--md {
21079
21070
  height: 2.5rem;
21080
21071
  width: 2.5rem;
21081
21072
  font-size: 1rem;
21082
21073
  line-height: 1.3125rem;
21083
- background: var(--cds-slug-gradient, #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%));
21084
21074
  }
21085
21075
  .cds--slug .cds--slug__button--lg {
21086
21076
  height: 3rem;
21087
21077
  width: 3rem;
21088
21078
  font-size: 1rem;
21089
21079
  line-height: 1.3125rem;
21090
- background: var(--cds-slug-gradient, #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%));
21091
21080
  }
21092
21081
  .cds--slug .cds--slug__button--xl {
21093
21082
  height: 4rem;
21094
21083
  width: 4rem;
21095
21084
  font-size: 1.25rem;
21096
21085
  line-height: 1.625rem;
21097
- background: var(--cds-slug-gradient, #161616 linear-gradient(135deg, #a8a8a8 0%, rgba(255, 255, 255, 0) 100%));
21098
21086
  }
21099
21087
 
21100
21088
  .cds--slug .cds--slug__button:focus {
21101
- box-shadow: inset 0 0 0 2px var(--cds-focus, #0f62fe), inset 0 0 0 3px var(--cds-focus-inset, #ffffff);
21102
- outline: none;
21103
- }
21104
-
21105
- .cds--slug__text {
21106
- position: relative;
21107
- z-index: 1;
21108
- }
21109
-
21110
- .cds--slug__button::before {
21111
- position: absolute;
21112
- background: var(--cds-slug-gradient-hover, #161616 linear-gradient(135deg, #d1d1d1 0%, rgba(255, 255, 255, 0) 100%));
21113
- block-size: 100%;
21114
- content: "";
21115
- inline-size: 100%;
21116
- opacity: 0;
21117
- transition: opacity 70ms cubic-bezier(0, 0, 0.38, 0.9);
21118
- }
21119
-
21120
- .cds--slug__button.cds--slug__button--mini::after,
21121
- .cds--slug__button.cds--slug__button--2xs::after {
21122
- position: absolute;
21123
- block-size: 1.5rem;
21124
- content: "";
21125
- inline-size: 1.5rem;
21126
- opacity: 0;
21127
- }
21128
-
21129
- .cds--slug__button:hover::before {
21130
- opacity: 1;
21089
+ border: 1px solid var(--cds-focus, #0f62fe);
21090
+ box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe);
21131
21091
  }
21132
21092
 
21133
- .cds--slug .cds--slug__button:focus::before {
21134
- block-size: calc(100% - 6px);
21135
- inline-size: calc(100% - 6px);
21093
+ .cds--slug .cds--slug__button.cds--slug__button--mini:focus,
21094
+ .cds--slug .cds--slug__button.cds--slug__button--2xs:focus {
21095
+ box-shadow: none;
21136
21096
  }
21137
21097
 
21138
- .cds--slug__button.cds--slug__button--mini::before,
21139
- .cds--slug__button.cds--slug__button--2xs::before {
21140
- background: var(--cds-slug-background-hover, #6f6f6f);
21098
+ .cds--slug .cds--slug__button:hover {
21099
+ background: var(--cds-border-inverse, #161616);
21100
+ color: var(--cds-text-inverse, #ffffff);
21141
21101
  }
21142
21102
 
21143
- .cds--slug__button.cds--slug__button--mini:focus,
21144
- .cds--slug__button.cds--slug__button--2xs:focus {
21103
+ .cds--slug .cds--slug__button:hover:active {
21104
+ background: var(--cds-border-inverse, #161616);
21145
21105
  box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe), inset 0 0 0 2px var(--cds-focus-inset, #ffffff);
21106
+ color: var(--cds-text-inverse, #ffffff);
21146
21107
  }
21147
21108
 
21148
- .cds--slug__button.cds--slug__button--mini:focus::before,
21149
- .cds--slug__button.cds--slug__button--2xs:focus::before {
21150
- block-size: calc(100% - 4px);
21151
- inline-size: calc(100% - 4px);
21152
- }
21153
-
21154
- .cds--slug__button--hollow.cds--slug__button--sm,
21155
- .cds--slug__button--hollow.cds--slug__button--md,
21156
- .cds--slug__button--hollow.cds--slug__button--lg,
21157
- .cds--slug__button--hollow.cds--slug__button--xl {
21158
- block-size: 1.5rem;
21159
- font-size: 0.75rem;
21160
- inline-size: 1.5rem;
21161
- line-height: 1rem;
21162
- }
21163
-
21164
- .cds--slug__button--hollow::before {
21165
- display: none;
21166
- }
21167
-
21168
- .cds--slug .cds--slug__button--hollow {
21169
- border: 1px solid var(--cds-border-inverse, #161616);
21170
- background: transparent;
21171
- color: var(--cds-text-primary, #161616);
21172
- }
21173
-
21174
- .cds--slug__button--hollow:hover {
21175
- border-color: var(--cds-slug-hollow-hover, #474747);
21176
- color: var(--cds-slug-hollow-hover, #474747);
21109
+ .cds--slug .cds--slug__button.cds--slug__button--mini:hover:active,
21110
+ .cds--slug .cds--slug__button.cds--slug__button--2xs:hover:active {
21111
+ box-shadow: inset 0 0 0 1px var(--cds-focus-inset, #ffffff);
21177
21112
  }
21178
21113
 
21179
- .cds--slug__button--hollow:focus {
21180
- border-color: var(--cds-focus, #0f62fe);
21181
- box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe);
21114
+ .cds--slug__text {
21115
+ position: relative;
21116
+ z-index: 1;
21182
21117
  }
21183
21118
 
21184
21119
  .cds--slug .cds--slug__button--inline {
@@ -21202,8 +21137,11 @@ span.cds--pagination__text.cds--pagination__items-count {
21202
21137
  box-shadow: none;
21203
21138
  }
21204
21139
 
21205
- .cds--slug .cds--slug__button--inline:hover {
21140
+ .cds--slug .cds--slug__button--inline:hover,
21141
+ .cds--slug .cds--slug__button--inline:hover:active {
21206
21142
  border-color: var(--cds-icon-secondary, #525252);
21143
+ background: transparent;
21144
+ box-shadow: none;
21207
21145
  color: var(--cds-text-secondary, #525252);
21208
21146
  }
21209
21147
 
@@ -21215,16 +21153,12 @@ span.cds--pagination__text.cds--pagination__items-count {
21215
21153
  background: var(--cds-icon-secondary, #525252);
21216
21154
  }
21217
21155
 
21218
- .cds--slug--hollow .cds--slug__button--inline:hover .cds--slug__text::before {
21219
- background: transparent;
21220
- box-shadow: inset 0 0 0 1px var(--cds-icon-secondary, #525252);
21221
- }
21222
-
21223
21156
  .cds--slug__button--inline .cds--slug__text {
21224
21157
  padding-inline-start: 0.5rem;
21225
21158
  }
21226
21159
 
21227
- .cds--slug__button--inline.cds--slug__button--lg .cds--slug__text {
21160
+ .cds--slug__button--inline.cds--slug__button--lg .cds--slug__text,
21161
+ .cds--slug__button--inline.cds--slug__button--xl .cds--slug__text {
21228
21162
  padding-inline-start: 0.75rem;
21229
21163
  }
21230
21164
 
@@ -21242,20 +21176,8 @@ span.cds--pagination__text.cds--pagination__items-count {
21242
21176
  transition: background 70ms cubic-bezier(0, 0, 0.38, 0.9), box-shadow 70ms cubic-bezier(0, 0, 0.38, 0.9);
21243
21177
  }
21244
21178
 
21245
- .cds--slug--hollow .cds--slug__text::before {
21246
- background: transparent;
21247
- block-size: 0.375rem;
21248
- box-shadow: inset 0 0 0 1px var(--cds-icon-primary, #161616);
21249
- inline-size: 0.375rem;
21250
- }
21251
-
21252
- .cds--slug--hollow .cds--slug__button--sm .cds--slug__text,
21253
- .cds--slug--hollow .cds--slug__button--md .cds--slug__text {
21254
- padding-inline-start: 0.5625rem;
21255
- }
21256
-
21257
21179
  .cds--slug__button--lg .cds--slug__text::before,
21258
- .cds--slug--hollow .cds--slug__button--lg .cds--slug__text::before {
21180
+ .cds--slug__button--xl .cds--slug__text::before {
21259
21181
  block-size: 0.5rem;
21260
21182
  inline-size: 0.5rem;
21261
21183
  }
@@ -21294,30 +21216,27 @@ span.cds--pagination__text.cds--pagination__items-count {
21294
21216
  font-size: 0.875rem;
21295
21217
  }
21296
21218
 
21297
- .cds--slug .cds--slug__button--inline-with-content:focus {
21219
+ .cds--slug .cds--slug__button--inline-with-content:focus,
21220
+ .cds--slug .cds--slug__button--inline-with-content:hover:focus {
21298
21221
  box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe);
21299
21222
  }
21300
21223
 
21301
- .cds--slug.cds--slug--hollow .cds--toggletip-content {
21302
- row-gap: 0;
21303
- }
21304
-
21305
- .cds--slug.cds--slug--enabled .cds--slug-content {
21306
- background: linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)), var(--cds-background, var(--cds-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-background, var(--cds-background, #ffffff)), var(--cds-background, var(--cds-background, #ffffff))) border-box;
21224
+ .cds--slug .cds--slug-content {
21225
+ background: linear-gradient(to top, var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff)), var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, rgba(166, 200, 255, 0.64)), var(--cds-ai-border-end, #78a9ff)) border-box, linear-gradient(to top, var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff)), var(--cds-ai-popover-background, var(--cds-ai-popover-background, #ffffff))) border-box;
21307
21226
  border: 1px solid transparent;
21308
21227
  border-radius: 0.5rem;
21309
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)), -40px 30px 100px -25px var(--cds-ai-popover-shadow-outer-01, rgba(0, 67, 206, 0.25)), -60px 80px 60px -45px var(--cds-ai-popover-shadow-outer-02, rgba(0, 0, 0, 0.1));
21228
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1)), -40px 44px 60px -24px var(--cds-ai-popover-shadow-outer-01, rgba(0, 67, 206, 0.06)), -56px 64px 64px -24px var(--cds-ai-popover-shadow-outer-02, rgba(0, 0, 0, 0.04));
21310
21229
  color: var(--cds-text-primary, #161616);
21311
21230
  min-inline-size: 17.5rem;
21312
21231
  }
21313
21232
 
21314
- .cds--slug.cds--slug--enabled > .cds--toggletip > .cds--popover > .cds--popover-caret {
21233
+ .cds--slug > .cds--toggletip > .cds--popover > .cds--popover-caret {
21315
21234
  background: transparent;
21316
21235
  -webkit-clip-path: none;
21317
21236
  clip-path: none;
21318
21237
  }
21319
21238
 
21320
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--top,
21239
+ .cds--slug > .cds--toggletip:is(.cds--popover--top,
21321
21240
  .cds--popover--top-right,
21322
21241
  .cds--popover--top-left,
21323
21242
  .cds--popover--bottom,
@@ -21331,7 +21250,7 @@ span.cds--pagination__text.cds--pagination__items-count {
21331
21250
  .cds--popover--right-bottom) > .cds--popover > .cds--popover-caret::before {
21332
21251
  position: absolute;
21333
21252
  display: block;
21334
- border: 1px solid var(--cds-ai-border-start, #78a9ff);
21253
+ border: 1px solid var(--cds-ai-border-start, rgba(166, 200, 255, 0.64));
21335
21254
  background: var(--cds-background, #ffffff);
21336
21255
  block-size: 0.75rem;
21337
21256
  -webkit-clip-path: polygon(98% 0, 0 0, -52% 150%) border-box;
@@ -21341,7 +21260,7 @@ span.cds--pagination__text.cds--pagination__items-count {
21341
21260
  transform: rotate(45deg);
21342
21261
  }
21343
21262
 
21344
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--top,
21263
+ .cds--slug > .cds--toggletip:is(.cds--popover--top,
21345
21264
  .cds--popover--top-right,
21346
21265
  .cds--popover--top-left,
21347
21266
  .cds--popover--bottom,
@@ -21361,16 +21280,16 @@ span.cds--pagination__text.cds--pagination__items-count {
21361
21280
  inline-size: 0.125rem;
21362
21281
  }
21363
21282
 
21364
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--top,
21283
+ .cds--slug > .cds--toggletip:is(.cds--popover--top,
21365
21284
  .cds--popover--top-right,
21366
21285
  .cds--popover--top-left) > .cds--popover > .cds--popover-caret::before {
21367
21286
  inset-block-end: 0.0625rem;
21368
21287
  transform: rotate(-135deg);
21369
21288
  }
21370
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--top,
21289
+ .cds--slug > .cds--toggletip:is(.cds--popover--top,
21371
21290
  .cds--popover--top-right,
21372
21291
  .cds--popover--top-left) > .cds--popover > .cds--popover-caret::after {
21373
- background: var(--cds-ai-popover-caret-bottom-background, #d5e5ff);
21292
+ background: var(--cds-ai-popover-caret-bottom-background, #eaf1ff);
21374
21293
  block-size: 0.125rem;
21375
21294
  border-end-end-radius: 50%;
21376
21295
  border-end-start-radius: 50%;
@@ -21379,19 +21298,19 @@ span.cds--pagination__text.cds--pagination__items-count {
21379
21298
  inset-inline-start: -0.0625rem;
21380
21299
  }
21381
21300
 
21382
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--top,
21301
+ .cds--slug > .cds--toggletip:is(.cds--popover--top,
21383
21302
  .cds--popover--top-right,
21384
21303
  .cds--popover--top-left) > .cds--popover > .cds--slug-content--with-actions + .cds--popover-caret::after {
21385
21304
  display: none;
21386
21305
  }
21387
21306
 
21388
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--right,
21307
+ .cds--slug > .cds--toggletip:is(.cds--popover--right,
21389
21308
  .cds--popover--right-bottom,
21390
21309
  .cds--popover--right-top) > .cds--popover > .cds--popover-caret::before {
21391
21310
  inset-inline-start: 0.0625rem;
21392
21311
  transform: rotate(-45deg);
21393
21312
  }
21394
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--right,
21313
+ .cds--slug > .cds--toggletip:is(.cds--popover--right,
21395
21314
  .cds--popover--right-bottom,
21396
21315
  .cds--popover--right-top) > .cds--popover > .cds--popover-caret::after {
21397
21316
  border-end-start-radius: 50%;
@@ -21400,13 +21319,13 @@ span.cds--pagination__text.cds--pagination__items-count {
21400
21319
  inset-inline-start: 0.375rem;
21401
21320
  }
21402
21321
 
21403
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--bottom,
21322
+ .cds--slug > .cds--toggletip:is(.cds--popover--bottom,
21404
21323
  .cds--popover--bottom-left,
21405
21324
  .cds--popover--bottom-right) > .cds--popover > .cds--popover-caret::before {
21406
21325
  inset-block-start: 0.0625rem;
21407
21326
  transform: rotate(45deg);
21408
21327
  }
21409
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--bottom,
21328
+ .cds--slug > .cds--toggletip:is(.cds--popover--bottom,
21410
21329
  .cds--popover--bottom-left,
21411
21330
  .cds--popover--bottom-right) > .cds--popover > .cds--popover-caret::after {
21412
21331
  block-size: 0.125rem;
@@ -21417,13 +21336,13 @@ span.cds--pagination__text.cds--pagination__items-count {
21417
21336
  inset-inline-start: -0.0625rem;
21418
21337
  }
21419
21338
 
21420
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left,
21339
+ .cds--slug > .cds--toggletip:is(.cds--popover--left,
21421
21340
  .cds--popover--left-bottom,
21422
21341
  .cds--popover--left-top) > .cds--popover > .cds--popover-caret::before {
21423
21342
  inset-inline-end: 0.0625rem;
21424
21343
  transform: rotate(135deg);
21425
21344
  }
21426
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left,
21345
+ .cds--slug > .cds--toggletip:is(.cds--popover--left,
21427
21346
  .cds--popover--left-bottom,
21428
21347
  .cds--popover--left-top) > .cds--popover > .cds--popover-caret::after {
21429
21348
  border-end-end-radius: 50%;
@@ -21432,44 +21351,44 @@ span.cds--pagination__text.cds--pagination__items-count {
21432
21351
  inset-inline-start: -0.125rem;
21433
21352
  }
21434
21353
 
21435
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left-bottom,
21354
+ .cds--slug > .cds--toggletip:is(.cds--popover--left-bottom,
21436
21355
  .cds--popover--right-bottom) > .cds--popover > .cds--popover-caret::after {
21437
21356
  background: transparent;
21438
21357
  }
21439
21358
 
21440
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left-bottom,
21359
+ .cds--slug > .cds--toggletip:is(.cds--popover--left-bottom,
21441
21360
  .cds--popover--right-bottom,
21442
21361
  .cds--popover--top,
21443
21362
  .cds--popover--top-right,
21444
21363
  .cds--popover--top-left) > .cds--popover > .cds--popover-caret::before {
21445
- border-color: var(--cds-ai-popover-caret-bottom, #d0e2ff);
21446
- background: var(--cds-ai-popover-caret-bottom-background, #d5e5ff);
21364
+ border-color: var(--cds-ai-popover-caret-bottom, #78a9ff);
21365
+ background: var(--cds-ai-popover-caret-bottom-background, #eaf1ff);
21447
21366
  }
21448
21367
 
21449
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left-bottom,
21368
+ .cds--slug > .cds--toggletip:is(.cds--popover--left-bottom,
21450
21369
  .cds--popover--right-bottom,
21451
21370
  .cds--popover--top,
21452
21371
  .cds--popover--top-right,
21453
21372
  .cds--popover--top-left) > .cds--popover:has(.cds--slug-content--with-actions) > .cds--popover-caret::before {
21454
- background: var(--cds-ai-popover-caret-bottom-background-actions, #dae5f8);
21373
+ background: var(--cds-ai-popover-caret-bottom-background-actions, #e9effa);
21455
21374
  }
21456
21375
 
21457
- .cds--slug.cds--slug--enabled > .cds--toggletip:is(.cds--popover--left,
21376
+ .cds--slug > .cds--toggletip:is(.cds--popover--left,
21458
21377
  .cds--popover--right) > .cds--popover > .cds--popover-caret::before {
21459
- border-color: var(--cds-ai-popover-caret-center, #a7c7ff);
21378
+ border-color: var(--cds-ai-popover-caret-center, #a0c3ff);
21460
21379
  }
21461
21380
 
21462
- .cds--slug.cds--slug--enabled .cds--toggletip-content {
21381
+ .cds--slug .cds--toggletip-content {
21463
21382
  padding-block-end: 5rem;
21464
21383
  padding-block-start: 1.5rem;
21465
21384
  padding-inline: 1.5rem;
21466
21385
  }
21467
21386
 
21468
- .cds--slug.cds--slug--enabled .cds--slug-content .cds--toggletip-content {
21387
+ .cds--slug .cds--slug-content .cds--toggletip-content {
21469
21388
  max-inline-size: 20rem;
21470
21389
  }
21471
21390
 
21472
- .cds--slug.cds--slug--enabled .cds--slug-actions {
21391
+ .cds--slug .cds--slug-actions {
21473
21392
  position: absolute;
21474
21393
  justify-content: flex-end;
21475
21394
  -webkit-backdrop-filter: blur(85px);
@@ -21484,12 +21403,12 @@ span.cds--pagination__text.cds--pagination__items-count {
21484
21403
  inset-inline-end: 0;
21485
21404
  }
21486
21405
 
21487
- .cds--slug.cds--slug--enabled .cds--slug-actions .cds--btn:focus {
21406
+ .cds--slug .cds--slug-actions .cds--btn:focus {
21488
21407
  border-color: var(--cds-focus, #0f62fe);
21489
21408
  box-shadow: inset 0 0 0 1px var(--cds-focus, #0f62fe), inset 0 0 0 2px var(--cds-background, #ffffff);
21490
21409
  }
21491
21410
 
21492
- .cds--slug.cds--slug--enabled .cds--slug-actions .cds--btn--primary {
21411
+ .cds--slug .cds--slug-actions .cds--btn--primary {
21493
21412
  order: 1;
21494
21413
  border-end-end-radius: 0.4375rem;
21495
21414
  }
@@ -22709,13 +22628,13 @@ span.cds--pagination__text.cds--pagination__items-count {
22709
22628
  }
22710
22629
 
22711
22630
  .cds--tile--slug.cds--tile {
22712
- background: linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) border-box;
22631
+ background: linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, rgba(166, 200, 255, 0.64)), var(--cds-ai-border-end, #78a9ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) border-box;
22713
22632
  border: 1px solid transparent;
22714
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2)), 0 4px 10px 2px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.32));
22633
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1)), 0 24px 40px -24px var(--cds-ai-drop-shadow, rgba(15, 98, 254, 0.1));
22715
22634
  }
22716
22635
 
22717
22636
  .cds--tile--slug.cds--tile--expandable:hover {
22718
- background: linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-background, #ffffff)), var(--cds-layer, var(--cds-background, #ffffff))) border-box;
22637
+ background: linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)) 0%, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, rgba(166, 200, 255, 0.64)), var(--cds-ai-border-end, #78a9ff)) border-box, linear-gradient(to top, var(--cds-layer, var(--cds-ai-popover-background, #ffffff)), var(--cds-layer, var(--cds-ai-popover-background, #ffffff))) border-box;
22719
22638
  }
22720
22639
 
22721
22640
  .cds--tile--slug.cds--tile--selectable::before,
@@ -22734,8 +22653,8 @@ span.cds--pagination__text.cds--pagination__items-count {
22734
22653
 
22735
22654
  .cds--tile--slug.cds--tile--selectable::before,
22736
22655
  .cds--tile--slug.cds--tile--clickable::before {
22737
- background: linear-gradient(to top, var(--cds-ai-aura-hover-start, rgba(69, 137, 255, 0.4)) 0%, 15%, var(--cds-ai-aura-hover-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-ai-aura-hover-background, #edf5ff), var(--cds-ai-aura-hover-background, #edf5ff)) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, #78a9ff), var(--cds-ai-border-end, #d0e2ff)) border-box, linear-gradient(to top, var(--cds-ai-aura-hover-background, #edf5ff), var(--cds-ai-aura-hover-background, #edf5ff)) border-box;
22738
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2));
22656
+ background: linear-gradient(to top, var(--cds-ai-aura-hover-start, rgba(69, 137, 255, 0.32)) 0%, 15%, var(--cds-ai-aura-hover-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-ai-aura-hover-background, #edf5ff), var(--cds-ai-aura-hover-background, #edf5ff)) padding-box, linear-gradient(to bottom, var(--cds-ai-border-start, rgba(166, 200, 255, 0.64)), var(--cds-ai-border-end, #78a9ff)) border-box, linear-gradient(to top, var(--cds-ai-aura-hover-background, #edf5ff), var(--cds-ai-aura-hover-background, #edf5ff)) border-box;
22657
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1));
22739
22658
  }
22740
22659
 
22741
22660
  .cds--tile--slug.cds--tile--selectable:hover::before,
@@ -22745,7 +22664,7 @@ span.cds--pagination__text.cds--pagination__items-count {
22745
22664
 
22746
22665
  .cds--tile--slug.cds--tile--selectable::after {
22747
22666
  background: linear-gradient(to top, var(--cds-ai-aura-start, rgba(69, 137, 255, 0.1)) 0%, var(--cds-ai-aura-end, rgba(255, 255, 255, 0)) 50%) padding-box, linear-gradient(to top, var(--cds-layer), var(--cds-layer)) padding-box, linear-gradient(to bottom, var(--cds-border-inverse, #161616), var(--cds-border-inverse, #161616)) border-box, linear-gradient(to top, var(--cds-layer), var(--cds-layer)) border-box;
22748
- box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.2));
22667
+ box-shadow: inset 0 -80px 70px -65px var(--cds-ai-inner-shadow, rgba(69, 137, 255, 0.1));
22749
22668
  }
22750
22669
 
22751
22670
  .cds--tile--slug.cds--tile--selectable:hover::after {