@udir-design/theme 0.1.0-2 → 1.0.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/udir.css CHANGED
@@ -6,618 +6,276 @@
6
6
  * These files are generated from design tokens defind using Token Studio
7
7
  */
8
8
 
9
- @layer ds.theme.color-mode.light {
10
- :root, [data-ds-color-mode="light"] {
11
- --ds-color-accent-1: #fefefe;
12
- --ds-color-accent-2: #f2f2f2;
13
- --ds-color-accent-3: #e1e1e1;
14
- --ds-color-accent-4: #d0d0d0;
15
- --ds-color-accent-5: #c1c1c1;
16
- --ds-color-accent-6: #bbbbbb;
17
- --ds-color-accent-7: #818181;
18
- --ds-color-accent-8: #4e4e4e;
19
- --ds-color-accent-9: #303030;
20
- --ds-color-accent-10: #424242;
21
- --ds-color-accent-11: #555555;
22
- --ds-color-accent-12: #636363;
23
- --ds-color-accent-13: #2c2c2c;
24
- --ds-color-accent-contrast-1: #ffffff;
25
- --ds-color-accent-contrast-2: #c6c6c6;
26
- --ds-color-accent-background-default: var(--ds-color-accent-1);
27
- --ds-color-accent-background-subtle: var(--ds-color-accent-2);
28
- --ds-color-accent-surface-default: var(--ds-color-accent-3);
29
- --ds-color-accent-surface-hover: var(--ds-color-accent-4);
30
- --ds-color-accent-surface-active: var(--ds-color-accent-5);
31
- --ds-color-accent-border-subtle: var(--ds-color-accent-6);
32
- --ds-color-accent-border-default: var(--ds-color-accent-7);
33
- --ds-color-accent-border-strong: var(--ds-color-accent-8);
34
- --ds-color-accent-base-default: var(--ds-color-accent-9);
35
- --ds-color-accent-base-hover: var(--ds-color-accent-10);
36
- --ds-color-accent-base-active: var(--ds-color-accent-11);
37
- --ds-color-accent-text-subtle: var(--ds-color-accent-12);
38
- --ds-color-accent-text-default: var(--ds-color-accent-13);
39
- --ds-color-accent-contrast-default: var(--ds-color-accent-contrast-1);
40
- --ds-color-accent-contrast-subtle: var(--ds-color-accent-contrast-2);
41
- --ds-color-neutral-1: #fefefe;
42
- --ds-color-neutral-2: #f2f2f2;
43
- --ds-color-neutral-3: #e1e1e1;
44
- --ds-color-neutral-4: #d0d0d0;
45
- --ds-color-neutral-5: #c1c1c1;
46
- --ds-color-neutral-6: #bbbbbb;
47
- --ds-color-neutral-7: #818181;
48
- --ds-color-neutral-8: #4e4e4e;
49
- --ds-color-neutral-9: #dedede;
50
- --ds-color-neutral-10: #c6c6c6;
51
- --ds-color-neutral-11: #b0b0b0;
52
- --ds-color-neutral-12: #636363;
53
- --ds-color-neutral-13: #2c2c2c;
54
- --ds-color-neutral-contrast-1: #000000;
55
- --ds-color-neutral-contrast-2: #424242;
56
- --ds-color-neutral-background-default: var(--ds-color-neutral-1);
57
- --ds-color-neutral-background-subtle: var(--ds-color-neutral-2);
58
- --ds-color-neutral-surface-default: var(--ds-color-neutral-3);
59
- --ds-color-neutral-surface-hover: var(--ds-color-neutral-4);
60
- --ds-color-neutral-surface-active: var(--ds-color-neutral-5);
61
- --ds-color-neutral-border-subtle: var(--ds-color-neutral-6);
62
- --ds-color-neutral-border-default: var(--ds-color-neutral-7);
63
- --ds-color-neutral-border-strong: var(--ds-color-neutral-8);
64
- --ds-color-neutral-base-default: var(--ds-color-neutral-9);
65
- --ds-color-neutral-base-hover: var(--ds-color-neutral-10);
66
- --ds-color-neutral-base-active: var(--ds-color-neutral-11);
67
- --ds-color-neutral-text-subtle: var(--ds-color-neutral-12);
68
- --ds-color-neutral-text-default: var(--ds-color-neutral-13);
69
- --ds-color-neutral-contrast-default: var(--ds-color-neutral-contrast-1);
70
- --ds-color-neutral-contrast-subtle: var(--ds-color-neutral-contrast-2);
71
- --ds-color-brand1-1: #fcfefd;
72
- --ds-color-brand1-2: #e7f5ee;
73
- --ds-color-brand1-3: #cae9d9;
74
- --ds-color-brand1-4: #abdcc3;
75
- --ds-color-brand1-5: #8ccfad;
76
- --ds-color-brand1-6: #81cba5;
77
- --ds-color-brand1-7: #548c6f;
78
- --ds-color-brand1-8: #325443;
79
- --ds-color-brand1-9: #76c69d;
80
- --ds-color-brand1-10: #68af8a;
81
- --ds-color-brand1-11: #5a9878;
82
- --ds-color-brand1-12: #406b55;
83
- --ds-color-brand1-13: #1d3026;
84
- --ds-color-brand1-contrast-1: #000000;
85
- --ds-color-brand1-contrast-2: #182720;
86
- --ds-color-brand1-background-default: var(--ds-color-brand1-1);
87
- --ds-color-brand1-background-subtle: var(--ds-color-brand1-2);
88
- --ds-color-brand1-surface-default: var(--ds-color-brand1-3);
89
- --ds-color-brand1-surface-hover: var(--ds-color-brand1-4);
90
- --ds-color-brand1-surface-active: var(--ds-color-brand1-5);
91
- --ds-color-brand1-border-subtle: var(--ds-color-brand1-6);
92
- --ds-color-brand1-border-default: var(--ds-color-brand1-7);
93
- --ds-color-brand1-border-strong: var(--ds-color-brand1-8);
94
- --ds-color-brand1-base-default: var(--ds-color-brand1-9);
95
- --ds-color-brand1-base-hover: var(--ds-color-brand1-10);
96
- --ds-color-brand1-base-active: var(--ds-color-brand1-11);
97
- --ds-color-brand1-text-subtle: var(--ds-color-brand1-12);
98
- --ds-color-brand1-text-default: var(--ds-color-brand1-13);
99
- --ds-color-brand1-contrast-default: var(--ds-color-brand1-contrast-1);
100
- --ds-color-brand1-contrast-subtle: var(--ds-color-brand1-contrast-2);
101
- --ds-color-brand2-1: #fefeff;
102
- --ds-color-brand2-2: #ecf3f8;
103
- --ds-color-brand2-3: #d5e4f0;
104
- --ds-color-brand2-4: #bdd4e7;
105
- --ds-color-brand2-5: #aec3d4;
106
- --ds-color-brand2-6: #a9bece;
107
- --ds-color-brand2-7: #74838e;
108
- --ds-color-brand2-8: #464e55;
109
- --ds-color-brand2-9: #bed5e8;
110
- --ds-color-brand2-10: #a9bece;
111
- --ds-color-brand2-11: #96a8b7;
112
- --ds-color-brand2-12: #5a646d;
113
- --ds-color-brand2-13: #282d31;
114
- --ds-color-brand2-contrast-1: #000000;
115
- --ds-color-brand2-contrast-2: #33393f;
116
- --ds-color-brand2-background-default: var(--ds-color-brand2-1);
117
- --ds-color-brand2-background-subtle: var(--ds-color-brand2-2);
118
- --ds-color-brand2-surface-default: var(--ds-color-brand2-3);
119
- --ds-color-brand2-surface-hover: var(--ds-color-brand2-4);
120
- --ds-color-brand2-surface-active: var(--ds-color-brand2-5);
121
- --ds-color-brand2-border-subtle: var(--ds-color-brand2-6);
122
- --ds-color-brand2-border-default: var(--ds-color-brand2-7);
123
- --ds-color-brand2-border-strong: var(--ds-color-brand2-8);
124
- --ds-color-brand2-base-default: var(--ds-color-brand2-9);
125
- --ds-color-brand2-base-hover: var(--ds-color-brand2-10);
126
- --ds-color-brand2-base-active: var(--ds-color-brand2-11);
127
- --ds-color-brand2-text-subtle: var(--ds-color-brand2-12);
128
- --ds-color-brand2-text-default: var(--ds-color-brand2-13);
129
- --ds-color-brand2-contrast-default: var(--ds-color-brand2-contrast-1);
130
- --ds-color-brand2-contrast-subtle: var(--ds-color-brand2-contrast-2);
131
- --ds-color-brand3-1: #fffefd;
132
- --ds-color-brand3-2: #f8f2ea;
133
- --ds-color-brand3-3: #efe0cc;
134
- --ds-color-brand3-4: #e5ceae;
135
- --ds-color-brand3-5: #d2bd9f;
136
- --ds-color-brand3-6: #cdb99c;
137
- --ds-color-brand3-7: #8e7f6c;
138
- --ds-color-brand3-8: #554c41;
139
- --ds-color-brand3-9: #e5ceae;
140
- --ds-color-brand3-10: #cdb99c;
141
- --ds-color-brand3-11: #b5a38a;
142
- --ds-color-brand3-12: #6c6252;
143
- --ds-color-brand3-13: #302b25;
144
- --ds-color-brand3-contrast-1: #000000;
145
- --ds-color-brand3-contrast-2: #3f3830;
146
- --ds-color-brand3-background-default: var(--ds-color-brand3-1);
147
- --ds-color-brand3-background-subtle: var(--ds-color-brand3-2);
148
- --ds-color-brand3-surface-default: var(--ds-color-brand3-3);
149
- --ds-color-brand3-surface-hover: var(--ds-color-brand3-4);
150
- --ds-color-brand3-surface-active: var(--ds-color-brand3-5);
151
- --ds-color-brand3-border-subtle: var(--ds-color-brand3-6);
152
- --ds-color-brand3-border-default: var(--ds-color-brand3-7);
153
- --ds-color-brand3-border-strong: var(--ds-color-brand3-8);
154
- --ds-color-brand3-base-default: var(--ds-color-brand3-9);
155
- --ds-color-brand3-base-hover: var(--ds-color-brand3-10);
156
- --ds-color-brand3-base-active: var(--ds-color-brand3-11);
157
- --ds-color-brand3-text-subtle: var(--ds-color-brand3-12);
158
- --ds-color-brand3-text-default: var(--ds-color-brand3-13);
159
- --ds-color-brand3-contrast-default: var(--ds-color-brand3-contrast-1);
160
- --ds-color-brand3-contrast-subtle: var(--ds-color-brand3-contrast-2);
161
- --ds-color-success-background-default: var(--ds-global-green-1);
162
- --ds-color-success-background-subtle: var(--ds-global-green-2);
163
- --ds-color-success-surface-default: var(--ds-global-green-3);
164
- --ds-color-success-surface-hover: var(--ds-global-green-4);
165
- --ds-color-success-surface-active: var(--ds-global-green-5);
166
- --ds-color-success-border-subtle: var(--ds-global-green-6);
167
- --ds-color-success-border-default: var(--ds-global-green-7);
168
- --ds-color-success-border-strong: var(--ds-global-green-8);
169
- --ds-color-success-base-default: var(--ds-global-green-9);
170
- --ds-color-success-base-hover: var(--ds-global-green-10);
171
- --ds-color-success-base-active: var(--ds-global-green-11);
172
- --ds-color-success-text-subtle: var(--ds-global-green-12);
173
- --ds-color-success-text-default: var(--ds-global-green-13);
174
- --ds-color-success-contrast-default: var(--ds-global-green-contrast-1);
175
- --ds-color-success-contrast-subtle: var(--ds-global-green-contrast-2);
176
- --ds-color-danger-background-default: var(--ds-global-red-1);
177
- --ds-color-danger-background-subtle: var(--ds-global-red-2);
178
- --ds-color-danger-surface-default: var(--ds-global-red-3);
179
- --ds-color-danger-surface-hover: var(--ds-global-red-4);
180
- --ds-color-danger-surface-active: var(--ds-global-red-5);
181
- --ds-color-danger-border-subtle: var(--ds-global-red-6);
182
- --ds-color-danger-border-default: var(--ds-global-red-7);
183
- --ds-color-danger-border-strong: var(--ds-global-red-8);
184
- --ds-color-danger-base-default: var(--ds-global-red-9);
185
- --ds-color-danger-base-hover: var(--ds-global-red-10);
186
- --ds-color-danger-base-active: var(--ds-global-red-11);
187
- --ds-color-danger-text-subtle: var(--ds-global-red-12);
188
- --ds-color-danger-text-default: var(--ds-global-red-13);
189
- --ds-color-danger-contrast-default: var(--ds-global-red-contrast-1);
190
- --ds-color-danger-contrast-subtle: var(--ds-global-red-contrast-2);
191
- --ds-color-info-background-default: #fefeff;
192
- --ds-color-info-background-subtle: #edf5fa;
193
- --ds-color-info-surface-default: #d3e5f4;
194
- --ds-color-info-surface-hover: #b7d5ed;
195
- --ds-color-info-surface-active: #9bc5e5;
9
+ @layer ds.theme.color-scheme.light {
10
+ :root, [data-color-scheme="light"] {
11
+ --ds-color-accent-background-default: #ffffff;
12
+ --ds-color-accent-background-tinted: #eaf6f0;
13
+ --ds-color-accent-surface-default: #ffffff;
14
+ --ds-color-accent-surface-tinted: #d6eee2;
15
+ --ds-color-accent-surface-hover: #bbe3cf;
16
+ --ds-color-accent-surface-active: #a0d8bb;
17
+ --ds-color-accent-border-subtle: #81cba5;
18
+ --ds-color-accent-border-default: #528a6d;
19
+ --ds-color-accent-border-strong: #3f6a54;
20
+ --ds-color-accent-text-subtle: #3f6a54;
21
+ --ds-color-accent-text-default: #1c2f26;
22
+ --ds-color-accent-base-default: #76c69d;
23
+ --ds-color-accent-base-hover: #68ae8a;
24
+ --ds-color-accent-base-active: #5a9778;
25
+ --ds-color-accent-base-contrast-subtle: #17271f;
26
+ --ds-color-accent-base-contrast-default: #000000;
27
+ --ds-color-neutral-background-default: #ffffff;
28
+ --ds-color-neutral-background-tinted: #f3f3f3;
29
+ --ds-color-neutral-surface-default: #ffffff;
30
+ --ds-color-neutral-surface-tinted: #e8e8e8;
31
+ --ds-color-neutral-surface-hover: #dadada;
32
+ --ds-color-neutral-surface-active: #cbcbcb;
33
+ --ds-color-neutral-border-subtle: #bcbcbc;
34
+ --ds-color-neutral-border-default: #7e7e7e;
35
+ --ds-color-neutral-border-strong: #616161;
36
+ --ds-color-neutral-text-subtle: #616161;
37
+ --ds-color-neutral-text-default: #2b2b2b;
38
+ --ds-color-neutral-base-default: #303030;
39
+ --ds-color-neutral-base-hover: #424242;
40
+ --ds-color-neutral-base-active: #545454;
41
+ --ds-color-neutral-base-contrast-subtle: #c6c6c6;
42
+ --ds-color-neutral-base-contrast-default: #ffffff;
43
+ --ds-color-support1-background-default: #ffffff;
44
+ --ds-color-support1-background-tinted: #eef4f9;
45
+ --ds-color-support1-surface-default: #ffffff;
46
+ --ds-color-support1-surface-tinted: #dfeaf4;
47
+ --ds-color-support1-surface-hover: #cadcec;
48
+ --ds-color-support1-surface-active: #b8cee1;
49
+ --ds-color-support1-border-subtle: #aabecf;
50
+ --ds-color-support1-border-default: #72808c;
51
+ --ds-color-support1-border-strong: #58636b;
52
+ --ds-color-support1-text-subtle: #58636b;
53
+ --ds-color-support1-text-default: #272c30;
54
+ --ds-color-support1-base-default: #bed5e8;
55
+ --ds-color-support1-base-hover: #aabfd0;
56
+ --ds-color-support1-base-active: #96a8b8;
57
+ --ds-color-support1-base-contrast-subtle: #343a3f;
58
+ --ds-color-support1-base-contrast-default: #000000;
59
+ --ds-color-support2-background-default: #ffffff;
60
+ --ds-color-support2-background-tinted: #f9f3eb;
61
+ --ds-color-support2-surface-default: #ffffff;
62
+ --ds-color-support2-surface-tinted: #f2e7d7;
63
+ --ds-color-support2-surface-hover: #ead7be;
64
+ --ds-color-support2-surface-active: #dfc8a9;
65
+ --ds-color-support2-border-subtle: #cdb99c;
66
+ --ds-color-support2-border-default: #8a7c69;
67
+ --ds-color-support2-border-strong: #6a6051;
68
+ --ds-color-support2-text-subtle: #6a6051;
69
+ --ds-color-support2-text-default: #2f2b24;
70
+ --ds-color-support2-base-default: #e5ceae;
71
+ --ds-color-support2-base-hover: #cdb89c;
72
+ --ds-color-support2-base-active: #b5a389;
73
+ --ds-color-support2-base-contrast-subtle: #3e382f;
74
+ --ds-color-support2-base-contrast-default: #000000;
75
+ --ds-color-success-background-default: #ffffff;
76
+ --ds-color-success-background-tinted: #ecf6ee;
77
+ --ds-color-success-surface-default: #ffffff;
78
+ --ds-color-success-surface-tinted: #daeddd;
79
+ --ds-color-success-surface-hover: #c3e2c7;
80
+ --ds-color-success-surface-active: #abd6b1;
81
+ --ds-color-success-border-subtle: #8fc997;
82
+ --ds-color-success-border-default: #1d922d;
83
+ --ds-color-success-border-strong: #057114;
84
+ --ds-color-success-text-subtle: #057114;
85
+ --ds-color-success-text-default: #023409;
86
+ --ds-color-success-base-default: #068718;
87
+ --ds-color-success-base-hover: #057014;
88
+ --ds-color-success-base-active: #045a10;
89
+ --ds-color-success-base-contrast-subtle: #fafdfb;
90
+ --ds-color-success-base-contrast-default: #ffffff;
91
+ --ds-color-danger-background-default: #ffffff;
92
+ --ds-color-danger-background-tinted: #fbf1f1;
93
+ --ds-color-danger-surface-default: #ffffff;
94
+ --ds-color-danger-surface-tinted: #f8e4e4;
95
+ --ds-color-danger-surface-hover: #f3d2d2;
96
+ --ds-color-danger-surface-active: #eec1c1;
97
+ --ds-color-danger-border-subtle: #e8adad;
98
+ --ds-color-danger-border-default: #d15757;
99
+ --ds-color-danger-border-strong: #bf1b1b;
100
+ --ds-color-danger-text-subtle: #bf1b1b;
101
+ --ds-color-danger-text-default: #590d0d;
102
+ --ds-color-danger-base-default: #C01B1B;
103
+ --ds-color-danger-base-hover: #9b1616;
104
+ --ds-color-danger-base-active: #791111;
105
+ --ds-color-danger-base-contrast-subtle: #f7e1e1;
106
+ --ds-color-danger-base-contrast-default: #ffffff;
107
+ --ds-color-info-background-default: #ffffff;
108
+ --ds-color-info-background-tinted: #edf5fa;
109
+ --ds-color-info-surface-default: #ffffff;
110
+ --ds-color-info-surface-tinted: #dcebf6;
111
+ --ds-color-info-surface-hover: #c5ddf0;
112
+ --ds-color-info-surface-active: #aed0ea;
196
113
  --ds-color-info-border-subtle: #94c1e3;
197
- --ds-color-info-border-default: #2f86c9;
198
- --ds-color-info-border-strong: #075089;
199
- --ds-color-info-base-default: #0A71C0;
200
- --ds-color-info-base-hover: #085ea0;
201
- --ds-color-info-base-active: #074b80;
202
- --ds-color-info-text-subtle: #0966ac;
114
+ --ds-color-info-border-default: #2a83c8;
115
+ --ds-color-info-border-strong: #0964a9;
116
+ --ds-color-info-text-subtle: #0964a9;
203
117
  --ds-color-info-text-default: #042d4d;
204
- --ds-color-info-contrast-default: #ffffff;
205
- --ds-color-info-contrast-subtle: #f3f8fc;
206
- --ds-color-warning-background-default: var(--ds-global-yellow-1);
207
- --ds-color-warning-background-subtle: var(--ds-global-yellow-2);
208
- --ds-color-warning-surface-default: var(--ds-global-yellow-3);
209
- --ds-color-warning-surface-hover: var(--ds-global-yellow-4);
210
- --ds-color-warning-surface-active: var(--ds-global-yellow-5);
211
- --ds-color-warning-border-subtle: var(--ds-global-yellow-6);
212
- --ds-color-warning-border-default: var(--ds-global-yellow-7);
213
- --ds-color-warning-border-strong: var(--ds-global-yellow-8);
214
- --ds-color-warning-base-default: var(--ds-global-orange-9);
215
- --ds-color-warning-base-hover: var(--ds-global-orange-10);
216
- --ds-color-warning-base-active: var(--ds-global-orange-11);
217
- --ds-color-warning-text-subtle: var(--ds-global-orange-12);
218
- --ds-color-warning-text-default: var(--ds-global-orange-13);
219
- --ds-color-warning-contrast-default: var(--ds-global-orange-contrast-1);
220
- --ds-color-warning-contrast-subtle: var(--ds-global-orange-contrast-2);
221
- --ds-color-focus-inner: #fefefe;
222
- --ds-color-focus-outer: #2c2c2c;
223
- --ds-global-blue-1: #fefeff;
224
- --ds-global-blue-2: #edf5fa;
225
- --ds-global-blue-3: #d3e5f4;
226
- --ds-global-blue-4: #b7d5ed;
227
- --ds-global-blue-5: #9bc5e5;
228
- --ds-global-blue-6: #94c1e3;
229
- --ds-global-blue-7: #2f86c9;
230
- --ds-global-blue-8: #075089;
231
- --ds-global-blue-9: #0A71C0;
232
- --ds-global-blue-10: #085ea0;
233
- --ds-global-blue-11: #074b80;
234
- --ds-global-blue-12: #0966ac;
235
- --ds-global-blue-13: #042d4d;
236
- --ds-global-blue-contrast-1: #ffffff;
237
- --ds-global-blue-contrast-2: #f3f8fc;
238
- --ds-global-green-1: #fcfefc;
239
- --ds-global-green-2: #edf6ee;
240
- --ds-global-green-3: #d1e9d4;
241
- --ds-global-green-4: #b5dbba;
242
- --ds-global-green-5: #96cd9e;
243
- --ds-global-green-6: #8fc997;
244
- --ds-global-green-7: #229532;
245
- --ds-global-green-8: #045a10;
246
- --ds-global-green-9: #068718;
247
- --ds-global-green-10: #057114;
248
- --ds-global-green-11: #045a10;
249
- --ds-global-green-12: #057315;
250
- --ds-global-green-13: #023409;
251
- --ds-global-green-contrast-1: #ffffff;
252
- --ds-global-green-contrast-2: #f9fcf9;
253
- --ds-global-orange-1: #fffefe;
254
- --ds-global-orange-2: #f9f2ed;
255
- --ds-global-orange-3: #f1ded3;
256
- --ds-global-orange-4: #e9cbb8;
257
- --ds-global-orange-5: #e1b9a0;
258
- --ds-global-orange-6: #deb296;
259
- --ds-global-orange-7: #c06b36;
260
- --ds-global-orange-8: #7c3b14;
261
- --ds-global-orange-9: #B8581D;
262
- --ds-global-orange-10: #9a4918;
263
- --ds-global-orange-11: #7c3b14;
264
- --ds-global-orange-12: #9e4b19;
265
- --ds-global-orange-13: #47220b;
266
- --ds-global-orange-contrast-1: #ffffff;
267
- --ds-global-orange-contrast-2: #fdfbf9;
268
- --ds-global-purple-1: #fefefe;
269
- --ds-global-purple-2: #f5f2f9;
270
- --ds-global-purple-3: #e7dfef;
271
- --ds-global-purple-4: #d9cce6;
272
- --ds-global-purple-5: #ccbadd;
273
- --ds-global-purple-6: #c7b4da;
274
- --ds-global-purple-7: #9572b9;
275
- --ds-global-purple-8: #663399;
276
- --ds-global-purple-9: #663299;
277
- --ds-global-purple-10: #4f2777;
278
- --ds-global-purple-11: #381b54;
279
- --ds-global-purple-12: #7b4ea7;
280
- --ds-global-purple-13: #3b1d59;
281
- --ds-global-purple-contrast-1: #ffffff;
282
- --ds-global-purple-contrast-2: #eee8f3;
283
- --ds-global-red-1: #fffefe;
284
- --ds-global-red-2: #fbf1f1;
285
- --ds-global-red-3: #f5dcdc;
286
- --ds-global-red-4: #f0c7c7;
287
- --ds-global-red-5: #eab3b3;
288
- --ds-global-red-6: #e8acac;
289
- --ds-global-red-7: #d25b5b;
290
- --ds-global-red-8: #9a1616;
291
- --ds-global-red-9: #C01B1B;
292
- --ds-global-red-10: #9a1616;
293
- --ds-global-red-11: #771111;
294
- --ds-global-red-12: #c22020;
295
- --ds-global-red-13: #5a0d0d;
296
- --ds-global-red-contrast-1: #ffffff;
297
- --ds-global-red-contrast-2: #f6dfdf;
298
- --ds-global-yellow-1: #fffefc;
299
- --ds-global-yellow-2: #fbf2d3;
300
- --ds-global-yellow-3: #f5e19b;
301
- --ds-global-yellow-4: #efcf5d;
302
- --ds-global-yellow-5: #e6bc27;
303
- --ds-global-yellow-6: #e0b726;
304
- --ds-global-yellow-7: #9a7e1a;
305
- --ds-global-yellow-8: #5d4c10;
306
- --ds-global-yellow-9: #EABF28;
307
- --ds-global-yellow-10: #d0aa24;
308
- --ds-global-yellow-11: #b7951f;
309
- --ds-global-yellow-12: #776114;
310
- --ds-global-yellow-13: #352b09;
311
- --ds-global-yellow-contrast-1: #000000;
312
- --ds-global-yellow-contrast-2: #382d0a;
118
+ --ds-color-info-base-default: #0A71C0;
119
+ --ds-color-info-base-hover: #085d9f;
120
+ --ds-color-info-base-active: #074a7e;
121
+ --ds-color-info-base-contrast-subtle: #eff6fb;
122
+ --ds-color-info-base-contrast-default: #ffffff;
123
+ --ds-color-warning-background-default: #ffffff;
124
+ --ds-color-warning-background-tinted: #fcf2e2;
125
+ --ds-color-warning-surface-default: #ffffff;
126
+ --ds-color-warning-surface-tinted: #fae6c6;
127
+ --ds-color-warning-surface-hover: #f6d5a0;
128
+ --ds-color-warning-surface-active: #f3c479;
129
+ --ds-color-warning-border-subtle: #eeb04c;
130
+ --ds-color-warning-border-default: #ad7214;
131
+ --ds-color-warning-border-strong: #85580f;
132
+ --ds-color-warning-text-subtle: #85580f;
133
+ --ds-color-warning-text-default: #3c2807;
134
+ --ds-color-warning-base-default: #EA9B1B;
135
+ --ds-color-warning-base-hover: #cd8818;
136
+ --ds-color-warning-base-active: #b27614;
137
+ --ds-color-warning-base-contrast-subtle: #271a04;
138
+ --ds-color-warning-base-contrast-default: #000000;
139
+ --ds-color-focus-inner: #ffffff;
140
+ --ds-color-focus-outer: #2b2b2b;
141
+ --ds-link-color-visited: #663299;
313
142
 
314
143
  color-scheme: light;
315
144
  }
316
145
 
317
146
  @media (prefers-color-scheme: light) {
318
- [data-ds-color-mode="auto"] {
319
- --ds-color-accent-1: #fefefe;
320
- --ds-color-accent-2: #f2f2f2;
321
- --ds-color-accent-3: #e1e1e1;
322
- --ds-color-accent-4: #d0d0d0;
323
- --ds-color-accent-5: #c1c1c1;
324
- --ds-color-accent-6: #bbbbbb;
325
- --ds-color-accent-7: #818181;
326
- --ds-color-accent-8: #4e4e4e;
327
- --ds-color-accent-9: #303030;
328
- --ds-color-accent-10: #424242;
329
- --ds-color-accent-11: #555555;
330
- --ds-color-accent-12: #636363;
331
- --ds-color-accent-13: #2c2c2c;
332
- --ds-color-accent-contrast-1: #ffffff;
333
- --ds-color-accent-contrast-2: #c6c6c6;
334
- --ds-color-accent-background-default: var(--ds-color-accent-1);
335
- --ds-color-accent-background-subtle: var(--ds-color-accent-2);
336
- --ds-color-accent-surface-default: var(--ds-color-accent-3);
337
- --ds-color-accent-surface-hover: var(--ds-color-accent-4);
338
- --ds-color-accent-surface-active: var(--ds-color-accent-5);
339
- --ds-color-accent-border-subtle: var(--ds-color-accent-6);
340
- --ds-color-accent-border-default: var(--ds-color-accent-7);
341
- --ds-color-accent-border-strong: var(--ds-color-accent-8);
342
- --ds-color-accent-base-default: var(--ds-color-accent-9);
343
- --ds-color-accent-base-hover: var(--ds-color-accent-10);
344
- --ds-color-accent-base-active: var(--ds-color-accent-11);
345
- --ds-color-accent-text-subtle: var(--ds-color-accent-12);
346
- --ds-color-accent-text-default: var(--ds-color-accent-13);
347
- --ds-color-accent-contrast-default: var(--ds-color-accent-contrast-1);
348
- --ds-color-accent-contrast-subtle: var(--ds-color-accent-contrast-2);
349
- --ds-color-neutral-1: #fefefe;
350
- --ds-color-neutral-2: #f2f2f2;
351
- --ds-color-neutral-3: #e1e1e1;
352
- --ds-color-neutral-4: #d0d0d0;
353
- --ds-color-neutral-5: #c1c1c1;
354
- --ds-color-neutral-6: #bbbbbb;
355
- --ds-color-neutral-7: #818181;
356
- --ds-color-neutral-8: #4e4e4e;
357
- --ds-color-neutral-9: #dedede;
358
- --ds-color-neutral-10: #c6c6c6;
359
- --ds-color-neutral-11: #b0b0b0;
360
- --ds-color-neutral-12: #636363;
361
- --ds-color-neutral-13: #2c2c2c;
362
- --ds-color-neutral-contrast-1: #000000;
363
- --ds-color-neutral-contrast-2: #424242;
364
- --ds-color-neutral-background-default: var(--ds-color-neutral-1);
365
- --ds-color-neutral-background-subtle: var(--ds-color-neutral-2);
366
- --ds-color-neutral-surface-default: var(--ds-color-neutral-3);
367
- --ds-color-neutral-surface-hover: var(--ds-color-neutral-4);
368
- --ds-color-neutral-surface-active: var(--ds-color-neutral-5);
369
- --ds-color-neutral-border-subtle: var(--ds-color-neutral-6);
370
- --ds-color-neutral-border-default: var(--ds-color-neutral-7);
371
- --ds-color-neutral-border-strong: var(--ds-color-neutral-8);
372
- --ds-color-neutral-base-default: var(--ds-color-neutral-9);
373
- --ds-color-neutral-base-hover: var(--ds-color-neutral-10);
374
- --ds-color-neutral-base-active: var(--ds-color-neutral-11);
375
- --ds-color-neutral-text-subtle: var(--ds-color-neutral-12);
376
- --ds-color-neutral-text-default: var(--ds-color-neutral-13);
377
- --ds-color-neutral-contrast-default: var(--ds-color-neutral-contrast-1);
378
- --ds-color-neutral-contrast-subtle: var(--ds-color-neutral-contrast-2);
379
- --ds-color-brand1-1: #fcfefd;
380
- --ds-color-brand1-2: #e7f5ee;
381
- --ds-color-brand1-3: #cae9d9;
382
- --ds-color-brand1-4: #abdcc3;
383
- --ds-color-brand1-5: #8ccfad;
384
- --ds-color-brand1-6: #81cba5;
385
- --ds-color-brand1-7: #548c6f;
386
- --ds-color-brand1-8: #325443;
387
- --ds-color-brand1-9: #76c69d;
388
- --ds-color-brand1-10: #68af8a;
389
- --ds-color-brand1-11: #5a9878;
390
- --ds-color-brand1-12: #406b55;
391
- --ds-color-brand1-13: #1d3026;
392
- --ds-color-brand1-contrast-1: #000000;
393
- --ds-color-brand1-contrast-2: #182720;
394
- --ds-color-brand1-background-default: var(--ds-color-brand1-1);
395
- --ds-color-brand1-background-subtle: var(--ds-color-brand1-2);
396
- --ds-color-brand1-surface-default: var(--ds-color-brand1-3);
397
- --ds-color-brand1-surface-hover: var(--ds-color-brand1-4);
398
- --ds-color-brand1-surface-active: var(--ds-color-brand1-5);
399
- --ds-color-brand1-border-subtle: var(--ds-color-brand1-6);
400
- --ds-color-brand1-border-default: var(--ds-color-brand1-7);
401
- --ds-color-brand1-border-strong: var(--ds-color-brand1-8);
402
- --ds-color-brand1-base-default: var(--ds-color-brand1-9);
403
- --ds-color-brand1-base-hover: var(--ds-color-brand1-10);
404
- --ds-color-brand1-base-active: var(--ds-color-brand1-11);
405
- --ds-color-brand1-text-subtle: var(--ds-color-brand1-12);
406
- --ds-color-brand1-text-default: var(--ds-color-brand1-13);
407
- --ds-color-brand1-contrast-default: var(--ds-color-brand1-contrast-1);
408
- --ds-color-brand1-contrast-subtle: var(--ds-color-brand1-contrast-2);
409
- --ds-color-brand2-1: #fefeff;
410
- --ds-color-brand2-2: #ecf3f8;
411
- --ds-color-brand2-3: #d5e4f0;
412
- --ds-color-brand2-4: #bdd4e7;
413
- --ds-color-brand2-5: #aec3d4;
414
- --ds-color-brand2-6: #a9bece;
415
- --ds-color-brand2-7: #74838e;
416
- --ds-color-brand2-8: #464e55;
417
- --ds-color-brand2-9: #bed5e8;
418
- --ds-color-brand2-10: #a9bece;
419
- --ds-color-brand2-11: #96a8b7;
420
- --ds-color-brand2-12: #5a646d;
421
- --ds-color-brand2-13: #282d31;
422
- --ds-color-brand2-contrast-1: #000000;
423
- --ds-color-brand2-contrast-2: #33393f;
424
- --ds-color-brand2-background-default: var(--ds-color-brand2-1);
425
- --ds-color-brand2-background-subtle: var(--ds-color-brand2-2);
426
- --ds-color-brand2-surface-default: var(--ds-color-brand2-3);
427
- --ds-color-brand2-surface-hover: var(--ds-color-brand2-4);
428
- --ds-color-brand2-surface-active: var(--ds-color-brand2-5);
429
- --ds-color-brand2-border-subtle: var(--ds-color-brand2-6);
430
- --ds-color-brand2-border-default: var(--ds-color-brand2-7);
431
- --ds-color-brand2-border-strong: var(--ds-color-brand2-8);
432
- --ds-color-brand2-base-default: var(--ds-color-brand2-9);
433
- --ds-color-brand2-base-hover: var(--ds-color-brand2-10);
434
- --ds-color-brand2-base-active: var(--ds-color-brand2-11);
435
- --ds-color-brand2-text-subtle: var(--ds-color-brand2-12);
436
- --ds-color-brand2-text-default: var(--ds-color-brand2-13);
437
- --ds-color-brand2-contrast-default: var(--ds-color-brand2-contrast-1);
438
- --ds-color-brand2-contrast-subtle: var(--ds-color-brand2-contrast-2);
439
- --ds-color-brand3-1: #fffefd;
440
- --ds-color-brand3-2: #f8f2ea;
441
- --ds-color-brand3-3: #efe0cc;
442
- --ds-color-brand3-4: #e5ceae;
443
- --ds-color-brand3-5: #d2bd9f;
444
- --ds-color-brand3-6: #cdb99c;
445
- --ds-color-brand3-7: #8e7f6c;
446
- --ds-color-brand3-8: #554c41;
447
- --ds-color-brand3-9: #e5ceae;
448
- --ds-color-brand3-10: #cdb99c;
449
- --ds-color-brand3-11: #b5a38a;
450
- --ds-color-brand3-12: #6c6252;
451
- --ds-color-brand3-13: #302b25;
452
- --ds-color-brand3-contrast-1: #000000;
453
- --ds-color-brand3-contrast-2: #3f3830;
454
- --ds-color-brand3-background-default: var(--ds-color-brand3-1);
455
- --ds-color-brand3-background-subtle: var(--ds-color-brand3-2);
456
- --ds-color-brand3-surface-default: var(--ds-color-brand3-3);
457
- --ds-color-brand3-surface-hover: var(--ds-color-brand3-4);
458
- --ds-color-brand3-surface-active: var(--ds-color-brand3-5);
459
- --ds-color-brand3-border-subtle: var(--ds-color-brand3-6);
460
- --ds-color-brand3-border-default: var(--ds-color-brand3-7);
461
- --ds-color-brand3-border-strong: var(--ds-color-brand3-8);
462
- --ds-color-brand3-base-default: var(--ds-color-brand3-9);
463
- --ds-color-brand3-base-hover: var(--ds-color-brand3-10);
464
- --ds-color-brand3-base-active: var(--ds-color-brand3-11);
465
- --ds-color-brand3-text-subtle: var(--ds-color-brand3-12);
466
- --ds-color-brand3-text-default: var(--ds-color-brand3-13);
467
- --ds-color-brand3-contrast-default: var(--ds-color-brand3-contrast-1);
468
- --ds-color-brand3-contrast-subtle: var(--ds-color-brand3-contrast-2);
469
- --ds-color-success-background-default: var(--ds-global-green-1);
470
- --ds-color-success-background-subtle: var(--ds-global-green-2);
471
- --ds-color-success-surface-default: var(--ds-global-green-3);
472
- --ds-color-success-surface-hover: var(--ds-global-green-4);
473
- --ds-color-success-surface-active: var(--ds-global-green-5);
474
- --ds-color-success-border-subtle: var(--ds-global-green-6);
475
- --ds-color-success-border-default: var(--ds-global-green-7);
476
- --ds-color-success-border-strong: var(--ds-global-green-8);
477
- --ds-color-success-base-default: var(--ds-global-green-9);
478
- --ds-color-success-base-hover: var(--ds-global-green-10);
479
- --ds-color-success-base-active: var(--ds-global-green-11);
480
- --ds-color-success-text-subtle: var(--ds-global-green-12);
481
- --ds-color-success-text-default: var(--ds-global-green-13);
482
- --ds-color-success-contrast-default: var(--ds-global-green-contrast-1);
483
- --ds-color-success-contrast-subtle: var(--ds-global-green-contrast-2);
484
- --ds-color-danger-background-default: var(--ds-global-red-1);
485
- --ds-color-danger-background-subtle: var(--ds-global-red-2);
486
- --ds-color-danger-surface-default: var(--ds-global-red-3);
487
- --ds-color-danger-surface-hover: var(--ds-global-red-4);
488
- --ds-color-danger-surface-active: var(--ds-global-red-5);
489
- --ds-color-danger-border-subtle: var(--ds-global-red-6);
490
- --ds-color-danger-border-default: var(--ds-global-red-7);
491
- --ds-color-danger-border-strong: var(--ds-global-red-8);
492
- --ds-color-danger-base-default: var(--ds-global-red-9);
493
- --ds-color-danger-base-hover: var(--ds-global-red-10);
494
- --ds-color-danger-base-active: var(--ds-global-red-11);
495
- --ds-color-danger-text-subtle: var(--ds-global-red-12);
496
- --ds-color-danger-text-default: var(--ds-global-red-13);
497
- --ds-color-danger-contrast-default: var(--ds-global-red-contrast-1);
498
- --ds-color-danger-contrast-subtle: var(--ds-global-red-contrast-2);
499
- --ds-color-info-background-default: #fefeff;
500
- --ds-color-info-background-subtle: #edf5fa;
501
- --ds-color-info-surface-default: #d3e5f4;
502
- --ds-color-info-surface-hover: #b7d5ed;
503
- --ds-color-info-surface-active: #9bc5e5;
147
+ [data-color-scheme="auto"] {
148
+ --ds-color-accent-background-default: #ffffff;
149
+ --ds-color-accent-background-tinted: #eaf6f0;
150
+ --ds-color-accent-surface-default: #ffffff;
151
+ --ds-color-accent-surface-tinted: #d6eee2;
152
+ --ds-color-accent-surface-hover: #bbe3cf;
153
+ --ds-color-accent-surface-active: #a0d8bb;
154
+ --ds-color-accent-border-subtle: #81cba5;
155
+ --ds-color-accent-border-default: #528a6d;
156
+ --ds-color-accent-border-strong: #3f6a54;
157
+ --ds-color-accent-text-subtle: #3f6a54;
158
+ --ds-color-accent-text-default: #1c2f26;
159
+ --ds-color-accent-base-default: #76c69d;
160
+ --ds-color-accent-base-hover: #68ae8a;
161
+ --ds-color-accent-base-active: #5a9778;
162
+ --ds-color-accent-base-contrast-subtle: #17271f;
163
+ --ds-color-accent-base-contrast-default: #000000;
164
+ --ds-color-neutral-background-default: #ffffff;
165
+ --ds-color-neutral-background-tinted: #f3f3f3;
166
+ --ds-color-neutral-surface-default: #ffffff;
167
+ --ds-color-neutral-surface-tinted: #e8e8e8;
168
+ --ds-color-neutral-surface-hover: #dadada;
169
+ --ds-color-neutral-surface-active: #cbcbcb;
170
+ --ds-color-neutral-border-subtle: #bcbcbc;
171
+ --ds-color-neutral-border-default: #7e7e7e;
172
+ --ds-color-neutral-border-strong: #616161;
173
+ --ds-color-neutral-text-subtle: #616161;
174
+ --ds-color-neutral-text-default: #2b2b2b;
175
+ --ds-color-neutral-base-default: #303030;
176
+ --ds-color-neutral-base-hover: #424242;
177
+ --ds-color-neutral-base-active: #545454;
178
+ --ds-color-neutral-base-contrast-subtle: #c6c6c6;
179
+ --ds-color-neutral-base-contrast-default: #ffffff;
180
+ --ds-color-support1-background-default: #ffffff;
181
+ --ds-color-support1-background-tinted: #eef4f9;
182
+ --ds-color-support1-surface-default: #ffffff;
183
+ --ds-color-support1-surface-tinted: #dfeaf4;
184
+ --ds-color-support1-surface-hover: #cadcec;
185
+ --ds-color-support1-surface-active: #b8cee1;
186
+ --ds-color-support1-border-subtle: #aabecf;
187
+ --ds-color-support1-border-default: #72808c;
188
+ --ds-color-support1-border-strong: #58636b;
189
+ --ds-color-support1-text-subtle: #58636b;
190
+ --ds-color-support1-text-default: #272c30;
191
+ --ds-color-support1-base-default: #bed5e8;
192
+ --ds-color-support1-base-hover: #aabfd0;
193
+ --ds-color-support1-base-active: #96a8b8;
194
+ --ds-color-support1-base-contrast-subtle: #343a3f;
195
+ --ds-color-support1-base-contrast-default: #000000;
196
+ --ds-color-support2-background-default: #ffffff;
197
+ --ds-color-support2-background-tinted: #f9f3eb;
198
+ --ds-color-support2-surface-default: #ffffff;
199
+ --ds-color-support2-surface-tinted: #f2e7d7;
200
+ --ds-color-support2-surface-hover: #ead7be;
201
+ --ds-color-support2-surface-active: #dfc8a9;
202
+ --ds-color-support2-border-subtle: #cdb99c;
203
+ --ds-color-support2-border-default: #8a7c69;
204
+ --ds-color-support2-border-strong: #6a6051;
205
+ --ds-color-support2-text-subtle: #6a6051;
206
+ --ds-color-support2-text-default: #2f2b24;
207
+ --ds-color-support2-base-default: #e5ceae;
208
+ --ds-color-support2-base-hover: #cdb89c;
209
+ --ds-color-support2-base-active: #b5a389;
210
+ --ds-color-support2-base-contrast-subtle: #3e382f;
211
+ --ds-color-support2-base-contrast-default: #000000;
212
+ --ds-color-success-background-default: #ffffff;
213
+ --ds-color-success-background-tinted: #ecf6ee;
214
+ --ds-color-success-surface-default: #ffffff;
215
+ --ds-color-success-surface-tinted: #daeddd;
216
+ --ds-color-success-surface-hover: #c3e2c7;
217
+ --ds-color-success-surface-active: #abd6b1;
218
+ --ds-color-success-border-subtle: #8fc997;
219
+ --ds-color-success-border-default: #1d922d;
220
+ --ds-color-success-border-strong: #057114;
221
+ --ds-color-success-text-subtle: #057114;
222
+ --ds-color-success-text-default: #023409;
223
+ --ds-color-success-base-default: #068718;
224
+ --ds-color-success-base-hover: #057014;
225
+ --ds-color-success-base-active: #045a10;
226
+ --ds-color-success-base-contrast-subtle: #fafdfb;
227
+ --ds-color-success-base-contrast-default: #ffffff;
228
+ --ds-color-danger-background-default: #ffffff;
229
+ --ds-color-danger-background-tinted: #fbf1f1;
230
+ --ds-color-danger-surface-default: #ffffff;
231
+ --ds-color-danger-surface-tinted: #f8e4e4;
232
+ --ds-color-danger-surface-hover: #f3d2d2;
233
+ --ds-color-danger-surface-active: #eec1c1;
234
+ --ds-color-danger-border-subtle: #e8adad;
235
+ --ds-color-danger-border-default: #d15757;
236
+ --ds-color-danger-border-strong: #bf1b1b;
237
+ --ds-color-danger-text-subtle: #bf1b1b;
238
+ --ds-color-danger-text-default: #590d0d;
239
+ --ds-color-danger-base-default: #C01B1B;
240
+ --ds-color-danger-base-hover: #9b1616;
241
+ --ds-color-danger-base-active: #791111;
242
+ --ds-color-danger-base-contrast-subtle: #f7e1e1;
243
+ --ds-color-danger-base-contrast-default: #ffffff;
244
+ --ds-color-info-background-default: #ffffff;
245
+ --ds-color-info-background-tinted: #edf5fa;
246
+ --ds-color-info-surface-default: #ffffff;
247
+ --ds-color-info-surface-tinted: #dcebf6;
248
+ --ds-color-info-surface-hover: #c5ddf0;
249
+ --ds-color-info-surface-active: #aed0ea;
504
250
  --ds-color-info-border-subtle: #94c1e3;
505
- --ds-color-info-border-default: #2f86c9;
506
- --ds-color-info-border-strong: #075089;
507
- --ds-color-info-base-default: #0A71C0;
508
- --ds-color-info-base-hover: #085ea0;
509
- --ds-color-info-base-active: #074b80;
510
- --ds-color-info-text-subtle: #0966ac;
251
+ --ds-color-info-border-default: #2a83c8;
252
+ --ds-color-info-border-strong: #0964a9;
253
+ --ds-color-info-text-subtle: #0964a9;
511
254
  --ds-color-info-text-default: #042d4d;
512
- --ds-color-info-contrast-default: #ffffff;
513
- --ds-color-info-contrast-subtle: #f3f8fc;
514
- --ds-color-warning-background-default: var(--ds-global-yellow-1);
515
- --ds-color-warning-background-subtle: var(--ds-global-yellow-2);
516
- --ds-color-warning-surface-default: var(--ds-global-yellow-3);
517
- --ds-color-warning-surface-hover: var(--ds-global-yellow-4);
518
- --ds-color-warning-surface-active: var(--ds-global-yellow-5);
519
- --ds-color-warning-border-subtle: var(--ds-global-yellow-6);
520
- --ds-color-warning-border-default: var(--ds-global-yellow-7);
521
- --ds-color-warning-border-strong: var(--ds-global-yellow-8);
522
- --ds-color-warning-base-default: var(--ds-global-orange-9);
523
- --ds-color-warning-base-hover: var(--ds-global-orange-10);
524
- --ds-color-warning-base-active: var(--ds-global-orange-11);
525
- --ds-color-warning-text-subtle: var(--ds-global-orange-12);
526
- --ds-color-warning-text-default: var(--ds-global-orange-13);
527
- --ds-color-warning-contrast-default: var(--ds-global-orange-contrast-1);
528
- --ds-color-warning-contrast-subtle: var(--ds-global-orange-contrast-2);
529
- --ds-color-focus-inner: #fefefe;
530
- --ds-color-focus-outer: #2c2c2c;
531
- --ds-global-blue-1: #fefeff;
532
- --ds-global-blue-2: #edf5fa;
533
- --ds-global-blue-3: #d3e5f4;
534
- --ds-global-blue-4: #b7d5ed;
535
- --ds-global-blue-5: #9bc5e5;
536
- --ds-global-blue-6: #94c1e3;
537
- --ds-global-blue-7: #2f86c9;
538
- --ds-global-blue-8: #075089;
539
- --ds-global-blue-9: #0A71C0;
540
- --ds-global-blue-10: #085ea0;
541
- --ds-global-blue-11: #074b80;
542
- --ds-global-blue-12: #0966ac;
543
- --ds-global-blue-13: #042d4d;
544
- --ds-global-blue-contrast-1: #ffffff;
545
- --ds-global-blue-contrast-2: #f3f8fc;
546
- --ds-global-green-1: #fcfefc;
547
- --ds-global-green-2: #edf6ee;
548
- --ds-global-green-3: #d1e9d4;
549
- --ds-global-green-4: #b5dbba;
550
- --ds-global-green-5: #96cd9e;
551
- --ds-global-green-6: #8fc997;
552
- --ds-global-green-7: #229532;
553
- --ds-global-green-8: #045a10;
554
- --ds-global-green-9: #068718;
555
- --ds-global-green-10: #057114;
556
- --ds-global-green-11: #045a10;
557
- --ds-global-green-12: #057315;
558
- --ds-global-green-13: #023409;
559
- --ds-global-green-contrast-1: #ffffff;
560
- --ds-global-green-contrast-2: #f9fcf9;
561
- --ds-global-orange-1: #fffefe;
562
- --ds-global-orange-2: #f9f2ed;
563
- --ds-global-orange-3: #f1ded3;
564
- --ds-global-orange-4: #e9cbb8;
565
- --ds-global-orange-5: #e1b9a0;
566
- --ds-global-orange-6: #deb296;
567
- --ds-global-orange-7: #c06b36;
568
- --ds-global-orange-8: #7c3b14;
569
- --ds-global-orange-9: #B8581D;
570
- --ds-global-orange-10: #9a4918;
571
- --ds-global-orange-11: #7c3b14;
572
- --ds-global-orange-12: #9e4b19;
573
- --ds-global-orange-13: #47220b;
574
- --ds-global-orange-contrast-1: #ffffff;
575
- --ds-global-orange-contrast-2: #fdfbf9;
576
- --ds-global-purple-1: #fefefe;
577
- --ds-global-purple-2: #f5f2f9;
578
- --ds-global-purple-3: #e7dfef;
579
- --ds-global-purple-4: #d9cce6;
580
- --ds-global-purple-5: #ccbadd;
581
- --ds-global-purple-6: #c7b4da;
582
- --ds-global-purple-7: #9572b9;
583
- --ds-global-purple-8: #663399;
584
- --ds-global-purple-9: #663299;
585
- --ds-global-purple-10: #4f2777;
586
- --ds-global-purple-11: #381b54;
587
- --ds-global-purple-12: #7b4ea7;
588
- --ds-global-purple-13: #3b1d59;
589
- --ds-global-purple-contrast-1: #ffffff;
590
- --ds-global-purple-contrast-2: #eee8f3;
591
- --ds-global-red-1: #fffefe;
592
- --ds-global-red-2: #fbf1f1;
593
- --ds-global-red-3: #f5dcdc;
594
- --ds-global-red-4: #f0c7c7;
595
- --ds-global-red-5: #eab3b3;
596
- --ds-global-red-6: #e8acac;
597
- --ds-global-red-7: #d25b5b;
598
- --ds-global-red-8: #9a1616;
599
- --ds-global-red-9: #C01B1B;
600
- --ds-global-red-10: #9a1616;
601
- --ds-global-red-11: #771111;
602
- --ds-global-red-12: #c22020;
603
- --ds-global-red-13: #5a0d0d;
604
- --ds-global-red-contrast-1: #ffffff;
605
- --ds-global-red-contrast-2: #f6dfdf;
606
- --ds-global-yellow-1: #fffefc;
607
- --ds-global-yellow-2: #fbf2d3;
608
- --ds-global-yellow-3: #f5e19b;
609
- --ds-global-yellow-4: #efcf5d;
610
- --ds-global-yellow-5: #e6bc27;
611
- --ds-global-yellow-6: #e0b726;
612
- --ds-global-yellow-7: #9a7e1a;
613
- --ds-global-yellow-8: #5d4c10;
614
- --ds-global-yellow-9: #EABF28;
615
- --ds-global-yellow-10: #d0aa24;
616
- --ds-global-yellow-11: #b7951f;
617
- --ds-global-yellow-12: #776114;
618
- --ds-global-yellow-13: #352b09;
619
- --ds-global-yellow-contrast-1: #000000;
620
- --ds-global-yellow-contrast-2: #382d0a;
255
+ --ds-color-info-base-default: #0A71C0;
256
+ --ds-color-info-base-hover: #085d9f;
257
+ --ds-color-info-base-active: #074a7e;
258
+ --ds-color-info-base-contrast-subtle: #eff6fb;
259
+ --ds-color-info-base-contrast-default: #ffffff;
260
+ --ds-color-warning-background-default: #ffffff;
261
+ --ds-color-warning-background-tinted: #fcf2e2;
262
+ --ds-color-warning-surface-default: #ffffff;
263
+ --ds-color-warning-surface-tinted: #fae6c6;
264
+ --ds-color-warning-surface-hover: #f6d5a0;
265
+ --ds-color-warning-surface-active: #f3c479;
266
+ --ds-color-warning-border-subtle: #eeb04c;
267
+ --ds-color-warning-border-default: #ad7214;
268
+ --ds-color-warning-border-strong: #85580f;
269
+ --ds-color-warning-text-subtle: #85580f;
270
+ --ds-color-warning-text-default: #3c2807;
271
+ --ds-color-warning-base-default: #EA9B1B;
272
+ --ds-color-warning-base-hover: #cd8818;
273
+ --ds-color-warning-base-active: #b27614;
274
+ --ds-color-warning-base-contrast-subtle: #271a04;
275
+ --ds-color-warning-base-contrast-default: #000000;
276
+ --ds-color-focus-inner: #ffffff;
277
+ --ds-color-focus-outer: #2b2b2b;
278
+ --ds-link-color-visited: #663299;
621
279
 
622
280
  color-scheme: light;
623
281
  }
@@ -631,7 +289,7 @@
631
289
  */
632
290
 
633
291
  @layer ds.theme.typography.secondary {
634
- [data-ds-typography="secondary"] {
292
+ [data-typography="secondary"] {
635
293
  --ds-font-family: Inter;
636
294
  --ds-font-weight-medium: 500;
637
295
  --ds-font-weight-semibold: 600;
@@ -639,19 +297,19 @@
639
297
  --ds-heading-2xl-font-weight: 500;
640
298
  --ds-heading-2xl-line-height: 1.3;
641
299
  --ds-heading-2xl-font-size: 3.75rem;
642
- --ds-heading-2xl-letter-spacing: -1%;
300
+ --ds-heading-2xl-letter-spacing: 0%;
643
301
  --ds-heading-xl-font-weight: 500;
644
302
  --ds-heading-xl-line-height: 1.3;
645
303
  --ds-heading-xl-font-size: 3rem;
646
- --ds-heading-xl-letter-spacing: -1%;
304
+ --ds-heading-xl-letter-spacing: 0%;
647
305
  --ds-heading-lg-font-weight: 500;
648
306
  --ds-heading-lg-line-height: 1.3;
649
307
  --ds-heading-lg-font-size: 2.25rem;
650
- --ds-heading-lg-letter-spacing: -0.5%;
308
+ --ds-heading-lg-letter-spacing: 0%;
651
309
  --ds-heading-md-font-weight: 500;
652
310
  --ds-heading-md-line-height: 1.3;
653
311
  --ds-heading-md-font-size: 1.875rem;
654
- --ds-heading-md-letter-spacing: -0.25%;
312
+ --ds-heading-md-letter-spacing: 0%;
655
313
  --ds-heading-sm-font-weight: 500;
656
314
  --ds-heading-sm-line-height: 1.3;
657
315
  --ds-heading-sm-font-size: 1.5rem;
@@ -659,117 +317,84 @@
659
317
  --ds-heading-xs-font-weight: 500;
660
318
  --ds-heading-xs-line-height: 1.3;
661
319
  --ds-heading-xs-font-size: 1.3125rem;
662
- --ds-heading-xs-letter-spacing: 0.15%;
320
+ --ds-heading-xs-letter-spacing: 0%;
663
321
  --ds-heading-2xs-font-weight: 500;
664
322
  --ds-heading-2xs-line-height: 1.3;
665
323
  --ds-heading-2xs-font-size: 1.125rem;
666
- --ds-heading-2xs-letter-spacing: 0.15%;
324
+ --ds-heading-2xs-letter-spacing: 0%;
667
325
  --ds-body-xl-font-weight: 400;
668
326
  --ds-body-xl-line-height: 1.5;
669
327
  --ds-body-xl-font-size: 1.5rem;
670
- --ds-body-xl-letter-spacing: 0.5%;
328
+ --ds-body-xl-letter-spacing: 0%;
671
329
  --ds-body-lg-font-weight: 400;
672
330
  --ds-body-lg-line-height: 1.5;
673
331
  --ds-body-lg-font-size: 1.3125rem;
674
- --ds-body-lg-letter-spacing: 0.5%;
332
+ --ds-body-lg-letter-spacing: 0%;
675
333
  --ds-body-md-font-weight: 400;
676
334
  --ds-body-md-line-height: 1.5;
677
335
  --ds-body-md-font-size: 1.125rem;
678
- --ds-body-md-letter-spacing: 0.5%;
336
+ --ds-body-md-letter-spacing: 0%;
679
337
  --ds-body-sm-font-weight: 400;
680
338
  --ds-body-sm-line-height: 1.5;
681
339
  --ds-body-sm-font-size: 1rem;
682
- --ds-body-sm-letter-spacing: 0.25%;
340
+ --ds-body-sm-letter-spacing: 0%;
683
341
  --ds-body-xs-font-weight: 400;
684
342
  --ds-body-xs-line-height: 1.5;
685
343
  --ds-body-xs-font-size: 0.875rem;
686
- --ds-body-xs-letter-spacing: 0.15%;
344
+ --ds-body-xs-letter-spacing: 0%;
687
345
  --ds-body-short-xl-font-weight: 400;
688
346
  --ds-body-short-xl-line-height: 1.3;
689
347
  --ds-body-short-xl-font-size: 1.5rem;
690
- --ds-body-short-xl-letter-spacing: 0.5%;
348
+ --ds-body-short-xl-letter-spacing: 0%;
691
349
  --ds-body-short-lg-font-weight: 400;
692
350
  --ds-body-short-lg-line-height: 1.3;
693
351
  --ds-body-short-lg-font-size: 1.3125rem;
694
- --ds-body-short-lg-letter-spacing: 0.5%;
352
+ --ds-body-short-lg-letter-spacing: 0%;
695
353
  --ds-body-short-md-font-weight: 400;
696
354
  --ds-body-short-md-line-height: 1.3;
697
355
  --ds-body-short-md-font-size: 1.125rem;
698
- --ds-body-short-md-letter-spacing: 0.5%;
356
+ --ds-body-short-md-letter-spacing: 0%;
699
357
  --ds-body-short-sm-font-weight: 400;
700
358
  --ds-body-short-sm-line-height: 1.3;
701
359
  --ds-body-short-sm-font-size: 1rem;
702
- --ds-body-short-sm-letter-spacing: 0.25%;
360
+ --ds-body-short-sm-letter-spacing: 0%;
703
361
  --ds-body-short-xs-font-weight: 400;
704
362
  --ds-body-short-xs-line-height: 1.3;
705
363
  --ds-body-short-xs-font-size: 0.875rem;
706
- --ds-body-short-xs-letter-spacing: 0.15%;
364
+ --ds-body-short-xs-letter-spacing: 0%;
707
365
  --ds-body-long-xl-font-weight: 400;
708
366
  --ds-body-long-xl-line-height: 1.7;
709
367
  --ds-body-long-xl-font-size: 1.5rem;
710
- --ds-body-long-xl-letter-spacing: 0.5%;
368
+ --ds-body-long-xl-letter-spacing: 0%;
711
369
  --ds-body-long-lg-font-weight: 400;
712
370
  --ds-body-long-lg-line-height: 1.7;
713
371
  --ds-body-long-lg-font-size: 1.3125rem;
714
- --ds-body-long-lg-letter-spacing: 0.5%;
372
+ --ds-body-long-lg-letter-spacing: 0%;
715
373
  --ds-body-long-md-font-weight: 400;
716
374
  --ds-body-long-md-line-height: 1.7;
717
375
  --ds-body-long-md-font-size: 1.125rem;
718
- --ds-body-long-md-letter-spacing: 0.5%;
376
+ --ds-body-long-md-letter-spacing: 0%;
719
377
  --ds-body-long-sm-font-weight: 400;
720
378
  --ds-body-long-sm-line-height: 1.7;
721
379
  --ds-body-long-sm-font-size: 1rem;
722
- --ds-body-long-sm-letter-spacing: 0.25%;
380
+ --ds-body-long-sm-letter-spacing: 0%;
723
381
  --ds-body-long-xs-font-weight: 400;
724
382
  --ds-body-long-xs-line-height: 1.7;
725
383
  --ds-body-long-xs-font-size: 0.875rem;
726
- --ds-body-long-xs-letter-spacing: 0.15%;
727
- --ds-label-lg-font-weight: 500;
728
- --ds-label-lg-line-height: 1.3;
729
- --ds-label-lg-font-size: 1.3125rem;
730
- --ds-label-lg-letter-spacing: 0.5%;
731
- --ds-label-md-font-weight: 500;
732
- --ds-label-md-line-height: 1.3;
733
- --ds-label-md-font-size: 1.125rem;
734
- --ds-label-md-letter-spacing: 0.5%;
735
- --ds-label-sm-font-weight: 500;
736
- --ds-label-sm-line-height: 1.3;
737
- --ds-label-sm-font-size: 1rem;
738
- --ds-label-sm-letter-spacing: 0.25%;
739
- --ds-label-xs-font-weight: 500;
740
- --ds-label-xs-line-height: 1.3;
741
- --ds-label-xs-font-size: 0.875rem;
742
- --ds-label-xs-letter-spacing: 0.15%;
743
- --ds-error_message-lg-font-weight: 400;
744
- --ds-error_message-lg-line-height: 1.3;
745
- --ds-error_message-lg-font-size: 1.3125rem;
746
- --ds-error_message-lg-letter-spacing: 0.5%;
747
- --ds-error_message-md-font-weight: 400;
748
- --ds-error_message-md-line-height: 1.3;
749
- --ds-error_message-md-font-size: 1.125rem;
750
- --ds-error_message-md-letter-spacing: 0.5%;
751
- --ds-error_message-sm-font-weight: 400;
752
- --ds-error_message-sm-line-height: 1.3;
753
- --ds-error_message-sm-font-size: 1rem;
754
- --ds-error_message-sm-letter-spacing: 0.25%;
755
- --ds-error_message-xs-font-weight: 400;
756
- --ds-error_message-xs-line-height: 1.3;
757
- --ds-error_message-xs-font-size: 0.875rem;
758
- --ds-error_message-xs-letter-spacing: 0.15%;
384
+ --ds-body-long-xs-letter-spacing: 0%;
759
385
  --ds-line-height-sm: 1.3;
760
386
  --ds-line-height-md: 1.5;
761
387
  --ds-line-height-lg: 1.7;
762
388
  --ds-font-size-1: 0.75rem;
763
- --ds-font-size-2: 0.8125rem;
764
- --ds-font-size-3: 0.875rem;
765
- --ds-font-size-4: 1rem;
766
- --ds-font-size-5: 1.125rem;
767
- --ds-font-size-6: 1.3125rem;
768
- --ds-font-size-7: 1.5rem;
769
- --ds-font-size-8: 1.875rem;
770
- --ds-font-size-9: 2.25rem;
771
- --ds-font-size-10: 3rem;
772
- --ds-font-size-11: 3.75rem;
389
+ --ds-font-size-2: 0.875rem;
390
+ --ds-font-size-3: 1rem;
391
+ --ds-font-size-4: 1.125rem;
392
+ --ds-font-size-5: 1.3125rem;
393
+ --ds-font-size-6: 1.5rem;
394
+ --ds-font-size-7: 1.875rem;
395
+ --ds-font-size-8: 2.25rem;
396
+ --ds-font-size-9: 3rem;
397
+ --ds-font-size-10: 3.75rem;
773
398
  --ds-letter-spacing-1: -1%;
774
399
  --ds-letter-spacing-2: -0.5%;
775
400
  --ds-letter-spacing-3: -0.25%;
@@ -779,10 +404,6 @@
779
404
  --ds-letter-spacing-7: 0.25%;
780
405
  --ds-letter-spacing-8: 0.5%;
781
406
  --ds-letter-spacing-9: 1.5%;
782
- --ds-udir-main: Inter;
783
- --ds-udir-bold: 500;
784
- --ds-udir-extra-bold: 600;
785
- --ds-udir-regular: 400;
786
407
  }
787
408
  }
788
409
  /**
@@ -791,65 +412,68 @@
791
412
 
792
413
  @layer ds.theme.semantic {
793
414
  :root {
794
- --ds-disabled-opacity: 30%;
795
- --ds-border-radius-sm: calc(var(--ds-border-radius-base)*0.5);
796
- --ds-border-radius-md: calc(var(--ds-border-radius-base)*1);
797
- --ds-border-radius-lg: calc(var(--ds-border-radius-base)*2);
798
- --ds-border-radius-xl: calc(var(--ds-border-radius-base)*3);
799
- --ds-border-radius-2xl: calc(var(--ds-border-radius-base)*4);
800
- --ds-border-radius-3xl: calc(var(--ds-border-radius-base)*6);
801
- --ds-border-radius-4xl: calc(var(--ds-border-radius-base)*8);
415
+ --ds-size-base: 18;
416
+ --ds-size-step: 4;
417
+ --ds-border-radius-base: 0.75rem;
418
+ --ds-border-radius-scale: 0.25rem;
419
+ --ds-border-radius-sm: min(var(--ds-border-radius-base)*0.5,var(--ds-border-radius-scale));
420
+ --ds-border-radius-md: min(var(--ds-border-radius-base),var(--ds-border-radius-scale)*2);
421
+ --ds-border-radius-lg: min(var(--ds-border-radius-base)*2,var(--ds-border-radius-scale)*3);
422
+ --ds-border-radius-xl: min(var(--ds-border-radius-base)*3,var(--ds-border-radius-scale)*4);
423
+ --ds-border-radius-default: var(--ds-border-radius-base);
802
424
  --ds-border-radius-full: 624.9375rem;
803
- --ds-border-radius-base: 0.25rem;
804
- --ds-spacing-0: calc(var(--ds-spacing-base)*0);
805
- --ds-spacing-1: calc(var(--ds-spacing-base)*1);
806
- --ds-spacing-2: calc(var(--ds-spacing-base)*2);
807
- --ds-spacing-3: calc(var(--ds-spacing-base)*3);
808
- --ds-spacing-4: calc(var(--ds-spacing-base)*4);
809
- --ds-spacing-5: calc(var(--ds-spacing-base)*5);
810
- --ds-spacing-6: calc(var(--ds-spacing-base)*6);
811
- --ds-spacing-7: calc(var(--ds-spacing-base)*7);
812
- --ds-spacing-8: calc(var(--ds-spacing-base)*8);
813
- --ds-spacing-9: calc(var(--ds-spacing-base)*9);
814
- --ds-spacing-10: calc(var(--ds-spacing-base)*10);
815
- --ds-spacing-11: calc(var(--ds-spacing-base)*11);
816
- --ds-spacing-12: calc(var(--ds-spacing-base)*12);
817
- --ds-spacing-13: calc(var(--ds-spacing-base)*13);
818
- --ds-spacing-14: calc(var(--ds-spacing-base)*14);
819
- --ds-spacing-15: calc(var(--ds-spacing-base)*15);
820
- --ds-spacing-18: calc(var(--ds-spacing-base)*18);
821
- --ds-spacing-22: calc(var(--ds-spacing-base)*22);
822
- --ds-spacing-26: calc(var(--ds-spacing-base)*26);
823
- --ds-spacing-30: calc(var(--ds-spacing-base)*30);
824
- --ds-spacing-base: 0.25rem;
825
- --ds-sizing-0: calc(var(--ds-sizing-base)*0);
826
- --ds-sizing-1: calc(var(--ds-sizing-base)*1);
827
- --ds-sizing-2: calc(var(--ds-sizing-base)*2);
828
- --ds-sizing-3: calc(var(--ds-sizing-base)*3);
829
- --ds-sizing-4: calc(var(--ds-sizing-base)*4);
830
- --ds-sizing-5: calc(var(--ds-sizing-base)*5);
831
- --ds-sizing-6: calc(var(--ds-sizing-base)*6);
832
- --ds-sizing-7: calc(var(--ds-sizing-base)*7);
833
- --ds-sizing-8: calc(var(--ds-sizing-base)*8);
834
- --ds-sizing-9: calc(var(--ds-sizing-base)*9);
835
- --ds-sizing-10: calc(var(--ds-sizing-base)*10);
836
- --ds-sizing-11: calc(var(--ds-sizing-base)*11);
837
- --ds-sizing-12: calc(var(--ds-sizing-base)*12);
838
- --ds-sizing-13: calc(var(--ds-sizing-base)*13);
839
- --ds-sizing-14: calc(var(--ds-sizing-base)*14);
840
- --ds-sizing-15: calc(var(--ds-sizing-base)*15);
841
- --ds-sizing-18: calc(var(--ds-sizing-base)*18);
842
- --ds-sizing-22: calc(var(--ds-sizing-base)*22);
843
- --ds-sizing-26: calc(var(--ds-sizing-base)*26);
844
- --ds-sizing-30: calc(var(--ds-sizing-base)*30);
845
- --ds-sizing-base: 0.25rem;
425
+ --ds-opacity-disabled: 30%;
846
426
  --ds-border-width-default: 1px;
847
- --ds-border-width-highlight: 2px;
427
+ --ds-border-width-focus: 3px;
848
428
  --ds-shadow-xs: 0 0 1px 0 rgba(0,0,0,0.16), 0 1px 2px 0 rgba(0,0,0,0.12);
849
429
  --ds-shadow-sm: 0 0 1px 0 rgba(0,0,0,0.15), 0 1px 2px 0 rgba(0,0,0,0.12), 0 2px 4px 0 rgba(0,0,0,0.1);
850
430
  --ds-shadow-md: 0 0 1px 0 rgba(0,0,0,0.14), 0 2px 4px 0 rgba(0,0,0,0.12), 0 4px 8px 0 rgba(0,0,0,0.12);
851
431
  --ds-shadow-lg: 0 0 1px 0 rgba(0,0,0,0.13), 0 3px 5px 0 rgba(0,0,0,0.13), 0 6px 12px 0 rgba(0,0,0,0.14);
852
432
  --ds-shadow-xl: 0 0 1px 0 rgba(0,0,0,0.12), 0 4px 8px 0 rgba(0,0,0,0.16), 0 12px 24px 0 rgba(0,0,0,0.16);
433
+
434
+ --ds-size-0: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *0);
435
+ --ds-size-1: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *1);
436
+ --ds-size-2: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *2);
437
+ --ds-size-3: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *3);
438
+ --ds-size-4: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *4);
439
+ --ds-size-5: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *5);
440
+ --ds-size-6: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *6);
441
+ --ds-size-7: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *7);
442
+ --ds-size-8: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *8);
443
+ --ds-size-9: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *9);
444
+ --ds-size-10: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *10);
445
+ --ds-size-11: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *11);
446
+ --ds-size-12: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *12);
447
+ --ds-size-13: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *13);
448
+ --ds-size-14: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *14);
449
+ --ds-size-15: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *15);
450
+ --ds-size-18: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *18);
451
+ --ds-size-22: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *22);
452
+ --ds-size-26: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *26);
453
+ --ds-size-30: calc(var(--ds-size-step) / var(--ds-size-base) * 1em *30);
454
+
455
+ @supports (width: round(down, .1em, 1px)) {
456
+ --ds-size-0: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *0), 0.0625rem);
457
+ --ds-size-1: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *1), 0.0625rem);
458
+ --ds-size-2: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *2), 0.0625rem);
459
+ --ds-size-3: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *3), 0.0625rem);
460
+ --ds-size-4: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *4), 0.0625rem);
461
+ --ds-size-5: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *5), 0.0625rem);
462
+ --ds-size-6: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *6), 0.0625rem);
463
+ --ds-size-7: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *7), 0.0625rem);
464
+ --ds-size-8: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *8), 0.0625rem);
465
+ --ds-size-9: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *9), 0.0625rem);
466
+ --ds-size-10: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *10), 0.0625rem);
467
+ --ds-size-11: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *11), 0.0625rem);
468
+ --ds-size-12: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *12), 0.0625rem);
469
+ --ds-size-13: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *13), 0.0625rem);
470
+ --ds-size-14: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *14), 0.0625rem);
471
+ --ds-size-15: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *15), 0.0625rem);
472
+ --ds-size-18: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *18), 0.0625rem);
473
+ --ds-size-22: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *22), 0.0625rem);
474
+ --ds-size-26: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *26), 0.0625rem);
475
+ --ds-size-30: round(down, calc(var(--ds-size-step) / var(--ds-size-base) * 1em *30), 0.0625rem);
476
+ }
853
477
  }
854
478
 
855
479
  }
@@ -858,618 +482,276 @@
858
482
  * These files are generated from design tokens defind using Token Studio
859
483
  */
860
484
 
861
- @layer ds.theme.color-mode.dark {
862
- [data-ds-color-mode="dark"] {
863
- --ds-color-accent-1: #1b1b1b;
864
- --ds-color-accent-2: #242424;
865
- --ds-color-accent-3: #303030;
866
- --ds-color-accent-4: #3e3e3e;
867
- --ds-color-accent-5: #4b4b4b;
868
- --ds-color-accent-6: #525252;
869
- --ds-color-accent-7: #6f6f6f;
870
- --ds-color-accent-8: #bebebe;
871
- --ds-color-accent-9: #ababab;
872
- --ds-color-accent-10: #969696;
873
- --ds-color-accent-11: #818181;
874
- --ds-color-accent-12: #a3a3a3;
875
- --ds-color-accent-13: #e1e1e1;
876
- --ds-color-accent-contrast-1: #000000;
877
- --ds-color-accent-contrast-2: #1b1b1b;
878
- --ds-color-accent-background-default: var(--ds-color-accent-1);
879
- --ds-color-accent-background-subtle: var(--ds-color-accent-2);
880
- --ds-color-accent-surface-default: var(--ds-color-accent-3);
881
- --ds-color-accent-surface-hover: var(--ds-color-accent-4);
882
- --ds-color-accent-surface-active: var(--ds-color-accent-5);
883
- --ds-color-accent-border-subtle: var(--ds-color-accent-6);
884
- --ds-color-accent-border-default: var(--ds-color-accent-7);
885
- --ds-color-accent-border-strong: var(--ds-color-accent-8);
886
- --ds-color-accent-base-default: var(--ds-color-accent-9);
887
- --ds-color-accent-base-hover: var(--ds-color-accent-10);
888
- --ds-color-accent-base-active: var(--ds-color-accent-11);
889
- --ds-color-accent-text-subtle: var(--ds-color-accent-12);
890
- --ds-color-accent-text-default: var(--ds-color-accent-13);
891
- --ds-color-accent-contrast-default: var(--ds-color-accent-contrast-1);
892
- --ds-color-accent-contrast-subtle: var(--ds-color-accent-contrast-2);
893
- --ds-color-neutral-1: #1b1b1b;
894
- --ds-color-neutral-2: #242424;
895
- --ds-color-neutral-3: #303030;
896
- --ds-color-neutral-4: #3e3e3e;
897
- --ds-color-neutral-5: #4b4b4b;
898
- --ds-color-neutral-6: #525252;
899
- --ds-color-neutral-7: #6f6f6f;
900
- --ds-color-neutral-8: #bebebe;
901
- --ds-color-neutral-9: #1f1f1f;
902
- --ds-color-neutral-10: #303030;
903
- --ds-color-neutral-11: #424242;
904
- --ds-color-neutral-12: #a3a3a3;
905
- --ds-color-neutral-13: #e1e1e1;
906
- --ds-color-neutral-contrast-1: #ffffff;
907
- --ds-color-neutral-contrast-2: #b0b0b0;
908
- --ds-color-neutral-background-default: var(--ds-color-neutral-1);
909
- --ds-color-neutral-background-subtle: var(--ds-color-neutral-2);
910
- --ds-color-neutral-surface-default: var(--ds-color-neutral-3);
911
- --ds-color-neutral-surface-hover: var(--ds-color-neutral-4);
912
- --ds-color-neutral-surface-active: var(--ds-color-neutral-5);
913
- --ds-color-neutral-border-subtle: var(--ds-color-neutral-6);
914
- --ds-color-neutral-border-default: var(--ds-color-neutral-7);
915
- --ds-color-neutral-border-strong: var(--ds-color-neutral-8);
916
- --ds-color-neutral-base-default: var(--ds-color-neutral-9);
917
- --ds-color-neutral-base-hover: var(--ds-color-neutral-10);
918
- --ds-color-neutral-base-active: var(--ds-color-neutral-11);
919
- --ds-color-neutral-text-subtle: var(--ds-color-neutral-12);
920
- --ds-color-neutral-text-default: var(--ds-color-neutral-13);
921
- --ds-color-neutral-contrast-default: var(--ds-color-neutral-contrast-1);
922
- --ds-color-neutral-contrast-subtle: var(--ds-color-neutral-contrast-2);
923
- --ds-color-brand1-1: #121e18;
924
- --ds-color-brand1-2: #18271f;
925
- --ds-color-brand1-3: #1f342a;
926
- --ds-color-brand1-4: #284336;
927
- --ds-color-brand1-5: #315241;
928
- --ds-color-brand1-6: #355947;
929
- --ds-color-brand1-7: #487960;
930
- --ds-color-brand1-8: #86cda9;
931
- --ds-color-brand1-9: #284336;
932
- --ds-color-brand1-10: #345745;
933
- --ds-color-brand1-11: #406b55;
934
- --ds-color-brand1-12: #6ab28d;
935
- --ds-color-brand1-13: #cae9d9;
936
- --ds-color-brand1-contrast-1: #ffffff;
937
- --ds-color-brand1-contrast-2: #d3d8d6;
938
- --ds-color-brand1-background-default: var(--ds-color-brand1-1);
939
- --ds-color-brand1-background-subtle: var(--ds-color-brand1-2);
940
- --ds-color-brand1-surface-default: var(--ds-color-brand1-3);
941
- --ds-color-brand1-surface-hover: var(--ds-color-brand1-4);
942
- --ds-color-brand1-surface-active: var(--ds-color-brand1-5);
943
- --ds-color-brand1-border-subtle: var(--ds-color-brand1-6);
944
- --ds-color-brand1-border-default: var(--ds-color-brand1-7);
945
- --ds-color-brand1-border-strong: var(--ds-color-brand1-8);
946
- --ds-color-brand1-base-default: var(--ds-color-brand1-9);
947
- --ds-color-brand1-base-hover: var(--ds-color-brand1-10);
948
- --ds-color-brand1-base-active: var(--ds-color-brand1-11);
949
- --ds-color-brand1-text-subtle: var(--ds-color-brand1-12);
950
- --ds-color-brand1-text-default: var(--ds-color-brand1-13);
951
- --ds-color-brand1-contrast-default: var(--ds-color-brand1-contrast-1);
952
- --ds-color-brand1-contrast-subtle: var(--ds-color-brand1-contrast-2);
953
- --ds-color-brand2-1: #191c1f;
954
- --ds-color-brand2-2: #202428;
955
- --ds-color-brand2-3: #2b3135;
956
- --ds-color-brand2-4: #383f44;
957
- --ds-color-brand2-5: #444c53;
958
- --ds-color-brand2-6: #4a535b;
959
- --ds-color-brand2-7: #65717b;
960
- --ds-color-brand2-8: #acc1d2;
961
- --ds-color-brand2-9: #24282b;
962
- --ds-color-brand2-10: #33393f;
963
- --ds-color-brand2-11: #444c53;
964
- --ds-color-brand2-12: #93a5b4;
965
- --ds-color-brand2-13: #d5e4f0;
966
- --ds-color-brand2-contrast-1: #ffffff;
967
- --ds-color-brand2-contrast-2: #babbbc;
968
- --ds-color-brand2-background-default: var(--ds-color-brand2-1);
969
- --ds-color-brand2-background-subtle: var(--ds-color-brand2-2);
970
- --ds-color-brand2-surface-default: var(--ds-color-brand2-3);
971
- --ds-color-brand2-surface-hover: var(--ds-color-brand2-4);
972
- --ds-color-brand2-surface-active: var(--ds-color-brand2-5);
973
- --ds-color-brand2-border-subtle: var(--ds-color-brand2-6);
974
- --ds-color-brand2-border-default: var(--ds-color-brand2-7);
975
- --ds-color-brand2-border-strong: var(--ds-color-brand2-8);
976
- --ds-color-brand2-base-default: var(--ds-color-brand2-9);
977
- --ds-color-brand2-base-hover: var(--ds-color-brand2-10);
978
- --ds-color-brand2-base-active: var(--ds-color-brand2-11);
979
- --ds-color-brand2-text-subtle: var(--ds-color-brand2-12);
980
- --ds-color-brand2-text-default: var(--ds-color-brand2-13);
981
- --ds-color-brand2-contrast-default: var(--ds-color-brand2-contrast-1);
982
- --ds-color-brand2-contrast-subtle: var(--ds-color-brand2-contrast-2);
983
- --ds-color-brand3-1: #1f1b17;
984
- --ds-color-brand3-2: #27231e;
985
- --ds-color-brand3-3: #353028;
986
- --ds-color-brand3-4: #433c33;
987
- --ds-color-brand3-5: #534a3f;
988
- --ds-color-brand3-6: #5b5145;
989
- --ds-color-brand3-7: #7a6d5c;
990
- --ds-color-brand3-8: #d0bb9e;
991
- --ds-color-brand3-9: #2c2721;
992
- --ds-color-brand3-10: #3f3830;
993
- --ds-color-brand3-11: #534a3f;
994
- --ds-color-brand3-12: #b2a188;
995
- --ds-color-brand3-13: #efe0cc;
996
- --ds-color-brand3-contrast-1: #ffffff;
997
- --ds-color-brand3-contrast-2: #bdbbb9;
998
- --ds-color-brand3-background-default: var(--ds-color-brand3-1);
999
- --ds-color-brand3-background-subtle: var(--ds-color-brand3-2);
1000
- --ds-color-brand3-surface-default: var(--ds-color-brand3-3);
1001
- --ds-color-brand3-surface-hover: var(--ds-color-brand3-4);
1002
- --ds-color-brand3-surface-active: var(--ds-color-brand3-5);
1003
- --ds-color-brand3-border-subtle: var(--ds-color-brand3-6);
1004
- --ds-color-brand3-border-default: var(--ds-color-brand3-7);
1005
- --ds-color-brand3-border-strong: var(--ds-color-brand3-8);
1006
- --ds-color-brand3-base-default: var(--ds-color-brand3-9);
1007
- --ds-color-brand3-base-hover: var(--ds-color-brand3-10);
1008
- --ds-color-brand3-base-active: var(--ds-color-brand3-11);
1009
- --ds-color-brand3-text-subtle: var(--ds-color-brand3-12);
1010
- --ds-color-brand3-text-default: var(--ds-color-brand3-13);
1011
- --ds-color-brand3-contrast-default: var(--ds-color-brand3-contrast-1);
1012
- --ds-color-brand3-contrast-subtle: var(--ds-color-brand3-contrast-2);
1013
- --ds-color-success-background-default: var(--ds-global-green-1);
1014
- --ds-color-success-background-subtle: var(--ds-global-green-2);
1015
- --ds-color-success-surface-default: var(--ds-global-green-3);
1016
- --ds-color-success-surface-hover: var(--ds-global-green-4);
1017
- --ds-color-success-surface-active: var(--ds-global-green-5);
1018
- --ds-color-success-border-subtle: var(--ds-global-green-6);
1019
- --ds-color-success-border-default: var(--ds-global-green-7);
1020
- --ds-color-success-border-strong: var(--ds-global-green-8);
1021
- --ds-color-success-base-default: var(--ds-global-green-9);
1022
- --ds-color-success-base-hover: var(--ds-global-green-10);
1023
- --ds-color-success-base-active: var(--ds-global-green-11);
1024
- --ds-color-success-text-subtle: var(--ds-global-green-12);
1025
- --ds-color-success-text-default: var(--ds-global-green-13);
1026
- --ds-color-success-contrast-default: var(--ds-global-green-contrast-1);
1027
- --ds-color-success-contrast-subtle: var(--ds-global-green-contrast-2);
1028
- --ds-color-danger-background-default: var(--ds-global-red-1);
1029
- --ds-color-danger-background-subtle: var(--ds-global-red-2);
1030
- --ds-color-danger-surface-default: var(--ds-global-red-3);
1031
- --ds-color-danger-surface-hover: var(--ds-global-red-4);
1032
- --ds-color-danger-surface-active: var(--ds-global-red-5);
1033
- --ds-color-danger-border-subtle: var(--ds-global-red-6);
1034
- --ds-color-danger-border-default: var(--ds-global-red-7);
1035
- --ds-color-danger-border-strong: var(--ds-global-red-8);
1036
- --ds-color-danger-base-default: var(--ds-global-red-9);
1037
- --ds-color-danger-base-hover: var(--ds-global-red-10);
1038
- --ds-color-danger-base-active: var(--ds-global-red-11);
1039
- --ds-color-danger-text-subtle: var(--ds-global-red-12);
1040
- --ds-color-danger-text-default: var(--ds-global-red-13);
1041
- --ds-color-danger-contrast-default: var(--ds-global-red-contrast-1);
1042
- --ds-color-danger-contrast-subtle: var(--ds-global-red-contrast-2);
1043
- --ds-color-info-background-default: #031d30;
1044
- --ds-color-info-background-subtle: #032540;
1045
- --ds-color-info-surface-default: #043256;
1046
- --ds-color-info-surface-hover: #063f6c;
1047
- --ds-color-info-surface-active: #074d84;
1048
- --ds-color-info-border-subtle: #075490;
1049
- --ds-color-info-border-default: #0c72c1;
1050
- --ds-color-info-border-strong: #98c3e5;
1051
- --ds-color-info-base-default: #2a84c8;
1052
- --ds-color-info-base-hover: #0a6dba;
1053
- --ds-color-info-base-active: #085998;
1054
- --ds-color-info-text-subtle: #6ba9d9;
1055
- --ds-color-info-text-default: #d3e5f4;
1056
- --ds-color-info-contrast-default: #000000;
1057
- --ds-color-info-contrast-subtle: #040c13;
1058
- --ds-color-warning-background-default: var(--ds-global-yellow-1);
1059
- --ds-color-warning-background-subtle: var(--ds-global-yellow-2);
1060
- --ds-color-warning-surface-default: var(--ds-global-yellow-3);
1061
- --ds-color-warning-surface-hover: var(--ds-global-yellow-4);
1062
- --ds-color-warning-surface-active: var(--ds-global-yellow-5);
1063
- --ds-color-warning-border-subtle: var(--ds-global-yellow-6);
1064
- --ds-color-warning-border-default: var(--ds-global-yellow-7);
1065
- --ds-color-warning-border-strong: var(--ds-global-yellow-8);
1066
- --ds-color-warning-base-default: var(--ds-global-orange-9);
1067
- --ds-color-warning-base-hover: var(--ds-global-orange-10);
1068
- --ds-color-warning-base-active: var(--ds-global-orange-11);
1069
- --ds-color-warning-text-subtle: var(--ds-global-orange-12);
1070
- --ds-color-warning-text-default: var(--ds-global-orange-13);
1071
- --ds-color-warning-contrast-default: var(--ds-global-orange-contrast-1);
1072
- --ds-color-warning-contrast-subtle: var(--ds-global-orange-contrast-2);
485
+ @layer ds.theme.color-scheme.dark {
486
+ [data-color-scheme="dark"] {
487
+ --ds-color-accent-background-default: #121e18;
488
+ --ds-color-accent-background-tinted: #17271f;
489
+ --ds-color-accent-surface-default: #1d3026;
490
+ --ds-color-accent-surface-tinted: #22392d;
491
+ --ds-color-accent-surface-hover: #274133;
492
+ --ds-color-accent-surface-active: #2c4a3a;
493
+ --ds-color-accent-border-subtle: #355846;
494
+ --ds-color-accent-border-default: #50876b;
495
+ --ds-color-accent-border-strong: #69b08c;
496
+ --ds-color-accent-text-subtle: #69b08c;
497
+ --ds-color-accent-text-default: #cfebdd;
498
+ --ds-color-accent-base-default: #284436;
499
+ --ds-color-accent-base-hover: #345745;
500
+ --ds-color-accent-base-active: #406c56;
501
+ --ds-color-accent-base-contrast-subtle: #d4d9d7;
502
+ --ds-color-accent-base-contrast-default: #ffffff;
503
+ --ds-color-neutral-background-default: #1b1b1b;
504
+ --ds-color-neutral-background-tinted: #232323;
505
+ --ds-color-neutral-surface-default: #2c2c2c;
506
+ --ds-color-neutral-surface-tinted: #353535;
507
+ --ds-color-neutral-surface-hover: #3b3b3b;
508
+ --ds-color-neutral-surface-active: #444444;
509
+ --ds-color-neutral-border-subtle: #515151;
510
+ --ds-color-neutral-border-default: #7c7c7c;
511
+ --ds-color-neutral-border-strong: #a2a2a2;
512
+ --ds-color-neutral-text-subtle: #a2a2a2;
513
+ --ds-color-neutral-text-default: #e5e5e5;
514
+ --ds-color-neutral-base-default: #ababab;
515
+ --ds-color-neutral-base-hover: #969696;
516
+ --ds-color-neutral-base-active: #818181;
517
+ --ds-color-neutral-base-contrast-subtle: #1b1b1b;
518
+ --ds-color-neutral-base-contrast-default: #000000;
519
+ --ds-color-support1-background-default: #191b1e;
520
+ --ds-color-support1-background-tinted: #202427;
521
+ --ds-color-support1-surface-default: #282c30;
522
+ --ds-color-support1-surface-tinted: #30353a;
523
+ --ds-color-support1-surface-hover: #363c41;
524
+ --ds-color-support1-surface-active: #3d454b;
525
+ --ds-color-support1-border-subtle: #495259;
526
+ --ds-color-support1-border-default: #707d89;
527
+ --ds-color-support1-border-strong: #92a4b3;
528
+ --ds-color-support1-text-subtle: #92a4b3;
529
+ --ds-color-support1-text-default: #d9e6f2;
530
+ --ds-color-support1-base-default: #23282b;
531
+ --ds-color-support1-base-hover: #343a3f;
532
+ --ds-color-support1-base-active: #444c53;
533
+ --ds-color-support1-base-contrast-subtle: #babbbc;
534
+ --ds-color-support1-base-contrast-default: #ffffff;
535
+ --ds-color-support2-background-default: #1e1b17;
536
+ --ds-color-support2-background-tinted: #27231d;
537
+ --ds-color-support2-surface-default: #302b24;
538
+ --ds-color-support2-surface-tinted: #3a342c;
539
+ --ds-color-support2-surface-hover: #413a31;
540
+ --ds-color-support2-surface-active: #4a4338;
541
+ --ds-color-support2-border-subtle: #595043;
542
+ --ds-color-support2-border-default: #877a67;
543
+ --ds-color-support2-border-strong: #b19f87;
544
+ --ds-color-support2-text-subtle: #b19f87;
545
+ --ds-color-support2-text-default: #f0e3d1;
546
+ --ds-color-support2-base-default: #2c2721;
547
+ --ds-color-support2-base-hover: #3e382f;
548
+ --ds-color-support2-base-active: #534b3f;
549
+ --ds-color-support2-base-contrast-subtle: #bcbbb9;
550
+ --ds-color-support2-base-contrast-default: #ffffff;
551
+ --ds-color-success-background-default: #012106;
552
+ --ds-color-success-background-tinted: #022a08;
553
+ --ds-color-success-surface-default: #023409;
554
+ --ds-color-success-surface-tinted: #033e0b;
555
+ --ds-color-success-surface-hover: #03460c;
556
+ --ds-color-success-surface-active: #044f0e;
557
+ --ds-color-success-border-subtle: #045f11;
558
+ --ds-color-success-border-default: #178f28;
559
+ --ds-color-success-border-strong: #62b36d;
560
+ --ds-color-success-text-subtle: #62b36d;
561
+ --ds-color-success-text-default: #d4ead7;
562
+ --ds-color-success-base-default: #138d24;
563
+ --ds-color-success-base-hover: #3ca14b;
564
+ --ds-color-success-base-active: #66b571;
565
+ --ds-color-success-base-contrast-subtle: #010501;
566
+ --ds-color-success-base-contrast-default: #000000;
567
+ --ds-color-danger-background-default: #3a0808;
568
+ --ds-color-danger-background-tinted: #4a0a0a;
569
+ --ds-color-danger-surface-default: #5a0d0d;
570
+ --ds-color-danger-surface-tinted: #6b0f0f;
571
+ --ds-color-danger-surface-hover: #781111;
572
+ --ds-color-danger-surface-active: #871313;
573
+ --ds-color-danger-border-subtle: #a11717;
574
+ --ds-color-danger-border-default: #cf5252;
575
+ --ds-color-danger-border-strong: #df8b8b;
576
+ --ds-color-danger-text-subtle: #df8b8b;
577
+ --ds-color-danger-text-default: #f6dfdf;
578
+ --ds-color-danger-base-default: #d76e6e;
579
+ --ds-color-danger-base-hover: #df8b8b;
580
+ --ds-color-danger-base-active: #e7a8a8;
581
+ --ds-color-danger-base-contrast-subtle: #271414;
582
+ --ds-color-danger-base-contrast-default: #000000;
583
+ --ds-color-info-background-default: #031d31;
584
+ --ds-color-info-background-tinted: #03253f;
585
+ --ds-color-info-surface-default: #042e4e;
586
+ --ds-color-info-surface-tinted: #05375d;
587
+ --ds-color-info-surface-hover: #053d68;
588
+ --ds-color-info-surface-active: #064676;
589
+ --ds-color-info-border-subtle: #07538d;
590
+ --ds-color-info-border-default: #2480c7;
591
+ --ds-color-info-border-strong: #69a8d8;
592
+ --ds-color-info-text-subtle: #69a8d8;
593
+ --ds-color-info-text-default: #d6e7f4;
594
+ --ds-color-info-base-default: #2d85c9;
595
+ --ds-color-info-base-hover: #519ad2;
596
+ --ds-color-info-base-active: #77b0dc;
597
+ --ds-color-info-base-contrast-subtle: #050e15;
598
+ --ds-color-info-base-contrast-default: #000000;
599
+ --ds-color-warning-background-default: #251904;
600
+ --ds-color-warning-background-tinted: #312006;
601
+ --ds-color-warning-surface-default: #3c2807;
602
+ --ds-color-warning-surface-tinted: #483008;
603
+ --ds-color-warning-surface-hover: #513609;
604
+ --ds-color-warning-surface-active: #5d3d0b;
605
+ --ds-color-warning-border-subtle: #6f490d;
606
+ --ds-color-warning-border-default: #a97013;
607
+ --ds-color-warning-border-strong: #dd9219;
608
+ --ds-color-warning-text-subtle: #dd9219;
609
+ --ds-color-warning-text-default: #f9e2bc;
610
+ --ds-color-warning-base-default: #60400b;
611
+ --ds-color-warning-base-hover: #7a510e;
612
+ --ds-color-warning-base-active: #946211;
613
+ --ds-color-warning-base-contrast-subtle: #e6e2d9;
614
+ --ds-color-warning-base-contrast-default: #ffffff;
1073
615
  --ds-color-focus-inner: #1b1b1b;
1074
- --ds-color-focus-outer: #e1e1e1;
1075
- --ds-global-blue-1: #031d30;
1076
- --ds-global-blue-2: #032540;
1077
- --ds-global-blue-3: #043256;
1078
- --ds-global-blue-4: #063f6c;
1079
- --ds-global-blue-5: #074d84;
1080
- --ds-global-blue-6: #075490;
1081
- --ds-global-blue-7: #0c72c1;
1082
- --ds-global-blue-8: #98c3e5;
1083
- --ds-global-blue-9: #2a84c8;
1084
- --ds-global-blue-10: #0a6dba;
1085
- --ds-global-blue-11: #085998;
1086
- --ds-global-blue-12: #6ba9d9;
1087
- --ds-global-blue-13: #d3e5f4;
1088
- --ds-global-blue-contrast-1: #000000;
1089
- --ds-global-blue-contrast-2: #040c13;
1090
- --ds-global-green-1: #012106;
1091
- --ds-global-green-2: #022b08;
1092
- --ds-global-green-3: #03380a;
1093
- --ds-global-green-4: #03490d;
1094
- --ds-global-green-5: #045810;
1095
- --ds-global-green-6: #045f11;
1096
- --ds-global-green-7: #068217;
1097
- --ds-global-green-8: #93cb9b;
1098
- --ds-global-green-9: #118c23;
1099
- --ds-global-green-10: #057615;
1100
- --ds-global-green-11: #045f11;
1101
- --ds-global-green-12: #63b46f;
1102
- --ds-global-green-13: #d1e9d4;
1103
- --ds-global-green-contrast-1: #000000;
1104
- --ds-global-green-contrast-2: #010401;
1105
- --ds-global-orange-1: #2d1507;
1106
- --ds-global-orange-2: #391b09;
1107
- --ds-global-orange-3: #4e250c;
1108
- --ds-global-orange-4: #633010;
1109
- --ds-global-orange-5: #783a13;
1110
- --ds-global-orange-6: #833f15;
1111
- --ds-global-orange-7: #b2551c;
1112
- --ds-global-orange-8: #e0b69c;
1113
- --ds-global-orange-9: #bc6028;
1114
- --ds-global-orange-10: #a24d1a;
1115
- --ds-global-orange-11: #833f15;
1116
- --ds-global-orange-12: #d29671;
1117
- --ds-global-orange-13: #f1ded3;
1118
- --ds-global-orange-contrast-1: #000000;
1119
- --ds-global-orange-contrast-2: #060301;
1120
- --ds-global-purple-1: #251238;
1121
- --ds-global-purple-2: #301748;
1122
- --ds-global-purple-3: #402060;
1123
- --ds-global-purple-4: #52287a;
1124
- --ds-global-purple-5: #643196;
1125
- --ds-global-purple-6: #6b399d;
1126
- --ds-global-purple-7: #865daf;
1127
- --ds-global-purple-8: #c9b7db;
1128
- --ds-global-purple-9: #b298cc;
1129
- --ds-global-purple-10: #a181c0;
1130
- --ds-global-purple-11: #8f69b5;
1131
- --ds-global-purple-12: #b298cc;
1132
- --ds-global-purple-13: #e7dfef;
1133
- --ds-global-purple-contrast-1: #000000;
1134
- --ds-global-purple-contrast-2: #18141b;
1135
- --ds-global-red-1: #3b0808;
1136
- --ds-global-red-2: #4b0a0a;
1137
- --ds-global-red-3: #620e0e;
1138
- --ds-global-red-4: #7c1212;
1139
- --ds-global-red-5: #961515;
1140
- --ds-global-red-6: #a31717;
1141
- --ds-global-red-7: #c93c3c;
1142
- --ds-global-red-8: #e9b0b0;
1143
- --ds-global-red-9: #d76e6e;
1144
- --ds-global-red-10: #ce4e4e;
1145
- --ds-global-red-11: #c32727;
1146
- --ds-global-red-12: #df8d8d;
1147
- --ds-global-red-13: #f5dcdc;
1148
- --ds-global-red-contrast-1: #000000;
1149
- --ds-global-red-contrast-2: #271414;
1150
- --ds-global-yellow-1: #221b06;
1151
- --ds-global-yellow-2: #2b2307;
1152
- --ds-global-yellow-3: #3a300a;
1153
- --ds-global-yellow-4: #4a3d0d;
1154
- --ds-global-yellow-5: #5a4a0f;
1155
- --ds-global-yellow-6: #635011;
1156
- --ds-global-yellow-7: #856d17;
1157
- --ds-global-yellow-8: #e4ba27;
1158
- --ds-global-yellow-9: #3d310a;
1159
- --ds-global-yellow-10: #52430e;
1160
- --ds-global-yellow-11: #695512;
1161
- --ds-global-yellow-12: #c39f21;
1162
- --ds-global-yellow-13: #f5e19b;
1163
- --ds-global-yellow-contrast-1: #ffffff;
1164
- --ds-global-yellow-contrast-2: #ccc9bf;
616
+ --ds-color-focus-outer: #e5e5e5;
617
+ --ds-link-color-visited: #b49acd;
1165
618
 
1166
619
  color-scheme: dark;
1167
620
  }
1168
621
 
1169
622
  @media (prefers-color-scheme: dark) {
1170
- [data-ds-color-mode="auto"] {
1171
- --ds-color-accent-1: #1b1b1b;
1172
- --ds-color-accent-2: #242424;
1173
- --ds-color-accent-3: #303030;
1174
- --ds-color-accent-4: #3e3e3e;
1175
- --ds-color-accent-5: #4b4b4b;
1176
- --ds-color-accent-6: #525252;
1177
- --ds-color-accent-7: #6f6f6f;
1178
- --ds-color-accent-8: #bebebe;
1179
- --ds-color-accent-9: #ababab;
1180
- --ds-color-accent-10: #969696;
1181
- --ds-color-accent-11: #818181;
1182
- --ds-color-accent-12: #a3a3a3;
1183
- --ds-color-accent-13: #e1e1e1;
1184
- --ds-color-accent-contrast-1: #000000;
1185
- --ds-color-accent-contrast-2: #1b1b1b;
1186
- --ds-color-accent-background-default: var(--ds-color-accent-1);
1187
- --ds-color-accent-background-subtle: var(--ds-color-accent-2);
1188
- --ds-color-accent-surface-default: var(--ds-color-accent-3);
1189
- --ds-color-accent-surface-hover: var(--ds-color-accent-4);
1190
- --ds-color-accent-surface-active: var(--ds-color-accent-5);
1191
- --ds-color-accent-border-subtle: var(--ds-color-accent-6);
1192
- --ds-color-accent-border-default: var(--ds-color-accent-7);
1193
- --ds-color-accent-border-strong: var(--ds-color-accent-8);
1194
- --ds-color-accent-base-default: var(--ds-color-accent-9);
1195
- --ds-color-accent-base-hover: var(--ds-color-accent-10);
1196
- --ds-color-accent-base-active: var(--ds-color-accent-11);
1197
- --ds-color-accent-text-subtle: var(--ds-color-accent-12);
1198
- --ds-color-accent-text-default: var(--ds-color-accent-13);
1199
- --ds-color-accent-contrast-default: var(--ds-color-accent-contrast-1);
1200
- --ds-color-accent-contrast-subtle: var(--ds-color-accent-contrast-2);
1201
- --ds-color-neutral-1: #1b1b1b;
1202
- --ds-color-neutral-2: #242424;
1203
- --ds-color-neutral-3: #303030;
1204
- --ds-color-neutral-4: #3e3e3e;
1205
- --ds-color-neutral-5: #4b4b4b;
1206
- --ds-color-neutral-6: #525252;
1207
- --ds-color-neutral-7: #6f6f6f;
1208
- --ds-color-neutral-8: #bebebe;
1209
- --ds-color-neutral-9: #1f1f1f;
1210
- --ds-color-neutral-10: #303030;
1211
- --ds-color-neutral-11: #424242;
1212
- --ds-color-neutral-12: #a3a3a3;
1213
- --ds-color-neutral-13: #e1e1e1;
1214
- --ds-color-neutral-contrast-1: #ffffff;
1215
- --ds-color-neutral-contrast-2: #b0b0b0;
1216
- --ds-color-neutral-background-default: var(--ds-color-neutral-1);
1217
- --ds-color-neutral-background-subtle: var(--ds-color-neutral-2);
1218
- --ds-color-neutral-surface-default: var(--ds-color-neutral-3);
1219
- --ds-color-neutral-surface-hover: var(--ds-color-neutral-4);
1220
- --ds-color-neutral-surface-active: var(--ds-color-neutral-5);
1221
- --ds-color-neutral-border-subtle: var(--ds-color-neutral-6);
1222
- --ds-color-neutral-border-default: var(--ds-color-neutral-7);
1223
- --ds-color-neutral-border-strong: var(--ds-color-neutral-8);
1224
- --ds-color-neutral-base-default: var(--ds-color-neutral-9);
1225
- --ds-color-neutral-base-hover: var(--ds-color-neutral-10);
1226
- --ds-color-neutral-base-active: var(--ds-color-neutral-11);
1227
- --ds-color-neutral-text-subtle: var(--ds-color-neutral-12);
1228
- --ds-color-neutral-text-default: var(--ds-color-neutral-13);
1229
- --ds-color-neutral-contrast-default: var(--ds-color-neutral-contrast-1);
1230
- --ds-color-neutral-contrast-subtle: var(--ds-color-neutral-contrast-2);
1231
- --ds-color-brand1-1: #121e18;
1232
- --ds-color-brand1-2: #18271f;
1233
- --ds-color-brand1-3: #1f342a;
1234
- --ds-color-brand1-4: #284336;
1235
- --ds-color-brand1-5: #315241;
1236
- --ds-color-brand1-6: #355947;
1237
- --ds-color-brand1-7: #487960;
1238
- --ds-color-brand1-8: #86cda9;
1239
- --ds-color-brand1-9: #284336;
1240
- --ds-color-brand1-10: #345745;
1241
- --ds-color-brand1-11: #406b55;
1242
- --ds-color-brand1-12: #6ab28d;
1243
- --ds-color-brand1-13: #cae9d9;
1244
- --ds-color-brand1-contrast-1: #ffffff;
1245
- --ds-color-brand1-contrast-2: #d3d8d6;
1246
- --ds-color-brand1-background-default: var(--ds-color-brand1-1);
1247
- --ds-color-brand1-background-subtle: var(--ds-color-brand1-2);
1248
- --ds-color-brand1-surface-default: var(--ds-color-brand1-3);
1249
- --ds-color-brand1-surface-hover: var(--ds-color-brand1-4);
1250
- --ds-color-brand1-surface-active: var(--ds-color-brand1-5);
1251
- --ds-color-brand1-border-subtle: var(--ds-color-brand1-6);
1252
- --ds-color-brand1-border-default: var(--ds-color-brand1-7);
1253
- --ds-color-brand1-border-strong: var(--ds-color-brand1-8);
1254
- --ds-color-brand1-base-default: var(--ds-color-brand1-9);
1255
- --ds-color-brand1-base-hover: var(--ds-color-brand1-10);
1256
- --ds-color-brand1-base-active: var(--ds-color-brand1-11);
1257
- --ds-color-brand1-text-subtle: var(--ds-color-brand1-12);
1258
- --ds-color-brand1-text-default: var(--ds-color-brand1-13);
1259
- --ds-color-brand1-contrast-default: var(--ds-color-brand1-contrast-1);
1260
- --ds-color-brand1-contrast-subtle: var(--ds-color-brand1-contrast-2);
1261
- --ds-color-brand2-1: #191c1f;
1262
- --ds-color-brand2-2: #202428;
1263
- --ds-color-brand2-3: #2b3135;
1264
- --ds-color-brand2-4: #383f44;
1265
- --ds-color-brand2-5: #444c53;
1266
- --ds-color-brand2-6: #4a535b;
1267
- --ds-color-brand2-7: #65717b;
1268
- --ds-color-brand2-8: #acc1d2;
1269
- --ds-color-brand2-9: #24282b;
1270
- --ds-color-brand2-10: #33393f;
1271
- --ds-color-brand2-11: #444c53;
1272
- --ds-color-brand2-12: #93a5b4;
1273
- --ds-color-brand2-13: #d5e4f0;
1274
- --ds-color-brand2-contrast-1: #ffffff;
1275
- --ds-color-brand2-contrast-2: #babbbc;
1276
- --ds-color-brand2-background-default: var(--ds-color-brand2-1);
1277
- --ds-color-brand2-background-subtle: var(--ds-color-brand2-2);
1278
- --ds-color-brand2-surface-default: var(--ds-color-brand2-3);
1279
- --ds-color-brand2-surface-hover: var(--ds-color-brand2-4);
1280
- --ds-color-brand2-surface-active: var(--ds-color-brand2-5);
1281
- --ds-color-brand2-border-subtle: var(--ds-color-brand2-6);
1282
- --ds-color-brand2-border-default: var(--ds-color-brand2-7);
1283
- --ds-color-brand2-border-strong: var(--ds-color-brand2-8);
1284
- --ds-color-brand2-base-default: var(--ds-color-brand2-9);
1285
- --ds-color-brand2-base-hover: var(--ds-color-brand2-10);
1286
- --ds-color-brand2-base-active: var(--ds-color-brand2-11);
1287
- --ds-color-brand2-text-subtle: var(--ds-color-brand2-12);
1288
- --ds-color-brand2-text-default: var(--ds-color-brand2-13);
1289
- --ds-color-brand2-contrast-default: var(--ds-color-brand2-contrast-1);
1290
- --ds-color-brand2-contrast-subtle: var(--ds-color-brand2-contrast-2);
1291
- --ds-color-brand3-1: #1f1b17;
1292
- --ds-color-brand3-2: #27231e;
1293
- --ds-color-brand3-3: #353028;
1294
- --ds-color-brand3-4: #433c33;
1295
- --ds-color-brand3-5: #534a3f;
1296
- --ds-color-brand3-6: #5b5145;
1297
- --ds-color-brand3-7: #7a6d5c;
1298
- --ds-color-brand3-8: #d0bb9e;
1299
- --ds-color-brand3-9: #2c2721;
1300
- --ds-color-brand3-10: #3f3830;
1301
- --ds-color-brand3-11: #534a3f;
1302
- --ds-color-brand3-12: #b2a188;
1303
- --ds-color-brand3-13: #efe0cc;
1304
- --ds-color-brand3-contrast-1: #ffffff;
1305
- --ds-color-brand3-contrast-2: #bdbbb9;
1306
- --ds-color-brand3-background-default: var(--ds-color-brand3-1);
1307
- --ds-color-brand3-background-subtle: var(--ds-color-brand3-2);
1308
- --ds-color-brand3-surface-default: var(--ds-color-brand3-3);
1309
- --ds-color-brand3-surface-hover: var(--ds-color-brand3-4);
1310
- --ds-color-brand3-surface-active: var(--ds-color-brand3-5);
1311
- --ds-color-brand3-border-subtle: var(--ds-color-brand3-6);
1312
- --ds-color-brand3-border-default: var(--ds-color-brand3-7);
1313
- --ds-color-brand3-border-strong: var(--ds-color-brand3-8);
1314
- --ds-color-brand3-base-default: var(--ds-color-brand3-9);
1315
- --ds-color-brand3-base-hover: var(--ds-color-brand3-10);
1316
- --ds-color-brand3-base-active: var(--ds-color-brand3-11);
1317
- --ds-color-brand3-text-subtle: var(--ds-color-brand3-12);
1318
- --ds-color-brand3-text-default: var(--ds-color-brand3-13);
1319
- --ds-color-brand3-contrast-default: var(--ds-color-brand3-contrast-1);
1320
- --ds-color-brand3-contrast-subtle: var(--ds-color-brand3-contrast-2);
1321
- --ds-color-success-background-default: var(--ds-global-green-1);
1322
- --ds-color-success-background-subtle: var(--ds-global-green-2);
1323
- --ds-color-success-surface-default: var(--ds-global-green-3);
1324
- --ds-color-success-surface-hover: var(--ds-global-green-4);
1325
- --ds-color-success-surface-active: var(--ds-global-green-5);
1326
- --ds-color-success-border-subtle: var(--ds-global-green-6);
1327
- --ds-color-success-border-default: var(--ds-global-green-7);
1328
- --ds-color-success-border-strong: var(--ds-global-green-8);
1329
- --ds-color-success-base-default: var(--ds-global-green-9);
1330
- --ds-color-success-base-hover: var(--ds-global-green-10);
1331
- --ds-color-success-base-active: var(--ds-global-green-11);
1332
- --ds-color-success-text-subtle: var(--ds-global-green-12);
1333
- --ds-color-success-text-default: var(--ds-global-green-13);
1334
- --ds-color-success-contrast-default: var(--ds-global-green-contrast-1);
1335
- --ds-color-success-contrast-subtle: var(--ds-global-green-contrast-2);
1336
- --ds-color-danger-background-default: var(--ds-global-red-1);
1337
- --ds-color-danger-background-subtle: var(--ds-global-red-2);
1338
- --ds-color-danger-surface-default: var(--ds-global-red-3);
1339
- --ds-color-danger-surface-hover: var(--ds-global-red-4);
1340
- --ds-color-danger-surface-active: var(--ds-global-red-5);
1341
- --ds-color-danger-border-subtle: var(--ds-global-red-6);
1342
- --ds-color-danger-border-default: var(--ds-global-red-7);
1343
- --ds-color-danger-border-strong: var(--ds-global-red-8);
1344
- --ds-color-danger-base-default: var(--ds-global-red-9);
1345
- --ds-color-danger-base-hover: var(--ds-global-red-10);
1346
- --ds-color-danger-base-active: var(--ds-global-red-11);
1347
- --ds-color-danger-text-subtle: var(--ds-global-red-12);
1348
- --ds-color-danger-text-default: var(--ds-global-red-13);
1349
- --ds-color-danger-contrast-default: var(--ds-global-red-contrast-1);
1350
- --ds-color-danger-contrast-subtle: var(--ds-global-red-contrast-2);
1351
- --ds-color-info-background-default: #031d30;
1352
- --ds-color-info-background-subtle: #032540;
1353
- --ds-color-info-surface-default: #043256;
1354
- --ds-color-info-surface-hover: #063f6c;
1355
- --ds-color-info-surface-active: #074d84;
1356
- --ds-color-info-border-subtle: #075490;
1357
- --ds-color-info-border-default: #0c72c1;
1358
- --ds-color-info-border-strong: #98c3e5;
1359
- --ds-color-info-base-default: #2a84c8;
1360
- --ds-color-info-base-hover: #0a6dba;
1361
- --ds-color-info-base-active: #085998;
1362
- --ds-color-info-text-subtle: #6ba9d9;
1363
- --ds-color-info-text-default: #d3e5f4;
1364
- --ds-color-info-contrast-default: #000000;
1365
- --ds-color-info-contrast-subtle: #040c13;
1366
- --ds-color-warning-background-default: var(--ds-global-yellow-1);
1367
- --ds-color-warning-background-subtle: var(--ds-global-yellow-2);
1368
- --ds-color-warning-surface-default: var(--ds-global-yellow-3);
1369
- --ds-color-warning-surface-hover: var(--ds-global-yellow-4);
1370
- --ds-color-warning-surface-active: var(--ds-global-yellow-5);
1371
- --ds-color-warning-border-subtle: var(--ds-global-yellow-6);
1372
- --ds-color-warning-border-default: var(--ds-global-yellow-7);
1373
- --ds-color-warning-border-strong: var(--ds-global-yellow-8);
1374
- --ds-color-warning-base-default: var(--ds-global-orange-9);
1375
- --ds-color-warning-base-hover: var(--ds-global-orange-10);
1376
- --ds-color-warning-base-active: var(--ds-global-orange-11);
1377
- --ds-color-warning-text-subtle: var(--ds-global-orange-12);
1378
- --ds-color-warning-text-default: var(--ds-global-orange-13);
1379
- --ds-color-warning-contrast-default: var(--ds-global-orange-contrast-1);
1380
- --ds-color-warning-contrast-subtle: var(--ds-global-orange-contrast-2);
623
+ [data-color-scheme="auto"] {
624
+ --ds-color-accent-background-default: #121e18;
625
+ --ds-color-accent-background-tinted: #17271f;
626
+ --ds-color-accent-surface-default: #1d3026;
627
+ --ds-color-accent-surface-tinted: #22392d;
628
+ --ds-color-accent-surface-hover: #274133;
629
+ --ds-color-accent-surface-active: #2c4a3a;
630
+ --ds-color-accent-border-subtle: #355846;
631
+ --ds-color-accent-border-default: #50876b;
632
+ --ds-color-accent-border-strong: #69b08c;
633
+ --ds-color-accent-text-subtle: #69b08c;
634
+ --ds-color-accent-text-default: #cfebdd;
635
+ --ds-color-accent-base-default: #284436;
636
+ --ds-color-accent-base-hover: #345745;
637
+ --ds-color-accent-base-active: #406c56;
638
+ --ds-color-accent-base-contrast-subtle: #d4d9d7;
639
+ --ds-color-accent-base-contrast-default: #ffffff;
640
+ --ds-color-neutral-background-default: #1b1b1b;
641
+ --ds-color-neutral-background-tinted: #232323;
642
+ --ds-color-neutral-surface-default: #2c2c2c;
643
+ --ds-color-neutral-surface-tinted: #353535;
644
+ --ds-color-neutral-surface-hover: #3b3b3b;
645
+ --ds-color-neutral-surface-active: #444444;
646
+ --ds-color-neutral-border-subtle: #515151;
647
+ --ds-color-neutral-border-default: #7c7c7c;
648
+ --ds-color-neutral-border-strong: #a2a2a2;
649
+ --ds-color-neutral-text-subtle: #a2a2a2;
650
+ --ds-color-neutral-text-default: #e5e5e5;
651
+ --ds-color-neutral-base-default: #ababab;
652
+ --ds-color-neutral-base-hover: #969696;
653
+ --ds-color-neutral-base-active: #818181;
654
+ --ds-color-neutral-base-contrast-subtle: #1b1b1b;
655
+ --ds-color-neutral-base-contrast-default: #000000;
656
+ --ds-color-support1-background-default: #191b1e;
657
+ --ds-color-support1-background-tinted: #202427;
658
+ --ds-color-support1-surface-default: #282c30;
659
+ --ds-color-support1-surface-tinted: #30353a;
660
+ --ds-color-support1-surface-hover: #363c41;
661
+ --ds-color-support1-surface-active: #3d454b;
662
+ --ds-color-support1-border-subtle: #495259;
663
+ --ds-color-support1-border-default: #707d89;
664
+ --ds-color-support1-border-strong: #92a4b3;
665
+ --ds-color-support1-text-subtle: #92a4b3;
666
+ --ds-color-support1-text-default: #d9e6f2;
667
+ --ds-color-support1-base-default: #23282b;
668
+ --ds-color-support1-base-hover: #343a3f;
669
+ --ds-color-support1-base-active: #444c53;
670
+ --ds-color-support1-base-contrast-subtle: #babbbc;
671
+ --ds-color-support1-base-contrast-default: #ffffff;
672
+ --ds-color-support2-background-default: #1e1b17;
673
+ --ds-color-support2-background-tinted: #27231d;
674
+ --ds-color-support2-surface-default: #302b24;
675
+ --ds-color-support2-surface-tinted: #3a342c;
676
+ --ds-color-support2-surface-hover: #413a31;
677
+ --ds-color-support2-surface-active: #4a4338;
678
+ --ds-color-support2-border-subtle: #595043;
679
+ --ds-color-support2-border-default: #877a67;
680
+ --ds-color-support2-border-strong: #b19f87;
681
+ --ds-color-support2-text-subtle: #b19f87;
682
+ --ds-color-support2-text-default: #f0e3d1;
683
+ --ds-color-support2-base-default: #2c2721;
684
+ --ds-color-support2-base-hover: #3e382f;
685
+ --ds-color-support2-base-active: #534b3f;
686
+ --ds-color-support2-base-contrast-subtle: #bcbbb9;
687
+ --ds-color-support2-base-contrast-default: #ffffff;
688
+ --ds-color-success-background-default: #012106;
689
+ --ds-color-success-background-tinted: #022a08;
690
+ --ds-color-success-surface-default: #023409;
691
+ --ds-color-success-surface-tinted: #033e0b;
692
+ --ds-color-success-surface-hover: #03460c;
693
+ --ds-color-success-surface-active: #044f0e;
694
+ --ds-color-success-border-subtle: #045f11;
695
+ --ds-color-success-border-default: #178f28;
696
+ --ds-color-success-border-strong: #62b36d;
697
+ --ds-color-success-text-subtle: #62b36d;
698
+ --ds-color-success-text-default: #d4ead7;
699
+ --ds-color-success-base-default: #138d24;
700
+ --ds-color-success-base-hover: #3ca14b;
701
+ --ds-color-success-base-active: #66b571;
702
+ --ds-color-success-base-contrast-subtle: #010501;
703
+ --ds-color-success-base-contrast-default: #000000;
704
+ --ds-color-danger-background-default: #3a0808;
705
+ --ds-color-danger-background-tinted: #4a0a0a;
706
+ --ds-color-danger-surface-default: #5a0d0d;
707
+ --ds-color-danger-surface-tinted: #6b0f0f;
708
+ --ds-color-danger-surface-hover: #781111;
709
+ --ds-color-danger-surface-active: #871313;
710
+ --ds-color-danger-border-subtle: #a11717;
711
+ --ds-color-danger-border-default: #cf5252;
712
+ --ds-color-danger-border-strong: #df8b8b;
713
+ --ds-color-danger-text-subtle: #df8b8b;
714
+ --ds-color-danger-text-default: #f6dfdf;
715
+ --ds-color-danger-base-default: #d76e6e;
716
+ --ds-color-danger-base-hover: #df8b8b;
717
+ --ds-color-danger-base-active: #e7a8a8;
718
+ --ds-color-danger-base-contrast-subtle: #271414;
719
+ --ds-color-danger-base-contrast-default: #000000;
720
+ --ds-color-info-background-default: #031d31;
721
+ --ds-color-info-background-tinted: #03253f;
722
+ --ds-color-info-surface-default: #042e4e;
723
+ --ds-color-info-surface-tinted: #05375d;
724
+ --ds-color-info-surface-hover: #053d68;
725
+ --ds-color-info-surface-active: #064676;
726
+ --ds-color-info-border-subtle: #07538d;
727
+ --ds-color-info-border-default: #2480c7;
728
+ --ds-color-info-border-strong: #69a8d8;
729
+ --ds-color-info-text-subtle: #69a8d8;
730
+ --ds-color-info-text-default: #d6e7f4;
731
+ --ds-color-info-base-default: #2d85c9;
732
+ --ds-color-info-base-hover: #519ad2;
733
+ --ds-color-info-base-active: #77b0dc;
734
+ --ds-color-info-base-contrast-subtle: #050e15;
735
+ --ds-color-info-base-contrast-default: #000000;
736
+ --ds-color-warning-background-default: #251904;
737
+ --ds-color-warning-background-tinted: #312006;
738
+ --ds-color-warning-surface-default: #3c2807;
739
+ --ds-color-warning-surface-tinted: #483008;
740
+ --ds-color-warning-surface-hover: #513609;
741
+ --ds-color-warning-surface-active: #5d3d0b;
742
+ --ds-color-warning-border-subtle: #6f490d;
743
+ --ds-color-warning-border-default: #a97013;
744
+ --ds-color-warning-border-strong: #dd9219;
745
+ --ds-color-warning-text-subtle: #dd9219;
746
+ --ds-color-warning-text-default: #f9e2bc;
747
+ --ds-color-warning-base-default: #60400b;
748
+ --ds-color-warning-base-hover: #7a510e;
749
+ --ds-color-warning-base-active: #946211;
750
+ --ds-color-warning-base-contrast-subtle: #e6e2d9;
751
+ --ds-color-warning-base-contrast-default: #ffffff;
1381
752
  --ds-color-focus-inner: #1b1b1b;
1382
- --ds-color-focus-outer: #e1e1e1;
1383
- --ds-global-blue-1: #031d30;
1384
- --ds-global-blue-2: #032540;
1385
- --ds-global-blue-3: #043256;
1386
- --ds-global-blue-4: #063f6c;
1387
- --ds-global-blue-5: #074d84;
1388
- --ds-global-blue-6: #075490;
1389
- --ds-global-blue-7: #0c72c1;
1390
- --ds-global-blue-8: #98c3e5;
1391
- --ds-global-blue-9: #2a84c8;
1392
- --ds-global-blue-10: #0a6dba;
1393
- --ds-global-blue-11: #085998;
1394
- --ds-global-blue-12: #6ba9d9;
1395
- --ds-global-blue-13: #d3e5f4;
1396
- --ds-global-blue-contrast-1: #000000;
1397
- --ds-global-blue-contrast-2: #040c13;
1398
- --ds-global-green-1: #012106;
1399
- --ds-global-green-2: #022b08;
1400
- --ds-global-green-3: #03380a;
1401
- --ds-global-green-4: #03490d;
1402
- --ds-global-green-5: #045810;
1403
- --ds-global-green-6: #045f11;
1404
- --ds-global-green-7: #068217;
1405
- --ds-global-green-8: #93cb9b;
1406
- --ds-global-green-9: #118c23;
1407
- --ds-global-green-10: #057615;
1408
- --ds-global-green-11: #045f11;
1409
- --ds-global-green-12: #63b46f;
1410
- --ds-global-green-13: #d1e9d4;
1411
- --ds-global-green-contrast-1: #000000;
1412
- --ds-global-green-contrast-2: #010401;
1413
- --ds-global-orange-1: #2d1507;
1414
- --ds-global-orange-2: #391b09;
1415
- --ds-global-orange-3: #4e250c;
1416
- --ds-global-orange-4: #633010;
1417
- --ds-global-orange-5: #783a13;
1418
- --ds-global-orange-6: #833f15;
1419
- --ds-global-orange-7: #b2551c;
1420
- --ds-global-orange-8: #e0b69c;
1421
- --ds-global-orange-9: #bc6028;
1422
- --ds-global-orange-10: #a24d1a;
1423
- --ds-global-orange-11: #833f15;
1424
- --ds-global-orange-12: #d29671;
1425
- --ds-global-orange-13: #f1ded3;
1426
- --ds-global-orange-contrast-1: #000000;
1427
- --ds-global-orange-contrast-2: #060301;
1428
- --ds-global-purple-1: #251238;
1429
- --ds-global-purple-2: #301748;
1430
- --ds-global-purple-3: #402060;
1431
- --ds-global-purple-4: #52287a;
1432
- --ds-global-purple-5: #643196;
1433
- --ds-global-purple-6: #6b399d;
1434
- --ds-global-purple-7: #865daf;
1435
- --ds-global-purple-8: #c9b7db;
1436
- --ds-global-purple-9: #b298cc;
1437
- --ds-global-purple-10: #a181c0;
1438
- --ds-global-purple-11: #8f69b5;
1439
- --ds-global-purple-12: #b298cc;
1440
- --ds-global-purple-13: #e7dfef;
1441
- --ds-global-purple-contrast-1: #000000;
1442
- --ds-global-purple-contrast-2: #18141b;
1443
- --ds-global-red-1: #3b0808;
1444
- --ds-global-red-2: #4b0a0a;
1445
- --ds-global-red-3: #620e0e;
1446
- --ds-global-red-4: #7c1212;
1447
- --ds-global-red-5: #961515;
1448
- --ds-global-red-6: #a31717;
1449
- --ds-global-red-7: #c93c3c;
1450
- --ds-global-red-8: #e9b0b0;
1451
- --ds-global-red-9: #d76e6e;
1452
- --ds-global-red-10: #ce4e4e;
1453
- --ds-global-red-11: #c32727;
1454
- --ds-global-red-12: #df8d8d;
1455
- --ds-global-red-13: #f5dcdc;
1456
- --ds-global-red-contrast-1: #000000;
1457
- --ds-global-red-contrast-2: #271414;
1458
- --ds-global-yellow-1: #221b06;
1459
- --ds-global-yellow-2: #2b2307;
1460
- --ds-global-yellow-3: #3a300a;
1461
- --ds-global-yellow-4: #4a3d0d;
1462
- --ds-global-yellow-5: #5a4a0f;
1463
- --ds-global-yellow-6: #635011;
1464
- --ds-global-yellow-7: #856d17;
1465
- --ds-global-yellow-8: #e4ba27;
1466
- --ds-global-yellow-9: #3d310a;
1467
- --ds-global-yellow-10: #52430e;
1468
- --ds-global-yellow-11: #695512;
1469
- --ds-global-yellow-12: #c39f21;
1470
- --ds-global-yellow-13: #f5e19b;
1471
- --ds-global-yellow-contrast-1: #ffffff;
1472
- --ds-global-yellow-contrast-2: #ccc9bf;
753
+ --ds-color-focus-outer: #e5e5e5;
754
+ --ds-link-color-visited: #b49acd;
1473
755
 
1474
756
  color-scheme: dark;
1475
757
  }
@@ -1478,324 +760,12 @@
1478
760
 
1479
761
  }
1480
762
 
1481
- /**
1482
- * These files are generated from design tokens defind using Token Studio
1483
- */
1484
-
1485
- @layer ds.theme.color-mode.contrast {
1486
- [data-ds-color-mode="contrast"] {
1487
- --ds-color-accent-1: #040404;
1488
- --ds-color-accent-2: #131313;
1489
- --ds-color-accent-3: #242424;
1490
- --ds-color-accent-4: #303030;
1491
- --ds-color-accent-5: #3e3e3e;
1492
- --ds-color-accent-6: #8b8b8b;
1493
- --ds-color-accent-7: #ababab;
1494
- --ds-color-accent-8: #cccccc;
1495
- --ds-color-accent-9: #ababab;
1496
- --ds-color-accent-10: #969696;
1497
- --ds-color-accent-11: #818181;
1498
- --ds-color-accent-12: #c6c6c6;
1499
- --ds-color-accent-13: #f0f0f0;
1500
- --ds-color-accent-contrast-1: #000000;
1501
- --ds-color-accent-contrast-2: #1b1b1b;
1502
- --ds-color-accent-background-default: var(--ds-color-accent-1);
1503
- --ds-color-accent-background-subtle: var(--ds-color-accent-2);
1504
- --ds-color-accent-surface-default: var(--ds-color-accent-3);
1505
- --ds-color-accent-surface-hover: var(--ds-color-accent-4);
1506
- --ds-color-accent-surface-active: var(--ds-color-accent-5);
1507
- --ds-color-accent-border-subtle: var(--ds-color-accent-6);
1508
- --ds-color-accent-border-default: var(--ds-color-accent-7);
1509
- --ds-color-accent-border-strong: var(--ds-color-accent-8);
1510
- --ds-color-accent-base-default: var(--ds-color-accent-9);
1511
- --ds-color-accent-base-hover: var(--ds-color-accent-10);
1512
- --ds-color-accent-base-active: var(--ds-color-accent-11);
1513
- --ds-color-accent-text-subtle: var(--ds-color-accent-12);
1514
- --ds-color-accent-text-default: var(--ds-color-accent-13);
1515
- --ds-color-accent-contrast-default: var(--ds-color-accent-contrast-1);
1516
- --ds-color-accent-contrast-subtle: var(--ds-color-accent-contrast-2);
1517
- --ds-color-neutral-1: #040404;
1518
- --ds-color-neutral-2: #131313;
1519
- --ds-color-neutral-3: #242424;
1520
- --ds-color-neutral-4: #303030;
1521
- --ds-color-neutral-5: #3e3e3e;
1522
- --ds-color-neutral-6: #8b8b8b;
1523
- --ds-color-neutral-7: #ababab;
1524
- --ds-color-neutral-8: #cccccc;
1525
- --ds-color-neutral-9: #1f1f1f;
1526
- --ds-color-neutral-10: #303030;
1527
- --ds-color-neutral-11: #424242;
1528
- --ds-color-neutral-12: #c6c6c6;
1529
- --ds-color-neutral-13: #f0f0f0;
1530
- --ds-color-neutral-contrast-1: #ffffff;
1531
- --ds-color-neutral-contrast-2: #b0b0b0;
1532
- --ds-color-neutral-background-default: var(--ds-color-neutral-1);
1533
- --ds-color-neutral-background-subtle: var(--ds-color-neutral-2);
1534
- --ds-color-neutral-surface-default: var(--ds-color-neutral-3);
1535
- --ds-color-neutral-surface-hover: var(--ds-color-neutral-4);
1536
- --ds-color-neutral-surface-active: var(--ds-color-neutral-5);
1537
- --ds-color-neutral-border-subtle: var(--ds-color-neutral-6);
1538
- --ds-color-neutral-border-default: var(--ds-color-neutral-7);
1539
- --ds-color-neutral-border-strong: var(--ds-color-neutral-8);
1540
- --ds-color-neutral-base-default: var(--ds-color-neutral-9);
1541
- --ds-color-neutral-base-hover: var(--ds-color-neutral-10);
1542
- --ds-color-neutral-base-active: var(--ds-color-neutral-11);
1543
- --ds-color-neutral-text-subtle: var(--ds-color-neutral-12);
1544
- --ds-color-neutral-text-default: var(--ds-color-neutral-13);
1545
- --ds-color-neutral-contrast-default: var(--ds-color-neutral-contrast-1);
1546
- --ds-color-neutral-contrast-subtle: var(--ds-color-neutral-contrast-2);
1547
- --ds-color-brand1-1: #020303;
1548
- --ds-color-brand1-2: #0c1511;
1549
- --ds-color-brand1-3: #18271f;
1550
- --ds-color-brand1-4: #1f342a;
1551
- --ds-color-brand1-5: #284336;
1552
- --ds-color-brand1-6: #5a9878;
1553
- --ds-color-brand1-7: #6fba93;
1554
- --ds-color-brand1-8: #a1d8bc;
1555
- --ds-color-brand1-9: #284336;
1556
- --ds-color-brand1-10: #345745;
1557
- --ds-color-brand1-11: #406b55;
1558
- --ds-color-brand1-12: #95d3b3;
1559
- --ds-color-brand1-13: #e4f4ec;
1560
- --ds-color-brand1-contrast-1: #ffffff;
1561
- --ds-color-brand1-contrast-2: #d3d8d6;
1562
- --ds-color-brand1-background-default: var(--ds-color-brand1-1);
1563
- --ds-color-brand1-background-subtle: var(--ds-color-brand1-2);
1564
- --ds-color-brand1-surface-default: var(--ds-color-brand1-3);
1565
- --ds-color-brand1-surface-hover: var(--ds-color-brand1-4);
1566
- --ds-color-brand1-surface-active: var(--ds-color-brand1-5);
1567
- --ds-color-brand1-border-subtle: var(--ds-color-brand1-6);
1568
- --ds-color-brand1-border-default: var(--ds-color-brand1-7);
1569
- --ds-color-brand1-border-strong: var(--ds-color-brand1-8);
1570
- --ds-color-brand1-base-default: var(--ds-color-brand1-9);
1571
- --ds-color-brand1-base-hover: var(--ds-color-brand1-10);
1572
- --ds-color-brand1-base-active: var(--ds-color-brand1-11);
1573
- --ds-color-brand1-text-subtle: var(--ds-color-brand1-12);
1574
- --ds-color-brand1-text-default: var(--ds-color-brand1-13);
1575
- --ds-color-brand1-contrast-default: var(--ds-color-brand1-contrast-1);
1576
- --ds-color-brand1-contrast-subtle: var(--ds-color-brand1-contrast-2);
1577
- --ds-color-brand2-1: #030304;
1578
- --ds-color-brand2-2: #111415;
1579
- --ds-color-brand2-3: #202428;
1580
- --ds-color-brand2-4: #2b3135;
1581
- --ds-color-brand2-5: #383f44;
1582
- --ds-color-brand2-6: #7e8d9a;
1583
- --ds-color-brand2-7: #9baebd;
1584
- --ds-color-brand2-8: #b8cfe1;
1585
- --ds-color-brand2-9: #24282b;
1586
- --ds-color-brand2-10: #33393f;
1587
- --ds-color-brand2-11: #444c53;
1588
- --ds-color-brand2-12: #b3c8da;
1589
- --ds-color-brand2-13: #eaf1f8;
1590
- --ds-color-brand2-contrast-1: #ffffff;
1591
- --ds-color-brand2-contrast-2: #babbbc;
1592
- --ds-color-brand2-background-default: var(--ds-color-brand2-1);
1593
- --ds-color-brand2-background-subtle: var(--ds-color-brand2-2);
1594
- --ds-color-brand2-surface-default: var(--ds-color-brand2-3);
1595
- --ds-color-brand2-surface-hover: var(--ds-color-brand2-4);
1596
- --ds-color-brand2-surface-active: var(--ds-color-brand2-5);
1597
- --ds-color-brand2-border-subtle: var(--ds-color-brand2-6);
1598
- --ds-color-brand2-border-default: var(--ds-color-brand2-7);
1599
- --ds-color-brand2-border-strong: var(--ds-color-brand2-8);
1600
- --ds-color-brand2-base-default: var(--ds-color-brand2-9);
1601
- --ds-color-brand2-base-hover: var(--ds-color-brand2-10);
1602
- --ds-color-brand2-base-active: var(--ds-color-brand2-11);
1603
- --ds-color-brand2-text-subtle: var(--ds-color-brand2-12);
1604
- --ds-color-brand2-text-default: var(--ds-color-brand2-13);
1605
- --ds-color-brand2-contrast-default: var(--ds-color-brand2-contrast-1);
1606
- --ds-color-brand2-contrast-subtle: var(--ds-color-brand2-contrast-2);
1607
- --ds-color-brand3-1: #040303;
1608
- --ds-color-brand3-2: #161310;
1609
- --ds-color-brand3-3: #27231e;
1610
- --ds-color-brand3-4: #353028;
1611
- --ds-color-brand3-5: #433c33;
1612
- --ds-color-brand3-6: #998974;
1613
- --ds-color-brand3-7: #bba98e;
1614
- --ds-color-brand3-8: #dec8a9;
1615
- --ds-color-brand3-9: #2c2721;
1616
- --ds-color-brand3-10: #3f3830;
1617
- --ds-color-brand3-11: #534a3f;
1618
- --ds-color-brand3-12: #d9c3a5;
1619
- --ds-color-brand3-13: #f7f0e7;
1620
- --ds-color-brand3-contrast-1: #ffffff;
1621
- --ds-color-brand3-contrast-2: #bdbbb9;
1622
- --ds-color-brand3-background-default: var(--ds-color-brand3-1);
1623
- --ds-color-brand3-background-subtle: var(--ds-color-brand3-2);
1624
- --ds-color-brand3-surface-default: var(--ds-color-brand3-3);
1625
- --ds-color-brand3-surface-hover: var(--ds-color-brand3-4);
1626
- --ds-color-brand3-surface-active: var(--ds-color-brand3-5);
1627
- --ds-color-brand3-border-subtle: var(--ds-color-brand3-6);
1628
- --ds-color-brand3-border-default: var(--ds-color-brand3-7);
1629
- --ds-color-brand3-border-strong: var(--ds-color-brand3-8);
1630
- --ds-color-brand3-base-default: var(--ds-color-brand3-9);
1631
- --ds-color-brand3-base-hover: var(--ds-color-brand3-10);
1632
- --ds-color-brand3-base-active: var(--ds-color-brand3-11);
1633
- --ds-color-brand3-text-subtle: var(--ds-color-brand3-12);
1634
- --ds-color-brand3-text-default: var(--ds-color-brand3-13);
1635
- --ds-color-brand3-contrast-default: var(--ds-color-brand3-contrast-1);
1636
- --ds-color-brand3-contrast-subtle: var(--ds-color-brand3-contrast-2);
1637
- --ds-color-success-background-default: var(--ds-global-green-1);
1638
- --ds-color-success-background-subtle: var(--ds-global-green-2);
1639
- --ds-color-success-surface-default: var(--ds-global-green-3);
1640
- --ds-color-success-surface-hover: var(--ds-global-green-4);
1641
- --ds-color-success-surface-active: var(--ds-global-green-5);
1642
- --ds-color-success-border-subtle: var(--ds-global-green-6);
1643
- --ds-color-success-border-default: var(--ds-global-green-7);
1644
- --ds-color-success-border-strong: var(--ds-global-green-8);
1645
- --ds-color-success-base-default: var(--ds-global-green-9);
1646
- --ds-color-success-base-hover: var(--ds-global-green-10);
1647
- --ds-color-success-base-active: var(--ds-global-green-11);
1648
- --ds-color-success-text-subtle: var(--ds-global-green-12);
1649
- --ds-color-success-text-default: var(--ds-global-green-13);
1650
- --ds-color-success-contrast-default: var(--ds-global-green-contrast-1);
1651
- --ds-color-success-contrast-subtle: var(--ds-global-green-contrast-2);
1652
- --ds-color-danger-background-default: var(--ds-global-red-1);
1653
- --ds-color-danger-background-subtle: var(--ds-global-red-2);
1654
- --ds-color-danger-surface-default: var(--ds-global-red-3);
1655
- --ds-color-danger-surface-hover: var(--ds-global-red-4);
1656
- --ds-color-danger-surface-active: var(--ds-global-red-5);
1657
- --ds-color-danger-border-subtle: var(--ds-global-red-6);
1658
- --ds-color-danger-border-default: var(--ds-global-red-7);
1659
- --ds-color-danger-border-strong: var(--ds-global-red-8);
1660
- --ds-color-danger-base-default: var(--ds-global-red-9);
1661
- --ds-color-danger-base-hover: var(--ds-global-red-10);
1662
- --ds-color-danger-base-active: var(--ds-global-red-11);
1663
- --ds-color-danger-text-subtle: var(--ds-global-red-12);
1664
- --ds-color-danger-text-default: var(--ds-global-red-13);
1665
- --ds-color-danger-contrast-default: var(--ds-global-red-contrast-1);
1666
- --ds-color-danger-contrast-subtle: var(--ds-global-red-contrast-2);
1667
- --ds-color-info-background-default: #000408;
1668
- --ds-color-info-background-subtle: #021423;
1669
- --ds-color-info-surface-default: #032540;
1670
- --ds-color-info-surface-hover: #043256;
1671
- --ds-color-info-surface-active: #063f6c;
1672
- --ds-color-info-border-subtle: #4291ce;
1673
- --ds-color-info-border-default: #78b1dc;
1674
- --ds-color-info-border-strong: #aed0ea;
1675
- --ds-color-info-base-default: #2a84c8;
1676
- --ds-color-info-base-hover: #0a6dba;
1677
- --ds-color-info-base-active: #085998;
1678
- --ds-color-info-text-subtle: #a6cbe8;
1679
- --ds-color-info-text-default: #e8f1f9;
1680
- --ds-color-info-contrast-default: #000000;
1681
- --ds-color-info-contrast-subtle: #040c13;
1682
- --ds-color-warning-background-default: var(--ds-global-yellow-1);
1683
- --ds-color-warning-background-subtle: var(--ds-global-yellow-2);
1684
- --ds-color-warning-surface-default: var(--ds-global-yellow-3);
1685
- --ds-color-warning-surface-hover: var(--ds-global-yellow-4);
1686
- --ds-color-warning-surface-active: var(--ds-global-yellow-5);
1687
- --ds-color-warning-border-subtle: var(--ds-global-yellow-6);
1688
- --ds-color-warning-border-default: var(--ds-global-yellow-7);
1689
- --ds-color-warning-border-strong: var(--ds-global-yellow-8);
1690
- --ds-color-warning-base-default: var(--ds-global-orange-9);
1691
- --ds-color-warning-base-hover: var(--ds-global-orange-10);
1692
- --ds-color-warning-base-active: var(--ds-global-orange-11);
1693
- --ds-color-warning-text-subtle: var(--ds-global-orange-12);
1694
- --ds-color-warning-text-default: var(--ds-global-orange-13);
1695
- --ds-color-warning-contrast-default: var(--ds-global-orange-contrast-1);
1696
- --ds-color-warning-contrast-subtle: var(--ds-global-orange-contrast-2);
1697
- --ds-color-focus-inner: #040404;
1698
- --ds-color-focus-outer: #f0f0f0;
1699
- --ds-global-blue-1: #000408;
1700
- --ds-global-blue-2: #021423;
1701
- --ds-global-blue-3: #032540;
1702
- --ds-global-blue-4: #043256;
1703
- --ds-global-blue-5: #063f6c;
1704
- --ds-global-blue-6: #4291ce;
1705
- --ds-global-blue-7: #78b1dc;
1706
- --ds-global-blue-8: #aed0ea;
1707
- --ds-global-blue-9: #2a84c8;
1708
- --ds-global-blue-10: #0a6dba;
1709
- --ds-global-blue-11: #085998;
1710
- --ds-global-blue-12: #a6cbe8;
1711
- --ds-global-blue-13: #e8f1f9;
1712
- --ds-global-blue-contrast-1: #000000;
1713
- --ds-global-blue-contrast-2: #040c13;
1714
- --ds-global-green-1: #000401;
1715
- --ds-global-green-2: #011704;
1716
- --ds-global-green-3: #022b08;
1717
- --ds-global-green-4: #03380a;
1718
- --ds-global-green-5: #03490d;
1719
- --ds-global-green-6: #379f45;
1720
- --ds-global-green-7: #71bb7b;
1721
- --ds-global-green-8: #aad6b0;
1722
- --ds-global-green-9: #118c23;
1723
- --ds-global-green-10: #057615;
1724
- --ds-global-green-11: #045f11;
1725
- --ds-global-green-12: #a3d2a9;
1726
- --ds-global-green-13: #e6f3e8;
1727
- --ds-global-green-contrast-1: #000000;
1728
- --ds-global-green-contrast-2: #010401;
1729
- --ds-global-orange-1: #060301;
1730
- --ds-global-orange-2: #200f05;
1731
- --ds-global-orange-3: #391b09;
1732
- --ds-global-orange-4: #4e250c;
1733
- --ds-global-orange-5: #633010;
1734
- --ds-global-orange-6: #c67849;
1735
- --ds-global-orange-7: #d69f7d;
1736
- --ds-global-orange-8: #e7c6b2;
1737
- --ds-global-orange-9: #bc6028;
1738
- --ds-global-orange-10: #a24d1a;
1739
- --ds-global-orange-11: #833f15;
1740
- --ds-global-orange-12: #e3bea6;
1741
- --ds-global-orange-13: #f8eee7;
1742
- --ds-global-orange-contrast-1: #000000;
1743
- --ds-global-orange-contrast-2: #060301;
1744
- --ds-global-purple-1: #060308;
1745
- --ds-global-purple-2: #1a0d26;
1746
- --ds-global-purple-3: #301748;
1747
- --ds-global-purple-4: #402060;
1748
- --ds-global-purple-5: #52287a;
1749
- --ds-global-purple-6: #9e7dbf;
1750
- --ds-global-purple-7: #b9a1d0;
1751
- --ds-global-purple-8: #d5c7e3;
1752
- --ds-global-purple-9: #b298cc;
1753
- --ds-global-purple-10: #a181c0;
1754
- --ds-global-purple-11: #8f69b5;
1755
- --ds-global-purple-12: #d0c0e0;
1756
- --ds-global-purple-13: #f2eef7;
1757
- --ds-global-purple-contrast-1: #000000;
1758
- --ds-global-purple-contrast-2: #18141b;
1759
- --ds-global-red-1: #0b0101;
1760
- --ds-global-red-2: #2b0606;
1761
- --ds-global-red-3: #4b0a0a;
1762
- --ds-global-red-4: #620e0e;
1763
- --ds-global-red-5: #7c1212;
1764
- --ds-global-red-6: #d66b6b;
1765
- --ds-global-red-7: #e29797;
1766
- --ds-global-red-8: #eec1c1;
1767
- --ds-global-red-9: #d76e6e;
1768
- --ds-global-red-10: #ce4e4e;
1769
- --ds-global-red-11: #c32727;
1770
- --ds-global-red-12: #ecbaba;
1771
- --ds-global-red-13: #faeded;
1772
- --ds-global-red-contrast-1: #000000;
1773
- --ds-global-red-contrast-2: #271414;
1774
- --ds-global-yellow-1: #040301;
1775
- --ds-global-yellow-2: #181304;
1776
- --ds-global-yellow-3: #2b2307;
1777
- --ds-global-yellow-4: #3a300a;
1778
- --ds-global-yellow-5: #4a3d0d;
1779
- --ds-global-yellow-6: #a7881c;
1780
- --ds-global-yellow-7: #cca723;
1781
- --ds-global-yellow-8: #edc94b;
1782
- --ds-global-yellow-9: #3d310a;
1783
- --ds-global-yellow-10: #52430e;
1784
- --ds-global-yellow-11: #695512;
1785
- --ds-global-yellow-12: #ebc232;
1786
- --ds-global-yellow-13: #faf0cd;
1787
- --ds-global-yellow-contrast-1: #ffffff;
1788
- --ds-global-yellow-contrast-2: #ccc9bf;
1789
- }
1790
-
1791
- }
1792
-
1793
763
  /**
1794
764
  * These files are generated from design tokens defind using Token Studio
1795
765
  */
1796
766
 
1797
767
  @layer ds.theme.typography.primary {
1798
- :root, [data-ds-typography="primary"] {
768
+ :root, [data-typography="primary"] {
1799
769
  --ds-font-family: Inter;
1800
770
  --ds-font-weight-medium: 500;
1801
771
  --ds-font-weight-semibold: 600;
@@ -1803,19 +773,19 @@
1803
773
  --ds-heading-2xl-font-weight: 500;
1804
774
  --ds-heading-2xl-line-height: 1.3;
1805
775
  --ds-heading-2xl-font-size: 3.75rem;
1806
- --ds-heading-2xl-letter-spacing: -1%;
776
+ --ds-heading-2xl-letter-spacing: 0%;
1807
777
  --ds-heading-xl-font-weight: 500;
1808
778
  --ds-heading-xl-line-height: 1.3;
1809
779
  --ds-heading-xl-font-size: 3rem;
1810
- --ds-heading-xl-letter-spacing: -1%;
780
+ --ds-heading-xl-letter-spacing: 0%;
1811
781
  --ds-heading-lg-font-weight: 500;
1812
782
  --ds-heading-lg-line-height: 1.3;
1813
783
  --ds-heading-lg-font-size: 2.25rem;
1814
- --ds-heading-lg-letter-spacing: -0.5%;
784
+ --ds-heading-lg-letter-spacing: 0%;
1815
785
  --ds-heading-md-font-weight: 500;
1816
786
  --ds-heading-md-line-height: 1.3;
1817
787
  --ds-heading-md-font-size: 1.875rem;
1818
- --ds-heading-md-letter-spacing: -0.25%;
788
+ --ds-heading-md-letter-spacing: 0%;
1819
789
  --ds-heading-sm-font-weight: 500;
1820
790
  --ds-heading-sm-line-height: 1.3;
1821
791
  --ds-heading-sm-font-size: 1.5rem;
@@ -1823,117 +793,84 @@
1823
793
  --ds-heading-xs-font-weight: 500;
1824
794
  --ds-heading-xs-line-height: 1.3;
1825
795
  --ds-heading-xs-font-size: 1.3125rem;
1826
- --ds-heading-xs-letter-spacing: 0.15%;
796
+ --ds-heading-xs-letter-spacing: 0%;
1827
797
  --ds-heading-2xs-font-weight: 500;
1828
798
  --ds-heading-2xs-line-height: 1.3;
1829
799
  --ds-heading-2xs-font-size: 1.125rem;
1830
- --ds-heading-2xs-letter-spacing: 0.15%;
800
+ --ds-heading-2xs-letter-spacing: 0%;
1831
801
  --ds-body-xl-font-weight: 400;
1832
802
  --ds-body-xl-line-height: 1.5;
1833
803
  --ds-body-xl-font-size: 1.5rem;
1834
- --ds-body-xl-letter-spacing: 0.5%;
804
+ --ds-body-xl-letter-spacing: 0%;
1835
805
  --ds-body-lg-font-weight: 400;
1836
806
  --ds-body-lg-line-height: 1.5;
1837
807
  --ds-body-lg-font-size: 1.3125rem;
1838
- --ds-body-lg-letter-spacing: 0.5%;
808
+ --ds-body-lg-letter-spacing: 0%;
1839
809
  --ds-body-md-font-weight: 400;
1840
810
  --ds-body-md-line-height: 1.5;
1841
811
  --ds-body-md-font-size: 1.125rem;
1842
- --ds-body-md-letter-spacing: 0.5%;
812
+ --ds-body-md-letter-spacing: 0%;
1843
813
  --ds-body-sm-font-weight: 400;
1844
814
  --ds-body-sm-line-height: 1.5;
1845
815
  --ds-body-sm-font-size: 1rem;
1846
- --ds-body-sm-letter-spacing: 0.25%;
816
+ --ds-body-sm-letter-spacing: 0%;
1847
817
  --ds-body-xs-font-weight: 400;
1848
818
  --ds-body-xs-line-height: 1.5;
1849
819
  --ds-body-xs-font-size: 0.875rem;
1850
- --ds-body-xs-letter-spacing: 0.15%;
820
+ --ds-body-xs-letter-spacing: 0%;
1851
821
  --ds-body-short-xl-font-weight: 400;
1852
822
  --ds-body-short-xl-line-height: 1.3;
1853
823
  --ds-body-short-xl-font-size: 1.5rem;
1854
- --ds-body-short-xl-letter-spacing: 0.5%;
824
+ --ds-body-short-xl-letter-spacing: 0%;
1855
825
  --ds-body-short-lg-font-weight: 400;
1856
826
  --ds-body-short-lg-line-height: 1.3;
1857
827
  --ds-body-short-lg-font-size: 1.3125rem;
1858
- --ds-body-short-lg-letter-spacing: 0.5%;
828
+ --ds-body-short-lg-letter-spacing: 0%;
1859
829
  --ds-body-short-md-font-weight: 400;
1860
830
  --ds-body-short-md-line-height: 1.3;
1861
831
  --ds-body-short-md-font-size: 1.125rem;
1862
- --ds-body-short-md-letter-spacing: 0.5%;
832
+ --ds-body-short-md-letter-spacing: 0%;
1863
833
  --ds-body-short-sm-font-weight: 400;
1864
834
  --ds-body-short-sm-line-height: 1.3;
1865
835
  --ds-body-short-sm-font-size: 1rem;
1866
- --ds-body-short-sm-letter-spacing: 0.25%;
836
+ --ds-body-short-sm-letter-spacing: 0%;
1867
837
  --ds-body-short-xs-font-weight: 400;
1868
838
  --ds-body-short-xs-line-height: 1.3;
1869
839
  --ds-body-short-xs-font-size: 0.875rem;
1870
- --ds-body-short-xs-letter-spacing: 0.15%;
840
+ --ds-body-short-xs-letter-spacing: 0%;
1871
841
  --ds-body-long-xl-font-weight: 400;
1872
842
  --ds-body-long-xl-line-height: 1.7;
1873
843
  --ds-body-long-xl-font-size: 1.5rem;
1874
- --ds-body-long-xl-letter-spacing: 0.5%;
844
+ --ds-body-long-xl-letter-spacing: 0%;
1875
845
  --ds-body-long-lg-font-weight: 400;
1876
846
  --ds-body-long-lg-line-height: 1.7;
1877
847
  --ds-body-long-lg-font-size: 1.3125rem;
1878
- --ds-body-long-lg-letter-spacing: 0.5%;
848
+ --ds-body-long-lg-letter-spacing: 0%;
1879
849
  --ds-body-long-md-font-weight: 400;
1880
850
  --ds-body-long-md-line-height: 1.7;
1881
851
  --ds-body-long-md-font-size: 1.125rem;
1882
- --ds-body-long-md-letter-spacing: 0.5%;
852
+ --ds-body-long-md-letter-spacing: 0%;
1883
853
  --ds-body-long-sm-font-weight: 400;
1884
854
  --ds-body-long-sm-line-height: 1.7;
1885
855
  --ds-body-long-sm-font-size: 1rem;
1886
- --ds-body-long-sm-letter-spacing: 0.25%;
856
+ --ds-body-long-sm-letter-spacing: 0%;
1887
857
  --ds-body-long-xs-font-weight: 400;
1888
858
  --ds-body-long-xs-line-height: 1.7;
1889
859
  --ds-body-long-xs-font-size: 0.875rem;
1890
- --ds-body-long-xs-letter-spacing: 0.15%;
1891
- --ds-label-lg-font-weight: 500;
1892
- --ds-label-lg-line-height: 1.3;
1893
- --ds-label-lg-font-size: 1.3125rem;
1894
- --ds-label-lg-letter-spacing: 0.5%;
1895
- --ds-label-md-font-weight: 500;
1896
- --ds-label-md-line-height: 1.3;
1897
- --ds-label-md-font-size: 1.125rem;
1898
- --ds-label-md-letter-spacing: 0.5%;
1899
- --ds-label-sm-font-weight: 500;
1900
- --ds-label-sm-line-height: 1.3;
1901
- --ds-label-sm-font-size: 1rem;
1902
- --ds-label-sm-letter-spacing: 0.25%;
1903
- --ds-label-xs-font-weight: 500;
1904
- --ds-label-xs-line-height: 1.3;
1905
- --ds-label-xs-font-size: 0.875rem;
1906
- --ds-label-xs-letter-spacing: 0.15%;
1907
- --ds-error_message-lg-font-weight: 400;
1908
- --ds-error_message-lg-line-height: 1.3;
1909
- --ds-error_message-lg-font-size: 1.3125rem;
1910
- --ds-error_message-lg-letter-spacing: 0.5%;
1911
- --ds-error_message-md-font-weight: 400;
1912
- --ds-error_message-md-line-height: 1.3;
1913
- --ds-error_message-md-font-size: 1.125rem;
1914
- --ds-error_message-md-letter-spacing: 0.5%;
1915
- --ds-error_message-sm-font-weight: 400;
1916
- --ds-error_message-sm-line-height: 1.3;
1917
- --ds-error_message-sm-font-size: 1rem;
1918
- --ds-error_message-sm-letter-spacing: 0.25%;
1919
- --ds-error_message-xs-font-weight: 400;
1920
- --ds-error_message-xs-line-height: 1.3;
1921
- --ds-error_message-xs-font-size: 0.875rem;
1922
- --ds-error_message-xs-letter-spacing: 0.15%;
860
+ --ds-body-long-xs-letter-spacing: 0%;
1923
861
  --ds-line-height-sm: 1.3;
1924
862
  --ds-line-height-md: 1.5;
1925
863
  --ds-line-height-lg: 1.7;
1926
864
  --ds-font-size-1: 0.75rem;
1927
- --ds-font-size-2: 0.8125rem;
1928
- --ds-font-size-3: 0.875rem;
1929
- --ds-font-size-4: 1rem;
1930
- --ds-font-size-5: 1.125rem;
1931
- --ds-font-size-6: 1.3125rem;
1932
- --ds-font-size-7: 1.5rem;
1933
- --ds-font-size-8: 1.875rem;
1934
- --ds-font-size-9: 2.25rem;
1935
- --ds-font-size-10: 3rem;
1936
- --ds-font-size-11: 3.75rem;
865
+ --ds-font-size-2: 0.875rem;
866
+ --ds-font-size-3: 1rem;
867
+ --ds-font-size-4: 1.125rem;
868
+ --ds-font-size-5: 1.3125rem;
869
+ --ds-font-size-6: 1.5rem;
870
+ --ds-font-size-7: 1.875rem;
871
+ --ds-font-size-8: 2.25rem;
872
+ --ds-font-size-9: 3rem;
873
+ --ds-font-size-10: 3.75rem;
1937
874
  --ds-letter-spacing-1: -1%;
1938
875
  --ds-letter-spacing-2: -0.5%;
1939
876
  --ds-letter-spacing-3: -0.25%;
@@ -1943,9 +880,170 @@
1943
880
  --ds-letter-spacing-7: 0.25%;
1944
881
  --ds-letter-spacing-8: 0.5%;
1945
882
  --ds-letter-spacing-9: 1.5%;
1946
- --ds-udir-main: Inter;
1947
- --ds-udir-bold: 500;
1948
- --ds-udir-extra-bold: 600;
1949
- --ds-udir-regular: 400;
1950
883
  }
1951
- }
884
+ }
885
+ /**
886
+ * These files are generated from design tokens defind using Token Studio
887
+ */
888
+
889
+ @layer ds.theme.color {
890
+ [data-color="accent"] {
891
+ --ds-color-background-default: var(--ds-color-accent-background-default);
892
+ --ds-color-background-tinted: var(--ds-color-accent-background-tinted);
893
+ --ds-color-surface-default: var(--ds-color-accent-surface-default);
894
+ --ds-color-surface-tinted: var(--ds-color-accent-surface-tinted);
895
+ --ds-color-surface-hover: var(--ds-color-accent-surface-hover);
896
+ --ds-color-surface-active: var(--ds-color-accent-surface-active);
897
+ --ds-color-border-subtle: var(--ds-color-accent-border-subtle);
898
+ --ds-color-border-default: var(--ds-color-accent-border-default);
899
+ --ds-color-border-strong: var(--ds-color-accent-border-strong);
900
+ --ds-color-text-subtle: var(--ds-color-accent-text-subtle);
901
+ --ds-color-text-default: var(--ds-color-accent-text-default);
902
+ --ds-color-base-default: var(--ds-color-accent-base-default);
903
+ --ds-color-base-hover: var(--ds-color-accent-base-hover);
904
+ --ds-color-base-active: var(--ds-color-accent-base-active);
905
+ --ds-color-base-contrast-subtle: var(--ds-color-accent-base-contrast-subtle);
906
+ --ds-color-base-contrast-default: var(--ds-color-accent-base-contrast-default);
907
+ }
908
+
909
+ }
910
+
911
+ /**
912
+ * These files are generated from design tokens defind using Token Studio
913
+ */
914
+
915
+ @layer ds.theme.color {
916
+ [data-color="support1"] {
917
+ --ds-color-background-default: var(--ds-color-support1-background-default);
918
+ --ds-color-background-tinted: var(--ds-color-support1-background-tinted);
919
+ --ds-color-surface-default: var(--ds-color-support1-surface-default);
920
+ --ds-color-surface-tinted: var(--ds-color-support1-surface-tinted);
921
+ --ds-color-surface-hover: var(--ds-color-support1-surface-hover);
922
+ --ds-color-surface-active: var(--ds-color-support1-surface-active);
923
+ --ds-color-border-subtle: var(--ds-color-support1-border-subtle);
924
+ --ds-color-border-default: var(--ds-color-support1-border-default);
925
+ --ds-color-border-strong: var(--ds-color-support1-border-strong);
926
+ --ds-color-text-subtle: var(--ds-color-support1-text-subtle);
927
+ --ds-color-text-default: var(--ds-color-support1-text-default);
928
+ --ds-color-base-default: var(--ds-color-support1-base-default);
929
+ --ds-color-base-hover: var(--ds-color-support1-base-hover);
930
+ --ds-color-base-active: var(--ds-color-support1-base-active);
931
+ --ds-color-base-contrast-subtle: var(--ds-color-support1-base-contrast-subtle);
932
+ --ds-color-base-contrast-default: var(--ds-color-support1-base-contrast-default);
933
+ }
934
+
935
+ }
936
+
937
+ /**
938
+ * These files are generated from design tokens defind using Token Studio
939
+ */
940
+
941
+ @layer ds.theme.color {
942
+ [data-color="support2"] {
943
+ --ds-color-background-default: var(--ds-color-support2-background-default);
944
+ --ds-color-background-tinted: var(--ds-color-support2-background-tinted);
945
+ --ds-color-surface-default: var(--ds-color-support2-surface-default);
946
+ --ds-color-surface-tinted: var(--ds-color-support2-surface-tinted);
947
+ --ds-color-surface-hover: var(--ds-color-support2-surface-hover);
948
+ --ds-color-surface-active: var(--ds-color-support2-surface-active);
949
+ --ds-color-border-subtle: var(--ds-color-support2-border-subtle);
950
+ --ds-color-border-default: var(--ds-color-support2-border-default);
951
+ --ds-color-border-strong: var(--ds-color-support2-border-strong);
952
+ --ds-color-text-subtle: var(--ds-color-support2-text-subtle);
953
+ --ds-color-text-default: var(--ds-color-support2-text-default);
954
+ --ds-color-base-default: var(--ds-color-support2-base-default);
955
+ --ds-color-base-hover: var(--ds-color-support2-base-hover);
956
+ --ds-color-base-active: var(--ds-color-support2-base-active);
957
+ --ds-color-base-contrast-subtle: var(--ds-color-support2-base-contrast-subtle);
958
+ --ds-color-base-contrast-default: var(--ds-color-support2-base-contrast-default);
959
+ }
960
+
961
+ }
962
+
963
+ @layer ds.theme.color {
964
+ :root, [data-color-scheme], [data-color=neutral] {
965
+ --ds-color-background-default: var(--ds-color-neutral-background-default);
966
+ --ds-color-background-tinted: var(--ds-color-neutral-background-tinted);
967
+ --ds-color-surface-tinted: var(--ds-color-neutral-surface-tinted);
968
+ --ds-color-surface-hover: var(--ds-color-neutral-surface-hover);
969
+ --ds-color-surface-active: var(--ds-color-neutral-surface-active);
970
+ --ds-color-border-subtle: var(--ds-color-neutral-border-subtle);
971
+ --ds-color-border-default: var(--ds-color-neutral-border-default);
972
+ --ds-color-border-strong: var(--ds-color-neutral-border-strong);
973
+ --ds-color-base-default: var(--ds-color-neutral-base-default);
974
+ --ds-color-base-hover: var(--ds-color-neutral-base-hover);
975
+ --ds-color-base-active: var(--ds-color-neutral-base-active);
976
+ --ds-color-text-subtle: var(--ds-color-neutral-text-subtle);
977
+ --ds-color-text-default: var(--ds-color-neutral-text-default);
978
+ --ds-color-base-contrast-default: var(--ds-color-neutral-base-contrast-default);
979
+ --ds-color-base-contrast-subtle: var(--ds-color-neutral-base-contrast-subtle);
980
+ }
981
+ [data-color=success] {
982
+ --ds-color-background-default: var(--ds-color-success-background-default);
983
+ --ds-color-background-tinted: var(--ds-color-success-background-tinted);
984
+ --ds-color-surface-tinted: var(--ds-color-success-surface-tinted);
985
+ --ds-color-surface-hover: var(--ds-color-success-surface-hover);
986
+ --ds-color-surface-active: var(--ds-color-success-surface-active);
987
+ --ds-color-border-subtle: var(--ds-color-success-border-subtle);
988
+ --ds-color-border-default: var(--ds-color-success-border-default);
989
+ --ds-color-border-strong: var(--ds-color-success-border-strong);
990
+ --ds-color-base-default: var(--ds-color-success-base-default);
991
+ --ds-color-base-hover: var(--ds-color-success-base-hover);
992
+ --ds-color-base-active: var(--ds-color-success-base-active);
993
+ --ds-color-text-subtle: var(--ds-color-success-text-subtle);
994
+ --ds-color-text-default: var(--ds-color-success-text-default);
995
+ --ds-color-base-contrast-default: var(--ds-color-success-base-contrast-default);
996
+ --ds-color-base-contrast-subtle: var(--ds-color-success-base-contrast-subtle);
997
+ }
998
+ [data-color=warning] {
999
+ --ds-color-background-default: var(--ds-color-warning-background-default);
1000
+ --ds-color-background-tinted: var(--ds-color-warning-background-tinted);
1001
+ --ds-color-surface-tinted: var(--ds-color-warning-surface-tinted);
1002
+ --ds-color-surface-hover: var(--ds-color-warning-surface-hover);
1003
+ --ds-color-surface-active: var(--ds-color-warning-surface-active);
1004
+ --ds-color-border-subtle: var(--ds-color-warning-border-subtle);
1005
+ --ds-color-border-default: var(--ds-color-warning-border-default);
1006
+ --ds-color-border-strong: var(--ds-color-warning-border-strong);
1007
+ --ds-color-base-default: var(--ds-color-warning-base-default);
1008
+ --ds-color-base-hover: var(--ds-color-warning-base-hover);
1009
+ --ds-color-base-active: var(--ds-color-warning-base-active);
1010
+ --ds-color-text-subtle: var(--ds-color-warning-text-subtle);
1011
+ --ds-color-text-default: var(--ds-color-warning-text-default);
1012
+ --ds-color-base-contrast-default: var(--ds-color-warning-base-contrast-default);
1013
+ --ds-color-base-contrast-subtle: var(--ds-color-warning-base-contrast-subtle);
1014
+ }
1015
+ [data-color=danger] {
1016
+ --ds-color-background-default: var(--ds-color-danger-background-default);
1017
+ --ds-color-background-tinted: var(--ds-color-danger-background-tinted);
1018
+ --ds-color-surface-tinted: var(--ds-color-danger-surface-tinted);
1019
+ --ds-color-surface-hover: var(--ds-color-danger-surface-hover);
1020
+ --ds-color-surface-active: var(--ds-color-danger-surface-active);
1021
+ --ds-color-border-subtle: var(--ds-color-danger-border-subtle);
1022
+ --ds-color-border-default: var(--ds-color-danger-border-default);
1023
+ --ds-color-border-strong: var(--ds-color-danger-border-strong);
1024
+ --ds-color-base-default: var(--ds-color-danger-base-default);
1025
+ --ds-color-base-hover: var(--ds-color-danger-base-hover);
1026
+ --ds-color-base-active: var(--ds-color-danger-base-active);
1027
+ --ds-color-text-subtle: var(--ds-color-danger-text-subtle);
1028
+ --ds-color-text-default: var(--ds-color-danger-text-default);
1029
+ --ds-color-base-contrast-default: var(--ds-color-danger-base-contrast-default);
1030
+ --ds-color-base-contrast-subtle: var(--ds-color-danger-base-contrast-subtle);
1031
+ }
1032
+ [data-color=info] {
1033
+ --ds-color-background-default: var(--ds-color-info-background-default);
1034
+ --ds-color-background-tinted: var(--ds-color-info-background-tinted);
1035
+ --ds-color-surface-tinted: var(--ds-color-info-surface-tinted);
1036
+ --ds-color-surface-hover: var(--ds-color-info-surface-hover);
1037
+ --ds-color-surface-active: var(--ds-color-info-surface-active);
1038
+ --ds-color-border-subtle: var(--ds-color-info-border-subtle);
1039
+ --ds-color-border-default: var(--ds-color-info-border-default);
1040
+ --ds-color-border-strong: var(--ds-color-info-border-strong);
1041
+ --ds-color-base-default: var(--ds-color-info-base-default);
1042
+ --ds-color-base-hover: var(--ds-color-info-base-hover);
1043
+ --ds-color-base-active: var(--ds-color-info-base-active);
1044
+ --ds-color-text-subtle: var(--ds-color-info-text-subtle);
1045
+ --ds-color-text-default: var(--ds-color-info-text-default);
1046
+ --ds-color-base-contrast-default: var(--ds-color-info-base-contrast-default);
1047
+ --ds-color-base-contrast-subtle: var(--ds-color-info-base-contrast-subtle);
1048
+ }
1049
+ }