@planningcenter/tapestry 2.6.0 → 2.6.1-qa-522.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.
Files changed (52) hide show
  1. package/dist/components/button/BaseButton.d.ts.map +1 -1
  2. package/dist/components/button/BaseButton.js +3 -2
  3. package/dist/components/button/BaseButton.js.map +1 -1
  4. package/dist/components/button/IconButton.js +1 -1
  5. package/dist/components/button/IconButton.js.map +1 -1
  6. package/dist/components/button/PageHeaderActionsDropdownButton.js +1 -1
  7. package/dist/components/button/PageHeaderActionsDropdownButton.js.map +1 -1
  8. package/dist/components/link/BaseLink.d.ts.map +1 -1
  9. package/dist/components/link/BaseLink.js +5 -5
  10. package/dist/components/link/BaseLink.js.map +1 -1
  11. package/dist/index.css +540 -248
  12. package/dist/index.css.map +1 -1
  13. package/dist/index.d.ts +0 -1
  14. package/dist/index.d.ts.map +1 -1
  15. package/dist/jsTokens.d.ts +1 -1
  16. package/dist/jsTokens.d.ts.map +1 -1
  17. package/dist/jsTokens.js +1 -1
  18. package/dist/jsTokens.js.map +1 -1
  19. package/dist/print-no-media-queries.css +2 -0
  20. package/dist/print.css +2 -0
  21. package/dist/reactRender.css +1239 -947
  22. package/dist/reactRender.css.map +1 -1
  23. package/dist/reactRenderLegacy.css +1239 -947
  24. package/dist/reactRenderLegacy.css.map +1 -1
  25. package/dist/tokens/tokens-deprecated.json +326 -0
  26. package/dist/tokens-dark.css +92 -90
  27. package/dist/tokens-dark.css.map +1 -0
  28. package/dist/tokens-deprecated.css +106 -0
  29. package/dist/tokens-deprecated.css.map +1 -0
  30. package/dist/tokens-deprecated.js +3 -0
  31. package/dist/tokens.css +167 -175
  32. package/dist/tokens.css.map +1 -1
  33. package/dist/tokens.js +2 -0
  34. package/dist/unstable.css +559 -267
  35. package/dist/unstable.css.map +1 -1
  36. package/dist/unstable.d.ts +1 -1
  37. package/dist/unstable.d.ts.map +1 -1
  38. package/dist/unstable.js +2 -1
  39. package/dist/unstable.js.map +1 -1
  40. package/package.json +10 -9
  41. package/dist/deprecated.css +0 -25
  42. package/dist/tokens/ts/react-native-tokens.d.ts +0 -1629
  43. package/dist/tokens/ts/react-native-tokens.d.ts.map +0 -1
  44. package/dist/tokens/ts/react-native-tokens.js +0 -418
  45. package/dist/tokens/ts/react-native-tokens.js.map +0 -1
  46. package/dist/tokens/ts/tokens.d.ts +0 -435
  47. package/dist/tokens/ts/tokens.d.ts.map +0 -1
  48. package/dist/tokens/ts/tokens.js +0 -437
  49. package/dist/tokens/ts/tokens.js.map +0 -1
  50. package/dist/tokens.d.ts +0 -3
  51. package/dist/tokens.d.ts.map +0 -1
  52. /package/dist/{tokens-dark-combined.js → tokens-dark.js} +0 -0
package/dist/tokens.css CHANGED
@@ -4,8 +4,8 @@
4
4
  --t-border-radius-lg:8px;
5
5
  --t-border-radius-xl:16px;
6
6
  --t-border-radius-round:56px;
7
- --t-border-radius-default:4px;
8
- --t-border-width-default:1px;
7
+ --t-border-radius:4px;
8
+ --t-border-width:1px;
9
9
  --t-border-width-thick:2px;
10
10
  --t-spacing-1:8px;
11
11
  --t-spacing-2:16px;
@@ -16,6 +16,7 @@
16
16
  --t-spacing-7:56px;
17
17
  --t-spacing-fourth:2px;
18
18
  --t-spacing-half:4px;
19
+ --t-spacing-1-half:12px;
19
20
  --t-element-size-3xl:48px;
20
21
  --t-element-size-2xl:32px;
21
22
  --t-element-size-xl:24px;
@@ -47,13 +48,13 @@
47
48
  --t-avatar-size-48:48px;
48
49
  --t-avatar-size-72:72px;
49
50
  --t-avatar-size-112:112px;
50
- --t-text-color-default-headline:hsl(0, 0%, 12%);
51
- --t-text-color-default-primary:hsl(0, 0%, 24%);
52
- --t-text-color-default-secondary:hsl(0, 0%, 42%);
53
- --t-text-color-default-disabled:hsl(0, 0%, 81%);
54
- --t-text-color-default-placeholder:hsl(0, 0%, 58%);
55
- --t-text-color-default-inverted:hsl(0, 0%, 100%);
56
- --t-text-color-interaction-primary:hsl(204, 100%, 40%);
51
+ --t-text-color-headline:hsl(0, 0%, 12%);
52
+ --t-text-color:hsl(0, 0%, 24%);
53
+ --t-text-color-secondary:hsl(0, 0%, 42%);
54
+ --t-text-color-disabled:hsl(0, 0%, 68%);
55
+ --t-text-color-placeholder:hsl(0, 0%, 58%);
56
+ --t-text-color-inverted:hsl(0, 0%, 100%);
57
+ --t-text-color-interaction:hsl(204, 100%, 40%);
57
58
  --t-text-color-interaction-hover:hsl(204, 100%, 35%);
58
59
  --t-text-color-interaction-active:hsl(204, 100%, 30%);
59
60
  --t-text-color-interaction-visited:hsl(204, 100%, 30%);
@@ -84,19 +85,19 @@
84
85
  --t-text-color-tag-bold-pink:hsl(327, 88%, 20%);
85
86
  --t-text-color-tag-bold-purple:hsl(268, 71%, 27%);
86
87
  --t-text-color-tag-bold-magenta:hsl(285, 71%, 20%);
87
- --t-icon-color-default-primary:hsl(0, 0%, 24%);
88
- --t-icon-color-default-secondary:hsl(0, 0%, 42%);
89
- --t-icon-color-default-dim:hsl(0, 0%, 58%);
90
- --t-icon-color-default-disabled:hsl(0, 0%, 81%);
91
- --t-icon-color-default-inverted:hsl(0, 0%, 100%);
92
- --t-icon-color-status-neutral-primary:hsl(0, 0%, 42%);
88
+ --t-icon-color:hsl(0, 0%, 24%);
89
+ --t-icon-color-secondary:hsl(0, 0%, 42%);
90
+ --t-icon-color-dim:hsl(0, 0%, 58%);
91
+ --t-icon-color-disabled:hsl(0, 0%, 81%);
92
+ --t-icon-color-inverted:hsl(0, 0%, 100%);
93
+ --t-icon-color-status-neutral:hsl(0, 0%, 42%);
93
94
  --t-icon-color-status-neutral-secondary:hsl(0, 0%, 58%);
94
95
  --t-icon-color-status-neutral-bold:hsl(0, 0%, 24%);
95
- --t-icon-color-status-info-primary:hsl(204, 100%, 40%);
96
- --t-icon-color-status-success-primary:hsl(96, 57%, 33%);
96
+ --t-icon-color-status-info:hsl(204, 100%, 40%);
97
+ --t-icon-color-status-success:hsl(96, 57%, 33%);
97
98
  --t-icon-color-status-success-secondary:hsl(97, 57%, 40%);
98
- --t-icon-color-status-warning-primary:hsl(42, 84%, 49%);
99
- --t-icon-color-status-error-primary:hsl(8, 60%, 47%);
99
+ --t-icon-color-status-warning:hsl(42, 84%, 49%);
100
+ --t-icon-color-status-error:hsl(8, 60%, 47%);
100
101
  --t-fill-color-neutral-100:hsl(0, 0%, 100%);
101
102
  --t-fill-color-neutral-000:hsl(0, 0%, 12%);
102
103
  --t-fill-color-neutral-010:hsl(0, 0%, 24%);
@@ -109,32 +110,32 @@
109
110
  --t-fill-color-neutral-070:hsl(0, 0%, 95%);
110
111
  --t-fill-color-neutral-080:hsl(0, 0%, 97%);
111
112
  --t-fill-color-neutral-090:hsl(0, 0%, 98%);
112
- --t-fill-color-interaction-default:hsl(204, 100%, 40%);
113
+ --t-fill-color-interaction:hsl(204, 100%, 40%);
113
114
  --t-fill-color-interaction-hover:hsl(204, 100%, 35%);
114
115
  --t-fill-color-interaction-active:hsl(204, 100%, 30%);
115
116
  --t-fill-color-interaction-disabled:hsl(0, 0%, 81%);
116
117
  --t-fill-color-control-neutral-off:hsl(0, 0%, 58%);
117
118
  --t-fill-color-control-neutral-on:hsl(0, 0%, 24%);
118
- --t-fill-color-control-primary:hsl(204, 100%, 40%);
119
+ --t-fill-color-control:hsl(204, 100%, 40%);
119
120
  --t-fill-color-control-secondary:hsl(97, 57%, 40%);
120
121
  --t-fill-color-control-error:hsl(8, 60%, 47%);
121
122
  --t-fill-color-control-disabled:hsl(0, 0%, 81%);
122
- --t-fill-color-status-neutral-solid:hsl(0, 0%, 42%);
123
+ --t-fill-color-status-neutral:hsl(0, 0%, 42%);
123
124
  --t-fill-color-status-neutral-ghost:hsl(0, 0%, 93%);
124
125
  --t-fill-color-status-neutral-dim:hsl(0, 0%, 97%);
125
- --t-fill-color-status-info-solid:hsl(204, 100%, 40%);
126
+ --t-fill-color-status-info:hsl(204, 100%, 40%);
126
127
  --t-fill-color-status-info-ghost:hsl(203, 94%, 94%);
127
128
  --t-fill-color-status-info-dim:hsl(204, 100%, 97%);
128
- --t-fill-color-status-success-solid:hsl(96, 57%, 33%);
129
+ --t-fill-color-status-success:hsl(96, 57%, 33%);
129
130
  --t-fill-color-status-success-ghost:hsl(97, 57%, 90%);
130
131
  --t-fill-color-status-success-dim:hsl(96, 60%, 95%);
131
- --t-fill-color-status-warning-solid:hsl(42, 84%, 63%);
132
+ --t-fill-color-status-warning:hsl(42, 84%, 63%);
132
133
  --t-fill-color-status-warning-ghost:hsl(42, 87%, 94%);
133
134
  --t-fill-color-status-warning-dim:hsl(42, 87%, 97%);
134
- --t-fill-color-status-error-solid:hsl(8, 60%, 47%);
135
+ --t-fill-color-status-error:hsl(8, 60%, 47%);
135
136
  --t-fill-color-status-error-ghost:hsl(9, 59%, 93%);
136
137
  --t-fill-color-status-error-dim:hsl(7, 60%, 97%);
137
- --t-fill-color-tooltip-primary:hsla(0, 0%, 12%, 0.9);
138
+ --t-fill-color-tooltip:hsla(0, 0%, 12%, 0.9);
138
139
  --t-fill-color-product-accounts-010:hsl(212, 54%, 93%);
139
140
  --t-fill-color-product-accounts-020:hsl(209, 53%, 90%);
140
141
  --t-fill-color-product-accounts-030:hsl(210, 56%, 70%);
@@ -183,6 +184,14 @@
183
184
  --t-fill-color-product-home-060:hsl(221, 90%, 50%);
184
185
  --t-fill-color-product-home-070:hsl(221, 90%, 45%);
185
186
  --t-fill-color-product-home-080:hsl(218, 84%, 25%);
187
+ --t-fill-color-product-musicstand-010:hsl(207, 61%, 93%);
188
+ --t-fill-color-product-musicstand-020:hsl(207, 61%, 90%);
189
+ --t-fill-color-product-musicstand-030:hsl(207, 58%, 85%);
190
+ --t-fill-color-product-musicstand-040:hsl(207, 59%, 60%);
191
+ --t-fill-color-product-musicstand-050:hsl(207, 59%, 50%);
192
+ --t-fill-color-product-musicstand-060:hsl(207, 59%, 40%);
193
+ --t-fill-color-product-musicstand-070:hsl(207, 59%, 35%);
194
+ --t-fill-color-product-musicstand-080:hsl(207, 59%, 25%);
186
195
  --t-fill-color-product-people-010:hsl(219, 73%, 91%);
187
196
  --t-fill-color-product-people-020:hsl(220, 69%, 81%);
188
197
  --t-fill-color-product-people-030:hsl(221, 73%, 71%);
@@ -215,7 +224,7 @@
215
224
  --t-fill-color-product-services-060:hsl(89, 62%, 31%);
216
225
  --t-fill-color-product-services-070:hsl(89, 62%, 26%);
217
226
  --t-fill-color-product-services-080:hsl(89, 63%, 21%);
218
- --t-fill-color-product-staff-base:hsl(328, 100%, 45%);
227
+ --t-fill-color-product-staff:hsl(328, 100%, 45%);
219
228
  --t-fill-color-product-staff-dark:hsl(328, 100%, 38%);
220
229
  --t-fill-color-product-staff-darker:hsl(328, 100%, 33%);
221
230
  --t-fill-color-product-accounts-gradient-brand:linear-gradient(135deg, hsl(203, 86%, 57%), hsl(220, 76%, 57%));
@@ -295,47 +304,47 @@
295
304
  --t-fill-color-tag-indigo-020:hsl(233, 79%, 87%);
296
305
  --t-fill-color-tag-indigo-030:hsl(233, 77%, 81%);
297
306
  --t-fill-color-tag-indigo-040:hsl(236, 79%, 74%);
298
- --t-fill-color-button-neutral-solid-default:hsl(0, 0%, 93%);
307
+ --t-fill-color-button-neutral-solid:hsl(0, 0%, 93%);
299
308
  --t-fill-color-button-neutral-solid-hover:hsl(0, 0%, 88%);
300
309
  --t-fill-color-button-neutral-solid-active:hsl(0, 0%, 81%);
301
310
  --t-fill-color-button-neutral-solid-disabled:hsl(0, 0%, 95%);
302
- --t-fill-color-button-neutral-outline-dim-default:hsla(0, 0%, 100%, 0);
303
- --t-fill-color-button-neutral-outline-dim-hover:hsl(0, 0%, 95%);
304
- --t-fill-color-button-neutral-outline-dim-active:hsl(0, 0%, 93%);
305
- --t-fill-color-button-neutral-outline-dim-disabled:hsl(0, 0%, 98%);
306
- --t-fill-color-button-neutral-ghost-default:hsla(0, 0%, 100%, 0);
311
+ --t-fill-color-button-neutral-outline:hsla(0, 0%, 100%, 0);
312
+ --t-fill-color-button-neutral-outline-hover:hsl(0, 0%, 95%);
313
+ --t-fill-color-button-neutral-outline-active:hsl(0, 0%, 93%);
314
+ --t-fill-color-button-neutral-outline-disabled:hsl(0, 0%, 98%);
315
+ --t-fill-color-button-neutral-ghost:hsla(0, 0%, 100%, 0);
307
316
  --t-fill-color-button-neutral-ghost-hover:hsl(0, 0%, 95%);
308
317
  --t-fill-color-button-neutral-ghost-active:hsl(0, 0%, 93%);
309
318
  --t-fill-color-button-neutral-ghost-disabled:hsla(0, 0%, 100%, 0);
310
- --t-fill-color-button-neutral-responsive-header-default:hsla(0, 0%, 0%, 0.1);
319
+ --t-fill-color-button-neutral-responsive-header:hsla(0, 0%, 0%, 0.1);
311
320
  --t-fill-color-button-neutral-responsive-header-hover:hsla(0, 0%, 0%, 0.2);
312
321
  --t-fill-color-button-neutral-responsive-header-active:hsla(0, 0%, 0%, 0.3);
313
322
  --t-fill-color-button-neutral-responsive-header-disabled:hsla(0, 0%, 0%, 0.05);
314
- --t-fill-color-button-interaction-solid-default:hsl(204, 100%, 40%);
323
+ --t-fill-color-button-interaction-solid:hsl(204, 100%, 40%);
315
324
  --t-fill-color-button-interaction-solid-hover:hsl(204, 100%, 35%);
316
325
  --t-fill-color-button-interaction-solid-active:hsl(204, 100%, 30%);
317
326
  --t-fill-color-button-interaction-solid-disabled:hsl(0, 0%, 95%);
318
- --t-fill-color-button-interaction-outline-dim-default:hsla(0, 0%, 100%, 0);
319
- --t-fill-color-button-interaction-outline-dim-hover:hsl(204, 100%, 97%);
320
- --t-fill-color-button-interaction-outline-dim-active:hsl(203, 94%, 94%);
321
- --t-fill-color-button-interaction-outline-dim-disabled:hsl(0, 0%, 98%);
322
- --t-fill-color-button-interaction-ghost-default:hsla(0, 0%, 100%, 0);
327
+ --t-fill-color-button-interaction-outline:hsla(0, 0%, 100%, 0);
328
+ --t-fill-color-button-interaction-outline-hover:hsl(204, 100%, 97%);
329
+ --t-fill-color-button-interaction-outline-active:hsl(203, 94%, 94%);
330
+ --t-fill-color-button-interaction-outline-disabled:hsl(0, 0%, 98%);
331
+ --t-fill-color-button-interaction-ghost:hsla(0, 0%, 100%, 0);
323
332
  --t-fill-color-button-interaction-ghost-hover:hsl(204, 100%, 97%);
324
333
  --t-fill-color-button-interaction-ghost-active:hsl(203, 94%, 94%);
325
334
  --t-fill-color-button-interaction-ghost-disabled:hsla(0, 0%, 100%, 0);
326
- --t-fill-color-button-delete-solid-default:hsl(8, 60%, 47%);
335
+ --t-fill-color-button-delete-solid:hsl(8, 60%, 47%);
327
336
  --t-fill-color-button-delete-solid-hover:hsl(8, 60%, 45%);
328
337
  --t-fill-color-button-delete-solid-active:hsl(8, 60%, 40%);
329
338
  --t-fill-color-button-delete-solid-disabled:hsl(0, 0%, 95%);
330
- --t-fill-color-button-delete-outline-dim-default:hsla(0, 0%, 100%, 0);
331
- --t-fill-color-button-delete-outline-dim-hover:hsl(7, 60%, 97%);
332
- --t-fill-color-button-delete-outline-dim-active:hsl(9, 59%, 93%);
333
- --t-fill-color-button-delete-outline-dim-disabled:hsl(0, 0%, 98%);
334
- --t-fill-color-button-delete-ghost-default:hsla(0, 0%, 100%, 0);
339
+ --t-fill-color-button-delete-outline:hsla(0, 0%, 100%, 0);
340
+ --t-fill-color-button-delete-outline-hover:hsl(7, 60%, 97%);
341
+ --t-fill-color-button-delete-outline-active:hsl(9, 59%, 93%);
342
+ --t-fill-color-button-delete-outline-disabled:hsl(0, 0%, 98%);
343
+ --t-fill-color-button-delete-ghost:hsla(0, 0%, 100%, 0);
335
344
  --t-fill-color-button-delete-ghost-hover:hsl(7, 60%, 97%);
336
345
  --t-fill-color-button-delete-ghost-active:hsl(9, 59%, 93%);
337
346
  --t-fill-color-button-delete-ghost-disabled:hsla(0, 0%, 100%, 0);
338
- --t-fill-color-button-pill-default:hsl(0, 0%, 93%);
347
+ --t-fill-color-button-pill:hsl(0, 0%, 93%);
339
348
  --t-fill-color-button-pill-hover:hsl(0, 0%, 88%);
340
349
  --t-fill-color-button-pill-active:hsl(0, 0%, 88%);
341
350
  --t-fill-color-button-pill-disabled:hsl(0, 0%, 93%);
@@ -368,13 +377,13 @@
368
377
  --t-fill-color-transparency-dark-static-090:hsla(0, 0%, 0%, 0.9);
369
378
  --t-surface-color-card:hsl(0, 0%, 100%);
370
379
  --t-surface-color-canvas:hsl(0, 0%, 100%);
371
- --t-border-color-default-base:hsl(0, 0%, 88%);
372
- --t-border-color-default-dark:hsl(0, 0%, 81%);
373
- --t-border-color-default-darker:hsl(0, 0%, 68%);
374
- --t-border-color-default-darkest:hsl(0, 0%, 58%);
375
- --t-border-color-default-disabled:hsl(0, 0%, 88%);
376
- --t-border-color-default-dim:hsl(0, 0%, 95%);
377
- --t-border-color-default-white:hsl(0, 0%, 100%);
380
+ --t-border-color:hsl(0, 0%, 88%);
381
+ --t-border-color-dark:hsl(0, 0%, 81%);
382
+ --t-border-color-darker:hsl(0, 0%, 68%);
383
+ --t-border-color-darkest:hsl(0, 0%, 58%);
384
+ --t-border-color-disabled:hsl(0, 0%, 88%);
385
+ --t-border-color-dim:hsl(0, 0%, 95%);
386
+ --t-border-color-white:hsl(0, 0%, 100%);
378
387
  --t-border-color-status-neutral:hsl(0, 0%, 58%);
379
388
  --t-border-color-status-info:hsl(204, 100%, 40%);
380
389
  --t-border-color-status-success:hsl(97, 57%, 40%);
@@ -389,55 +398,38 @@
389
398
  --t-border-color-control-success:hsl(97, 57%, 40%);
390
399
  --t-border-color-control-warning:hsl(42, 84%, 63%);
391
400
  --t-border-color-control-error:hsl(8, 60%, 47%);
392
- --t-border-color-control-disabled:hsl(0, 0%, 88%);
401
+ --t-border-color-control-disabled:hsl(0, 0%, 81%);
393
402
  --t-shadow-overflow-color:hsla(0, 0%, 0%, 0.07);
403
+ --t-font-sans-serif:ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
404
+ --t-font-monospace:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
394
405
  --t-form-background-color:var(--t-fill-color-neutral-100);
395
406
  --t-form-background-color-disabled:var(--t-fill-color-neutral-070);
396
407
  --t-form-background-color-error:var(--t-fill-color-neutral-100);
397
408
  --t-form-background-color-readonly:var(--t-fill-color-neutral-070);
398
- --t-form-border-color:var(--t-border-color-default-base);
399
- --t-form-border-color-disabled:var(--t-border-color-default-base);
409
+ --t-form-border-color:var(--t-border-color);
410
+ --t-form-border-color-disabled:var(--t-border-color);
400
411
  --t-form-border-color-error:var(--t-border-color-status-error);
401
- --t-form-border-color-focus:var(--t-fill-color-interaction-default);
402
- --t-form-border-color-hover:var(--t-border-color-default-dark);
412
+ --t-form-border-color-focus:var(--t-fill-color-interaction);
413
+ --t-form-border-color-hover:var(--t-border-color-dark);
403
414
  --t-form-border-color-readonly:hsla(0, 0%, 100%, 0);
404
415
  --t-form-border-radius:var(--t-border-radius-md);
405
- --t-form-border-width:var(--t-border-width-default);
406
- --t-form-font-color:var(--t-text-color-default-primary);
407
- --t-form-font-color-disabled:var(--t-text-color-default-disabled);
416
+ --t-form-border-width:var(--t-border-width);
417
+ --t-form-font-color:var(--t-text-color);
418
+ --t-form-font-color-disabled:var(--t-text-color-disabled);
408
419
  --t-form-font-color-error:var(--t-text-color-status-error);
409
- --t-form-font-color-readonly:var(--t-text-color-default-primary);
410
- --t-form-picker-icon-color:var(--t-icon-color-default-primary);
411
- --t-form-placeholder-color:var(--t-text-color-default-placeholder);
412
- --t-border-size-default:var(--t-border-width-default);
413
- --t-border-size-thick:var(--t-border-width-thick);
414
- --t-font-weight-semi-bold:var(--t-font-weight-semibold);
415
- --t-icon-color-status-neutral-dark:hsl(0, 0%, 24%);
416
- --t-icon-color-status-info-secondary:hsl(204, 100%, 40%);
417
- --t-fill-color-alert-info:hsl(204, 94%, 49%);
418
- --t-fill-color-alert-success:hsl(122, 60%, 41%);
419
- --t-fill-color-alert-warning:hsl(43, 96%, 58%);
420
- --t-fill-color-alert-error:hsl(4, 77%, 59%);
421
- --t-fill-color-button-neutral-outline-dim-disabled-solid:hsl(0, 0%, 98%);
422
- --t-fill-color-button-neutral-ghost-disabled-solid:hsl(0, 0%, 98%);
423
- --t-fill-color-button-create-solid-default:hsl(96, 57%, 33%);
424
- --t-fill-color-button-create-solid-hover:hsl(97, 57%, 28%);
425
- --t-fill-color-button-create-solid-active:hsl(97, 57%, 23%);
426
- --t-fill-color-button-create-solid-disabled:hsl(0, 0%, 81%);
427
- --t-fill-color-button-create-ghost-default:hsla(0, 0%, 100%, 0);
428
- --t-fill-color-button-create-ghost-hover:hsl(96, 60%, 95%);
429
- --t-fill-color-button-create-ghost-active:hsl(97, 57%, 90%);
430
- --t-fill-color-button-create-ghost-disabled:hsla(0, 0%, 100%, 0);
420
+ --t-form-font-color-readonly:var(--t-text-color);
421
+ --t-form-picker-icon-color:var(--t-icon-color);
422
+ --t-form-placeholder-color:var(--t-text-color-placeholder);
431
423
  }
432
424
 
433
425
  :root[data-color-mode="dark"]{
434
426
  color-scheme:dark;
435
- --t-text-color-default-headline:hsl(0, 0%, 94%);
436
- --t-text-color-default-primary:hsl(0, 0%, 80%);
437
- --t-text-color-default-secondary:hsl(0, 0%, 54%);
438
- --t-text-color-default-disabled:hsl(0, 0%, 25%);
439
- --t-text-color-default-placeholder:hsl(0, 0%, 38%);
440
- --t-text-color-interaction-primary:hsl(204, 68%, 55%);
427
+ --t-text-color-headline:hsl(0, 0%, 94%);
428
+ --t-text-color:hsl(0, 0%, 80%);
429
+ --t-text-color-secondary:hsl(0, 0%, 54%);
430
+ --t-text-color-disabled:hsl(0, 0%, 32%);
431
+ --t-text-color-placeholder:hsl(0, 0%, 38%);
432
+ --t-text-color-interaction:hsl(204, 68%, 55%);
441
433
  --t-text-color-interaction-hover:hsl(204, 68%, 50%);
442
434
  --t-text-color-interaction-active:hsl(204, 68%, 45%);
443
435
  --t-text-color-interaction-visited:hsl(204, 68%, 50%);
@@ -468,15 +460,15 @@
468
460
  --t-text-color-tag-bold-pink:hsl(0, 0%, 100%);
469
461
  --t-text-color-tag-bold-purple:hsl(0, 0%, 100%);
470
462
  --t-text-color-tag-bold-magenta:hsl(0, 0%, 100%);
471
- --t-icon-color-default-primary:hsl(0, 0%, 80%);
472
- --t-icon-color-default-secondary:hsl(0, 0%, 54%);
473
- --t-icon-color-default-dim:hsl(0, 0%, 38%);
474
- --t-icon-color-default-disabled:hsl(0, 0%, 25%);
475
- --t-icon-color-status-neutral-primary:hsl(0, 0%, 54%);
463
+ --t-icon-color:hsl(0, 0%, 80%);
464
+ --t-icon-color-secondary:hsl(0, 0%, 54%);
465
+ --t-icon-color-dim:hsl(0, 0%, 38%);
466
+ --t-icon-color-disabled:hsl(0, 0%, 25%);
467
+ --t-icon-color-status-neutral:hsl(0, 0%, 54%);
476
468
  --t-icon-color-status-neutral-secondary:hsl(0, 0%, 38%);
477
469
  --t-icon-color-status-neutral-bold:hsl(0, 0%, 80%);
478
- --t-icon-color-status-info-primary:hsl(204, 68%, 55%);
479
- --t-icon-color-status-error-primary:hsl(8, 61%, 61%);
470
+ --t-icon-color-status-info:hsl(204, 68%, 55%);
471
+ --t-icon-color-status-error:hsl(8, 61%, 61%);
480
472
  --t-fill-color-neutral-100:hsl(0, 0%, 10%);
481
473
  --t-fill-color-neutral-000:hsl(0, 0%, 98%);
482
474
  --t-fill-color-neutral-010:hsl(0, 0%, 88%);
@@ -489,18 +481,18 @@
489
481
  --t-fill-color-neutral-070:hsl(0, 0%, 17%);
490
482
  --t-fill-color-neutral-080:hsl(0, 0%, 15%);
491
483
  --t-fill-color-neutral-090:hsl(0, 0%, 12%);
492
- --t-fill-color-interaction-default:hsl(204, 100%, 35%);
484
+ --t-fill-color-interaction:hsl(204, 100%, 35%);
493
485
  --t-fill-color-interaction-hover:hsl(204, 100%, 40%);
494
486
  --t-fill-color-interaction-active:hsl(204, 80%, 45%);
495
487
  --t-fill-color-interaction-disabled:hsl(0, 0%, 25%);
496
488
  --t-fill-color-control-neutral-off:hsl(0, 0%, 32%);
497
489
  --t-fill-color-control-neutral-on:hsl(0, 0%, 50%);
498
- --t-fill-color-control-primary:hsl(204, 100%, 35%);
490
+ --t-fill-color-control:hsl(204, 100%, 35%);
499
491
  --t-fill-color-control-disabled:hsl(0, 0%, 20%);
500
- --t-fill-color-status-neutral-solid:hsl(0, 0%, 24%);
492
+ --t-fill-color-status-neutral:hsl(0, 0%, 24%);
501
493
  --t-fill-color-status-neutral-ghost:hsl(0, 0%, 18%);
502
494
  --t-fill-color-status-neutral-dim:hsl(0, 0%, 15%);
503
- --t-fill-color-status-info-solid:hsl(204, 100%, 35%);
495
+ --t-fill-color-status-info:hsl(204, 100%, 35%);
504
496
  --t-fill-color-status-info-ghost:hsl(204, 32%, 15%);
505
497
  --t-fill-color-status-info-dim:hsl(206, 22%, 15%);
506
498
  --t-fill-color-status-success-ghost:hsl(125, 17%, 15%);
@@ -509,7 +501,7 @@
509
501
  --t-fill-color-status-warning-dim:hsl(42, 13%, 15%);
510
502
  --t-fill-color-status-error-ghost:hsl(8, 20%, 16%);
511
503
  --t-fill-color-status-error-dim:hsl(10, 16%, 15%);
512
- --t-fill-color-tooltip-primary:hsla(0, 0%, 24%, 0.9);
504
+ --t-fill-color-tooltip:hsla(0, 0%, 24%, 0.9);
513
505
  --t-fill-color-product-accounts-gradient-page:linear-gradient(111.72deg, hsl(220, 30%, 21%), hsl(220, 48%, 17%), hsl(204, 70%, 12%));
514
506
  --t-fill-color-product-accounts-gradient-tint:linear-gradient(111.72deg, hsl(219, 21%, 16%), hsl(220, 30%, 14%), hsl(203, 37%, 11%));
515
507
  --t-fill-color-product-calendar-gradient-page:linear-gradient(111.72deg, hsl(8, 48%, 15%), hsl(278, 13%, 17%), hsl(204, 70%, 12%));
@@ -574,43 +566,43 @@
574
566
  --t-fill-color-tag-indigo-020:hsl(236, 22%, 29%);
575
567
  --t-fill-color-tag-indigo-030:hsl(236, 26%, 50%);
576
568
  --t-fill-color-tag-indigo-040:hsl(236, 34%, 56%);
577
- --t-fill-color-button-neutral-solid-default:hsl(0, 0%, 19%);
569
+ --t-fill-color-button-neutral-solid:hsl(0, 0%, 19%);
578
570
  --t-fill-color-button-neutral-solid-hover:hsl(0, 0%, 24%);
579
571
  --t-fill-color-button-neutral-solid-active:hsl(0, 0%, 32%);
580
572
  --t-fill-color-button-neutral-solid-disabled:hsl(0, 0%, 12%);
581
- --t-fill-color-button-neutral-outline-dim-default:hsl(0, 0%, 15%);
582
- --t-fill-color-button-neutral-outline-dim-hover:hsl(0, 0%, 17%);
583
- --t-fill-color-button-neutral-outline-dim-active:hsl(0, 0%, 19%);
584
- --t-fill-color-button-neutral-outline-dim-disabled:hsl(0, 0%, 12%);
585
- --t-fill-color-button-neutral-ghost-default:hsla(0, 0%, 0%, 0);
573
+ --t-fill-color-button-neutral-outline:hsl(0, 0%, 15%);
574
+ --t-fill-color-button-neutral-outline-hover:hsl(0, 0%, 17%);
575
+ --t-fill-color-button-neutral-outline-active:hsl(0, 0%, 19%);
576
+ --t-fill-color-button-neutral-outline-disabled:hsl(0, 0%, 12%);
577
+ --t-fill-color-button-neutral-ghost:hsla(0, 0%, 0%, 0);
586
578
  --t-fill-color-button-neutral-ghost-hover:hsl(0, 0%, 17%);
587
579
  --t-fill-color-button-neutral-ghost-active:hsl(0, 0%, 19%);
588
580
  --t-fill-color-button-neutral-ghost-disabled:hsla(0, 0%, 0%, 0);
589
581
  --t-fill-color-button-neutral-responsive-header-disabled:hsla(0, 0%, 100%, 0.05);
590
- --t-fill-color-button-interaction-solid-default:hsl(204, 100%, 35%);
582
+ --t-fill-color-button-interaction-solid:hsl(204, 100%, 35%);
591
583
  --t-fill-color-button-interaction-solid-hover:hsl(204, 100%, 40%);
592
584
  --t-fill-color-button-interaction-solid-active:hsl(204, 80%, 45%);
593
585
  --t-fill-color-button-interaction-solid-disabled:hsl(0, 0%, 12%);
594
- --t-fill-color-button-interaction-outline-dim-default:hsl(204, 32%, 15%);
595
- --t-fill-color-button-interaction-outline-dim-hover:hsl(204, 39%, 17%);
596
- --t-fill-color-button-interaction-outline-dim-active:hsl(205, 45%, 18%);
597
- --t-fill-color-button-interaction-outline-dim-disabled:hsl(0, 0%, 12%);
598
- --t-fill-color-button-interaction-ghost-default:hsla(0, 0%, 0%, 0);
586
+ --t-fill-color-button-interaction-outline:hsl(204, 32%, 15%);
587
+ --t-fill-color-button-interaction-outline-hover:hsl(204, 39%, 17%);
588
+ --t-fill-color-button-interaction-outline-active:hsl(205, 45%, 18%);
589
+ --t-fill-color-button-interaction-outline-disabled:hsl(0, 0%, 12%);
590
+ --t-fill-color-button-interaction-ghost:hsla(0, 0%, 0%, 0);
599
591
  --t-fill-color-button-interaction-ghost-hover:hsl(204, 32%, 15%);
600
592
  --t-fill-color-button-interaction-ghost-active:hsl(204, 39%, 17%);
601
593
  --t-fill-color-button-interaction-ghost-disabled:hsla(0, 0%, 0%, 0);
602
- --t-fill-color-button-delete-solid-default:hsl(8, 60%, 40%);
594
+ --t-fill-color-button-delete-solid:hsl(8, 60%, 40%);
603
595
  --t-fill-color-button-delete-solid-active:hsl(8, 60%, 47%);
604
596
  --t-fill-color-button-delete-solid-disabled:hsl(0, 0%, 12%);
605
- --t-fill-color-button-delete-outline-dim-default:hsl(8, 20%, 16%);
606
- --t-fill-color-button-delete-outline-dim-hover:hsl(9, 24%, 17%);
607
- --t-fill-color-button-delete-outline-dim-active:hsl(9, 29%, 19%);
608
- --t-fill-color-button-delete-outline-dim-disabled:hsl(0, 0%, 12%);
609
- --t-fill-color-button-delete-ghost-default:hsla(0, 0%, 0%, 0);
597
+ --t-fill-color-button-delete-outline:hsl(8, 20%, 16%);
598
+ --t-fill-color-button-delete-outline-hover:hsl(9, 24%, 17%);
599
+ --t-fill-color-button-delete-outline-active:hsl(9, 29%, 19%);
600
+ --t-fill-color-button-delete-outline-disabled:hsl(0, 0%, 12%);
601
+ --t-fill-color-button-delete-ghost:hsla(0, 0%, 0%, 0);
610
602
  --t-fill-color-button-delete-ghost-hover:hsl(8, 20%, 16%);
611
603
  --t-fill-color-button-delete-ghost-active:hsl(9, 24%, 17%);
612
604
  --t-fill-color-button-delete-ghost-disabled:hsla(0, 0%, 0%, 0);
613
- --t-fill-color-button-pill-default:hsl(0, 0%, 18%);
605
+ --t-fill-color-button-pill:hsl(0, 0%, 18%);
614
606
  --t-fill-color-button-pill-hover:hsl(0, 0%, 21%);
615
607
  --t-fill-color-button-pill-active:hsl(0, 0%, 21%);
616
608
  --t-fill-color-button-pill-disabled:hsl(0, 0%, 18%);
@@ -634,13 +626,13 @@
634
626
  --t-fill-color-transparency-dark-090:hsla(0, 0%, 100%, 0.9);
635
627
  --t-surface-color-card:hsl(0, 0%, 12%);
636
628
  --t-surface-color-canvas:hsl(0, 0%, 10%);
637
- --t-border-color-default-base:hsl(0, 0%, 21%);
638
- --t-border-color-default-dark:hsl(0, 0%, 25%);
639
- --t-border-color-default-darker:hsl(0, 0%, 33%);
640
- --t-border-color-default-darkest:hsl(0, 0%, 38%);
641
- --t-border-color-default-disabled:hsl(0, 0%, 21%);
642
- --t-border-color-default-dim:hsl(0, 0%, 16%);
643
- --t-border-color-default-white:hsl(0, 0%, 12%);
629
+ --t-border-color:hsl(0, 0%, 21%);
630
+ --t-border-color-dark:hsl(0, 0%, 25%);
631
+ --t-border-color-darker:hsl(0, 0%, 33%);
632
+ --t-border-color-darkest:hsl(0, 0%, 38%);
633
+ --t-border-color-disabled:hsl(0, 0%, 21%);
634
+ --t-border-color-dim:hsl(0, 0%, 16%);
635
+ --t-border-color-white:hsl(0, 0%, 12%);
644
636
  --t-border-color-status-neutral:hsl(0, 0%, 38%);
645
637
  --t-border-color-status-info:hsl(204, 100%, 35%);
646
638
  --t-border-color-button-neutral:hsl(0, 0%, 19%);
@@ -649,19 +641,19 @@
649
641
  --t-border-color-button-delete:hsla(8, 60%, 47%, 0.25);
650
642
  --t-border-color-control-neutral:hsl(0, 0%, 33%);
651
643
  --t-border-color-control-info:hsl(204, 100%, 35%);
652
- --t-border-color-control-disabled:hsl(0, 0%, 21%);
644
+ --t-border-color-control-disabled:hsl(0, 0%, 24%);
653
645
  --t-shadow-overflow-color:hsla(0, 0%, 0%, 0.6);
654
646
  }
655
647
 
656
648
  @media (prefers-color-scheme: dark){
657
649
  :root[data-color-mode="system"]{
658
650
  color-scheme:dark;
659
- --t-text-color-default-headline:hsl(0, 0%, 94%);
660
- --t-text-color-default-primary:hsl(0, 0%, 80%);
661
- --t-text-color-default-secondary:hsl(0, 0%, 54%);
662
- --t-text-color-default-disabled:hsl(0, 0%, 25%);
663
- --t-text-color-default-placeholder:hsl(0, 0%, 38%);
664
- --t-text-color-interaction-primary:hsl(204, 68%, 55%);
651
+ --t-text-color-headline:hsl(0, 0%, 94%);
652
+ --t-text-color:hsl(0, 0%, 80%);
653
+ --t-text-color-secondary:hsl(0, 0%, 54%);
654
+ --t-text-color-disabled:hsl(0, 0%, 32%);
655
+ --t-text-color-placeholder:hsl(0, 0%, 38%);
656
+ --t-text-color-interaction:hsl(204, 68%, 55%);
665
657
  --t-text-color-interaction-hover:hsl(204, 68%, 50%);
666
658
  --t-text-color-interaction-active:hsl(204, 68%, 45%);
667
659
  --t-text-color-interaction-visited:hsl(204, 68%, 50%);
@@ -692,15 +684,15 @@
692
684
  --t-text-color-tag-bold-pink:hsl(0, 0%, 100%);
693
685
  --t-text-color-tag-bold-purple:hsl(0, 0%, 100%);
694
686
  --t-text-color-tag-bold-magenta:hsl(0, 0%, 100%);
695
- --t-icon-color-default-primary:hsl(0, 0%, 80%);
696
- --t-icon-color-default-secondary:hsl(0, 0%, 54%);
697
- --t-icon-color-default-dim:hsl(0, 0%, 38%);
698
- --t-icon-color-default-disabled:hsl(0, 0%, 25%);
699
- --t-icon-color-status-neutral-primary:hsl(0, 0%, 54%);
687
+ --t-icon-color:hsl(0, 0%, 80%);
688
+ --t-icon-color-secondary:hsl(0, 0%, 54%);
689
+ --t-icon-color-dim:hsl(0, 0%, 38%);
690
+ --t-icon-color-disabled:hsl(0, 0%, 25%);
691
+ --t-icon-color-status-neutral:hsl(0, 0%, 54%);
700
692
  --t-icon-color-status-neutral-secondary:hsl(0, 0%, 38%);
701
693
  --t-icon-color-status-neutral-bold:hsl(0, 0%, 80%);
702
- --t-icon-color-status-info-primary:hsl(204, 68%, 55%);
703
- --t-icon-color-status-error-primary:hsl(8, 61%, 61%);
694
+ --t-icon-color-status-info:hsl(204, 68%, 55%);
695
+ --t-icon-color-status-error:hsl(8, 61%, 61%);
704
696
  --t-fill-color-neutral-100:hsl(0, 0%, 10%);
705
697
  --t-fill-color-neutral-000:hsl(0, 0%, 98%);
706
698
  --t-fill-color-neutral-010:hsl(0, 0%, 88%);
@@ -713,18 +705,18 @@
713
705
  --t-fill-color-neutral-070:hsl(0, 0%, 17%);
714
706
  --t-fill-color-neutral-080:hsl(0, 0%, 15%);
715
707
  --t-fill-color-neutral-090:hsl(0, 0%, 12%);
716
- --t-fill-color-interaction-default:hsl(204, 100%, 35%);
708
+ --t-fill-color-interaction:hsl(204, 100%, 35%);
717
709
  --t-fill-color-interaction-hover:hsl(204, 100%, 40%);
718
710
  --t-fill-color-interaction-active:hsl(204, 80%, 45%);
719
711
  --t-fill-color-interaction-disabled:hsl(0, 0%, 25%);
720
712
  --t-fill-color-control-neutral-off:hsl(0, 0%, 32%);
721
713
  --t-fill-color-control-neutral-on:hsl(0, 0%, 50%);
722
- --t-fill-color-control-primary:hsl(204, 100%, 35%);
714
+ --t-fill-color-control:hsl(204, 100%, 35%);
723
715
  --t-fill-color-control-disabled:hsl(0, 0%, 20%);
724
- --t-fill-color-status-neutral-solid:hsl(0, 0%, 24%);
716
+ --t-fill-color-status-neutral:hsl(0, 0%, 24%);
725
717
  --t-fill-color-status-neutral-ghost:hsl(0, 0%, 18%);
726
718
  --t-fill-color-status-neutral-dim:hsl(0, 0%, 15%);
727
- --t-fill-color-status-info-solid:hsl(204, 100%, 35%);
719
+ --t-fill-color-status-info:hsl(204, 100%, 35%);
728
720
  --t-fill-color-status-info-ghost:hsl(204, 32%, 15%);
729
721
  --t-fill-color-status-info-dim:hsl(206, 22%, 15%);
730
722
  --t-fill-color-status-success-ghost:hsl(125, 17%, 15%);
@@ -733,7 +725,7 @@
733
725
  --t-fill-color-status-warning-dim:hsl(42, 13%, 15%);
734
726
  --t-fill-color-status-error-ghost:hsl(8, 20%, 16%);
735
727
  --t-fill-color-status-error-dim:hsl(10, 16%, 15%);
736
- --t-fill-color-tooltip-primary:hsla(0, 0%, 24%, 0.9);
728
+ --t-fill-color-tooltip:hsla(0, 0%, 24%, 0.9);
737
729
  --t-fill-color-product-accounts-gradient-page:linear-gradient(111.72deg, hsl(220, 30%, 21%), hsl(220, 48%, 17%), hsl(204, 70%, 12%));
738
730
  --t-fill-color-product-accounts-gradient-tint:linear-gradient(111.72deg, hsl(219, 21%, 16%), hsl(220, 30%, 14%), hsl(203, 37%, 11%));
739
731
  --t-fill-color-product-calendar-gradient-page:linear-gradient(111.72deg, hsl(8, 48%, 15%), hsl(278, 13%, 17%), hsl(204, 70%, 12%));
@@ -798,43 +790,43 @@
798
790
  --t-fill-color-tag-indigo-020:hsl(236, 22%, 29%);
799
791
  --t-fill-color-tag-indigo-030:hsl(236, 26%, 50%);
800
792
  --t-fill-color-tag-indigo-040:hsl(236, 34%, 56%);
801
- --t-fill-color-button-neutral-solid-default:hsl(0, 0%, 19%);
793
+ --t-fill-color-button-neutral-solid:hsl(0, 0%, 19%);
802
794
  --t-fill-color-button-neutral-solid-hover:hsl(0, 0%, 24%);
803
795
  --t-fill-color-button-neutral-solid-active:hsl(0, 0%, 32%);
804
796
  --t-fill-color-button-neutral-solid-disabled:hsl(0, 0%, 12%);
805
- --t-fill-color-button-neutral-outline-dim-default:hsl(0, 0%, 15%);
806
- --t-fill-color-button-neutral-outline-dim-hover:hsl(0, 0%, 17%);
807
- --t-fill-color-button-neutral-outline-dim-active:hsl(0, 0%, 19%);
808
- --t-fill-color-button-neutral-outline-dim-disabled:hsl(0, 0%, 12%);
809
- --t-fill-color-button-neutral-ghost-default:hsla(0, 0%, 0%, 0);
797
+ --t-fill-color-button-neutral-outline:hsl(0, 0%, 15%);
798
+ --t-fill-color-button-neutral-outline-hover:hsl(0, 0%, 17%);
799
+ --t-fill-color-button-neutral-outline-active:hsl(0, 0%, 19%);
800
+ --t-fill-color-button-neutral-outline-disabled:hsl(0, 0%, 12%);
801
+ --t-fill-color-button-neutral-ghost:hsla(0, 0%, 0%, 0);
810
802
  --t-fill-color-button-neutral-ghost-hover:hsl(0, 0%, 17%);
811
803
  --t-fill-color-button-neutral-ghost-active:hsl(0, 0%, 19%);
812
804
  --t-fill-color-button-neutral-ghost-disabled:hsla(0, 0%, 0%, 0);
813
805
  --t-fill-color-button-neutral-responsive-header-disabled:hsla(0, 0%, 100%, 0.05);
814
- --t-fill-color-button-interaction-solid-default:hsl(204, 100%, 35%);
806
+ --t-fill-color-button-interaction-solid:hsl(204, 100%, 35%);
815
807
  --t-fill-color-button-interaction-solid-hover:hsl(204, 100%, 40%);
816
808
  --t-fill-color-button-interaction-solid-active:hsl(204, 80%, 45%);
817
809
  --t-fill-color-button-interaction-solid-disabled:hsl(0, 0%, 12%);
818
- --t-fill-color-button-interaction-outline-dim-default:hsl(204, 32%, 15%);
819
- --t-fill-color-button-interaction-outline-dim-hover:hsl(204, 39%, 17%);
820
- --t-fill-color-button-interaction-outline-dim-active:hsl(205, 45%, 18%);
821
- --t-fill-color-button-interaction-outline-dim-disabled:hsl(0, 0%, 12%);
822
- --t-fill-color-button-interaction-ghost-default:hsla(0, 0%, 0%, 0);
810
+ --t-fill-color-button-interaction-outline:hsl(204, 32%, 15%);
811
+ --t-fill-color-button-interaction-outline-hover:hsl(204, 39%, 17%);
812
+ --t-fill-color-button-interaction-outline-active:hsl(205, 45%, 18%);
813
+ --t-fill-color-button-interaction-outline-disabled:hsl(0, 0%, 12%);
814
+ --t-fill-color-button-interaction-ghost:hsla(0, 0%, 0%, 0);
823
815
  --t-fill-color-button-interaction-ghost-hover:hsl(204, 32%, 15%);
824
816
  --t-fill-color-button-interaction-ghost-active:hsl(204, 39%, 17%);
825
817
  --t-fill-color-button-interaction-ghost-disabled:hsla(0, 0%, 0%, 0);
826
- --t-fill-color-button-delete-solid-default:hsl(8, 60%, 40%);
818
+ --t-fill-color-button-delete-solid:hsl(8, 60%, 40%);
827
819
  --t-fill-color-button-delete-solid-active:hsl(8, 60%, 47%);
828
820
  --t-fill-color-button-delete-solid-disabled:hsl(0, 0%, 12%);
829
- --t-fill-color-button-delete-outline-dim-default:hsl(8, 20%, 16%);
830
- --t-fill-color-button-delete-outline-dim-hover:hsl(9, 24%, 17%);
831
- --t-fill-color-button-delete-outline-dim-active:hsl(9, 29%, 19%);
832
- --t-fill-color-button-delete-outline-dim-disabled:hsl(0, 0%, 12%);
833
- --t-fill-color-button-delete-ghost-default:hsla(0, 0%, 0%, 0);
821
+ --t-fill-color-button-delete-outline:hsl(8, 20%, 16%);
822
+ --t-fill-color-button-delete-outline-hover:hsl(9, 24%, 17%);
823
+ --t-fill-color-button-delete-outline-active:hsl(9, 29%, 19%);
824
+ --t-fill-color-button-delete-outline-disabled:hsl(0, 0%, 12%);
825
+ --t-fill-color-button-delete-ghost:hsla(0, 0%, 0%, 0);
834
826
  --t-fill-color-button-delete-ghost-hover:hsl(8, 20%, 16%);
835
827
  --t-fill-color-button-delete-ghost-active:hsl(9, 24%, 17%);
836
828
  --t-fill-color-button-delete-ghost-disabled:hsla(0, 0%, 0%, 0);
837
- --t-fill-color-button-pill-default:hsl(0, 0%, 18%);
829
+ --t-fill-color-button-pill:hsl(0, 0%, 18%);
838
830
  --t-fill-color-button-pill-hover:hsl(0, 0%, 21%);
839
831
  --t-fill-color-button-pill-active:hsl(0, 0%, 21%);
840
832
  --t-fill-color-button-pill-disabled:hsl(0, 0%, 18%);
@@ -858,13 +850,13 @@
858
850
  --t-fill-color-transparency-dark-090:hsla(0, 0%, 100%, 0.9);
859
851
  --t-surface-color-card:hsl(0, 0%, 12%);
860
852
  --t-surface-color-canvas:hsl(0, 0%, 10%);
861
- --t-border-color-default-base:hsl(0, 0%, 21%);
862
- --t-border-color-default-dark:hsl(0, 0%, 25%);
863
- --t-border-color-default-darker:hsl(0, 0%, 33%);
864
- --t-border-color-default-darkest:hsl(0, 0%, 38%);
865
- --t-border-color-default-disabled:hsl(0, 0%, 21%);
866
- --t-border-color-default-dim:hsl(0, 0%, 16%);
867
- --t-border-color-default-white:hsl(0, 0%, 12%);
853
+ --t-border-color:hsl(0, 0%, 21%);
854
+ --t-border-color-dark:hsl(0, 0%, 25%);
855
+ --t-border-color-darker:hsl(0, 0%, 33%);
856
+ --t-border-color-darkest:hsl(0, 0%, 38%);
857
+ --t-border-color-disabled:hsl(0, 0%, 21%);
858
+ --t-border-color-dim:hsl(0, 0%, 16%);
859
+ --t-border-color-white:hsl(0, 0%, 12%);
868
860
  --t-border-color-status-neutral:hsl(0, 0%, 38%);
869
861
  --t-border-color-status-info:hsl(204, 100%, 35%);
870
862
  --t-border-color-button-neutral:hsl(0, 0%, 19%);
@@ -873,7 +865,7 @@
873
865
  --t-border-color-button-delete:hsla(8, 60%, 47%, 0.25);
874
866
  --t-border-color-control-neutral:hsl(0, 0%, 33%);
875
867
  --t-border-color-control-info:hsl(204, 100%, 35%);
876
- --t-border-color-control-disabled:hsl(0, 0%, 21%);
868
+ --t-border-color-control-disabled:hsl(0, 0%, 24%);
877
869
  --t-shadow-overflow-color:hsla(0, 0%, 0%, 0.6);
878
870
  }
879
871
  }