@nova-design-system/nova-base 3.11.0 → 3.13.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.
@@ -49,8 +49,7 @@ exports.NOVA_TAILWIND_COMPONENTS = {
49
49
  },
50
50
  '.nv-button:focus-visible, .nv-button:has(:focus-visible)': {
51
51
  'outline': 'calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand)',
52
- 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)',
53
- 'zIndex': '111'
52
+ 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)'
54
53
  },
55
54
  '.nv-button:disabled:not([disabled=false])': {
56
55
  'opacity': '0.5',
@@ -77,8 +76,7 @@ exports.NOVA_TAILWIND_COMPONENTS = {
77
76
  },
78
77
  '.nv-button.danger:focus-visible, .nv-button.danger:has(:focus-visible)': {
79
78
  'outline': 'calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive)',
80
- 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)',
81
- 'zIndex': '111'
79
+ 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)'
82
80
  },
83
81
  '.nv-button.size-xs': {
84
82
  'padding': 'var(--button-xs-padding-y) var(--button-xs-padding-x)',
@@ -148,8 +146,7 @@ exports.NOVA_TAILWIND_COMPONENTS = {
148
146
  },
149
147
  '.nv-button.emphasis-high:focus-visible, .nv-button.emphasis-high:has(:focus-visible)': {
150
148
  'outline': 'calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand)',
151
- 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)',
152
- 'zIndex': '111'
149
+ 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)'
153
150
  },
154
151
  '.nv-button.emphasis-high:disabled:not([disabled=false])': {
155
152
  'opacity': '0.5',
@@ -176,8 +173,7 @@ exports.NOVA_TAILWIND_COMPONENTS = {
176
173
  },
177
174
  '.nv-button.emphasis-high.danger:focus-visible, .nv-button.emphasis-high.danger:has(:focus-visible)': {
178
175
  'outline': 'calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive)',
179
- 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)',
180
- 'zIndex': '111'
176
+ 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)'
181
177
  },
182
178
  '.nv-button.emphasis-medium': {
183
179
  'background': 'var(--components-button-medium-background)',
@@ -199,8 +195,7 @@ exports.NOVA_TAILWIND_COMPONENTS = {
199
195
  },
200
196
  '.nv-button.emphasis-medium:focus-visible, .nv-button.emphasis-medium:has(:focus-visible)': {
201
197
  'outline': 'calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand)',
202
- 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)',
203
- 'zIndex': '111'
198
+ 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)'
204
199
  },
205
200
  '.nv-button.emphasis-medium:disabled:not([disabled=false])': {
206
201
  'opacity': '0.5',
@@ -227,8 +222,7 @@ exports.NOVA_TAILWIND_COMPONENTS = {
227
222
  },
228
223
  '.nv-button.emphasis-medium.danger:focus-visible, .nv-button.emphasis-medium.danger:has(:focus-visible)': {
229
224
  'outline': 'calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive)',
230
- 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)',
231
- 'zIndex': '111'
225
+ 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)'
232
226
  },
233
227
  '.nv-button.emphasis-low': {
234
228
  'background': 'var(--components-button-low-background)',
@@ -250,8 +244,7 @@ exports.NOVA_TAILWIND_COMPONENTS = {
250
244
  },
251
245
  '.nv-button.emphasis-low:focus-visible, .nv-button.emphasis-low:has(:focus-visible)': {
252
246
  'outline': 'calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand)',
253
- 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)',
254
- 'zIndex': '111'
247
+ 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)'
255
248
  },
256
249
  '.nv-button.emphasis-low:disabled:not([disabled=false])': {
257
250
  'opacity': '0.5',
@@ -278,8 +271,7 @@ exports.NOVA_TAILWIND_COMPONENTS = {
278
271
  },
279
272
  '.nv-button.emphasis-low.danger:focus-visible, .nv-button.emphasis-low.danger:has(:focus-visible)': {
280
273
  'outline': 'calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive)',
281
- 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)',
282
- 'zIndex': '111'
274
+ 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)'
283
275
  },
284
276
  '.nv-button.emphasis-lower': {
285
277
  'background': 'var(--components-button-lower-background)',
@@ -301,8 +293,7 @@ exports.NOVA_TAILWIND_COMPONENTS = {
301
293
  },
302
294
  '.nv-button.emphasis-lower:focus-visible, .nv-button.emphasis-lower:has(:focus-visible)': {
303
295
  'outline': 'calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand)',
304
- 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)',
305
- 'zIndex': '111'
296
+ 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)'
306
297
  },
307
298
  '.nv-button.emphasis-lower:disabled:not([disabled=false])': {
308
299
  'opacity': '0.5',
@@ -329,8 +320,7 @@ exports.NOVA_TAILWIND_COMPONENTS = {
329
320
  },
330
321
  '.nv-button.emphasis-lower.danger:focus-visible, .nv-button.emphasis-lower.danger:has(:focus-visible)': {
331
322
  'outline': 'calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive)',
332
- 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)',
333
- 'zIndex': '111'
323
+ 'outlineOffset': 'calc(var(--focus-outline-offset) * 1)'
334
324
  },
335
325
  '.nv-button.fluid': {
336
326
  'width': '100%'
@@ -67,6 +67,18 @@ exports.NOVA_TAILWIND_TOKENS = {
67
67
  '.border-feedback-error-high': {
68
68
  'border-color': 'var(--color-feedback-error-high-border)'
69
69
  },
70
+ '.bg-feedback-error-high-contrast': {
71
+ 'background-color': 'var(--color-feedback-error-high-contrast-background)'
72
+ },
73
+ '.border-feedback-error-high-contrast': {
74
+ 'border-color': 'var(--color-feedback-error-high-contrast-border)'
75
+ },
76
+ '.icon-feedback-error-high-contrast': {
77
+ 'color': 'var(--color-feedback-error-high-contrast-icon)'
78
+ },
79
+ '.text-feedback-error-high-contrast': {
80
+ 'color': 'var(--color-feedback-error-high-contrast-text)'
81
+ },
70
82
  '.icon-feedback-error-high': {
71
83
  'color': 'var(--color-feedback-error-high-icon)'
72
84
  },
@@ -91,6 +103,18 @@ exports.NOVA_TAILWIND_TOKENS = {
91
103
  '.border-feedback-information-high': {
92
104
  'border-color': 'var(--color-feedback-information-high-border)'
93
105
  },
106
+ '.bg-feedback-information-high-contrast': {
107
+ 'background-color': 'var(--color-feedback-information-high-contrast-background)'
108
+ },
109
+ '.border-feedback-information-high-contrast': {
110
+ 'border-color': 'var(--color-feedback-information-high-contrast-border)'
111
+ },
112
+ '.icon-feedback-information-high-contrast': {
113
+ 'color': 'var(--color-feedback-information-high-contrast-icon)'
114
+ },
115
+ '.text-feedback-information-high-contrast': {
116
+ 'color': 'var(--color-feedback-information-high-contrast-text)'
117
+ },
94
118
  '.icon-feedback-information-high': {
95
119
  'color': 'var(--color-feedback-information-high-icon)'
96
120
  },
@@ -115,6 +139,18 @@ exports.NOVA_TAILWIND_TOKENS = {
115
139
  '.border-feedback-neutral-high': {
116
140
  'border-color': 'var(--color-feedback-neutral-high-border)'
117
141
  },
142
+ '.bg-feedback-neutral-high-contrast': {
143
+ 'background-color': 'var(--color-feedback-neutral-high-contrast-background)'
144
+ },
145
+ '.border-feedback-neutral-high-contrast': {
146
+ 'border-color': 'var(--color-feedback-neutral-high-contrast-border)'
147
+ },
148
+ '.icon-feedback-neutral-high-contrast': {
149
+ 'color': 'var(--color-feedback-neutral-high-contrast-icon)'
150
+ },
151
+ '.text-feedback-neutral-high-contrast': {
152
+ 'color': 'var(--color-feedback-neutral-high-contrast-text)'
153
+ },
118
154
  '.icon-feedback-neutral-high': {
119
155
  'color': 'var(--color-feedback-neutral-high-icon)'
120
156
  },
@@ -139,6 +175,18 @@ exports.NOVA_TAILWIND_TOKENS = {
139
175
  '.border-feedback-success-high': {
140
176
  'border-color': 'var(--color-feedback-success-high-border)'
141
177
  },
178
+ '.bg-feedback-success-high-contrast': {
179
+ 'background-color': 'var(--color-feedback-success-high-contrast-background)'
180
+ },
181
+ '.border-feedback-success-high-contrast': {
182
+ 'border-color': 'var(--color-feedback-success-high-contrast-border)'
183
+ },
184
+ '.icon-feedback-success-high-contrast': {
185
+ 'color': 'var(--color-feedback-success-high-contrast-icon)'
186
+ },
187
+ '.text-feedback-success-high-contrast': {
188
+ 'color': 'var(--color-feedback-success-high-contrast-text)'
189
+ },
142
190
  '.icon-feedback-success-high': {
143
191
  'color': 'var(--color-feedback-success-high-icon)'
144
192
  },
@@ -163,6 +211,18 @@ exports.NOVA_TAILWIND_TOKENS = {
163
211
  '.border-feedback-warning-high': {
164
212
  'border-color': 'var(--color-feedback-warning-high-border)'
165
213
  },
214
+ '.bg-feedback-warning-high-contrast': {
215
+ 'background-color': 'var(--color-feedback-warning-high-contrast-background)'
216
+ },
217
+ '.border-feedback-warning-high-contrast': {
218
+ 'border-color': 'var(--color-feedback-warning-high-contrast-border)'
219
+ },
220
+ '.icon-feedback-warning-high-contrast': {
221
+ 'color': 'var(--color-feedback-warning-high-contrast-icon)'
222
+ },
223
+ '.text-feedback-warning-high-contrast': {
224
+ 'color': 'var(--color-feedback-warning-high-contrast-text)'
225
+ },
166
226
  '.icon-feedback-warning-high': {
167
227
  'color': 'var(--color-feedback-warning-high-icon)'
168
228
  },
package/dist/css/mccs.css CHANGED
@@ -176,6 +176,11 @@
176
176
  --color-rainbow-1-border: var(--color-amber-500);
177
177
  --color-rainbow-1-background: var(--color-amber-900);
178
178
  --color-focus-brand: var(--color-petrol-400);
179
+ --color-feedback-success-high-contrast-title: var(--color-base-black);
180
+ --color-feedback-success-high-contrast-text: var(--color-base-black);
181
+ --color-feedback-success-high-contrast-icon: var(--color-base-black);
182
+ --color-feedback-success-high-contrast-border: var(--color-status-green-300);
183
+ --color-feedback-success-high-contrast-background: var(--color-status-green-300);
179
184
  --color-feedback-success-low-text: var(--color-status-green-300);
180
185
  --color-feedback-success-low-icon: var(--color-status-green-300);
181
186
  --color-feedback-success-low-border: var(--color-status-green-300);
@@ -184,6 +189,11 @@
184
189
  --color-feedback-success-high-icon: var(--color-base-black);
185
190
  --color-feedback-success-high-border: var(--color-status-green-300);
186
191
  --color-feedback-success-high-background: var(--color-status-green-300);
192
+ --color-feedback-warning-high-contrast-title: var(--color-base-black);
193
+ --color-feedback-warning-high-contrast-text: var(--color-base-black);
194
+ --color-feedback-warning-high-contrast-icon: var(--color-base-black);
195
+ --color-feedback-warning-high-contrast-border: var(--color-status-yellow-300);
196
+ --color-feedback-warning-high-contrast-background: var(--color-status-yellow-300);
187
197
  --color-feedback-warning-low-text: var(--color-status-yellow-300);
188
198
  --color-feedback-warning-low-icon: var(--color-status-yellow-300);
189
199
  --color-feedback-warning-low-border: var(--color-status-yellow-300);
@@ -192,6 +202,11 @@
192
202
  --color-feedback-warning-high-icon: var(--color-base-black);
193
203
  --color-feedback-warning-high-border: var(--color-status-yellow-300);
194
204
  --color-feedback-warning-high-background: var(--color-status-yellow-300);
205
+ --color-feedback-neutral-high-contrast-title: var(--color-base-black);
206
+ --color-feedback-neutral-high-contrast-text: var(--color-base-black);
207
+ --color-feedback-neutral-high-contrast-icon: var(--color-base-black);
208
+ --color-feedback-neutral-high-contrast-border: var(--color-gray-ocean-300);
209
+ --color-feedback-neutral-high-contrast-background: var(--color-gray-ocean-300);
195
210
  --color-feedback-neutral-low-text: var(--color-gray-ocean-300);
196
211
  --color-feedback-neutral-low-icon: var(--color-gray-ocean-300);
197
212
  --color-feedback-neutral-low-border: var(--color-gray-ocean-300);
@@ -200,6 +215,11 @@
200
215
  --color-feedback-neutral-high-icon: var(--color-base-black);
201
216
  --color-feedback-neutral-high-border: var(--color-gray-ocean-300);
202
217
  --color-feedback-neutral-high-background: var(--color-gray-ocean-300);
218
+ --color-feedback-error-high-contrast-title: var(--color-base-black);
219
+ --color-feedback-error-high-contrast-text: var(--color-base-black);
220
+ --color-feedback-error-high-contrast-icon: var(--color-base-black);
221
+ --color-feedback-error-high-contrast-border: var(--color-status-red-400);
222
+ --color-feedback-error-high-contrast-background: var(--color-status-red-400);
203
223
  --color-feedback-error-low-text: var(--color-status-red-400);
204
224
  --color-feedback-error-low-icon: var(--color-status-red-400);
205
225
  --color-feedback-error-low-border: var(--color-status-red-400);
@@ -208,6 +228,11 @@
208
228
  --color-feedback-error-high-icon: var(--color-base-black);
209
229
  --color-feedback-error-high-border: var(--color-status-red-400);
210
230
  --color-feedback-error-high-background: var(--color-status-red-400);
231
+ --color-feedback-information-high-contrast-title: var(--color-base-black);
232
+ --color-feedback-information-high-contrast-text: var(--color-base-black);
233
+ --color-feedback-information-high-contrast-icon: var(--color-base-black);
234
+ --color-feedback-information-high-contrast-border: var(--color-status-blue-300);
235
+ --color-feedback-information-high-contrast-background: var(--color-status-blue-300);
211
236
  --color-feedback-information-low-text: var(--color-status-blue-300);
212
237
  --color-feedback-information-low-icon: var(--color-status-blue-300);
213
238
  --color-feedback-information-low-border: var(--color-status-blue-300);
@@ -326,6 +351,7 @@
326
351
  --components-notification-warning-border: var(--color-feedback-warning-low-border);
327
352
  --components-notification-warning-background: var(--color-level-20-background);
328
353
  --components-notification-content-title: var(--color-content-high-text);
354
+ --components-notification-content-timestamp: var(--color-content-medium-text);
329
355
  --components-notification-content-description: var(--color-content-medium-text);
330
356
  --components-notification-information-border: var(--color-feedback-information-low-border);
331
357
  --components-notification-information-icon: var(--color-feedback-information-low-icon);
@@ -335,6 +361,10 @@
335
361
  --components-menu-contextual-border: var(--color-content-low-border);
336
362
  --components-menu-contextual-background: var(--color-level-00-background);
337
363
  --components-calendar-background: var(--color-level-00-background);
364
+ --components-calendar-weeks-text-hover: var(--color-content-high-text);
365
+ --components-calendar-weeks-text: var(--color-level-inverted-15-background);
366
+ --components-calendar-weeks-background-hover: var(--color-level-15-background);
367
+ --components-calendar-weeks-background: var(--color-level-10-background);
338
368
  --components-calendar-cell-text-today: var(--color-content-high-text);
339
369
  --components-calendar-cell-text-outside-month: var(--color-content-lower-text);
340
370
  --components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
@@ -343,10 +373,6 @@
343
373
  --components-calendar-cell-dot-selected: var(--color-interaction-container-branded-high-icon-active);
344
374
  --components-calendar-cell-dot: var(--color-content-high-icon);
345
375
  --components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
346
- --components-calendar-weeks-text-hover: var(--color-content-high-text);
347
- --components-calendar-weeks-text: var(--color-level-inverted-15-background);
348
- --components-calendar-weeks-background-hover: var(--color-level-15-background);
349
- --components-calendar-weeks-background: var(--color-level-10-background);
350
376
  --components-calendar-header-text: var(--color-content-high-text);
351
377
  --components-calendar-border: var(--color-content-low-border);
352
378
  --components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
@@ -737,6 +763,11 @@
737
763
  --color-rainbow-1-border: var(--color-amber-600);
738
764
  --color-rainbow-1-background: var(--color-amber-50);
739
765
  --color-focus-brand: var(--color-petrol-500);
766
+ --color-feedback-success-high-contrast-title: var(--color-base-white);
767
+ --color-feedback-success-high-contrast-text: var(--color-base-white);
768
+ --color-feedback-success-high-contrast-icon: var(--color-base-white);
769
+ --color-feedback-success-high-contrast-border: var(--color-status-green-500);
770
+ --color-feedback-success-high-contrast-background: var(--color-status-green-500);
740
771
  --color-feedback-success-low-text: var(--color-status-green-500);
741
772
  --color-feedback-success-low-icon: var(--color-status-green-500);
742
773
  --color-feedback-success-low-border: var(--color-status-green-500);
@@ -745,6 +776,11 @@
745
776
  --color-feedback-success-high-icon: var(--color-base-white);
746
777
  --color-feedback-success-high-border: var(--color-status-green-400);
747
778
  --color-feedback-success-high-background: var(--color-status-green-400);
779
+ --color-feedback-warning-high-contrast-title: var(--color-base-white);
780
+ --color-feedback-warning-high-contrast-text: var(--color-base-white);
781
+ --color-feedback-warning-high-contrast-icon: var(--color-base-white);
782
+ --color-feedback-warning-high-contrast-border: var(--color-status-yellow-500);
783
+ --color-feedback-warning-high-contrast-background: var(--color-status-yellow-500);
748
784
  --color-feedback-warning-low-text: var(--color-status-yellow-500);
749
785
  --color-feedback-warning-low-icon: var(--color-status-yellow-500);
750
786
  --color-feedback-warning-low-border: var(--color-status-yellow-500);
@@ -753,6 +789,11 @@
753
789
  --color-feedback-warning-high-icon: var(--color-base-white);
754
790
  --color-feedback-warning-high-border: var(--color-status-yellow-400);
755
791
  --color-feedback-warning-high-background: var(--color-status-yellow-400);
792
+ --color-feedback-neutral-high-contrast-title: var(--color-base-white);
793
+ --color-feedback-neutral-high-contrast-text: var(--color-base-white);
794
+ --color-feedback-neutral-high-contrast-icon: var(--color-base-white);
795
+ --color-feedback-neutral-high-contrast-border: var(--color-gray-ocean-400);
796
+ --color-feedback-neutral-high-contrast-background: var(--color-gray-ocean-400);
756
797
  --color-feedback-neutral-low-text: var(--color-gray-ocean-400);
757
798
  --color-feedback-neutral-low-icon: var(--color-gray-ocean-400);
758
799
  --color-feedback-neutral-low-border: var(--color-gray-ocean-400);
@@ -761,6 +802,11 @@
761
802
  --color-feedback-neutral-high-icon: var(--color-base-white);
762
803
  --color-feedback-neutral-high-border: var(--color-gray-ocean-400);
763
804
  --color-feedback-neutral-high-background: var(--color-gray-ocean-400);
805
+ --color-feedback-error-high-contrast-title: var(--color-base-white);
806
+ --color-feedback-error-high-contrast-text: var(--color-base-white);
807
+ --color-feedback-error-high-contrast-icon: var(--color-base-white);
808
+ --color-feedback-error-high-contrast-border: var(--color-status-red-500);
809
+ --color-feedback-error-high-contrast-background: var(--color-status-red-500);
764
810
  --color-feedback-error-low-text: var(--color-status-red-500);
765
811
  --color-feedback-error-low-icon: var(--color-status-red-500);
766
812
  --color-feedback-error-low-border: var(--color-status-red-500);
@@ -769,6 +815,11 @@
769
815
  --color-feedback-error-high-icon: var(--color-base-white);
770
816
  --color-feedback-error-high-border: var(--color-status-red-500);
771
817
  --color-feedback-error-high-background: var(--color-status-red-500);
818
+ --color-feedback-information-high-contrast-title: var(--color-base-white);
819
+ --color-feedback-information-high-contrast-text: var(--color-base-white);
820
+ --color-feedback-information-high-contrast-icon: var(--color-base-white);
821
+ --color-feedback-information-high-contrast-border: var(--color-status-blue-400);
822
+ --color-feedback-information-high-contrast-background: var(--color-status-blue-400);
772
823
  --color-feedback-information-low-text: var(--color-status-blue-500);
773
824
  --color-feedback-information-low-icon: var(--color-status-blue-500);
774
825
  --color-feedback-information-low-border: var(--color-status-blue-500);
@@ -887,6 +938,7 @@
887
938
  --components-notification-warning-border: var(--color-feedback-warning-low-border);
888
939
  --components-notification-warning-background: var(--color-level-00-background);
889
940
  --components-notification-content-title: var(--color-content-high-text);
941
+ --components-notification-content-timestamp: var(--color-content-medium-text);
890
942
  --components-notification-content-description: var(--color-content-medium-text);
891
943
  --components-notification-information-border: var(--color-feedback-information-low-border);
892
944
  --components-notification-information-icon: var(--color-feedback-information-low-icon);
@@ -896,6 +948,10 @@
896
948
  --components-menu-contextual-border: var(--color-content-low-border);
897
949
  --components-menu-contextual-background: var(--color-level-00-background);
898
950
  --components-calendar-background: var(--color-level-00-background);
951
+ --components-calendar-weeks-text-hover: var(--color-content-high-text);
952
+ --components-calendar-weeks-text: var(--color-content-high-text);
953
+ --components-calendar-weeks-background-hover: var(--color-level-15-background);
954
+ --components-calendar-weeks-background: var(--color-level-10-background);
899
955
  --components-calendar-cell-text-today: var(--color-content-high-text);
900
956
  --components-calendar-cell-text-outside-month: var(--color-content-lower-text);
901
957
  --components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
@@ -904,10 +960,6 @@
904
960
  --components-calendar-cell-dot-selected: var(--color-interaction-container-branded-high-icon-active);
905
961
  --components-calendar-cell-dot: var(--color-content-high-icon);
906
962
  --components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
907
- --components-calendar-weeks-text-hover: var(--color-content-high-text);
908
- --components-calendar-weeks-text: var(--color-content-high-text);
909
- --components-calendar-weeks-background-hover: var(--color-level-15-background);
910
- --components-calendar-weeks-background: var(--color-level-10-background);
911
963
  --components-calendar-header-text: var(--color-content-high-text);
912
964
  --components-calendar-border: var(--color-content-low-border);
913
965
  --components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
@@ -1128,8 +1180,6 @@
1128
1180
  --letter-spacing-heading-md: -0.5000px;
1129
1181
  --letter-spacing-heading-sm: -0.2500px;
1130
1182
  --letter-spacing-heading-xs: 0.0000px;
1131
- --spacing-09: 36.0000px;
1132
- --spacing-07: 28.0000px;
1133
1183
  --spacing-3-5: 14.0000px;
1134
1184
  --spacing-2-5: 10.0000px;
1135
1185
  --spacing-1-5: 6.0000px;
@@ -1402,22 +1452,6 @@
1402
1452
  */
1403
1453
 
1404
1454
  :root {
1405
- --togglegroup-md-iconbutton-padding-y: 7.0000px;
1406
- --togglegroup-md-button-radius: 3.0000px;
1407
- --togglegroup-md-button-padding-y: 5.0000px;
1408
- --togglegroup-md-padding: 3.0000px;
1409
- --togglegroup-lg-iconbutton-padding-y: 9.0000px;
1410
- --togglegroup-lg-button-radius: 5.0000px;
1411
- --togglegroup-lg-button-padding-y: 7.0000px;
1412
- --togglegroup-lg-padding: 3.0000px;
1413
- --togglegroup-sm-padding: 3.0000px;
1414
- --togglegroup-sm-iconbutton-padding-y: 5.0000px;
1415
- --togglegroup-sm-button-radius: 2.0000px;
1416
- --togglegroup-sm-button-padding-y: 3.0000px;
1417
- --togglegroup-xs-iconbutton-padding-y: 3.0000px;
1418
- --togglegroup-xs-button-radius: 1.0000px;
1419
- --togglegroup-xs-button-padding-y: 1.0000px;
1420
- --togglegroup-xs-padding: 3.0000px;
1421
1455
  --slider-tick-radius: 1.0000px;
1422
1456
  --global-typography-legend-font-style: uppercase;
1423
1457
  --global-typography-label-font-style: normal;
@@ -1430,6 +1464,22 @@
1430
1464
  --global-typography-h2-font-style: normal;
1431
1465
  --global-typography-h1-font-style: normal;
1432
1466
  --tooltip-font-weight: 500;
1467
+ --togglegroup-lg-iconbutton-padding-y: 9.0000px;
1468
+ --togglegroup-lg-button-radius: 5.0000px;
1469
+ --togglegroup-lg-button-padding-y: 7.0000px;
1470
+ --togglegroup-lg-padding: 3.0000px;
1471
+ --togglegroup-md-iconbutton-padding-y: 7.0000px;
1472
+ --togglegroup-md-button-radius: 3.0000px;
1473
+ --togglegroup-md-button-padding-y: 5.0000px;
1474
+ --togglegroup-md-padding: 3.0000px;
1475
+ --togglegroup-sm-iconbutton-padding-y: 5.0000px;
1476
+ --togglegroup-sm-button-radius: 2.0000px;
1477
+ --togglegroup-sm-button-padding-y: 3.0000px;
1478
+ --togglegroup-sm-padding: 3.0000px;
1479
+ --togglegroup-xs-iconbutton-padding-y: 3.0000px;
1480
+ --togglegroup-xs-button-radius: 1.0000px;
1481
+ --togglegroup-xs-button-padding-y: 1.0000px;
1482
+ --togglegroup-xs-padding: 3.0000px;
1433
1483
  --popover-shadow-2-x: 0.0000px;
1434
1484
  --popover-shadow-1-blur: 1.0000px;
1435
1485
  --popover-shadow-1-x: 0.0000px;
@@ -1473,6 +1523,8 @@
1473
1523
  --notification-border-width-low-emphasis: var(--spacing-px);
1474
1524
  --notification-border-width-high-emphasis: var(--spacing-2);
1475
1525
  --notification-radius: var(--radius-rounded-lg);
1526
+ --notification-padding-left: var(--spacing-6);
1527
+ --notification-padding-right: var(--spacing-6);
1476
1528
  --notification-padding: var(--spacing-4);
1477
1529
  --notification-gap-y: var(--spacing-1);
1478
1530
  --notification-gap-x-title: var(--spacing-2);
@@ -1549,24 +1601,13 @@
1549
1601
  --alert-heading-font-weight: var(--font-weight-medium-emphasis);
1550
1602
  --alert-heading-font-size: var(--font-size-sm);
1551
1603
  --alert-radius: var(--radius-rounded-lg);
1604
+ --alert-padding-right: var(--spacing-8);
1552
1605
  --alert-padding: var(--spacing-4);
1553
1606
  --alert-gap-y: var(--spacing-1);
1554
1607
  --alert-icon-position-y: var(--spacing-4);
1555
1608
  --alert-icon-position-x: var(--spacing-4);
1556
1609
  --alert-gap-x: var(--spacing-3);
1557
1610
  --alert-icon-size: var(--spacing-5);
1558
- --togglegroup-md-height: var(--spacing-10);
1559
- --togglegroup-md-gap: var(--spacing-0-5);
1560
- --togglegroup-md-radius: var(--radius-rounded-md);
1561
- --togglegroup-lg-height: var(--spacing-12);
1562
- --togglegroup-lg-gap: var(--spacing-0-5);
1563
- --togglegroup-lg-radius: var(--radius-rounded-lg);
1564
- --togglegroup-sm-height: var(--spacing-8);
1565
- --togglegroup-sm-gap: var(--spacing-0-5);
1566
- --togglegroup-sm-radius: var(--radius-rounded);
1567
- --togglegroup-xs-height: var(--spacing-6);
1568
- --togglegroup-xs-gap: var(--spacing-0-5);
1569
- --togglegroup-xs-radius: var(--radius-rounded-sm);
1570
1611
  --slider-track-radius: var(--radius-rounded-sm);
1571
1612
  --slider-track-padding-x: var(--spacing-3);
1572
1613
  --slider-track-height: var(--spacing-1);
@@ -1611,6 +1652,18 @@
1611
1652
  --tooltip-padding-y: var(--spacing-3);
1612
1653
  --tooltip-padding-x: var(--spacing-3);
1613
1654
  --tooltip-font-size: var(--font-size-sm);
1655
+ --togglegroup-lg-height: var(--spacing-12);
1656
+ --togglegroup-lg-gap: var(--spacing-0-5);
1657
+ --togglegroup-lg-radius: var(--radius-rounded-lg);
1658
+ --togglegroup-md-height: var(--spacing-10);
1659
+ --togglegroup-md-gap: var(--spacing-0-5);
1660
+ --togglegroup-md-radius: var(--radius-rounded-md);
1661
+ --togglegroup-sm-height: var(--spacing-8);
1662
+ --togglegroup-sm-gap: var(--spacing-0-5);
1663
+ --togglegroup-sm-radius: var(--radius-rounded);
1664
+ --togglegroup-xs-height: var(--spacing-6);
1665
+ --togglegroup-xs-gap: var(--spacing-0-5);
1666
+ --togglegroup-xs-radius: var(--radius-rounded-sm);
1614
1667
  --popover-radius: var(--radius-rounded-md);
1615
1668
  --popover-padding-y: var(--spacing-2);
1616
1669
  --popover-padding-x: var(--spacing-2);
@@ -1710,11 +1763,11 @@
1710
1763
  --list-native-line-height: var(--line-height-base);
1711
1764
  --list-native-font-size: var(--font-size-md);
1712
1765
  --list-native-icon-size: var(--spacing-5);
1713
- --icon-xl: var(--spacing-7);
1714
- --icon-lg: var(--spacing-6);
1715
- --icon-md: var(--spacing-5);
1716
- --icon-sm: var(--spacing-4);
1717
- --icon-xs: var(--spacing-3);
1766
+ --icon-size-xl: var(--spacing-7);
1767
+ --icon-size-lg: var(--spacing-6);
1768
+ --icon-size-md: var(--spacing-5);
1769
+ --icon-size-sm: var(--spacing-4);
1770
+ --icon-size-xs: var(--spacing-3);
1718
1771
  --calendar-navigation-buttons-gap: var(--spacing-1);
1719
1772
  --calendar-controls-padding-top: var(--spacing-2);
1720
1773
  --calendar-controls-margin-top: var(--spacing-1);
@@ -6790,6 +6790,22 @@ h6 {
6790
6790
  border-color: var(--color-feedback-error-high-border);
6791
6791
  }
6792
6792
 
6793
+ .bg-feedback-error-high-contrast {
6794
+ background-color: var(--color-feedback-error-high-contrast-background);
6795
+ }
6796
+
6797
+ .border-feedback-error-high-contrast {
6798
+ border-color: var(--color-feedback-error-high-contrast-border);
6799
+ }
6800
+
6801
+ .icon-feedback-error-high-contrast {
6802
+ color: var(--color-feedback-error-high-contrast-icon);
6803
+ }
6804
+
6805
+ .text-feedback-error-high-contrast {
6806
+ color: var(--color-feedback-error-high-contrast-text);
6807
+ }
6808
+
6793
6809
  .icon-feedback-error-high {
6794
6810
  color: var(--color-feedback-error-high-icon);
6795
6811
  }
@@ -6822,6 +6838,22 @@ h6 {
6822
6838
  border-color: var(--color-feedback-information-high-border);
6823
6839
  }
6824
6840
 
6841
+ .bg-feedback-information-high-contrast {
6842
+ background-color: var(--color-feedback-information-high-contrast-background);
6843
+ }
6844
+
6845
+ .border-feedback-information-high-contrast {
6846
+ border-color: var(--color-feedback-information-high-contrast-border);
6847
+ }
6848
+
6849
+ .icon-feedback-information-high-contrast {
6850
+ color: var(--color-feedback-information-high-contrast-icon);
6851
+ }
6852
+
6853
+ .text-feedback-information-high-contrast {
6854
+ color: var(--color-feedback-information-high-contrast-text);
6855
+ }
6856
+
6825
6857
  .icon-feedback-information-high {
6826
6858
  color: var(--color-feedback-information-high-icon);
6827
6859
  }
@@ -6854,6 +6886,22 @@ h6 {
6854
6886
  border-color: var(--color-feedback-neutral-high-border);
6855
6887
  }
6856
6888
 
6889
+ .bg-feedback-neutral-high-contrast {
6890
+ background-color: var(--color-feedback-neutral-high-contrast-background);
6891
+ }
6892
+
6893
+ .border-feedback-neutral-high-contrast {
6894
+ border-color: var(--color-feedback-neutral-high-contrast-border);
6895
+ }
6896
+
6897
+ .icon-feedback-neutral-high-contrast {
6898
+ color: var(--color-feedback-neutral-high-contrast-icon);
6899
+ }
6900
+
6901
+ .text-feedback-neutral-high-contrast {
6902
+ color: var(--color-feedback-neutral-high-contrast-text);
6903
+ }
6904
+
6857
6905
  .icon-feedback-neutral-high {
6858
6906
  color: var(--color-feedback-neutral-high-icon);
6859
6907
  }
@@ -6886,6 +6934,22 @@ h6 {
6886
6934
  border-color: var(--color-feedback-success-high-border);
6887
6935
  }
6888
6936
 
6937
+ .bg-feedback-success-high-contrast {
6938
+ background-color: var(--color-feedback-success-high-contrast-background);
6939
+ }
6940
+
6941
+ .border-feedback-success-high-contrast {
6942
+ border-color: var(--color-feedback-success-high-contrast-border);
6943
+ }
6944
+
6945
+ .icon-feedback-success-high-contrast {
6946
+ color: var(--color-feedback-success-high-contrast-icon);
6947
+ }
6948
+
6949
+ .text-feedback-success-high-contrast {
6950
+ color: var(--color-feedback-success-high-contrast-text);
6951
+ }
6952
+
6889
6953
  .icon-feedback-success-high {
6890
6954
  color: var(--color-feedback-success-high-icon);
6891
6955
  }
@@ -6918,6 +6982,22 @@ h6 {
6918
6982
  border-color: var(--color-feedback-warning-high-border);
6919
6983
  }
6920
6984
 
6985
+ .bg-feedback-warning-high-contrast {
6986
+ background-color: var(--color-feedback-warning-high-contrast-background);
6987
+ }
6988
+
6989
+ .border-feedback-warning-high-contrast {
6990
+ border-color: var(--color-feedback-warning-high-contrast-border);
6991
+ }
6992
+
6993
+ .icon-feedback-warning-high-contrast {
6994
+ color: var(--color-feedback-warning-high-contrast-icon);
6995
+ }
6996
+
6997
+ .text-feedback-warning-high-contrast {
6998
+ color: var(--color-feedback-warning-high-contrast-text);
6999
+ }
7000
+
6921
7001
  .icon-feedback-warning-high {
6922
7002
  color: var(--color-feedback-warning-high-icon);
6923
7003
  }
@@ -7484,7 +7564,6 @@ h6 {
7484
7564
  .nv-button:focus-visible, .nv-button:has(:focus-visible) {
7485
7565
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);
7486
7566
  outline-offset: calc(var(--focus-outline-offset) * 1);
7487
- z-index: 111;
7488
7567
  }
7489
7568
 
7490
7569
  .nv-button:disabled:not([disabled=false]) {
@@ -7518,7 +7597,6 @@ h6 {
7518
7597
  .nv-button.danger:focus-visible, .nv-button.danger:has(:focus-visible) {
7519
7598
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);
7520
7599
  outline-offset: calc(var(--focus-outline-offset) * 1);
7521
- z-index: 111;
7522
7600
  }
7523
7601
 
7524
7602
  .nv-button.size-xs {
@@ -7602,7 +7680,6 @@ h6 {
7602
7680
  .nv-button.emphasis-high:focus-visible, .nv-button.emphasis-high:has(:focus-visible) {
7603
7681
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);
7604
7682
  outline-offset: calc(var(--focus-outline-offset) * 1);
7605
- z-index: 111;
7606
7683
  }
7607
7684
 
7608
7685
  .nv-button.emphasis-high:disabled:not([disabled=false]) {
@@ -7636,7 +7713,6 @@ h6 {
7636
7713
  .nv-button.emphasis-high.danger:focus-visible, .nv-button.emphasis-high.danger:has(:focus-visible) {
7637
7714
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);
7638
7715
  outline-offset: calc(var(--focus-outline-offset) * 1);
7639
- z-index: 111;
7640
7716
  }
7641
7717
 
7642
7718
  .nv-button.emphasis-medium {
@@ -7664,7 +7740,6 @@ h6 {
7664
7740
  .nv-button.emphasis-medium:focus-visible, .nv-button.emphasis-medium:has(:focus-visible) {
7665
7741
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);
7666
7742
  outline-offset: calc(var(--focus-outline-offset) * 1);
7667
- z-index: 111;
7668
7743
  }
7669
7744
 
7670
7745
  .nv-button.emphasis-medium:disabled:not([disabled=false]) {
@@ -7698,7 +7773,6 @@ h6 {
7698
7773
  .nv-button.emphasis-medium.danger:focus-visible, .nv-button.emphasis-medium.danger:has(:focus-visible) {
7699
7774
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);
7700
7775
  outline-offset: calc(var(--focus-outline-offset) * 1);
7701
- z-index: 111;
7702
7776
  }
7703
7777
 
7704
7778
  .nv-button.emphasis-low {
@@ -7726,7 +7800,6 @@ h6 {
7726
7800
  .nv-button.emphasis-low:focus-visible, .nv-button.emphasis-low:has(:focus-visible) {
7727
7801
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);
7728
7802
  outline-offset: calc(var(--focus-outline-offset) * 1);
7729
- z-index: 111;
7730
7803
  }
7731
7804
 
7732
7805
  .nv-button.emphasis-low:disabled:not([disabled=false]) {
@@ -7760,7 +7833,6 @@ h6 {
7760
7833
  .nv-button.emphasis-low.danger:focus-visible, .nv-button.emphasis-low.danger:has(:focus-visible) {
7761
7834
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);
7762
7835
  outline-offset: calc(var(--focus-outline-offset) * 1);
7763
- z-index: 111;
7764
7836
  }
7765
7837
 
7766
7838
  .nv-button.emphasis-lower {
@@ -7788,7 +7860,6 @@ h6 {
7788
7860
  .nv-button.emphasis-lower:focus-visible, .nv-button.emphasis-lower:has(:focus-visible) {
7789
7861
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);
7790
7862
  outline-offset: calc(var(--focus-outline-offset) * 1);
7791
- z-index: 111;
7792
7863
  }
7793
7864
 
7794
7865
  .nv-button.emphasis-lower:disabled:not([disabled=false]) {
@@ -7822,7 +7893,6 @@ h6 {
7822
7893
  .nv-button.emphasis-lower.danger:focus-visible, .nv-button.emphasis-lower.danger:has(:focus-visible) {
7823
7894
  outline: calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);
7824
7895
  outline-offset: calc(var(--focus-outline-offset) * 1);
7825
- z-index: 111;
7826
7896
  }
7827
7897
 
7828
7898
  .nv-button.fluid {