@nova-design-system/nova-base 3.0.0 → 3.2.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.
@@ -301,36 +301,72 @@ exports.NOVA_TAILWIND_TOKENS = {
301
301
  '.icon-interaction-link-high-hover': {
302
302
  'color': 'var(--color-interaction-link-high-icon-hover)'
303
303
  },
304
+ '.icon-interaction-link-high-inactive': {
305
+ 'color': 'var(--color-interaction-link-high-icon-inactive)'
306
+ },
307
+ '.icon-interaction-link-high-visited': {
308
+ 'color': 'var(--color-interaction-link-high-icon-visited)'
309
+ },
304
310
  '.text-interaction-link-high': {
305
311
  'color': 'var(--color-interaction-link-high-text)'
306
312
  },
307
313
  '.text-interaction-link-high-hover': {
308
314
  'color': 'var(--color-interaction-link-high-text-hover)'
309
315
  },
316
+ '.text-interaction-link-high-inactive': {
317
+ 'color': 'var(--color-interaction-link-high-text-inactive)'
318
+ },
319
+ '.text-interaction-link-high-visited': {
320
+ 'color': 'var(--color-interaction-link-high-text-visited)'
321
+ },
310
322
  '.icon-interaction-link-inverted': {
311
323
  'color': 'var(--color-interaction-link-inverted-icon)'
312
324
  },
313
325
  '.icon-interaction-link-inverted-hover': {
314
326
  'color': 'var(--color-interaction-link-inverted-icon-hover)'
315
327
  },
328
+ '.icon-interaction-link-inverted-inactive': {
329
+ 'color': 'var(--color-interaction-link-inverted-icon-inactive)'
330
+ },
331
+ '.icon-interaction-link-inverted-visited': {
332
+ 'color': 'var(--color-interaction-link-inverted-icon-visited)'
333
+ },
316
334
  '.text-interaction-link-inverted': {
317
335
  'color': 'var(--color-interaction-link-inverted-text)'
318
336
  },
319
337
  '.text-interaction-link-inverted-hover': {
320
338
  'color': 'var(--color-interaction-link-inverted-text-hover)'
321
339
  },
340
+ '.text-interaction-link-inverted-inactive': {
341
+ 'color': 'var(--color-interaction-link-inverted-text-inactive)'
342
+ },
343
+ '.text-interaction-link-inverted-visited': {
344
+ 'color': 'var(--color-interaction-link-inverted-text-visited)'
345
+ },
322
346
  '.icon-interaction-link-low': {
323
347
  'color': 'var(--color-interaction-link-low-icon)'
324
348
  },
325
349
  '.icon-interaction-link-low-hover': {
326
350
  'color': 'var(--color-interaction-link-low-icon-hover)'
327
351
  },
352
+ '.icon-interaction-link-low-inactive': {
353
+ 'color': 'var(--color-interaction-link-low-icon-inactive)'
354
+ },
355
+ '.icon-interaction-link-low-visited': {
356
+ 'color': 'var(--color-interaction-link-low-icon-visited)'
357
+ },
328
358
  '.text-interaction-link-low': {
329
359
  'color': 'var(--color-interaction-link-low-text)'
330
360
  },
331
361
  '.text-interaction-link-low-hover': {
332
362
  'color': 'var(--color-interaction-link-low-text-hover)'
333
363
  },
364
+ '.text-interaction-link-low-inactive': {
365
+ 'color': 'var(--color-interaction-link-low-text-inactive)'
366
+ },
367
+ '.text-interaction-link-low-visited': {
368
+ 'color': 'var(--color-interaction-link-low-text-visited)'
369
+ },
334
370
  '.bg-level-00': {
335
371
  'background-color': 'var(--color-level-00-background)'
336
372
  },
@@ -100,8 +100,194 @@ exports.novaTailwindPlugin = (0, plugin_js_1.default)(function (_a) {
100
100
  width: 'revert',
101
101
  }, '.w-unset': {
102
102
  width: 'unset',
103
+ },
104
+ // Typography utilities
105
+ // .typo-{type}-{size}-{weight}
106
+ // Headings
107
+ '.typo-heading-xl-regular': {
108
+ 'font-size': 'var(--font-size-4xl)',
109
+ 'font-weight': '400',
110
+ 'line-height': 'var(--leading-px-10)',
111
+ 'letter-spacing': 'var(--letter-spacing-heading-xl)',
112
+ }, '.typo-heading-xl-medium': {
113
+ 'font-size': 'var(--font-size-4xl)',
114
+ 'font-weight': '500',
115
+ 'line-height': 'var(--leading-px-10)',
116
+ 'letter-spacing': 'var(--letter-spacing-heading-xl)',
117
+ }, '.typo-heading-xl-bold': {
118
+ 'font-size': 'var(--font-size-4xl)',
119
+ 'font-weight': '700',
120
+ 'line-height': 'var(--leading-px-10)',
121
+ 'letter-spacing': 'var(--letter-spacing-heading-xl)',
122
+ }, '.typo-heading-lg-regular': {
123
+ 'font-size': 'var(--font-size-3xl)',
124
+ 'font-weight': '400',
125
+ 'line-height': 'var(--leading-px-8)',
126
+ 'letter-spacing': 'var(--letter-spacing-heading-lg)',
127
+ }, '.typo-heading-lg-medium': {
128
+ 'font-size': 'var(--font-size-3xl)',
129
+ 'font-weight': '500',
130
+ 'line-height': 'var(--leading-px-8)',
131
+ 'letter-spacing': 'var(--letter-spacing-heading-lg)',
132
+ }, '.typo-heading-lg-bold': {
133
+ 'font-size': 'var(--font-size-3xl)',
134
+ 'font-weight': '700',
135
+ 'line-height': 'var(--leading-px-8)',
136
+ 'letter-spacing': 'var(--letter-spacing-heading-lg)',
137
+ }, '.typo-heading-md-regular': {
138
+ 'font-size': 'var(--font-size-2xl)',
139
+ 'font-weight': '400',
140
+ 'line-height': 'var(--leading-px-7)',
141
+ 'letter-spacing': 'var(--letter-spacing-heading-md)',
142
+ }, '.typo-heading-md-medium': {
143
+ 'font-size': 'var(--font-size-2xl)',
144
+ 'font-weight': '500',
145
+ 'line-height': 'var(--leading-px-7)',
146
+ 'letter-spacing': 'var(--letter-spacing-heading-md)',
147
+ }, '.typo-heading-md-bold': {
148
+ 'font-size': 'var(--font-size-2xl)',
149
+ 'font-weight': '700',
150
+ 'line-height': 'var(--leading-px-7)',
151
+ 'letter-spacing': 'var(--letter-spacing-heading-md)',
152
+ }, '.typo-heading-sm-regular': {
153
+ 'font-size': 'var(--font-size-xl)',
154
+ 'font-weight': '400',
155
+ 'line-height': 'var(--leading-px-6)',
156
+ 'letter-spacing': 'var(--letter-spacing-heading-sm)',
157
+ }, '.typo-heading-sm-medium': {
158
+ 'font-size': 'var(--font-size-xl)',
159
+ 'font-weight': '500',
160
+ 'line-height': 'var(--leading-px-6)',
161
+ 'letter-spacing': 'var(--letter-spacing-heading-sm)',
162
+ }, '.typo-heading-sm-bold': {
163
+ 'font-size': 'var(--font-size-xl)',
164
+ 'font-weight': '700',
165
+ 'line-height': 'var(--leading-px-6)',
166
+ 'letter-spacing': 'var(--letter-spacing-heading-sm)',
167
+ }, '.typo-heading-xs-regular': {
168
+ 'font-size': 'var(--font-size-lg)',
169
+ 'font-weight': '400',
170
+ 'line-height': 'var(--leading-px-6)',
171
+ 'letter-spacing': 'var(--letter-spacing-heading-xs)',
172
+ }, '.typo-heading-xs-medium': {
173
+ 'font-size': 'var(--font-size-lg)',
174
+ 'font-weight': '500',
175
+ 'line-height': 'var(--leading-px-6)',
176
+ 'letter-spacing': 'var(--letter-spacing-heading-xs)',
177
+ }, '.typo-heading-xs-bold': {
178
+ 'font-size': 'var(--font-size-lg)',
179
+ 'font-weight': '700',
180
+ 'line-height': 'var(--leading-px-6)',
181
+ 'letter-spacing': 'var(--letter-spacing-heading-xs)',
182
+ },
183
+ // Text
184
+ '.typo-text-xl-regular': {
185
+ 'font-size': 'var(--font-size-xl)',
186
+ 'font-weight': '400',
187
+ 'line-height': 'var(--line-height-xl)',
188
+ }, '.typo-text-xl-medium': {
189
+ 'font-size': 'var(--font-size-xl)',
190
+ 'font-weight': '500',
191
+ 'line-height': 'var(--line-height-xl)',
192
+ }, '.typo-text-xl-bold': {
193
+ 'font-size': 'var(--font-size-xl)',
194
+ 'font-weight': '700',
195
+ 'line-height': 'var(--line-height-xl)',
196
+ }, '.typo-text-lg-regular': {
197
+ 'font-size': 'var(--font-size-lg)',
198
+ 'font-weight': '400',
199
+ 'line-height': 'var(--line-height-lg)',
200
+ }, '.typo-text-lg-medium': {
201
+ 'font-size': 'var(--font-size-lg)',
202
+ 'font-weight': '500',
203
+ 'line-height': 'var(--line-height-lg)',
204
+ }, '.typo-text-lg-bold': {
205
+ 'font-size': 'var(--font-size-lg)',
206
+ 'font-weight': '700',
207
+ 'line-height': 'var(--line-height-lg)',
208
+ }, '.typo-text-md-regular': {
209
+ 'font-size': 'var(--font-size-md)',
210
+ 'font-weight': '400',
211
+ 'line-height': 'var(--line-height-b ase)',
212
+ }, '.typo-text-md-medium': {
213
+ 'font-size': 'var(--font-size-md)',
214
+ 'font-weight': '500',
215
+ 'line-height': 'var(--line-height-base)',
216
+ }, '.typo-text-md-bold': {
217
+ 'font-size': 'var(--font-size-md)',
218
+ 'font-weight': '700',
219
+ 'line-height': 'var(--line-height-base)',
220
+ }, '.typo-text-sm-regular': {
221
+ 'font-size': 'var(--font-size-sm)',
222
+ 'font-weight': '400',
223
+ 'line-height': 'var(--line-height-sm)',
224
+ }, '.typo-text-sm-medium': {
225
+ 'font-size': 'var(--font-size-sm)',
226
+ 'font-weight': '500',
227
+ 'line-height': 'var(--line-height-sm)',
228
+ }, '.typo-text-sm-bold': {
229
+ 'font-size': 'var(--font-size-sm)',
230
+ 'font-weight': '700',
231
+ 'line-height': 'var(--line-height-sm)',
232
+ }, '.typo-text-xs-regular': {
233
+ 'font-size': 'var(--font-size-xs)',
234
+ 'font-weight': '400',
235
+ 'line-height': 'var(--line-height-xs)',
236
+ }, '.typo-text-xs-medium': {
237
+ 'font-size': 'var(--font-size-xs)',
238
+ 'font-weight': '500',
239
+ 'line-height': 'var(--line-height-xs)',
240
+ }, '.typo-text-xs-bold': {
241
+ 'font-size': 'var(--font-size-xs)',
242
+ 'font-weight': '700',
243
+ 'line-height': 'var(--line-height-xs)',
244
+ },
245
+ // Mono
246
+ '.typo-mono-md-regular': {
247
+ 'font-family': 'TT Norms Pro Mono',
248
+ 'font-size': 'var(--font-size-md)',
249
+ 'font-weight': '400',
250
+ 'line-height': 'var(--line-height-base)',
251
+ }, '.typo-mono-md-medium': {
252
+ 'font-family': 'TT Norms Pro Mono',
253
+ 'font-size': 'var(--font-size-md)',
254
+ 'font-weight': '500',
255
+ 'line-height': 'var(--line-height-base)',
256
+ }, '.typo-mono-md-bold': {
257
+ 'font-family': 'TT Norms Pro Mono',
258
+ 'font-size': 'var(--font-size-md)',
259
+ 'font-weight': '700',
260
+ 'line-height': 'var(--line-height-base)',
261
+ }, '.typo-mono-sm-regular': {
262
+ 'font-family': 'TT Norms Pro Mono',
263
+ 'font-size': 'var(--font-size-sm)',
264
+ 'font-weight': '400',
265
+ 'line-height': 'var(--line-height-sm)',
266
+ }, '.typo-mono-sm-medium': {
267
+ 'font-family': 'TT Norms Pro Mono',
268
+ 'font-size': 'var(--font-size-sm)',
269
+ 'font-weight': '500',
270
+ 'line-height': 'var(--line-height-sm)',
271
+ }, '.typo-mono-sm-bold': {
272
+ 'font-family': 'TT Norms Pro Mono',
273
+ 'font-size': 'var(--font-size-sm)',
274
+ 'font-weight': '700',
275
+ 'line-height': 'var(--line-height-sm)',
276
+ }, '.typo-mono-xs-regular': {
277
+ 'font-family': 'TT Norms Pro Mono',
278
+ 'font-size': 'var(--font-size-xs)',
279
+ 'font-weight': '400',
280
+ 'line-height': 'var(--line-height-xs)',
281
+ }, '.typo-mono-xs-medium': {
282
+ 'font-family': 'TT Norms Pro Mono',
283
+ 'font-size': 'var(--font-size-xs)',
284
+ 'font-weight': '500',
285
+ 'line-height': 'var(--line-height-xs)',
286
+ }, '.typo-mono-xs-bold': {
287
+ 'font-family': 'TT Norms Pro Mono',
288
+ 'font-size': 'var(--font-size-xs)',
289
+ 'font-weight': '700',
290
+ 'line-height': 'var(--line-height-xs)',
103
291
  } }));
104
- }, {
105
- important: true,
106
292
  });
107
293
  exports.default = exports.novaTailwindPlugin;
package/dist/css/mccs.css CHANGED
@@ -270,14 +270,20 @@
270
270
  --color-level-20-background: var(--color-gray-ocean-700);
271
271
  --color-level-15-background: var(--color-gray-ocean-750);
272
272
  --color-level-10-background: var(--color-gray-ocean-800);
273
- --color-interaction-link-inverted-icon-hover: var(--color-petrol-400);
273
+ --color-interaction-link-inverted-text-visited: var(--color-petrol-400);
274
274
  --color-interaction-link-inverted-text-hover: var(--color-petrol-400);
275
- --color-interaction-link-low-icon-hover: var(--color-petrol-400);
275
+ --color-interaction-link-inverted-icon-visited: var(--color-petrol-600);
276
+ --color-interaction-link-inverted-icon-hover: var(--color-petrol-400);
277
+ --color-interaction-link-low-text-visited: var(--color-petrol-600);
276
278
  --color-interaction-link-low-text-hover: var(--color-petrol-400);
277
- --color-interaction-link-high-icon-hover: var(--color-petrol-300);
278
- --color-interaction-link-high-icon: var(--color-petrol-400);
279
+ --color-interaction-link-low-icon-visited: var(--color-petrol-600);
280
+ --color-interaction-link-low-icon-hover: var(--color-petrol-400);
281
+ --color-interaction-link-high-text-visited: var(--color-petrol-600);
279
282
  --color-interaction-link-high-text-hover: var(--color-petrol-300);
280
283
  --color-interaction-link-high-text: var(--color-petrol-400);
284
+ --color-interaction-link-high-icon-visited: var(--color-petrol-600);
285
+ --color-interaction-link-high-icon-hover: var(--color-petrol-300);
286
+ --color-interaction-link-high-icon: var(--color-petrol-400);
281
287
  --color-interaction-container-neutral-text-active: var(--color-petrol-300);
282
288
  --color-interaction-container-neutral-icon-active: var(--color-petrol-300);
283
289
  --color-interaction-container-neutral-border-active: var(--color-petrol-300);
@@ -329,7 +335,11 @@
329
335
  --components-menu-contextual-border: var(--color-content-low-border);
330
336
  --components-menu-contextual-background: var(--color-level-00-background);
331
337
  --components-calendar-background: var(--color-level-00-background);
332
- --components-calendar-cell-text-today: var(--color-interaction-container-neutral-text-active);
338
+ --components-calendar-weeks-text-hover: var(--color-content-high-text);
339
+ --components-calendar-weeks-text: var(--color-level-inverted-15-background);
340
+ --components-calendar-weeks-background-hover: var(--color-level-15-background);
341
+ --components-calendar-weeks-background: var(--color-level-10-background);
342
+ --components-calendar-cell-text-today: var(--color-content-high-text);
333
343
  --components-calendar-cell-text-outside-month: var(--color-content-lower-text);
334
344
  --components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
335
345
  --components-calendar-cell-text-selected: var(--color-interaction-container-branded-high-text-active);
@@ -337,10 +347,6 @@
337
347
  --components-calendar-cell-dot-selected: var(--color-interaction-container-branded-high-icon-active);
338
348
  --components-calendar-cell-dot: var(--color-content-high-icon);
339
349
  --components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
340
- --components-calendar-weeks-text-hover: var(--color-content-high-text);
341
- --components-calendar-weeks-text: var(--color-level-inverted-15-background);
342
- --components-calendar-weeks-background-hover: var(--color-level-15-background);
343
- --components-calendar-weeks-background: var(--color-level-10-background);
344
350
  --components-calendar-header-text: var(--color-content-high-text);
345
351
  --components-calendar-border: var(--color-content-low-border);
346
352
  --components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
@@ -488,13 +494,20 @@
488
494
  --components-button-high-background-active: var(--color-interaction-container-branded-high-background-hover);
489
495
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
490
496
  --color-focus-success: var(--color-feedback-success-low-border);
497
+ --color-focus-destructive-in-field: var(--color-feedback-error-low-border);
491
498
  --color-focus-destructive: var(--color-feedback-error-high-border);
492
499
  --color-focus-background-inverted: var(--color-level-inverted-00-background);
493
500
  --color-focus-background: var(--color-level-00-background);
494
- --color-interaction-link-inverted-icon: var(--color-content-inverted-medium-icon);
501
+ --color-interaction-link-inverted-text-inactive: var(--color-content-inverted-low-text);
495
502
  --color-interaction-link-inverted-text: var(--color-content-inverted-medium-text);
496
- --color-interaction-link-low-icon: var(--color-content-high-text);
503
+ --color-interaction-link-inverted-icon-inactive: var(--color-content-inverted-low-icon);
504
+ --color-interaction-link-inverted-icon: var(--color-content-inverted-medium-icon);
505
+ --color-interaction-link-low-text-inactive: var(--color-content-low-text);
497
506
  --color-interaction-link-low-text: var(--color-content-high-text);
507
+ --color-interaction-link-low-icon-inactive: var(--color-content-low-icon);
508
+ --color-interaction-link-low-icon: var(--color-content-high-text);
509
+ --color-interaction-link-high-text-inactive: var(--color-content-low-text);
510
+ --color-interaction-link-high-icon-inactive: var(--color-content-low-icon);
498
511
  --color-interaction-container-neutral-text-hover: var(--color-content-medium-text);
499
512
  --color-interaction-container-neutral-text: var(--color-content-low-text);
500
513
  --color-interaction-container-neutral-icon-hover: var(--color-content-medium-text);
@@ -676,7 +689,7 @@
676
689
  --color-rainbow-5-text: var(--color-turquoise-800);
677
690
  --color-rainbow-5-icon: var(--color-turquoise-800);
678
691
  --color-rainbow-5-border: var(--color-turquoise-800);
679
- --color-rainbow-5-background: var(--color-turquoise-100);
692
+ --color-rainbow-5-background: var(--color-turquoise-50);
680
693
  --color-rainbow-4-text: var(--color-red-500);
681
694
  --color-rainbow-4-icon: var(--color-red-500);
682
695
  --color-rainbow-4-border: var(--color-red-500);
@@ -713,7 +726,7 @@
713
726
  --color-feedback-neutral-low-text: var(--color-gray-ocean-400);
714
727
  --color-feedback-neutral-low-icon: var(--color-gray-ocean-400);
715
728
  --color-feedback-neutral-low-border: var(--color-gray-ocean-400);
716
- --color-feedback-neutral-low-background: var(--color-gray-ocean-75);
729
+ --color-feedback-neutral-low-background: var(--color-gray-ocean-50);
717
730
  --color-feedback-neutral-high-text: var(--color-base-white);
718
731
  --color-feedback-neutral-high-icon: var(--color-base-white);
719
732
  --color-feedback-neutral-high-border: var(--color-gray-ocean-400);
@@ -784,14 +797,20 @@
784
797
  --color-level-20-background: var(--color-gray-ocean-00);
785
798
  --color-level-15-background: var(--color-gray-ocean-75);
786
799
  --color-level-10-background: var(--color-gray-ocean-50);
787
- --color-interaction-link-inverted-icon-hover: var(--color-petrol-600);
800
+ --color-interaction-link-inverted-text-visited: var(--color-petrol-600);
788
801
  --color-interaction-link-inverted-text-hover: var(--color-petrol-600);
789
- --color-interaction-link-low-icon-hover: var(--color-petrol-600);
802
+ --color-interaction-link-inverted-icon-visited: var(--color-petrol-400);
803
+ --color-interaction-link-inverted-icon-hover: var(--color-petrol-600);
804
+ --color-interaction-link-low-text-visited: var(--color-petrol-400);
790
805
  --color-interaction-link-low-text-hover: var(--color-petrol-600);
791
- --color-interaction-link-high-icon-hover: var(--color-petrol-700);
792
- --color-interaction-link-high-icon: var(--color-petrol-600);
806
+ --color-interaction-link-low-icon-visited: var(--color-petrol-400);
807
+ --color-interaction-link-low-icon-hover: var(--color-petrol-600);
808
+ --color-interaction-link-high-text-visited: var(--color-petrol-800);
793
809
  --color-interaction-link-high-text-hover: var(--color-petrol-700);
794
810
  --color-interaction-link-high-text: var(--color-petrol-600);
811
+ --color-interaction-link-high-icon-visited: var(--color-petrol-800);
812
+ --color-interaction-link-high-icon-hover: var(--color-petrol-700);
813
+ --color-interaction-link-high-icon: var(--color-petrol-600);
795
814
  --color-interaction-container-neutral-text-active: var(--color-petrol-700);
796
815
  --color-interaction-container-neutral-icon-active: var(--color-petrol-700);
797
816
  --color-interaction-container-neutral-border-active: var(--color-petrol-700);
@@ -843,7 +862,11 @@
843
862
  --components-menu-contextual-border: var(--color-content-low-border);
844
863
  --components-menu-contextual-background: var(--color-level-00-background);
845
864
  --components-calendar-background: var(--color-level-00-background);
846
- --components-calendar-cell-text-today: var(--color-interaction-container-neutral-text-active);
865
+ --components-calendar-weeks-text-hover: var(--color-content-high-text);
866
+ --components-calendar-weeks-text: var(--color-content-high-text);
867
+ --components-calendar-weeks-background-hover: var(--color-level-15-background);
868
+ --components-calendar-weeks-background: var(--color-level-10-background);
869
+ --components-calendar-cell-text-today: var(--color-content-high-text);
847
870
  --components-calendar-cell-text-outside-month: var(--color-content-lower-text);
848
871
  --components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
849
872
  --components-calendar-cell-text-selected: var(--color-interaction-container-branded-high-text-active);
@@ -851,10 +874,6 @@
851
874
  --components-calendar-cell-dot-selected: var(--color-interaction-container-branded-high-icon-active);
852
875
  --components-calendar-cell-dot: var(--color-content-high-icon);
853
876
  --components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
854
- --components-calendar-weeks-text-hover: var(--color-content-high-text);
855
- --components-calendar-weeks-text: var(--color-content-high-text);
856
- --components-calendar-weeks-background-hover: var(--color-level-15-background);
857
- --components-calendar-weeks-background: var(--color-level-10-background);
858
877
  --components-calendar-header-text: var(--color-content-high-text);
859
878
  --components-calendar-border: var(--color-content-low-border);
860
879
  --components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
@@ -1001,13 +1020,20 @@
1001
1020
  --components-button-high-background-active: var(--color-interaction-container-branded-high-background-hover);
1002
1021
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
1003
1022
  --color-focus-success: var(--color-feedback-success-low-border);
1023
+ --color-focus-destructive-in-field: var(--color-feedback-error-low-border);
1004
1024
  --color-focus-destructive: var(--color-feedback-error-high-border);
1005
1025
  --color-focus-background-inverted: var(--color-level-inverted-00-background);
1006
1026
  --color-focus-background: var(--color-level-00-background);
1007
- --color-interaction-link-inverted-icon: var(--color-content-inverted-medium-icon);
1027
+ --color-interaction-link-inverted-text-inactive: var(--color-content-inverted-low-text);
1008
1028
  --color-interaction-link-inverted-text: var(--color-content-inverted-medium-text);
1009
- --color-interaction-link-low-icon: var(--color-content-high-text);
1029
+ --color-interaction-link-inverted-icon-inactive: var(--color-content-inverted-low-icon);
1030
+ --color-interaction-link-inverted-icon: var(--color-content-inverted-medium-icon);
1031
+ --color-interaction-link-low-text-inactive: var(--color-content-low-text);
1010
1032
  --color-interaction-link-low-text: var(--color-content-high-text);
1033
+ --color-interaction-link-low-icon-inactive: var(--color-content-low-icon);
1034
+ --color-interaction-link-low-icon: var(--color-content-high-text);
1035
+ --color-interaction-link-high-text-inactive: var(--color-content-low-text);
1036
+ --color-interaction-link-high-icon-inactive: var(--color-content-low-icon);
1011
1037
  --color-interaction-container-neutral-text-hover: var(--color-content-medium-text);
1012
1038
  --color-interaction-container-neutral-text: var(--color-content-low-text);
1013
1039
  --color-interaction-container-neutral-icon-hover: var(--color-content-medium-text);
@@ -1133,7 +1159,7 @@
1133
1159
  --color-yellow-200: #ffe286;
1134
1160
  --color-yellow-100: #ffecb3;
1135
1161
  --color-yellow-50: #fff7df;
1136
- --color-turquoise-900: #203330;
1162
+ --color-turquoise-900: #1c2b28;
1137
1163
  --color-turquoise-800: #32504c;
1138
1164
  --color-turquoise-700: #456e68;
1139
1165
  --color-turquoise-600: #578b84;
@@ -1288,8 +1314,8 @@
1288
1314
  --color-crimson-300: #bd597c;
1289
1315
  --color-crimson-200: #cf869f;
1290
1316
  --color-crimson-100: #e0b3c2;
1291
- --color-crimson-50: #f2dfe6;
1292
- --color-amber-900: #482608;
1317
+ --color-crimson-50: #f7e9ee;
1318
+ --color-amber-900: #432306;
1293
1319
  --color-amber-800: #723d0c;
1294
1320
  --color-amber-700: #9c5311;
1295
1321
  --color-amber-600: #c66a15;
@@ -1325,6 +1351,7 @@
1325
1351
  --popover-font-weight: 500;
1326
1352
  --menu-contextual-item-font-weight: 500;
1327
1353
  --menu-contextual-divider-padding-bottom: 3px;
1354
+ --form-max-width: 480px;
1328
1355
  --form-field-badge-gap: 0px;
1329
1356
  --list-native-separator-padding-y: 3px;
1330
1357
  --list-native-separator-padding-x: 9px;
@@ -1394,7 +1421,9 @@
1394
1421
  --breadcrumb-padding-y: var(--spacing-1);
1395
1422
  --badge-radius: var(--radius-rounded-full);
1396
1423
  --badge-padding-y: var(--spacing-1);
1424
+ --badge-padding-icon-only-x: var(--spacing-1);
1397
1425
  --badge-padding-x: var(--spacing-2);
1426
+ --badge-gap-icon-only-x: var(--spacing-0);
1398
1427
  --badge-gap-x: var(--spacing-1);
1399
1428
  --avatar-xl-size: var(--spacing-16);
1400
1429
  --avatar-xl-icon-size: var(--spacing-11);