@acorex/styles 16.0.2 → 17.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (81) hide show
  1. package/icons/fontawesome/fontawesome.scss +68 -0
  2. package/icons/index.scss +207 -0
  3. package/icons/material/material.scss +73 -0
  4. package/index.css +2623 -0
  5. package/index.min.css +1 -0
  6. package/index.scss +9 -0
  7. package/package.json +11 -11
  8. package/src/base/_preflight.scss +417 -0
  9. package/src/base/index.scss +13 -0
  10. package/src/mixins/_look.scss +83 -0
  11. package/src/mixins/_media.scss +27 -0
  12. package/src/mixins/_util.scss +19 -0
  13. package/src/mixins/index.scss +3 -0
  14. package/src/shared/_actionsheet.scss +23 -0
  15. package/src/shared/_check-box.scss +59 -0
  16. package/src/shared/_color-look.scss +689 -0
  17. package/src/shared/_drop-down.scss +76 -0
  18. package/src/shared/_editor-container.scss +257 -0
  19. package/src/shared/_general-button.scss +87 -0
  20. package/src/shared/_inputs.scss +16 -0
  21. package/src/shared/_list.scss +211 -0
  22. package/src/shared/_radio.scss +56 -0
  23. package/src/shared/_table.scss +149 -0
  24. package/src/shared/_utils.scss +75 -0
  25. package/src/shared/index.scss +11 -0
  26. package/src/utility/index.scss +24 -0
  27. package/src/variables/_colors.scss +2 -0
  28. package/src/variables/_degrees.scss +1 -0
  29. package/src/variables/index.scss +2 -0
  30. package/tailwind-base.js +235 -0
  31. package/themes/default.css +1 -0
  32. package/themes/default.scss +141 -0
  33. package/fonts/font-awesome/fa-brands-400.eot +0 -0
  34. package/fonts/font-awesome/fa-brands-400.svg +0 -3570
  35. package/fonts/font-awesome/fa-brands-400.ttf +0 -0
  36. package/fonts/font-awesome/fa-brands-400.woff +0 -0
  37. package/fonts/font-awesome/fa-brands-400.woff2 +0 -0
  38. package/fonts/font-awesome/fa-duotone-900.eot +0 -0
  39. package/fonts/font-awesome/fa-duotone-900.svg +0 -15055
  40. package/fonts/font-awesome/fa-duotone-900.ttf +0 -0
  41. package/fonts/font-awesome/fa-duotone-900.woff +0 -0
  42. package/fonts/font-awesome/fa-duotone-900.woff2 +0 -0
  43. package/fonts/font-awesome/fa-light-300.eot +0 -0
  44. package/fonts/font-awesome/fa-light-300.svg +0 -12330
  45. package/fonts/font-awesome/fa-light-300.ttf +0 -0
  46. package/fonts/font-awesome/fa-light-300.woff +0 -0
  47. package/fonts/font-awesome/fa-light-300.woff2 +0 -0
  48. package/fonts/font-awesome/fa-regular-400.eot +0 -0
  49. package/fonts/font-awesome/fa-regular-400.svg +0 -11256
  50. package/fonts/font-awesome/fa-regular-400.ttf +0 -0
  51. package/fonts/font-awesome/fa-regular-400.woff +0 -0
  52. package/fonts/font-awesome/fa-regular-400.woff2 +0 -0
  53. package/fonts/font-awesome/fa-solid-900.eot +0 -0
  54. package/fonts/font-awesome/fa-solid-900.svg +0 -9588
  55. package/fonts/font-awesome/fa-solid-900.ttf +0 -0
  56. package/fonts/font-awesome/fa-solid-900.woff +0 -0
  57. package/fonts/font-awesome/fa-solid-900.woff2 +0 -0
  58. package/fonts/font-awesome/font-awesome.css +0 -16960
  59. package/scss/buttons.scss +0 -69
  60. package/scss/calendar.scss +0 -144
  61. package/scss/checkbox.scss +0 -46
  62. package/scss/context-menu.scss +0 -75
  63. package/scss/data-grid.scss +0 -117
  64. package/scss/drawer.scss +0 -138
  65. package/scss/fieldset.scss +0 -23
  66. package/scss/forms.scss +0 -523
  67. package/scss/list.scss +0 -47
  68. package/scss/master.scss +0 -330
  69. package/scss/menu.scss +0 -130
  70. package/scss/mixin.scss +0 -12
  71. package/scss/page.scss +0 -54
  72. package/scss/progress.scss +0 -11
  73. package/scss/selection-list.scss +0 -104
  74. package/scss/style.scss +0 -47
  75. package/scss/tab-strip.scss +0 -31
  76. package/scss/tab.scss +0 -36
  77. package/scss/toast.scss +0 -46
  78. package/scss/tooltip.scss +0 -55
  79. package/scss/treeview.scss +0 -152
  80. package/scss/upload.scss +0 -170
  81. package/scss/variables.scss +0 -139
package/index.css ADDED
@@ -0,0 +1,2623 @@
1
+ @import '@angular/cdk/overlay-prebuilt.css';
2
+ /*
3
+ 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
4
+ 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
5
+ */
6
+ *,
7
+ ::before,
8
+ ::after {
9
+ box-sizing: border-box; /* 1 */
10
+ border-width: 0; /* 2 */
11
+ border-style: solid; /* 2 */
12
+ border-color: theme("borderColor.DEFAULT", currentColor); /* 2 */
13
+ }
14
+
15
+ ::before,
16
+ ::after {
17
+ --tw-content: "";
18
+ }
19
+
20
+ /*
21
+ 1. Use a consistent sensible line-height in all browsers.
22
+ 2. Prevent adjustments of font size after orientation changes in iOS.
23
+ 3. Use a more readable tab size.
24
+ 4. Use the user's configured `sans` font-family by default.
25
+ 5. Use the user's configured `sans` font-feature-settings by default.
26
+ 6. Use the user's configured `sans` font-variation-settings by default.
27
+ 7. Disable tap highlights on iOS.
28
+ */
29
+ html,
30
+ :host {
31
+ line-height: 1.5; /* 1 */
32
+ -webkit-text-size-adjust: 100%; /* 2 */
33
+ -moz-tab-size: 4; /* 3 */
34
+ tab-size: 4; /* 3 */
35
+ font-family: theme("fontFamily.sans", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); /* 4 */
36
+ font-feature-settings: theme("fontFamily.sans[1].fontFeatureSettings", normal); /* 5 */
37
+ font-variation-settings: theme("fontFamily.sans[1].fontVariationSettings", normal); /* 6 */
38
+ -webkit-tap-highlight-color: transparent; /* 7 */
39
+ }
40
+
41
+ /*
42
+ 1. Remove the margin in all browsers.
43
+ 2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
44
+ */
45
+ body {
46
+ margin: 0; /* 1 */
47
+ line-height: inherit; /* 2 */
48
+ }
49
+
50
+ /*
51
+ 1. Add the correct height in Firefox.
52
+ 2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
53
+ 3. Ensure horizontal rules are visible by default.
54
+ */
55
+ hr {
56
+ height: 0; /* 1 */
57
+ color: inherit; /* 2 */
58
+ border-top-width: 1px; /* 3 */
59
+ }
60
+
61
+ /*
62
+ Add the correct text decoration in Chrome, Edge, and Safari.
63
+ */
64
+ abbr:where([title]) {
65
+ text-decoration: underline dotted;
66
+ }
67
+
68
+ /*
69
+ Remove the default font size and weight for headings.
70
+ */
71
+ h1,
72
+ h2,
73
+ h3,
74
+ h4,
75
+ h5,
76
+ h6 {
77
+ font-size: inherit;
78
+ font-weight: inherit;
79
+ }
80
+
81
+ /*
82
+ Reset links to optimize for opt-in styling instead of opt-out.
83
+ */
84
+ a {
85
+ color: inherit;
86
+ text-decoration: inherit;
87
+ }
88
+
89
+ /*
90
+ Add the correct font weight in Edge and Safari.
91
+ */
92
+ b,
93
+ strong {
94
+ font-weight: bolder;
95
+ }
96
+
97
+ /*
98
+ 1. Use the user's configured `mono` font-family by default.
99
+ 2. Use the user's configured `mono` font-feature-settings by default.
100
+ 3. Use the user's configured `mono` font-variation-settings by default.
101
+ 4. Correct the odd `em` font sizing in all browsers.
102
+ */
103
+ code,
104
+ kbd,
105
+ samp,
106
+ pre {
107
+ font-family: theme("fontFamily.mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); /* 1 */
108
+ font-feature-settings: theme("fontFamily.mono[1].fontFeatureSettings", normal); /* 2 */
109
+ font-variation-settings: theme("fontFamily.mono[1].fontVariationSettings", normal); /* 3 */
110
+ font-size: 1em; /* 4 */
111
+ }
112
+
113
+ /*
114
+ Add the correct font size in all browsers.
115
+ */
116
+ small {
117
+ font-size: 80%;
118
+ }
119
+
120
+ /*
121
+ Prevent `sub` and `sup` elements from affecting the line height in all browsers.
122
+ */
123
+ sub,
124
+ sup {
125
+ font-size: 75%;
126
+ line-height: 0;
127
+ position: relative;
128
+ vertical-align: baseline;
129
+ }
130
+
131
+ sub {
132
+ bottom: -0.25em;
133
+ }
134
+
135
+ sup {
136
+ top: -0.5em;
137
+ }
138
+
139
+ /*
140
+ 1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
141
+ 2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
142
+ 3. Remove gaps between table borders by default.
143
+ */
144
+ table {
145
+ text-indent: 0; /* 1 */
146
+ border-color: inherit; /* 2 */
147
+ border-collapse: collapse; /* 3 */
148
+ }
149
+
150
+ /*
151
+ 1. Change the font styles in all browsers.
152
+ 2. Remove the margin in Firefox and Safari.
153
+ 3. Remove default padding in all browsers.
154
+ */
155
+ button,
156
+ input,
157
+ optgroup,
158
+ select,
159
+ textarea {
160
+ font-family: inherit; /* 1 */
161
+ font-feature-settings: inherit; /* 1 */
162
+ font-variation-settings: inherit; /* 1 */
163
+ font-size: 100%; /* 1 */
164
+ font-weight: inherit; /* 1 */
165
+ line-height: inherit; /* 1 */
166
+ color: inherit; /* 1 */
167
+ margin: 0; /* 2 */
168
+ padding: 0; /* 3 */
169
+ }
170
+
171
+ /*
172
+ Remove the inheritance of text transform in Edge and Firefox.
173
+ */
174
+ button,
175
+ select {
176
+ text-transform: none;
177
+ }
178
+
179
+ /*
180
+ 1. Correct the inability to style clickable types in iOS and Safari.
181
+ 2. Remove default button styles.
182
+ */
183
+ button,
184
+ [type=button],
185
+ [type=reset],
186
+ [type=submit] {
187
+ -webkit-appearance: button; /* 1 */
188
+ background-color: transparent; /* 2 */
189
+ background-image: none; /* 2 */
190
+ }
191
+
192
+ /*
193
+ Use the modern Firefox focus style for all focusable elements.
194
+ */
195
+ :-moz-focusring {
196
+ outline: auto;
197
+ }
198
+
199
+ /*
200
+ Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
201
+ */
202
+ :-moz-ui-invalid {
203
+ box-shadow: none;
204
+ }
205
+
206
+ /*
207
+ Add the correct vertical alignment in Chrome and Firefox.
208
+ */
209
+ progress {
210
+ vertical-align: baseline;
211
+ }
212
+
213
+ /*
214
+ Correct the cursor style of increment and decrement buttons in Safari.
215
+ */
216
+ ::-webkit-inner-spin-button,
217
+ ::-webkit-outer-spin-button {
218
+ height: auto;
219
+ }
220
+
221
+ /*
222
+ 1. Correct the odd appearance in Chrome and Safari.
223
+ 2. Correct the outline style in Safari.
224
+ */
225
+ [type=search] {
226
+ -webkit-appearance: textfield; /* 1 */
227
+ outline-offset: -2px; /* 2 */
228
+ }
229
+
230
+ /*
231
+ Remove the inner padding in Chrome and Safari on macOS.
232
+ */
233
+ ::-webkit-search-decoration {
234
+ -webkit-appearance: none;
235
+ }
236
+
237
+ /*
238
+ 1. Correct the inability to style clickable types in iOS and Safari.
239
+ 2. Change font properties to `inherit` in Safari.
240
+ */
241
+ ::-webkit-file-upload-button {
242
+ -webkit-appearance: button; /* 1 */
243
+ font: inherit; /* 2 */
244
+ }
245
+
246
+ /*
247
+ Add the correct display in Chrome and Safari.
248
+ */
249
+ summary {
250
+ display: list-item;
251
+ }
252
+
253
+ /*
254
+ Removes the default spacing for appropriate elements.
255
+ */
256
+ blockquote,
257
+ dl,
258
+ dd,
259
+ h1,
260
+ h2,
261
+ h3,
262
+ h4,
263
+ h5,
264
+ h6,
265
+ hr,
266
+ figure,
267
+ p,
268
+ pre {
269
+ margin: 0;
270
+ }
271
+
272
+ fieldset {
273
+ margin: 0;
274
+ padding: 0;
275
+ }
276
+
277
+ legend {
278
+ padding: 0;
279
+ }
280
+
281
+ ol,
282
+ ul,
283
+ menu {
284
+ list-style: none;
285
+ margin: 0;
286
+ padding: 0;
287
+ }
288
+
289
+ dialog {
290
+ padding: 0;
291
+ }
292
+
293
+ /*
294
+ Prevent resizing textareas horizontally by default.
295
+ */
296
+ textarea {
297
+ resize: vertical;
298
+ }
299
+
300
+ /*
301
+ 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
302
+ 2. Set the default placeholder color to the user's configured gray 400 color.
303
+ */
304
+ input::placeholder,
305
+ textarea::placeholder {
306
+ opacity: 1; /* 1 */
307
+ color: theme("colors.gray.400", #9ca3af); /* 2 */
308
+ }
309
+
310
+ /*
311
+ Set the default cursor for buttons.
312
+ */
313
+ button,
314
+ [role=button] {
315
+ cursor: pointer;
316
+ }
317
+
318
+ /*
319
+ Make sure disabled buttons don't get the pointer cursor.
320
+ */
321
+ :disabled {
322
+ cursor: default;
323
+ }
324
+
325
+ /*
326
+ 1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
327
+ 2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
328
+ This can trigger a poorly considered lint error in some tools but is included by design.
329
+ */
330
+ img,
331
+ svg,
332
+ video,
333
+ canvas,
334
+ audio,
335
+ iframe,
336
+ embed,
337
+ object {
338
+ display: block; /* 1 */
339
+ vertical-align: middle; /* 2 */
340
+ }
341
+
342
+ /*
343
+ Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
344
+ */
345
+ img,
346
+ video {
347
+ max-width: 100%;
348
+ height: auto;
349
+ }
350
+
351
+ /*
352
+ Make elements with the HTML hidden attribute stay hidden by default.
353
+ */
354
+ [hidden] {
355
+ display: none;
356
+ }
357
+
358
+ :root {
359
+ --ax-overlay-full-width: 93;
360
+ --ax-color-white: 255, 255, 255;
361
+ --ax-color-black: 0, 0, 0;
362
+ }
363
+
364
+ html,
365
+ body {
366
+ background-color: rgba(var(--ax-color-background-default));
367
+ color: rgba(var(--ax-color-text-default));
368
+ }
369
+
370
+ .ax-actionsheet-panel {
371
+ overflow: hidden;
372
+ border-top-left-radius: var(--ax-rounded-border-default);
373
+ border-top-right-radius: var(--ax-rounded-border-default);
374
+ background-color: rgba(var(--ax-color-surface));
375
+ --ax-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1),
376
+ 0 4px 6px -4px rgb(0 0 0 / 0.1);
377
+ --ax-shadow-colored: 0 10px 15px -3px var(--ax-shadow-color),
378
+ 0 4px 6px -4px var(--ax-shadow-color);
379
+ box-shadow: var(--ax-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)), var(--ax-ring-shadow, 0 0 rgba(0, 0, 0, 0)), var(--ax-shadow);
380
+ animation: 1s both ax-fadeInUp;
381
+ animation-duration: 250ms;
382
+ }
383
+ @keyframes ax-fadeInUp {
384
+ from {
385
+ transform: translate3d(0, 100%, 0);
386
+ opacity: 0;
387
+ }
388
+ }
389
+
390
+ .ax-checkbox {
391
+ margin: 0px;
392
+ height: 1rem;
393
+ width: 1rem;
394
+ cursor: pointer;
395
+ appearance: none;
396
+ border-radius: 0.25rem;
397
+ border-width: 1px;
398
+ border-color: rgba(var(--ax-color-border-default));
399
+ background-color: rgba(var(--ax-color-input-surface));
400
+ vertical-align: middle;
401
+ outline: 2px solid transparent;
402
+ outline-offset: 2px;
403
+ }
404
+ .ax-checkbox:checked, .ax-checkbox:indeterminate {
405
+ border-color: rgba(var(--ax-color-primary-500)) !important;
406
+ background-color: rgba(var(--ax-color-primary-500)) !important;
407
+ background-size: contain;
408
+ background-repeat: no-repeat;
409
+ }
410
+ .ax-checkbox:checked {
411
+ background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
412
+ }
413
+ .ax-checkbox:indeterminate {
414
+ background-image: url("data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9PC9zdHlsZT48L2RlZnM+PHJlY3QgY2xhc3M9ImNscy0xIiB4PSIzIiB5PSI3IiB3aWR0aD0iMTAiIGhlaWdodD0iMiIvPjwvc3ZnPg==");
415
+ }
416
+ .ax-checkbox:focus-visible, .ax-checkbox:focus {
417
+ box-shadow: 0px 0px 0px 2px rgba(var(--ax-color-surface)), 0px 0px 0px 4px rgba(var(--ax-color-primary-500));
418
+ }
419
+ .ax-checkbox:disabled {
420
+ cursor: not-allowed;
421
+ opacity: 0.5;
422
+ }
423
+
424
+ .ax-el-primary-solid {
425
+ background-color: rgba(var(--ax-color-primary-500));
426
+ color: rgba(var(--ax-color-primary-fore));
427
+ border-color: rgba(var(--ax-color-primary-500));
428
+ }
429
+ .ax-el-primary-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
430
+ background-color: rgba(var(--ax-color-primary-600));
431
+ }
432
+ .ax-el-primary-solid.ax-state-selected {
433
+ background-color: rgba(var(--ax-color-primary-700));
434
+ }
435
+ .ax-el-primary-solid .ax-ripple {
436
+ background-color: rgba(var(--ax-color-primary-300), 0.3) !important;
437
+ }
438
+ .ax-el-primary-solid ax-loading-spinner .ax-loader {
439
+ border-color: rgba(var(--ax-color-primary-fore));
440
+ border-bottom-color: transparent;
441
+ }
442
+ .ax-el-primary-solid:is(.ax-el-primary-solid:focus-visible, .ax-el-primary-solid.ax-state-focus) {
443
+ outline-color: rgba(var(--ax-color-primary-500));
444
+ }
445
+ .ax-el-primary-solid > button:is(.ax-el-primary-solid > button:focus-visible, .ax-el-primary-solid > button.ax-state-focus) {
446
+ outline-color: rgba(var(--ax-color-primary-500));
447
+ }
448
+ .ax-el-primary-solid.ax-dropdown-button-marker {
449
+ border-inline-start-color: rgba(var(--ax-color-primary-600));
450
+ }
451
+
452
+ .ax-el-primary-twotone {
453
+ background-color: rgba(var(--ax-color-primary-100));
454
+ color: rgba(var(--ax-color-primary-fore-tint));
455
+ border-color: rgba(var(--ax-color-primary-100));
456
+ }
457
+ .ax-el-primary-twotone.ax-el-interactive:hover:not(.ax-state-disabled) {
458
+ background-color: rgba(var(--ax-color-primary-200));
459
+ }
460
+ .ax-el-primary-twotone.ax-state-selected {
461
+ background-color: rgba(var(--ax-color-primary-300));
462
+ }
463
+ .ax-el-primary-twotone .ax-ripple {
464
+ background-color: rgba(var(--ax-color-primary-500), 0.3) !important;
465
+ }
466
+ .ax-el-primary-twotone ax-loading-spinner .ax-loader {
467
+ border-color: rgba(var(--ax-color-primary-fore-tint));
468
+ border-bottom-color: transparent;
469
+ }
470
+ .ax-el-primary-twotone:is(.ax-el-primary-twotone:focus-visible, .ax-el-primary-twotone.ax-state-focus) {
471
+ outline-color: rgba(var(--ax-color-primary-500));
472
+ }
473
+ .ax-el-primary-twotone > button:is(.ax-el-primary-twotone > button:focus-visible, .ax-el-primary-twotone > button.ax-state-focus) {
474
+ outline-color: rgba(var(--ax-color-primary-500));
475
+ }
476
+ .ax-el-primary-twotone.ax-dropdown-button-marker {
477
+ border-inline-start-color: rgba(var(--ax-color-primary-50));
478
+ }
479
+
480
+ .ax-el-primary-outline {
481
+ background-color: transparent;
482
+ color: rgba(var(--ax-color-primary-500));
483
+ border-color: rgba(var(--ax-color-primary-500));
484
+ border-width: 1px;
485
+ }
486
+ .ax-el-primary-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
487
+ color: rgba(var(--ax-color-primary-700));
488
+ border-color: rgba(var(--ax-color-primary-700));
489
+ }
490
+ .ax-el-primary-outline.ax-state-selected {
491
+ border-color: rgba(var(--ax-color-primary-500));
492
+ color: rgba(var(--ax-color-primary-fore));
493
+ background-color: rgba(var(--ax-color-primary-500));
494
+ }
495
+ .ax-el-primary-outline .ax-ripple {
496
+ background-color: rgba(var(--ax-color-primary-500), 0.3) !important;
497
+ }
498
+ .ax-el-primary-outline ax-loading-spinner .ax-loader {
499
+ border-color: rgba(var(--ax-color-primary-500));
500
+ border-bottom-color: transparent;
501
+ }
502
+ .ax-el-primary-outline:is(.ax-el-primary-outline:focus-visible, .ax-el-primary-outline.ax-state-focus) {
503
+ outline-offset: -2px;
504
+ outline-color: rgba(var(--ax-color-primary-500));
505
+ color: rgba(var(--ax-color-primary-fore-tint));
506
+ }
507
+ .ax-el-primary-outline > button:is(.ax-el-primary-outline > button:focus-visible, .ax-el-primary-outline > button.ax-state-focus) {
508
+ outline-offset: -2px;
509
+ outline-color: rgba(var(--ax-color-primary-500));
510
+ color: rgba(var(--ax-color-primary-fore-tint));
511
+ }
512
+ .ax-el-primary-outline.ax-dropdown-button-marker {
513
+ border-inline-start-color: rgba(var(--ax-color-primary-500));
514
+ }
515
+
516
+ .ax-el-primary-blank {
517
+ color: rgba(var(--ax-color-primary-500));
518
+ }
519
+ .ax-el-primary-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
520
+ color: rgba(var(--ax-color-primary-fore-tint));
521
+ }
522
+ .ax-el-primary-blank.ax-state-selected {
523
+ background-color: rgba(var(--ax-color-primary-700));
524
+ color: rgba(var(--ax-color-primary-fore));
525
+ }
526
+ .ax-el-primary-blank .ax-ripple {
527
+ background-color: rgba(var(--ax-color-primary-500), 0.3);
528
+ }
529
+ .ax-el-primary-blank ax-loading-spinner .ax-loader {
530
+ border-color: rgba(var(--ax-color-primary-500));
531
+ border-bottom-color: transparent;
532
+ }
533
+ .ax-el-primary-blank:is(.ax-el-primary-blank:focus-visible, .ax-el-primary-blank.ax-state-focus) {
534
+ outline-color: rgba(var(--ax-color-primary-300));
535
+ outline-offset: 0;
536
+ }
537
+ .ax-el-primary-blank > button:is(.ax-el-primary-blank > button:focus-visible, .ax-el-primary-blank > button.ax-state-focus) {
538
+ outline-color: rgba(var(--ax-color-primary-300));
539
+ outline-offset: 0;
540
+ }
541
+ .ax-el-primary-blank.ax-dropdown-button-marker {
542
+ border-inline-start-color: transparent;
543
+ }
544
+
545
+ .ax-el-secondary-solid {
546
+ background-color: rgba(var(--ax-color-secondary-500));
547
+ color: rgba(var(--ax-color-secondary-fore));
548
+ border-color: rgba(var(--ax-color-secondary-500));
549
+ }
550
+ .ax-el-secondary-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
551
+ background-color: rgba(var(--ax-color-secondary-600));
552
+ }
553
+ .ax-el-secondary-solid.ax-state-selected {
554
+ background-color: rgba(var(--ax-color-secondary-700));
555
+ }
556
+ .ax-el-secondary-solid .ax-ripple {
557
+ background-color: rgba(var(--ax-color-secondary-300), 0.3) !important;
558
+ }
559
+ .ax-el-secondary-solid ax-loading-spinner .ax-loader {
560
+ border-color: rgba(var(--ax-color-secondary-fore));
561
+ border-bottom-color: transparent;
562
+ }
563
+ .ax-el-secondary-solid:is(.ax-el-secondary-solid:focus-visible, .ax-el-secondary-solid.ax-state-focus) {
564
+ outline-color: rgba(var(--ax-color-secondary-500));
565
+ }
566
+ .ax-el-secondary-solid > button:is(.ax-el-secondary-solid > button:focus-visible, .ax-el-secondary-solid > button.ax-state-focus) {
567
+ outline-color: rgba(var(--ax-color-secondary-500));
568
+ }
569
+ .ax-el-secondary-solid.ax-dropdown-button-marker {
570
+ border-inline-start-color: rgba(var(--ax-color-secondary-600));
571
+ }
572
+
573
+ .ax-el-secondary-twotone {
574
+ background-color: rgba(var(--ax-color-secondary-100));
575
+ color: rgba(var(--ax-color-secondary-fore-tint));
576
+ border-color: rgba(var(--ax-color-secondary-100));
577
+ }
578
+ .ax-el-secondary-twotone.ax-el-interactive:hover:not(.ax-state-disabled) {
579
+ background-color: rgba(var(--ax-color-secondary-200));
580
+ }
581
+ .ax-el-secondary-twotone.ax-state-selected {
582
+ background-color: rgba(var(--ax-color-secondary-300));
583
+ }
584
+ .ax-el-secondary-twotone .ax-ripple {
585
+ background-color: rgba(var(--ax-color-secondary-500), 0.3) !important;
586
+ }
587
+ .ax-el-secondary-twotone ax-loading-spinner .ax-loader {
588
+ border-color: rgba(var(--ax-color-secondary-fore-tint));
589
+ border-bottom-color: transparent;
590
+ }
591
+ .ax-el-secondary-twotone:is(.ax-el-secondary-twotone:focus-visible, .ax-el-secondary-twotone.ax-state-focus) {
592
+ outline-color: rgba(var(--ax-color-secondary-500));
593
+ }
594
+ .ax-el-secondary-twotone > button:is(.ax-el-secondary-twotone > button:focus-visible, .ax-el-secondary-twotone > button.ax-state-focus) {
595
+ outline-color: rgba(var(--ax-color-secondary-500));
596
+ }
597
+ .ax-el-secondary-twotone.ax-dropdown-button-marker {
598
+ border-inline-start-color: rgba(var(--ax-color-secondary-50));
599
+ }
600
+
601
+ .ax-el-secondary-outline {
602
+ background-color: transparent;
603
+ color: rgba(var(--ax-color-secondary-500));
604
+ border-color: rgba(var(--ax-color-secondary-500));
605
+ border-width: 1px;
606
+ }
607
+ .ax-el-secondary-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
608
+ color: rgba(var(--ax-color-secondary-700));
609
+ border-color: rgba(var(--ax-color-secondary-700));
610
+ }
611
+ .ax-el-secondary-outline.ax-state-selected {
612
+ border-color: rgba(var(--ax-color-secondary-500));
613
+ color: rgba(var(--ax-color-secondary-fore));
614
+ background-color: rgba(var(--ax-color-secondary-500));
615
+ }
616
+ .ax-el-secondary-outline .ax-ripple {
617
+ background-color: rgba(var(--ax-color-secondary-500), 0.3) !important;
618
+ }
619
+ .ax-el-secondary-outline ax-loading-spinner .ax-loader {
620
+ border-color: rgba(var(--ax-color-secondary-500));
621
+ border-bottom-color: transparent;
622
+ }
623
+ .ax-el-secondary-outline:is(.ax-el-secondary-outline:focus-visible, .ax-el-secondary-outline.ax-state-focus) {
624
+ outline-offset: -2px;
625
+ outline-color: rgba(var(--ax-color-secondary-500));
626
+ color: rgba(var(--ax-color-secondary-fore-tint));
627
+ }
628
+ .ax-el-secondary-outline > button:is(.ax-el-secondary-outline > button:focus-visible, .ax-el-secondary-outline > button.ax-state-focus) {
629
+ outline-offset: -2px;
630
+ outline-color: rgba(var(--ax-color-secondary-500));
631
+ color: rgba(var(--ax-color-secondary-fore-tint));
632
+ }
633
+ .ax-el-secondary-outline.ax-dropdown-button-marker {
634
+ border-inline-start-color: rgba(var(--ax-color-secondary-500));
635
+ }
636
+
637
+ .ax-el-secondary-blank {
638
+ color: rgba(var(--ax-color-secondary-500));
639
+ }
640
+ .ax-el-secondary-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
641
+ color: rgba(var(--ax-color-secondary-fore-tint));
642
+ }
643
+ .ax-el-secondary-blank.ax-state-selected {
644
+ background-color: rgba(var(--ax-color-secondary-700));
645
+ color: rgba(var(--ax-color-secondary-fore));
646
+ }
647
+ .ax-el-secondary-blank .ax-ripple {
648
+ background-color: rgba(var(--ax-color-secondary-500), 0.3);
649
+ }
650
+ .ax-el-secondary-blank ax-loading-spinner .ax-loader {
651
+ border-color: rgba(var(--ax-color-secondary-500));
652
+ border-bottom-color: transparent;
653
+ }
654
+ .ax-el-secondary-blank:is(.ax-el-secondary-blank:focus-visible, .ax-el-secondary-blank.ax-state-focus) {
655
+ outline-color: rgba(var(--ax-color-secondary-300));
656
+ outline-offset: 0;
657
+ }
658
+ .ax-el-secondary-blank > button:is(.ax-el-secondary-blank > button:focus-visible, .ax-el-secondary-blank > button.ax-state-focus) {
659
+ outline-color: rgba(var(--ax-color-secondary-300));
660
+ outline-offset: 0;
661
+ }
662
+ .ax-el-secondary-blank.ax-dropdown-button-marker {
663
+ border-inline-start-color: transparent;
664
+ }
665
+
666
+ .ax-el-success-solid {
667
+ background-color: rgba(var(--ax-color-success-500));
668
+ color: rgba(var(--ax-color-success-fore));
669
+ border-color: rgba(var(--ax-color-success-500));
670
+ }
671
+ .ax-el-success-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
672
+ background-color: rgba(var(--ax-color-success-600));
673
+ }
674
+ .ax-el-success-solid.ax-state-selected {
675
+ background-color: rgba(var(--ax-color-success-700));
676
+ }
677
+ .ax-el-success-solid .ax-ripple {
678
+ background-color: rgba(var(--ax-color-success-300), 0.3) !important;
679
+ }
680
+ .ax-el-success-solid ax-loading-spinner .ax-loader {
681
+ border-color: rgba(var(--ax-color-success-fore));
682
+ border-bottom-color: transparent;
683
+ }
684
+ .ax-el-success-solid:is(.ax-el-success-solid:focus-visible, .ax-el-success-solid.ax-state-focus) {
685
+ outline-color: rgba(var(--ax-color-success-500));
686
+ }
687
+ .ax-el-success-solid > button:is(.ax-el-success-solid > button:focus-visible, .ax-el-success-solid > button.ax-state-focus) {
688
+ outline-color: rgba(var(--ax-color-success-500));
689
+ }
690
+ .ax-el-success-solid.ax-dropdown-button-marker {
691
+ border-inline-start-color: rgba(var(--ax-color-success-600));
692
+ }
693
+
694
+ .ax-el-success-twotone {
695
+ background-color: rgba(var(--ax-color-success-100));
696
+ color: rgba(var(--ax-color-success-fore-tint));
697
+ border-color: rgba(var(--ax-color-success-100));
698
+ }
699
+ .ax-el-success-twotone.ax-el-interactive:hover:not(.ax-state-disabled) {
700
+ background-color: rgba(var(--ax-color-success-200));
701
+ }
702
+ .ax-el-success-twotone.ax-state-selected {
703
+ background-color: rgba(var(--ax-color-success-300));
704
+ }
705
+ .ax-el-success-twotone .ax-ripple {
706
+ background-color: rgba(var(--ax-color-success-500), 0.3) !important;
707
+ }
708
+ .ax-el-success-twotone ax-loading-spinner .ax-loader {
709
+ border-color: rgba(var(--ax-color-success-fore-tint));
710
+ border-bottom-color: transparent;
711
+ }
712
+ .ax-el-success-twotone:is(.ax-el-success-twotone:focus-visible, .ax-el-success-twotone.ax-state-focus) {
713
+ outline-color: rgba(var(--ax-color-success-500));
714
+ }
715
+ .ax-el-success-twotone > button:is(.ax-el-success-twotone > button:focus-visible, .ax-el-success-twotone > button.ax-state-focus) {
716
+ outline-color: rgba(var(--ax-color-success-500));
717
+ }
718
+ .ax-el-success-twotone.ax-dropdown-button-marker {
719
+ border-inline-start-color: rgba(var(--ax-color-success-50));
720
+ }
721
+
722
+ .ax-el-success-outline {
723
+ background-color: transparent;
724
+ color: rgba(var(--ax-color-success-500));
725
+ border-color: rgba(var(--ax-color-success-500));
726
+ border-width: 1px;
727
+ }
728
+ .ax-el-success-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
729
+ color: rgba(var(--ax-color-success-700));
730
+ border-color: rgba(var(--ax-color-success-700));
731
+ }
732
+ .ax-el-success-outline.ax-state-selected {
733
+ border-color: rgba(var(--ax-color-success-500));
734
+ color: rgba(var(--ax-color-success-fore));
735
+ background-color: rgba(var(--ax-color-success-500));
736
+ }
737
+ .ax-el-success-outline .ax-ripple {
738
+ background-color: rgba(var(--ax-color-success-500), 0.3) !important;
739
+ }
740
+ .ax-el-success-outline ax-loading-spinner .ax-loader {
741
+ border-color: rgba(var(--ax-color-success-500));
742
+ border-bottom-color: transparent;
743
+ }
744
+ .ax-el-success-outline:is(.ax-el-success-outline:focus-visible, .ax-el-success-outline.ax-state-focus) {
745
+ outline-offset: -2px;
746
+ outline-color: rgba(var(--ax-color-success-500));
747
+ color: rgba(var(--ax-color-success-fore-tint));
748
+ }
749
+ .ax-el-success-outline > button:is(.ax-el-success-outline > button:focus-visible, .ax-el-success-outline > button.ax-state-focus) {
750
+ outline-offset: -2px;
751
+ outline-color: rgba(var(--ax-color-success-500));
752
+ color: rgba(var(--ax-color-success-fore-tint));
753
+ }
754
+ .ax-el-success-outline.ax-dropdown-button-marker {
755
+ border-inline-start-color: rgba(var(--ax-color-success-500));
756
+ }
757
+
758
+ .ax-el-success-blank {
759
+ color: rgba(var(--ax-color-success-500));
760
+ }
761
+ .ax-el-success-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
762
+ color: rgba(var(--ax-color-success-fore-tint));
763
+ }
764
+ .ax-el-success-blank.ax-state-selected {
765
+ background-color: rgba(var(--ax-color-success-700));
766
+ color: rgba(var(--ax-color-success-fore));
767
+ }
768
+ .ax-el-success-blank .ax-ripple {
769
+ background-color: rgba(var(--ax-color-success-500), 0.3);
770
+ }
771
+ .ax-el-success-blank ax-loading-spinner .ax-loader {
772
+ border-color: rgba(var(--ax-color-success-500));
773
+ border-bottom-color: transparent;
774
+ }
775
+ .ax-el-success-blank:is(.ax-el-success-blank:focus-visible, .ax-el-success-blank.ax-state-focus) {
776
+ outline-color: rgba(var(--ax-color-success-300));
777
+ outline-offset: 0;
778
+ }
779
+ .ax-el-success-blank > button:is(.ax-el-success-blank > button:focus-visible, .ax-el-success-blank > button.ax-state-focus) {
780
+ outline-color: rgba(var(--ax-color-success-300));
781
+ outline-offset: 0;
782
+ }
783
+ .ax-el-success-blank.ax-dropdown-button-marker {
784
+ border-inline-start-color: transparent;
785
+ }
786
+
787
+ .ax-el-warning-solid {
788
+ background-color: rgba(var(--ax-color-warning-500));
789
+ color: rgba(var(--ax-color-warning-fore));
790
+ border-color: rgba(var(--ax-color-warning-500));
791
+ }
792
+ .ax-el-warning-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
793
+ background-color: rgba(var(--ax-color-warning-600));
794
+ }
795
+ .ax-el-warning-solid.ax-state-selected {
796
+ background-color: rgba(var(--ax-color-warning-700));
797
+ }
798
+ .ax-el-warning-solid .ax-ripple {
799
+ background-color: rgba(var(--ax-color-warning-300), 0.3) !important;
800
+ }
801
+ .ax-el-warning-solid ax-loading-spinner .ax-loader {
802
+ border-color: rgba(var(--ax-color-warning-fore));
803
+ border-bottom-color: transparent;
804
+ }
805
+ .ax-el-warning-solid:is(.ax-el-warning-solid:focus-visible, .ax-el-warning-solid.ax-state-focus) {
806
+ outline-color: rgba(var(--ax-color-warning-500));
807
+ }
808
+ .ax-el-warning-solid > button:is(.ax-el-warning-solid > button:focus-visible, .ax-el-warning-solid > button.ax-state-focus) {
809
+ outline-color: rgba(var(--ax-color-warning-500));
810
+ }
811
+ .ax-el-warning-solid.ax-dropdown-button-marker {
812
+ border-inline-start-color: rgba(var(--ax-color-warning-600));
813
+ }
814
+
815
+ .ax-el-warning-twotone {
816
+ background-color: rgba(var(--ax-color-warning-100));
817
+ color: rgba(var(--ax-color-warning-fore-tint));
818
+ border-color: rgba(var(--ax-color-warning-100));
819
+ }
820
+ .ax-el-warning-twotone.ax-el-interactive:hover:not(.ax-state-disabled) {
821
+ background-color: rgba(var(--ax-color-warning-200));
822
+ }
823
+ .ax-el-warning-twotone.ax-state-selected {
824
+ background-color: rgba(var(--ax-color-warning-300));
825
+ }
826
+ .ax-el-warning-twotone .ax-ripple {
827
+ background-color: rgba(var(--ax-color-warning-500), 0.3) !important;
828
+ }
829
+ .ax-el-warning-twotone ax-loading-spinner .ax-loader {
830
+ border-color: rgba(var(--ax-color-warning-fore-tint));
831
+ border-bottom-color: transparent;
832
+ }
833
+ .ax-el-warning-twotone:is(.ax-el-warning-twotone:focus-visible, .ax-el-warning-twotone.ax-state-focus) {
834
+ outline-color: rgba(var(--ax-color-warning-500));
835
+ }
836
+ .ax-el-warning-twotone > button:is(.ax-el-warning-twotone > button:focus-visible, .ax-el-warning-twotone > button.ax-state-focus) {
837
+ outline-color: rgba(var(--ax-color-warning-500));
838
+ }
839
+ .ax-el-warning-twotone.ax-dropdown-button-marker {
840
+ border-inline-start-color: rgba(var(--ax-color-warning-50));
841
+ }
842
+
843
+ .ax-el-warning-outline {
844
+ background-color: transparent;
845
+ color: rgba(var(--ax-color-warning-500));
846
+ border-color: rgba(var(--ax-color-warning-500));
847
+ border-width: 1px;
848
+ }
849
+ .ax-el-warning-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
850
+ color: rgba(var(--ax-color-warning-700));
851
+ border-color: rgba(var(--ax-color-warning-700));
852
+ }
853
+ .ax-el-warning-outline.ax-state-selected {
854
+ border-color: rgba(var(--ax-color-warning-500));
855
+ color: rgba(var(--ax-color-warning-fore));
856
+ background-color: rgba(var(--ax-color-warning-500));
857
+ }
858
+ .ax-el-warning-outline .ax-ripple {
859
+ background-color: rgba(var(--ax-color-warning-500), 0.3) !important;
860
+ }
861
+ .ax-el-warning-outline ax-loading-spinner .ax-loader {
862
+ border-color: rgba(var(--ax-color-warning-500));
863
+ border-bottom-color: transparent;
864
+ }
865
+ .ax-el-warning-outline:is(.ax-el-warning-outline:focus-visible, .ax-el-warning-outline.ax-state-focus) {
866
+ outline-offset: -2px;
867
+ outline-color: rgba(var(--ax-color-warning-500));
868
+ color: rgba(var(--ax-color-warning-fore-tint));
869
+ }
870
+ .ax-el-warning-outline > button:is(.ax-el-warning-outline > button:focus-visible, .ax-el-warning-outline > button.ax-state-focus) {
871
+ outline-offset: -2px;
872
+ outline-color: rgba(var(--ax-color-warning-500));
873
+ color: rgba(var(--ax-color-warning-fore-tint));
874
+ }
875
+ .ax-el-warning-outline.ax-dropdown-button-marker {
876
+ border-inline-start-color: rgba(var(--ax-color-warning-500));
877
+ }
878
+
879
+ .ax-el-warning-blank {
880
+ color: rgba(var(--ax-color-warning-500));
881
+ }
882
+ .ax-el-warning-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
883
+ color: rgba(var(--ax-color-warning-fore-tint));
884
+ }
885
+ .ax-el-warning-blank.ax-state-selected {
886
+ background-color: rgba(var(--ax-color-warning-700));
887
+ color: rgba(var(--ax-color-warning-fore));
888
+ }
889
+ .ax-el-warning-blank .ax-ripple {
890
+ background-color: rgba(var(--ax-color-warning-500), 0.3);
891
+ }
892
+ .ax-el-warning-blank ax-loading-spinner .ax-loader {
893
+ border-color: rgba(var(--ax-color-warning-500));
894
+ border-bottom-color: transparent;
895
+ }
896
+ .ax-el-warning-blank:is(.ax-el-warning-blank:focus-visible, .ax-el-warning-blank.ax-state-focus) {
897
+ outline-color: rgba(var(--ax-color-warning-300));
898
+ outline-offset: 0;
899
+ }
900
+ .ax-el-warning-blank > button:is(.ax-el-warning-blank > button:focus-visible, .ax-el-warning-blank > button.ax-state-focus) {
901
+ outline-color: rgba(var(--ax-color-warning-300));
902
+ outline-offset: 0;
903
+ }
904
+ .ax-el-warning-blank.ax-dropdown-button-marker {
905
+ border-inline-start-color: transparent;
906
+ }
907
+
908
+ .ax-el-danger-solid {
909
+ background-color: rgba(var(--ax-color-danger-500));
910
+ color: rgba(var(--ax-color-danger-fore));
911
+ border-color: rgba(var(--ax-color-danger-500));
912
+ }
913
+ .ax-el-danger-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
914
+ background-color: rgba(var(--ax-color-danger-600));
915
+ }
916
+ .ax-el-danger-solid.ax-state-selected {
917
+ background-color: rgba(var(--ax-color-danger-700));
918
+ }
919
+ .ax-el-danger-solid .ax-ripple {
920
+ background-color: rgba(var(--ax-color-danger-300), 0.3) !important;
921
+ }
922
+ .ax-el-danger-solid ax-loading-spinner .ax-loader {
923
+ border-color: rgba(var(--ax-color-danger-fore));
924
+ border-bottom-color: transparent;
925
+ }
926
+ .ax-el-danger-solid:is(.ax-el-danger-solid:focus-visible, .ax-el-danger-solid.ax-state-focus) {
927
+ outline-color: rgba(var(--ax-color-danger-500));
928
+ }
929
+ .ax-el-danger-solid > button:is(.ax-el-danger-solid > button:focus-visible, .ax-el-danger-solid > button.ax-state-focus) {
930
+ outline-color: rgba(var(--ax-color-danger-500));
931
+ }
932
+ .ax-el-danger-solid.ax-dropdown-button-marker {
933
+ border-inline-start-color: rgba(var(--ax-color-danger-600));
934
+ }
935
+
936
+ .ax-el-danger-twotone {
937
+ background-color: rgba(var(--ax-color-danger-100));
938
+ color: rgba(var(--ax-color-danger-fore-tint));
939
+ border-color: rgba(var(--ax-color-danger-100));
940
+ }
941
+ .ax-el-danger-twotone.ax-el-interactive:hover:not(.ax-state-disabled) {
942
+ background-color: rgba(var(--ax-color-danger-200));
943
+ }
944
+ .ax-el-danger-twotone.ax-state-selected {
945
+ background-color: rgba(var(--ax-color-danger-300));
946
+ }
947
+ .ax-el-danger-twotone .ax-ripple {
948
+ background-color: rgba(var(--ax-color-danger-500), 0.3) !important;
949
+ }
950
+ .ax-el-danger-twotone ax-loading-spinner .ax-loader {
951
+ border-color: rgba(var(--ax-color-danger-fore-tint));
952
+ border-bottom-color: transparent;
953
+ }
954
+ .ax-el-danger-twotone:is(.ax-el-danger-twotone:focus-visible, .ax-el-danger-twotone.ax-state-focus) {
955
+ outline-color: rgba(var(--ax-color-danger-500));
956
+ }
957
+ .ax-el-danger-twotone > button:is(.ax-el-danger-twotone > button:focus-visible, .ax-el-danger-twotone > button.ax-state-focus) {
958
+ outline-color: rgba(var(--ax-color-danger-500));
959
+ }
960
+ .ax-el-danger-twotone.ax-dropdown-button-marker {
961
+ border-inline-start-color: rgba(var(--ax-color-danger-50));
962
+ }
963
+
964
+ .ax-el-danger-outline {
965
+ background-color: transparent;
966
+ color: rgba(var(--ax-color-danger-500));
967
+ border-color: rgba(var(--ax-color-danger-500));
968
+ border-width: 1px;
969
+ }
970
+ .ax-el-danger-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
971
+ color: rgba(var(--ax-color-danger-700));
972
+ border-color: rgba(var(--ax-color-danger-700));
973
+ }
974
+ .ax-el-danger-outline.ax-state-selected {
975
+ border-color: rgba(var(--ax-color-danger-500));
976
+ color: rgba(var(--ax-color-danger-fore));
977
+ background-color: rgba(var(--ax-color-danger-500));
978
+ }
979
+ .ax-el-danger-outline .ax-ripple {
980
+ background-color: rgba(var(--ax-color-danger-500), 0.3) !important;
981
+ }
982
+ .ax-el-danger-outline ax-loading-spinner .ax-loader {
983
+ border-color: rgba(var(--ax-color-danger-500));
984
+ border-bottom-color: transparent;
985
+ }
986
+ .ax-el-danger-outline:is(.ax-el-danger-outline:focus-visible, .ax-el-danger-outline.ax-state-focus) {
987
+ outline-offset: -2px;
988
+ outline-color: rgba(var(--ax-color-danger-500));
989
+ color: rgba(var(--ax-color-danger-fore-tint));
990
+ }
991
+ .ax-el-danger-outline > button:is(.ax-el-danger-outline > button:focus-visible, .ax-el-danger-outline > button.ax-state-focus) {
992
+ outline-offset: -2px;
993
+ outline-color: rgba(var(--ax-color-danger-500));
994
+ color: rgba(var(--ax-color-danger-fore-tint));
995
+ }
996
+ .ax-el-danger-outline.ax-dropdown-button-marker {
997
+ border-inline-start-color: rgba(var(--ax-color-danger-500));
998
+ }
999
+
1000
+ .ax-el-danger-blank {
1001
+ color: rgba(var(--ax-color-danger-500));
1002
+ }
1003
+ .ax-el-danger-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
1004
+ color: rgba(var(--ax-color-danger-fore-tint));
1005
+ }
1006
+ .ax-el-danger-blank.ax-state-selected {
1007
+ background-color: rgba(var(--ax-color-danger-700));
1008
+ color: rgba(var(--ax-color-danger-fore));
1009
+ }
1010
+ .ax-el-danger-blank .ax-ripple {
1011
+ background-color: rgba(var(--ax-color-danger-500), 0.3);
1012
+ }
1013
+ .ax-el-danger-blank ax-loading-spinner .ax-loader {
1014
+ border-color: rgba(var(--ax-color-danger-500));
1015
+ border-bottom-color: transparent;
1016
+ }
1017
+ .ax-el-danger-blank:is(.ax-el-danger-blank:focus-visible, .ax-el-danger-blank.ax-state-focus) {
1018
+ outline-color: rgba(var(--ax-color-danger-300));
1019
+ outline-offset: 0;
1020
+ }
1021
+ .ax-el-danger-blank > button:is(.ax-el-danger-blank > button:focus-visible, .ax-el-danger-blank > button.ax-state-focus) {
1022
+ outline-color: rgba(var(--ax-color-danger-300));
1023
+ outline-offset: 0;
1024
+ }
1025
+ .ax-el-danger-blank.ax-dropdown-button-marker {
1026
+ border-inline-start-color: transparent;
1027
+ }
1028
+
1029
+ .ax-el-info-solid {
1030
+ background-color: rgba(var(--ax-color-info-500));
1031
+ color: rgba(var(--ax-color-info-fore));
1032
+ border-color: rgba(var(--ax-color-info-500));
1033
+ }
1034
+ .ax-el-info-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
1035
+ background-color: rgba(var(--ax-color-info-600));
1036
+ }
1037
+ .ax-el-info-solid.ax-state-selected {
1038
+ background-color: rgba(var(--ax-color-info-700));
1039
+ }
1040
+ .ax-el-info-solid .ax-ripple {
1041
+ background-color: rgba(var(--ax-color-info-300), 0.3) !important;
1042
+ }
1043
+ .ax-el-info-solid ax-loading-spinner .ax-loader {
1044
+ border-color: rgba(var(--ax-color-info-fore));
1045
+ border-bottom-color: transparent;
1046
+ }
1047
+ .ax-el-info-solid:is(.ax-el-info-solid:focus-visible, .ax-el-info-solid.ax-state-focus) {
1048
+ outline-color: rgba(var(--ax-color-info-500));
1049
+ }
1050
+ .ax-el-info-solid > button:is(.ax-el-info-solid > button:focus-visible, .ax-el-info-solid > button.ax-state-focus) {
1051
+ outline-color: rgba(var(--ax-color-info-500));
1052
+ }
1053
+ .ax-el-info-solid.ax-dropdown-button-marker {
1054
+ border-inline-start-color: rgba(var(--ax-color-info-600));
1055
+ }
1056
+
1057
+ .ax-el-info-twotone {
1058
+ background-color: rgba(var(--ax-color-info-100));
1059
+ color: rgba(var(--ax-color-info-fore-tint));
1060
+ border-color: rgba(var(--ax-color-info-100));
1061
+ }
1062
+ .ax-el-info-twotone.ax-el-interactive:hover:not(.ax-state-disabled) {
1063
+ background-color: rgba(var(--ax-color-info-200));
1064
+ }
1065
+ .ax-el-info-twotone.ax-state-selected {
1066
+ background-color: rgba(var(--ax-color-info-300));
1067
+ }
1068
+ .ax-el-info-twotone .ax-ripple {
1069
+ background-color: rgba(var(--ax-color-info-500), 0.3) !important;
1070
+ }
1071
+ .ax-el-info-twotone ax-loading-spinner .ax-loader {
1072
+ border-color: rgba(var(--ax-color-info-fore-tint));
1073
+ border-bottom-color: transparent;
1074
+ }
1075
+ .ax-el-info-twotone:is(.ax-el-info-twotone:focus-visible, .ax-el-info-twotone.ax-state-focus) {
1076
+ outline-color: rgba(var(--ax-color-info-500));
1077
+ }
1078
+ .ax-el-info-twotone > button:is(.ax-el-info-twotone > button:focus-visible, .ax-el-info-twotone > button.ax-state-focus) {
1079
+ outline-color: rgba(var(--ax-color-info-500));
1080
+ }
1081
+ .ax-el-info-twotone.ax-dropdown-button-marker {
1082
+ border-inline-start-color: rgba(var(--ax-color-info-50));
1083
+ }
1084
+
1085
+ .ax-el-info-outline {
1086
+ background-color: transparent;
1087
+ color: rgba(var(--ax-color-info-500));
1088
+ border-color: rgba(var(--ax-color-info-500));
1089
+ border-width: 1px;
1090
+ }
1091
+ .ax-el-info-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
1092
+ color: rgba(var(--ax-color-info-700));
1093
+ border-color: rgba(var(--ax-color-info-700));
1094
+ }
1095
+ .ax-el-info-outline.ax-state-selected {
1096
+ border-color: rgba(var(--ax-color-info-500));
1097
+ color: rgba(var(--ax-color-info-fore));
1098
+ background-color: rgba(var(--ax-color-info-500));
1099
+ }
1100
+ .ax-el-info-outline .ax-ripple {
1101
+ background-color: rgba(var(--ax-color-info-500), 0.3) !important;
1102
+ }
1103
+ .ax-el-info-outline ax-loading-spinner .ax-loader {
1104
+ border-color: rgba(var(--ax-color-info-500));
1105
+ border-bottom-color: transparent;
1106
+ }
1107
+ .ax-el-info-outline:is(.ax-el-info-outline:focus-visible, .ax-el-info-outline.ax-state-focus) {
1108
+ outline-offset: -2px;
1109
+ outline-color: rgba(var(--ax-color-info-500));
1110
+ color: rgba(var(--ax-color-info-fore-tint));
1111
+ }
1112
+ .ax-el-info-outline > button:is(.ax-el-info-outline > button:focus-visible, .ax-el-info-outline > button.ax-state-focus) {
1113
+ outline-offset: -2px;
1114
+ outline-color: rgba(var(--ax-color-info-500));
1115
+ color: rgba(var(--ax-color-info-fore-tint));
1116
+ }
1117
+ .ax-el-info-outline.ax-dropdown-button-marker {
1118
+ border-inline-start-color: rgba(var(--ax-color-info-500));
1119
+ }
1120
+
1121
+ .ax-el-info-blank {
1122
+ color: rgba(var(--ax-color-info-500));
1123
+ }
1124
+ .ax-el-info-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
1125
+ color: rgba(var(--ax-color-info-fore-tint));
1126
+ }
1127
+ .ax-el-info-blank.ax-state-selected {
1128
+ background-color: rgba(var(--ax-color-info-700));
1129
+ color: rgba(var(--ax-color-info-fore));
1130
+ }
1131
+ .ax-el-info-blank .ax-ripple {
1132
+ background-color: rgba(var(--ax-color-info-500), 0.3);
1133
+ }
1134
+ .ax-el-info-blank ax-loading-spinner .ax-loader {
1135
+ border-color: rgba(var(--ax-color-info-500));
1136
+ border-bottom-color: transparent;
1137
+ }
1138
+ .ax-el-info-blank:is(.ax-el-info-blank:focus-visible, .ax-el-info-blank.ax-state-focus) {
1139
+ outline-color: rgba(var(--ax-color-info-300));
1140
+ outline-offset: 0;
1141
+ }
1142
+ .ax-el-info-blank > button:is(.ax-el-info-blank > button:focus-visible, .ax-el-info-blank > button.ax-state-focus) {
1143
+ outline-color: rgba(var(--ax-color-info-300));
1144
+ outline-offset: 0;
1145
+ }
1146
+ .ax-el-info-blank.ax-dropdown-button-marker {
1147
+ border-inline-start-color: transparent;
1148
+ }
1149
+
1150
+ .ax-el-ghost-solid {
1151
+ border-width: 1px;
1152
+ border-color: rgba(var(--ax-color-border-default));
1153
+ background-color: rgba(var(--ax-color-ghost));
1154
+ color: rgba(var(--ax-color-ghost-fore));
1155
+ --ax-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
1156
+ --ax-shadow-colored: 0 1px 2px 0 var(--ax-shadow-color);
1157
+ box-shadow: var(--ax-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)), var(--ax-ring-shadow, 0 0 rgba(0, 0, 0, 0)), var(--ax-shadow);
1158
+ }
1159
+ .ax-el-ghost-solid.ax-el-interactive:hover:not(.ax-el-ghost-solid.ax-el-interactive:hover.ax-state-selected, .ax-el-ghost-solid.ax-el-interactive:hover.ax-state-disabled) {
1160
+ border-color: rgba(var(--ax-color-primary-500));
1161
+ color: rgba(var(--ax-color-primary-500));
1162
+ }
1163
+ .ax-el-ghost-solid.ax-el-interactive:hover + .ax-dropdown-button-marker {
1164
+ border-inline-start-color: rgba(var(--ax-color-primary-500));
1165
+ }
1166
+ .ax-el-ghost-solid.ax-el-interactive:active {
1167
+ border-color: rgba(var(--ax-color-primary-700));
1168
+ color: rgba(var(--ax-color-primary-700));
1169
+ }
1170
+ .ax-el-ghost-solid.ax-state-selected {
1171
+ border-color: rgba(var(--ax-color-primary-500));
1172
+ background-color: rgba(var(--ax-color-primary-500));
1173
+ color: rgba(var(--ax-color-primary-fore));
1174
+ }
1175
+ .ax-el-ghost-solid .ax-ripple {
1176
+ background-color: rgba(var(--ax-color-primary-500), 0.3) !important;
1177
+ }
1178
+ .ax-el-ghost-solid ax-loading-spinner .ax-loader {
1179
+ border-color: rgba(var(--ax-color-ghost-fore));
1180
+ border-bottom-color: transparent;
1181
+ }
1182
+ .ax-el-ghost-solid.ax-dropdown-button-marker {
1183
+ border-inline-start-color: rgba(var(--ax-color-border-default));
1184
+ }
1185
+
1186
+ .ax-el-ghost-outline {
1187
+ border-width: 1px;
1188
+ border-color: rgba(var(--ax-color-border-default));
1189
+ background-color: transparent;
1190
+ color: rgba(var(--ax-color-ghost-fore));
1191
+ }
1192
+ .ax-el-ghost-outline.ax-el-interactive:hover:not(.ax-el-ghost-outline.ax-el-interactive:hover.ax-state-selected, .ax-el-ghost-outline.ax-el-interactive:hover.ax-state-disabled) {
1193
+ border-color: rgba(var(--ax-color-primary-500));
1194
+ color: rgba(var(--ax-color-primary-500));
1195
+ }
1196
+ .ax-el-ghost-outline.ax-el-interactive:hover + .ax-dropdown-button-marker {
1197
+ border-inline-start-color: rgba(var(--ax-color-primary-500));
1198
+ }
1199
+ .ax-el-ghost-outline.ax-state-selected {
1200
+ border-color: rgba(var(--ax-color-primary-500));
1201
+ color: rgba(var(--ax-color-primary-fore));
1202
+ }
1203
+ .ax-el-ghost-outline .ax-ripple {
1204
+ background-color: rgba(var(--ax-color-primary-500), 0.3) !important;
1205
+ }
1206
+ .ax-el-ghost-outline ax-loading-spinner .ax-loader {
1207
+ border-color: rgba(var(--ax-color-ghost-fore));
1208
+ border-bottom-color: transparent;
1209
+ }
1210
+ .ax-el-ghost-outline.ax-dropdown-button-marker {
1211
+ border-inline-start-color: rgba(var(--ax-color-border-default));
1212
+ }
1213
+
1214
+ .ax-el-ghost-blank {
1215
+ border-style: none;
1216
+ background-color: transparent;
1217
+ color: rgba(var(--ax-color-ghost-fore));
1218
+ }
1219
+ .ax-el-ghost-blank.ax-state-selected {
1220
+ background-color: rgba(var(--ax-color-primary-500));
1221
+ color: rgba(var(--ax-color-primary-fore));
1222
+ }
1223
+ .ax-el-ghost-blank.ax-el-interactive:hover:not(.ax-el-ghost-blank.ax-el-interactive:hover.ax-state-selected, .ax-el-ghost-blank.ax-el-interactive:hover.ax-state-disabled) {
1224
+ border-color: rgba(var(--ax-color-primary-700));
1225
+ color: rgba(var(--ax-color-primary-700));
1226
+ }
1227
+ .ax-el-ghost-blank.ax-el-interactive:active {
1228
+ border-color: rgba(var(--ax-color-primary-800));
1229
+ color: rgba(var(--ax-color-primary-800));
1230
+ }
1231
+ .ax-el-ghost-blank .ax-ripple {
1232
+ background-color: rgba(var(--ax-color-primary-500), 0.3) !important;
1233
+ }
1234
+ .ax-el-ghost-blank ax-loading-spinner .ax-loader {
1235
+ border-color: rgba(var(--ax-color-ghost-fore));
1236
+ border-bottom-color: transparent;
1237
+ }
1238
+ .ax-el-ghost-blank > button:is(.ax-el-ghost-blank > button:focus-visible, .ax-el-ghost-blank > button.ax-state-focus) {
1239
+ outline-color: rgba(var(--ax-color-primary-500));
1240
+ }
1241
+ .ax-el-ghost-blank.ax-dropdown-button-marker {
1242
+ border-inline-start-color: rgba(var(--ax-color-border-default));
1243
+ }
1244
+
1245
+ .ax-el-ghost-twotone {
1246
+ border-color: transparent;
1247
+ background-color: rgba(var(--ax-color-ghost-fore), 0.05);
1248
+ color: rgba(var(--ax-color-ghost-fore));
1249
+ }
1250
+ .ax-el-ghost-twotone.ax-el-interactive:hover:not(.ax-el-ghost-twotone.ax-el-interactive:hover.ax-state-selected, .ax-el-ghost-twotone.ax-el-interactive:hover.ax-state-disabled) {
1251
+ background-color: rgba(var(--ax-color-primary-200));
1252
+ color: rgba(var(--ax-color-primary-fore-tint));
1253
+ }
1254
+ .ax-el-ghost-twotone.ax-el-interactive:hover + .ax-dropdown-button-marker {
1255
+ border-inline-start-color: rgba(var(--ax-color-primary-500));
1256
+ }
1257
+ .ax-el-ghost-twotone.ax-el-interactive:active {
1258
+ background-color: rgba(var(--ax-color-primary-300));
1259
+ color: rgba(var(--ax-color-primary-fore-tint));
1260
+ }
1261
+ .ax-el-ghost-twotone.ax-state-selected {
1262
+ border-color: rgba(var(--ax-color-primary-300));
1263
+ background-color: rgba(var(--ax-color-primary-400));
1264
+ color: rgba(var(--ax-color-primary-fore-tint));
1265
+ }
1266
+ .ax-el-ghost-twotone .ax-ripple {
1267
+ background-color: rgba(var(--ax-color-primary-500), 0.3) !important;
1268
+ }
1269
+ .ax-el-ghost-twotone ax-loading-spinner .ax-loader {
1270
+ border-color: rgba(var(--ax-color-ghost-fore));
1271
+ border-bottom-color: transparent;
1272
+ }
1273
+ .ax-el-ghost-twotone > button:is(.ax-el-ghost-twotone > button:focus-visible, .ax-el-ghost-twotone > button.ax-state-focus) {
1274
+ outline-color: rgba(var(--ax-color-primary-500));
1275
+ }
1276
+ .ax-el-ghost-twotone.ax-dropdown-button-marker {
1277
+ border-inline-start-color: rgba(var(--ax-color-border-default));
1278
+ }
1279
+
1280
+ .ax-dark .ax-el-primary-solid {
1281
+ background-color: rgba(var(--ax-color-primary-200));
1282
+ color: rgba(var(--ax-color-primary-fore-tint));
1283
+ border-color: rgba(var(--ax-color-primary-200));
1284
+ }
1285
+ .ax-dark .ax-el-primary-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
1286
+ background-color: rgba(var(--ax-color-primary-300));
1287
+ color: rgba(var(--ax-color-primary-fore-tint));
1288
+ }
1289
+ .ax-dark .ax-el-primary-solid.ax-state-selected {
1290
+ background-color: rgba(var(--ax-color-primary-400));
1291
+ }
1292
+ .ax-dark .ax-el-primary-solid .ax-ripple {
1293
+ background-color: rgba(var(--ax-color-primary-500), 0.3) !important;
1294
+ }
1295
+ .ax-dark .ax-el-primary-solid ax-loading-spinner .ax-loader {
1296
+ border-color: rgba(var(--ax-color-primary-fore-tint));
1297
+ border-bottom-color: transparent;
1298
+ }
1299
+ .ax-dark .ax-el-primary-solid > button:is(.ax-dark .ax-el-primary-solid > button:focus-visible, .ax-dark .ax-el-primary-solid > button.ax-state-focus) {
1300
+ outline-color: rgba(var(--ax-color-primary-200));
1301
+ }
1302
+ .ax-dark .ax-el-primary-solid.ax-dropdown-button-marker {
1303
+ border-inline-start-color: rgba(var(--ax-color-primary-900));
1304
+ }
1305
+ .ax-dark .ax-el-primary-twotone {
1306
+ background-color: rgba(var(--ax-color-primary-200));
1307
+ color: rgba(var(--ax-color-primary-fore-tint));
1308
+ border-color: rgba(var(--ax-color-primary-200));
1309
+ }
1310
+ .ax-dark .ax-el-primary-twotone.ax-state-interactive:hover:not(.ax-state-disabled) {
1311
+ background-color: rgba(var(--ax-color-primary-300));
1312
+ }
1313
+ .ax-dark .ax-el-primary-twotone.ax-state-selected {
1314
+ background-color: rgba(var(--ax-color-primary-400));
1315
+ }
1316
+ .ax-dark .ax-el-primary-twotone .ax-ripple {
1317
+ background-color: rgba(var(--ax-color-primary-500), 0.3);
1318
+ }
1319
+ .ax-dark .ax-el-primary-twotone ax-loading-spinner .ax-loader {
1320
+ border-color: rgba(var(--ax-color-primary-fore-tint));
1321
+ border-bottom-color: transparent;
1322
+ }
1323
+ .ax-dark .ax-el-primary-twotone.ax-dropdown-button-marker {
1324
+ border-inline-start-color: rgba(var(--ax-color-primary-950));
1325
+ }
1326
+ .ax-dark .ax-el-primary-outline {
1327
+ border-color: rgba(var(--ax-color-primary-200));
1328
+ color: rgba(var(--ax-color-primary-200));
1329
+ }
1330
+ .ax-dark .ax-el-primary-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
1331
+ border-color: rgba(var(--ax-color-primary-300));
1332
+ color: rgba(var(--ax-color-primary-300));
1333
+ background-color: transparent;
1334
+ }
1335
+ .ax-dark .ax-el-primary-outline.ax-state-selected {
1336
+ border-color: rgba(var(--ax-color-primary-300));
1337
+ color: rgba(var(--ax-color-primary-300));
1338
+ }
1339
+ .ax-dark .ax-el-primary-outline .ax-ripple {
1340
+ border-color: rgba(var(--ax-color-primary-500), 0.3);
1341
+ }
1342
+ .ax-dark .ax-el-primary-outline ax-loading-spinner .ax-loader {
1343
+ border-color: rgba(var(--ax-color-primary-fore-tint));
1344
+ border-bottom-color: transparent;
1345
+ }
1346
+ .ax-dark .ax-el-primary-outline > button:is(.ax-dark .ax-el-primary-outline > button:focus-visible, .ax-dark .ax-el-primary-outline > button.ax-state-focus) {
1347
+ border-color: rgba(var(--ax-color-primary-300));
1348
+ color: rgba(var(--ax-color-primary-300));
1349
+ }
1350
+ .ax-dark .ax-el-primary-blank {
1351
+ color: rgba(var(--ax-color-primary-300));
1352
+ background-color: transparent;
1353
+ }
1354
+ .ax-dark .ax-el-primary-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
1355
+ color: rgba(var(--ax-color-primary-400));
1356
+ }
1357
+ .ax-dark .ax-el-primary-blank.ax-state-selected {
1358
+ background-color: rgba(var(--ax-color-primary-500));
1359
+ color: rgba(var(--ax-color-primary-fore));
1360
+ }
1361
+ .ax-dark .ax-el-primary-blank .ax-ripple {
1362
+ background-color: rgba(var(--ax-color-primary-300), 0.3) !important;
1363
+ }
1364
+ .ax-dark .ax-el-primary-blank ax-loading-spinner .ax-loader {
1365
+ border-color: rgba(var(--ax-color-primary-fore-tint));
1366
+ border-bottom-color: transparent;
1367
+ }
1368
+ .ax-dark .ax-el-secondary-solid {
1369
+ background-color: rgba(var(--ax-color-secondary-200));
1370
+ color: rgba(var(--ax-color-secondary-fore-tint));
1371
+ border-color: rgba(var(--ax-color-secondary-200));
1372
+ }
1373
+ .ax-dark .ax-el-secondary-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
1374
+ background-color: rgba(var(--ax-color-secondary-300));
1375
+ color: rgba(var(--ax-color-secondary-fore-tint));
1376
+ }
1377
+ .ax-dark .ax-el-secondary-solid.ax-state-selected {
1378
+ background-color: rgba(var(--ax-color-secondary-400));
1379
+ }
1380
+ .ax-dark .ax-el-secondary-solid .ax-ripple {
1381
+ background-color: rgba(var(--ax-color-secondary-500), 0.3) !important;
1382
+ }
1383
+ .ax-dark .ax-el-secondary-solid ax-loading-spinner .ax-loader {
1384
+ border-color: rgba(var(--ax-color-secondary-fore-tint));
1385
+ border-bottom-color: transparent;
1386
+ }
1387
+ .ax-dark .ax-el-secondary-solid > button:is(.ax-dark .ax-el-secondary-solid > button:focus-visible, .ax-dark .ax-el-secondary-solid > button.ax-state-focus) {
1388
+ outline-color: rgba(var(--ax-color-primary-200));
1389
+ }
1390
+ .ax-dark .ax-el-secondary-solid.ax-dropdown-button-marker {
1391
+ border-inline-start-color: rgba(var(--ax-color-secondary-900));
1392
+ }
1393
+ .ax-dark .ax-el-secondary-twotone {
1394
+ background-color: rgba(var(--ax-color-secondary-200));
1395
+ color: rgba(var(--ax-color-secondary-fore-tint));
1396
+ border-color: rgba(var(--ax-color-secondary-200));
1397
+ }
1398
+ .ax-dark .ax-el-secondary-twotone.ax-state-interactive:hover:not(.ax-state-disabled) {
1399
+ background-color: rgba(var(--ax-color-secondary-300));
1400
+ }
1401
+ .ax-dark .ax-el-secondary-twotone.ax-state-selected {
1402
+ background-color: rgba(var(--ax-color-secondary-400));
1403
+ }
1404
+ .ax-dark .ax-el-secondary-twotone .ax-ripple {
1405
+ background-color: rgba(var(--ax-color-secondary-500), 0.3);
1406
+ }
1407
+ .ax-dark .ax-el-secondary-twotone ax-loading-spinner .ax-loader {
1408
+ border-color: rgba(var(--ax-color-secondary-fore-tint));
1409
+ border-bottom-color: transparent;
1410
+ }
1411
+ .ax-dark .ax-el-secondary-twotone.ax-dropdown-button-marker {
1412
+ border-inline-start-color: rgba(var(--ax-color-secondary-950));
1413
+ }
1414
+ .ax-dark .ax-el-secondary-outline {
1415
+ border-color: rgba(var(--ax-color-secondary-200));
1416
+ color: rgba(var(--ax-color-secondary-200));
1417
+ }
1418
+ .ax-dark .ax-el-secondary-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
1419
+ border-color: rgba(var(--ax-color-secondary-300));
1420
+ color: rgba(var(--ax-color-secondary-300));
1421
+ background-color: transparent;
1422
+ }
1423
+ .ax-dark .ax-el-secondary-outline.ax-state-selected {
1424
+ border-color: rgba(var(--ax-color-secondary-300));
1425
+ color: rgba(var(--ax-color-secondary-300));
1426
+ }
1427
+ .ax-dark .ax-el-secondary-outline .ax-ripple {
1428
+ border-color: rgba(var(--ax-color-secondary-500), 0.3);
1429
+ }
1430
+ .ax-dark .ax-el-secondary-outline ax-loading-spinner .ax-loader {
1431
+ border-color: rgba(var(--ax-color-secondary-fore-tint));
1432
+ border-bottom-color: transparent;
1433
+ }
1434
+ .ax-dark .ax-el-secondary-outline > button:is(.ax-dark .ax-el-secondary-outline > button:focus-visible, .ax-dark .ax-el-secondary-outline > button.ax-state-focus) {
1435
+ border-color: rgba(var(--ax-color-secondary-300));
1436
+ color: rgba(var(--ax-color-secondary-300));
1437
+ }
1438
+ .ax-dark .ax-el-secondary-blank {
1439
+ color: rgba(var(--ax-color-secondary-300));
1440
+ background-color: transparent;
1441
+ }
1442
+ .ax-dark .ax-el-secondary-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
1443
+ color: rgba(var(--ax-color-secondary-400));
1444
+ }
1445
+ .ax-dark .ax-el-secondary-blank.ax-state-selected {
1446
+ background-color: rgba(var(--ax-color-secondary-500));
1447
+ color: rgba(var(--ax-color-secondary-fore));
1448
+ }
1449
+ .ax-dark .ax-el-secondary-blank .ax-ripple {
1450
+ background-color: rgba(var(--ax-color-secondary-300), 0.3) !important;
1451
+ }
1452
+ .ax-dark .ax-el-secondary-blank ax-loading-spinner .ax-loader {
1453
+ border-color: rgba(var(--ax-color-secondary-fore-tint));
1454
+ border-bottom-color: transparent;
1455
+ }
1456
+ .ax-dark .ax-el-success-solid {
1457
+ background-color: rgba(var(--ax-color-success-200));
1458
+ color: rgba(var(--ax-color-success-fore-tint));
1459
+ border-color: rgba(var(--ax-color-success-200));
1460
+ }
1461
+ .ax-dark .ax-el-success-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
1462
+ background-color: rgba(var(--ax-color-success-300));
1463
+ color: rgba(var(--ax-color-success-fore-tint));
1464
+ }
1465
+ .ax-dark .ax-el-success-solid.ax-state-selected {
1466
+ background-color: rgba(var(--ax-color-success-400));
1467
+ }
1468
+ .ax-dark .ax-el-success-solid .ax-ripple {
1469
+ background-color: rgba(var(--ax-color-success-500), 0.3) !important;
1470
+ }
1471
+ .ax-dark .ax-el-success-solid ax-loading-spinner .ax-loader {
1472
+ border-color: rgba(var(--ax-color-success-fore-tint));
1473
+ border-bottom-color: transparent;
1474
+ }
1475
+ .ax-dark .ax-el-success-solid > button:is(.ax-dark .ax-el-success-solid > button:focus-visible, .ax-dark .ax-el-success-solid > button.ax-state-focus) {
1476
+ outline-color: rgba(var(--ax-color-primary-200));
1477
+ }
1478
+ .ax-dark .ax-el-success-solid.ax-dropdown-button-marker {
1479
+ border-inline-start-color: rgba(var(--ax-color-success-900));
1480
+ }
1481
+ .ax-dark .ax-el-success-twotone {
1482
+ background-color: rgba(var(--ax-color-success-200));
1483
+ color: rgba(var(--ax-color-success-fore-tint));
1484
+ border-color: rgba(var(--ax-color-success-200));
1485
+ }
1486
+ .ax-dark .ax-el-success-twotone.ax-state-interactive:hover:not(.ax-state-disabled) {
1487
+ background-color: rgba(var(--ax-color-success-300));
1488
+ }
1489
+ .ax-dark .ax-el-success-twotone.ax-state-selected {
1490
+ background-color: rgba(var(--ax-color-success-400));
1491
+ }
1492
+ .ax-dark .ax-el-success-twotone .ax-ripple {
1493
+ background-color: rgba(var(--ax-color-success-500), 0.3);
1494
+ }
1495
+ .ax-dark .ax-el-success-twotone ax-loading-spinner .ax-loader {
1496
+ border-color: rgba(var(--ax-color-success-fore-tint));
1497
+ border-bottom-color: transparent;
1498
+ }
1499
+ .ax-dark .ax-el-success-twotone.ax-dropdown-button-marker {
1500
+ border-inline-start-color: rgba(var(--ax-color-success-950));
1501
+ }
1502
+ .ax-dark .ax-el-success-outline {
1503
+ border-color: rgba(var(--ax-color-success-200));
1504
+ color: rgba(var(--ax-color-success-200));
1505
+ }
1506
+ .ax-dark .ax-el-success-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
1507
+ border-color: rgba(var(--ax-color-success-300));
1508
+ color: rgba(var(--ax-color-success-300));
1509
+ background-color: transparent;
1510
+ }
1511
+ .ax-dark .ax-el-success-outline.ax-state-selected {
1512
+ border-color: rgba(var(--ax-color-success-300));
1513
+ color: rgba(var(--ax-color-success-300));
1514
+ }
1515
+ .ax-dark .ax-el-success-outline .ax-ripple {
1516
+ border-color: rgba(var(--ax-color-success-500), 0.3);
1517
+ }
1518
+ .ax-dark .ax-el-success-outline ax-loading-spinner .ax-loader {
1519
+ border-color: rgba(var(--ax-color-success-fore-tint));
1520
+ border-bottom-color: transparent;
1521
+ }
1522
+ .ax-dark .ax-el-success-outline > button:is(.ax-dark .ax-el-success-outline > button:focus-visible, .ax-dark .ax-el-success-outline > button.ax-state-focus) {
1523
+ border-color: rgba(var(--ax-color-success-300));
1524
+ color: rgba(var(--ax-color-success-300));
1525
+ }
1526
+ .ax-dark .ax-el-success-blank {
1527
+ color: rgba(var(--ax-color-success-300));
1528
+ background-color: transparent;
1529
+ }
1530
+ .ax-dark .ax-el-success-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
1531
+ color: rgba(var(--ax-color-success-400));
1532
+ }
1533
+ .ax-dark .ax-el-success-blank.ax-state-selected {
1534
+ background-color: rgba(var(--ax-color-success-500));
1535
+ color: rgba(var(--ax-color-success-fore));
1536
+ }
1537
+ .ax-dark .ax-el-success-blank .ax-ripple {
1538
+ background-color: rgba(var(--ax-color-success-300), 0.3) !important;
1539
+ }
1540
+ .ax-dark .ax-el-success-blank ax-loading-spinner .ax-loader {
1541
+ border-color: rgba(var(--ax-color-success-fore-tint));
1542
+ border-bottom-color: transparent;
1543
+ }
1544
+ .ax-dark .ax-el-warning-solid {
1545
+ background-color: rgba(var(--ax-color-warning-200));
1546
+ color: rgba(var(--ax-color-warning-fore-tint));
1547
+ border-color: rgba(var(--ax-color-warning-200));
1548
+ }
1549
+ .ax-dark .ax-el-warning-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
1550
+ background-color: rgba(var(--ax-color-warning-300));
1551
+ color: rgba(var(--ax-color-warning-fore-tint));
1552
+ }
1553
+ .ax-dark .ax-el-warning-solid.ax-state-selected {
1554
+ background-color: rgba(var(--ax-color-warning-400));
1555
+ }
1556
+ .ax-dark .ax-el-warning-solid .ax-ripple {
1557
+ background-color: rgba(var(--ax-color-warning-500), 0.3) !important;
1558
+ }
1559
+ .ax-dark .ax-el-warning-solid ax-loading-spinner .ax-loader {
1560
+ border-color: rgba(var(--ax-color-warning-fore-tint));
1561
+ border-bottom-color: transparent;
1562
+ }
1563
+ .ax-dark .ax-el-warning-solid > button:is(.ax-dark .ax-el-warning-solid > button:focus-visible, .ax-dark .ax-el-warning-solid > button.ax-state-focus) {
1564
+ outline-color: rgba(var(--ax-color-primary-200));
1565
+ }
1566
+ .ax-dark .ax-el-warning-solid.ax-dropdown-button-marker {
1567
+ border-inline-start-color: rgba(var(--ax-color-warning-900));
1568
+ }
1569
+ .ax-dark .ax-el-warning-twotone {
1570
+ background-color: rgba(var(--ax-color-warning-200));
1571
+ color: rgba(var(--ax-color-warning-fore-tint));
1572
+ border-color: rgba(var(--ax-color-warning-200));
1573
+ }
1574
+ .ax-dark .ax-el-warning-twotone.ax-state-interactive:hover:not(.ax-state-disabled) {
1575
+ background-color: rgba(var(--ax-color-warning-300));
1576
+ }
1577
+ .ax-dark .ax-el-warning-twotone.ax-state-selected {
1578
+ background-color: rgba(var(--ax-color-warning-400));
1579
+ }
1580
+ .ax-dark .ax-el-warning-twotone .ax-ripple {
1581
+ background-color: rgba(var(--ax-color-warning-500), 0.3);
1582
+ }
1583
+ .ax-dark .ax-el-warning-twotone ax-loading-spinner .ax-loader {
1584
+ border-color: rgba(var(--ax-color-warning-fore-tint));
1585
+ border-bottom-color: transparent;
1586
+ }
1587
+ .ax-dark .ax-el-warning-twotone.ax-dropdown-button-marker {
1588
+ border-inline-start-color: rgba(var(--ax-color-warning-950));
1589
+ }
1590
+ .ax-dark .ax-el-warning-outline {
1591
+ border-color: rgba(var(--ax-color-warning-200));
1592
+ color: rgba(var(--ax-color-warning-200));
1593
+ }
1594
+ .ax-dark .ax-el-warning-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
1595
+ border-color: rgba(var(--ax-color-warning-300));
1596
+ color: rgba(var(--ax-color-warning-300));
1597
+ background-color: transparent;
1598
+ }
1599
+ .ax-dark .ax-el-warning-outline.ax-state-selected {
1600
+ border-color: rgba(var(--ax-color-warning-300));
1601
+ color: rgba(var(--ax-color-warning-300));
1602
+ }
1603
+ .ax-dark .ax-el-warning-outline .ax-ripple {
1604
+ border-color: rgba(var(--ax-color-warning-500), 0.3);
1605
+ }
1606
+ .ax-dark .ax-el-warning-outline ax-loading-spinner .ax-loader {
1607
+ border-color: rgba(var(--ax-color-warning-fore-tint));
1608
+ border-bottom-color: transparent;
1609
+ }
1610
+ .ax-dark .ax-el-warning-outline > button:is(.ax-dark .ax-el-warning-outline > button:focus-visible, .ax-dark .ax-el-warning-outline > button.ax-state-focus) {
1611
+ border-color: rgba(var(--ax-color-warning-300));
1612
+ color: rgba(var(--ax-color-warning-300));
1613
+ }
1614
+ .ax-dark .ax-el-warning-blank {
1615
+ color: rgba(var(--ax-color-warning-300));
1616
+ background-color: transparent;
1617
+ }
1618
+ .ax-dark .ax-el-warning-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
1619
+ color: rgba(var(--ax-color-warning-400));
1620
+ }
1621
+ .ax-dark .ax-el-warning-blank.ax-state-selected {
1622
+ background-color: rgba(var(--ax-color-warning-500));
1623
+ color: rgba(var(--ax-color-warning-fore));
1624
+ }
1625
+ .ax-dark .ax-el-warning-blank .ax-ripple {
1626
+ background-color: rgba(var(--ax-color-warning-300), 0.3) !important;
1627
+ }
1628
+ .ax-dark .ax-el-warning-blank ax-loading-spinner .ax-loader {
1629
+ border-color: rgba(var(--ax-color-warning-fore-tint));
1630
+ border-bottom-color: transparent;
1631
+ }
1632
+ .ax-dark .ax-el-danger-solid {
1633
+ background-color: rgba(var(--ax-color-danger-200));
1634
+ color: rgba(var(--ax-color-danger-fore-tint));
1635
+ border-color: rgba(var(--ax-color-danger-200));
1636
+ }
1637
+ .ax-dark .ax-el-danger-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
1638
+ background-color: rgba(var(--ax-color-danger-300));
1639
+ color: rgba(var(--ax-color-danger-fore-tint));
1640
+ }
1641
+ .ax-dark .ax-el-danger-solid.ax-state-selected {
1642
+ background-color: rgba(var(--ax-color-danger-400));
1643
+ }
1644
+ .ax-dark .ax-el-danger-solid .ax-ripple {
1645
+ background-color: rgba(var(--ax-color-danger-500), 0.3) !important;
1646
+ }
1647
+ .ax-dark .ax-el-danger-solid ax-loading-spinner .ax-loader {
1648
+ border-color: rgba(var(--ax-color-danger-fore-tint));
1649
+ border-bottom-color: transparent;
1650
+ }
1651
+ .ax-dark .ax-el-danger-solid > button:is(.ax-dark .ax-el-danger-solid > button:focus-visible, .ax-dark .ax-el-danger-solid > button.ax-state-focus) {
1652
+ outline-color: rgba(var(--ax-color-primary-200));
1653
+ }
1654
+ .ax-dark .ax-el-danger-solid.ax-dropdown-button-marker {
1655
+ border-inline-start-color: rgba(var(--ax-color-danger-900));
1656
+ }
1657
+ .ax-dark .ax-el-danger-twotone {
1658
+ background-color: rgba(var(--ax-color-danger-200));
1659
+ color: rgba(var(--ax-color-danger-fore-tint));
1660
+ border-color: rgba(var(--ax-color-danger-200));
1661
+ }
1662
+ .ax-dark .ax-el-danger-twotone.ax-state-interactive:hover:not(.ax-state-disabled) {
1663
+ background-color: rgba(var(--ax-color-danger-300));
1664
+ }
1665
+ .ax-dark .ax-el-danger-twotone.ax-state-selected {
1666
+ background-color: rgba(var(--ax-color-danger-400));
1667
+ }
1668
+ .ax-dark .ax-el-danger-twotone .ax-ripple {
1669
+ background-color: rgba(var(--ax-color-danger-500), 0.3);
1670
+ }
1671
+ .ax-dark .ax-el-danger-twotone ax-loading-spinner .ax-loader {
1672
+ border-color: rgba(var(--ax-color-danger-fore-tint));
1673
+ border-bottom-color: transparent;
1674
+ }
1675
+ .ax-dark .ax-el-danger-twotone.ax-dropdown-button-marker {
1676
+ border-inline-start-color: rgba(var(--ax-color-danger-950));
1677
+ }
1678
+ .ax-dark .ax-el-danger-outline {
1679
+ border-color: rgba(var(--ax-color-danger-200));
1680
+ color: rgba(var(--ax-color-danger-200));
1681
+ }
1682
+ .ax-dark .ax-el-danger-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
1683
+ border-color: rgba(var(--ax-color-danger-300));
1684
+ color: rgba(var(--ax-color-danger-300));
1685
+ background-color: transparent;
1686
+ }
1687
+ .ax-dark .ax-el-danger-outline.ax-state-selected {
1688
+ border-color: rgba(var(--ax-color-danger-300));
1689
+ color: rgba(var(--ax-color-danger-300));
1690
+ }
1691
+ .ax-dark .ax-el-danger-outline .ax-ripple {
1692
+ border-color: rgba(var(--ax-color-danger-500), 0.3);
1693
+ }
1694
+ .ax-dark .ax-el-danger-outline ax-loading-spinner .ax-loader {
1695
+ border-color: rgba(var(--ax-color-danger-fore-tint));
1696
+ border-bottom-color: transparent;
1697
+ }
1698
+ .ax-dark .ax-el-danger-outline > button:is(.ax-dark .ax-el-danger-outline > button:focus-visible, .ax-dark .ax-el-danger-outline > button.ax-state-focus) {
1699
+ border-color: rgba(var(--ax-color-danger-300));
1700
+ color: rgba(var(--ax-color-danger-300));
1701
+ }
1702
+ .ax-dark .ax-el-danger-blank {
1703
+ color: rgba(var(--ax-color-danger-300));
1704
+ background-color: transparent;
1705
+ }
1706
+ .ax-dark .ax-el-danger-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
1707
+ color: rgba(var(--ax-color-danger-400));
1708
+ }
1709
+ .ax-dark .ax-el-danger-blank.ax-state-selected {
1710
+ background-color: rgba(var(--ax-color-danger-500));
1711
+ color: rgba(var(--ax-color-danger-fore));
1712
+ }
1713
+ .ax-dark .ax-el-danger-blank .ax-ripple {
1714
+ background-color: rgba(var(--ax-color-danger-300), 0.3) !important;
1715
+ }
1716
+ .ax-dark .ax-el-danger-blank ax-loading-spinner .ax-loader {
1717
+ border-color: rgba(var(--ax-color-danger-fore-tint));
1718
+ border-bottom-color: transparent;
1719
+ }
1720
+ .ax-dark .ax-el-info-solid {
1721
+ background-color: rgba(var(--ax-color-info-200));
1722
+ color: rgba(var(--ax-color-info-fore-tint));
1723
+ border-color: rgba(var(--ax-color-info-200));
1724
+ }
1725
+ .ax-dark .ax-el-info-solid.ax-el-interactive:hover:not(.ax-state-disabled) {
1726
+ background-color: rgba(var(--ax-color-info-300));
1727
+ color: rgba(var(--ax-color-info-fore-tint));
1728
+ }
1729
+ .ax-dark .ax-el-info-solid.ax-state-selected {
1730
+ background-color: rgba(var(--ax-color-info-400));
1731
+ }
1732
+ .ax-dark .ax-el-info-solid .ax-ripple {
1733
+ background-color: rgba(var(--ax-color-info-500), 0.3) !important;
1734
+ }
1735
+ .ax-dark .ax-el-info-solid ax-loading-spinner .ax-loader {
1736
+ border-color: rgba(var(--ax-color-info-fore-tint));
1737
+ border-bottom-color: transparent;
1738
+ }
1739
+ .ax-dark .ax-el-info-solid > button:is(.ax-dark .ax-el-info-solid > button:focus-visible, .ax-dark .ax-el-info-solid > button.ax-state-focus) {
1740
+ outline-color: rgba(var(--ax-color-primary-200));
1741
+ }
1742
+ .ax-dark .ax-el-info-solid.ax-dropdown-button-marker {
1743
+ border-inline-start-color: rgba(var(--ax-color-info-900));
1744
+ }
1745
+ .ax-dark .ax-el-info-twotone {
1746
+ background-color: rgba(var(--ax-color-info-200));
1747
+ color: rgba(var(--ax-color-info-fore-tint));
1748
+ border-color: rgba(var(--ax-color-info-200));
1749
+ }
1750
+ .ax-dark .ax-el-info-twotone.ax-state-interactive:hover:not(.ax-state-disabled) {
1751
+ background-color: rgba(var(--ax-color-info-300));
1752
+ }
1753
+ .ax-dark .ax-el-info-twotone.ax-state-selected {
1754
+ background-color: rgba(var(--ax-color-info-400));
1755
+ }
1756
+ .ax-dark .ax-el-info-twotone .ax-ripple {
1757
+ background-color: rgba(var(--ax-color-info-500), 0.3);
1758
+ }
1759
+ .ax-dark .ax-el-info-twotone ax-loading-spinner .ax-loader {
1760
+ border-color: rgba(var(--ax-color-info-fore-tint));
1761
+ border-bottom-color: transparent;
1762
+ }
1763
+ .ax-dark .ax-el-info-twotone.ax-dropdown-button-marker {
1764
+ border-inline-start-color: rgba(var(--ax-color-info-950));
1765
+ }
1766
+ .ax-dark .ax-el-info-outline {
1767
+ border-color: rgba(var(--ax-color-info-200));
1768
+ color: rgba(var(--ax-color-info-200));
1769
+ }
1770
+ .ax-dark .ax-el-info-outline.ax-el-interactive:hover:not(.ax-state-disabled) {
1771
+ border-color: rgba(var(--ax-color-info-300));
1772
+ color: rgba(var(--ax-color-info-300));
1773
+ background-color: transparent;
1774
+ }
1775
+ .ax-dark .ax-el-info-outline.ax-state-selected {
1776
+ border-color: rgba(var(--ax-color-info-300));
1777
+ color: rgba(var(--ax-color-info-300));
1778
+ }
1779
+ .ax-dark .ax-el-info-outline .ax-ripple {
1780
+ border-color: rgba(var(--ax-color-info-500), 0.3);
1781
+ }
1782
+ .ax-dark .ax-el-info-outline ax-loading-spinner .ax-loader {
1783
+ border-color: rgba(var(--ax-color-info-fore-tint));
1784
+ border-bottom-color: transparent;
1785
+ }
1786
+ .ax-dark .ax-el-info-outline > button:is(.ax-dark .ax-el-info-outline > button:focus-visible, .ax-dark .ax-el-info-outline > button.ax-state-focus) {
1787
+ border-color: rgba(var(--ax-color-info-300));
1788
+ color: rgba(var(--ax-color-info-300));
1789
+ }
1790
+ .ax-dark .ax-el-info-blank {
1791
+ color: rgba(var(--ax-color-info-300));
1792
+ background-color: transparent;
1793
+ }
1794
+ .ax-dark .ax-el-info-blank.ax-el-interactive:hover:not(.ax-state-disabled) {
1795
+ color: rgba(var(--ax-color-info-400));
1796
+ }
1797
+ .ax-dark .ax-el-info-blank.ax-state-selected {
1798
+ background-color: rgba(var(--ax-color-info-500));
1799
+ color: rgba(var(--ax-color-info-fore));
1800
+ }
1801
+ .ax-dark .ax-el-info-blank .ax-ripple {
1802
+ background-color: rgba(var(--ax-color-info-300), 0.3) !important;
1803
+ }
1804
+ .ax-dark .ax-el-info-blank ax-loading-spinner .ax-loader {
1805
+ border-color: rgba(var(--ax-color-info-fore-tint));
1806
+ border-bottom-color: transparent;
1807
+ }
1808
+ .ax-dark .ax-el-ghost-solid.ax-el-interactive:hover:not(.ax-dark .ax-el-ghost-solid.ax-el-interactive:hover.ax-state-selected, .ax-dark .ax-el-ghost-solid.ax-el-interactive:hover.ax-state-disabled) {
1809
+ border-color: rgba(var(--ax-color-primary-200));
1810
+ color: rgba(var(--ax-color-primary-200));
1811
+ }
1812
+ .ax-dark .ax-el-ghost-solid.ax-el-interactive:hover + .ax-dropdown-button-marker {
1813
+ border-inline-start-color: rgba(var(--ax-color-primary-200));
1814
+ }
1815
+ .ax-dark .ax-el-ghost-solid.ax-el-interactive:active {
1816
+ border-color: rgba(var(--ax-color-primary-300));
1817
+ color: rgba(var(--ax-color-primary-300));
1818
+ }
1819
+ .ax-dark .ax-el-ghost-solid.ax-state-selected {
1820
+ border-color: rgba(var(--ax-color-primary-200));
1821
+ background-color: rgba(var(--ax-color-primary-200));
1822
+ color: rgba(var(--ax-color-primary-fore));
1823
+ }
1824
+ .ax-dark .ax-el-ghost-solid .ax-ripple {
1825
+ background-color: rgba(var(--ax-color-primary-200), 0.3) !important;
1826
+ }
1827
+ .ax-dark .ax-el-ghost-outline.ax-el-interactive:hover:not(.ax-dark .ax-el-ghost-outline.ax-el-interactive:hover.ax-state-selected, .ax-dark .ax-el-ghost-outline.ax-el-interactive:hover.ax-state-disabled) {
1828
+ border-color: rgba(var(--ax-color-primary-200));
1829
+ color: rgba(var(--ax-color-primary-200));
1830
+ }
1831
+ .ax-dark .ax-el-ghost-outline.ax-el-interactive:hover + .ax-dropdown-button-marker {
1832
+ border-inline-start-color: rgba(var(--ax-color-primary-200));
1833
+ }
1834
+ .ax-dark .ax-el-ghost-outline.ax-state-selected {
1835
+ border-color: rgba(var(--ax-color-primary-200));
1836
+ color: rgba(var(--ax-color-primary-fore-tint));
1837
+ }
1838
+ .ax-dark .ax-el-ghost-outline .ax-ripple {
1839
+ background-color: rgba(var(--ax-color-primary-200), 0.3);
1840
+ }
1841
+ .ax-dark .ax-el-ghost-outline ax-loading-spinner .ax-loader {
1842
+ border-color: rgba(var(--ax-color-ghost-fore));
1843
+ border-bottom-color: transparent;
1844
+ }
1845
+ .ax-dark .ax-el-ghost-blank {
1846
+ border-style: none;
1847
+ background-color: transparent;
1848
+ color: rgba(var(--ax-color-ghost-fore));
1849
+ }
1850
+ .ax-dark .ax-el-ghost-blank.ax-state-selected {
1851
+ background-color: rgba(var(--ax-color-primary-500));
1852
+ color: rgba(var(--ax-color-primary-fore));
1853
+ }
1854
+ .ax-dark .ax-el-ghost-blank.ax-el-interactive:hover:not(.ax-dark .ax-el-ghost-blank.ax-el-interactive:hover.ax-state-selected, .ax-dark .ax-el-ghost-blank.ax-el-interactive:hover.ax-state-disabled) {
1855
+ border-color: rgba(var(--ax-color-primary-300));
1856
+ color: rgba(var(--ax-color-primary-300));
1857
+ }
1858
+ .ax-dark .ax-el-ghost-blank.ax-el-interactive:active {
1859
+ border-color: rgba(var(--ax-color-primary-400));
1860
+ color: rgba(var(--ax-color-primary-400));
1861
+ }
1862
+ .ax-dark .ax-el-ghost-blank .ax-ripple {
1863
+ background-color: rgba(var(--ax-color-primary-200), 0.3) !important;
1864
+ }
1865
+ .ax-dark .ax-el-ghost-blank > button:is(.ax-dark .ax-el-ghost-blank > button:focus-visible, .ax-dark .ax-el-ghost-blank > button.ax-state-focus) {
1866
+ outline-color: rgba(var(--ax-color-primary-200));
1867
+ }
1868
+ .ax-dark .ax-el-ghost-twotone {
1869
+ border-color: transparent;
1870
+ background-color: rgba(var(--ax-color-ghost-fore), 0.05);
1871
+ color: rgba(var(--ax-color-ghost-fore));
1872
+ }
1873
+ .ax-dark .ax-el-ghost-twotone.ax-el-interactive:hover:not(.ax-dark .ax-el-ghost-twotone.ax-el-interactive:hover.ax-state-selected, .ax-dark .ax-el-ghost-twotone.ax-el-interactive:hover.ax-state-disabled) {
1874
+ background-color: rgba(var(--ax-color-primary-200));
1875
+ color: rgba(var(--ax-color-primary-fore-tint));
1876
+ }
1877
+ .ax-dark .ax-el-ghost-twotone.ax-el-interactive:hover + .ax-dropdown-button-marker {
1878
+ border-inline-start-color: rgba(var(--ax-color-primary-200));
1879
+ }
1880
+ .ax-dark .ax-el-ghost-twotone.ax-el-interactive:active {
1881
+ background-color: rgba(var(--ax-color-primary-300));
1882
+ color: rgba(var(--ax-color-primary-fore-tint));
1883
+ }
1884
+ .ax-dark .ax-el-ghost-twotone.ax-state-selected {
1885
+ border-color: rgba(var(--ax-color-primary-300));
1886
+ background-color: rgba(var(--ax-color-primary-300));
1887
+ }
1888
+ .ax-dark .ax-el-ghost-twotone .ax-ripple {
1889
+ background-color: rgba(var(--ax-color-primary-500), 0.3) !important;
1890
+ }
1891
+ .ax-dark .ax-el-ghost-twotone > button:is(.ax-dark .ax-el-ghost-twotone > button:focus-visible, .ax-dark .ax-el-ghost-twotone > button.ax-state-focus) {
1892
+ outline-color: rgba(var(--ax-color-primary-200));
1893
+ }
1894
+
1895
+ .ax-drop-down {
1896
+ display: contents;
1897
+ }
1898
+ .ax-drop-down .ax-dropdown-content {
1899
+ display: flex;
1900
+ flex: 1 1 0%;
1901
+ align-items: center;
1902
+ overflow-x: auto;
1903
+ overflow-y: hidden;
1904
+ font-size: 0.875rem;
1905
+ line-height: 1.25rem;
1906
+ text-transform: capitalize;
1907
+ }
1908
+ .ax-drop-down .ax-dropdown-content.ax-state-disabled {
1909
+ cursor: not-allowed;
1910
+ opacity: 0.5;
1911
+ }
1912
+
1913
+ .ax-overlay-pane {
1914
+ margin-top: 0.25rem;
1915
+ height: fit-content;
1916
+ overflow: hidden;
1917
+ border-radius: 0px;
1918
+ border-width: 1px;
1919
+ border-color: rgba(var(--ax-color-border-default));
1920
+ background-color: rgba(var(--ax-color-surface));
1921
+ --ax-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
1922
+ --ax-shadow-colored: 0 4px 6px -1px var(--ax-shadow-color),
1923
+ 0 2px 4px -2px var(--ax-shadow-color);
1924
+ box-shadow: var(--ax-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)), var(--ax-ring-shadow, 0 0 rgba(0, 0, 0, 0)), var(--ax-shadow);
1925
+ }
1926
+ @media (min-width: 768px) {
1927
+ .ax-overlay-pane {
1928
+ border-radius: var(--ax-rounded-border-default);
1929
+ }
1930
+ }
1931
+ .ax-overlay-pane ax-header,
1932
+ .ax-overlay-pane ax-footer {
1933
+ background-color: rgba(var(--ax-color-surface));
1934
+ padding: 0.75rem;
1935
+ }
1936
+ .ax-overlay-pane.ax-overlay-center {
1937
+ height: fit-content;
1938
+ width: 80vw;
1939
+ max-width: 90vh;
1940
+ }
1941
+ .ax-overlay-pane.ax-overlay-actionsheet {
1942
+ height: auto;
1943
+ max-height: 85vh;
1944
+ width: 100%;
1945
+ background-color: rgba(var(--ax-color-surface));
1946
+ }
1947
+ .ax-overlay-pane.ax-overlay-actionsheet.ax-full {
1948
+ height: 95vh;
1949
+ max-height: 95vh;
1950
+ }
1951
+ .ax-overlay-pane.ax-overlay-full {
1952
+ width: 100vw;
1953
+ height: 100vh;
1954
+ }
1955
+
1956
+ .ax-dark .ax-editor-container.ax-look-fill.ax-state-error {
1957
+ background-color: rgba(var(--ax-color-danger-500), 0.25);
1958
+ }
1959
+ .ax-dark .ax-editor-container.ax-look-fill.ax-state-success {
1960
+ background-color: rgba(var(--ax-color-success-500), 0.25);
1961
+ }
1962
+
1963
+ .ax-editor-container {
1964
+ display: flex;
1965
+ height: var(--ax-size-default);
1966
+ width: 100%;
1967
+ align-items: center;
1968
+ overflow: hidden;
1969
+ font-size: 0.875rem;
1970
+ line-height: 1;
1971
+ color: rgba(var(--ax-color-input-surface-fore));
1972
+ }
1973
+ .ax-editor-container .ax-editor-container {
1974
+ background-color: rgba(var(--ax-color-on-surface)) !important;
1975
+ border-radius: 0 !important;
1976
+ border: 0px !important;
1977
+ height: 100% !important;
1978
+ }
1979
+ .ax-editor-container .ax-editor-container:focus-within {
1980
+ box-shadow: none !important;
1981
+ }
1982
+ .ax-editor-container .ax-editor-container:focus {
1983
+ box-shadow: 0px 0px 0 1px rgba(var(--ax-color-primary-500));
1984
+ }
1985
+ .ax-editor-container.ax-state-disabled {
1986
+ opacity: 0.5;
1987
+ cursor: not-allowed;
1988
+ }
1989
+ .ax-editor-container.ax-look-solid, .ax-editor-container.ax-look-outline {
1990
+ border-radius: var(--ax-rounded-border-default);
1991
+ border-width: 1px;
1992
+ border-color: rgba(var(--ax-color-border-default));
1993
+ background-color: rgba(var(--ax-color-input-surface));
1994
+ }
1995
+ .ax-editor-container.ax-look-solid:focus-within, .ax-editor-container.ax-look-outline:focus-within {
1996
+ box-shadow: 0px 0px 0 1px rgba(var(--ax-color-primary-500));
1997
+ border-color: rgba(var(--ax-color-primary-500));
1998
+ }
1999
+ .ax-editor-container.ax-look-solid.ax-state-error, .ax-editor-container.ax-look-outline.ax-state-error {
2000
+ border-color: rgba(var(--ax-color-danger-500));
2001
+ }
2002
+ .ax-editor-container.ax-look-solid.ax-state-error:focus-within, .ax-editor-container.ax-look-outline.ax-state-error:focus-within {
2003
+ box-shadow: 0px 0px 0 1px rgba(var(--ax-color-danger-500));
2004
+ border-color: rgba(var(--ax-color-danger-500));
2005
+ }
2006
+ .ax-editor-container.ax-look-solid.ax-state-error .ax-input::placeholder, .ax-editor-container.ax-look-outline.ax-state-error .ax-input::placeholder {
2007
+ color: rgba(var(--ax-color-danger-500));
2008
+ }
2009
+ .ax-editor-container.ax-look-flat {
2010
+ border-radius: 0px;
2011
+ border-bottom-width: 1px;
2012
+ border-color: rgba(var(--ax-color-border-default));
2013
+ }
2014
+ .ax-editor-container.ax-look-flat:focus-within {
2015
+ border-color: rgba(var(--ax-color-primary-500));
2016
+ }
2017
+ .ax-editor-container.ax-look-flat.ax-state-error {
2018
+ border-color: rgba(var(--ax-color-danger-500));
2019
+ }
2020
+ .ax-editor-container.ax-look-flat.ax-state-error .ax-input::placeholder {
2021
+ color: rgba(var(--ax-color-danger-500));
2022
+ }
2023
+ .ax-editor-container.ax-look-outline {
2024
+ background-color: transparent !important;
2025
+ }
2026
+ .ax-editor-container.ax-look-fill {
2027
+ border-radius: var(--ax-rounded-border-default);
2028
+ background-color: rgba(var(--ax-color-on-surface));
2029
+ }
2030
+ .ax-editor-container.ax-look-fill:focus-within {
2031
+ box-shadow: 0px 0px 0 2px rgba(var(--ax-color-primary-500));
2032
+ }
2033
+ .ax-editor-container.ax-look-fill.ax-state-error {
2034
+ background-color: rgba(var(--ax-color-danger-50));
2035
+ color: rgba(var(--ax-color-danger-fore-tint));
2036
+ }
2037
+ .ax-editor-container.ax-look-fill.ax-state-error:focus-within {
2038
+ box-shadow: 0px 0px 0 2px rgba(var(--ax-color-danger-500));
2039
+ }
2040
+ .ax-editor-container.ax-look-fill.ax-state-error .ax-input::placeholder {
2041
+ color: rgba(var(--ax-color-danger-500));
2042
+ }
2043
+ .ax-editor-container .ax-editor-input {
2044
+ height: 100%;
2045
+ flex: 1 1 0%;
2046
+ }
2047
+ .ax-editor-container .ax-editor-input .ax-input {
2048
+ height: 100%;
2049
+ }
2050
+ .ax-editor-container .ax-input {
2051
+ padding-left: 0.75rem;
2052
+ padding-right: 0.75rem;
2053
+ }
2054
+ .ax-editor-container .ax-input::placeholder {
2055
+ font-size: inherit;
2056
+ font-weight: 400;
2057
+ color: rgb(var(--ax-color-text-default), 0.5);
2058
+ }
2059
+ .ax-editor-container .ax-input:focus, .ax-editor-container .ax-input:focus-visible, .ax-editor-container .ax-input:focus-within {
2060
+ outline: none;
2061
+ }
2062
+ .ax-editor-container.ax-xs .ax-input {
2063
+ padding: 0.5rem;
2064
+ font-size: 0.75rem;
2065
+ line-height: 1rem;
2066
+ }
2067
+ .ax-editor-container.ax-sm .ax-input {
2068
+ padding: 0.5rem;
2069
+ font-size: 0.875rem;
2070
+ line-height: 1.25rem;
2071
+ }
2072
+ .ax-editor-container.ax-md .ax-input {
2073
+ font-size: 0.875rem;
2074
+ line-height: 1.25rem;
2075
+ }
2076
+ .ax-editor-container.ax-lg .ax-input {
2077
+ font-size: 1rem;
2078
+ line-height: 1.25rem;
2079
+ }
2080
+ .ax-editor-container.ax-xl .ax-input {
2081
+ font-size: 1.125rem;
2082
+ line-height: 1.75rem;
2083
+ }
2084
+ .ax-editor-container .ax-editor-control {
2085
+ display: flex;
2086
+ height: 100%;
2087
+ align-items: center;
2088
+ justify-content: center;
2089
+ padding-inline-start: 0.5rem;
2090
+ font-size: 1.125rem;
2091
+ line-height: 1.75rem;
2092
+ font-size: 1.125rem;
2093
+ line-height: 1.75rem;
2094
+ color: rgba(var(--ax-color-input-surface-fore));
2095
+ }
2096
+ .ax-editor-container.ax-button-icon {
2097
+ padding-left: 0.5rem;
2098
+ padding-right: 0.5rem;
2099
+ }
2100
+ .ax-editor-container .ax-input,
2101
+ .ax-editor-container .ax-text-area {
2102
+ text-align: inherit;
2103
+ font-family: inherit;
2104
+ font-size: inherit;
2105
+ line-height: inherit;
2106
+ height: 100%;
2107
+ width: 100%;
2108
+ flex: 1 1 0%;
2109
+ background-color: transparent;
2110
+ font-weight: 400;
2111
+ }
2112
+ .ax-editor-container .ax-input:focus,
2113
+ .ax-editor-container .ax-text-area:focus {
2114
+ box-shadow: none;
2115
+ }
2116
+ .ax-editor-container .ax-text-area {
2117
+ padding: 0.625rem;
2118
+ }
2119
+ .ax-editor-container > ax-prefix *,
2120
+ .ax-editor-container > ax-prefix .ax-button,
2121
+ .ax-editor-container > ax-prefix ax-title {
2122
+ border-end-start-radius: 0.25rem;
2123
+ border-start-start-radius: 0.25rem;
2124
+ }
2125
+ .ax-editor-container > ax-prefix ax-icon {
2126
+ padding-left: 0.75rem;
2127
+ padding-right: 0.75rem;
2128
+ }
2129
+ .ax-editor-container > ax-suffix *,
2130
+ .ax-editor-container > ax-suffix .ax-button,
2131
+ .ax-editor-container > ax-suffix ax-title {
2132
+ border-end-end-radius: 0.25rem;
2133
+ border-start-end-radius: 0.25rem;
2134
+ }
2135
+ .ax-editor-container > ax-prefix, .ax-editor-container > ax-suffix {
2136
+ height: 100%;
2137
+ }
2138
+ .ax-editor-container > ax-prefix + .ax-input, .ax-editor-container > ax-suffix + .ax-input {
2139
+ padding-left: 0.375rem !important;
2140
+ padding-right: 0.375rem !important;
2141
+ }
2142
+ .ax-editor-container > ax-prefix *, .ax-editor-container > ax-suffix * {
2143
+ display: flex;
2144
+ height: 100%;
2145
+ align-items: center;
2146
+ justify-content: center;
2147
+ border-radius: 0px;
2148
+ }
2149
+ .ax-editor-container > ax-prefix ax-title, .ax-editor-container > ax-suffix ax-title {
2150
+ padding-left: 1rem;
2151
+ padding-right: 1rem;
2152
+ }
2153
+ .ax-editor-container > ax-prefix > ax-text, .ax-editor-container > ax-suffix > ax-text {
2154
+ display: flex;
2155
+ align-items: center;
2156
+ justify-content: center;
2157
+ background-color: transparent;
2158
+ padding-left: 0.5rem;
2159
+ padding-right: 0.5rem;
2160
+ font-size: 0.875rem;
2161
+ line-height: 1.25rem;
2162
+ }
2163
+ .ax-editor-container .ax-button {
2164
+ height: 100% !important;
2165
+ border-radius: 0px !important;
2166
+ }
2167
+ .ax-editor-container .ax-button.ax-button-icon {
2168
+ height: 100%;
2169
+ width: var(--ax-size-default);
2170
+ }
2171
+
2172
+ .ax-ripple {
2173
+ transform: scale(0);
2174
+ animation: ripple 500ms linear;
2175
+ position: absolute;
2176
+ border-radius: 9999px !important;
2177
+ }
2178
+ @keyframes ripple {
2179
+ to {
2180
+ transform: scale(4);
2181
+ opacity: 0;
2182
+ }
2183
+ }
2184
+
2185
+ .ax-general-button {
2186
+ display: inline-flex;
2187
+ height: var(--ax-size-default);
2188
+ cursor: pointer;
2189
+ align-items: center;
2190
+ justify-content: center;
2191
+ border-radius: var(--ax-rounded-border-default);
2192
+ padding-left: 1rem;
2193
+ padding-right: 1rem;
2194
+ font-size: 0.875rem;
2195
+ line-height: 1.25rem;
2196
+ color: rgb(var(--ax-color-text-default), 0.75);
2197
+ }
2198
+ .ax-general-button:hover:not(.ax-general-button:hover:disabled, .ax-state-disabled) {
2199
+ color: rgba(var(--ax-color-primary-500), var(--tw-text-opacity));
2200
+ }
2201
+ .ax-general-button:focus:not(.ax-general-button:focus:disabled, .ax-state-disabled, .ax-general-button:focus-visible:disabled), .ax-general-button:focus-visible:not(.ax-general-button:focus:disabled, .ax-state-disabled, .ax-general-button:focus-visible:disabled) {
2202
+ color: rgba(var(--ax-color-primary-700), var(--tw-text-opacity));
2203
+ }
2204
+ .ax-general-button:active:not(.ax-general-button:active:disabled, .ax-state-disabled) {
2205
+ color: rgba(var(--ax-color-primary-300), var(--tw-text-opacity));
2206
+ }
2207
+ .ax-general-button.ax-button-icon {
2208
+ padding-left: 0.5rem;
2209
+ padding-right: 0.5rem;
2210
+ }
2211
+ .ax-general-button.ax-button-icon > button {
2212
+ display: flex;
2213
+ }
2214
+ .ax-general-button.ax-button-rounded {
2215
+ border-radius: var(--ax-rounded-border-default);
2216
+ }
2217
+ .ax-general-button:disabled, .ax-general-button.ax-state-disabled {
2218
+ cursor: not-allowed;
2219
+ opacity: 0.5;
2220
+ }
2221
+
2222
+ .ax-clear-button {
2223
+ display: inline-flex;
2224
+ height: var(--ax-size-default);
2225
+ align-items: center;
2226
+ justify-content: center;
2227
+ margin-left: 0.25rem;
2228
+ margin-right: 0.25rem;
2229
+ font-size: 1rem;
2230
+ line-height: 1.5rem;
2231
+ line-height: 1;
2232
+ color: rgb(var(--ax-color-text-default), 0.75);
2233
+ }
2234
+ .ax-clear-button > button {
2235
+ display: flex;
2236
+ }
2237
+ .ax-clear-button:hover:not(.ax-clear-button:hover:disabled, .ax-state-disabled) {
2238
+ color: rgb(var(--ax-color-text-default), 0.5);
2239
+ }
2240
+ .ax-clear-button:focus:not(.ax-clear-button:focus:disabled, .ax-state-disabled, .ax-clear-button:focus-visible:disabled), .ax-clear-button:focus-visible:not(.ax-clear-button:focus:disabled, .ax-state-disabled, .ax-clear-button:focus-visible:disabled) {
2241
+ color: rgb(var(--ax-color-text-default));
2242
+ }
2243
+
2244
+ .ax-input {
2245
+ font-size: inherit;
2246
+ padding: 0px;
2247
+ outline-width: 0px;
2248
+ }
2249
+ .ax-input:focus {
2250
+ outline-color: transparent;
2251
+ }
2252
+
2253
+ .ax-dark .ax-list-item.ax-state-selected {
2254
+ background-color: rgba(var(--ax-color-primary-800)) !important;
2255
+ color: rgba(var(--ax-color-primary-fore)) !important;
2256
+ }
2257
+ .ax-dark .ax-list-item.ax-state-selected .ax-selected-icon {
2258
+ color: rgba(var(--ax-color-primary-fore));
2259
+ }
2260
+
2261
+ .ax-list {
2262
+ display: flex;
2263
+ height: 100%;
2264
+ flex-direction: column;
2265
+ overflow: hidden;
2266
+ background-color: rgba(var(--ax-color-surface));
2267
+ font-size: 0.875rem;
2268
+ line-height: 1.25rem;
2269
+ }
2270
+ @media (min-width: 768px) {
2271
+ .ax-list {
2272
+ max-height: 20rem;
2273
+ }
2274
+ }
2275
+ .ax-list ax-header,
2276
+ .ax-list ax-footer {
2277
+ display: flex;
2278
+ align-items: center;
2279
+ justify-content: space-between;
2280
+ border-color: rgba(var(--ax-color-border-default), var(--tw-border-opacity));
2281
+ background-color: rgba(var(--ax-color-surface), var(--tw-bg-opacity));
2282
+ }
2283
+ .ax-list ax-header {
2284
+ border-bottom-width: 1px;
2285
+ border-color: rgba(var(--ax-color-border-default), var(--tw-border-opacity));
2286
+ padding: 1rem;
2287
+ font-size: 1rem;
2288
+ line-height: 1.5rem;
2289
+ font-weight: 500;
2290
+ }
2291
+ @media (min-width: 768px) {
2292
+ .ax-list ax-header {
2293
+ font-size: 1.125rem;
2294
+ line-height: 1.75rem;
2295
+ }
2296
+ }
2297
+ .ax-list ax-header ax-prefix,
2298
+ .ax-list ax-header ax-suffix {
2299
+ display: flex;
2300
+ flex-direction: column;
2301
+ justify-items: start;
2302
+ }
2303
+ .ax-list ax-header ax-prefix {
2304
+ align-items: flex-start;
2305
+ }
2306
+ .ax-list ax-header ax-suffix {
2307
+ align-items: flex-end;
2308
+ }
2309
+ .ax-list ax-footer {
2310
+ border-top-width: 1px;
2311
+ }
2312
+ .ax-list .ax-content {
2313
+ flex: 1 1 0%;
2314
+ overflow-y: auto;
2315
+ overflow-x: hidden;
2316
+ }
2317
+ .ax-list .ax-content.ax-list-items-container {
2318
+ height: 100%;
2319
+ overflow-y: auto;
2320
+ padding-top: 0.5rem;
2321
+ padding-bottom: 0.5rem;
2322
+ }
2323
+ .ax-list .ax-content.ax-list-items-container.ax-vertical {
2324
+ display: grid;
2325
+ grid-template-columns: repeat(1, minmax(0, 1fr));
2326
+ }
2327
+ .ax-list .ax-content.ax-list-items-container.ax-vertical.ax-divide {
2328
+ border-top-width: 1px;
2329
+ border-bottom-width: 1px;
2330
+ }
2331
+ .ax-list .ax-content.ax-list-items-container.ax-default {
2332
+ cursor: pointer;
2333
+ }
2334
+ .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item-group > span {
2335
+ display: flex;
2336
+ align-items: center;
2337
+ padding: 0.75rem;
2338
+ font-weight: 500;
2339
+ }
2340
+ .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item-group > ul {
2341
+ padding-left: 0.75rem;
2342
+ padding-right: 0.75rem;
2343
+ }
2344
+ .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item-group .ax-list-item {
2345
+ margin-bottom: 0.25rem;
2346
+ border-radius: var(--ax-rounded-border-default);
2347
+ }
2348
+ .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item {
2349
+ position: relative;
2350
+ display: flex;
2351
+ height: var(--ax-size-default);
2352
+ user-select: none;
2353
+ align-items: center;
2354
+ justify-content: space-between;
2355
+ padding-inline-end: 1rem;
2356
+ padding-inline-start: 0.75rem;
2357
+ font-size: 1rem;
2358
+ line-height: 1.5rem;
2359
+ }
2360
+ .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item:focus, .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item:focus-visible {
2361
+ outline-width: 2px;
2362
+ outline-offset: 2px;
2363
+ }
2364
+ .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item.ax-state-checkbox .ax-checkbox-label {
2365
+ margin-inline-start: 0.5rem;
2366
+ }
2367
+ .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item.ax-state-selected {
2368
+ background-color: rgba(var(--ax-color-primary-500), var(--tw-bg-opacity)) !important;
2369
+ color: rgba(var(--ax-color-primary-fore), var(--tw-text-opacity)) !important;
2370
+ }
2371
+ .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item.ax-state-selected .ax-selected-icon {
2372
+ font-size: 1.5rem;
2373
+ line-height: 2rem;
2374
+ color: rgba(var(--ax-color-primary-500));
2375
+ }
2376
+ .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item.ax-state-disabled {
2377
+ cursor: not-allowed;
2378
+ opacity: 0.5;
2379
+ }
2380
+ .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item:focus-visible, .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item:hover {
2381
+ background-color: rgba(var(--ax-color-on-surface));
2382
+ }
2383
+ .ax-list .ax-content.ax-list-items-container.ax-default .ax-list-item.ax-state-focus {
2384
+ background-color: rgba(var(--ax-color-on-surface));
2385
+ }
2386
+ .ax-list .ax-content.ax-list-items-container .ax-list-loading-container {
2387
+ display: flex;
2388
+ justify-content: center;
2389
+ padding: 0.5rem;
2390
+ }
2391
+ .ax-list .ax-search-box-container {
2392
+ padding: 0.5rem;
2393
+ }
2394
+ .ax-list .ax-search-box-container.ax-state-hidden {
2395
+ display: none;
2396
+ }
2397
+
2398
+ .ax-radio {
2399
+ margin: 0px;
2400
+ height: 1rem;
2401
+ min-height: 1rem;
2402
+ min-width: 1rem;
2403
+ width: 1rem;
2404
+ cursor: pointer;
2405
+ appearance: none;
2406
+ border-radius: 9999px;
2407
+ border-width: 1px;
2408
+ border-color: rgba(var(--ax-color-border-default));
2409
+ background-color: rgba(var(--ax-color-input-surface));
2410
+ vertical-align: middle;
2411
+ outline: 2px solid transparent;
2412
+ outline-offset: 2px;
2413
+ }
2414
+ .ax-radio:checked {
2415
+ border-color: rgba(var(--ax-color-primary-500)) !important;
2416
+ background-color: rgba(var(--ax-color-primary-500)) !important;
2417
+ background-size: contain;
2418
+ background-repeat: no-repeat;
2419
+ }
2420
+ .ax-radio:checked {
2421
+ background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e");
2422
+ }
2423
+ .ax-radio:focus-visible, .ax-radio:focus {
2424
+ box-shadow: 0px 0px 0px 2px rgba(var(--ax-color-surface)), 0px 0px 0px 4px rgba(var(--ax-color-primary-500));
2425
+ }
2426
+ .ax-radio:disabled {
2427
+ cursor: not-allowed;
2428
+ opacity: 0.5;
2429
+ }
2430
+
2431
+ .ax-dark .ax-table thead {
2432
+ background-color: rgba(var(--ax-color-on-surface));
2433
+ }
2434
+
2435
+ .ax-table {
2436
+ width: 100%;
2437
+ border-collapse: collapse;
2438
+ border-spacing: 0;
2439
+ overflow: hidden;
2440
+ border-radius: var(--ax-rounded-border-default);
2441
+ border-width: 1px;
2442
+ border-color: rgba(var(--ax-color-border-default));
2443
+ font-size: 0.875rem;
2444
+ line-height: 1.25rem;
2445
+ }
2446
+ .ax-table td {
2447
+ border-bottom-width: 1px;
2448
+ border-color: rgba(var(--ax-color-border-default));
2449
+ padding-left: 1rem;
2450
+ padding-right: 1rem;
2451
+ padding-top: 0.75rem;
2452
+ padding-bottom: 0.75rem;
2453
+ }
2454
+ .ax-table thead {
2455
+ border-bottom-width: 1px;
2456
+ border-color: rgba(var(--ax-color-border-default));
2457
+ background-color: rgba(var(--ax-color-on-surface));
2458
+ }
2459
+ .ax-table thead th {
2460
+ padding-left: 1rem;
2461
+ padding-right: 1rem;
2462
+ padding-top: 0.875rem;
2463
+ padding-bottom: 0.875rem;
2464
+ text-align: start;
2465
+ font-weight: 500;
2466
+ text-transform: uppercase;
2467
+ }
2468
+ .ax-table.ax-table-alternate tbody tr:nth-child(even) {
2469
+ background-color: rgba(var(--ax-color-on-surface));
2470
+ }
2471
+ .ax-table.ax-table-bordered thead th {
2472
+ border-top-width: 0px !important;
2473
+ }
2474
+ .ax-table.ax-table-bordered tbody tr:last-child td {
2475
+ border-bottom-width: 0px !important;
2476
+ }
2477
+ .ax-table.ax-table-bordered tbody tr td:last-child {
2478
+ border-bottom-width: 0px !important;
2479
+ }
2480
+ .ax-table.ax-table-bordered td,
2481
+ .ax-table.ax-table-bordered th {
2482
+ border-width: 1px;
2483
+ border-color: rgba(var(--ax-color-border-default));
2484
+ }
2485
+ .ax-table.ax-table-bordered td:first-child,
2486
+ .ax-table.ax-table-bordered th:first-child {
2487
+ border-inline-start-width: 0px;
2488
+ }
2489
+ .ax-table.ax-table-bordered td:last-child,
2490
+ .ax-table.ax-table-bordered th:last-child {
2491
+ border-inline-end-width: 0px;
2492
+ }
2493
+ @media screen and (max-width: 601px) {
2494
+ .ax-table.ax-table-responsive {
2495
+ display: block;
2496
+ overflow-wrap: break-word;
2497
+ border-width: 0px;
2498
+ }
2499
+ .ax-table.ax-table-responsive thead {
2500
+ position: absolute;
2501
+ inset-inline-start: -100%;
2502
+ top: -100%;
2503
+ }
2504
+ .ax-table.ax-table-responsive td {
2505
+ float: inline-start;
2506
+ clear: both;
2507
+ box-sizing: border-box;
2508
+ display: block;
2509
+ width: 100%;
2510
+ padding-left: 0.625rem;
2511
+ padding-right: 0.625rem;
2512
+ padding-top: 0.375rem;
2513
+ padding-bottom: 0.375rem;
2514
+ }
2515
+ .ax-table.ax-table-responsive td:last-child {
2516
+ border-width: 0px;
2517
+ }
2518
+ .ax-table.ax-table-responsive td:before {
2519
+ content: attr(data-label);
2520
+ display: block;
2521
+ font-weight: 700;
2522
+ }
2523
+ .ax-table.ax-table-responsive tr {
2524
+ border-width: 1px;
2525
+ border-color: rgba(var(--ax-color-border-default));
2526
+ }
2527
+ .ax-table.ax-table-responsive tr,
2528
+ .ax-table.ax-table-responsive tbody {
2529
+ float: inline-start;
2530
+ margin-bottom: 0.625rem;
2531
+ width: 100%;
2532
+ }
2533
+ }
2534
+
2535
+ [class*=" ax-icon-"],
2536
+ [class^=ax-icon-] {
2537
+ vertical-align: middle;
2538
+ }
2539
+
2540
+ .ax-fieldset {
2541
+ border-radius: var(--ax-rounded-border-default);
2542
+ border-width: 1px;
2543
+ border-color: rgba(var(--ax-color-border-default));
2544
+ padding: 0.75rem;
2545
+ }
2546
+ .ax-fieldset legend {
2547
+ padding-left: 0.25rem;
2548
+ padding-right: 0.25rem;
2549
+ font-size: 0.875rem;
2550
+ line-height: 1.25rem;
2551
+ }
2552
+
2553
+ .ax-card {
2554
+ border-radius: var(--ax-rounded-border-default);
2555
+ border-width: 1px;
2556
+ border-color: rgba(var(--ax-color-border-default));
2557
+ background-color: rgba(var(--ax-color-surface));
2558
+ }
2559
+
2560
+ .ax-drop-zone > input {
2561
+ position: absolute;
2562
+ height: 100%;
2563
+ width: 100%;
2564
+ cursor: pointer;
2565
+ opacity: 0;
2566
+ }
2567
+
2568
+ .ax-uploader-overlay-state {
2569
+ border-radius: inherit;
2570
+ pointer-events: none;
2571
+ position: absolute;
2572
+ inset-inline-start: 0px;
2573
+ top: 0px;
2574
+ z-index: 10;
2575
+ display: flex;
2576
+ height: 100%;
2577
+ width: 100%;
2578
+ cursor: pointer;
2579
+ flex-direction: column;
2580
+ align-items: center;
2581
+ justify-content: center;
2582
+ gap: 0.5rem;
2583
+ background-color: rgba(var(--ax-color-primary-200), 0.75);
2584
+ font-size: 0.875rem;
2585
+ line-height: 1.25rem;
2586
+ color: rgba(var(--ax-color-primary-fore-tint));
2587
+ outline-style: dashed;
2588
+ outline-offset: -4px;
2589
+ transition-property: all;
2590
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
2591
+ transition-duration: 150ms;
2592
+ }
2593
+
2594
+ .ax-dark .ax-uploader-overlay-state {
2595
+ background-color: rgba(var(--ax-color-primary-800), 0.75);
2596
+ color: rgba(var(--ax-color-primary-fore));
2597
+ outline-color: rgba(var(--ax-color-primary-fore));
2598
+ }
2599
+
2600
+ .ax-xs {
2601
+ --ax-size-default: calc(var(--ax-size-base) - 0.75rem);
2602
+ }
2603
+
2604
+ .ax-sm {
2605
+ --ax-size-default: calc(var(--ax-size-base) - 0.5rem);
2606
+ }
2607
+
2608
+ .ax-md {
2609
+ --ax-size-default: var(--ax-size-base);
2610
+ }
2611
+
2612
+ .ax-lg {
2613
+ --ax-size-default: calc(var(--ax-size-base) + 0.5rem);
2614
+ }
2615
+
2616
+ .ax-xl {
2617
+ --ax-size-default: calc(var(--ax-size-base) + 1rem);
2618
+ }
2619
+
2620
+ .ax-placeholder {
2621
+ color: rgba(var(--ax-color-text-default), 0.5);
2622
+ font-weight: 500;
2623
+ }