@acorex/styles 18.12.29 → 18.12.30

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