@acorex/styles 21.0.0-next.65 → 21.0.0-next.66

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (82) hide show
  1. package/base/_preflight.scss +421 -0
  2. package/base/index.scss +15 -0
  3. package/components/{_action-item.css → _action-item.scss} +37 -12
  4. package/components/{_actionsheet.css → _actionsheet.scss} +9 -13
  5. package/components/{_check-box.css → _check-box.scss} +24 -8
  6. package/components/{_drop-down.css → _drop-down.scss} +17 -18
  7. package/components/_editor-container.scss +293 -0
  8. package/components/_general-button.scss +75 -0
  9. package/components/{_list.css → _list.scss} +56 -25
  10. package/components/_radio.scss +51 -0
  11. package/components/{_ripple.css → _ripple.scss} +8 -8
  12. package/components/{_table.css → _table.scss} +23 -20
  13. package/components/{_uploader.css → _uploader.scss} +20 -1
  14. package/components/index.scss +11 -0
  15. package/generators/index.js +1 -0
  16. package/generators/tailwind-class-generator.js +68 -0
  17. package/icons/fontawesome/_variables.scss +227 -0
  18. package/icons/fontawesome/index.scss +714 -0
  19. package/icons/huge/huge-bulk/_variables.scss +209 -0
  20. package/icons/huge/huge-bulk/index.scss +656 -0
  21. package/icons/huge/huge-duotone/_variables.scss +209 -0
  22. package/icons/huge/huge-duotone/index.scss +657 -0
  23. package/icons/huge/huge-solid-rounded/_variables.scss +209 -0
  24. package/icons/huge/huge-solid-rounded/index.scss +643 -0
  25. package/icons/huge/huge-solid-sharp/_variables.scss +209 -0
  26. package/icons/huge/huge-solid-sharp/index.scss +656 -0
  27. package/icons/huge/huge-solid-standard/_variables.scss +209 -0
  28. package/icons/huge/huge-solid-standard/index.scss +656 -0
  29. package/icons/huge/huge-stroke-rounded/_variables.scss +209 -0
  30. package/icons/huge/huge-stroke-rounded/index.scss +656 -0
  31. package/icons/huge/huge-stroke-sharp/_variables.scss +209 -0
  32. package/icons/huge/huge-stroke-sharp/index.scss +656 -0
  33. package/icons/huge/huge-stroke-standard/_variables.scss +209 -0
  34. package/icons/huge/huge-stroke-standard/index.scss +656 -0
  35. package/icons/huge/huge-twotone/_variables.scss +209 -0
  36. package/icons/huge/huge-twotone/index.scss +656 -0
  37. package/icons/material/_variables.scss +227 -0
  38. package/icons/material/index.scss +718 -0
  39. package/index.scss +7 -0
  40. package/mixins/_editor-looks.scss +32 -0
  41. package/mixins/_media.scss +73 -0
  42. package/mixins/_scroll-bar.scss +35 -0
  43. package/mixins/_util.scss +19 -0
  44. package/mixins/index.scss +4 -0
  45. package/package.json +4 -7
  46. package/tailwind-base.js +4 -0
  47. package/themes/default.scss +74 -0
  48. package/utils/_theme-generator.scss +238 -0
  49. package/utils/_utils.scss +278 -0
  50. package/utils/index.scss +2 -0
  51. package/variables/_colors.scss +14 -0
  52. package/variables/_looks.scss +1 -0
  53. package/variables/index.scss +2 -0
  54. package/components/_editor-container copy.css +0 -267
  55. package/components/_editor-container.css +0 -82
  56. package/components/_general-button.css +0 -37
  57. package/components/_radio.css +0 -33
  58. package/components/index.css +0 -11
  59. package/icons/fontawesome/_variables.css +0 -229
  60. package/icons/fontawesome/index.css +0 -557
  61. package/icons/huge/huge-bulk/_variables.css +0 -211
  62. package/icons/huge/huge-bulk/index.css +0 -522
  63. package/icons/huge/huge-duotone/_variables.css +0 -211
  64. package/icons/huge/huge-duotone/index.css +0 -519
  65. package/icons/huge/huge-solid-rounded/_variables.css +0 -211
  66. package/icons/huge/huge-solid-rounded/index.css +0 -519
  67. package/icons/huge/huge-solid-sharp/_variables.css +0 -213
  68. package/icons/huge/huge-solid-sharp/index.css +0 -519
  69. package/icons/huge/huge-solid-standard/_variables.css +0 -211
  70. package/icons/huge/huge-solid-standard/index.css +0 -518
  71. package/icons/huge/huge-stroke-rounded/_variables.css +0 -211
  72. package/icons/huge/huge-stroke-rounded/index.css +0 -517
  73. package/icons/huge/huge-stroke-sharp/_variables.css +0 -142
  74. package/icons/huge/huge-stroke-sharp/index.css +0 -517
  75. package/icons/huge/huge-stroke-standard/_variables.css +0 -141
  76. package/icons/huge/huge-stroke-standard/index.css +0 -517
  77. package/icons/huge/huge-twotone/_variables.css +0 -211
  78. package/icons/huge/huge-twotone/index.css +0 -518
  79. package/icons/material/_variables.css +0 -229
  80. package/icons/material/index.css +0 -575
  81. package/index.css +0 -2
  82. package/themes/default.css +0 -3067
@@ -1,3067 +0,0 @@
1
- @import 'tailwindcss';
2
- @import 'tw-animate';
3
-
4
- @custom-variant dark (&:where(.dark, .dark *));
5
-
6
- @layer base {
7
- * {
8
- border-color: var(--color-border-default);
9
- scrollbar-width: thin;
10
- scrollbar-color: var(--ax-sys-scroller-thumb-color) var(--ax-sys-scroller-track-color);
11
-
12
- ::-webkit-scrollbar {
13
- width: var(--ax-sys-scroller-size);
14
- height: var(--ax-sys-scroller-size);
15
- }
16
-
17
- ::-webkit-scrollbar-track {
18
- background: var(--ax-sys-scroller-track-color);
19
- border-radius: var(--ax-sys-scroller-size-radius);
20
- }
21
-
22
- ::-webkit-scrollbar-thumb {
23
- background: var(--ax-sys-scroller-thumb-color);
24
- border-radius: var(--ax-sys-scroller-size-radius);
25
- }
26
- }
27
- }
28
-
29
- html {
30
- background-color: rgba(var(--ax-sys-color-lightest-surface));
31
- color: rgba(var(--ax-sys-color-on-lightest-surface));
32
- }
33
-
34
- html.dark {
35
- background-color: rgba(var(--ax-sys-color-darkest-surface));
36
- color: rgba(var(--ax-sys-color-on-darkest-surface));
37
- }
38
-
39
- :root {
40
- --ax-sys-icon-size: 100%;
41
- --ax-sys-icon-weight: 400;
42
- --ax-sys-size-base: 2.5rem;
43
- --ax-overlay-full-width: 93;
44
- --ax-sys-icon-width: inherit;
45
- --ax-sys-icon-height: inherit;
46
- --ax-sys-body-font-size: 1rem;
47
- --ax-sys-border-radius: 0.5rem;
48
- --ax-sys-transition-duration: 150ms;
49
- --ax-sys-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
50
-
51
- --ax-sys-scroller-size: 5px;
52
- --ax-sys-scroller-size-radius: 3px;
53
- --ax-sys-scroller-track-color: rgba(var(--ax-sys-color-light-surface));
54
- --ax-sys-scroller-thumb-color: rgba(var(--ax-sys-color-darkest-surface));
55
-
56
- --ax-sys-color-lightest-surface: 255, 255, 255;
57
- --ax-sys-color-on-lightest-surface: 10, 10, 10;
58
- --ax-sys-color-border-lightest-surface: 233, 233, 233;
59
-
60
- --ax-sys-color-lighter-surface: 250, 250, 250;
61
- --ax-sys-color-on-lighter-surface: 10, 10, 10;
62
- --ax-sys-color-border-lighter-surface: 228, 228, 228;
63
-
64
- --ax-sys-color-light-surface: 245, 245, 245;
65
- --ax-sys-color-on-light-surface: 10, 10, 10;
66
- --ax-sys-color-border-light-surface: 223, 223, 223;
67
-
68
- --ax-sys-color-surface: 240, 240, 241;
69
- --ax-sys-color-on-surface: 10, 10, 10;
70
- --ax-sys-color-border-surface: 218, 218, 218;
71
-
72
- --ax-sys-color-dark-surface: 235, 235, 236;
73
- --ax-sys-color-on-dark-surface: 10, 10, 10;
74
- --ax-sys-color-border-dark-surface: 213, 213, 213;
75
-
76
- --ax-sys-color-darker-surface: 230, 230, 231;
77
- --ax-sys-color-on-darker-surface: 10, 10, 10;
78
- --ax-sys-color-border-darker-surface: 208, 208, 208;
79
-
80
- --ax-sys-color-darkest-surface: 224, 224, 225;
81
- --ax-sys-color-on-darkest-surface: 10, 10, 10;
82
- --ax-sys-color-border-darkest-surface: 202, 202, 202;
83
-
84
- --ax-sys-color-primary-50: 231, 246, 255;
85
- --ax-sys-color-primary-100: 211, 234, 255;
86
- --ax-sys-color-primary-200: 183, 217, 255;
87
- --ax-sys-color-primary-300: 138, 189, 255;
88
- --ax-sys-color-primary-400: 77, 151, 255;
89
- --ax-sys-color-primary-500: 43, 127, 255;
90
- --ax-sys-color-primary-600: 20, 108, 235;
91
- --ax-sys-color-primary-700: 0, 86, 210;
92
- --ax-sys-color-primary-800: 12, 70, 182;
93
- --ax-sys-color-primary-900: 29, 64, 142;
94
- --ax-sys-color-primary-950: 14, 34, 84;
95
-
96
- --ax-sys-color-secondary-50: 234, 243, 255;
97
- --ax-sys-color-secondary-100: 219, 229, 247;
98
- --ax-sys-color-secondary-200: 199, 208, 226;
99
- --ax-sys-color-secondary-300: 168, 177, 194;
100
- --ax-sys-color-secondary-400: 130, 138, 154;
101
- --ax-sys-color-secondary-500: 106, 114, 130;
102
- --ax-sys-color-secondary-600: 93, 101, 117;
103
- --ax-sys-color-secondary-700: 78, 86, 101;
104
- --ax-sys-color-secondary-800: 66, 73, 87;
105
- --ax-sys-color-secondary-900: 59, 64, 74;
106
- --ax-sys-color-secondary-950: 35, 38, 45;
107
-
108
- --ax-sys-color-success-50: 207, 255, 232;
109
- --ax-sys-color-success-100: 162, 255, 211;
110
- --ax-sys-color-success-200: 111, 255, 188;
111
- --ax-sys-color-success-300: 86, 233, 167;
112
- --ax-sys-color-success-400: 48, 206, 141;
113
- --ax-sys-color-success-500: 1, 188, 125;
114
- --ax-sys-color-success-600: 0, 165, 104;
115
- --ax-sys-color-success-700: 0, 136, 81;
116
- --ax-sys-color-success-800: 22, 110, 67;
117
- --ax-sys-color-success-900: 43, 89, 61;
118
- --ax-sys-color-success-950: 23, 41, 28;
119
-
120
- --ax-sys-color-warning-50: 255, 244, 220;
121
- --ax-sys-color-warning-100: 255, 234, 201;
122
- --ax-sys-color-warning-200: 255, 221, 174;
123
- --ax-sys-color-warning-300: 255, 198, 128;
124
- --ax-sys-color-warning-400: 255, 168, 40;
125
- --ax-sys-color-warning-500: 253, 154, 1;
126
- --ax-sys-color-warning-600: 224, 127, 0;
127
- --ax-sys-color-warning-700: 181, 100, 0;
128
- --ax-sys-color-warning-800: 144, 81, 20;
129
- --ax-sys-color-warning-900: 110, 71, 40;
130
- --ax-sys-color-warning-950: 44, 28, 18;
131
-
132
- --ax-sys-color-danger-50: 255, 236, 237;
133
- --ax-sys-color-danger-100: 255, 220, 221;
134
- --ax-sys-color-danger-200: 255, 196, 198;
135
- --ax-sys-color-danger-300: 255, 155, 162;
136
- --ax-sys-color-danger-400: 255, 89, 113;
137
- --ax-sys-color-danger-500: 255, 32, 86;
138
- --ax-sys-color-danger-600: 232, 0, 68;
139
- --ax-sys-color-danger-700: 195, 0, 53;
140
- --ax-sys-color-danger-800: 159, 23, 47;
141
- --ax-sys-color-danger-900: 122, 44, 49;
142
- --ax-sys-color-danger-950: 61, 27, 27;
143
-
144
- --ax-sys-color-accent-50: 255, 255, 255;
145
- --ax-sys-color-accent-100: 255, 255, 255;
146
- --ax-sys-color-accent-200: 255, 255, 255;
147
- --ax-sys-color-accent-300: 255, 255, 255;
148
- --ax-sys-color-accent-400: 255, 255, 255;
149
- --ax-sys-color-accent-500: 255, 255, 255;
150
- --ax-sys-color-accent-600: 213, 213, 213;
151
- --ax-sys-color-accent-700: 164, 164, 164;
152
- --ax-sys-color-accent-800: 126, 126, 126;
153
- --ax-sys-color-accent-900: 98, 98, 98;
154
- --ax-sys-color-accent-950: 26, 26, 26;
155
-
156
- --ax-sys-color-accent2-50: 255, 255, 255;
157
- --ax-sys-color-accent2-100: 255, 255, 255;
158
- --ax-sys-color-accent2-200: 255, 255, 255;
159
- --ax-sys-color-accent2-300: 255, 255, 255;
160
- --ax-sys-color-accent2-400: 255, 255, 255;
161
- --ax-sys-color-accent2-500: 255, 255, 255;
162
- --ax-sys-color-accent2-600: 213, 213, 213;
163
- --ax-sys-color-accent2-700: 164, 164, 164;
164
- --ax-sys-color-accent2-800: 126, 126, 126;
165
- --ax-sys-color-accent2-900: 98, 98, 98;
166
- --ax-sys-color-accent2-950: 26, 26, 26;
167
-
168
- --ax-sys-color-accent3-50: 255, 255, 255;
169
- --ax-sys-color-accent3-100: 255, 255, 255;
170
- --ax-sys-color-accent3-200: 255, 255, 255;
171
- --ax-sys-color-accent3-300: 255, 255, 255;
172
- --ax-sys-color-accent3-400: 255, 255, 255;
173
- --ax-sys-color-accent3-500: 255, 255, 255;
174
- --ax-sys-color-accent3-600: 213, 213, 213;
175
- --ax-sys-color-accent3-700: 164, 164, 164;
176
- --ax-sys-color-accent3-800: 126, 126, 126;
177
- --ax-sys-color-accent3-900: 98, 98, 98;
178
- --ax-sys-color-accent3-950: 26, 26, 26;
179
-
180
- --ax-sys-color-accent4-50: 255, 255, 255;
181
- --ax-sys-color-accent4-100: 255, 255, 255;
182
- --ax-sys-color-accent4-200: 255, 255, 255;
183
- --ax-sys-color-accent4-300: 255, 255, 255;
184
- --ax-sys-color-accent4-400: 255, 255, 255;
185
- --ax-sys-color-accent4-500: 255, 255, 255;
186
- --ax-sys-color-accent4-600: 213, 213, 213;
187
- --ax-sys-color-accent4-700: 164, 164, 164;
188
- --ax-sys-color-accent4-800: 126, 126, 126;
189
- --ax-sys-color-accent4-900: 98, 98, 98;
190
- --ax-sys-color-accent4-950: 26, 26, 26;
191
-
192
- --ax-sys-color-accent5-50: 255, 255, 255;
193
- --ax-sys-color-accent5-100: 255, 255, 255;
194
- --ax-sys-color-accent5-200: 255, 255, 255;
195
- --ax-sys-color-accent5-300: 255, 255, 255;
196
- --ax-sys-color-accent5-400: 255, 255, 255;
197
- --ax-sys-color-accent5-500: 255, 255, 255;
198
- --ax-sys-color-accent5-600: 213, 213, 213;
199
- --ax-sys-color-accent5-700: 164, 164, 164;
200
- --ax-sys-color-accent5-800: 126, 126, 126;
201
- --ax-sys-color-accent5-900: 98, 98, 98;
202
- --ax-sys-color-accent5-950: 26, 26, 26;
203
-
204
- --ax-sys-color-accent6-50: 255, 255, 255;
205
- --ax-sys-color-accent6-100: 255, 255, 255;
206
- --ax-sys-color-accent6-200: 255, 255, 255;
207
- --ax-sys-color-accent6-300: 255, 255, 255;
208
- --ax-sys-color-accent6-400: 255, 255, 255;
209
- --ax-sys-color-accent6-500: 255, 255, 255;
210
- --ax-sys-color-accent6-600: 213, 213, 213;
211
- --ax-sys-color-accent6-700: 164, 164, 164;
212
- --ax-sys-color-accent6-800: 126, 126, 126;
213
- --ax-sys-color-accent6-900: 98, 98, 98;
214
- --ax-sys-color-accent6-950: 26, 26, 26;
215
-
216
- --ax-sys-color-accent7-50: 255, 255, 255;
217
- --ax-sys-color-accent7-100: 255, 255, 255;
218
- --ax-sys-color-accent7-200: 255, 255, 255;
219
- --ax-sys-color-accent7-300: 255, 255, 255;
220
- --ax-sys-color-accent7-400: 255, 255, 255;
221
- --ax-sys-color-accent7-500: 255, 255, 255;
222
- --ax-sys-color-accent7-600: 213, 213, 213;
223
- --ax-sys-color-accent7-700: 164, 164, 164;
224
- --ax-sys-color-accent7-800: 126, 126, 126;
225
- --ax-sys-color-accent7-900: 98, 98, 98;
226
- --ax-sys-color-accent7-950: 26, 26, 26;
227
-
228
- --ax-sys-color-primary-lightest-surface: 211, 234, 255;
229
- --ax-sys-color-on-primary-lightest-surface: 29, 48, 64;
230
- --ax-sys-color-border-primary-lightest-surface: 175, 217, 255;
231
-
232
- --ax-sys-color-primary-lighter-surface: 183, 217, 255;
233
- --ax-sys-color-on-primary-lighter-surface: 18, 47, 77;
234
- --ax-sys-color-border-primary-lighter-surface: 147, 198, 255;
235
-
236
- --ax-sys-color-primary-light-surface: 138, 189, 255;
237
- --ax-sys-color-on-primary-light-surface: 0, 44, 98;
238
- --ax-sys-color-border-primary-light-surface: 102, 169, 255;
239
-
240
- --ax-sys-color-primary-surface: 43, 127, 255;
241
- --ax-sys-color-on-primary-surface: 244, 254, 255;
242
- --ax-sys-color-border-primary-surface: 7, 105, 255;
243
-
244
- --ax-sys-color-primary-dark-surface: 20, 108, 235;
245
- --ax-sys-color-on-primary-dark-surface: 244, 254, 255;
246
- --ax-sys-color-border-primary-dark-surface: 17, 93, 202;
247
-
248
- --ax-sys-color-primary-darker-surface: 0, 86, 210;
249
- --ax-sys-color-on-primary-darker-surface: 245, 254, 255;
250
- --ax-sys-color-border-primary-darker-surface: 0, 71, 174;
251
-
252
- --ax-sys-color-primary-darkest-surface: 12, 70, 182;
253
- --ax-sys-color-on-primary-darkest-surface: 245, 254, 255;
254
- --ax-sys-color-border-primary-darkest-surface: 10, 57, 149;
255
-
256
- --ax-sys-color-secondary-lightest-surface: 219, 229, 247;
257
- --ax-sys-color-on-secondary-lightest-surface: 39, 46, 60;
258
- --ax-sys-color-border-secondary-lightest-surface: 190, 208, 241;
259
-
260
- --ax-sys-color-secondary-lighter-surface: 199, 208, 226;
261
- --ax-sys-color-on-secondary-lighter-surface: 39, 46, 60;
262
- --ax-sys-color-border-secondary-lighter-surface: 175, 188, 214;
263
-
264
- --ax-sys-color-secondary-light-surface: 168, 177, 194;
265
- --ax-sys-color-on-secondary-light-surface: 39, 46, 59;
266
- --ax-sys-color-border-secondary-light-surface: 147, 158, 179;
267
-
268
- --ax-sys-color-secondary-surface: 106, 114, 130;
269
- --ax-sys-color-on-secondary-surface: 246, 254, 255;
270
- --ax-sys-color-border-secondary-surface: 90, 97, 110;
271
-
272
- --ax-sys-color-secondary-dark-surface: 93, 101, 117;
273
- --ax-sys-color-on-secondary-dark-surface: 246, 254, 255;
274
- --ax-sys-color-border-secondary-dark-surface: 77, 84, 97;
275
-
276
- --ax-sys-color-secondary-darker-surface: 78, 86, 101;
277
- --ax-sys-color-on-secondary-darker-surface: 245, 254, 255;
278
- --ax-sys-color-border-secondary-darker-surface: 62, 69, 81;
279
-
280
- --ax-sys-color-secondary-darkest-surface: 66, 73, 87;
281
- --ax-sys-color-on-secondary-darkest-surface: 246, 254, 255;
282
- --ax-sys-color-border-secondary-darkest-surface: 51, 56, 67;
283
-
284
- --ax-sys-color-success-lightest-surface: 162, 255, 211;
285
- --ax-sys-color-on-success-lightest-surface: 0, 59, 32;
286
- --ax-sys-color-border-success-lightest-surface: 126, 255, 194;
287
-
288
- --ax-sys-color-success-lighter-surface: 111, 255, 188;
289
- --ax-sys-color-on-success-lighter-surface: 0, 59, 29;
290
- --ax-sys-color-border-success-lighter-surface: 75, 255, 171;
291
-
292
- --ax-sys-color-success-light-surface: 86, 233, 167;
293
- --ax-sys-color-on-success-light-surface: 0, 59, 29;
294
- --ax-sys-color-border-success-light-surface: 54, 229, 151;
295
-
296
- --ax-sys-color-success-surface: 1, 188, 125;
297
- --ax-sys-color-on-success-surface: 231, 255, 244;
298
- --ax-sys-color-border-success-surface: 1, 152, 101;
299
-
300
- --ax-sys-color-success-dark-surface: 0, 165, 104;
301
- --ax-sys-color-on-success-dark-surface: 231, 255, 243;
302
- --ax-sys-color-border-success-dark-surface: 0, 129, 81;
303
-
304
- --ax-sys-color-success-darker-surface: 0, 136, 81;
305
- --ax-sys-color-on-success-darker-surface: 232, 255, 242;
306
- --ax-sys-color-border-success-darker-surface: 0, 100, 60;
307
-
308
- --ax-sys-color-success-darkest-surface: 22, 110, 67;
309
- --ax-sys-color-on-success-darkest-surface: 232, 255, 242;
310
- --ax-sys-color-border-success-darkest-surface: 16, 80, 49;
311
-
312
- --ax-sys-color-warning-lightest-surface: 255, 234, 201;
313
- --ax-sys-color-on-warning-lightest-surface: 59, 43, 14;
314
- --ax-sys-color-border-warning-lightest-surface: 255, 220, 165;
315
-
316
- --ax-sys-color-warning-lighter-surface: 255, 221, 174;
317
- --ax-sys-color-on-warning-lighter-surface: 66, 39, 0;
318
- --ax-sys-color-border-warning-lighter-surface: 255, 206, 138;
319
-
320
- --ax-sys-color-warning-light-surface: 255, 198, 128;
321
- --ax-sys-color-on-warning-light-surface: 71, 36, 0;
322
- --ax-sys-color-border-warning-light-surface: 255, 182, 92;
323
-
324
- --ax-sys-color-warning-surface: 253, 154, 1;
325
- --ax-sys-color-on-warning-surface: 255, 250, 231;
326
- --ax-sys-color-border-warning-surface: 217, 132, 1;
327
-
328
- --ax-sys-color-warning-dark-surface: 224, 127, 0;
329
- --ax-sys-color-on-warning-dark-surface: 255, 249, 233;
330
- --ax-sys-color-border-warning-dark-surface: 188, 107, 0;
331
-
332
- --ax-sys-color-warning-darker-surface: 181, 100, 0;
333
- --ax-sys-color-on-warning-darker-surface: 255, 249, 234;
334
- --ax-sys-color-border-warning-darker-surface: 145, 80, 0;
335
-
336
- --ax-sys-color-warning-darkest-surface: 144, 81, 20;
337
- --ax-sys-color-on-warning-darkest-surface: 255, 249, 234;
338
- --ax-sys-color-border-warning-darkest-surface: 113, 63, 16;
339
-
340
- --ax-sys-color-danger-lightest-surface: 255, 220, 221;
341
- --ax-sys-color-on-danger-lightest-surface: 63, 38, 39;
342
- --ax-sys-color-border-danger-lightest-surface: 255, 184, 186;
343
-
344
- --ax-sys-color-danger-lighter-surface: 255, 196, 198;
345
- --ax-sys-color-on-danger-lighter-surface: 74, 30, 34;
346
- --ax-sys-color-border-danger-lighter-surface: 255, 160, 164;
347
-
348
- --ax-sys-color-danger-light-surface: 255, 155, 162;
349
- --ax-sys-color-on-danger-light-surface: 91, 0, 25;
350
- --ax-sys-color-border-danger-light-surface: 255, 119, 129;
351
-
352
- --ax-sys-color-danger-surface: 255, 32, 86;
353
- --ax-sys-color-on-danger-surface: 255, 247, 248;
354
- --ax-sys-color-border-danger-surface: 251, 0, 61;
355
-
356
- --ax-sys-color-danger-dark-surface: 232, 0, 68;
357
- --ax-sys-color-on-danger-dark-surface: 255, 247, 247;
358
- --ax-sys-color-border-danger-dark-surface: 196, 0, 58;
359
-
360
- --ax-sys-color-danger-darker-surface: 195, 0, 53;
361
- --ax-sys-color-on-danger-darker-surface: 255, 247, 247;
362
- --ax-sys-color-border-danger-darker-surface: 159, 0, 43;
363
-
364
- --ax-sys-color-danger-darkest-surface: 159, 23, 47;
365
- --ax-sys-color-on-danger-darkest-surface: 255, 247, 247;
366
- --ax-sys-color-border-danger-darkest-surface: 128, 18, 38;
367
-
368
- --ax-sys-color-accent-lightest-surface: 255, 255, 255;
369
- --ax-sys-color-on-accent-lightest-surface: 46, 46, 46;
370
- --ax-sys-color-border-accent-lightest-surface: 237, 237, 237;
371
-
372
- --ax-sys-color-accent-lighter-surface: 255, 255, 255;
373
- --ax-sys-color-on-accent-lighter-surface: 46, 46, 46;
374
- --ax-sys-color-border-accent-lighter-surface: 237, 237, 237;
375
-
376
- --ax-sys-color-accent-light-surface: 255, 255, 255;
377
- --ax-sys-color-on-accent-light-surface: 46, 46, 46;
378
- --ax-sys-color-border-accent-light-surface: 237, 237, 237;
379
-
380
- --ax-sys-color-accent-surface: 255, 255, 255;
381
- --ax-sys-color-on-accent-surface: 46, 46, 46;
382
- --ax-sys-color-border-accent-surface: 237, 237, 237;
383
-
384
- --ax-sys-color-accent-dark-surface: 213, 213, 213;
385
- --ax-sys-color-on-accent-dark-surface: 46, 46, 46;
386
- --ax-sys-color-border-accent-dark-surface: 195, 195, 195;
387
-
388
- --ax-sys-color-accent-darker-surface: 164, 164, 164;
389
- --ax-sys-color-on-accent-darker-surface: 253, 253, 253;
390
- --ax-sys-color-border-accent-darker-surface: 146, 146, 146;
391
-
392
- --ax-sys-color-accent-darkest-surface: 126, 126, 126;
393
- --ax-sys-color-on-accent-darkest-surface: 253, 253, 253;
394
- --ax-sys-color-border-accent-darkest-surface: 108, 108, 108;
395
-
396
- --ax-sys-color-accent2-lightest-surface: 255, 255, 255;
397
- --ax-sys-color-on-accent2-lightest-surface: 46, 46, 46;
398
- --ax-sys-color-border-accent2-lightest-surface: 237, 237, 237;
399
-
400
- --ax-sys-color-accent2-lighter-surface: 255, 255, 255;
401
- --ax-sys-color-on-accent2-lighter-surface: 46, 46, 46;
402
- --ax-sys-color-border-accent2-lighter-surface: 237, 237, 237;
403
-
404
- --ax-sys-color-accent2-light-surface: 255, 255, 255;
405
- --ax-sys-color-on-accent2-light-surface: 46, 46, 46;
406
- --ax-sys-color-border-accent2-light-surface: 237, 237, 237;
407
-
408
- --ax-sys-color-accent2-surface: 255, 255, 255;
409
- --ax-sys-color-on-accent2-surface: 46, 46, 46;
410
- --ax-sys-color-border-accent2-surface: 237, 237, 237;
411
-
412
- --ax-sys-color-accent2-dark-surface: 213, 213, 213;
413
- --ax-sys-color-on-accent2-dark-surface: 46, 46, 46;
414
- --ax-sys-color-border-accent2-dark-surface: 195, 195, 195;
415
-
416
- --ax-sys-color-accent2-darker-surface: 164, 164, 164;
417
- --ax-sys-color-on-accent2-darker-surface: 253, 253, 253;
418
- --ax-sys-color-border-accent2-darker-surface: 146, 146, 146;
419
-
420
- --ax-sys-color-accent2-darkest-surface: 126, 126, 126;
421
- --ax-sys-color-on-accent2-darkest-surface: 253, 253, 253;
422
- --ax-sys-color-border-accent2-darkest-surface: 108, 108, 108;
423
-
424
- --ax-sys-color-accent3-lightest-surface: 255, 255, 255;
425
- --ax-sys-color-on-accent3-lightest-surface: 46, 46, 46;
426
- --ax-sys-color-border-accent3-lightest-surface: 237, 237, 237;
427
-
428
- --ax-sys-color-accent3-lighter-surface: 255, 255, 255;
429
- --ax-sys-color-on-accent3-lighter-surface: 46, 46, 46;
430
- --ax-sys-color-border-accent3-lighter-surface: 237, 237, 237;
431
-
432
- --ax-sys-color-accent3-light-surface: 255, 255, 255;
433
- --ax-sys-color-on-accent3-light-surface: 46, 46, 46;
434
- --ax-sys-color-border-accent3-light-surface: 237, 237, 237;
435
-
436
- --ax-sys-color-accent3-surface: 255, 255, 255;
437
- --ax-sys-color-on-accent3-surface: 46, 46, 46;
438
- --ax-sys-color-border-accent3-surface: 237, 237, 237;
439
-
440
- --ax-sys-color-accent3-dark-surface: 213, 213, 213;
441
- --ax-sys-color-on-accent3-dark-surface: 46, 46, 46;
442
- --ax-sys-color-border-accent3-dark-surface: 195, 195, 195;
443
-
444
- --ax-sys-color-accent3-darker-surface: 164, 164, 164;
445
- --ax-sys-color-on-accent3-darker-surface: 253, 253, 253;
446
- --ax-sys-color-border-accent3-darker-surface: 146, 146, 146;
447
-
448
- --ax-sys-color-accent3-darkest-surface: 126, 126, 126;
449
- --ax-sys-color-on-accent3-darkest-surface: 253, 253, 253;
450
- --ax-sys-color-border-accent3-darkest-surface: 108, 108, 108;
451
-
452
- --ax-sys-color-accent4-lightest-surface: 255, 255, 255;
453
- --ax-sys-color-on-accent4-lightest-surface: 46, 46, 46;
454
- --ax-sys-color-border-accent4-lightest-surface: 237, 237, 237;
455
-
456
- --ax-sys-color-accent4-lighter-surface: 255, 255, 255;
457
- --ax-sys-color-on-accent4-lighter-surface: 46, 46, 46;
458
- --ax-sys-color-border-accent4-lighter-surface: 237, 237, 237;
459
-
460
- --ax-sys-color-accent4-light-surface: 255, 255, 255;
461
- --ax-sys-color-on-accent4-light-surface: 46, 46, 46;
462
- --ax-sys-color-border-accent4-light-surface: 237, 237, 237;
463
-
464
- --ax-sys-color-accent4-surface: 255, 255, 255;
465
- --ax-sys-color-on-accent4-surface: 46, 46, 46;
466
- --ax-sys-color-border-accent4-surface: 237, 237, 237;
467
-
468
- --ax-sys-color-accent4-dark-surface: 213, 213, 213;
469
- --ax-sys-color-on-accent4-dark-surface: 46, 46, 46;
470
- --ax-sys-color-border-accent4-dark-surface: 195, 195, 195;
471
-
472
- --ax-sys-color-accent4-darker-surface: 164, 164, 164;
473
- --ax-sys-color-on-accent4-darker-surface: 253, 253, 253;
474
- --ax-sys-color-border-accent4-darker-surface: 146, 146, 146;
475
-
476
- --ax-sys-color-accent4-darkest-surface: 126, 126, 126;
477
- --ax-sys-color-on-accent4-darkest-surface: 253, 253, 253;
478
- --ax-sys-color-border-accent4-darkest-surface: 108, 108, 108;
479
-
480
- --ax-sys-color-accent5-lightest-surface: 255, 255, 255;
481
- --ax-sys-color-on-accent5-lightest-surface: 46, 46, 46;
482
- --ax-sys-color-border-accent5-lightest-surface: 237, 237, 237;
483
-
484
- --ax-sys-color-accent5-lighter-surface: 255, 255, 255;
485
- --ax-sys-color-on-accent5-lighter-surface: 46, 46, 46;
486
- --ax-sys-color-border-accent5-lighter-surface: 237, 237, 237;
487
-
488
- --ax-sys-color-accent5-light-surface: 255, 255, 255;
489
- --ax-sys-color-on-accent5-light-surface: 46, 46, 46;
490
- --ax-sys-color-border-accent5-light-surface: 237, 237, 237;
491
-
492
- --ax-sys-color-accent5-surface: 255, 255, 255;
493
- --ax-sys-color-on-accent5-surface: 46, 46, 46;
494
- --ax-sys-color-border-accent5-surface: 237, 237, 237;
495
-
496
- --ax-sys-color-accent5-dark-surface: 213, 213, 213;
497
- --ax-sys-color-on-accent5-dark-surface: 46, 46, 46;
498
- --ax-sys-color-border-accent5-dark-surface: 195, 195, 195;
499
-
500
- --ax-sys-color-accent5-darker-surface: 164, 164, 164;
501
- --ax-sys-color-on-accent5-darker-surface: 253, 253, 253;
502
- --ax-sys-color-border-accent5-darker-surface: 146, 146, 146;
503
-
504
- --ax-sys-color-accent5-darkest-surface: 126, 126, 126;
505
- --ax-sys-color-on-accent5-darkest-surface: 253, 253, 253;
506
- --ax-sys-color-border-accent5-darkest-surface: 108, 108, 108;
507
-
508
- --ax-sys-color-accent6-lightest-surface: 255, 255, 255;
509
- --ax-sys-color-on-accent6-lightest-surface: 46, 46, 46;
510
- --ax-sys-color-border-accent6-lightest-surface: 237, 237, 237;
511
-
512
- --ax-sys-color-accent6-lighter-surface: 255, 255, 255;
513
- --ax-sys-color-on-accent6-lighter-surface: 46, 46, 46;
514
- --ax-sys-color-border-accent6-lighter-surface: 237, 237, 237;
515
-
516
- --ax-sys-color-accent6-light-surface: 255, 255, 255;
517
- --ax-sys-color-on-accent6-light-surface: 46, 46, 46;
518
- --ax-sys-color-border-accent6-light-surface: 237, 237, 237;
519
-
520
- --ax-sys-color-accent6-surface: 255, 255, 255;
521
- --ax-sys-color-on-accent6-surface: 46, 46, 46;
522
- --ax-sys-color-border-accent6-surface: 237, 237, 237;
523
-
524
- --ax-sys-color-accent6-dark-surface: 213, 213, 213;
525
- --ax-sys-color-on-accent6-dark-surface: 46, 46, 46;
526
- --ax-sys-color-border-accent6-dark-surface: 195, 195, 195;
527
-
528
- --ax-sys-color-accent6-darker-surface: 164, 164, 164;
529
- --ax-sys-color-on-accent6-darker-surface: 253, 253, 253;
530
- --ax-sys-color-border-accent6-darker-surface: 146, 146, 146;
531
-
532
- --ax-sys-color-accent6-darkest-surface: 126, 126, 126;
533
- --ax-sys-color-on-accent6-darkest-surface: 253, 253, 253;
534
- --ax-sys-color-border-accent6-darkest-surface: 108, 108, 108;
535
-
536
- --ax-sys-color-accent7-lightest-surface: 255, 255, 255;
537
- --ax-sys-color-on-accent7-lightest-surface: 46, 46, 46;
538
- --ax-sys-color-border-accent7-lightest-surface: 237, 237, 237;
539
-
540
- --ax-sys-color-accent7-lighter-surface: 255, 255, 255;
541
- --ax-sys-color-on-accent7-lighter-surface: 46, 46, 46;
542
- --ax-sys-color-border-accent7-lighter-surface: 237, 237, 237;
543
-
544
- --ax-sys-color-accent7-light-surface: 255, 255, 255;
545
- --ax-sys-color-on-accent7-light-surface: 46, 46, 46;
546
- --ax-sys-color-border-accent7-light-surface: 237, 237, 237;
547
-
548
- --ax-sys-color-accent7-surface: 255, 255, 255;
549
- --ax-sys-color-on-accent7-surface: 46, 46, 46;
550
- --ax-sys-color-border-accent7-surface: 237, 237, 237;
551
-
552
- --ax-sys-color-accent7-dark-surface: 213, 213, 213;
553
- --ax-sys-color-on-accent7-dark-surface: 46, 46, 46;
554
- --ax-sys-color-border-accent7-dark-surface: 195, 195, 195;
555
-
556
- --ax-sys-color-accent7-darker-surface: 164, 164, 164;
557
- --ax-sys-color-on-accent7-darker-surface: 253, 253, 253;
558
- --ax-sys-color-border-accent7-darker-surface: 146, 146, 146;
559
-
560
- --ax-sys-color-accent7-darkest-surface: 126, 126, 126;
561
- --ax-sys-color-on-accent7-darkest-surface: 253, 253, 253;
562
- --ax-sys-color-border-accent7-darkest-surface: 108, 108, 108;
563
-
564
- --ax-sys-color-bg-default: var(--ax-sys-color-lightest-surface);
565
- --ax-sys-color-text-default: var(--ax-sys-color-on-lightest-surface);
566
- --ax-sys-color-border-default: var(--ax-sys-color-border-lightest-surface);
567
- }
568
-
569
- .dark:root {
570
- --ax-sys-scroller-track-color: rgba(var(--ax-sys-color-darker-surface));
571
- --ax-sys-scroller-thumb-color: rgba(var(--ax-sys-color-lightest-surface));
572
-
573
- --ax-sys-color-lightest-surface: 56, 56, 56;
574
- --ax-sys-color-on-lightest-surface: 245, 245, 245;
575
- --ax-sys-color-border-lightest-surface: 64, 64, 64;
576
-
577
- --ax-sys-color-lighter-surface: 49, 49, 49;
578
- --ax-sys-color-on-lighter-surface: 245, 245, 245;
579
- --ax-sys-color-border-lighter-surface: 56, 56, 56;
580
-
581
- --ax-sys-color-light-surface: 42, 42, 42;
582
- --ax-sys-color-on-light-surface: 245, 245, 245;
583
- --ax-sys-color-border-light-surface: 50, 50, 50;
584
-
585
- --ax-sys-color-surface: 33, 33, 33;
586
- --ax-sys-color-on-surface: 245, 245, 245;
587
- --ax-sys-color-border-surface: 44, 44, 44;
588
-
589
- --ax-sys-color-dark-surface: 27, 27, 27;
590
- --ax-sys-color-on-dark-surface: 245, 245, 245;
591
- --ax-sys-color-border-dark-surface: 38, 38, 38;
592
-
593
- --ax-sys-color-darker-surface: 20, 20, 20;
594
- --ax-sys-color-on-darker-surface: 245, 245, 245;
595
- --ax-sys-color-border-darker-surface: 32, 32, 32;
596
-
597
- --ax-sys-color-darkest-surface: 10, 10, 10;
598
- --ax-sys-color-on-darkest-surface: 245, 245, 245;
599
- --ax-sys-color-border-darkest-surface: 28, 28, 28;
600
-
601
- --ax-sys-color-primary-50: 233, 247, 255;
602
- --ax-sys-color-primary-100: 219, 238, 255;
603
- --ax-sys-color-primary-200: 190, 221, 255;
604
- --ax-sys-color-primary-300: 161, 203, 255;
605
- --ax-sys-color-primary-400: 132, 185, 255;
606
- --ax-sys-color-primary-500: 101, 166, 255;
607
- --ax-sys-color-primary-600: 67, 146, 255;
608
- --ax-sys-color-primary-700: 43, 127, 255;
609
- --ax-sys-color-primary-800: 25, 112, 239;
610
- --ax-sys-color-primary-900: 0, 98, 223;
611
- --ax-sys-color-primary-950: 0, 90, 215;
612
-
613
- --ax-sys-color-secondary-50: 240, 249, 255;
614
- --ax-sys-color-secondary-100: 233, 242, 255;
615
- --ax-sys-color-secondary-200: 219, 228, 243;
616
- --ax-sys-color-secondary-300: 206, 214, 229;
617
- --ax-sys-color-secondary-400: 192, 201, 215;
618
- --ax-sys-color-secondary-500: 179, 187, 202;
619
- --ax-sys-color-secondary-600: 166, 174, 188;
620
- --ax-sys-color-secondary-700: 153, 161, 175;
621
- --ax-sys-color-secondary-800: 135, 143, 157;
622
- --ax-sys-color-secondary-900: 118, 126, 139;
623
- --ax-sys-color-secondary-950: 110, 117, 131;
624
-
625
- --ax-sys-color-success-50: 210, 255, 233;
626
- --ax-sys-color-success-100: 180, 255, 219;
627
- --ax-sys-color-success-200: 115, 255, 191;
628
- --ax-sys-color-success-300: 99, 244, 178;
629
- --ax-sys-color-success-400: 82, 230, 164;
630
- --ax-sys-color-success-500: 63, 216, 151;
631
- --ax-sys-color-success-600: 41, 202, 138;
632
- --ax-sys-color-success-700: 1, 188, 125;
633
- --ax-sys-color-success-800: 0, 170, 108;
634
- --ax-sys-color-success-900: 0, 151, 91;
635
- --ax-sys-color-success-950: 0, 141, 85;
636
-
637
- --ax-sys-color-warning-50: 255, 245, 222;
638
- --ax-sys-color-warning-100: 255, 238, 208;
639
- --ax-sys-color-warning-200: 255, 224, 181;
640
- --ax-sys-color-warning-300: 255, 210, 152;
641
- --ax-sys-color-warning-400: 255, 195, 120;
642
- --ax-sys-color-warning-500: 255, 180, 82;
643
- --ax-sys-color-warning-600: 255, 165, 33;
644
- --ax-sys-color-warning-700: 253, 154, 1;
645
- --ax-sys-color-warning-800: 230, 133, 0;
646
- --ax-sys-color-warning-900: 203, 114, 0;
647
- --ax-sys-color-warning-950: 190, 105, 0;
648
-
649
- --ax-sys-color-danger-50: 255, 240, 242;
650
- --ax-sys-color-danger-100: 255, 230, 233;
651
- --ax-sys-color-danger-200: 255, 210, 215;
652
- --ax-sys-color-danger-300: 255, 189, 196;
653
- --ax-sys-color-danger-400: 255, 167, 178;
654
- --ax-sys-color-danger-500: 255, 144, 159;
655
- --ax-sys-color-danger-600: 255, 117, 140;
656
- --ax-sys-color-danger-700: 255, 99, 126;
657
- --ax-sys-color-danger-800: 234, 80, 109;
658
- --ax-sys-color-danger-900: 213, 59, 92;
659
- --ax-sys-color-danger-950: 203, 48, 84;
660
-
661
- --ax-sys-color-accent-50: 255, 255, 255;
662
- --ax-sys-color-accent-100: 255, 255, 255;
663
- --ax-sys-color-accent-200: 255, 255, 255;
664
- --ax-sys-color-accent-300: 255, 255, 255;
665
- --ax-sys-color-accent-400: 255, 255, 255;
666
- --ax-sys-color-accent-500: 255, 255, 255;
667
- --ax-sys-color-accent-600: 255, 255, 255;
668
- --ax-sys-color-accent-700: 255, 255, 255;
669
- --ax-sys-color-accent-800: 222, 222, 222;
670
- --ax-sys-color-accent-900: 190, 190, 190;
671
- --ax-sys-color-accent-950: 174, 174, 174;
672
-
673
- --ax-sys-color-accent2-50: 255, 255, 255;
674
- --ax-sys-color-accent2-100: 255, 255, 255;
675
- --ax-sys-color-accent2-200: 255, 255, 255;
676
- --ax-sys-color-accent2-300: 255, 255, 255;
677
- --ax-sys-color-accent2-400: 255, 255, 255;
678
- --ax-sys-color-accent2-500: 255, 255, 255;
679
- --ax-sys-color-accent2-600: 255, 255, 255;
680
- --ax-sys-color-accent2-700: 255, 255, 255;
681
- --ax-sys-color-accent2-800: 222, 222, 222;
682
- --ax-sys-color-accent2-900: 190, 190, 190;
683
- --ax-sys-color-accent2-950: 174, 174, 174;
684
-
685
- --ax-sys-color-accent3-50: 255, 255, 255;
686
- --ax-sys-color-accent3-100: 255, 255, 255;
687
- --ax-sys-color-accent3-200: 255, 255, 255;
688
- --ax-sys-color-accent3-300: 255, 255, 255;
689
- --ax-sys-color-accent3-400: 255, 255, 255;
690
- --ax-sys-color-accent3-500: 255, 255, 255;
691
- --ax-sys-color-accent3-600: 255, 255, 255;
692
- --ax-sys-color-accent3-700: 255, 255, 255;
693
- --ax-sys-color-accent3-800: 222, 222, 222;
694
- --ax-sys-color-accent3-900: 190, 190, 190;
695
- --ax-sys-color-accent3-950: 174, 174, 174;
696
-
697
- --ax-sys-color-accent4-50: 255, 255, 255;
698
- --ax-sys-color-accent4-100: 255, 255, 255;
699
- --ax-sys-color-accent4-200: 255, 255, 255;
700
- --ax-sys-color-accent4-300: 255, 255, 255;
701
- --ax-sys-color-accent4-400: 255, 255, 255;
702
- --ax-sys-color-accent4-500: 255, 255, 255;
703
- --ax-sys-color-accent4-600: 255, 255, 255;
704
- --ax-sys-color-accent4-700: 255, 255, 255;
705
- --ax-sys-color-accent4-800: 222, 222, 222;
706
- --ax-sys-color-accent4-900: 190, 190, 190;
707
- --ax-sys-color-accent4-950: 174, 174, 174;
708
-
709
- --ax-sys-color-accent5-50: 255, 255, 255;
710
- --ax-sys-color-accent5-100: 255, 255, 255;
711
- --ax-sys-color-accent5-200: 255, 255, 255;
712
- --ax-sys-color-accent5-300: 255, 255, 255;
713
- --ax-sys-color-accent5-400: 255, 255, 255;
714
- --ax-sys-color-accent5-500: 255, 255, 255;
715
- --ax-sys-color-accent5-600: 255, 255, 255;
716
- --ax-sys-color-accent5-700: 255, 255, 255;
717
- --ax-sys-color-accent5-800: 222, 222, 222;
718
- --ax-sys-color-accent5-900: 190, 190, 190;
719
- --ax-sys-color-accent5-950: 174, 174, 174;
720
-
721
- --ax-sys-color-accent6-50: 255, 255, 255;
722
- --ax-sys-color-accent6-100: 255, 255, 255;
723
- --ax-sys-color-accent6-200: 255, 255, 255;
724
- --ax-sys-color-accent6-300: 255, 255, 255;
725
- --ax-sys-color-accent6-400: 255, 255, 255;
726
- --ax-sys-color-accent6-500: 255, 255, 255;
727
- --ax-sys-color-accent6-600: 255, 255, 255;
728
- --ax-sys-color-accent6-700: 255, 255, 255;
729
- --ax-sys-color-accent6-800: 222, 222, 222;
730
- --ax-sys-color-accent6-900: 190, 190, 190;
731
- --ax-sys-color-accent6-950: 174, 174, 174;
732
-
733
- --ax-sys-color-accent7-50: 255, 255, 255;
734
- --ax-sys-color-accent7-100: 255, 255, 255;
735
- --ax-sys-color-accent7-200: 255, 255, 255;
736
- --ax-sys-color-accent7-300: 255, 255, 255;
737
- --ax-sys-color-accent7-400: 255, 255, 255;
738
- --ax-sys-color-accent7-500: 255, 255, 255;
739
- --ax-sys-color-accent7-600: 255, 255, 255;
740
- --ax-sys-color-accent7-700: 255, 255, 255;
741
- --ax-sys-color-accent7-800: 222, 222, 222;
742
- --ax-sys-color-accent7-900: 190, 190, 190;
743
- --ax-sys-color-accent7-950: 174, 174, 174;
744
-
745
- --ax-sys-color-primary-lightest-surface: 219, 238, 255;
746
- --ax-sys-color-on-primary-lightest-surface: 9, 23, 35;
747
- --ax-sys-color-border-primary-lightest-surface: 255, 255, 255;
748
-
749
- --ax-sys-color-primary-lighter-surface: 190, 221, 255;
750
- --ax-sys-color-on-primary-lighter-surface: 0, 22, 47;
751
- --ax-sys-color-border-primary-lighter-surface: 236, 245, 255;
752
-
753
- --ax-sys-color-primary-light-surface: 161, 203, 255;
754
- --ax-sys-color-on-primary-light-surface: 0, 20, 59;
755
- --ax-sys-color-border-primary-light-surface: 207, 228, 255;
756
-
757
- --ax-sys-color-primary-surface: 101, 166, 255;
758
- --ax-sys-color-on-primary-surface: 0, 6, 82;
759
- --ax-sys-color-border-primary-surface: 147, 193, 255;
760
-
761
- --ax-sys-color-primary-dark-surface: 67, 146, 255;
762
- --ax-sys-color-on-primary-dark-surface: 0, 0, 87;
763
- --ax-sys-color-border-primary-dark-surface: 113, 173, 255;
764
-
765
- --ax-sys-color-primary-darker-surface: 43, 127, 255;
766
- --ax-sys-color-on-primary-darker-surface: 0, 0, 91;
767
- --ax-sys-color-border-primary-darker-surface: 89, 155, 255;
768
-
769
- --ax-sys-color-primary-darkest-surface: 25, 112, 239;
770
- --ax-sys-color-on-primary-darkest-surface: 0, 0, 91;
771
- --ax-sys-color-border-primary-darkest-surface: 68, 139, 242;
772
-
773
- --ax-sys-color-secondary-lightest-surface: 233, 242, 255;
774
- --ax-sys-color-on-secondary-lightest-surface: 16, 22, 31;
775
- --ax-sys-color-border-secondary-lightest-surface: 255, 255, 255;
776
-
777
- --ax-sys-color-secondary-lighter-surface: 219, 228, 243;
778
- --ax-sys-color-on-secondary-lighter-surface: 16, 22, 32;
779
- --ax-sys-color-border-secondary-lighter-surface: 253, 254, 254;
780
-
781
- --ax-sys-color-secondary-light-surface: 206, 214, 229;
782
- --ax-sys-color-on-secondary-light-surface: 17, 22, 32;
783
- --ax-sys-color-border-secondary-light-surface: 236, 239, 245;
784
-
785
- --ax-sys-color-secondary-surface: 179, 187, 202;
786
- --ax-sys-color-on-secondary-surface: 17, 22, 33;
787
- --ax-sys-color-border-secondary-surface: 206, 211, 221;
788
-
789
- --ax-sys-color-secondary-dark-surface: 166, 174, 188;
790
- --ax-sys-color-on-secondary-dark-surface: 16, 22, 32;
791
- --ax-sys-color-border-secondary-dark-surface: 192, 198, 208;
792
-
793
- --ax-sys-color-secondary-darker-surface: 153, 161, 175;
794
- --ax-sys-color-on-secondary-darker-surface: 16, 22, 32;
795
- --ax-sys-color-border-secondary-darker-surface: 179, 185, 195;
796
-
797
- --ax-sys-color-secondary-darkest-surface: 135, 143, 157;
798
- --ax-sys-color-on-secondary-darkest-surface: 16, 22, 33;
799
- --ax-sys-color-border-secondary-darkest-surface: 160, 167, 178;
800
-
801
- --ax-sys-color-success-lightest-surface: 180, 255, 219;
802
- --ax-sys-color-on-success-lightest-surface: 0, 31, 13;
803
- --ax-sys-color-border-success-lightest-surface: 226, 255, 241;
804
-
805
- --ax-sys-color-success-lighter-surface: 115, 255, 191;
806
- --ax-sys-color-on-success-lighter-surface: 0, 31, 11;
807
- --ax-sys-color-border-success-lighter-surface: 161, 255, 212;
808
-
809
- --ax-sys-color-success-light-surface: 99, 244, 178;
810
- --ax-sys-color-on-success-light-surface: 0, 31, 10;
811
- --ax-sys-color-border-success-light-surface: 142, 247, 199;
812
-
813
- --ax-sys-color-success-surface: 63, 216, 151;
814
- --ax-sys-color-on-success-surface: 0, 31, 10;
815
- --ax-sys-color-border-success-surface: 101, 224, 172;
816
-
817
- --ax-sys-color-success-dark-surface: 41, 202, 138;
818
- --ax-sys-color-on-success-dark-surface: 0, 31, 10;
819
- --ax-sys-color-border-success-dark-surface: 71, 218, 159;
820
-
821
- --ax-sys-color-success-darker-surface: 1, 188, 125;
822
- --ax-sys-color-on-success-darker-surface: 0, 31, 10;
823
- --ax-sys-color-border-success-darker-surface: 1, 234, 155;
824
-
825
- --ax-sys-color-success-darkest-surface: 0, 170, 108;
826
- --ax-sys-color-on-success-darkest-surface: 0, 31, 8;
827
- --ax-sys-color-border-success-darkest-surface: 0, 216, 137;
828
-
829
- --ax-sys-color-warning-lightest-surface: 255, 238, 208;
830
- --ax-sys-color-on-warning-lightest-surface: 32, 20, 0;
831
- --ax-sys-color-border-warning-lightest-surface: 255, 255, 254;
832
-
833
- --ax-sys-color-warning-lighter-surface: 255, 224, 181;
834
- --ax-sys-color-on-warning-lighter-surface: 37, 16, 0;
835
- --ax-sys-color-border-warning-lighter-surface: 255, 243, 227;
836
-
837
- --ax-sys-color-warning-light-surface: 255, 210, 152;
838
- --ax-sys-color-on-warning-light-surface: 38, 16, 0;
839
- --ax-sys-color-border-warning-light-surface: 255, 230, 198;
840
-
841
- --ax-sys-color-warning-surface: 255, 180, 82;
842
- --ax-sys-color-on-warning-surface: 39, 15, 0;
843
- --ax-sys-color-border-warning-surface: 255, 200, 128;
844
-
845
- --ax-sys-color-warning-dark-surface: 255, 165, 33;
846
- --ax-sys-color-on-warning-dark-surface: 40, 14, 0;
847
- --ax-sys-color-border-warning-dark-surface: 255, 184, 79;
848
-
849
- --ax-sys-color-warning-darker-surface: 253, 154, 1;
850
- --ax-sys-color-on-warning-darker-surface: 41, 13, 0;
851
- --ax-sys-color-border-warning-darker-surface: 254, 172, 46;
852
-
853
- --ax-sys-color-warning-darkest-surface: 230, 133, 0;
854
- --ax-sys-color-on-warning-darkest-surface: 42, 12, 0;
855
- --ax-sys-color-border-warning-darkest-surface: 255, 156, 21;
856
-
857
- --ax-sys-color-danger-lightest-surface: 255, 230, 233;
858
- --ax-sys-color-on-danger-lightest-surface: 33, 17, 19;
859
- --ax-sys-color-border-danger-lightest-surface: 255, 255, 255;
860
-
861
- --ax-sys-color-danger-lighter-surface: 255, 210, 215;
862
- --ax-sys-color-on-danger-lighter-surface: 41, 10, 16;
863
- --ax-sys-color-border-danger-lighter-surface: 255, 255, 255;
864
-
865
- --ax-sys-color-danger-light-surface: 255, 189, 196;
866
- --ax-sys-color-on-danger-light-surface: 48, 1, 13;
867
- --ax-sys-color-border-danger-light-surface: 255, 235, 237;
868
-
869
- --ax-sys-color-danger-surface: 255, 144, 159;
870
- --ax-sys-color-on-danger-surface: 54, 0, 9;
871
- --ax-sys-color-border-danger-surface: 255, 190, 199;
872
-
873
- --ax-sys-color-danger-dark-surface: 255, 117, 140;
874
- --ax-sys-color-on-danger-dark-surface: 54, 0, 10;
875
- --ax-sys-color-border-danger-dark-surface: 255, 163, 178;
876
-
877
- --ax-sys-color-danger-darker-surface: 255, 99, 126;
878
- --ax-sys-color-on-danger-darker-surface: 54, 0, 9;
879
- --ax-sys-color-border-danger-darker-surface: 255, 145, 164;
880
-
881
- --ax-sys-color-danger-darkest-surface: 234, 80, 109;
882
- --ax-sys-color-on-danger-darkest-surface: 54, 0, 8;
883
- --ax-sys-color-border-danger-darkest-surface: 239, 121, 143;
884
-
885
- --ax-sys-color-accent-lightest-surface: 255, 255, 255;
886
- --ax-sys-color-on-accent-lightest-surface: 22, 22, 22;
887
- --ax-sys-color-border-accent-lightest-surface: 255, 255, 255;
888
-
889
- --ax-sys-color-accent-lighter-surface: 255, 255, 255;
890
- --ax-sys-color-on-accent-lighter-surface: 22, 22, 22;
891
- --ax-sys-color-border-accent-lighter-surface: 255, 255, 255;
892
-
893
- --ax-sys-color-accent-light-surface: 255, 255, 255;
894
- --ax-sys-color-on-accent-light-surface: 22, 22, 22;
895
- --ax-sys-color-border-accent-light-surface: 255, 255, 255;
896
-
897
- --ax-sys-color-accent-surface: 255, 255, 255;
898
- --ax-sys-color-on-accent-surface: 22, 22, 22;
899
- --ax-sys-color-border-accent-surface: 255, 255, 255;
900
-
901
- --ax-sys-color-accent-dark-surface: 255, 255, 255;
902
- --ax-sys-color-on-accent-dark-surface: 22, 22, 22;
903
- --ax-sys-color-border-accent-dark-surface: 255, 255, 255;
904
-
905
- --ax-sys-color-accent-darker-surface: 255, 255, 255;
906
- --ax-sys-color-on-accent-darker-surface: 22, 22, 22;
907
- --ax-sys-color-border-accent-darker-surface: 255, 255, 255;
908
-
909
- --ax-sys-color-accent-darkest-surface: 222, 222, 222;
910
- --ax-sys-color-on-accent-darkest-surface: 22, 22, 22;
911
- --ax-sys-color-border-accent-darkest-surface: 245, 245, 245;
912
-
913
- --ax-sys-color-accent2-lightest-surface: 255, 255, 255;
914
- --ax-sys-color-on-accent2-lightest-surface: 22, 22, 22;
915
- --ax-sys-color-border-accent2-lightest-surface: 255, 255, 255;
916
-
917
- --ax-sys-color-accent2-lighter-surface: 255, 255, 255;
918
- --ax-sys-color-on-accent2-lighter-surface: 22, 22, 22;
919
- --ax-sys-color-border-accent2-lighter-surface: 255, 255, 255;
920
-
921
- --ax-sys-color-accent2-light-surface: 255, 255, 255;
922
- --ax-sys-color-on-accent2-light-surface: 22, 22, 22;
923
- --ax-sys-color-border-accent2-light-surface: 255, 255, 255;
924
-
925
- --ax-sys-color-accent2-surface: 255, 255, 255;
926
- --ax-sys-color-on-accent2-surface: 22, 22, 22;
927
- --ax-sys-color-border-accent2-surface: 255, 255, 255;
928
-
929
- --ax-sys-color-accent2-dark-surface: 255, 255, 255;
930
- --ax-sys-color-on-accent2-dark-surface: 22, 22, 22;
931
- --ax-sys-color-border-accent2-dark-surface: 255, 255, 255;
932
-
933
- --ax-sys-color-accent2-darker-surface: 255, 255, 255;
934
- --ax-sys-color-on-accent2-darker-surface: 22, 22, 22;
935
- --ax-sys-color-border-accent2-darker-surface: 255, 255, 255;
936
-
937
- --ax-sys-color-accent2-darkest-surface: 222, 222, 222;
938
- --ax-sys-color-on-accent2-darkest-surface: 22, 22, 22;
939
- --ax-sys-color-border-accent2-darkest-surface: 245, 245, 245;
940
-
941
- --ax-sys-color-accent3-lightest-surface: 255, 255, 255;
942
- --ax-sys-color-on-accent3-lightest-surface: 22, 22, 22;
943
- --ax-sys-color-border-accent3-lightest-surface: 255, 255, 255;
944
-
945
- --ax-sys-color-accent3-lighter-surface: 255, 255, 255;
946
- --ax-sys-color-on-accent3-lighter-surface: 22, 22, 22;
947
- --ax-sys-color-border-accent3-lighter-surface: 255, 255, 255;
948
-
949
- --ax-sys-color-accent3-light-surface: 255, 255, 255;
950
- --ax-sys-color-on-accent3-light-surface: 22, 22, 22;
951
- --ax-sys-color-border-accent3-light-surface: 255, 255, 255;
952
-
953
- --ax-sys-color-accent3-surface: 255, 255, 255;
954
- --ax-sys-color-on-accent3-surface: 22, 22, 22;
955
- --ax-sys-color-border-accent3-surface: 255, 255, 255;
956
-
957
- --ax-sys-color-accent3-dark-surface: 255, 255, 255;
958
- --ax-sys-color-on-accent3-dark-surface: 22, 22, 22;
959
- --ax-sys-color-border-accent3-dark-surface: 255, 255, 255;
960
-
961
- --ax-sys-color-accent3-darker-surface: 255, 255, 255;
962
- --ax-sys-color-on-accent3-darker-surface: 22, 22, 22;
963
- --ax-sys-color-border-accent3-darker-surface: 255, 255, 255;
964
-
965
- --ax-sys-color-accent3-darkest-surface: 222, 222, 222;
966
- --ax-sys-color-on-accent3-darkest-surface: 22, 22, 22;
967
- --ax-sys-color-border-accent3-darkest-surface: 245, 245, 245;
968
-
969
- --ax-sys-color-accent4-lightest-surface: 255, 255, 255;
970
- --ax-sys-color-on-accent4-lightest-surface: 22, 22, 22;
971
- --ax-sys-color-border-accent4-lightest-surface: 255, 255, 255;
972
-
973
- --ax-sys-color-accent4-lighter-surface: 255, 255, 255;
974
- --ax-sys-color-on-accent4-lighter-surface: 22, 22, 22;
975
- --ax-sys-color-border-accent4-lighter-surface: 255, 255, 255;
976
-
977
- --ax-sys-color-accent4-light-surface: 255, 255, 255;
978
- --ax-sys-color-on-accent4-light-surface: 22, 22, 22;
979
- --ax-sys-color-border-accent4-light-surface: 255, 255, 255;
980
-
981
- --ax-sys-color-accent4-surface: 255, 255, 255;
982
- --ax-sys-color-on-accent4-surface: 22, 22, 22;
983
- --ax-sys-color-border-accent4-surface: 255, 255, 255;
984
-
985
- --ax-sys-color-accent4-dark-surface: 255, 255, 255;
986
- --ax-sys-color-on-accent4-dark-surface: 22, 22, 22;
987
- --ax-sys-color-border-accent4-dark-surface: 255, 255, 255;
988
-
989
- --ax-sys-color-accent4-darker-surface: 255, 255, 255;
990
- --ax-sys-color-on-accent4-darker-surface: 22, 22, 22;
991
- --ax-sys-color-border-accent4-darker-surface: 255, 255, 255;
992
-
993
- --ax-sys-color-accent4-darkest-surface: 222, 222, 222;
994
- --ax-sys-color-on-accent4-darkest-surface: 22, 22, 22;
995
- --ax-sys-color-border-accent4-darkest-surface: 245, 245, 245;
996
-
997
- --ax-sys-color-accent5-lightest-surface: 255, 255, 255;
998
- --ax-sys-color-on-accent5-lightest-surface: 22, 22, 22;
999
- --ax-sys-color-border-accent5-lightest-surface: 255, 255, 255;
1000
-
1001
- --ax-sys-color-accent5-lighter-surface: 255, 255, 255;
1002
- --ax-sys-color-on-accent5-lighter-surface: 22, 22, 22;
1003
- --ax-sys-color-border-accent5-lighter-surface: 255, 255, 255;
1004
-
1005
- --ax-sys-color-accent5-light-surface: 255, 255, 255;
1006
- --ax-sys-color-on-accent5-light-surface: 22, 22, 22;
1007
- --ax-sys-color-border-accent5-light-surface: 255, 255, 255;
1008
-
1009
- --ax-sys-color-accent5-surface: 255, 255, 255;
1010
- --ax-sys-color-on-accent5-surface: 22, 22, 22;
1011
- --ax-sys-color-border-accent5-surface: 255, 255, 255;
1012
-
1013
- --ax-sys-color-accent5-dark-surface: 255, 255, 255;
1014
- --ax-sys-color-on-accent5-dark-surface: 22, 22, 22;
1015
- --ax-sys-color-border-accent5-dark-surface: 255, 255, 255;
1016
-
1017
- --ax-sys-color-accent5-darker-surface: 255, 255, 255;
1018
- --ax-sys-color-on-accent5-darker-surface: 22, 22, 22;
1019
- --ax-sys-color-border-accent5-darker-surface: 255, 255, 255;
1020
-
1021
- --ax-sys-color-accent5-darkest-surface: 222, 222, 222;
1022
- --ax-sys-color-on-accent5-darkest-surface: 22, 22, 22;
1023
- --ax-sys-color-border-accent5-darkest-surface: 245, 245, 245;
1024
-
1025
- --ax-sys-color-accent6-lightest-surface: 255, 255, 255;
1026
- --ax-sys-color-on-accent6-lightest-surface: 22, 22, 22;
1027
- --ax-sys-color-border-accent6-lightest-surface: 255, 255, 255;
1028
-
1029
- --ax-sys-color-accent6-lighter-surface: 255, 255, 255;
1030
- --ax-sys-color-on-accent6-lighter-surface: 22, 22, 22;
1031
- --ax-sys-color-border-accent6-lighter-surface: 255, 255, 255;
1032
-
1033
- --ax-sys-color-accent6-light-surface: 255, 255, 255;
1034
- --ax-sys-color-on-accent6-light-surface: 22, 22, 22;
1035
- --ax-sys-color-border-accent6-light-surface: 255, 255, 255;
1036
-
1037
- --ax-sys-color-accent6-surface: 255, 255, 255;
1038
- --ax-sys-color-on-accent6-surface: 22, 22, 22;
1039
- --ax-sys-color-border-accent6-surface: 255, 255, 255;
1040
-
1041
- --ax-sys-color-accent6-dark-surface: 255, 255, 255;
1042
- --ax-sys-color-on-accent6-dark-surface: 22, 22, 22;
1043
- --ax-sys-color-border-accent6-dark-surface: 255, 255, 255;
1044
-
1045
- --ax-sys-color-accent6-darker-surface: 255, 255, 255;
1046
- --ax-sys-color-on-accent6-darker-surface: 22, 22, 22;
1047
- --ax-sys-color-border-accent6-darker-surface: 255, 255, 255;
1048
-
1049
- --ax-sys-color-accent6-darkest-surface: 222, 222, 222;
1050
- --ax-sys-color-on-accent6-darkest-surface: 22, 22, 22;
1051
- --ax-sys-color-border-accent6-darkest-surface: 245, 245, 245;
1052
-
1053
- --ax-sys-color-accent7-lightest-surface: 255, 255, 255;
1054
- --ax-sys-color-on-accent7-lightest-surface: 22, 22, 22;
1055
- --ax-sys-color-border-accent7-lightest-surface: 255, 255, 255;
1056
-
1057
- --ax-sys-color-accent7-lighter-surface: 255, 255, 255;
1058
- --ax-sys-color-on-accent7-lighter-surface: 22, 22, 22;
1059
- --ax-sys-color-border-accent7-lighter-surface: 255, 255, 255;
1060
-
1061
- --ax-sys-color-accent7-light-surface: 255, 255, 255;
1062
- --ax-sys-color-on-accent7-light-surface: 22, 22, 22;
1063
- --ax-sys-color-border-accent7-light-surface: 255, 255, 255;
1064
-
1065
- --ax-sys-color-accent7-surface: 255, 255, 255;
1066
- --ax-sys-color-on-accent7-surface: 22, 22, 22;
1067
- --ax-sys-color-border-accent7-surface: 255, 255, 255;
1068
-
1069
- --ax-sys-color-accent7-dark-surface: 255, 255, 255;
1070
- --ax-sys-color-on-accent7-dark-surface: 22, 22, 22;
1071
- --ax-sys-color-border-accent7-dark-surface: 255, 255, 255;
1072
-
1073
- --ax-sys-color-accent7-darker-surface: 255, 255, 255;
1074
- --ax-sys-color-on-accent7-darker-surface: 22, 22, 22;
1075
- --ax-sys-color-border-accent7-darker-surface: 255, 255, 255;
1076
-
1077
- --ax-sys-color-accent7-darkest-surface: 222, 222, 222;
1078
- --ax-sys-color-on-accent7-darkest-surface: 22, 22, 22;
1079
- --ax-sys-color-border-accent7-darkest-surface: 245, 245, 245;
1080
-
1081
- }
1082
-
1083
- @theme {
1084
- --color-bg-default: rgba(var(--ax-sys-color-bg-default));
1085
- --color-text-default: rgba(var(--ax-sys-color-text-default));
1086
- --color-border-default: rgba(var(--ax-sys-color-border-default));
1087
- --radius-default: var(--ax-sys-border-radius);
1088
- --breakpoint-3xl: 1920px;
1089
- --breakpoint-4xl: 2560px;
1090
-
1091
- --color-lightest: rgba(var(--ax-sys-color-lightest-surface));
1092
- --color-on-lightest: rgba(var(--ax-sys-color-on-lightest-surface));
1093
- --color-border-lightest: rgba(var(--ax-sys-color-border-lightest-surface));
1094
- --color-lighter: rgba(var(--ax-sys-color-lighter-surface));
1095
- --color-on-lighter: rgba(var(--ax-sys-color-on-lighter-surface));
1096
- --color-border-lighter: rgba(var(--ax-sys-color-border-lighter-surface));
1097
- --color-light: rgba(var(--ax-sys-color-light-surface));
1098
- --color-on-light: rgba(var(--ax-sys-color-on-light-surface));
1099
- --color-border-light: rgba(var(--ax-sys-color-border-light-surface));
1100
- --color-surface: rgba(var(--ax-sys-color-surface));
1101
- --color-on-surface: rgba(var(--ax-sys-color-on-surface));
1102
- --color-border-surface: rgba(var(--ax-sys-color-border-surface));
1103
- --color-dark: rgba(var(--ax-sys-color-dark-surface));
1104
- --color-on-dark: rgba(var(--ax-sys-color-on-dark-surface));
1105
- --color-border-dark: rgba(var(--ax-sys-color-border-dark-surface));
1106
- --color-darker: rgba(var(--ax-sys-color-darker-surface));
1107
- --color-on-darker: rgba(var(--ax-sys-color-on-darker-surface));
1108
- --color-border-darker: rgba(var(--ax-sys-color-border-darker-surface));
1109
- --color-darkest: rgba(var(--ax-sys-color-darkest-surface));
1110
- --color-on-darkest: rgba(var(--ax-sys-color-on-darkest-surface));
1111
- --color-border-darkest: rgba(var(--ax-sys-color-border-darkest-surface));
1112
- /* Primary Surfaces */
1113
- --color-primary-50: rgba(var(--ax-sys-color-primary-50));
1114
- --color-primary-100: rgba(var(--ax-sys-color-primary-100));
1115
- --color-primary-200: rgba(var(--ax-sys-color-primary-200));
1116
- --color-primary-300: rgba(var(--ax-sys-color-primary-300));
1117
- --color-primary-400: rgba(var(--ax-sys-color-primary-400));
1118
- --color-primary-500: rgba(var(--ax-sys-color-primary-500));
1119
- --color-primary-600: rgba(var(--ax-sys-color-primary-600));
1120
- --color-primary-700: rgba(var(--ax-sys-color-primary-700));
1121
- --color-primary-800: rgba(var(--ax-sys-color-primary-800));
1122
- --color-primary-900: rgba(var(--ax-sys-color-primary-900));
1123
- --color-primary-950: rgba(var(--ax-sys-color-primary-950));
1124
-
1125
- --color-primary-lightest: rgba(var(--ax-sys-color-primary-lightest-surface));
1126
- --color-on-primary-lightest: rgba(var(--ax-sys-color-on-primary-lightest-surface));
1127
- --color-border-primary-lightest: rgba(var(--ax-sys-color-border-primary-lightest-surface));
1128
- --color-primary-lighter: rgba(var(--ax-sys-color-primary-lighter-surface));
1129
- --color-on-primary-lighter: rgba(var(--ax-sys-color-on-primary-lighter-surface));
1130
- --color-border-primary-lighter: rgba(var(--ax-sys-color-border-primary-lighter-surface));
1131
- --color-primary-light: rgba(var(--ax-sys-color-primary-light-surface));
1132
- --color-on-primary-light: rgba(var(--ax-sys-color-on-primary-light-surface));
1133
- --color-border-primary-light: rgba(var(--ax-sys-color-border-primary-light-surface));
1134
- --color-primary: rgba(var(--ax-sys-color-primary-surface));
1135
- --color-on-primary: rgba(var(--ax-sys-color-on-primary-surface));
1136
- --color-border-primary: rgba(var(--ax-sys-color-border-primary-surface));
1137
- --color-primary-dark: rgba(var(--ax-sys-color-primary-dark-surface));
1138
- --color-on-primary-dark: rgba(var(--ax-sys-color-on-primary-dark-surface));
1139
- --color-border-primary-dark: rgba(var(--ax-sys-color-border-primary-dark-surface));
1140
- --color-primary-darker: rgba(var(--ax-sys-color-primary-darker-surface));
1141
- --color-on-primary-darker: rgba(var(--ax-sys-color-on-primary-darker-surface));
1142
- --color-border-primary-darker: rgba(var(--ax-sys-color-border-primary-darker-surface));
1143
- --color-primary-darkest: rgba(var(--ax-sys-color-primary-darkest-surface));
1144
- --color-on-primary-darkest: rgba(var(--ax-sys-color-on-primary-darkest-surface));
1145
- --color-border-primary-darkest: rgba(var(--ax-sys-color-border-primary-darkest-surface));
1146
- /* Secondary Surfaces */
1147
- --color-secondary-50: rgba(var(--ax-sys-color-secondary-50));
1148
- --color-secondary-100: rgba(var(--ax-sys-color-secondary-100));
1149
- --color-secondary-200: rgba(var(--ax-sys-color-secondary-200));
1150
- --color-secondary-300: rgba(var(--ax-sys-color-secondary-300));
1151
- --color-secondary-400: rgba(var(--ax-sys-color-secondary-400));
1152
- --color-secondary-500: rgba(var(--ax-sys-color-secondary-500));
1153
- --color-secondary-600: rgba(var(--ax-sys-color-secondary-600));
1154
- --color-secondary-700: rgba(var(--ax-sys-color-secondary-700));
1155
- --color-secondary-800: rgba(var(--ax-sys-color-secondary-800));
1156
- --color-secondary-900: rgba(var(--ax-sys-color-secondary-900));
1157
- --color-secondary-950: rgba(var(--ax-sys-color-secondary-950));
1158
-
1159
- --color-secondary-lightest: rgba(var(--ax-sys-color-secondary-lightest-surface));
1160
- --color-on-secondary-lightest: rgba(var(--ax-sys-color-on-secondary-lightest-surface));
1161
- --color-border-secondary-lightest: rgba(var(--ax-sys-color-border-secondary-lightest-surface));
1162
- --color-secondary-lighter: rgba(var(--ax-sys-color-secondary-lighter-surface));
1163
- --color-on-secondary-lighter: rgba(var(--ax-sys-color-on-secondary-lighter-surface));
1164
- --color-border-secondary-lighter: rgba(var(--ax-sys-color-border-secondary-lighter-surface));
1165
- --color-secondary-light: rgba(var(--ax-sys-color-secondary-light-surface));
1166
- --color-on-secondary-light: rgba(var(--ax-sys-color-on-secondary-light-surface));
1167
- --color-border-secondary-light: rgba(var(--ax-sys-color-border-secondary-light-surface));
1168
- --color-secondary: rgba(var(--ax-sys-color-secondary-surface));
1169
- --color-on-secondary: rgba(var(--ax-sys-color-on-secondary-surface));
1170
- --color-border-secondary: rgba(var(--ax-sys-color-border-secondary-surface));
1171
- --color-secondary-dark: rgba(var(--ax-sys-color-secondary-dark-surface));
1172
- --color-on-secondary-dark: rgba(var(--ax-sys-color-on-secondary-dark-surface));
1173
- --color-border-secondary-dark: rgba(var(--ax-sys-color-border-secondary-dark-surface));
1174
- --color-secondary-darker: rgba(var(--ax-sys-color-secondary-darker-surface));
1175
- --color-on-secondary-darker: rgba(var(--ax-sys-color-on-secondary-darker-surface));
1176
- --color-border-secondary-darker: rgba(var(--ax-sys-color-border-secondary-darker-surface));
1177
- --color-secondary-darkest: rgba(var(--ax-sys-color-secondary-darkest-surface));
1178
- --color-on-secondary-darkest: rgba(var(--ax-sys-color-on-secondary-darkest-surface));
1179
- --color-border-secondary-darkest: rgba(var(--ax-sys-color-border-secondary-darkest-surface));
1180
- /* Success Surfaces */
1181
- --color-success-50: rgba(var(--ax-sys-color-success-50));
1182
- --color-success-100: rgba(var(--ax-sys-color-success-100));
1183
- --color-success-200: rgba(var(--ax-sys-color-success-200));
1184
- --color-success-300: rgba(var(--ax-sys-color-success-300));
1185
- --color-success-400: rgba(var(--ax-sys-color-success-400));
1186
- --color-success-500: rgba(var(--ax-sys-color-success-500));
1187
- --color-success-600: rgba(var(--ax-sys-color-success-600));
1188
- --color-success-700: rgba(var(--ax-sys-color-success-700));
1189
- --color-success-800: rgba(var(--ax-sys-color-success-800));
1190
- --color-success-900: rgba(var(--ax-sys-color-success-900));
1191
- --color-success-950: rgba(var(--ax-sys-color-success-950));
1192
-
1193
- --color-success-lightest: rgba(var(--ax-sys-color-success-lightest-surface));
1194
- --color-on-success-lightest: rgba(var(--ax-sys-color-on-success-lightest-surface));
1195
- --color-border-success-lightest: rgba(var(--ax-sys-color-border-success-lightest-surface));
1196
- --color-success-lighter: rgba(var(--ax-sys-color-success-lighter-surface));
1197
- --color-on-success-lighter: rgba(var(--ax-sys-color-on-success-lighter-surface));
1198
- --color-border-success-lighter: rgba(var(--ax-sys-color-border-success-lighter-surface));
1199
- --color-success-light: rgba(var(--ax-sys-color-success-light-surface));
1200
- --color-on-success-light: rgba(var(--ax-sys-color-on-success-light-surface));
1201
- --color-border-success-light: rgba(var(--ax-sys-color-border-success-light-surface));
1202
- --color-success: rgba(var(--ax-sys-color-success-surface));
1203
- --color-on-success: rgba(var(--ax-sys-color-on-success-surface));
1204
- --color-border-success: rgba(var(--ax-sys-color-border-success-surface));
1205
- --color-success-dark: rgba(var(--ax-sys-color-success-dark-surface));
1206
- --color-on-success-dark: rgba(var(--ax-sys-color-on-success-dark-surface));
1207
- --color-border-success-dark: rgba(var(--ax-sys-color-border-success-dark-surface));
1208
- --color-success-darker: rgba(var(--ax-sys-color-success-darker-surface));
1209
- --color-on-success-darker: rgba(var(--ax-sys-color-on-success-darker-surface));
1210
- --color-border-success-darker: rgba(var(--ax-sys-color-border-success-darker-surface));
1211
- --color-success-darkest: rgba(var(--ax-sys-color-success-darkest-surface));
1212
- --color-on-success-darkest: rgba(var(--ax-sys-color-on-success-darkest-surface));
1213
- --color-border-success-darkest: rgba(var(--ax-sys-color-border-success-darkest-surface));
1214
- /* Warning Surfaces */
1215
- --color-warning-50: rgba(var(--ax-sys-color-warning-50));
1216
- --color-warning-100: rgba(var(--ax-sys-color-warning-100));
1217
- --color-warning-200: rgba(var(--ax-sys-color-warning-200));
1218
- --color-warning-300: rgba(var(--ax-sys-color-warning-300));
1219
- --color-warning-400: rgba(var(--ax-sys-color-warning-400));
1220
- --color-warning-500: rgba(var(--ax-sys-color-warning-500));
1221
- --color-warning-600: rgba(var(--ax-sys-color-warning-600));
1222
- --color-warning-700: rgba(var(--ax-sys-color-warning-700));
1223
- --color-warning-800: rgba(var(--ax-sys-color-warning-800));
1224
- --color-warning-900: rgba(var(--ax-sys-color-warning-900));
1225
- --color-warning-950: rgba(var(--ax-sys-color-warning-950));
1226
-
1227
- --color-warning-lightest: rgba(var(--ax-sys-color-warning-lightest-surface));
1228
- --color-on-warning-lightest: rgba(var(--ax-sys-color-on-warning-lightest-surface));
1229
- --color-border-warning-lightest: rgba(var(--ax-sys-color-border-warning-lightest-surface));
1230
- --color-warning-lighter: rgba(var(--ax-sys-color-warning-lighter-surface));
1231
- --color-on-warning-lighter: rgba(var(--ax-sys-color-on-warning-lighter-surface));
1232
- --color-border-warning-lighter: rgba(var(--ax-sys-color-border-warning-lighter-surface));
1233
- --color-warning-light: rgba(var(--ax-sys-color-warning-light-surface));
1234
- --color-on-warning-light: rgba(var(--ax-sys-color-on-warning-light-surface));
1235
- --color-border-warning-light: rgba(var(--ax-sys-color-border-warning-light-surface));
1236
- --color-warning: rgba(var(--ax-sys-color-warning-surface));
1237
- --color-on-warning: rgba(var(--ax-sys-color-on-warning-surface));
1238
- --color-border-warning: rgba(var(--ax-sys-color-border-warning-surface));
1239
- --color-warning-dark: rgba(var(--ax-sys-color-warning-dark-surface));
1240
- --color-on-warning-dark: rgba(var(--ax-sys-color-on-warning-dark-surface));
1241
- --color-border-warning-dark: rgba(var(--ax-sys-color-border-warning-dark-surface));
1242
- --color-warning-darker: rgba(var(--ax-sys-color-warning-darker-surface));
1243
- --color-on-warning-darker: rgba(var(--ax-sys-color-on-warning-darker-surface));
1244
- --color-border-warning-darker: rgba(var(--ax-sys-color-border-warning-darker-surface));
1245
- --color-warning-darkest: rgba(var(--ax-sys-color-warning-darkest-surface));
1246
- --color-on-warning-darkest: rgba(var(--ax-sys-color-on-warning-darkest-surface));
1247
- --color-border-warning-darkest: rgba(var(--ax-sys-color-border-warning-darkest-surface));
1248
- /* Danger Surfaces */
1249
- --color-danger-50: rgba(var(--ax-sys-color-danger-50));
1250
- --color-danger-100: rgba(var(--ax-sys-color-danger-100));
1251
- --color-danger-200: rgba(var(--ax-sys-color-danger-200));
1252
- --color-danger-300: rgba(var(--ax-sys-color-danger-300));
1253
- --color-danger-400: rgba(var(--ax-sys-color-danger-400));
1254
- --color-danger-500: rgba(var(--ax-sys-color-danger-500));
1255
- --color-danger-600: rgba(var(--ax-sys-color-danger-600));
1256
- --color-danger-700: rgba(var(--ax-sys-color-danger-700));
1257
- --color-danger-800: rgba(var(--ax-sys-color-danger-800));
1258
- --color-danger-900: rgba(var(--ax-sys-color-danger-900));
1259
- --color-danger-950: rgba(var(--ax-sys-color-danger-950));
1260
-
1261
- --color-danger-lightest: rgba(var(--ax-sys-color-danger-lightest-surface));
1262
- --color-on-danger-lightest: rgba(var(--ax-sys-color-on-danger-lightest-surface));
1263
- --color-border-danger-lightest: rgba(var(--ax-sys-color-border-danger-lightest-surface));
1264
- --color-danger-lighter: rgba(var(--ax-sys-color-danger-lighter-surface));
1265
- --color-on-danger-lighter: rgba(var(--ax-sys-color-on-danger-lighter-surface));
1266
- --color-border-danger-lighter: rgba(var(--ax-sys-color-border-danger-lighter-surface));
1267
- --color-danger-light: rgba(var(--ax-sys-color-danger-light-surface));
1268
- --color-on-danger-light: rgba(var(--ax-sys-color-on-danger-light-surface));
1269
- --color-border-danger-light: rgba(var(--ax-sys-color-border-danger-light-surface));
1270
- --color-danger: rgba(var(--ax-sys-color-danger-surface));
1271
- --color-on-danger: rgba(var(--ax-sys-color-on-danger-surface));
1272
- --color-border-danger: rgba(var(--ax-sys-color-border-danger-surface));
1273
- --color-danger-dark: rgba(var(--ax-sys-color-danger-dark-surface));
1274
- --color-on-danger-dark: rgba(var(--ax-sys-color-on-danger-dark-surface));
1275
- --color-border-danger-dark: rgba(var(--ax-sys-color-border-danger-dark-surface));
1276
- --color-danger-darker: rgba(var(--ax-sys-color-danger-darker-surface));
1277
- --color-on-danger-darker: rgba(var(--ax-sys-color-on-danger-darker-surface));
1278
- --color-border-danger-darker: rgba(var(--ax-sys-color-border-danger-darker-surface));
1279
- --color-danger-darkest: rgba(var(--ax-sys-color-danger-darkest-surface));
1280
- --color-on-danger-darkest: rgba(var(--ax-sys-color-on-danger-darkest-surface));
1281
- --color-border-danger-darkest: rgba(var(--ax-sys-color-border-danger-darkest-surface));
1282
- /* Accent Surfaces */
1283
- --color-accent-50: rgba(var(--ax-sys-color-accent-50));
1284
- --color-accent-100: rgba(var(--ax-sys-color-accent-100));
1285
- --color-accent-200: rgba(var(--ax-sys-color-accent-200));
1286
- --color-accent-300: rgba(var(--ax-sys-color-accent-300));
1287
- --color-accent-400: rgba(var(--ax-sys-color-accent-400));
1288
- --color-accent-500: rgba(var(--ax-sys-color-accent-500));
1289
- --color-accent-600: rgba(var(--ax-sys-color-accent-600));
1290
- --color-accent-700: rgba(var(--ax-sys-color-accent-700));
1291
- --color-accent-800: rgba(var(--ax-sys-color-accent-800));
1292
- --color-accent-900: rgba(var(--ax-sys-color-accent-900));
1293
- --color-accent-950: rgba(var(--ax-sys-color-accent-950));
1294
-
1295
- --color-accent-lightest: rgba(var(--ax-sys-color-accent-lightest-surface));
1296
- --color-on-accent-lightest: rgba(var(--ax-sys-color-on-accent-lightest-surface));
1297
- --color-border-accent-lightest: rgba(var(--ax-sys-color-border-accent-lightest-surface));
1298
- --color-accent-lighter: rgba(var(--ax-sys-color-accent-lighter-surface));
1299
- --color-on-accent-lighter: rgba(var(--ax-sys-color-on-accent-lighter-surface));
1300
- --color-border-accent-lighter: rgba(var(--ax-sys-color-border-accent-lighter-surface));
1301
- --color-accent-light: rgba(var(--ax-sys-color-accent-light-surface));
1302
- --color-on-accent-light: rgba(var(--ax-sys-color-on-accent-light-surface));
1303
- --color-border-accent-light: rgba(var(--ax-sys-color-border-accent-light-surface));
1304
- --color-accent: rgba(var(--ax-sys-color-accent-surface));
1305
- --color-on-accent: rgba(var(--ax-sys-color-on-accent-surface));
1306
- --color-border-accent: rgba(var(--ax-sys-color-border-accent-surface));
1307
- --color-accent-dark: rgba(var(--ax-sys-color-accent-dark-surface));
1308
- --color-on-accent-dark: rgba(var(--ax-sys-color-on-accent-dark-surface));
1309
- --color-border-accent-dark: rgba(var(--ax-sys-color-border-accent-dark-surface));
1310
- --color-accent-darker: rgba(var(--ax-sys-color-accent-darker-surface));
1311
- --color-on-accent-darker: rgba(var(--ax-sys-color-on-accent-darker-surface));
1312
- --color-border-accent-darker: rgba(var(--ax-sys-color-border-accent-darker-surface));
1313
- --color-accent-darkest: rgba(var(--ax-sys-color-accent-darkest-surface));
1314
- --color-on-accent-darkest: rgba(var(--ax-sys-color-on-accent-darkest-surface));
1315
- --color-border-accent-darkest: rgba(var(--ax-sys-color-border-accent-darkest-surface));
1316
- /* Accent2 Surfaces */
1317
- --color-accent2-50: rgba(var(--ax-sys-color-accent2-50));
1318
- --color-accent2-100: rgba(var(--ax-sys-color-accent2-100));
1319
- --color-accent2-200: rgba(var(--ax-sys-color-accent2-200));
1320
- --color-accent2-300: rgba(var(--ax-sys-color-accent2-300));
1321
- --color-accent2-400: rgba(var(--ax-sys-color-accent2-400));
1322
- --color-accent2-500: rgba(var(--ax-sys-color-accent2-500));
1323
- --color-accent2-600: rgba(var(--ax-sys-color-accent2-600));
1324
- --color-accent2-700: rgba(var(--ax-sys-color-accent2-700));
1325
- --color-accent2-800: rgba(var(--ax-sys-color-accent2-800));
1326
- --color-accent2-900: rgba(var(--ax-sys-color-accent2-900));
1327
- --color-accent2-950: rgba(var(--ax-sys-color-accent2-950));
1328
-
1329
- --color-accent2-lightest: rgba(var(--ax-sys-color-accent2-lightest-surface));
1330
- --color-on-accent2-lightest: rgba(var(--ax-sys-color-on-accent2-lightest-surface));
1331
- --color-border-accent2-lightest: rgba(var(--ax-sys-color-border-accent2-lightest-surface));
1332
- --color-accent2-lighter: rgba(var(--ax-sys-color-accent2-lighter-surface));
1333
- --color-on-accent2-lighter: rgba(var(--ax-sys-color-on-accent2-lighter-surface));
1334
- --color-border-accent2-lighter: rgba(var(--ax-sys-color-border-accent2-lighter-surface));
1335
- --color-accent2-light: rgba(var(--ax-sys-color-accent2-light-surface));
1336
- --color-on-accent2-light: rgba(var(--ax-sys-color-on-accent2-light-surface));
1337
- --color-border-accent2-light: rgba(var(--ax-sys-color-border-accent2-light-surface));
1338
- --color-accent2: rgba(var(--ax-sys-color-accent2-surface));
1339
- --color-on-accent2: rgba(var(--ax-sys-color-on-accent2-surface));
1340
- --color-border-accent2: rgba(var(--ax-sys-color-border-accent2-surface));
1341
- --color-accent2-dark: rgba(var(--ax-sys-color-accent2-dark-surface));
1342
- --color-on-accent2-dark: rgba(var(--ax-sys-color-on-accent2-dark-surface));
1343
- --color-border-accent2-dark: rgba(var(--ax-sys-color-border-accent2-dark-surface));
1344
- --color-accent2-darker: rgba(var(--ax-sys-color-accent2-darker-surface));
1345
- --color-on-accent2-darker: rgba(var(--ax-sys-color-on-accent2-darker-surface));
1346
- --color-border-accent2-darker: rgba(var(--ax-sys-color-border-accent2-darker-surface));
1347
- --color-accent2-darkest: rgba(var(--ax-sys-color-accent2-darkest-surface));
1348
- --color-on-accent2-darkest: rgba(var(--ax-sys-color-on-accent2-darkest-surface));
1349
- --color-border-accent2-darkest: rgba(var(--ax-sys-color-border-accent2-darkest-surface));
1350
- /* Accent3 Surfaces */
1351
- --color-accent3-50: rgba(var(--ax-sys-color-accent3-50));
1352
- --color-accent3-100: rgba(var(--ax-sys-color-accent3-100));
1353
- --color-accent3-200: rgba(var(--ax-sys-color-accent3-200));
1354
- --color-accent3-300: rgba(var(--ax-sys-color-accent3-300));
1355
- --color-accent3-400: rgba(var(--ax-sys-color-accent3-400));
1356
- --color-accent3-500: rgba(var(--ax-sys-color-accent3-500));
1357
- --color-accent3-600: rgba(var(--ax-sys-color-accent3-600));
1358
- --color-accent3-700: rgba(var(--ax-sys-color-accent3-700));
1359
- --color-accent3-800: rgba(var(--ax-sys-color-accent3-800));
1360
- --color-accent3-900: rgba(var(--ax-sys-color-accent3-900));
1361
- --color-accent3-950: rgba(var(--ax-sys-color-accent3-950));
1362
-
1363
- --color-accent3-lightest: rgba(var(--ax-sys-color-accent3-lightest-surface));
1364
- --color-on-accent3-lightest: rgba(var(--ax-sys-color-on-accent3-lightest-surface));
1365
- --color-border-accent3-lightest: rgba(var(--ax-sys-color-border-accent3-lightest-surface));
1366
- --color-accent3-lighter: rgba(var(--ax-sys-color-accent3-lighter-surface));
1367
- --color-on-accent3-lighter: rgba(var(--ax-sys-color-on-accent3-lighter-surface));
1368
- --color-border-accent3-lighter: rgba(var(--ax-sys-color-border-accent3-lighter-surface));
1369
- --color-accent3-light: rgba(var(--ax-sys-color-accent3-light-surface));
1370
- --color-on-accent3-light: rgba(var(--ax-sys-color-on-accent3-light-surface));
1371
- --color-border-accent3-light: rgba(var(--ax-sys-color-border-accent3-light-surface));
1372
- --color-accent3: rgba(var(--ax-sys-color-accent3-surface));
1373
- --color-on-accent3: rgba(var(--ax-sys-color-on-accent3-surface));
1374
- --color-border-accent3: rgba(var(--ax-sys-color-border-accent3-surface));
1375
- --color-accent3-dark: rgba(var(--ax-sys-color-accent3-dark-surface));
1376
- --color-on-accent3-dark: rgba(var(--ax-sys-color-on-accent3-dark-surface));
1377
- --color-border-accent3-dark: rgba(var(--ax-sys-color-border-accent3-dark-surface));
1378
- --color-accent3-darker: rgba(var(--ax-sys-color-accent3-darker-surface));
1379
- --color-on-accent3-darker: rgba(var(--ax-sys-color-on-accent3-darker-surface));
1380
- --color-border-accent3-darker: rgba(var(--ax-sys-color-border-accent3-darker-surface));
1381
- --color-accent3-darkest: rgba(var(--ax-sys-color-accent3-darkest-surface));
1382
- --color-on-accent3-darkest: rgba(var(--ax-sys-color-on-accent3-darkest-surface));
1383
- --color-border-accent3-darkest: rgba(var(--ax-sys-color-border-accent3-darkest-surface));
1384
- /* Accent4 Surfaces */
1385
- --color-accent4-50: rgba(var(--ax-sys-color-accent4-50));
1386
- --color-accent4-100: rgba(var(--ax-sys-color-accent4-100));
1387
- --color-accent4-200: rgba(var(--ax-sys-color-accent4-200));
1388
- --color-accent4-300: rgba(var(--ax-sys-color-accent4-300));
1389
- --color-accent4-400: rgba(var(--ax-sys-color-accent4-400));
1390
- --color-accent4-500: rgba(var(--ax-sys-color-accent4-500));
1391
- --color-accent4-600: rgba(var(--ax-sys-color-accent4-600));
1392
- --color-accent4-700: rgba(var(--ax-sys-color-accent4-700));
1393
- --color-accent4-800: rgba(var(--ax-sys-color-accent4-800));
1394
- --color-accent4-900: rgba(var(--ax-sys-color-accent4-900));
1395
- --color-accent4-950: rgba(var(--ax-sys-color-accent4-950));
1396
-
1397
- --color-accent4-lightest: rgba(var(--ax-sys-color-accent4-lightest-surface));
1398
- --color-on-accent4-lightest: rgba(var(--ax-sys-color-on-accent4-lightest-surface));
1399
- --color-border-accent4-lightest: rgba(var(--ax-sys-color-border-accent4-lightest-surface));
1400
- --color-accent4-lighter: rgba(var(--ax-sys-color-accent4-lighter-surface));
1401
- --color-on-accent4-lighter: rgba(var(--ax-sys-color-on-accent4-lighter-surface));
1402
- --color-border-accent4-lighter: rgba(var(--ax-sys-color-border-accent4-lighter-surface));
1403
- --color-accent4-light: rgba(var(--ax-sys-color-accent4-light-surface));
1404
- --color-on-accent4-light: rgba(var(--ax-sys-color-on-accent4-light-surface));
1405
- --color-border-accent4-light: rgba(var(--ax-sys-color-border-accent4-light-surface));
1406
- --color-accent4: rgba(var(--ax-sys-color-accent4-surface));
1407
- --color-on-accent4: rgba(var(--ax-sys-color-on-accent4-surface));
1408
- --color-border-accent4: rgba(var(--ax-sys-color-border-accent4-surface));
1409
- --color-accent4-dark: rgba(var(--ax-sys-color-accent4-dark-surface));
1410
- --color-on-accent4-dark: rgba(var(--ax-sys-color-on-accent4-dark-surface));
1411
- --color-border-accent4-dark: rgba(var(--ax-sys-color-border-accent4-dark-surface));
1412
- --color-accent4-darker: rgba(var(--ax-sys-color-accent4-darker-surface));
1413
- --color-on-accent4-darker: rgba(var(--ax-sys-color-on-accent4-darker-surface));
1414
- --color-border-accent4-darker: rgba(var(--ax-sys-color-border-accent4-darker-surface));
1415
- --color-accent4-darkest: rgba(var(--ax-sys-color-accent4-darkest-surface));
1416
- --color-on-accent4-darkest: rgba(var(--ax-sys-color-on-accent4-darkest-surface));
1417
- --color-border-accent4-darkest: rgba(var(--ax-sys-color-border-accent4-darkest-surface));
1418
- /* Accent5 Surfaces */
1419
- --color-accent5-50: rgba(var(--ax-sys-color-accent5-50));
1420
- --color-accent5-100: rgba(var(--ax-sys-color-accent5-100));
1421
- --color-accent5-200: rgba(var(--ax-sys-color-accent5-200));
1422
- --color-accent5-300: rgba(var(--ax-sys-color-accent5-300));
1423
- --color-accent5-400: rgba(var(--ax-sys-color-accent5-400));
1424
- --color-accent5-500: rgba(var(--ax-sys-color-accent5-500));
1425
- --color-accent5-600: rgba(var(--ax-sys-color-accent5-600));
1426
- --color-accent5-700: rgba(var(--ax-sys-color-accent5-700));
1427
- --color-accent5-800: rgba(var(--ax-sys-color-accent5-800));
1428
- --color-accent5-900: rgba(var(--ax-sys-color-accent5-900));
1429
- --color-accent5-950: rgba(var(--ax-sys-color-accent5-950));
1430
-
1431
- --color-accent5-lightest: rgba(var(--ax-sys-color-accent5-lightest-surface));
1432
- --color-on-accent5-lightest: rgba(var(--ax-sys-color-on-accent5-lightest-surface));
1433
- --color-border-accent5-lightest: rgba(var(--ax-sys-color-border-accent5-lightest-surface));
1434
- --color-accent5-lighter: rgba(var(--ax-sys-color-accent5-lighter-surface));
1435
- --color-on-accent5-lighter: rgba(var(--ax-sys-color-on-accent5-lighter-surface));
1436
- --color-border-accent5-lighter: rgba(var(--ax-sys-color-border-accent5-lighter-surface));
1437
- --color-accent5-light: rgba(var(--ax-sys-color-accent5-light-surface));
1438
- --color-on-accent5-light: rgba(var(--ax-sys-color-on-accent5-light-surface));
1439
- --color-border-accent5-light: rgba(var(--ax-sys-color-border-accent5-light-surface));
1440
- --color-accent5: rgba(var(--ax-sys-color-accent5-surface));
1441
- --color-on-accent5: rgba(var(--ax-sys-color-on-accent5-surface));
1442
- --color-border-accent5: rgba(var(--ax-sys-color-border-accent5-surface));
1443
- --color-accent5-dark: rgba(var(--ax-sys-color-accent5-dark-surface));
1444
- --color-on-accent5-dark: rgba(var(--ax-sys-color-on-accent5-dark-surface));
1445
- --color-border-accent5-dark: rgba(var(--ax-sys-color-border-accent5-dark-surface));
1446
- --color-accent5-darker: rgba(var(--ax-sys-color-accent5-darker-surface));
1447
- --color-on-accent5-darker: rgba(var(--ax-sys-color-on-accent5-darker-surface));
1448
- --color-border-accent5-darker: rgba(var(--ax-sys-color-border-accent5-darker-surface));
1449
- --color-accent5-darkest: rgba(var(--ax-sys-color-accent5-darkest-surface));
1450
- --color-on-accent5-darkest: rgba(var(--ax-sys-color-on-accent5-darkest-surface));
1451
- --color-border-accent5-darkest: rgba(var(--ax-sys-color-border-accent5-darkest-surface));
1452
- /* Accent6 Surfaces */
1453
- --color-accent6-50: rgba(var(--ax-sys-color-accent6-50));
1454
- --color-accent6-100: rgba(var(--ax-sys-color-accent6-100));
1455
- --color-accent6-200: rgba(var(--ax-sys-color-accent6-200));
1456
- --color-accent6-300: rgba(var(--ax-sys-color-accent6-300));
1457
- --color-accent6-400: rgba(var(--ax-sys-color-accent6-400));
1458
- --color-accent6-500: rgba(var(--ax-sys-color-accent6-500));
1459
- --color-accent6-600: rgba(var(--ax-sys-color-accent6-600));
1460
- --color-accent6-700: rgba(var(--ax-sys-color-accent6-700));
1461
- --color-accent6-800: rgba(var(--ax-sys-color-accent6-800));
1462
- --color-accent6-900: rgba(var(--ax-sys-color-accent6-900));
1463
- --color-accent6-950: rgba(var(--ax-sys-color-accent6-950));
1464
-
1465
- --color-accent6-lightest: rgba(var(--ax-sys-color-accent6-lightest-surface));
1466
- --color-on-accent6-lightest: rgba(var(--ax-sys-color-on-accent6-lightest-surface));
1467
- --color-border-accent6-lightest: rgba(var(--ax-sys-color-border-accent6-lightest-surface));
1468
- --color-accent6-lighter: rgba(var(--ax-sys-color-accent6-lighter-surface));
1469
- --color-on-accent6-lighter: rgba(var(--ax-sys-color-on-accent6-lighter-surface));
1470
- --color-border-accent6-lighter: rgba(var(--ax-sys-color-border-accent6-lighter-surface));
1471
- --color-accent6-light: rgba(var(--ax-sys-color-accent6-light-surface));
1472
- --color-on-accent6-light: rgba(var(--ax-sys-color-on-accent6-light-surface));
1473
- --color-border-accent6-light: rgba(var(--ax-sys-color-border-accent6-light-surface));
1474
- --color-accent6: rgba(var(--ax-sys-color-accent6-surface));
1475
- --color-on-accent6: rgba(var(--ax-sys-color-on-accent6-surface));
1476
- --color-border-accent6: rgba(var(--ax-sys-color-border-accent6-surface));
1477
- --color-accent6-dark: rgba(var(--ax-sys-color-accent6-dark-surface));
1478
- --color-on-accent6-dark: rgba(var(--ax-sys-color-on-accent6-dark-surface));
1479
- --color-border-accent6-dark: rgba(var(--ax-sys-color-border-accent6-dark-surface));
1480
- --color-accent6-darker: rgba(var(--ax-sys-color-accent6-darker-surface));
1481
- --color-on-accent6-darker: rgba(var(--ax-sys-color-on-accent6-darker-surface));
1482
- --color-border-accent6-darker: rgba(var(--ax-sys-color-border-accent6-darker-surface));
1483
- --color-accent6-darkest: rgba(var(--ax-sys-color-accent6-darkest-surface));
1484
- --color-on-accent6-darkest: rgba(var(--ax-sys-color-on-accent6-darkest-surface));
1485
- --color-border-accent6-darkest: rgba(var(--ax-sys-color-border-accent6-darkest-surface));
1486
- /* Accent7 Surfaces */
1487
- --color-accent7-50: rgba(var(--ax-sys-color-accent7-50));
1488
- --color-accent7-100: rgba(var(--ax-sys-color-accent7-100));
1489
- --color-accent7-200: rgba(var(--ax-sys-color-accent7-200));
1490
- --color-accent7-300: rgba(var(--ax-sys-color-accent7-300));
1491
- --color-accent7-400: rgba(var(--ax-sys-color-accent7-400));
1492
- --color-accent7-500: rgba(var(--ax-sys-color-accent7-500));
1493
- --color-accent7-600: rgba(var(--ax-sys-color-accent7-600));
1494
- --color-accent7-700: rgba(var(--ax-sys-color-accent7-700));
1495
- --color-accent7-800: rgba(var(--ax-sys-color-accent7-800));
1496
- --color-accent7-900: rgba(var(--ax-sys-color-accent7-900));
1497
- --color-accent7-950: rgba(var(--ax-sys-color-accent7-950));
1498
-
1499
- --color-accent7-lightest: rgba(var(--ax-sys-color-accent7-lightest-surface));
1500
- --color-on-accent7-lightest: rgba(var(--ax-sys-color-on-accent7-lightest-surface));
1501
- --color-border-accent7-lightest: rgba(var(--ax-sys-color-border-accent7-lightest-surface));
1502
- --color-accent7-lighter: rgba(var(--ax-sys-color-accent7-lighter-surface));
1503
- --color-on-accent7-lighter: rgba(var(--ax-sys-color-on-accent7-lighter-surface));
1504
- --color-border-accent7-lighter: rgba(var(--ax-sys-color-border-accent7-lighter-surface));
1505
- --color-accent7-light: rgba(var(--ax-sys-color-accent7-light-surface));
1506
- --color-on-accent7-light: rgba(var(--ax-sys-color-on-accent7-light-surface));
1507
- --color-border-accent7-light: rgba(var(--ax-sys-color-border-accent7-light-surface));
1508
- --color-accent7: rgba(var(--ax-sys-color-accent7-surface));
1509
- --color-on-accent7: rgba(var(--ax-sys-color-on-accent7-surface));
1510
- --color-border-accent7: rgba(var(--ax-sys-color-border-accent7-surface));
1511
- --color-accent7-dark: rgba(var(--ax-sys-color-accent7-dark-surface));
1512
- --color-on-accent7-dark: rgba(var(--ax-sys-color-on-accent7-dark-surface));
1513
- --color-border-accent7-dark: rgba(var(--ax-sys-color-border-accent7-dark-surface));
1514
- --color-accent7-darker: rgba(var(--ax-sys-color-accent7-darker-surface));
1515
- --color-on-accent7-darker: rgba(var(--ax-sys-color-on-accent7-darker-surface));
1516
- --color-border-accent7-darker: rgba(var(--ax-sys-color-border-accent7-darker-surface));
1517
- --color-accent7-darkest: rgba(var(--ax-sys-color-accent7-darkest-surface));
1518
- --color-on-accent7-darkest: rgba(var(--ax-sys-color-on-accent7-darkest-surface));
1519
- --color-border-accent7-darkest: rgba(var(--ax-sys-color-border-accent7-darkest-surface));
1520
- }
1521
-
1522
- @utility lightest-surface {
1523
- background-color: var(--color-lightest);
1524
- color: var(--color-on-lightest);
1525
- border-color: var(--color-border-lightest);
1526
- }
1527
-
1528
- @utility lighter-surface {
1529
- background-color: var(--color-lighter);
1530
- color: var(--color-on-lighter);
1531
- border-color: var(--color-border-lighter);
1532
- }
1533
-
1534
- @utility light-surface {
1535
- background-color: var(--color-light);
1536
- color: var(--color-on-light);
1537
- border-color: var(--color-border-light);
1538
- }
1539
-
1540
- @utility surface {
1541
- background-color: var(--color-surface);
1542
- color: var(--color-on-surface);
1543
- border-color: var(--color-border-surface);
1544
- }
1545
-
1546
- @utility dark-surface {
1547
- background-color: var(--color-dark);
1548
- color: var(--color-on-dark);
1549
- border-color: var(--color-border-dark);
1550
- }
1551
-
1552
- @utility darker-surface {
1553
- background-color: var(--color-darker);
1554
- color: var(--color-on-darker);
1555
- border-color: var(--color-border-darker);
1556
- }
1557
-
1558
- @utility darkest-surface {
1559
- background-color: var(--color-darkest);
1560
- color: var(--color-on-darkest);
1561
- border-color: var(--color-border-darkest);
1562
- }
1563
-
1564
- @utility border-lightest-surface {
1565
- border-color: var(--color-border-lightest);
1566
- }
1567
-
1568
- @utility border-lighter-surface {
1569
- border-color: var(--color-border-lighter);
1570
- }
1571
-
1572
- @utility border-light-surface {
1573
- border-color: var(--color-border-light);
1574
- }
1575
-
1576
- @utility border-surface {
1577
- border-color: var(--color-border-surface);
1578
- }
1579
-
1580
- @utility border-dark-surface {
1581
- border-color: var(--color-border-dark);
1582
- }
1583
-
1584
- @utility border-darker-surface {
1585
- border-color: var(--color-border-darker);
1586
- }
1587
-
1588
- @utility border-darkest-surface {
1589
- border-color: var(--color-border-darkest);
1590
- }
1591
-
1592
- /* Primary Surfaces */
1593
-
1594
- @utility primary-lightest-surface {
1595
- background-color: var(--color-primary-lightest);
1596
- color: var(--color-on-primary-lightest);
1597
- border-color: var(--color-border-primary-lightest);
1598
- }
1599
-
1600
- @utility primary-lighter-surface {
1601
- background-color: var(--color-primary-lighter);
1602
- color: var(--color-on-primary-lighter);
1603
- border-color: var(--color-border-primary-lighter);
1604
- }
1605
-
1606
- @utility primary-light-surface {
1607
- background-color: var(--color-primary-light);
1608
- color: var(--color-on-primary-light);
1609
- border-color: var(--color-border-primary-light);
1610
- }
1611
-
1612
- @utility primary-surface {
1613
- background-color: var(--color-primary);
1614
- color: var(--color-on-primary);
1615
- border-color: var(--color-border-primary);
1616
- }
1617
-
1618
- @utility primary-dark-surface {
1619
- background-color: var(--color-primary-dark);
1620
- color: var(--color-on-primary-dark);
1621
- border-color: var(--color-border-primary-dark);
1622
- }
1623
-
1624
- @utility primary-darker-surface {
1625
- background-color: var(--color-primary-darker);
1626
- color: var(--color-on-primary-darker);
1627
- border-color: var(--color-border-primary-darker);
1628
- }
1629
-
1630
- @utility primary-darkest-surface {
1631
- background-color: var(--color-primary-darkest);
1632
- color: var(--color-on-primary-darkest);
1633
- border-color: var(--color-border-primary-darkest);
1634
- }
1635
-
1636
- @utility border-primary-lightest-surface {
1637
- border-color: var(--color-border-primary-lightest);
1638
- }
1639
-
1640
- @utility border-primary-lighter-surface {
1641
- border-color: var(--color-border-primary-lighter);
1642
- }
1643
-
1644
- @utility border-primary-light-surface {
1645
- border-color: var(--color-border-primary-light);
1646
- }
1647
-
1648
- @utility border-primary-surface {
1649
- border-color: var(--color-border-primary);
1650
- }
1651
-
1652
- @utility border-primary-dark-surface {
1653
- border-color: var(--color-border-primary-dark);
1654
- }
1655
-
1656
- @utility border-primary-darker-surface {
1657
- border-color: var(--color-border-primary-darker);
1658
- }
1659
-
1660
- @utility border-primary-darkest-surface {
1661
- border-color: var(--color-border-primary-darkest);
1662
- }
1663
-
1664
- @utility ax-primary {
1665
- --ax-comp-bg-lightest: var(--color-primary-lightest);
1666
- --ax-comp-text-lightest: var(--color-on-primary-lightest);
1667
- --ax-comp-border-lightest: var(--color-border-primary-lightest);
1668
- --ax-comp-bg-lighter: var(--color-primary-lighter);
1669
- --ax-comp-text-lighter: var(--color-on-primary-lighter);
1670
- --ax-comp-border-lighter: var(--color-border-primary-lighter);
1671
- --ax-comp-bg-light: var(--color-primary-light);
1672
- --ax-comp-text-light: var(--color-on-primary-light);
1673
- --ax-comp-border-light: var(--color-border-primary-light);
1674
- --ax-comp-bg: var(--color-primary);
1675
- --ax-comp-text: var(--color-on-primary);
1676
- --ax-comp-border: var(--color-border-primary);
1677
- --ax-comp-bg-dark: var(--color-primary-dark);
1678
- --ax-comp-text-dark: var(--color-on-primary-dark);
1679
- --ax-comp-border-dark: var(--color-border-primary-dark);
1680
- --ax-comp-bg-darker: var(--color-primary-darker);
1681
- --ax-comp-text-darker: var(--color-on-primary-darker);
1682
- --ax-comp-border-darker: var(--color-border-primary-darker);
1683
- --ax-comp-bg-darkest: var(--color-primary-darkest);
1684
- --ax-comp-text-darkest: var(--color-on-primary-darkest);
1685
- --ax-comp-border-darkest: var(--color-border-primary-darkest);
1686
- }
1687
-
1688
- /* Secondary Surfaces */
1689
-
1690
- @utility secondary-lightest-surface {
1691
- background-color: var(--color-secondary-lightest);
1692
- color: var(--color-on-secondary-lightest);
1693
- border-color: var(--color-border-secondary-lightest);
1694
- }
1695
-
1696
- @utility secondary-lighter-surface {
1697
- background-color: var(--color-secondary-lighter);
1698
- color: var(--color-on-secondary-lighter);
1699
- border-color: var(--color-border-secondary-lighter);
1700
- }
1701
-
1702
- @utility secondary-light-surface {
1703
- background-color: var(--color-secondary-light);
1704
- color: var(--color-on-secondary-light);
1705
- border-color: var(--color-border-secondary-light);
1706
- }
1707
-
1708
- @utility secondary-surface {
1709
- background-color: var(--color-secondary);
1710
- color: var(--color-on-secondary);
1711
- border-color: var(--color-border-secondary);
1712
- }
1713
-
1714
- @utility secondary-dark-surface {
1715
- background-color: var(--color-secondary-dark);
1716
- color: var(--color-on-secondary-dark);
1717
- border-color: var(--color-border-secondary-dark);
1718
- }
1719
-
1720
- @utility secondary-darker-surface {
1721
- background-color: var(--color-secondary-darker);
1722
- color: var(--color-on-secondary-darker);
1723
- border-color: var(--color-border-secondary-darker);
1724
- }
1725
-
1726
- @utility secondary-darkest-surface {
1727
- background-color: var(--color-secondary-darkest);
1728
- color: var(--color-on-secondary-darkest);
1729
- border-color: var(--color-border-secondary-darkest);
1730
- }
1731
-
1732
- @utility border-secondary-lightest-surface {
1733
- border-color: var(--color-border-secondary-lightest);
1734
- }
1735
-
1736
- @utility border-secondary-lighter-surface {
1737
- border-color: var(--color-border-secondary-lighter);
1738
- }
1739
-
1740
- @utility border-secondary-light-surface {
1741
- border-color: var(--color-border-secondary-light);
1742
- }
1743
-
1744
- @utility border-secondary-surface {
1745
- border-color: var(--color-border-secondary);
1746
- }
1747
-
1748
- @utility border-secondary-dark-surface {
1749
- border-color: var(--color-border-secondary-dark);
1750
- }
1751
-
1752
- @utility border-secondary-darker-surface {
1753
- border-color: var(--color-border-secondary-darker);
1754
- }
1755
-
1756
- @utility border-secondary-darkest-surface {
1757
- border-color: var(--color-border-secondary-darkest);
1758
- }
1759
-
1760
- @utility ax-secondary {
1761
- --ax-comp-bg-lightest: var(--color-secondary-lightest);
1762
- --ax-comp-text-lightest: var(--color-on-secondary-lightest);
1763
- --ax-comp-border-lightest: var(--color-border-secondary-lightest);
1764
- --ax-comp-bg-lighter: var(--color-secondary-lighter);
1765
- --ax-comp-text-lighter: var(--color-on-secondary-lighter);
1766
- --ax-comp-border-lighter: var(--color-border-secondary-lighter);
1767
- --ax-comp-bg-light: var(--color-secondary-light);
1768
- --ax-comp-text-light: var(--color-on-secondary-light);
1769
- --ax-comp-border-light: var(--color-border-secondary-light);
1770
- --ax-comp-bg: var(--color-secondary);
1771
- --ax-comp-text: var(--color-on-secondary);
1772
- --ax-comp-border: var(--color-border-secondary);
1773
- --ax-comp-bg-dark: var(--color-secondary-dark);
1774
- --ax-comp-text-dark: var(--color-on-secondary-dark);
1775
- --ax-comp-border-dark: var(--color-border-secondary-dark);
1776
- --ax-comp-bg-darker: var(--color-secondary-darker);
1777
- --ax-comp-text-darker: var(--color-on-secondary-darker);
1778
- --ax-comp-border-darker: var(--color-border-secondary-darker);
1779
- --ax-comp-bg-darkest: var(--color-secondary-darkest);
1780
- --ax-comp-text-darkest: var(--color-on-secondary-darkest);
1781
- --ax-comp-border-darkest: var(--color-border-secondary-darkest);
1782
- }
1783
-
1784
- /* Success Surfaces */
1785
-
1786
- @utility success-lightest-surface {
1787
- background-color: var(--color-success-lightest);
1788
- color: var(--color-on-success-lightest);
1789
- border-color: var(--color-border-success-lightest);
1790
- }
1791
-
1792
- @utility success-lighter-surface {
1793
- background-color: var(--color-success-lighter);
1794
- color: var(--color-on-success-lighter);
1795
- border-color: var(--color-border-success-lighter);
1796
- }
1797
-
1798
- @utility success-light-surface {
1799
- background-color: var(--color-success-light);
1800
- color: var(--color-on-success-light);
1801
- border-color: var(--color-border-success-light);
1802
- }
1803
-
1804
- @utility success-surface {
1805
- background-color: var(--color-success);
1806
- color: var(--color-on-success);
1807
- border-color: var(--color-border-success);
1808
- }
1809
-
1810
- @utility success-dark-surface {
1811
- background-color: var(--color-success-dark);
1812
- color: var(--color-on-success-dark);
1813
- border-color: var(--color-border-success-dark);
1814
- }
1815
-
1816
- @utility success-darker-surface {
1817
- background-color: var(--color-success-darker);
1818
- color: var(--color-on-success-darker);
1819
- border-color: var(--color-border-success-darker);
1820
- }
1821
-
1822
- @utility success-darkest-surface {
1823
- background-color: var(--color-success-darkest);
1824
- color: var(--color-on-success-darkest);
1825
- border-color: var(--color-border-success-darkest);
1826
- }
1827
-
1828
- @utility border-success-lightest-surface {
1829
- border-color: var(--color-border-success-lightest);
1830
- }
1831
-
1832
- @utility border-success-lighter-surface {
1833
- border-color: var(--color-border-success-lighter);
1834
- }
1835
-
1836
- @utility border-success-light-surface {
1837
- border-color: var(--color-border-success-light);
1838
- }
1839
-
1840
- @utility border-success-surface {
1841
- border-color: var(--color-border-success);
1842
- }
1843
-
1844
- @utility border-success-dark-surface {
1845
- border-color: var(--color-border-success-dark);
1846
- }
1847
-
1848
- @utility border-success-darker-surface {
1849
- border-color: var(--color-border-success-darker);
1850
- }
1851
-
1852
- @utility border-success-darkest-surface {
1853
- border-color: var(--color-border-success-darkest);
1854
- }
1855
-
1856
- @utility ax-success {
1857
- --ax-comp-bg-lightest: var(--color-success-lightest);
1858
- --ax-comp-text-lightest: var(--color-on-success-lightest);
1859
- --ax-comp-border-lightest: var(--color-border-success-lightest);
1860
- --ax-comp-bg-lighter: var(--color-success-lighter);
1861
- --ax-comp-text-lighter: var(--color-on-success-lighter);
1862
- --ax-comp-border-lighter: var(--color-border-success-lighter);
1863
- --ax-comp-bg-light: var(--color-success-light);
1864
- --ax-comp-text-light: var(--color-on-success-light);
1865
- --ax-comp-border-light: var(--color-border-success-light);
1866
- --ax-comp-bg: var(--color-success);
1867
- --ax-comp-text: var(--color-on-success);
1868
- --ax-comp-border: var(--color-border-success);
1869
- --ax-comp-bg-dark: var(--color-success-dark);
1870
- --ax-comp-text-dark: var(--color-on-success-dark);
1871
- --ax-comp-border-dark: var(--color-border-success-dark);
1872
- --ax-comp-bg-darker: var(--color-success-darker);
1873
- --ax-comp-text-darker: var(--color-on-success-darker);
1874
- --ax-comp-border-darker: var(--color-border-success-darker);
1875
- --ax-comp-bg-darkest: var(--color-success-darkest);
1876
- --ax-comp-text-darkest: var(--color-on-success-darkest);
1877
- --ax-comp-border-darkest: var(--color-border-success-darkest);
1878
- }
1879
-
1880
- /* Warning Surfaces */
1881
-
1882
- @utility warning-lightest-surface {
1883
- background-color: var(--color-warning-lightest);
1884
- color: var(--color-on-warning-lightest);
1885
- border-color: var(--color-border-warning-lightest);
1886
- }
1887
-
1888
- @utility warning-lighter-surface {
1889
- background-color: var(--color-warning-lighter);
1890
- color: var(--color-on-warning-lighter);
1891
- border-color: var(--color-border-warning-lighter);
1892
- }
1893
-
1894
- @utility warning-light-surface {
1895
- background-color: var(--color-warning-light);
1896
- color: var(--color-on-warning-light);
1897
- border-color: var(--color-border-warning-light);
1898
- }
1899
-
1900
- @utility warning-surface {
1901
- background-color: var(--color-warning);
1902
- color: var(--color-on-warning);
1903
- border-color: var(--color-border-warning);
1904
- }
1905
-
1906
- @utility warning-dark-surface {
1907
- background-color: var(--color-warning-dark);
1908
- color: var(--color-on-warning-dark);
1909
- border-color: var(--color-border-warning-dark);
1910
- }
1911
-
1912
- @utility warning-darker-surface {
1913
- background-color: var(--color-warning-darker);
1914
- color: var(--color-on-warning-darker);
1915
- border-color: var(--color-border-warning-darker);
1916
- }
1917
-
1918
- @utility warning-darkest-surface {
1919
- background-color: var(--color-warning-darkest);
1920
- color: var(--color-on-warning-darkest);
1921
- border-color: var(--color-border-warning-darkest);
1922
- }
1923
-
1924
- @utility border-warning-lightest-surface {
1925
- border-color: var(--color-border-warning-lightest);
1926
- }
1927
-
1928
- @utility border-warning-lighter-surface {
1929
- border-color: var(--color-border-warning-lighter);
1930
- }
1931
-
1932
- @utility border-warning-light-surface {
1933
- border-color: var(--color-border-warning-light);
1934
- }
1935
-
1936
- @utility border-warning-surface {
1937
- border-color: var(--color-border-warning);
1938
- }
1939
-
1940
- @utility border-warning-dark-surface {
1941
- border-color: var(--color-border-warning-dark);
1942
- }
1943
-
1944
- @utility border-warning-darker-surface {
1945
- border-color: var(--color-border-warning-darker);
1946
- }
1947
-
1948
- @utility border-warning-darkest-surface {
1949
- border-color: var(--color-border-warning-darkest);
1950
- }
1951
-
1952
- @utility ax-warning {
1953
- --ax-comp-bg-lightest: var(--color-warning-lightest);
1954
- --ax-comp-text-lightest: var(--color-on-warning-lightest);
1955
- --ax-comp-border-lightest: var(--color-border-warning-lightest);
1956
- --ax-comp-bg-lighter: var(--color-warning-lighter);
1957
- --ax-comp-text-lighter: var(--color-on-warning-lighter);
1958
- --ax-comp-border-lighter: var(--color-border-warning-lighter);
1959
- --ax-comp-bg-light: var(--color-warning-light);
1960
- --ax-comp-text-light: var(--color-on-warning-light);
1961
- --ax-comp-border-light: var(--color-border-warning-light);
1962
- --ax-comp-bg: var(--color-warning);
1963
- --ax-comp-text: var(--color-on-warning);
1964
- --ax-comp-border: var(--color-border-warning);
1965
- --ax-comp-bg-dark: var(--color-warning-dark);
1966
- --ax-comp-text-dark: var(--color-on-warning-dark);
1967
- --ax-comp-border-dark: var(--color-border-warning-dark);
1968
- --ax-comp-bg-darker: var(--color-warning-darker);
1969
- --ax-comp-text-darker: var(--color-on-warning-darker);
1970
- --ax-comp-border-darker: var(--color-border-warning-darker);
1971
- --ax-comp-bg-darkest: var(--color-warning-darkest);
1972
- --ax-comp-text-darkest: var(--color-on-warning-darkest);
1973
- --ax-comp-border-darkest: var(--color-border-warning-darkest);
1974
- }
1975
-
1976
- /* Danger Surfaces */
1977
-
1978
- @utility danger-lightest-surface {
1979
- background-color: var(--color-danger-lightest);
1980
- color: var(--color-on-danger-lightest);
1981
- border-color: var(--color-border-danger-lightest);
1982
- }
1983
-
1984
- @utility danger-lighter-surface {
1985
- background-color: var(--color-danger-lighter);
1986
- color: var(--color-on-danger-lighter);
1987
- border-color: var(--color-border-danger-lighter);
1988
- }
1989
-
1990
- @utility danger-light-surface {
1991
- background-color: var(--color-danger-light);
1992
- color: var(--color-on-danger-light);
1993
- border-color: var(--color-border-danger-light);
1994
- }
1995
-
1996
- @utility danger-surface {
1997
- background-color: var(--color-danger);
1998
- color: var(--color-on-danger);
1999
- border-color: var(--color-border-danger);
2000
- }
2001
-
2002
- @utility danger-dark-surface {
2003
- background-color: var(--color-danger-dark);
2004
- color: var(--color-on-danger-dark);
2005
- border-color: var(--color-border-danger-dark);
2006
- }
2007
-
2008
- @utility danger-darker-surface {
2009
- background-color: var(--color-danger-darker);
2010
- color: var(--color-on-danger-darker);
2011
- border-color: var(--color-border-danger-darker);
2012
- }
2013
-
2014
- @utility danger-darkest-surface {
2015
- background-color: var(--color-danger-darkest);
2016
- color: var(--color-on-danger-darkest);
2017
- border-color: var(--color-border-danger-darkest);
2018
- }
2019
-
2020
- @utility border-danger-lightest-surface {
2021
- border-color: var(--color-border-danger-lightest);
2022
- }
2023
-
2024
- @utility border-danger-lighter-surface {
2025
- border-color: var(--color-border-danger-lighter);
2026
- }
2027
-
2028
- @utility border-danger-light-surface {
2029
- border-color: var(--color-border-danger-light);
2030
- }
2031
-
2032
- @utility border-danger-surface {
2033
- border-color: var(--color-border-danger);
2034
- }
2035
-
2036
- @utility border-danger-dark-surface {
2037
- border-color: var(--color-border-danger-dark);
2038
- }
2039
-
2040
- @utility border-danger-darker-surface {
2041
- border-color: var(--color-border-danger-darker);
2042
- }
2043
-
2044
- @utility border-danger-darkest-surface {
2045
- border-color: var(--color-border-danger-darkest);
2046
- }
2047
-
2048
- @utility ax-danger {
2049
- --ax-comp-bg-lightest: var(--color-danger-lightest);
2050
- --ax-comp-text-lightest: var(--color-on-danger-lightest);
2051
- --ax-comp-border-lightest: var(--color-border-danger-lightest);
2052
- --ax-comp-bg-lighter: var(--color-danger-lighter);
2053
- --ax-comp-text-lighter: var(--color-on-danger-lighter);
2054
- --ax-comp-border-lighter: var(--color-border-danger-lighter);
2055
- --ax-comp-bg-light: var(--color-danger-light);
2056
- --ax-comp-text-light: var(--color-on-danger-light);
2057
- --ax-comp-border-light: var(--color-border-danger-light);
2058
- --ax-comp-bg: var(--color-danger);
2059
- --ax-comp-text: var(--color-on-danger);
2060
- --ax-comp-border: var(--color-border-danger);
2061
- --ax-comp-bg-dark: var(--color-danger-dark);
2062
- --ax-comp-text-dark: var(--color-on-danger-dark);
2063
- --ax-comp-border-dark: var(--color-border-danger-dark);
2064
- --ax-comp-bg-darker: var(--color-danger-darker);
2065
- --ax-comp-text-darker: var(--color-on-danger-darker);
2066
- --ax-comp-border-darker: var(--color-border-danger-darker);
2067
- --ax-comp-bg-darkest: var(--color-danger-darkest);
2068
- --ax-comp-text-darkest: var(--color-on-danger-darkest);
2069
- --ax-comp-border-darkest: var(--color-border-danger-darkest);
2070
- }
2071
-
2072
- /* Accent Surfaces */
2073
-
2074
- @utility accent-lightest-surface {
2075
- background-color: var(--color-accent-lightest);
2076
- color: var(--color-on-accent-lightest);
2077
- border-color: var(--color-border-accent-lightest);
2078
- }
2079
-
2080
- @utility accent-lighter-surface {
2081
- background-color: var(--color-accent-lighter);
2082
- color: var(--color-on-accent-lighter);
2083
- border-color: var(--color-border-accent-lighter);
2084
- }
2085
-
2086
- @utility accent-light-surface {
2087
- background-color: var(--color-accent-light);
2088
- color: var(--color-on-accent-light);
2089
- border-color: var(--color-border-accent-light);
2090
- }
2091
-
2092
- @utility accent-surface {
2093
- background-color: var(--color-accent);
2094
- color: var(--color-on-accent);
2095
- border-color: var(--color-border-accent);
2096
- }
2097
-
2098
- @utility accent-dark-surface {
2099
- background-color: var(--color-accent-dark);
2100
- color: var(--color-on-accent-dark);
2101
- border-color: var(--color-border-accent-dark);
2102
- }
2103
-
2104
- @utility accent-darker-surface {
2105
- background-color: var(--color-accent-darker);
2106
- color: var(--color-on-accent-darker);
2107
- border-color: var(--color-border-accent-darker);
2108
- }
2109
-
2110
- @utility accent-darkest-surface {
2111
- background-color: var(--color-accent-darkest);
2112
- color: var(--color-on-accent-darkest);
2113
- border-color: var(--color-border-accent-darkest);
2114
- }
2115
-
2116
- @utility border-accent-lightest-surface {
2117
- border-color: var(--color-border-accent-lightest);
2118
- }
2119
-
2120
- @utility border-accent-lighter-surface {
2121
- border-color: var(--color-border-accent-lighter);
2122
- }
2123
-
2124
- @utility border-accent-light-surface {
2125
- border-color: var(--color-border-accent-light);
2126
- }
2127
-
2128
- @utility border-accent-surface {
2129
- border-color: var(--color-border-accent);
2130
- }
2131
-
2132
- @utility border-accent-dark-surface {
2133
- border-color: var(--color-border-accent-dark);
2134
- }
2135
-
2136
- @utility border-accent-darker-surface {
2137
- border-color: var(--color-border-accent-darker);
2138
- }
2139
-
2140
- @utility border-accent-darkest-surface {
2141
- border-color: var(--color-border-accent-darkest);
2142
- }
2143
-
2144
- @utility ax-accent {
2145
- --ax-comp-bg-lightest: var(--color-accent-lightest);
2146
- --ax-comp-text-lightest: var(--color-on-accent-lightest);
2147
- --ax-comp-border-lightest: var(--color-border-accent-lightest);
2148
- --ax-comp-bg-lighter: var(--color-accent-lighter);
2149
- --ax-comp-text-lighter: var(--color-on-accent-lighter);
2150
- --ax-comp-border-lighter: var(--color-border-accent-lighter);
2151
- --ax-comp-bg-light: var(--color-accent-light);
2152
- --ax-comp-text-light: var(--color-on-accent-light);
2153
- --ax-comp-border-light: var(--color-border-accent-light);
2154
- --ax-comp-bg: var(--color-accent);
2155
- --ax-comp-text: var(--color-on-accent);
2156
- --ax-comp-border: var(--color-border-accent);
2157
- --ax-comp-bg-dark: var(--color-accent-dark);
2158
- --ax-comp-text-dark: var(--color-on-accent-dark);
2159
- --ax-comp-border-dark: var(--color-border-accent-dark);
2160
- --ax-comp-bg-darker: var(--color-accent-darker);
2161
- --ax-comp-text-darker: var(--color-on-accent-darker);
2162
- --ax-comp-border-darker: var(--color-border-accent-darker);
2163
- --ax-comp-bg-darkest: var(--color-accent-darkest);
2164
- --ax-comp-text-darkest: var(--color-on-accent-darkest);
2165
- --ax-comp-border-darkest: var(--color-border-accent-darkest);
2166
- }
2167
-
2168
- /* Accent2 Surfaces */
2169
-
2170
- @utility accent2-lightest-surface {
2171
- background-color: var(--color-accent2-lightest);
2172
- color: var(--color-on-accent2-lightest);
2173
- border-color: var(--color-border-accent2-lightest);
2174
- }
2175
-
2176
- @utility accent2-lighter-surface {
2177
- background-color: var(--color-accent2-lighter);
2178
- color: var(--color-on-accent2-lighter);
2179
- border-color: var(--color-border-accent2-lighter);
2180
- }
2181
-
2182
- @utility accent2-light-surface {
2183
- background-color: var(--color-accent2-light);
2184
- color: var(--color-on-accent2-light);
2185
- border-color: var(--color-border-accent2-light);
2186
- }
2187
-
2188
- @utility accent2-surface {
2189
- background-color: var(--color-accent2);
2190
- color: var(--color-on-accent2);
2191
- border-color: var(--color-border-accent2);
2192
- }
2193
-
2194
- @utility accent2-dark-surface {
2195
- background-color: var(--color-accent2-dark);
2196
- color: var(--color-on-accent2-dark);
2197
- border-color: var(--color-border-accent2-dark);
2198
- }
2199
-
2200
- @utility accent2-darker-surface {
2201
- background-color: var(--color-accent2-darker);
2202
- color: var(--color-on-accent2-darker);
2203
- border-color: var(--color-border-accent2-darker);
2204
- }
2205
-
2206
- @utility accent2-darkest-surface {
2207
- background-color: var(--color-accent2-darkest);
2208
- color: var(--color-on-accent2-darkest);
2209
- border-color: var(--color-border-accent2-darkest);
2210
- }
2211
-
2212
- @utility border-accent2-lightest-surface {
2213
- border-color: var(--color-border-accent2-lightest);
2214
- }
2215
-
2216
- @utility border-accent2-lighter-surface {
2217
- border-color: var(--color-border-accent2-lighter);
2218
- }
2219
-
2220
- @utility border-accent2-light-surface {
2221
- border-color: var(--color-border-accent2-light);
2222
- }
2223
-
2224
- @utility border-accent2-surface {
2225
- border-color: var(--color-border-accent2);
2226
- }
2227
-
2228
- @utility border-accent2-dark-surface {
2229
- border-color: var(--color-border-accent2-dark);
2230
- }
2231
-
2232
- @utility border-accent2-darker-surface {
2233
- border-color: var(--color-border-accent2-darker);
2234
- }
2235
-
2236
- @utility border-accent2-darkest-surface {
2237
- border-color: var(--color-border-accent2-darkest);
2238
- }
2239
-
2240
- @utility ax-accent2 {
2241
- --ax-comp-bg-lightest: var(--color-accent2-lightest);
2242
- --ax-comp-text-lightest: var(--color-on-accent2-lightest);
2243
- --ax-comp-border-lightest: var(--color-border-accent2-lightest);
2244
- --ax-comp-bg-lighter: var(--color-accent2-lighter);
2245
- --ax-comp-text-lighter: var(--color-on-accent2-lighter);
2246
- --ax-comp-border-lighter: var(--color-border-accent2-lighter);
2247
- --ax-comp-bg-light: var(--color-accent2-light);
2248
- --ax-comp-text-light: var(--color-on-accent2-light);
2249
- --ax-comp-border-light: var(--color-border-accent2-light);
2250
- --ax-comp-bg: var(--color-accent2);
2251
- --ax-comp-text: var(--color-on-accent2);
2252
- --ax-comp-border: var(--color-border-accent2);
2253
- --ax-comp-bg-dark: var(--color-accent2-dark);
2254
- --ax-comp-text-dark: var(--color-on-accent2-dark);
2255
- --ax-comp-border-dark: var(--color-border-accent2-dark);
2256
- --ax-comp-bg-darker: var(--color-accent2-darker);
2257
- --ax-comp-text-darker: var(--color-on-accent2-darker);
2258
- --ax-comp-border-darker: var(--color-border-accent2-darker);
2259
- --ax-comp-bg-darkest: var(--color-accent2-darkest);
2260
- --ax-comp-text-darkest: var(--color-on-accent2-darkest);
2261
- --ax-comp-border-darkest: var(--color-border-accent2-darkest);
2262
- }
2263
-
2264
- /* Accent3 Surfaces */
2265
-
2266
- @utility accent3-lightest-surface {
2267
- background-color: var(--color-accent3-lightest);
2268
- color: var(--color-on-accent3-lightest);
2269
- border-color: var(--color-border-accent3-lightest);
2270
- }
2271
-
2272
- @utility accent3-lighter-surface {
2273
- background-color: var(--color-accent3-lighter);
2274
- color: var(--color-on-accent3-lighter);
2275
- border-color: var(--color-border-accent3-lighter);
2276
- }
2277
-
2278
- @utility accent3-light-surface {
2279
- background-color: var(--color-accent3-light);
2280
- color: var(--color-on-accent3-light);
2281
- border-color: var(--color-border-accent3-light);
2282
- }
2283
-
2284
- @utility accent3-surface {
2285
- background-color: var(--color-accent3);
2286
- color: var(--color-on-accent3);
2287
- border-color: var(--color-border-accent3);
2288
- }
2289
-
2290
- @utility accent3-dark-surface {
2291
- background-color: var(--color-accent3-dark);
2292
- color: var(--color-on-accent3-dark);
2293
- border-color: var(--color-border-accent3-dark);
2294
- }
2295
-
2296
- @utility accent3-darker-surface {
2297
- background-color: var(--color-accent3-darker);
2298
- color: var(--color-on-accent3-darker);
2299
- border-color: var(--color-border-accent3-darker);
2300
- }
2301
-
2302
- @utility accent3-darkest-surface {
2303
- background-color: var(--color-accent3-darkest);
2304
- color: var(--color-on-accent3-darkest);
2305
- border-color: var(--color-border-accent3-darkest);
2306
- }
2307
-
2308
- @utility border-accent3-lightest-surface {
2309
- border-color: var(--color-border-accent3-lightest);
2310
- }
2311
-
2312
- @utility border-accent3-lighter-surface {
2313
- border-color: var(--color-border-accent3-lighter);
2314
- }
2315
-
2316
- @utility border-accent3-light-surface {
2317
- border-color: var(--color-border-accent3-light);
2318
- }
2319
-
2320
- @utility border-accent3-surface {
2321
- border-color: var(--color-border-accent3);
2322
- }
2323
-
2324
- @utility border-accent3-dark-surface {
2325
- border-color: var(--color-border-accent3-dark);
2326
- }
2327
-
2328
- @utility border-accent3-darker-surface {
2329
- border-color: var(--color-border-accent3-darker);
2330
- }
2331
-
2332
- @utility border-accent3-darkest-surface {
2333
- border-color: var(--color-border-accent3-darkest);
2334
- }
2335
-
2336
- @utility ax-accent3 {
2337
- --ax-comp-bg-lightest: var(--color-accent3-lightest);
2338
- --ax-comp-text-lightest: var(--color-on-accent3-lightest);
2339
- --ax-comp-border-lightest: var(--color-border-accent3-lightest);
2340
- --ax-comp-bg-lighter: var(--color-accent3-lighter);
2341
- --ax-comp-text-lighter: var(--color-on-accent3-lighter);
2342
- --ax-comp-border-lighter: var(--color-border-accent3-lighter);
2343
- --ax-comp-bg-light: var(--color-accent3-light);
2344
- --ax-comp-text-light: var(--color-on-accent3-light);
2345
- --ax-comp-border-light: var(--color-border-accent3-light);
2346
- --ax-comp-bg: var(--color-accent3);
2347
- --ax-comp-text: var(--color-on-accent3);
2348
- --ax-comp-border: var(--color-border-accent3);
2349
- --ax-comp-bg-dark: var(--color-accent3-dark);
2350
- --ax-comp-text-dark: var(--color-on-accent3-dark);
2351
- --ax-comp-border-dark: var(--color-border-accent3-dark);
2352
- --ax-comp-bg-darker: var(--color-accent3-darker);
2353
- --ax-comp-text-darker: var(--color-on-accent3-darker);
2354
- --ax-comp-border-darker: var(--color-border-accent3-darker);
2355
- --ax-comp-bg-darkest: var(--color-accent3-darkest);
2356
- --ax-comp-text-darkest: var(--color-on-accent3-darkest);
2357
- --ax-comp-border-darkest: var(--color-border-accent3-darkest);
2358
- }
2359
-
2360
- /* Accent4 Surfaces */
2361
-
2362
- @utility accent4-lightest-surface {
2363
- background-color: var(--color-accent4-lightest);
2364
- color: var(--color-on-accent4-lightest);
2365
- border-color: var(--color-border-accent4-lightest);
2366
- }
2367
-
2368
- @utility accent4-lighter-surface {
2369
- background-color: var(--color-accent4-lighter);
2370
- color: var(--color-on-accent4-lighter);
2371
- border-color: var(--color-border-accent4-lighter);
2372
- }
2373
-
2374
- @utility accent4-light-surface {
2375
- background-color: var(--color-accent4-light);
2376
- color: var(--color-on-accent4-light);
2377
- border-color: var(--color-border-accent4-light);
2378
- }
2379
-
2380
- @utility accent4-surface {
2381
- background-color: var(--color-accent4);
2382
- color: var(--color-on-accent4);
2383
- border-color: var(--color-border-accent4);
2384
- }
2385
-
2386
- @utility accent4-dark-surface {
2387
- background-color: var(--color-accent4-dark);
2388
- color: var(--color-on-accent4-dark);
2389
- border-color: var(--color-border-accent4-dark);
2390
- }
2391
-
2392
- @utility accent4-darker-surface {
2393
- background-color: var(--color-accent4-darker);
2394
- color: var(--color-on-accent4-darker);
2395
- border-color: var(--color-border-accent4-darker);
2396
- }
2397
-
2398
- @utility accent4-darkest-surface {
2399
- background-color: var(--color-accent4-darkest);
2400
- color: var(--color-on-accent4-darkest);
2401
- border-color: var(--color-border-accent4-darkest);
2402
- }
2403
-
2404
- @utility border-accent4-lightest-surface {
2405
- border-color: var(--color-border-accent4-lightest);
2406
- }
2407
-
2408
- @utility border-accent4-lighter-surface {
2409
- border-color: var(--color-border-accent4-lighter);
2410
- }
2411
-
2412
- @utility border-accent4-light-surface {
2413
- border-color: var(--color-border-accent4-light);
2414
- }
2415
-
2416
- @utility border-accent4-surface {
2417
- border-color: var(--color-border-accent4);
2418
- }
2419
-
2420
- @utility border-accent4-dark-surface {
2421
- border-color: var(--color-border-accent4-dark);
2422
- }
2423
-
2424
- @utility border-accent4-darker-surface {
2425
- border-color: var(--color-border-accent4-darker);
2426
- }
2427
-
2428
- @utility border-accent4-darkest-surface {
2429
- border-color: var(--color-border-accent4-darkest);
2430
- }
2431
-
2432
- @utility ax-accent4 {
2433
- --ax-comp-bg-lightest: var(--color-accent4-lightest);
2434
- --ax-comp-text-lightest: var(--color-on-accent4-lightest);
2435
- --ax-comp-border-lightest: var(--color-border-accent4-lightest);
2436
- --ax-comp-bg-lighter: var(--color-accent4-lighter);
2437
- --ax-comp-text-lighter: var(--color-on-accent4-lighter);
2438
- --ax-comp-border-lighter: var(--color-border-accent4-lighter);
2439
- --ax-comp-bg-light: var(--color-accent4-light);
2440
- --ax-comp-text-light: var(--color-on-accent4-light);
2441
- --ax-comp-border-light: var(--color-border-accent4-light);
2442
- --ax-comp-bg: var(--color-accent4);
2443
- --ax-comp-text: var(--color-on-accent4);
2444
- --ax-comp-border: var(--color-border-accent4);
2445
- --ax-comp-bg-dark: var(--color-accent4-dark);
2446
- --ax-comp-text-dark: var(--color-on-accent4-dark);
2447
- --ax-comp-border-dark: var(--color-border-accent4-dark);
2448
- --ax-comp-bg-darker: var(--color-accent4-darker);
2449
- --ax-comp-text-darker: var(--color-on-accent4-darker);
2450
- --ax-comp-border-darker: var(--color-border-accent4-darker);
2451
- --ax-comp-bg-darkest: var(--color-accent4-darkest);
2452
- --ax-comp-text-darkest: var(--color-on-accent4-darkest);
2453
- --ax-comp-border-darkest: var(--color-border-accent4-darkest);
2454
- }
2455
-
2456
- /* Accent5 Surfaces */
2457
-
2458
- @utility accent5-lightest-surface {
2459
- background-color: var(--color-accent5-lightest);
2460
- color: var(--color-on-accent5-lightest);
2461
- border-color: var(--color-border-accent5-lightest);
2462
- }
2463
-
2464
- @utility accent5-lighter-surface {
2465
- background-color: var(--color-accent5-lighter);
2466
- color: var(--color-on-accent5-lighter);
2467
- border-color: var(--color-border-accent5-lighter);
2468
- }
2469
-
2470
- @utility accent5-light-surface {
2471
- background-color: var(--color-accent5-light);
2472
- color: var(--color-on-accent5-light);
2473
- border-color: var(--color-border-accent5-light);
2474
- }
2475
-
2476
- @utility accent5-surface {
2477
- background-color: var(--color-accent5);
2478
- color: var(--color-on-accent5);
2479
- border-color: var(--color-border-accent5);
2480
- }
2481
-
2482
- @utility accent5-dark-surface {
2483
- background-color: var(--color-accent5-dark);
2484
- color: var(--color-on-accent5-dark);
2485
- border-color: var(--color-border-accent5-dark);
2486
- }
2487
-
2488
- @utility accent5-darker-surface {
2489
- background-color: var(--color-accent5-darker);
2490
- color: var(--color-on-accent5-darker);
2491
- border-color: var(--color-border-accent5-darker);
2492
- }
2493
-
2494
- @utility accent5-darkest-surface {
2495
- background-color: var(--color-accent5-darkest);
2496
- color: var(--color-on-accent5-darkest);
2497
- border-color: var(--color-border-accent5-darkest);
2498
- }
2499
-
2500
- @utility border-accent5-lightest-surface {
2501
- border-color: var(--color-border-accent5-lightest);
2502
- }
2503
-
2504
- @utility border-accent5-lighter-surface {
2505
- border-color: var(--color-border-accent5-lighter);
2506
- }
2507
-
2508
- @utility border-accent5-light-surface {
2509
- border-color: var(--color-border-accent5-light);
2510
- }
2511
-
2512
- @utility border-accent5-surface {
2513
- border-color: var(--color-border-accent5);
2514
- }
2515
-
2516
- @utility border-accent5-dark-surface {
2517
- border-color: var(--color-border-accent5-dark);
2518
- }
2519
-
2520
- @utility border-accent5-darker-surface {
2521
- border-color: var(--color-border-accent5-darker);
2522
- }
2523
-
2524
- @utility border-accent5-darkest-surface {
2525
- border-color: var(--color-border-accent5-darkest);
2526
- }
2527
-
2528
- @utility ax-accent5 {
2529
- --ax-comp-bg-lightest: var(--color-accent5-lightest);
2530
- --ax-comp-text-lightest: var(--color-on-accent5-lightest);
2531
- --ax-comp-border-lightest: var(--color-border-accent5-lightest);
2532
- --ax-comp-bg-lighter: var(--color-accent5-lighter);
2533
- --ax-comp-text-lighter: var(--color-on-accent5-lighter);
2534
- --ax-comp-border-lighter: var(--color-border-accent5-lighter);
2535
- --ax-comp-bg-light: var(--color-accent5-light);
2536
- --ax-comp-text-light: var(--color-on-accent5-light);
2537
- --ax-comp-border-light: var(--color-border-accent5-light);
2538
- --ax-comp-bg: var(--color-accent5);
2539
- --ax-comp-text: var(--color-on-accent5);
2540
- --ax-comp-border: var(--color-border-accent5);
2541
- --ax-comp-bg-dark: var(--color-accent5-dark);
2542
- --ax-comp-text-dark: var(--color-on-accent5-dark);
2543
- --ax-comp-border-dark: var(--color-border-accent5-dark);
2544
- --ax-comp-bg-darker: var(--color-accent5-darker);
2545
- --ax-comp-text-darker: var(--color-on-accent5-darker);
2546
- --ax-comp-border-darker: var(--color-border-accent5-darker);
2547
- --ax-comp-bg-darkest: var(--color-accent5-darkest);
2548
- --ax-comp-text-darkest: var(--color-on-accent5-darkest);
2549
- --ax-comp-border-darkest: var(--color-border-accent5-darkest);
2550
- }
2551
-
2552
- /* Accent6 Surfaces */
2553
-
2554
- @utility accent6-lightest-surface {
2555
- background-color: var(--color-accent6-lightest);
2556
- color: var(--color-on-accent6-lightest);
2557
- border-color: var(--color-border-accent6-lightest);
2558
- }
2559
-
2560
- @utility accent6-lighter-surface {
2561
- background-color: var(--color-accent6-lighter);
2562
- color: var(--color-on-accent6-lighter);
2563
- border-color: var(--color-border-accent6-lighter);
2564
- }
2565
-
2566
- @utility accent6-light-surface {
2567
- background-color: var(--color-accent6-light);
2568
- color: var(--color-on-accent6-light);
2569
- border-color: var(--color-border-accent6-light);
2570
- }
2571
-
2572
- @utility accent6-surface {
2573
- background-color: var(--color-accent6);
2574
- color: var(--color-on-accent6);
2575
- border-color: var(--color-border-accent6);
2576
- }
2577
-
2578
- @utility accent6-dark-surface {
2579
- background-color: var(--color-accent6-dark);
2580
- color: var(--color-on-accent6-dark);
2581
- border-color: var(--color-border-accent6-dark);
2582
- }
2583
-
2584
- @utility accent6-darker-surface {
2585
- background-color: var(--color-accent6-darker);
2586
- color: var(--color-on-accent6-darker);
2587
- border-color: var(--color-border-accent6-darker);
2588
- }
2589
-
2590
- @utility accent6-darkest-surface {
2591
- background-color: var(--color-accent6-darkest);
2592
- color: var(--color-on-accent6-darkest);
2593
- border-color: var(--color-border-accent6-darkest);
2594
- }
2595
-
2596
- @utility border-accent6-lightest-surface {
2597
- border-color: var(--color-border-accent6-lightest);
2598
- }
2599
-
2600
- @utility border-accent6-lighter-surface {
2601
- border-color: var(--color-border-accent6-lighter);
2602
- }
2603
-
2604
- @utility border-accent6-light-surface {
2605
- border-color: var(--color-border-accent6-light);
2606
- }
2607
-
2608
- @utility border-accent6-surface {
2609
- border-color: var(--color-border-accent6);
2610
- }
2611
-
2612
- @utility border-accent6-dark-surface {
2613
- border-color: var(--color-border-accent6-dark);
2614
- }
2615
-
2616
- @utility border-accent6-darker-surface {
2617
- border-color: var(--color-border-accent6-darker);
2618
- }
2619
-
2620
- @utility border-accent6-darkest-surface {
2621
- border-color: var(--color-border-accent6-darkest);
2622
- }
2623
-
2624
- @utility ax-accent6 {
2625
- --ax-comp-bg-lightest: var(--color-accent6-lightest);
2626
- --ax-comp-text-lightest: var(--color-on-accent6-lightest);
2627
- --ax-comp-border-lightest: var(--color-border-accent6-lightest);
2628
- --ax-comp-bg-lighter: var(--color-accent6-lighter);
2629
- --ax-comp-text-lighter: var(--color-on-accent6-lighter);
2630
- --ax-comp-border-lighter: var(--color-border-accent6-lighter);
2631
- --ax-comp-bg-light: var(--color-accent6-light);
2632
- --ax-comp-text-light: var(--color-on-accent6-light);
2633
- --ax-comp-border-light: var(--color-border-accent6-light);
2634
- --ax-comp-bg: var(--color-accent6);
2635
- --ax-comp-text: var(--color-on-accent6);
2636
- --ax-comp-border: var(--color-border-accent6);
2637
- --ax-comp-bg-dark: var(--color-accent6-dark);
2638
- --ax-comp-text-dark: var(--color-on-accent6-dark);
2639
- --ax-comp-border-dark: var(--color-border-accent6-dark);
2640
- --ax-comp-bg-darker: var(--color-accent6-darker);
2641
- --ax-comp-text-darker: var(--color-on-accent6-darker);
2642
- --ax-comp-border-darker: var(--color-border-accent6-darker);
2643
- --ax-comp-bg-darkest: var(--color-accent6-darkest);
2644
- --ax-comp-text-darkest: var(--color-on-accent6-darkest);
2645
- --ax-comp-border-darkest: var(--color-border-accent6-darkest);
2646
- }
2647
-
2648
- /* Accent7 Surfaces */
2649
-
2650
- @utility accent7-lightest-surface {
2651
- background-color: var(--color-accent7-lightest);
2652
- color: var(--color-on-accent7-lightest);
2653
- border-color: var(--color-border-accent7-lightest);
2654
- }
2655
-
2656
- @utility accent7-lighter-surface {
2657
- background-color: var(--color-accent7-lighter);
2658
- color: var(--color-on-accent7-lighter);
2659
- border-color: var(--color-border-accent7-lighter);
2660
- }
2661
-
2662
- @utility accent7-light-surface {
2663
- background-color: var(--color-accent7-light);
2664
- color: var(--color-on-accent7-light);
2665
- border-color: var(--color-border-accent7-light);
2666
- }
2667
-
2668
- @utility accent7-surface {
2669
- background-color: var(--color-accent7);
2670
- color: var(--color-on-accent7);
2671
- border-color: var(--color-border-accent7);
2672
- }
2673
-
2674
- @utility accent7-dark-surface {
2675
- background-color: var(--color-accent7-dark);
2676
- color: var(--color-on-accent7-dark);
2677
- border-color: var(--color-border-accent7-dark);
2678
- }
2679
-
2680
- @utility accent7-darker-surface {
2681
- background-color: var(--color-accent7-darker);
2682
- color: var(--color-on-accent7-darker);
2683
- border-color: var(--color-border-accent7-darker);
2684
- }
2685
-
2686
- @utility accent7-darkest-surface {
2687
- background-color: var(--color-accent7-darkest);
2688
- color: var(--color-on-accent7-darkest);
2689
- border-color: var(--color-border-accent7-darkest);
2690
- }
2691
-
2692
- @utility border-accent7-lightest-surface {
2693
- border-color: var(--color-border-accent7-lightest);
2694
- }
2695
-
2696
- @utility border-accent7-lighter-surface {
2697
- border-color: var(--color-border-accent7-lighter);
2698
- }
2699
-
2700
- @utility border-accent7-light-surface {
2701
- border-color: var(--color-border-accent7-light);
2702
- }
2703
-
2704
- @utility border-accent7-surface {
2705
- border-color: var(--color-border-accent7);
2706
- }
2707
-
2708
- @utility border-accent7-dark-surface {
2709
- border-color: var(--color-border-accent7-dark);
2710
- }
2711
-
2712
- @utility border-accent7-darker-surface {
2713
- border-color: var(--color-border-accent7-darker);
2714
- }
2715
-
2716
- @utility border-accent7-darkest-surface {
2717
- border-color: var(--color-border-accent7-darkest);
2718
- }
2719
-
2720
- @utility ax-accent7 {
2721
- --ax-comp-bg-lightest: var(--color-accent7-lightest);
2722
- --ax-comp-text-lightest: var(--color-on-accent7-lightest);
2723
- --ax-comp-border-lightest: var(--color-border-accent7-lightest);
2724
- --ax-comp-bg-lighter: var(--color-accent7-lighter);
2725
- --ax-comp-text-lighter: var(--color-on-accent7-lighter);
2726
- --ax-comp-border-lighter: var(--color-border-accent7-lighter);
2727
- --ax-comp-bg-light: var(--color-accent7-light);
2728
- --ax-comp-text-light: var(--color-on-accent7-light);
2729
- --ax-comp-border-light: var(--color-border-accent7-light);
2730
- --ax-comp-bg: var(--color-accent7);
2731
- --ax-comp-text: var(--color-on-accent7);
2732
- --ax-comp-border: var(--color-border-accent7);
2733
- --ax-comp-bg-dark: var(--color-accent7-dark);
2734
- --ax-comp-text-dark: var(--color-on-accent7-dark);
2735
- --ax-comp-border-dark: var(--color-border-accent7-dark);
2736
- --ax-comp-bg-darker: var(--color-accent7-darker);
2737
- --ax-comp-text-darker: var(--color-on-accent7-darker);
2738
- --ax-comp-border-darker: var(--color-border-accent7-darker);
2739
- --ax-comp-bg-darkest: var(--color-accent7-darkest);
2740
- --ax-comp-text-darkest: var(--color-on-accent7-darkest);
2741
- --ax-comp-border-darkest: var(--color-border-accent7-darkest);
2742
- }
2743
-
2744
- @utility bg-default {
2745
- border-color: var(--color-bg-default);
2746
- }
2747
-
2748
- @utility text-default {
2749
- border-color: var(--color-text-default);
2750
- }
2751
-
2752
- @utility border-default {
2753
- border-color: var(--color-border-default);
2754
- }
2755
-
2756
- @utility border-s-default {
2757
- border-inline-start-width: 1px;
2758
- }
2759
-
2760
- @utility border-e-default {
2761
- border-inline-end-width: 1px;
2762
- }
2763
-
2764
- @utility border-t-default {
2765
- border-top-width: 1px;
2766
- }
2767
-
2768
- @utility border-b-default {
2769
- border-bottom-width: 1px;
2770
- }
2771
-
2772
- @utility border-x-default {
2773
- border-left-width: 1px;
2774
- border-right-width: 1px;
2775
- }
2776
-
2777
- @utility border-y-default {
2778
- border-top-width: 1px;
2779
- border-bottom-width: 1px;
2780
- }
2781
-
2782
- @utility text-default {
2783
- color: var(--color-text-default);
2784
- }
2785
-
2786
- @utility bg-default {
2787
- background-color: var(--color-bg-default);
2788
- }
2789
-
2790
- @utility max-w-8xl {
2791
- max-width: 90rem;
2792
- }
2793
-
2794
- @utility rounded-default {
2795
- border-radius: var(--radius-default);
2796
- }
2797
-
2798
- @utility rounded-s-default {
2799
- border-start-start-radius: var(--radius-default);
2800
- border-end-start-radius: var(--radius-default);
2801
- }
2802
-
2803
- @utility rounded-e-default {
2804
- border-start-end-radius: var(--radius-default);
2805
- border-end-end-radius: var(--radius-default);
2806
- }
2807
-
2808
- @utility rounded-t-default {
2809
- border-top-left-radius: var(--radius-default);
2810
- border-top-right-radius: var(--radius-default);
2811
- }
2812
-
2813
- @utility rounded-b-default {
2814
- border-bottom-left-radius: var(--radius-default);
2815
- border-bottom-right-radius: var(--radius-default);
2816
- }
2817
-
2818
- @utility rounded-tl-default {
2819
- border-top-left-radius: var(--radius-default);
2820
- }
2821
-
2822
- @utility rounded-tr-default {
2823
- border-top-right-radius: var(--radius-default);
2824
- }
2825
-
2826
- @utility rounded-bl-default {
2827
- border-bottom-left-radius: var(--radius-default);
2828
- }
2829
-
2830
- @utility rounded-br-default {
2831
- border-bottom-right-radius: var(--radius-default);
2832
- }
2833
-
2834
- @utility ax-state-disabled {
2835
- @apply cursor-not-allowed opacity-50 *:cursor-not-allowed;
2836
- }
2837
-
2838
- @utility ax-state-readonly {
2839
- @apply cursor-text opacity-70 *:cursor-text;
2840
- }
2841
-
2842
- @utility ax-fill {
2843
- &.ax-default {
2844
- @apply light-surface dark:dark-surface;
2845
- }
2846
- &.ax-editor-container {
2847
- @apply focus-within:ring-primary/30 focus-within:border-primary focus-within:ring-3;
2848
- }
2849
- }
2850
-
2851
- @utility ax-flat {
2852
- @apply rounded-none;
2853
- &.ax-default {
2854
- @apply border-border-lightest dark:border-border-darkest border-b bg-transparent;
2855
- }
2856
- &.ax-editor-container {
2857
- @apply focus-within:border-primary!;
2858
- }
2859
- }
2860
-
2861
- @utility ax-solid {
2862
- @apply bg-(--ax-comp-bg,var(--color-lightest)) text-(--ax-comp-text,var(--color-on-lightest)) dark:bg-(--ax-comp-bg,var(--color-darkest)) dark:text-(--ax-comp-text,var(--color-on-darkest));
2863
- &.ax-default {
2864
- @apply lightest-surface dark:darkest-surface border;
2865
- }
2866
- &.ax-state-selected {
2867
- @apply bg-(--ax-comp-bg-darker,var(--color-light)) text-(--ax-comp-text-darker,var(--color-on-light)) dark:bg-(--ax-comp-bg-darker,var(--color-dark)) dark:text-(--ax-comp-text-darker,var(--color-on-dark));
2868
- }
2869
- &.ax-editor-container {
2870
- @apply focus-within:ring-primary/30 focus-within:border-primary focus-within:ring-3;
2871
- }
2872
- }
2873
-
2874
- @utility ax-solid-interactive {
2875
- @supports (color: color-mix(in lab, red, red)) {
2876
- --ax-comp-ripple-color: color-mix(in oklab, var(--ax-comp-bg-lightest, var(--color-on-lightest)) 25%, transparent);
2877
- }
2878
- @apply ax-solid transition-colors;
2879
- &:not(.ax-state-disabled, .ax-state-loading, .ax-state-selected) {
2880
- &:hover,
2881
- &:focus,
2882
- &:focus-within,
2883
- &:focus-visible {
2884
- @apply bg-(--ax-comp-bg-dark,var(--color-lighter)) text-(--ax-comp-text-dark,var(--color-on-lighter)) dark:bg-(--ax-comp-bg-dark,var(--color-darker)) dark:text-(--ax-comp-text-dark,var(--color-on-darker));
2885
- }
2886
- }
2887
- &:not(.ax-state-disabled, .ax-state-loading, .ax-state-selected):active {
2888
- @apply bg-(--ax-comp-bg-darker,var(--color-light)) text-(--ax-comp-text-darker,var(--color-on-light)) dark:bg-(--ax-comp-bg-darker,var(--color-dark)) dark:text-(--ax-comp-text-darker,var(--color-on-dark));
2889
- }
2890
- }
2891
-
2892
- @utility ax-outline {
2893
- @apply border border-(--ax-comp-bg,var(--color-border-lightest)) bg-transparent text-(--ax-comp-bg,var(--color-on-lightest));
2894
- &.ax-default {
2895
- @apply border-border-lightest dark:border-border-darkest border;
2896
- }
2897
- &.ax-state-selected {
2898
- @apply border-(--ax-comp-bg-darker,var(--color-border-light)) text-(--ax-comp-bg-darker,var(--color-on-light));
2899
- }
2900
- &.ax-editor-container {
2901
- @apply focus-within:ring-primary/30 focus-within:border-primary focus-within:ring-3;
2902
- }
2903
- }
2904
-
2905
- @utility ax-outline-interactive {
2906
- @supports (color: color-mix(in lab, red, red)) {
2907
- --ax-comp-ripple-color: color-mix(in oklab, var(--ax-comp-bg, var(--color-on-lightest)) 25%, transparent);
2908
- }
2909
- @apply ax-outline transition-colors;
2910
- &:not(.ax-state-disabled, .ax-state-loading, .ax-state-selected) {
2911
- &:hover,
2912
- &:focus,
2913
- &:focus-within,
2914
- &:focus-visible {
2915
- @apply border-(--ax-comp-bg-dark,var(--color-border-lighter)) text-(--ax-comp-bg-dark,var(--color-on-lighter));
2916
- }
2917
- }
2918
- &:not(.ax-state-disabled, .ax-state-loading, .ax-state-selected):active {
2919
- @apply border-(--ax-comp-bg-darker,var(--color-border-light)) text-(--ax-comp-bg-darker,var(--color-on-light));
2920
- }
2921
- }
2922
-
2923
- @utility ax-twotone {
2924
- @apply bg-(--ax-comp-bg-lightest,var(--color-lighter)) text-(--ax-comp-text-lightest,var(--color-on-lighter)) dark:bg-(--ax-comp-bg-lightest,var(--color-darker)) dark:text-(--ax-comp-text-lightest,var(--color-on-darker));
2925
- &.ax-state-selected {
2926
- @apply bg-(--ax-comp-bg-light,var(--color-surface)) text-(--ax-comp-text-light,var(--color-on-surface));
2927
- }
2928
- }
2929
-
2930
- @utility ax-twotone-interactive {
2931
- @supports (color: color-mix(in lab, red, red)) {
2932
- --ax-comp-ripple-color: color-mix(in oklab, var(--ax-comp-bg, var(--color-on-lightest)) 25%, transparent);
2933
- }
2934
- @apply ax-twotone transition-colors;
2935
- &:not(.ax-state-disabled, .ax-state-loading, .ax-state-selected) {
2936
- &:hover,
2937
- &:focus,
2938
- &:focus-within,
2939
- &:focus-visible {
2940
- @apply bg-(--ax-comp-bg-lighter,var(--color-light)) text-(--ax-comp-text-lighter,var(--color-on-light)) dark:bg-(--ax-comp-bg-lighter,var(--color-dark)) dark:text-(--ax-comp-text-lighter,var(--color-on-dark));
2941
- }
2942
- }
2943
- &:not(.ax-state-disabled, .ax-state-loading, .ax-state-selected):active {
2944
- @apply bg-(--ax-comp-bg-light,var(--color-surface)) text-(--ax-comp-text-light,var(--color-on-surface));
2945
- }
2946
- }
2947
-
2948
- @utility ax-blank {
2949
- @apply bg-transparent text-(--ax-comp-bg,var(--color-on-surface));
2950
- &.ax-state-selected {
2951
- @apply bg-(--ax-comp-bg-lighter,var(--color-surface)) text-(--ax-comp-text-lighter,var(--color-on-surface));
2952
- }
2953
- }
2954
-
2955
- @utility ax-blank-interactive {
2956
- @supports (color: color-mix(in lab, red, red)) {
2957
- --ax-comp-ripple-color: color-mix(in oklab, var(--ax-comp-bg, var(--color-on-lightest)) 25%, transparent);
2958
- }
2959
- @apply ax-blank transition-colors;
2960
- &:not(.ax-state-disabled, .ax-state-loading, .ax-state-selected) {
2961
- &:hover,
2962
- &:focus,
2963
- &:focus-within,
2964
- &:focus-visible {
2965
- @apply bg-(--ax-comp-bg-lightest,var(--color-lighter)) text-(--ax-comp-text-lightest,var(--color-on-lighter)) dark:bg-(--ax-comp-bg-lightest,var(--color-darker)) dark:text-(--ax-comp-text-lightest,var(--color-on-darker));
2966
- }
2967
- }
2968
- &:not(.ax-state-disabled, .ax-state-loading, .ax-state-selected):active {
2969
- @apply bg-(--ax-comp-bg-lighter,var(--color-surface)) text-(--ax-comp-text-lighter,var(--color-on-surface));
2970
- }
2971
- }
2972
-
2973
- @utility links {
2974
- @apply bg-transparent text-(--ax-comp-bg,var(--color-on-surface));
2975
- &.ax-state-selected {
2976
- @apply text-(--ax-comp-bg-darker,var(--color-on-surface));
2977
- }
2978
- }
2979
-
2980
- @utility links-interactive {
2981
- @supports (color: color-mix(in lab, red, red)) {
2982
- --ax-comp-ripple-color: color-mix(in oklab, var(--ax-comp-bg, var(--color-on-lightest)) 25%, transparent);
2983
- }
2984
- @apply links transition-colors;
2985
- &:not(.ax-state-disabled, .ax-state-loading, .ax-state-selected) {
2986
- &:hover,
2987
- &:focus,
2988
- &:focus-within,
2989
- &:focus-visible {
2990
- @apply text-(--ax-comp-bg-dark,var(--color-on-surface));
2991
- }
2992
- }
2993
- &:not(.ax-state-disabled, .ax-state-loading, .ax-state-selected):active {
2994
- @apply text-(--ax-comp-bg-darker,var(--color-on-surface));
2995
- }
2996
- }
2997
- @utility h1 {
2998
- font-size: 2.5rem;
2999
- font-weight: 500;
3000
- line-height: 2.5rem;
3001
- }
3002
- @utility h2 {
3003
- font-size: 2rem;
3004
- font-weight: 500;
3005
- line-height: 2rem;
3006
- }
3007
- @utility h3 {
3008
- font-size: 1.75rem;
3009
- font-weight: 500;
3010
- line-height: 1.75rem;
3011
- }
3012
- @utility h4 {
3013
- font-size: 1.5rem;
3014
- font-weight: 500;
3015
- line-height: 1.5rem;
3016
- }
3017
- @utility h5 {
3018
- font-size: 1.125rem;
3019
- font-weight: 500;
3020
- line-height: 1.125rem;
3021
- }
3022
- @utility h6 {
3023
- font-size: 1rem;
3024
- font-weight: 500;
3025
- line-height: 1rem;
3026
- }
3027
- @utility heading {
3028
- width: 100%;
3029
- border-bottom: 1px solid;
3030
- border-color: rgba(var(--ax-sys-color-border-lightest-surface));
3031
- line-height: 0.1em;
3032
- margin: 1rem auto;
3033
- }
3034
- @utility heading-start {
3035
- text-align: start;
3036
- }
3037
- @utility heading-center {
3038
- text-align: center;
3039
- }
3040
- @utility heading-end {
3041
- text-align: end;
3042
- }
3043
- @utility subtitle {
3044
- opacity: 74%;
3045
- display: block;
3046
- font-size: 1rem;
3047
- font-weight: 400;
3048
- line-height: 1.625rem;
3049
- }
3050
- @utility tabs-fit {
3051
- width: 100%;
3052
- }
3053
- @utility ax-xs {
3054
- --ax-sys-xs-size: var(--ax-sys-size-xs);
3055
- }
3056
- @utility ax-sm {
3057
- --ax-sys-sm-size: var(--ax-sys-size-sm);
3058
- }
3059
- @utility ax-md {
3060
- --ax-sys-md-size: var(--ax-sys-size-md);
3061
- }
3062
- @utility ax-lg {
3063
- --ax-sys-lg-size: var(--ax-sys-size-lg);
3064
- }
3065
- @utility ax-xl {
3066
- --ax-sys-xl-size: var(--ax-sys-size-xl);
3067
- }