@acorex/styles 18.12.27 → 18.12.29

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.scss +9 -9
  26. package/package.json +11 -11
  27. package/src/base/_preflight.scss +405 -405
  28. package/src/base/index.scss +13 -13
  29. package/src/mixins/_look.scss +83 -83
  30. package/src/mixins/_media.scss +73 -73
  31. package/src/mixins/_util.scss +19 -19
  32. package/src/mixins/index.scss +3 -3
  33. package/src/shared/_action-item.scss +109 -109
  34. package/src/shared/_actionsheet.scss +20 -20
  35. package/src/shared/_check-box.scss +60 -60
  36. package/src/shared/_color-look.scss +864 -864
  37. package/src/shared/_drop-down.scss +76 -76
  38. package/src/shared/_editor-container.scss +258 -258
  39. package/src/shared/_general-button.scss +87 -87
  40. package/src/shared/_inputs.scss +16 -16
  41. package/src/shared/_list.scss +199 -199
  42. package/src/shared/_radio.scss +57 -57
  43. package/src/shared/_table.scss +149 -149
  44. package/src/shared/_utils.scss +84 -84
  45. package/src/shared/index.scss +12 -12
  46. package/src/utility/index.scss +24 -24
  47. package/src/variables/_colors.scss +2 -2
  48. package/src/variables/_degrees.scss +1 -1
  49. package/src/variables/index.scss +2 -2
  50. package/tailwind-base.js +234 -234
  51. package/themes/default.scss +143 -143
  52. package/index.css +0 -3058
  53. package/index.min.css +0 -1
  54. package/themes/default.css +0 -1
package/index.css DELETED
@@ -1,3058 +0,0 @@
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
- }