@aifuxi/semi-theme-default 0.1.0-alpha.0

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 (74) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +23 -0
  3. package/dist/SBOM.spdx.json +53 -0
  4. package/dist/THIRD_PARTY_LICENSES/Semi-Design.txt +83 -0
  5. package/dist/THIRD_PARTY_NOTICES.md +11 -0
  6. package/dist/anchor.css +1642 -0
  7. package/dist/auto-complete.css +2018 -0
  8. package/dist/avatar.css +1480 -0
  9. package/dist/back-top.css +1481 -0
  10. package/dist/badge.css +830 -0
  11. package/dist/banner.css +1865 -0
  12. package/dist/breadcrumb.css +1665 -0
  13. package/dist/button.css +1463 -0
  14. package/dist/calendar.css +2260 -0
  15. package/dist/card.css +1791 -0
  16. package/dist/carousel.css +1129 -0
  17. package/dist/cascader.css +3692 -0
  18. package/dist/checkbox.css +1052 -0
  19. package/dist/collapse.css +823 -0
  20. package/dist/collapsible.css +741 -0
  21. package/dist/color-picker.css +3822 -0
  22. package/dist/config-provider.css +700 -0
  23. package/dist/cropper.css +798 -0
  24. package/dist/date-picker.css +4194 -0
  25. package/dist/descriptions.css +941 -0
  26. package/dist/divider.css +758 -0
  27. package/dist/dropdown.css +926 -0
  28. package/dist/empty.css +1099 -0
  29. package/dist/float-button.css +992 -0
  30. package/dist/form.css +6368 -0
  31. package/dist/grid.css +6038 -0
  32. package/dist/highlight.css +706 -0
  33. package/dist/icon.css +781 -0
  34. package/dist/image.css +1762 -0
  35. package/dist/index.css +27102 -0
  36. package/dist/input-number.css +1497 -0
  37. package/dist/input.css +1980 -0
  38. package/dist/layout.css +738 -0
  39. package/dist/list.css +6263 -0
  40. package/dist/modal.css +2078 -0
  41. package/dist/navigation.css +2653 -0
  42. package/dist/notification.css +1755 -0
  43. package/dist/overflow-list.css +721 -0
  44. package/dist/pagination.css +3405 -0
  45. package/dist/pin-code.css +1377 -0
  46. package/dist/popconfirm.css +1759 -0
  47. package/dist/popover.css +945 -0
  48. package/dist/progress.css +845 -0
  49. package/dist/radio.css +1080 -0
  50. package/dist/rating.css +842 -0
  51. package/dist/resizable.css +862 -0
  52. package/dist/scroll-list.css +921 -0
  53. package/dist/select.css +3078 -0
  54. package/dist/side-sheet.css +1761 -0
  55. package/dist/skeleton.css +823 -0
  56. package/dist/slider.css +1219 -0
  57. package/dist/space.css +748 -0
  58. package/dist/spin.css +806 -0
  59. package/dist/steps.css +6581 -0
  60. package/dist/switch.css +1109 -0
  61. package/dist/table.css +5018 -0
  62. package/dist/tabs.css +2432 -0
  63. package/dist/tag-input.css +3071 -0
  64. package/dist/tag.css +2485 -0
  65. package/dist/time-picker.css +2144 -0
  66. package/dist/timeline.css +898 -0
  67. package/dist/toast.css +1556 -0
  68. package/dist/tooltip.css +965 -0
  69. package/dist/transfer.css +3473 -0
  70. package/dist/tree-select.css +4003 -0
  71. package/dist/tree.css +2397 -0
  72. package/dist/typography.css +1518 -0
  73. package/dist/upload.css +3153 -0
  74. package/package.json +122 -0
@@ -0,0 +1,4194 @@
1
+ /* shadow */
2
+ /* sizing */
3
+ /* spacing */
4
+ body, body .semi-always-light, :host, :host .semi-always-light {
5
+ --semi-amber-0: 254,251,235;
6
+ --semi-amber-1: 252,245,206;
7
+ --semi-amber-2: 249,232,158;
8
+ --semi-amber-3: 246,216,111;
9
+ --semi-amber-4: 243,198,65;
10
+ --semi-amber-5: 240,177,20;
11
+ --semi-amber-6: 200,138,15;
12
+ --semi-amber-7: 160,102,10;
13
+ --semi-amber-8: 120,70,6;
14
+ --semi-amber-9: 80,43,3;
15
+ --semi-black: 0,0,0;
16
+ --semi-blue-0: 234,245,255;
17
+ --semi-blue-1: 203,231,254;
18
+ --semi-blue-2: 152,205,253;
19
+ --semi-blue-3: 101,178,252;
20
+ --semi-blue-4: 50,149,251;
21
+ --semi-blue-5: 0,100,250;
22
+ --semi-blue-6: 0,98,214;
23
+ --semi-blue-7: 0,79,179;
24
+ --semi-blue-8: 0,61,143;
25
+ --semi-blue-9: 0,44,107;
26
+ --semi-cyan-0: 229,247,248;
27
+ --semi-cyan-1: 194,239,240;
28
+ --semi-cyan-2: 138,221,226;
29
+ --semi-cyan-3: 88,203,211;
30
+ --semi-cyan-4: 44,184,197;
31
+ --semi-cyan-5: 5,164,182;
32
+ --semi-cyan-6: 3,134,152;
33
+ --semi-cyan-7: 1,105,121;
34
+ --semi-cyan-8: 0,77,91;
35
+ --semi-cyan-9: 0,50,61;
36
+ --semi-green-0: 236,247,236;
37
+ --semi-green-1: 208,240,209;
38
+ --semi-green-2: 164,224,167;
39
+ --semi-green-3: 125,209,130;
40
+ --semi-green-4: 90,194,98;
41
+ --semi-green-5: 59,179,70;
42
+ --semi-green-6: 48,149,59;
43
+ --semi-green-7: 37,119,47;
44
+ --semi-green-8: 27,89,36;
45
+ --semi-green-9: 17,60,24;
46
+ --semi-grey-0: 249,249,249;
47
+ --semi-grey-1: 230,232,234;
48
+ --semi-grey-2: 198,202,205;
49
+ --semi-grey-3: 167,171,176;
50
+ --semi-grey-4: 136,141,146;
51
+ --semi-grey-5: 107,112,117;
52
+ --semi-grey-6: 85,91,97;
53
+ --semi-grey-7: 65,70,76;
54
+ --semi-grey-8: 46,50,56;
55
+ --semi-grey-9: 28,31,35;
56
+ --semi-indigo-0: 236,239,248;
57
+ --semi-indigo-1: 209,216,240;
58
+ --semi-indigo-2: 167,179,225;
59
+ --semi-indigo-3: 128,144,211;
60
+ --semi-indigo-4: 94,111,196;
61
+ --semi-indigo-5: 63,81,181;
62
+ --semi-indigo-6: 51,66,161;
63
+ --semi-indigo-7: 40,52,140;
64
+ --semi-indigo-8: 31,40,120;
65
+ --semi-indigo-9: 23,29,99;
66
+ --semi-light-blue-0: 233,247,253;
67
+ --semi-light-blue-1: 201,236,252;
68
+ --semi-light-blue-2: 149,216,248;
69
+ --semi-light-blue-3: 98,195,245;
70
+ --semi-light-blue-4: 48,172,241;
71
+ --semi-light-blue-5: 0,149,238;
72
+ --semi-light-blue-6: 0,123,202;
73
+ --semi-light-blue-7: 0,99,167;
74
+ --semi-light-blue-8: 0,75,131;
75
+ --semi-light-blue-9: 0,53,95;
76
+ --semi-light-green-0: 243,248,236;
77
+ --semi-light-green-1: 227,240,208;
78
+ --semi-light-green-2: 200,226,165;
79
+ --semi-light-green-3: 173,211,126;
80
+ --semi-light-green-4: 147,197,91;
81
+ --semi-light-green-5: 123,182,60;
82
+ --semi-light-green-6: 100,152,48;
83
+ --semi-light-green-7: 78,121,38;
84
+ --semi-light-green-8: 57,91,27;
85
+ --semi-light-green-9: 37,61,18;
86
+ --semi-lime-0: 242,250,230;
87
+ --semi-lime-1: 227,246,197;
88
+ --semi-lime-2: 203,237,142;
89
+ --semi-lime-3: 183,227,91;
90
+ --semi-lime-4: 167,218,44;
91
+ --semi-lime-5: 155,209,0;
92
+ --semi-lime-6: 126,174,0;
93
+ --semi-lime-7: 99,139,0;
94
+ --semi-lime-8: 72,104,0;
95
+ --semi-lime-9: 47,70,0;
96
+ --semi-orange-0: 255,248,234;
97
+ --semi-orange-1: 254,238,204;
98
+ --semi-orange-2: 254,217,152;
99
+ --semi-orange-3: 253,193,101;
100
+ --semi-orange-4: 253,166,51;
101
+ --semi-orange-5: 252,136,0;
102
+ --semi-orange-6: 210,103,0;
103
+ --semi-orange-7: 168,74,0;
104
+ --semi-orange-8: 126,49,0;
105
+ --semi-orange-9: 84,29,0;
106
+ --semi-pink-0: 253,236,239;
107
+ --semi-pink-1: 251,207,216;
108
+ --semi-pink-2: 246,160,181;
109
+ --semi-pink-3: 242,115,150;
110
+ --semi-pink-4: 237,72,123;
111
+ --semi-pink-5: 233,30,99;
112
+ --semi-pink-6: 197,19,86;
113
+ --semi-pink-7: 162,11,72;
114
+ --semi-pink-8: 126,5,58;
115
+ --semi-pink-9: 90,1,43;
116
+ --semi-purple-0: 247,233,247;
117
+ --semi-purple-1: 239,202,240;
118
+ --semi-purple-2: 221,155,224;
119
+ --semi-purple-3: 201,111,209;
120
+ --semi-purple-4: 180,73,194;
121
+ --semi-purple-5: 158,40,179;
122
+ --semi-purple-6: 135,30,158;
123
+ --semi-purple-7: 113,22,138;
124
+ --semi-purple-8: 92,15,117;
125
+ --semi-purple-9: 73,10,97;
126
+ --semi-red-0: 254,242,237;
127
+ --semi-red-1: 254,221,210;
128
+ --semi-red-2: 253,183,165;
129
+ --semi-red-3: 251,144,120;
130
+ --semi-red-4: 250,102,76;
131
+ --semi-red-5: 249,57,32;
132
+ --semi-red-6: 213,37,21;
133
+ --semi-red-7: 178,20,12;
134
+ --semi-red-8: 142,8,5;
135
+ --semi-red-9: 106,1,3;
136
+ --semi-teal-0: 228,247,244;
137
+ --semi-teal-1: 192,240,232;
138
+ --semi-teal-2: 135,224,211;
139
+ --semi-teal-3: 84,209,193;
140
+ --semi-teal-4: 39,194,176;
141
+ --semi-teal-5: 0,179,161;
142
+ --semi-teal-6: 0,149,137;
143
+ --semi-teal-7: 0,119,111;
144
+ --semi-teal-8: 0,89,85;
145
+ --semi-teal-9: 0,60,58;
146
+ --semi-violet-0: 243,237,249;
147
+ --semi-violet-1: 226,209,244;
148
+ --semi-violet-2: 196,167,233;
149
+ --semi-violet-3: 166,127,221;
150
+ --semi-violet-4: 136,91,210;
151
+ --semi-violet-5: 106,58,199;
152
+ --semi-violet-6: 87,47,179;
153
+ --semi-violet-7: 70,37,158;
154
+ --semi-violet-8: 54,28,138;
155
+ --semi-violet-9: 40,20,117;
156
+ --semi-white: 255,255,255;
157
+ --semi-yellow-0: 255,253,234;
158
+ --semi-yellow-1: 254,251,203;
159
+ --semi-yellow-2: 253,243,152;
160
+ --semi-yellow-3: 252,232,101;
161
+ --semi-yellow-4: 251,218,50;
162
+ --semi-yellow-5: 250,200,0;
163
+ --semi-yellow-6: 208,170,0;
164
+ --semi-yellow-7: 167,139,0;
165
+ --semi-yellow-8: 125,106,0;
166
+ --semi-yellow-9: 83,72,0;
167
+ --semi-ai-purple-0: 248,237,255;
168
+ --semi-ai-purple-1: 242,218,255;
169
+ --semi-ai-purple-2: 227,181,255;
170
+ --semi-ai-purple-3: 209,145,255;
171
+ --semi-ai-purple-4: 189,108,255;
172
+ --semi-ai-purple-5: 166,71,255;
173
+ --semi-ai-purple-6: 134,54,219;
174
+ --semi-ai-purple-7: 105,40,184;
175
+ --semi-ai-purple-8: 78,28,148;
176
+ --semi-ai-purple-9: 54,18,112;
177
+ --semi-ai-general-0-3: 239,247,255;
178
+ --semi-ai-general-0-2: 244,244,255;
179
+ --semi-ai-general-0-1: 248,237,255;
180
+ --semi-ai-general-0-0: 255,242,255;
181
+ --semi-ai-general-1-3: 213,235,255;
182
+ --semi-ai-general-1-2: 223,224,255;
183
+ --semi-ai-general-1-1: 242,218,255;
184
+ --semi-ai-general-1-0: 255,218,254;
185
+ --semi-ai-general-2-3: 171,213,255;
186
+ --semi-ai-general-2-2: 193,192,255;
187
+ --semi-ai-general-2-1: 227,181,255;
188
+ --semi-ai-general-2-0: 254,181,255;
189
+ --semi-ai-general-3-3: 130,190,255;
190
+ --semi-ai-general-3-2: 163,160,255;
191
+ --semi-ai-general-3-1: 209,145,255;
192
+ --semi-ai-general-3-0: 249,143,255;
193
+ --semi-ai-general-4-3: 88,166,255;
194
+ --semi-ai-general-4-2: 134,129,255;
195
+ --semi-ai-general-4-1: 189,108,255;
196
+ --semi-ai-general-4-0: 242,106,255;
197
+ --semi-ai-general-5-3: 46,140,255;
198
+ --semi-ai-general-5-2: 107,97,255;
199
+ --semi-ai-general-5-1: 166,71,255;
200
+ --semi-ai-general-5-0: 233,69,255;
201
+ --semi-ai-general-6-3: 33,114,219;
202
+ --semi-ai-general-6-2: 88,77,219;
203
+ --semi-ai-general-6-1: 134,54,219;
204
+ --semi-ai-general-6-0: 194,53,219;
205
+ --semi-ai-general-7-3: 22,89,184;
206
+ --semi-ai-general-7-2: 71,59,184;
207
+ --semi-ai-general-7-1: 105,40,184;
208
+ --semi-ai-general-7-0: 157,39,184;
209
+ --semi-ai-general-8-3: 13,67,148;
210
+ --semi-ai-general-8-2: 55,43,148;
211
+ --semi-ai-general-8-1: 78,28,148;
212
+ --semi-ai-general-8-0: 121,27,148;
213
+ --semi-ai-general-9-3: 7,47,112;
214
+ --semi-ai-general-9-2: 40,29,112;
215
+ --semi-ai-general-9-1: 54,18,112;
216
+ --semi-ai-general-9-0: 88,17,112;
217
+ --semi-ai-general-0: linear-gradient(278deg, rgba(var(--semi-ai-general-0-0)) 0%, rgba(var(--semi-ai-general-0-1)) 30%, rgba(var(--semi-ai-general-0-2)) 60%, rgba(var(--semi-ai-general-0-3)) 100%);
218
+ --semi-ai-general-1: linear-gradient(278deg, rgba(var(--semi-ai-general-1-0)) 0%, rgba(var(--semi-ai-general-1-1)) 30%, rgba(var(--semi-ai-general-1-2)) 60%, rgba(var(--semi-ai-general-1-3)) 100%);
219
+ --semi-ai-general-2: linear-gradient(278deg, rgba(var(--semi-ai-general-2-0)) 0%, rgba(var(--semi-ai-general-2-1)) 30%, rgba(var(--semi-ai-general-2-2)) 60%, rgba(var(--semi-ai-general-2-3)) 100%);
220
+ --semi-ai-general-3: linear-gradient(278deg, rgba(var(--semi-ai-general-3-0)) 0%, rgba(var(--semi-ai-general-3-1)) 30%, rgba(var(--semi-ai-general-3-2)) 60%, rgba(var(--semi-ai-general-3-3)) 100%);
221
+ --semi-ai-general-4: linear-gradient(278deg, rgba(var(--semi-ai-general-4-0)) 0%, rgba(var(--semi-ai-general-4-1)) 30%, rgba(var(--semi-ai-general-4-2)) 60%, rgba(var(--semi-ai-general-4-3)) 100%);
222
+ --semi-ai-general-5: linear-gradient(278deg, rgba(var(--semi-ai-general-5-0)) 0%, rgba(var(--semi-ai-general-5-1)) 30%, rgba(var(--semi-ai-general-5-2)) 60%, rgba(var(--semi-ai-general-5-3)) 100%);
223
+ --semi-ai-general-6: linear-gradient(278deg, rgba(var(--semi-ai-general-6-0)) 0%, rgba(var(--semi-ai-general-6-1)) 30%, rgba(var(--semi-ai-general-6-2)) 60%, rgba(var(--semi-ai-general-6-3)) 100%);
224
+ --semi-ai-general-7: linear-gradient(278deg, rgba(var(--semi-ai-general-7-0)) 0%, rgba(var(--semi-ai-general-7-1)) 30%, rgba(var(--semi-ai-general-7-2)) 60%, rgba(var(--semi-ai-general-7-3)) 100%);
225
+ --semi-ai-general-8: linear-gradient(278deg, rgba(var(--semi-ai-general-8-0)) 0%, rgba(var(--semi-ai-general-8-1)) 30%, rgba(var(--semi-ai-general-8-2)) 60%, rgba(var(--semi-ai-general-8-3)) 100%);
226
+ --semi-ai-general-9: linear-gradient(278deg, rgba(var(--semi-ai-general-9-0)) 0%, rgba(var(--semi-ai-general-9-1)) 30%, rgba(var(--semi-ai-general-9-2)) 60%, rgba(var(--semi-ai-general-9-3)) 100%);
227
+ }
228
+
229
+ body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .semi-always-dark {
230
+ --semi-red-0: 108,9,11;
231
+ --semi-red-1: 144,17,16;
232
+ --semi-red-2: 180,32,25;
233
+ --semi-red-3: 215,51,36;
234
+ --semi-red-4: 251,73,50;
235
+ --semi-red-5: 252,114,90;
236
+ --semi-red-6: 253,153,131;
237
+ --semi-red-7: 253,190,172;
238
+ --semi-red-8: 254,224,213;
239
+ --semi-red-9: 255,243,239;
240
+ --semi-pink-0: 92,7,48;
241
+ --semi-pink-1: 128,14,65;
242
+ --semi-pink-2: 164,23,81;
243
+ --semi-pink-3: 199,34,97;
244
+ --semi-pink-4: 235,47,113;
245
+ --semi-pink-5: 239,86,134;
246
+ --semi-pink-6: 243,126,159;
247
+ --semi-pink-7: 247,168,188;
248
+ --semi-pink-8: 251,211,220;
249
+ --semi-pink-9: 253,238,241;
250
+ --semi-purple-0: 74,16,97;
251
+ --semi-purple-1: 94,23,118;
252
+ --semi-purple-2: 115,31,138;
253
+ --semi-purple-3: 137,40,159;
254
+ --semi-purple-4: 160,51,179;
255
+ --semi-purple-5: 181,83,194;
256
+ --semi-purple-6: 202,120,209;
257
+ --semi-purple-7: 221,160,225;
258
+ --semi-purple-8: 239,206,240;
259
+ --semi-purple-9: 247,235,247;
260
+ --semi-violet-0: 64,27,119;
261
+ --semi-violet-1: 76,36,140;
262
+ --semi-violet-2: 88,46,160;
263
+ --semi-violet-3: 100,57,181;
264
+ --semi-violet-4: 114,70,201;
265
+ --semi-violet-5: 136,101,212;
266
+ --semi-violet-6: 162,136,223;
267
+ --semi-violet-7: 190,173,233;
268
+ --semi-violet-8: 221,212,244;
269
+ --semi-violet-9: 241,238,250;
270
+ --semi-indigo-0: 23,30,101;
271
+ --semi-indigo-1: 32,41,122;
272
+ --semi-indigo-2: 41,54,142;
273
+ --semi-indigo-3: 52,68,163;
274
+ --semi-indigo-4: 64,83,183;
275
+ --semi-indigo-5: 95,113,197;
276
+ --semi-indigo-6: 129,145,212;
277
+ --semi-indigo-7: 167,180,226;
278
+ --semi-indigo-8: 209,216,241;
279
+ --semi-indigo-9: 237,239,248;
280
+ --semi-blue-0: 5,49,112;
281
+ --semi-blue-1: 10,70,148;
282
+ --semi-blue-2: 19,92,184;
283
+ --semi-blue-3: 29,117,219;
284
+ --semi-blue-4: 41,144,255;
285
+ --semi-blue-5: 84,169,255;
286
+ --semi-blue-6: 127,193,255;
287
+ --semi-blue-7: 169,215,255;
288
+ --semi-blue-8: 212,236,255;
289
+ --semi-blue-9: 239,248,255;
290
+ --semi-light-blue-0: 0,55,97;
291
+ --semi-light-blue-1: 0,77,133;
292
+ --semi-light-blue-2: 3,102,169;
293
+ --semi-light-blue-3: 10,129,204;
294
+ --semi-light-blue-4: 19,159,240;
295
+ --semi-light-blue-5: 64,180,243;
296
+ --semi-light-blue-6: 110,200,246;
297
+ --semi-light-blue-7: 157,220,249;
298
+ --semi-light-blue-8: 206,238,252;
299
+ --semi-light-blue-9: 235,248,254;
300
+ --semi-cyan-0: 4,52,61;
301
+ --semi-cyan-1: 7,79,92;
302
+ --semi-cyan-2: 10,108,123;
303
+ --semi-cyan-3: 14,137,153;
304
+ --semi-cyan-4: 19,168,184;
305
+ --semi-cyan-5: 56,187,198;
306
+ --semi-cyan-6: 98,205,212;
307
+ --semi-cyan-7: 145,223,227;
308
+ --semi-cyan-8: 198,239,241;
309
+ --semi-cyan-9: 231,247,248;
310
+ --semi-teal-0: 2,60,57;
311
+ --semi-teal-1: 4,90,85;
312
+ --semi-teal-2: 7,119,111;
313
+ --semi-teal-3: 10,149,136;
314
+ --semi-teal-4: 14,179,161;
315
+ --semi-teal-5: 51,194,176;
316
+ --semi-teal-6: 94,209,193;
317
+ --semi-teal-7: 142,225,211;
318
+ --semi-teal-8: 196,240,232;
319
+ --semi-teal-9: 230,247,244;
320
+ --semi-green-0: 18,60,25;
321
+ --semi-green-1: 28,90,37;
322
+ --semi-green-2: 39,119,49;
323
+ --semi-green-3: 50,149,61;
324
+ --semi-green-4: 62,179,73;
325
+ --semi-green-5: 93,194,100;
326
+ --semi-green-6: 127,209,132;
327
+ --semi-green-7: 166,225,168;
328
+ --semi-green-8: 208,240,209;
329
+ --semi-green-9: 236,247,236;
330
+ --semi-light-green-0: 38,61,19;
331
+ --semi-light-green-1: 59,92,29;
332
+ --semi-light-green-2: 81,123,40;
333
+ --semi-light-green-3: 103,153,52;
334
+ --semi-light-green-4: 127,184,64;
335
+ --semi-light-green-5: 151,198,95;
336
+ --semi-light-green-6: 176,212,129;
337
+ --semi-light-green-7: 201,227,167;
338
+ --semi-light-green-8: 228,241,209;
339
+ --semi-light-green-9: 243,248,237;
340
+ --semi-lime-0: 49,70,3;
341
+ --semi-lime-1: 75,105,5;
342
+ --semi-lime-2: 103,141,9;
343
+ --semi-lime-3: 132,176,12;
344
+ --semi-lime-4: 162,211,17;
345
+ --semi-lime-5: 174,220,58;
346
+ --semi-lime-6: 189,229,102;
347
+ --semi-lime-7: 207,237,150;
348
+ --semi-lime-8: 229,246,201;
349
+ --semi-lime-9: 243,251,233;
350
+ --semi-yellow-0: 84,73,3;
351
+ --semi-yellow-1: 126,108,6;
352
+ --semi-yellow-2: 168,142,10;
353
+ --semi-yellow-3: 210,175,15;
354
+ --semi-yellow-4: 252,206,20;
355
+ --semi-yellow-5: 253,222,67;
356
+ --semi-yellow-6: 253,235,113;
357
+ --semi-yellow-7: 254,245,160;
358
+ --semi-yellow-8: 254,251,208;
359
+ --semi-yellow-9: 255,254,236;
360
+ --semi-amber-0: 81,46,9;
361
+ --semi-amber-1: 121,75,15;
362
+ --semi-amber-2: 161,107,22;
363
+ --semi-amber-3: 202,143,30;
364
+ --semi-amber-4: 242,183,38;
365
+ --semi-amber-5: 245,202,80;
366
+ --semi-amber-6: 247,219,122;
367
+ --semi-amber-7: 250,234,166;
368
+ --semi-amber-8: 252,246,210;
369
+ --semi-amber-9: 254,251,237;
370
+ --semi-orange-0: 85,31,3;
371
+ --semi-orange-1: 128,53,6;
372
+ --semi-orange-2: 170,80,10;
373
+ --semi-orange-3: 213,111,15;
374
+ --semi-orange-4: 255,146,20;
375
+ --semi-orange-5: 255,174,67;
376
+ --semi-orange-6: 255,199,114;
377
+ --semi-orange-7: 255,221,161;
378
+ --semi-orange-8: 255,239,208;
379
+ --semi-orange-9: 255,249,237;
380
+ --semi-grey-0: 28,31,35;
381
+ --semi-grey-1: 46,50,56;
382
+ --semi-grey-2: 65,70,76;
383
+ --semi-grey-3: 85,91,97;
384
+ --semi-grey-4: 107,112,117;
385
+ --semi-grey-5: 136,141,146;
386
+ --semi-grey-6: 167,171,176;
387
+ --semi-grey-7: 198,202,205;
388
+ --semi-grey-8: 230,232,234;
389
+ --semi-grey-9: 249,249,249;
390
+ --semi-white: 255, 255, 255;
391
+ --semi-black: 0, 0, 0;
392
+ --semi-ai-purple-0: 58,23,112;
393
+ --semi-ai-purple-1: 83,35,148;
394
+ --semi-ai-purple-2: 111,49,184;
395
+ --semi-ai-purple-3: 141,65,219;
396
+ --semi-ai-purple-4: 167,68,255;
397
+ --semi-ai-purple-5: 195,117,255;
398
+ --semi-ai-purple-6: 213,152,255;
399
+ --semi-ai-purple-7: 229,186,255;
400
+ --semi-ai-purple-8: 243,221,255;
401
+ --semi-ai-purple-9: 251,243,255;
402
+ --semi-ai-general-0-0: 9,44,100;
403
+ --semi-ai-general-0-1: 39,29,108;
404
+ --semi-ai-general-0-2: 58,23,112;
405
+ --semi-ai-general-0-3: 80,18,101;
406
+ --semi-ai-general-1-0: 17,64,136;
407
+ --semi-ai-general-1-1: 54,43,144;
408
+ --semi-ai-general-1-2: 83,35,148;
409
+ --semi-ai-general-1-3: 113,28,137;
410
+ --semi-ai-general-2-0: 26,86,172;
411
+ --semi-ai-general-2-1: 70,59,180;
412
+ --semi-ai-general-2-2: 111,49,184;
413
+ --semi-ai-general-2-3: 148,41,173;
414
+ --semi-ai-general-3-0: 38,111,207;
415
+ --semi-ai-general-3-1: 88,78,215;
416
+ --semi-ai-general-3-2: 141,65,219;
417
+ --semi-ai-general-3-3: 185,55,208;
418
+ --semi-ai-general-4-0: 35,127,240;
419
+ --semi-ai-general-4-1: 94,84,248;
420
+ --semi-ai-general-4-2: 167,68,255;
421
+ --semi-ai-general-4-3: 219,56,241;
422
+ --semi-ai-general-5-0: 91,162,245;
423
+ --semi-ai-general-5-1: 134,129,252;
424
+ --semi-ai-general-5-2: 195,117,255;
425
+ --semi-ai-general-5-3: 234,107,246;
426
+ --semi-ai-general-6-0: 131,187,248;
427
+ --semi-ai-general-6-1: 163,160,253;
428
+ --semi-ai-general-6-2: 213,152,255;
429
+ --semi-ai-general-6-3: 243,143,248;
430
+ --semi-ai-general-7-0: 172,210,250;
431
+ --semi-ai-general-7-1: 192,192,253;
432
+ --semi-ai-general-7-2: 229,186,255;
433
+ --semi-ai-general-7-3: 249,180,251;
434
+ --semi-ai-general-8-0: 213,233,253;
435
+ --semi-ai-general-8-1: 223,223,254;
436
+ --semi-ai-general-8-2: 243,221,255;
437
+ --semi-ai-general-8-3: 253,217,252;
438
+ --semi-ai-general-9-0: 239,247,254;
439
+ --semi-ai-general-9-1: 244,244,255;
440
+ --semi-ai-general-9-2: 251,243,255;
441
+ --semi-ai-general-9-3: 254,241,254;
442
+ --semi-ai-general-0: linear-gradient(278deg, rgba(var(--semi-ai-general-0-0)) 0%, rgba(var(--semi-ai-general-0-1)) 30%, rgba(var(--semi-ai-general-0-2)) 60%, rgba(var(--semi-ai-general-0-3)) 100%);
443
+ --semi-ai-general-1: linear-gradient(278deg, rgba(var(--semi-ai-general-1-0)) 0%, rgba(var(--semi-ai-general-1-1)) 30%, rgba(var(--semi-ai-general-1-2)) 60%, rgba(var(--semi-ai-general-1-3)) 100%);
444
+ --semi-ai-general-2: linear-gradient(278deg, rgba(var(--semi-ai-general-2-0)) 0%, rgba(var(--semi-ai-general-2-1)) 30%, rgba(var(--semi-ai-general-2-2)) 60%, rgba(var(--semi-ai-general-2-3)) 100%);
445
+ --semi-ai-general-3: linear-gradient(278deg, rgba(var(--semi-ai-general-3-0)) 0%, rgba(var(--semi-ai-general-3-1)) 30%, rgba(var(--semi-ai-general-3-2)) 60%, rgba(var(--semi-ai-general-3-3)) 100%);
446
+ --semi-ai-general-4: linear-gradient(278deg, rgba(var(--semi-ai-general-4-0)) 0%, rgba(var(--semi-ai-general-4-1)) 30%, rgba(var(--semi-ai-general-4-2)) 60%, rgba(var(--semi-ai-general-4-3)) 100%);
447
+ --semi-ai-general-5: linear-gradient(278deg, rgba(var(--semi-ai-general-5-0)) 0%, rgba(var(--semi-ai-general-5-1)) 30%, rgba(var(--semi-ai-general-5-2)) 60%, rgba(var(--semi-ai-general-5-3)) 100%);
448
+ --semi-ai-general-6: linear-gradient(278deg, rgba(var(--semi-ai-general-6-0)) 0%, rgba(var(--semi-ai-general-6-1)) 30%, rgba(var(--semi-ai-general-6-2)) 60%, rgba(var(--semi-ai-general-6-3)) 100%);
449
+ --semi-ai-general-7: linear-gradient(278deg, rgba(var(--semi-ai-general-7-0)) 0%, rgba(var(--semi-ai-general-7-1)) 30%, rgba(var(--semi-ai-general-7-2)) 60%, rgba(var(--semi-ai-general-7-3)) 100%);
450
+ --semi-ai-general-8: linear-gradient(278deg, rgba(var(--semi-ai-general-8-0)) 0%, rgba(var(--semi-ai-general-8-1)) 30%, rgba(var(--semi-ai-general-8-2)) 60%, rgba(var(--semi-ai-general-8-3)) 100%);
451
+ --semi-ai-general-9: linear-gradient(278deg, rgba(var(--semi-ai-general-9-0)) 0%, rgba(var(--semi-ai-general-9-1)) 30%, rgba(var(--semi-ai-general-9-2)) 60%, rgba(var(--semi-ai-general-9-3)) 100%);
452
+ }
453
+
454
+ body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light {
455
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
456
+ -webkit-font-smoothing: antialiased;
457
+ --semi-color-white: rgba(var(--semi-white), 1);
458
+ --semi-color-black: rgba(var(--semi-black), 1);
459
+ --semi-color-primary: rgba(var(--semi-blue-5), 1);
460
+ --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
461
+ --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
462
+ --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
463
+ --semi-color-primary-light-default: rgba(var(--semi-blue-0), 1);
464
+ --semi-color-primary-light-hover: rgba(var(--semi-blue-1), 1);
465
+ --semi-color-primary-light-active: rgba(var(--semi-blue-2), 1);
466
+ --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
467
+ --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
468
+ --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
469
+ --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
470
+ --semi-color-secondary-light-default: rgba(var(--semi-light-blue-0), 1);
471
+ --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1), 1);
472
+ --semi-color-secondary-light-active: rgba(var(--semi-light-blue-2), 1);
473
+ --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
474
+ --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
475
+ --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
476
+ --semi-color-tertiary-light-default: rgba(var(--semi-grey-0), 1);
477
+ --semi-color-tertiary-light-hover: rgba(var(--semi-grey-1), 1);
478
+ --semi-color-tertiary-light-active: rgba(var(--semi-grey-2), 1);
479
+ --semi-color-default: rgba(var(--semi-grey-0), 1);
480
+ --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
481
+ --semi-color-default-active: rgba(var(--semi-grey-2), 1);
482
+ --semi-color-info: rgba(var(--semi-blue-5), 1);
483
+ --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
484
+ --semi-color-info-active: rgba(var(--semi-blue-7), 1);
485
+ --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
486
+ --semi-color-info-light-default: rgba(var(--semi-blue-0), 1);
487
+ --semi-color-info-light-hover: rgba(var(--semi-blue-1), 1);
488
+ --semi-color-info-light-active: rgba(var(--semi-blue-2), 1);
489
+ --semi-color-success: rgba(var(--semi-green-5), 1);
490
+ --semi-color-success-hover: rgba(var(--semi-green-6), 1);
491
+ --semi-color-success-active: rgba(var(--semi-green-7), 1);
492
+ --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
493
+ --semi-color-success-light-default: rgba(var(--semi-green-0), 1);
494
+ --semi-color-success-light-hover: rgba(var(--semi-green-1), 1);
495
+ --semi-color-success-light-active: rgba(var(--semi-green-2), 1);
496
+ --semi-color-danger: rgba(var(--semi-red-5), 1);
497
+ --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
498
+ --semi-color-danger-active: rgba(var(--semi-red-7), 1);
499
+ --semi-color-danger-light-default: rgba(var(--semi-red-0), 1);
500
+ --semi-color-danger-light-hover: rgba(var(--semi-red-1), 1);
501
+ --semi-color-danger-light-active: rgba(var(--semi-red-2), 1);
502
+ --semi-color-warning: rgba(var(--semi-orange-5), 1);
503
+ --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
504
+ --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
505
+ --semi-color-warning-light-default: rgba(var(--semi-orange-0), 1);
506
+ --semi-color-warning-light-hover: rgba(var(--semi-orange-1), 1);
507
+ --semi-color-warning-light-active: rgba(var(--semi-orange-2), 1);
508
+ --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
509
+ --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
510
+ --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
511
+ --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
512
+ --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
513
+ --semi-color-shadow: rgba(var(--semi-black), .04);
514
+ --semi-color-link: rgba(var(--semi-blue-5), 1);
515
+ --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
516
+ --semi-color-link-active: rgba(var(--semi-blue-7), 1);
517
+ --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
518
+ --semi-color-border: rgba(var(--semi-grey-9), .08);
519
+ --semi-color-nav-bg: rgba(var(--semi-white), 1);
520
+ --semi-color-overlay-bg: rgba(22, 22, 26, .6);
521
+ --semi-color-fill-0: rgba(var(--semi-grey-8), .05);
522
+ --semi-color-fill-1: rgba(var(--semi-grey-8), .09);
523
+ --semi-color-fill-2: rgba(var(--semi-grey-8), .13);
524
+ --semi-color-bg-0: rgba(var(--semi-white), 1);
525
+ --semi-color-bg-1: rgba(var(--semi-white), 1);
526
+ --semi-color-bg-2: rgba(var(--semi-white), 1);
527
+ --semi-color-bg-3: rgba(var(--semi-white), 1);
528
+ --semi-color-bg-4: rgba(var(--semi-white), 1);
529
+ --semi-color-text-0: rgba(var(--semi-grey-9), 1);
530
+ --semi-color-text-1: rgba(var(--semi-grey-9), .8);
531
+ --semi-color-text-2: rgba(var(--semi-grey-9), .62);
532
+ --semi-color-text-3: rgba(var(--semi-grey-9), .35);
533
+ --semi-shadow-elevated: 0 0 1px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .1);
534
+ --semi-border-radius-extra-small: 3px;
535
+ --semi-border-radius-small: 3px;
536
+ --semi-border-radius-medium: 6px;
537
+ --semi-border-radius-large: 12px;
538
+ --semi-border-radius-circle: 50%;
539
+ --semi-border-radius-full: 9999px;
540
+ --semi-color-highlight-bg: rgba(var(--semi-yellow-4), 1);
541
+ --semi-color-highlight: rgba(var(--semi-black), 1);
542
+ --semi-color-data-0: rgba(87, 105, 255, 1);
543
+ --semi-color-data-1: rgba(142, 212, 231, 1);
544
+ --semi-color-data-2: rgba(245, 135, 0, 1);
545
+ --semi-color-data-3: rgba(220, 183, 252, 1);
546
+ --semi-color-data-4: rgba(74, 156, 247, 1);
547
+ --semi-color-data-5: rgba(243, 204, 53, 1);
548
+ --semi-color-data-6: rgba(254, 128, 144, 1);
549
+ --semi-color-data-7: rgba(139, 215, 210, 1);
550
+ --semi-color-data-8: rgba(131, 176, 35, 1);
551
+ --semi-color-data-9: rgba(233, 165, 229, 1);
552
+ --semi-color-data-10: rgba(48, 167, 206, 1);
553
+ --semi-color-data-11: rgba(249, 192, 100, 1);
554
+ --semi-color-data-12: rgba(177, 113, 249, 1);
555
+ --semi-color-data-13: rgba(119, 182, 249, 1);
556
+ --semi-color-data-14: rgba(200, 143, 2, 1);
557
+ --semi-color-data-15: rgba(255, 170, 178, 1);
558
+ --semi-color-data-16: rgba(51, 176, 171, 1);
559
+ --semi-color-data-17: rgba(182, 215, 129, 1);
560
+ --semi-color-data-18: rgba(212, 88, 212, 1);
561
+ --semi-color-data-19: rgba(188, 198, 255, 1);
562
+ --semi-color-ai-general: var(--semi-ai-general-5);
563
+ --semi-color-ai-general-hover: var(--semi-ai-general-6);
564
+ --semi-color-ai-general-active: var(--semi-ai-general-7);
565
+ --semi-color-ai-general-disabled: var(--semi-ai-general-2);
566
+ --semi-color-ai-purple: rgba(var(--semi-ai-purple-5));
567
+ --semi-color-ai-purple-hover: rgba(var(--semi-ai-purple-6));
568
+ --semi-color-ai-purple-active: rgba(var(--semi-ai-purple-7));
569
+ --semi-color-ai-purple-disabled: rgba(var(--semi-ai-purple-2));
570
+ --semi-color-ai-background-bottom: linear-gradient(201.15deg, rgba(255, 255, 255, 0.04) 6.58%, rgba(255, 226, 138, 0.04) 32.88%, rgba(231, 45, 255, 0.04) 67.93%, rgba(0, 115, 255, 0.04) 94.23%);
571
+ --semi-color-ai-background-bottom-hover: linear-gradient(201.15deg, rgba(255, 255, 255, 0.08) 6.58%, rgba(255, 226, 138, 0.08) 32.88%, rgba(231, 45, 255, 0.08) 67.93%, rgba(0, 115, 255, 0.08) 94.23%);
572
+ --semi-color-ai-background-bottom-active: linear-gradient(201.15deg, rgba(255, 255, 255, 0.12) 6.58%, rgba(255, 226, 138, 0.12) 32.88%, rgba(231, 45, 255, 0.12) 67.93%, rgba(0, 115, 255, 0.12) 94.23%);
573
+ --semi-color-ai-background-top: linear-gradient(201.15deg, rgba(83, 56, 255, 0.16) 6.58%, rgba(176, 48, 240, 0.096) 32.88%, rgba(231, 45, 255, 0.048) 59.17%, rgba(255, 255, 255, 0) 94.23%);
574
+ --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, 0.24) 6.58%, rgba(176, 48, 240, 0.144) 32.88%, rgba(231, 45, 255, 0.072) 59.17%, rgba(255, 255, 255, 0) 94.23%);
575
+ --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, 0.32) 6.58%, rgba(176, 48, 240, 0.192) 32.88%, rgba(231, 45, 255, 0.096) 59.17%, rgba(255, 255, 255, 0) 94.23%);
576
+ }
577
+
578
+ body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .semi-always-dark {
579
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
580
+ -webkit-font-smoothing: antialiased;
581
+ --semi-color-white: rgba(228, 231, 245, 1);
582
+ --semi-color-black: rgba(var(--semi-black), 1);
583
+ --semi-color-primary: rgba(var(--semi-blue-5), 1);
584
+ --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
585
+ --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
586
+ --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
587
+ --semi-color-primary-light-default: rgba(var(--semi-blue-5), .2);
588
+ --semi-color-primary-light-hover: rgba(var(--semi-blue-5), .3);
589
+ --semi-color-primary-light-active: rgba(var(--semi-blue-5), .4);
590
+ --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
591
+ --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
592
+ --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
593
+ --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
594
+ --semi-color-secondary-light-default: rgba(var(--semi-light-blue-5), .2);
595
+ --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-5), .3);
596
+ --semi-color-secondary-light-active: rgba(var(--semi-light-blue-5), .4);
597
+ --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
598
+ --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
599
+ --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
600
+ --semi-color-tertiary-light-default: rgba(var(--semi-grey-5), .2);
601
+ --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5), .3);
602
+ --semi-color-tertiary-light-active: rgba(var(--semi-grey-5), .4);
603
+ --semi-color-default: rgba(var(--semi-grey-0), 1);
604
+ --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
605
+ --semi-color-default-active: rgba(var(--semi-grey-2), 1);
606
+ --semi-color-info: rgba(var(--semi-blue-5), 1);
607
+ --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
608
+ --semi-color-info-active: rgba(var(--semi-blue-7), 1);
609
+ --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
610
+ --semi-color-info-light-default: rgba(var(--semi-blue-5), .2);
611
+ --semi-color-info-light-hover: rgba(var(--semi-blue-5), .3);
612
+ --semi-color-info-light-active: rgba(var(--semi-blue-5), .4);
613
+ --semi-color-success: rgba(var(--semi-green-5), 1);
614
+ --semi-color-success-hover: rgba(var(--semi-green-6), 1);
615
+ --semi-color-success-active: rgba(var(--semi-green-7), 1);
616
+ --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
617
+ --semi-color-success-light-default: rgba(var(--semi-green-5), .2);
618
+ --semi-color-success-light-hover: rgba(var(--semi-green-5), .3);
619
+ --semi-color-success-light-active: rgba(var(--semi-green-5), .4);
620
+ --semi-color-danger: rgba(var(--semi-red-5), 1);
621
+ --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
622
+ --semi-color-danger-active: rgba(var(--semi-red-7), 1);
623
+ --semi-color-danger-light-default: rgba(var(--semi-red-5), .2);
624
+ --semi-color-danger-light-hover: rgba(var(--semi-red-5), .3);
625
+ --semi-color-danger-light-active: rgba(var(--semi-red-5), .4);
626
+ --semi-color-warning: rgba(var(--semi-orange-5), 1);
627
+ --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
628
+ --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
629
+ --semi-color-warning-light-default: rgba(var(--semi-orange-5), .2);
630
+ --semi-color-warning-light-hover: rgba(var(--semi-orange-5), .3);
631
+ --semi-color-warning-light-active: rgba(var(--semi-orange-5), .4);
632
+ --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
633
+ --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
634
+ --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
635
+ --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
636
+ --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
637
+ --semi-color-link: rgba(var(--semi-blue-5), 1);
638
+ --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
639
+ --semi-color-link-active: rgba(var(--semi-blue-7), 1);
640
+ --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
641
+ --semi-color-nav-bg: rgba(35, 36, 41, 1);
642
+ --semi-shadow-elevated: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 4px 14px rgba(0, 0, 0, .25);
643
+ --semi-color-overlay-bg: rgba(22, 22, 26, .6);
644
+ --semi-color-fill-0: rgba(var(--semi-white), .12);
645
+ --semi-color-fill-1: rgba(var(--semi-white), .16);
646
+ --semi-color-fill-2: rgba(var(--semi-white), .20);
647
+ --semi-color-border: rgba(var(--semi-white), .08);
648
+ --semi-color-shadow: rgba(var(--semi-black), .04);
649
+ --semi-color-bg-0: rgba(22, 22, 26, 1);
650
+ --semi-color-bg-1: rgba(35, 36, 41, 1);
651
+ --semi-color-bg-2: rgba(53, 54, 60, 1);
652
+ --semi-color-bg-3: rgba(67, 68, 74, 1);
653
+ --semi-color-bg-4: rgba(79, 81, 89, 1);
654
+ --semi-color-text-0: rgba(var(--semi-grey-9), 1);
655
+ --semi-color-text-1: rgba(var(--semi-grey-9), .8);
656
+ --semi-color-text-2: rgba(var(--semi-grey-9), .6);
657
+ --semi-color-text-3: rgba(var(--semi-grey-9), .35);
658
+ --semi-border-radius-extra-small: 3px;
659
+ --semi-border-radius-small: 3px;
660
+ --semi-border-radius-medium: 6px;
661
+ --semi-border-radius-large: 12px;
662
+ --semi-border-radius-circle: 50%;
663
+ --semi-border-radius-full: 9999px;
664
+ --semi-color-highlight-bg: rgba(var(--semi-yellow-2), 1);
665
+ --semi-color-highlight: rgba(var(--semi-white), 1);
666
+ --semi-color-data-0: rgba(94, 109, 194, 1);
667
+ --semi-color-data-1: rgba(8, 104, 120, 1);
668
+ --semi-color-data-2: rgba(250, 173, 63, 1);
669
+ --semi-color-data-3: rgba(76, 43, 156, 1);
670
+ --semi-color-data-4: rgba(16, 125, 248, 1);
671
+ --semi-color-data-5: rgba(248, 202, 16, 1);
672
+ --semi-color-data-6: rgba(195, 30, 87, 1);
673
+ --semi-color-data-7: rgba(5, 119, 115, 1);
674
+ --semi-color-data-8: rgba(154, 207, 13, 1);
675
+ --semi-color-data-9: rgba(117, 29, 138, 1);
676
+ --semi-color-data-10: rgba(16, 162, 180, 1);
677
+ --semi-color-data-11: rgba(208, 110, 11, 1);
678
+ --semi-color-data-12: rgba(113, 66, 197, 1);
679
+ --semi-color-data-13: rgba(7, 100, 212, 1);
680
+ --semi-color-data-14: rgba(251, 232, 110, 1);
681
+ --semi-color-data-15: rgba(160, 19, 73, 1);
682
+ --semi-color-data-16: rgba(11, 179, 167, 1);
683
+ --semi-color-data-17: rgba(98, 138, 6, 1);
684
+ --semi-color-data-18: rgba(162, 48, 179, 1);
685
+ --semi-color-data-19: rgba(40, 51, 138, 1);
686
+ --semi-color-ai-general: var(--semi-ai-general-5);
687
+ --semi-color-ai-general-hover: var(--semi-ai-general-6);
688
+ --semi-color-ai-general-active: var(--semi-ai-general-7);
689
+ --semi-color-ai-general-disabled: var(--semi-ai-general-2);
690
+ --semi-color-ai-purple: rgba(var(--semi-ai-purple-5));
691
+ --semi-color-ai-purple-hover: rgba(var(--semi-ai-purple-6));
692
+ --semi-color-ai-purple-active: rgba(var(--semi-ai-purple-7));
693
+ --semi-color-ai-purple-disabled: rgba(var(--semi-ai-purple-2));
694
+ --semi-color-ai-background-bottom: linear-gradient(201.15deg, rgba(255, 226, 138, 0.2) 6.58%, rgba(231, 45, 255, 0.2) 50.4%, rgba(0, 115, 255, 0.2) 94.23%);
695
+ --semi-color-ai-background-bottom-hover: linear-gradient(201.15deg, rgba(255, 226, 138, 0.3) 6.58%, rgba(231, 45, 255, 0.3) 50.4%, rgba(0, 115, 255, 0.3) 94.23%);
696
+ --semi-color-ai-background-bottom-active: linear-gradient(201.15deg, rgba(255, 226, 138, 0.4) 6.58%, rgba(231, 45, 255, 0.4) 50.4%, rgba(0, 115, 255, 0.4) 94.23%);
697
+ --semi-color-ai-background-top: linear-gradient(201.15deg, rgba(83, 56, 255, 0.36) 6.58%, rgba(176, 48, 240, 0.216) 32.88%, rgba(154, 0, 174, 0.108) 59.17%, rgba(0, 0, 0, 0) 94.23%);
698
+ --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, 0.54) 6.58%, rgba(176, 48, 240, 0.324) 32.88%, rgba(154, 0, 174, 0.162) 59.17%, rgba(0, 0, 0, 0) 94.23%);
699
+ --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, 0.72) 6.58%, rgba(176, 48, 240, 0.432) 32.88%, rgba(154, 0, 174, 0.216) 59.17%, rgba(0, 0, 0, 0) 94.23%);
700
+ }
701
+
702
+ body, :host {
703
+ --semi-transition_duration-slowest:0ms;
704
+ --semi-transition_duration-slower:0ms;
705
+ --semi-transition_duration-slow:0ms;
706
+ --semi-transition_duration-normal:0ms;
707
+ --semi-transition_duration-fast:0ms;
708
+ --semi-transition_duration-faster:0ms;
709
+ --semi-transition_duration-fastest:0ms;
710
+ --semi-transition_duration-none:0ms;
711
+ --semi-transition_function-linear:linear;
712
+ --semi-transition_function-ease:ease;
713
+ --semi-transition_function-easeIn:ease-in;
714
+ --semi-transition_function-easeOut:ease-out;
715
+ --semi-transition_function-easeInIOut:ease-in-out;
716
+ --semi-transition_delay-none: 0ms;
717
+ --semi-transition_delay-slowest:0ms;
718
+ --semi-transition_delay-slower:0ms;
719
+ --semi-transition_delay-slow:0ms;
720
+ --semi-transition_delay-normal:0ms;
721
+ --semi-transition_delay-fast:0ms;
722
+ --semi-transition_delay-faster:0ms;
723
+ --semi-transition_delay-fastest:0ms;
724
+ --semi-transform_scale-none:scale(1,1);
725
+ --semi-transform_scale-small:scale(1,1);
726
+ --semi-transform_scale-medium:scale(1,1);
727
+ --semi-transform_scale-large:scale(1,1);
728
+ --semi-transform-rotate-none:rotate(0deg);
729
+ --semi-transform_rotate-clockwise90deg:rotate(90deg);
730
+ --semi-transform_rotate-clockwise180deg:rotate(180deg);
731
+ --semi-transform_rotate-clockwise270deg:rotate(270deg);
732
+ --semi-transform_rotate-clockwise360deg:rotate(360deg);
733
+ --semi-transform_rotate-anticlockwise90deg:rotate(-90deg);
734
+ --semi-transform_rotate-anticlockwise180deg:rotate(-180deg);
735
+ --semi-transform_rotate-anticlockwise270deg:rotate(-270deg);
736
+ --semi-transform_rotate-anticlockwise360deg:rotate(-360deg);
737
+ }
738
+
739
+ .semi-portal {
740
+ position: absolute;
741
+ top: 0;
742
+ left: 0;
743
+ width: 100%;
744
+ z-index: 1;
745
+ }
746
+ .semi-portal-inner {
747
+ position: absolute;
748
+ background-color: transparent;
749
+ min-width: max-content;
750
+ }
751
+
752
+ @keyframes semi-tooltip-zoomIn {
753
+ from {
754
+ opacity: 0;
755
+ transform: scale(0.8, 0.8);
756
+ }
757
+ 50% {
758
+ opacity: 1;
759
+ }
760
+ }
761
+ @keyframes semi-tooltip-bounceIn {
762
+ from {
763
+ opacity: 0;
764
+ transform: scale(0.6, 0.6);
765
+ }
766
+ 70% {
767
+ opacity: 1;
768
+ transform: scale(1.01, 1.01);
769
+ }
770
+ to {
771
+ opacity: 1;
772
+ transform: scale(1, 1);
773
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
774
+ }
775
+ }
776
+ @keyframes semi-tooltip-zoomOut {
777
+ from {
778
+ opacity: 1;
779
+ }
780
+ 60% {
781
+ opacity: 0;
782
+ transform: scale(0.8, 0.8);
783
+ }
784
+ to {
785
+ opacity: 0;
786
+ }
787
+ }
788
+ .semi-tooltip-wrapper {
789
+ position: relative;
790
+ background-color: rgba(var(--semi-grey-7), 1);
791
+ backdrop-filter: none;
792
+ color: var(--semi-color-bg-0);
793
+ border-radius: var(--semi-border-radius-medium);
794
+ padding-top: 8px;
795
+ padding-right: 12px;
796
+ padding-bottom: 8px;
797
+ padding-left: 12px;
798
+ font-size: 14px;
799
+ left: 0;
800
+ top: 0;
801
+ word-wrap: break-word;
802
+ overflow-wrap: break-word;
803
+ font-size: 14px;
804
+ line-height: 20px;
805
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
806
+ opacity: 0;
807
+ max-width: 240px;
808
+ }
809
+ .semi-tooltip-wrapper-show {
810
+ opacity: 1;
811
+ }
812
+ .semi-tooltip-content {
813
+ min-width: 0;
814
+ }
815
+ .semi-tooltip-trigger {
816
+ display: inline-block;
817
+ width: auto;
818
+ height: auto;
819
+ }
820
+ .semi-tooltip-with-arrow {
821
+ display: flex;
822
+ align-items: center;
823
+ justify-content: center;
824
+ box-sizing: border-box;
825
+ }
826
+ .semi-tooltip-animation-show {
827
+ animation: semi-tooltip-zoomIn 100ms cubic-bezier(0.215, 0.61, 0.355, 1);
828
+ animation-fill-mode: forwards;
829
+ }
830
+ .semi-tooltip-animation-hide {
831
+ animation: semi-tooltip-zoomOut 100ms cubic-bezier(0.215, 0.61, 0.355, 1);
832
+ animation-fill-mode: forwards;
833
+ }
834
+
835
+ .semi-tooltip-wrapper .semi-tooltip-icon-arrow {
836
+ height: 7px;
837
+ width: 24px;
838
+ position: absolute;
839
+ color: rgba(var(--semi-grey-7), 1);
840
+ }
841
+ .semi-tooltip-wrapper[x-placement=top] .semi-tooltip-icon-arrow {
842
+ left: var(--semi-tooltip-arrow-offset-x, 50%);
843
+ transform: translateX(-50%);
844
+ bottom: -6px;
845
+ }
846
+ .semi-tooltip-wrapper[x-placement=top].semi-tooltip-with-arrow,
847
+ .semi-tooltip-wrapper[x-placement=top] .semi-tooltip-with-arrow {
848
+ min-width: 36px;
849
+ }
850
+ .semi-tooltip-wrapper[x-placement=topLeft] .semi-tooltip-icon-arrow {
851
+ bottom: -6px;
852
+ left: 6px;
853
+ }
854
+ .semi-tooltip-wrapper[x-placement=topLeft].semi-tooltip-with-arrow,
855
+ .semi-tooltip-wrapper[x-placement=topLeft] .semi-tooltip-with-arrow {
856
+ min-width: 36px;
857
+ }
858
+ .semi-tooltip-wrapper[x-placement=topRight] .semi-tooltip-icon-arrow {
859
+ bottom: -6px;
860
+ right: 6px;
861
+ }
862
+ .semi-tooltip-wrapper[x-placement=topRight].semi-tooltip-with-arrow,
863
+ .semi-tooltip-wrapper[x-placement=topRight] .semi-tooltip-with-arrow {
864
+ min-width: 36px;
865
+ }
866
+ .semi-tooltip-wrapper[x-placement=leftTop] .semi-tooltip-icon-arrow {
867
+ width: 7px;
868
+ height: 24px;
869
+ right: -6px;
870
+ top: 5px;
871
+ }
872
+ .semi-tooltip-wrapper[x-placement=leftTop].semi-tooltip-with-arrow,
873
+ .semi-tooltip-wrapper[x-placement=leftTop] .semi-tooltip-with-arrow {
874
+ min-height: 34px;
875
+ }
876
+ .semi-tooltip-wrapper[x-placement=left] .semi-tooltip-icon-arrow {
877
+ width: 7px;
878
+ height: 24px;
879
+ right: -6px;
880
+ top: var(--semi-tooltip-arrow-offset-y, 50%);
881
+ transform: translateY(-50%);
882
+ }
883
+ .semi-tooltip-wrapper[x-placement=left].semi-tooltip-with-arrow,
884
+ .semi-tooltip-wrapper[x-placement=left] .semi-tooltip-with-arrow {
885
+ min-height: 34px;
886
+ }
887
+ .semi-tooltip-wrapper[x-placement=leftBottom] .semi-tooltip-icon-arrow {
888
+ width: 7px;
889
+ height: 24px;
890
+ right: -6px;
891
+ bottom: 5px;
892
+ }
893
+ .semi-tooltip-wrapper[x-placement=leftBottom].semi-tooltip-with-arrow,
894
+ .semi-tooltip-wrapper[x-placement=leftBottom] .semi-tooltip-with-arrow {
895
+ min-height: 34px;
896
+ }
897
+ .semi-tooltip-wrapper[x-placement=rightTop] .semi-tooltip-icon-arrow {
898
+ width: 7px;
899
+ height: 24px;
900
+ left: -6px;
901
+ top: 5px;
902
+ transform: rotate(180deg);
903
+ }
904
+ .semi-tooltip-wrapper[x-placement=rightTop].semi-tooltip-with-arrow,
905
+ .semi-tooltip-wrapper[x-placement=rightTop] .semi-tooltip-with-arrow {
906
+ min-height: 34px;
907
+ }
908
+ .semi-tooltip-wrapper[x-placement=right] .semi-tooltip-icon-arrow {
909
+ width: 7px;
910
+ height: 24px;
911
+ left: -6px;
912
+ top: var(--semi-tooltip-arrow-offset-y, 50%);
913
+ transform: translateY(-50%) rotate(180deg);
914
+ }
915
+ .semi-tooltip-wrapper[x-placement=right].semi-tooltip-with-arrow,
916
+ .semi-tooltip-wrapper[x-placement=right] .semi-tooltip-with-arrow {
917
+ min-height: 34px;
918
+ }
919
+ .semi-tooltip-wrapper[x-placement=rightBottom] .semi-tooltip-icon-arrow {
920
+ width: 7px;
921
+ height: 24px;
922
+ left: -6px;
923
+ bottom: 5px;
924
+ transform: rotate(180deg);
925
+ }
926
+ .semi-tooltip-wrapper[x-placement=rightBottom].semi-tooltip-with-arrow,
927
+ .semi-tooltip-wrapper[x-placement=rightBottom] .semi-tooltip-with-arrow {
928
+ min-height: 34px;
929
+ }
930
+ .semi-tooltip-wrapper[x-placement=bottomLeft] .semi-tooltip-icon-arrow {
931
+ top: -6px;
932
+ left: 6px;
933
+ transform: rotate(180deg);
934
+ }
935
+ .semi-tooltip-wrapper[x-placement=bottomLeft].semi-tooltip-with-arrow,
936
+ .semi-tooltip-wrapper[x-placement=bottomLeft] .semi-tooltip-with-arrow {
937
+ min-width: 36px;
938
+ }
939
+ .semi-tooltip-wrapper[x-placement=bottom] .semi-tooltip-icon-arrow {
940
+ top: -6px;
941
+ left: var(--semi-tooltip-arrow-offset-x, 50%);
942
+ transform: translateX(-50%) rotate(180deg);
943
+ }
944
+ .semi-tooltip-wrapper[x-placement=bottom].semi-tooltip-with-arrow,
945
+ .semi-tooltip-wrapper[x-placement=bottom] .semi-tooltip-with-arrow {
946
+ min-width: 36px;
947
+ }
948
+ .semi-tooltip-wrapper[x-placement=bottomRight] .semi-tooltip-icon-arrow {
949
+ right: 6px;
950
+ top: -6px;
951
+ transform: rotate(180deg);
952
+ }
953
+ .semi-tooltip-wrapper[x-placement=bottomRight].semi-tooltip-with-arrow,
954
+ .semi-tooltip-wrapper[x-placement=bottomRight] .semi-tooltip-with-arrow {
955
+ min-width: 36px;
956
+ }
957
+
958
+ .semi-rtl .semi-tooltip-wrapper,
959
+ .semi-portal-rtl .semi-tooltip-wrapper {
960
+ direction: rtl;
961
+ padding-right: 12px;
962
+ padding-left: 12px;
963
+ left: auto;
964
+ right: 0;
965
+ }
966
+
967
+ @keyframes semi-popover-zoomIn {
968
+ from {
969
+ opacity: 0;
970
+ transform: scale(0.8, 0.8);
971
+ }
972
+ 50% {
973
+ opacity: 1;
974
+ }
975
+ }
976
+ @keyframes semi-popover-zoomOut {
977
+ from {
978
+ opacity: 1;
979
+ }
980
+ 60% {
981
+ opacity: 0;
982
+ transform: scale(0.8, 0.8);
983
+ }
984
+ to {
985
+ opacity: 0;
986
+ }
987
+ }
988
+ .semi-popover-wrapper {
989
+ position: relative;
990
+ background-color: var(--semi-color-bg-3);
991
+ backdrop-filter: none;
992
+ box-shadow: var(--semi-shadow-elevated);
993
+ z-index: 1030;
994
+ border-radius: var(--semi-border-radius-medium);
995
+ font-size: 14px;
996
+ line-height: 20px;
997
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
998
+ opacity: 0;
999
+ }
1000
+ .semi-popover-wrapper-show {
1001
+ opacity: 1;
1002
+ }
1003
+ .semi-popover-trigger {
1004
+ display: inline-block;
1005
+ width: auto;
1006
+ height: auto;
1007
+ }
1008
+ .semi-popover-title {
1009
+ padding: 8px;
1010
+ border-bottom: 1px solid var(--semi-color-border);
1011
+ }
1012
+ .semi-popover-confirm {
1013
+ position: absolute;
1014
+ }
1015
+ .semi-popover-with-arrow {
1016
+ padding: 12px;
1017
+ box-sizing: border-box;
1018
+ }
1019
+ .semi-popover-animation-show {
1020
+ animation: semi-popover-zoomIn 100ms cubic-bezier(0.215, 0.61, 0.355, 1);
1021
+ animation-fill-mode: forwards;
1022
+ }
1023
+ .semi-popover-animation-hide {
1024
+ animation: semi-popover-zoomOut 100ms cubic-bezier(0.215, 0.61, 0.355, 1);
1025
+ animation-fill-mode: forwards;
1026
+ }
1027
+
1028
+ .semi-popover-icon-arrow path:nth-child(1) {
1029
+ fill: var(--semi-color-border);
1030
+ }
1031
+ .semi-popover-icon-arrow path:nth-child(2) {
1032
+ fill: var(--semi-color-bg-3);
1033
+ }
1034
+
1035
+ .semi-popover-wrapper .semi-popover-icon-arrow {
1036
+ height: 8px;
1037
+ width: 24px;
1038
+ position: absolute;
1039
+ color: unset;
1040
+ }
1041
+ .semi-popover-wrapper[x-placement=top] .semi-popover-icon-arrow {
1042
+ left: var(--semi-tooltip-arrow-offset-x, 50%);
1043
+ transform: translateX(-50%);
1044
+ bottom: -7px;
1045
+ }
1046
+ .semi-popover-wrapper[x-placement=top].semi-popover-with-arrow,
1047
+ .semi-popover-wrapper[x-placement=top] .semi-popover-with-arrow {
1048
+ min-width: 36px;
1049
+ }
1050
+ .semi-popover-wrapper[x-placement=topLeft] .semi-popover-icon-arrow {
1051
+ bottom: -7px;
1052
+ left: 6px;
1053
+ }
1054
+ .semi-popover-wrapper[x-placement=topLeft].semi-popover-with-arrow,
1055
+ .semi-popover-wrapper[x-placement=topLeft] .semi-popover-with-arrow {
1056
+ min-width: 36px;
1057
+ }
1058
+ .semi-popover-wrapper[x-placement=topRight] .semi-popover-icon-arrow {
1059
+ bottom: -7px;
1060
+ right: 6px;
1061
+ }
1062
+ .semi-popover-wrapper[x-placement=topRight].semi-popover-with-arrow,
1063
+ .semi-popover-wrapper[x-placement=topRight] .semi-popover-with-arrow {
1064
+ min-width: 36px;
1065
+ }
1066
+ .semi-popover-wrapper[x-placement=leftTop] .semi-popover-icon-arrow {
1067
+ width: 8px;
1068
+ height: 24px;
1069
+ right: -7px;
1070
+ top: 6px;
1071
+ }
1072
+ .semi-popover-wrapper[x-placement=leftTop].semi-popover-with-arrow,
1073
+ .semi-popover-wrapper[x-placement=leftTop] .semi-popover-with-arrow {
1074
+ min-height: 36px;
1075
+ }
1076
+ .semi-popover-wrapper[x-placement=left] .semi-popover-icon-arrow {
1077
+ width: 8px;
1078
+ height: 24px;
1079
+ right: -7px;
1080
+ top: var(--semi-tooltip-arrow-offset-y, 50%);
1081
+ transform: translateY(-50%);
1082
+ }
1083
+ .semi-popover-wrapper[x-placement=left].semi-popover-with-arrow,
1084
+ .semi-popover-wrapper[x-placement=left] .semi-popover-with-arrow {
1085
+ min-height: 36px;
1086
+ }
1087
+ .semi-popover-wrapper[x-placement=leftBottom] .semi-popover-icon-arrow {
1088
+ width: 8px;
1089
+ height: 24px;
1090
+ right: -7px;
1091
+ bottom: 6px;
1092
+ }
1093
+ .semi-popover-wrapper[x-placement=leftBottom].semi-popover-with-arrow,
1094
+ .semi-popover-wrapper[x-placement=leftBottom] .semi-popover-with-arrow {
1095
+ min-height: 36px;
1096
+ }
1097
+ .semi-popover-wrapper[x-placement=rightTop] .semi-popover-icon-arrow {
1098
+ width: 8px;
1099
+ height: 24px;
1100
+ left: -7px;
1101
+ top: 6px;
1102
+ transform: rotate(180deg);
1103
+ }
1104
+ .semi-popover-wrapper[x-placement=rightTop].semi-popover-with-arrow,
1105
+ .semi-popover-wrapper[x-placement=rightTop] .semi-popover-with-arrow {
1106
+ min-height: 36px;
1107
+ }
1108
+ .semi-popover-wrapper[x-placement=right] .semi-popover-icon-arrow {
1109
+ width: 8px;
1110
+ height: 24px;
1111
+ left: -7px;
1112
+ top: var(--semi-tooltip-arrow-offset-y, 50%);
1113
+ transform: translateY(-50%) rotate(180deg);
1114
+ }
1115
+ .semi-popover-wrapper[x-placement=right].semi-popover-with-arrow,
1116
+ .semi-popover-wrapper[x-placement=right] .semi-popover-with-arrow {
1117
+ min-height: 36px;
1118
+ }
1119
+ .semi-popover-wrapper[x-placement=rightBottom] .semi-popover-icon-arrow {
1120
+ width: 8px;
1121
+ height: 24px;
1122
+ left: -7px;
1123
+ bottom: 6px;
1124
+ transform: rotate(180deg);
1125
+ }
1126
+ .semi-popover-wrapper[x-placement=rightBottom].semi-popover-with-arrow,
1127
+ .semi-popover-wrapper[x-placement=rightBottom] .semi-popover-with-arrow {
1128
+ min-height: 36px;
1129
+ }
1130
+ .semi-popover-wrapper[x-placement=bottomLeft] .semi-popover-icon-arrow {
1131
+ top: -7px;
1132
+ left: 6px;
1133
+ transform: rotate(180deg);
1134
+ }
1135
+ .semi-popover-wrapper[x-placement=bottomLeft].semi-popover-with-arrow,
1136
+ .semi-popover-wrapper[x-placement=bottomLeft] .semi-popover-with-arrow {
1137
+ min-width: 36px;
1138
+ }
1139
+ .semi-popover-wrapper[x-placement=bottom] .semi-popover-icon-arrow {
1140
+ top: -7px;
1141
+ left: var(--semi-tooltip-arrow-offset-x, 50%);
1142
+ transform: translateX(-50%) rotate(180deg);
1143
+ }
1144
+ .semi-popover-wrapper[x-placement=bottom].semi-popover-with-arrow,
1145
+ .semi-popover-wrapper[x-placement=bottom] .semi-popover-with-arrow {
1146
+ min-width: 36px;
1147
+ }
1148
+ .semi-popover-wrapper[x-placement=bottomRight] .semi-popover-icon-arrow {
1149
+ right: 6px;
1150
+ top: -7px;
1151
+ transform: rotate(180deg);
1152
+ }
1153
+ .semi-popover-wrapper[x-placement=bottomRight].semi-popover-with-arrow,
1154
+ .semi-popover-wrapper[x-placement=bottomRight] .semi-popover-with-arrow {
1155
+ min-width: 36px;
1156
+ }
1157
+
1158
+ .semi-popover.semi-popover-rtl {
1159
+ direction: rtl;
1160
+ }
1161
+
1162
+ @keyframes semi-input-active {
1163
+ from {
1164
+ transform: scale(1);
1165
+ }
1166
+ to {
1167
+ transform: scale(0.97);
1168
+ }
1169
+ }
1170
+ @keyframes semi-input-inactive {
1171
+ from {
1172
+ transform: scale(0.97);
1173
+ }
1174
+ to {
1175
+ transform: scale(1);
1176
+ }
1177
+ }
1178
+ .semi-input {
1179
+ transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
1180
+ transform: scale(var(--semi-transform_scale-none));
1181
+ }
1182
+
1183
+ .semi-input-wrapper {
1184
+ display: inline-block;
1185
+ position: relative;
1186
+ vertical-align: middle;
1187
+ box-shadow: none;
1188
+ font-size: 14px;
1189
+ line-height: 20px;
1190
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1191
+ background-color: var(--semi-color-fill-0);
1192
+ border: 1px transparent solid;
1193
+ border-radius: var(--semi-border-radius-small);
1194
+ width: 100%;
1195
+ outline: none;
1196
+ cursor: text;
1197
+ box-sizing: border-box;
1198
+ color: var(--semi-color-text-0);
1199
+ transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
1200
+ transform: scale(var(--semi-transform_scale-none));
1201
+ }
1202
+ .semi-input-wrapper-default {
1203
+ height: 32px;
1204
+ font-size: 14px;
1205
+ line-height: 20px;
1206
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1207
+ line-height: 30px;
1208
+ }
1209
+ .semi-input-wrapper-small {
1210
+ height: 24px;
1211
+ font-size: 14px;
1212
+ line-height: 20px;
1213
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1214
+ line-height: 22px;
1215
+ }
1216
+ .semi-input-wrapper-large {
1217
+ height: 40px;
1218
+ font-size: 16px;
1219
+ line-height: 22px;
1220
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1221
+ line-height: 38px;
1222
+ }
1223
+ .semi-input-wrapper:hover {
1224
+ background-color: var(--semi-color-fill-1);
1225
+ border-color: transparent;
1226
+ }
1227
+ .semi-input-wrapper-focus {
1228
+ background-color: var(--semi-color-fill-0);
1229
+ border: var(--semi-color-focus-border) solid 1px;
1230
+ }
1231
+ .semi-input-wrapper-focus:hover {
1232
+ background-color: var(--semi-color-fill-0);
1233
+ border-color: var(--semi-color-focus-border);
1234
+ }
1235
+ .semi-input-wrapper-focus:active {
1236
+ background-color: var(--semi-color-fill-2);
1237
+ border-color: var(--semi-color-focus-border);
1238
+ }
1239
+ .semi-input-wrapper.semi-input-readonly {
1240
+ cursor: default;
1241
+ }
1242
+ .semi-input-wrapper-error {
1243
+ background-color: var(--semi-color-danger-light-default);
1244
+ border-color: var(--semi-color-danger-light-default);
1245
+ }
1246
+ .semi-input-wrapper-error:hover {
1247
+ background-color: var(--semi-color-danger-light-hover);
1248
+ border-color: var(--semi-color-danger-light-hover);
1249
+ }
1250
+ .semi-input-wrapper-error.semi-input-wrapper-focus {
1251
+ background-color: var(--semi-color-danger-light-default);
1252
+ border-color: var(--semi-color-danger);
1253
+ }
1254
+ .semi-input-wrapper-error:active {
1255
+ background-color: var(--semi-color-danger-light-active);
1256
+ border-color: var(--semi-color-danger);
1257
+ }
1258
+ .semi-input-wrapper-warning {
1259
+ background-color: var(--semi-color-warning-light-default);
1260
+ border-color: var(--semi-color-warning-light-default);
1261
+ }
1262
+ .semi-input-wrapper-warning:hover {
1263
+ background-color: var(--semi-color-warning-light-hover);
1264
+ border-color: var(--semi-color-warning-light-hover);
1265
+ }
1266
+ .semi-input-wrapper-warning.semi-input-wrapper-focus {
1267
+ background-color: var(--semi-color-warning-light-default);
1268
+ border-color: var(--semi-color-warning);
1269
+ }
1270
+ .semi-input-wrapper-warning:active {
1271
+ background-color: var(--semi-color-warning-light-active);
1272
+ border-color: var(--semi-color-warning);
1273
+ }
1274
+ .semi-input-wrapper__with-prefix {
1275
+ display: inline-flex;
1276
+ align-items: center;
1277
+ }
1278
+ .semi-input-wrapper__with-prefix .semi-input {
1279
+ padding-left: 0;
1280
+ }
1281
+ .semi-input-wrapper__with-suffix {
1282
+ display: inline-flex;
1283
+ align-items: center;
1284
+ }
1285
+ .semi-input-wrapper__with-suffix .semi-input {
1286
+ padding-right: 0;
1287
+ }
1288
+ .semi-input-wrapper-clearable, .semi-input-wrapper-modebtn {
1289
+ display: inline-flex;
1290
+ align-items: center;
1291
+ }
1292
+ .semi-input-wrapper-hidden {
1293
+ border: none;
1294
+ }
1295
+ .semi-input-wrapper .semi-icon {
1296
+ color: var(--semi-color-text-2);
1297
+ }
1298
+ .semi-input-wrapper .semi-input-clearbtn,
1299
+ .semi-input-wrapper .semi-input-modebtn {
1300
+ color: var(--semi-color-primary-hover);
1301
+ }
1302
+ .semi-input-wrapper .semi-input-clearbtn > svg,
1303
+ .semi-input-wrapper .semi-input-modebtn > svg {
1304
+ pointer-events: none;
1305
+ }
1306
+ .semi-input-wrapper .semi-input-clearbtn:hover,
1307
+ .semi-input-wrapper .semi-input-modebtn:hover {
1308
+ cursor: pointer;
1309
+ }
1310
+ .semi-input-wrapper .semi-input-clearbtn:hover .semi-icon,
1311
+ .semi-input-wrapper .semi-input-modebtn:hover .semi-icon {
1312
+ color: var(--semi-color-primary-hover);
1313
+ }
1314
+ .semi-input-wrapper .semi-input-clearbtn:focus-visible,
1315
+ .semi-input-wrapper .semi-input-modebtn:focus-visible {
1316
+ border-radius: var(--semi-border-radius-small);
1317
+ outline: 2px solid var(--semi-color-primary-light-active);
1318
+ outline-offset: -1px;
1319
+ }
1320
+ .semi-input-wrapper__with-suffix-icon.semi-input-wrapper-clearable:not(.semi-input-wrapper__with-suffix-hidden) .semi-input-clearbtn {
1321
+ min-width: 24px;
1322
+ justify-content: flex-end;
1323
+ }
1324
+ .semi-input-wrapper-modebtn.semi-input-wrapper-clearable .semi-input-clearbtn {
1325
+ min-width: 16px;
1326
+ justify-content: center;
1327
+ }
1328
+ .semi-input-wrapper.semi-input-wrapper__with-append-only .semi-input {
1329
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1330
+ }
1331
+ .semi-input-wrapper.semi-input-wrapper__with-append-only .semi-input:not(:last-child) {
1332
+ border-right-style: none;
1333
+ border-radius: 0;
1334
+ }
1335
+ .semi-input-wrapper.semi-input-wrapper__with-prepend-only .semi-input {
1336
+ border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
1337
+ }
1338
+ .semi-input-wrapper.semi-input-wrapper__with-prepend-only .semi-input:not(:last-child) {
1339
+ border-right-style: none;
1340
+ }
1341
+ .semi-input-wrapper.semi-input-wrapper__with-prepend, .semi-input-wrapper.semi-input-wrapper__with-append {
1342
+ display: inline-flex;
1343
+ align-items: center;
1344
+ background-color: transparent;
1345
+ }
1346
+ .semi-input-wrapper.semi-input-wrapper__with-prepend:hover, .semi-input-wrapper.semi-input-wrapper__with-append:hover {
1347
+ background-color: transparent;
1348
+ }
1349
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-focus, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-focus {
1350
+ border: 1px transparent solid;
1351
+ background-color: transparent;
1352
+ }
1353
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input {
1354
+ background-color: var(--semi-color-fill-0);
1355
+ border: 1px transparent solid;
1356
+ }
1357
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover {
1358
+ background-color: var(--semi-color-fill-1);
1359
+ }
1360
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover ~ .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover ~ .semi-input-modebtn {
1361
+ background-color: var(--semi-color-fill-1);
1362
+ }
1363
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus {
1364
+ border: 1px var(--semi-color-focus-border) solid;
1365
+ background-color: var(--semi-color-fill-0);
1366
+ }
1367
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-modebtn {
1368
+ border-right-style: none;
1369
+ }
1370
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-modebtn + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-modebtn + .semi-input-clearbtn {
1371
+ border-right-style: none;
1372
+ }
1373
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus ~ .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus ~ .semi-input-modebtn {
1374
+ box-sizing: border-box;
1375
+ background-color: var(--semi-color-fill-0);
1376
+ }
1377
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus + .semi-input-clearbtn {
1378
+ border: 1px var(--semi-color-focus-border) solid;
1379
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1380
+ border-left-style: none;
1381
+ }
1382
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus + .semi-input-clearbtn:not(:last-child), .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus + .semi-input-clearbtn:not(:last-child) {
1383
+ border-radius: 0;
1384
+ }
1385
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus ~ .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus ~ .semi-input-modebtn {
1386
+ border: 1px var(--semi-color-focus-border) solid;
1387
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1388
+ border-left-style: none;
1389
+ }
1390
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus ~ .semi-input-modebtn:not(:last-child), .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus ~ .semi-input-modebtn:not(:last-child) {
1391
+ border-radius: 0;
1392
+ }
1393
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active {
1394
+ background-color: var(--semi-color-fill-2);
1395
+ }
1396
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active ~ .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active ~ .semi-input-modebtn {
1397
+ background-color: var(--semi-color-fill-2);
1398
+ }
1399
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:hover {
1400
+ background-color: var(--semi-color-fill-0);
1401
+ }
1402
+ .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:hover:last-child {
1403
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1404
+ }
1405
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error {
1406
+ border-color: transparent;
1407
+ }
1408
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input {
1409
+ background-color: var(--semi-color-danger-light-default);
1410
+ border-color: var(--semi-color-danger-light-default);
1411
+ }
1412
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover {
1413
+ background-color: var(--semi-color-danger-light-hover);
1414
+ border-color: var(--semi-color-danger-light-hover);
1415
+ }
1416
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover + .semi-input-modebtn {
1417
+ background-color: var(--semi-color-danger-light-hover);
1418
+ }
1419
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus {
1420
+ background-color: var(--semi-color-danger-light-default);
1421
+ border-color: var(--semi-color-danger);
1422
+ }
1423
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus + .semi-input-modebtn {
1424
+ background-color: var(--semi-color-danger-light-default);
1425
+ border-color: var(--semi-color-danger);
1426
+ }
1427
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active {
1428
+ background-color: var(--semi-color-danger-light-active);
1429
+ }
1430
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active + .semi-input-modebtn {
1431
+ background-color: var(--semi-color-danger-light-active);
1432
+ border-color: var(--semi-color-danger);
1433
+ }
1434
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:hover {
1435
+ background-color: var(--semi-color-danger-light-default);
1436
+ }
1437
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:hover:last-child {
1438
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1439
+ }
1440
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning {
1441
+ border-color: transparent;
1442
+ }
1443
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input {
1444
+ background-color: var(--semi-color-warning-light-default);
1445
+ border-color: var(--semi-color-warning-light-default);
1446
+ }
1447
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover {
1448
+ background-color: var(--semi-color-warning-light-hover);
1449
+ border-color: var(--semi-color-warning-light-hover);
1450
+ }
1451
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover + .semi-input-modebtn {
1452
+ background-color: var(--semi-color-warning-light-hover);
1453
+ }
1454
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus {
1455
+ background-color: var(--semi-color-warning-light-default);
1456
+ border-color: var(--semi-color-warning);
1457
+ }
1458
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus + .semi-input-modebtn {
1459
+ background-color: var(--semi-color-warning-light-default);
1460
+ border-color: var(--semi-color-warning);
1461
+ }
1462
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active {
1463
+ background-color: var(--semi-color-warning-light-active);
1464
+ }
1465
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active + .semi-input-modebtn {
1466
+ background-color: var(--semi-color-warning-light-active);
1467
+ border-color: var(--semi-color-warning);
1468
+ }
1469
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:hover {
1470
+ background-color: var(--semi-color-warning-light-default);
1471
+ }
1472
+ .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:hover:last-child {
1473
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1474
+ }
1475
+ .semi-input-wrapper-disabled {
1476
+ cursor: not-allowed;
1477
+ color: var(--semi-color-disabled-text);
1478
+ background-color: var(--semi-color-disabled-fill);
1479
+ -webkit-text-fill-color: var(--semi-color-disabled-text);
1480
+ }
1481
+ .semi-input-wrapper-disabled:hover {
1482
+ background-color: var(--semi-color-disabled-fill);
1483
+ }
1484
+ .semi-input-wrapper-disabled .semi-input-append,
1485
+ .semi-input-wrapper-disabled .semi-input-prepend,
1486
+ .semi-input-wrapper-disabled .semi-input-suffix,
1487
+ .semi-input-wrapper-disabled .semi-input-prefix,
1488
+ .semi-input-wrapper-disabled .semi-icon {
1489
+ color: var(--semi-color-disabled-text);
1490
+ }
1491
+
1492
+ .semi-input {
1493
+ border: none;
1494
+ outline: none;
1495
+ width: 100%;
1496
+ color: inherit;
1497
+ padding-left: 12px;
1498
+ padding-right: 12px;
1499
+ background-color: transparent;
1500
+ box-sizing: border-box;
1501
+ }
1502
+ .semi-input:placeholder-shown {
1503
+ text-overflow: ellipsis;
1504
+ }
1505
+ .semi-input[type=password]::-ms-reveal, .semi-input[type=password]::-ms-clear {
1506
+ display: none;
1507
+ }
1508
+ .semi-input[type=search]::-webkit-search-cancel-button {
1509
+ display: none;
1510
+ }
1511
+ .semi-input::placeholder {
1512
+ color: var(--semi-color-text-2);
1513
+ }
1514
+ .semi-input-large {
1515
+ height: 38px;
1516
+ font-size: 16px;
1517
+ line-height: 22px;
1518
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1519
+ line-height: 38px;
1520
+ }
1521
+ .semi-input-small {
1522
+ height: 22px;
1523
+ font-size: 14px;
1524
+ line-height: 20px;
1525
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1526
+ line-height: 22px;
1527
+ }
1528
+ .semi-input-default {
1529
+ height: 30px;
1530
+ font-size: 14px;
1531
+ line-height: 20px;
1532
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1533
+ line-height: 30px;
1534
+ }
1535
+ .semi-input-disabled {
1536
+ cursor: not-allowed;
1537
+ color: inherit;
1538
+ }
1539
+ .semi-input-inset-label {
1540
+ margin: 0 12px;
1541
+ font-weight: 600;
1542
+ color: var(--semi-color-text-2);
1543
+ flex-shrink: 0;
1544
+ white-space: nowrap;
1545
+ }
1546
+ .semi-input-prefix, .semi-input-suffix {
1547
+ display: flex;
1548
+ justify-content: center;
1549
+ align-items: center;
1550
+ }
1551
+ .semi-input-prefix-text, .semi-input-suffix-text {
1552
+ margin: 0 12px;
1553
+ color: var(--semi-color-text-2);
1554
+ font-weight: 600;
1555
+ white-space: nowrap;
1556
+ }
1557
+ .semi-input-prefix-icon, .semi-input-suffix-icon {
1558
+ color: var(--semi-color-text-2);
1559
+ margin: 0 8px;
1560
+ }
1561
+ .semi-input-suffix {
1562
+ display: flex;
1563
+ justify-content: center;
1564
+ align-items: center;
1565
+ }
1566
+ .semi-input-clearbtn, .semi-input-modebtn {
1567
+ display: flex;
1568
+ align-items: center;
1569
+ height: 100%;
1570
+ justify-content: center;
1571
+ min-width: 32px;
1572
+ }
1573
+ .semi-input-clearbtn + .semi-input-suffix + .semi-input-suffix-text {
1574
+ margin-left: 0;
1575
+ }
1576
+ .semi-input-clearbtn + .semi-input-suffix + .semi-input-suffix-icon {
1577
+ margin-left: 0;
1578
+ }
1579
+ .semi-input-suffix-hidden {
1580
+ display: none;
1581
+ }
1582
+ .semi-input-prepend, .semi-input-append {
1583
+ height: 100%;
1584
+ display: flex;
1585
+ align-items: center;
1586
+ background-color: var(--semi-color-fill-0);
1587
+ color: var(--semi-color-text-2);
1588
+ font-size: 14px;
1589
+ line-height: 20px;
1590
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1591
+ flex-shrink: 0;
1592
+ }
1593
+ .semi-input-prepend-icon, .semi-input-prepend-text, .semi-input-append-icon, .semi-input-append-text {
1594
+ padding: 0 12px;
1595
+ }
1596
+ .semi-input-append {
1597
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1598
+ border-left: 1px transparent solid;
1599
+ }
1600
+ .semi-input-prepend {
1601
+ border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
1602
+ border-right: 1px transparent solid;
1603
+ }
1604
+ .semi-input-disabled::placeholder {
1605
+ color: var(--semi-color-disabled-text);
1606
+ }
1607
+ .semi-input-group {
1608
+ display: inline-flex;
1609
+ align-items: center;
1610
+ align-content: center;
1611
+ flex-wrap: wrap;
1612
+ }
1613
+ .semi-input-group .semi-select,
1614
+ .semi-input-group .semi-tagInput,
1615
+ .semi-input-group .semi-cascader,
1616
+ .semi-input-group .semi-tree-select, .semi-input-group > .semi-input-wrapper {
1617
+ border-radius: 0;
1618
+ }
1619
+ .semi-input-group .semi-select:first-child,
1620
+ .semi-input-group .semi-tagInput:first-child,
1621
+ .semi-input-group .semi-cascader:first-child,
1622
+ .semi-input-group .semi-tree-select:first-child, .semi-input-group > .semi-input-wrapper:first-child {
1623
+ border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
1624
+ }
1625
+ .semi-input-group .semi-select:last-child,
1626
+ .semi-input-group .semi-tagInput:last-child,
1627
+ .semi-input-group .semi-cascader:last-child,
1628
+ .semi-input-group .semi-tree-select:last-child, .semi-input-group > .semi-input-wrapper:last-child {
1629
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1630
+ }
1631
+ .semi-input-group .semi-select:not(:last-child),
1632
+ .semi-input-group .semi-tagInput:not(:last-child),
1633
+ .semi-input-group .semi-cascader:not(:last-child),
1634
+ .semi-input-group .semi-tree-select:not(:last-child), .semi-input-group > .semi-input-wrapper:not(:last-child) {
1635
+ position: relative;
1636
+ }
1637
+ .semi-input-group .semi-select:not(:last-child)::after,
1638
+ .semi-input-group .semi-tagInput:not(:last-child)::after,
1639
+ .semi-input-group .semi-cascader:not(:last-child)::after,
1640
+ .semi-input-group .semi-tree-select:not(:last-child)::after, .semi-input-group > .semi-input-wrapper:not(:last-child)::after {
1641
+ content: "";
1642
+ background-color: var(--semi-color-border);
1643
+ width: 1px;
1644
+ position: absolute;
1645
+ right: -1px;
1646
+ top: 1px;
1647
+ bottom: 1px;
1648
+ }
1649
+ .semi-input-group .semi-select {
1650
+ overflow-y: visible;
1651
+ }
1652
+ .semi-input-group .semi-input-number .semi-input-wrapper,
1653
+ .semi-input-group .semi-input-number .semi-datepicker-range-input,
1654
+ .semi-input-group .semi-datepicker .semi-input-wrapper,
1655
+ .semi-input-group .semi-datepicker .semi-datepicker-range-input,
1656
+ .semi-input-group .semi-timepicker .semi-input-wrapper,
1657
+ .semi-input-group .semi-timepicker .semi-datepicker-range-input,
1658
+ .semi-input-group .semi-autocomplete .semi-input-wrapper,
1659
+ .semi-input-group .semi-autocomplete .semi-datepicker-range-input {
1660
+ border-radius: 0;
1661
+ }
1662
+ .semi-input-group .semi-input-number:first-child .semi-input-wrapper,
1663
+ .semi-input-group .semi-input-number:first-child .semi-datepicker-range-input,
1664
+ .semi-input-group .semi-datepicker:first-child .semi-input-wrapper,
1665
+ .semi-input-group .semi-datepicker:first-child .semi-datepicker-range-input,
1666
+ .semi-input-group .semi-timepicker:first-child .semi-input-wrapper,
1667
+ .semi-input-group .semi-timepicker:first-child .semi-datepicker-range-input,
1668
+ .semi-input-group .semi-autocomplete:first-child .semi-input-wrapper,
1669
+ .semi-input-group .semi-autocomplete:first-child .semi-datepicker-range-input {
1670
+ border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
1671
+ }
1672
+ .semi-input-group .semi-input-number:last-child .semi-input-wrapper,
1673
+ .semi-input-group .semi-input-number:last-child .semi-datepicker-range-input,
1674
+ .semi-input-group .semi-datepicker:last-child .semi-input-wrapper,
1675
+ .semi-input-group .semi-datepicker:last-child .semi-datepicker-range-input,
1676
+ .semi-input-group .semi-timepicker:last-child .semi-input-wrapper,
1677
+ .semi-input-group .semi-timepicker:last-child .semi-datepicker-range-input,
1678
+ .semi-input-group .semi-autocomplete:last-child .semi-input-wrapper,
1679
+ .semi-input-group .semi-autocomplete:last-child .semi-datepicker-range-input {
1680
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1681
+ }
1682
+ .semi-input-group .semi-input-number:not(:last-child),
1683
+ .semi-input-group .semi-datepicker:not(:last-child),
1684
+ .semi-input-group .semi-timepicker:not(:last-child),
1685
+ .semi-input-group .semi-autocomplete:not(:last-child) {
1686
+ position: relative;
1687
+ }
1688
+ .semi-input-group .semi-input-number:not(:last-child)::after,
1689
+ .semi-input-group .semi-datepicker:not(:last-child)::after,
1690
+ .semi-input-group .semi-timepicker:not(:last-child)::after,
1691
+ .semi-input-group .semi-autocomplete:not(:last-child)::after {
1692
+ content: "";
1693
+ background-color: var(--semi-color-border);
1694
+ width: 1px;
1695
+ position: absolute;
1696
+ right: -1px;
1697
+ top: 1px;
1698
+ bottom: 1px;
1699
+ }
1700
+ .semi-input-group-wrapper-with-top-label {
1701
+ margin-top: 16px;
1702
+ margin-bottom: 16px;
1703
+ }
1704
+ .semi-input-group-wrapper-with-top-label .semi-input-group {
1705
+ display: flex;
1706
+ }
1707
+ .semi-input-group-wrapper-with-top-label .semi-input-group .semi-form-field {
1708
+ margin-top: 0;
1709
+ margin-bottom: 0;
1710
+ }
1711
+
1712
+ .semi-input-only_border {
1713
+ background: transparent;
1714
+ border-color: var(--semi-color-border);
1715
+ }
1716
+ .semi-input-only_border:hover {
1717
+ background: transparent;
1718
+ border-color: var(--semi-color-border);
1719
+ }
1720
+ .semi-input-only_border:focus-within {
1721
+ background: transparent;
1722
+ }
1723
+
1724
+ .semi-input-borderless:not(:focus-within):not(:hover) {
1725
+ background-color: transparent;
1726
+ border-color: transparent;
1727
+ }
1728
+ .semi-input-borderless:focus-within:not(:active) {
1729
+ background-color: transparent;
1730
+ }
1731
+ .semi-input-borderless.semi-input-wrapper-error:not(:focus-within) {
1732
+ border-color: var(--semi-color-danger);
1733
+ }
1734
+ .semi-input-borderless.semi-input-wrapper-warning:not(:focus-within) {
1735
+ border-color: var(--semi-color-warning);
1736
+ }
1737
+
1738
+ .semi-rtl .semi-input-wrapper,
1739
+ .semi-portal-rtl .semi-input-wrapper {
1740
+ direction: rtl;
1741
+ }
1742
+ .semi-rtl .semi-input-wrapper__with-prefix .semi-input,
1743
+ .semi-portal-rtl .semi-input-wrapper__with-prefix .semi-input {
1744
+ padding-left: auto;
1745
+ padding-right: 0;
1746
+ }
1747
+ .semi-rtl .semi-input-wrapper__with-suffix .semi-input,
1748
+ .semi-portal-rtl .semi-input-wrapper__with-suffix .semi-input {
1749
+ padding-right: auto;
1750
+ padding-left: 0;
1751
+ }
1752
+ .semi-rtl .semi-input,
1753
+ .semi-portal-rtl .semi-input {
1754
+ padding-left: 12px;
1755
+ padding-right: 12px;
1756
+ }
1757
+ .semi-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-text,
1758
+ .semi-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-text,
1759
+ .semi-portal-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-text,
1760
+ .semi-portal-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-text {
1761
+ margin-left: auto;
1762
+ margin-right: 0;
1763
+ }
1764
+ .semi-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-icon,
1765
+ .semi-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-icon,
1766
+ .semi-portal-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-icon,
1767
+ .semi-portal-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-icon {
1768
+ margin-left: auto;
1769
+ margin-right: 0;
1770
+ }
1771
+ .semi-rtl .semi-input-append,
1772
+ .semi-portal-rtl .semi-input-append {
1773
+ border-left: 0;
1774
+ border-right: 1px transparent solid;
1775
+ }
1776
+ .semi-rtl .semi-input-prepend,
1777
+ .semi-portal-rtl .semi-input-prepend {
1778
+ border-right: 0;
1779
+ border-left: 1px transparent solid;
1780
+ }
1781
+ .semi-rtl .semi-input-group .semi-select:not(:last-child)::after,
1782
+ .semi-rtl .semi-input-group .semi-cascader:not(:last-child)::after,
1783
+ .semi-rtl .semi-input-group .semi-tree-select:not(:last-child)::after, .semi-rtl .semi-input-group > .semi-input-wrapper:not(:last-child)::after,
1784
+ .semi-portal-rtl .semi-input-group .semi-select:not(:last-child)::after,
1785
+ .semi-portal-rtl .semi-input-group .semi-cascader:not(:last-child)::after,
1786
+ .semi-portal-rtl .semi-input-group .semi-tree-select:not(:last-child)::after,
1787
+ .semi-portal-rtl .semi-input-group > .semi-input-wrapper:not(:last-child)::after {
1788
+ right: auto;
1789
+ left: -1px;
1790
+ }
1791
+ .semi-rtl .semi-input-group .semi-input-number:not(:last-child)::after,
1792
+ .semi-portal-rtl .semi-input-group .semi-input-number:not(:last-child)::after {
1793
+ right: auto;
1794
+ left: -1px;
1795
+ }
1796
+ .semi-rtl .semi-input-textarea-wrapper,
1797
+ .semi-portal-rtl .semi-input-textarea-wrapper {
1798
+ direction: rtl;
1799
+ }
1800
+ .semi-rtl .semi-input-textarea-counter,
1801
+ .semi-portal-rtl .semi-input-textarea-counter {
1802
+ text-align: left;
1803
+ }
1804
+ .semi-rtl .semi-input-textarea-showClear,
1805
+ .semi-portal-rtl .semi-input-textarea-showClear {
1806
+ padding-right: 0;
1807
+ padding-left: 36px;
1808
+ }
1809
+
1810
+ .semi-button-split {
1811
+ display: inline-block;
1812
+ }
1813
+ .semi-button-split .semi-button {
1814
+ border-radius: 0;
1815
+ margin-right: 1px;
1816
+ }
1817
+ .semi-button-split .semi-button-first {
1818
+ border-top-left-radius: var(--semi-border-radius-small);
1819
+ border-bottom-left-radius: var(--semi-border-radius-small);
1820
+ }
1821
+ .semi-button-split .semi-button-last {
1822
+ border-top-right-radius: var(--semi-border-radius-small);
1823
+ border-bottom-right-radius: var(--semi-border-radius-small);
1824
+ margin-right: unset;
1825
+ }
1826
+ .semi-button-split:hover .semi-button-borderless:active {
1827
+ background-color: var(--semi-color-fill-1);
1828
+ }
1829
+
1830
+ .semi-button {
1831
+ --semi-button-colorful-multiple-fill-0: rgba(var(--semi-ai-general-5-3));
1832
+ --semi-button-colorful-multiple-fill-1: rgba(var(--semi-ai-general-5-2));
1833
+ --semi-button-colorful-multiple-fill-2: rgba(var(--semi-ai-general-5-1));
1834
+ --semi-button-colorful-multiple-fill-3: rgba(var(--semi-ai-general-5-0));
1835
+ --semi-button-colorful-disabled-fill: var(--semi-color-disabled-text);
1836
+ --semi-button-colorful-fill-primary: var(--semi-color-ai-purple);
1837
+ --semi-button-colorful-fill-secondary: var(--semi-color-text-0);
1838
+ }
1839
+
1840
+ .semi-button {
1841
+ box-shadow: none;
1842
+ height: 32px;
1843
+ display: inline-flex;
1844
+ align-items: center;
1845
+ justify-content: center;
1846
+ cursor: pointer;
1847
+ user-select: none;
1848
+ border: 0 transparent solid;
1849
+ border-radius: var(--semi-border-radius-small);
1850
+ padding-left: 12px;
1851
+ padding-right: 12px;
1852
+ padding-top: 6px;
1853
+ padding-bottom: 6px;
1854
+ font-family: inherit;
1855
+ font-size: 14px;
1856
+ line-height: 20px;
1857
+ font-weight: 600;
1858
+ outline: none;
1859
+ vertical-align: middle;
1860
+ white-space: nowrap;
1861
+ }
1862
+ .semi-button.semi-button-primary:focus-visible, .semi-button.semi-button-secondary:focus-visible, .semi-button.semi-button-tertiary:focus-visible, .semi-button.semi-button-warning:focus-visible, .semi-button.semi-button-danger:focus-visible {
1863
+ outline: 2px solid var(--semi-color-primary-light-active);
1864
+ }
1865
+ .semi-button-content {
1866
+ display: flex;
1867
+ align-items: center;
1868
+ }
1869
+ .semi-button-danger {
1870
+ background-color: var(--semi-color-danger);
1871
+ color: rgba(var(--semi-white), 1);
1872
+ transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
1873
+ transform: scale(var(--semi-transform_scale-none));
1874
+ }
1875
+ .semi-button-danger-disabled {
1876
+ background-color: var(--semi-color-disabled-bg);
1877
+ }
1878
+ .semi-button-danger-disabled.semi-button-outline {
1879
+ background-color: transparent;
1880
+ border: 1px solid var(--semi-color-border);
1881
+ }
1882
+ .semi-button-danger-disabled.semi-button-light {
1883
+ background-color: var(--semi-color-fill-0);
1884
+ }
1885
+ .semi-button-danger:hover {
1886
+ background-color: var(--semi-color-danger-hover);
1887
+ }
1888
+ .semi-button-danger:active {
1889
+ background-color: var(--semi-color-danger-active);
1890
+ }
1891
+ .semi-button-danger.semi-button-outline {
1892
+ background-color: transparent;
1893
+ border: 1px solid var(--semi-color-danger);
1894
+ }
1895
+ .semi-button-danger.semi-button-light, .semi-button-danger.semi-button-outline, .semi-button-danger.semi-button-borderless {
1896
+ color: var(--semi-color-danger);
1897
+ }
1898
+ .semi-button-danger:not(.semi-button-borderless):not(.semi-button-light):focus-visible {
1899
+ outline: 2px solid var(--semi-color-danger-light-active);
1900
+ }
1901
+ .semi-button-warning {
1902
+ background-color: var(--semi-color-warning);
1903
+ color: rgba(var(--semi-white), 1);
1904
+ transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
1905
+ transform: scale(var(--semi-transform_scale-none));
1906
+ }
1907
+ .semi-button-warning-disabled {
1908
+ background-color: var(--semi-color-disabled-bg);
1909
+ }
1910
+ .semi-button-warning-disabled.semi-button-outline {
1911
+ background-color: transparent;
1912
+ border: 1px solid var(--semi-color-border);
1913
+ }
1914
+ .semi-button-warning-disabled.semi-button-light {
1915
+ background-color: var(--semi-color-fill-0);
1916
+ }
1917
+ .semi-button-warning:hover {
1918
+ background-color: var(--semi-color-warning-hover);
1919
+ }
1920
+ .semi-button-warning:active {
1921
+ background-color: var(--semi-color-warning-active);
1922
+ }
1923
+ .semi-button-warning.semi-button-outline {
1924
+ background-color: transparent;
1925
+ border: 1px solid var(--semi-color-warning);
1926
+ }
1927
+ .semi-button-warning.semi-button-light, .semi-button-warning.semi-button-outline, .semi-button-warning.semi-button-borderless {
1928
+ color: var(--semi-color-warning);
1929
+ }
1930
+ .semi-button-warning:not(.semi-button-borderless):not(.semi-button-light):focus-visible {
1931
+ outline: 2px solid var(--semi-color-warning-light-active);
1932
+ }
1933
+ .semi-button-tertiary {
1934
+ background-color: var(--semi-color-tertiary);
1935
+ color: rgba(var(--semi-white), 1);
1936
+ transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
1937
+ transform: scale(var(--semi-transform_scale-none));
1938
+ }
1939
+ .semi-button-tertiary.semi-button-colorful.semi-button-solid {
1940
+ background: var(--semi-ai-general-0);
1941
+ }
1942
+ .semi-button-tertiary.semi-button-colorful.semi-button-solid:hover {
1943
+ background: var(--semi-ai-general-1);
1944
+ }
1945
+ .semi-button-tertiary.semi-button-colorful.semi-button-solid:active {
1946
+ background: var(--semi-ai-general-2);
1947
+ }
1948
+ .semi-button-tertiary.semi-button-colorful.semi-button-solid .semi-button-content-right, .semi-button-tertiary.semi-button-colorful.semi-button-solid .semi-button-content:not(:has(> .semi-button-content-right)) {
1949
+ background: var(--semi-color-ai-general);
1950
+ background-clip: text;
1951
+ color: transparent;
1952
+ }
1953
+ .semi-button-tertiary-disabled {
1954
+ background-color: var(--semi-color-disabled-bg);
1955
+ }
1956
+ .semi-button-tertiary-disabled.semi-button-outline {
1957
+ background-color: transparent;
1958
+ border: 1px solid var(--semi-color-border);
1959
+ }
1960
+ .semi-button-tertiary-disabled.semi-button-light {
1961
+ background-color: var(--semi-color-fill-0);
1962
+ }
1963
+ .semi-button-tertiary:hover {
1964
+ background-color: var(--semi-color-tertiary-hover);
1965
+ }
1966
+ .semi-button-tertiary:active {
1967
+ background-color: var(--semi-color-tertiary-active);
1968
+ }
1969
+ .semi-button-tertiary.semi-button-outline {
1970
+ background-color: transparent;
1971
+ border: 1px solid var(--semi-color-border);
1972
+ }
1973
+ .semi-button-tertiary.semi-button-light, .semi-button-tertiary.semi-button-outline, .semi-button-tertiary.semi-button-borderless {
1974
+ color: var(--semi-color-text-1);
1975
+ }
1976
+ .semi-button-primary {
1977
+ background-color: var(--semi-color-primary);
1978
+ color: rgba(var(--semi-white), 1);
1979
+ transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
1980
+ transform: scale(var(--semi-transform_scale-none));
1981
+ }
1982
+ .semi-button-primary.semi-button-colorful.semi-button-solid {
1983
+ background: var(--semi-color-ai-general);
1984
+ }
1985
+ .semi-button-primary.semi-button-colorful.semi-button-solid:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
1986
+ background: var(--semi-color-ai-general-hover);
1987
+ }
1988
+ .semi-button-primary.semi-button-colorful.semi-button-solid:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):active {
1989
+ background: var(--semi-color-ai-general-active);
1990
+ }
1991
+ .semi-button-primary.semi-button-colorful.semi-button-light .semi-button-content-right, .semi-button-primary.semi-button-colorful.semi-button-light .semi-button-content:not(:has(> .semi-button-content-right)) {
1992
+ background: var(--semi-color-ai-general);
1993
+ background-clip: text;
1994
+ color: transparent;
1995
+ }
1996
+ .semi-button-primary.semi-button-colorful.semi-button-outline {
1997
+ color: var(--semi-color-ai-purple);
1998
+ border-color: var(--semi-color-ai-purple);
1999
+ }
2000
+ .semi-button-primary.semi-button-colorful.semi-button-borderless .semi-button-content-right, .semi-button-primary.semi-button-colorful.semi-button-borderless .semi-button-content:not(:has(> .semi-button-content-right)) {
2001
+ background: var(--semi-color-ai-general);
2002
+ background-clip: text;
2003
+ color: transparent;
2004
+ }
2005
+ .semi-button-primary-disabled {
2006
+ background-color: var(--semi-color-disabled-bg);
2007
+ }
2008
+ .semi-button-primary-disabled.semi-button-light {
2009
+ background: var(--semi-color-fill-0);
2010
+ }
2011
+ .semi-button-primary-disabled.semi-button-outline {
2012
+ background-color: transparent;
2013
+ border: 1px solid var(--semi-color-border);
2014
+ }
2015
+ .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
2016
+ background-color: var(--semi-color-primary-hover);
2017
+ }
2018
+ .semi-button-primary.semi-button-outline {
2019
+ background-color: transparent;
2020
+ border: 1px solid var(--semi-color-border);
2021
+ }
2022
+ .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):active {
2023
+ background-color: var(--semi-color-primary-active);
2024
+ }
2025
+ .semi-button-primary.semi-button-light, .semi-button-primary.semi-button-outline, .semi-button-primary.semi-button-borderless {
2026
+ color: var(--semi-color-primary);
2027
+ }
2028
+ .semi-button-secondary {
2029
+ background-color: var(--semi-color-secondary);
2030
+ outline-color: var(--semi-color-secondary);
2031
+ color: rgba(var(--semi-white), 1);
2032
+ transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
2033
+ transform: scale(var(--semi-transform_scale-none));
2034
+ }
2035
+ .semi-button-secondary-disabled {
2036
+ background-color: var(--semi-color-disabled-bg);
2037
+ }
2038
+ .semi-button-secondary-disabled.semi-button-outline {
2039
+ background-color: transparent;
2040
+ border: 1px solid var(--semi-color-border);
2041
+ }
2042
+ .semi-button-secondary-disabled.semi-button-light {
2043
+ background-color: var(--semi-color-fill-0);
2044
+ }
2045
+ .semi-button-secondary.semi-button-outline {
2046
+ background-color: transparent;
2047
+ border: 1px solid var(--semi-color-border);
2048
+ }
2049
+ .semi-button-secondary:hover {
2050
+ background-color: var(--semi-color-secondary-hover);
2051
+ }
2052
+ .semi-button-secondary:active {
2053
+ background-color: var(--semi-color-secondary-active);
2054
+ }
2055
+ .semi-button-secondary.semi-button-light, .semi-button-secondary.semi-button-outline, .semi-button-secondary.semi-button-borderless {
2056
+ color: var(--semi-color-secondary);
2057
+ }
2058
+ .semi-button-disabled {
2059
+ color: var(--semi-color-disabled-text);
2060
+ cursor: not-allowed;
2061
+ }
2062
+ .semi-button-disabled:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
2063
+ color: var(--semi-color-disabled-text);
2064
+ }
2065
+ .semi-button-disabled.semi-button-light, .semi-button-disabled.semi-button-borderless {
2066
+ color: var(--semi-color-disabled-text);
2067
+ }
2068
+ .semi-button-disabled.semi-button-outline {
2069
+ color: var(--semi-color-disabled-text);
2070
+ }
2071
+ .semi-button-borderless {
2072
+ background-color: transparent;
2073
+ border: 0 transparent solid;
2074
+ transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
2075
+ transform: scale(var(--semi-transform_scale-none));
2076
+ }
2077
+ .semi-button-borderless:not(.semi-button-disabled):hover {
2078
+ background-color: var(--semi-color-fill-0);
2079
+ border: 0 transparent solid;
2080
+ }
2081
+ .semi-button-borderless:not(.semi-button-disabled):active {
2082
+ background-color: var(--semi-color-fill-1);
2083
+ border: 0 transparent solid;
2084
+ }
2085
+ .semi-button-outline {
2086
+ background-color: transparent;
2087
+ }
2088
+ .semi-button-outline:not(.semi-button-disabled):hover {
2089
+ background-color: var(--semi-color-fill-0);
2090
+ }
2091
+ .semi-button-outline:not(.semi-button-disabled):active {
2092
+ background-color: var(--semi-color-fill-1);
2093
+ }
2094
+ .semi-button-light {
2095
+ background-color: var(--semi-color-fill-0);
2096
+ border: 0 transparent solid;
2097
+ transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
2098
+ transform: scale(var(--semi-transform_scale-none));
2099
+ }
2100
+ .semi-button-light:not(.semi-button-disabled):hover {
2101
+ background-color: var(--semi-color-fill-1);
2102
+ border: 0 transparent solid;
2103
+ }
2104
+ .semi-button-light:not(.semi-button-disabled):active {
2105
+ background-color: var(--semi-color-fill-2);
2106
+ border: 0 transparent solid;
2107
+ }
2108
+ .semi-button-size-small {
2109
+ height: 24px;
2110
+ padding-top: 2px;
2111
+ padding-bottom: 2px;
2112
+ padding-left: 12px;
2113
+ padding-right: 12px;
2114
+ font-size: 14px;
2115
+ line-height: 20px;
2116
+ font-weight: 600;
2117
+ }
2118
+ .semi-button-size-large {
2119
+ height: 40px;
2120
+ padding-top: 10px;
2121
+ padding-bottom: 10px;
2122
+ padding-left: 16px;
2123
+ padding-right: 16px;
2124
+ font-size: 14px;
2125
+ line-height: 20px;
2126
+ font-weight: 600;
2127
+ }
2128
+ .semi-button-block {
2129
+ width: 100%;
2130
+ }
2131
+ .semi-button-group {
2132
+ display: flex;
2133
+ flex-wrap: wrap;
2134
+ }
2135
+ .semi-button-group > .semi-button {
2136
+ margin: 0;
2137
+ padding-left: 0;
2138
+ padding-right: 0;
2139
+ border-radius: 0;
2140
+ }
2141
+ .semi-button-group > .semi-button .semi-button-content {
2142
+ padding-left: 12px;
2143
+ padding-right: 12px;
2144
+ }
2145
+ .semi-button-group > .semi-button-size-large .semi-button-content {
2146
+ padding-left: 16px;
2147
+ padding-right: 16px;
2148
+ }
2149
+ .semi-button-group > .semi-button-size-small .semi-button-content {
2150
+ padding-left: 12px;
2151
+ padding-right: 12px;
2152
+ }
2153
+ .semi-button-group > .semi-button.semi-button-with-icon-only {
2154
+ padding-left: 0;
2155
+ padding-right: 0;
2156
+ }
2157
+ .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content {
2158
+ padding-left: 8px;
2159
+ padding-right: 8px;
2160
+ }
2161
+ .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
2162
+ padding-left: 4px;
2163
+ padding-right: 4px;
2164
+ }
2165
+ .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
2166
+ padding-left: 12px;
2167
+ padding-right: 12px;
2168
+ }
2169
+ .semi-button-group > .semi-button:first-child {
2170
+ border-top-left-radius: var(--semi-border-radius-small);
2171
+ border-bottom-left-radius: var(--semi-border-radius-small);
2172
+ }
2173
+ .semi-button-group > .semi-button:last-child {
2174
+ border-top-right-radius: var(--semi-border-radius-small);
2175
+ border-bottom-right-radius: var(--semi-border-radius-small);
2176
+ }
2177
+ .semi-button-group > .semi-button-outline:not(:last-child) {
2178
+ border-right-color: transparent;
2179
+ margin-right: -1px;
2180
+ }
2181
+ .semi-button-group-line {
2182
+ display: inline-flex;
2183
+ align-items: center;
2184
+ background-color: var(--semi-color-border);
2185
+ }
2186
+ .semi-button-group-line-primary {
2187
+ background-color: var(--semi-color-primary);
2188
+ }
2189
+ .semi-button-group-line-secondary {
2190
+ background-color: var(--semi-color-secondary);
2191
+ }
2192
+ .semi-button-group-line-tertiary {
2193
+ background-color: var(--semi-color-tertiary);
2194
+ }
2195
+ .semi-button-group-line-warning {
2196
+ background-color: var(--semi-color-warning);
2197
+ }
2198
+ .semi-button-group-line-danger {
2199
+ background-color: var(--semi-color-danger);
2200
+ }
2201
+ .semi-button-group-line-disabled {
2202
+ background-color: var(--semi-color-disabled-bg);
2203
+ }
2204
+ .semi-button-group-line-light {
2205
+ background-color: var(--semi-color-fill-0);
2206
+ }
2207
+ .semi-button-group-line-borderless {
2208
+ background-color: transparent;
2209
+ }
2210
+ .semi-button-group-line::before {
2211
+ display: block;
2212
+ content: "";
2213
+ width: 1px;
2214
+ height: 20px;
2215
+ background-color: var(--semi-color-border);
2216
+ }
2217
+
2218
+ .semi-rtl .semi-button,
2219
+ .semi-portal-rtl .semi-button {
2220
+ direction: rtl;
2221
+ padding-left: 12px;
2222
+ padding-right: 12px;
2223
+ }
2224
+ .semi-rtl .semi-button-size-small,
2225
+ .semi-portal-rtl .semi-button-size-small {
2226
+ padding-left: 12px;
2227
+ padding-right: 12px;
2228
+ }
2229
+ .semi-rtl .semi-button-size-large,
2230
+ .semi-portal-rtl .semi-button-size-large {
2231
+ padding-left: 16px;
2232
+ padding-right: 16px;
2233
+ }
2234
+ .semi-rtl .semi-button-group,
2235
+ .semi-portal-rtl .semi-button-group {
2236
+ direction: rtl;
2237
+ }
2238
+ .semi-rtl .semi-button-group > .semi-button,
2239
+ .semi-portal-rtl .semi-button-group > .semi-button {
2240
+ padding-left: 0;
2241
+ padding-right: 0;
2242
+ }
2243
+ .semi-rtl .semi-button-group > .semi-button .semi-button-content,
2244
+ .semi-portal-rtl .semi-button-group > .semi-button .semi-button-content {
2245
+ padding-left: 12px;
2246
+ padding-right: 12px;
2247
+ }
2248
+ .semi-rtl .semi-button-group > .semi-button-size-large .semi-button-content,
2249
+ .semi-portal-rtl .semi-button-group > .semi-button-size-large .semi-button-content {
2250
+ padding-left: 16px;
2251
+ padding-right: 16px;
2252
+ }
2253
+ .semi-rtl .semi-button-group > .semi-button-size-small .semi-button-content,
2254
+ .semi-portal-rtl .semi-button-group > .semi-button-size-small .semi-button-content {
2255
+ padding-left: 12px;
2256
+ padding-right: 12px;
2257
+ }
2258
+ .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only,
2259
+ .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only {
2260
+ padding-left: 0;
2261
+ padding-right: 0;
2262
+ }
2263
+ .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content,
2264
+ .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content {
2265
+ padding-left: 8px;
2266
+ padding-right: 8px;
2267
+ }
2268
+ .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content,
2269
+ .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
2270
+ padding-left: 4px;
2271
+ padding-right: 4px;
2272
+ }
2273
+ .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content,
2274
+ .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
2275
+ padding-left: 12px;
2276
+ padding-right: 12px;
2277
+ }
2278
+ .semi-rtl .semi-button-group > .semi-button:first-child,
2279
+ .semi-portal-rtl .semi-button-group > .semi-button:first-child {
2280
+ border-top-left-radius: 0;
2281
+ border-bottom-left-radius: 0;
2282
+ border-top-right-radius: var(--semi-border-radius-small);
2283
+ border-bottom-right-radius: var(--semi-border-radius-small);
2284
+ }
2285
+ .semi-rtl .semi-button-group > .semi-button:not(:last-child) .semi-button-content,
2286
+ .semi-portal-rtl .semi-button-group > .semi-button:not(:last-child) .semi-button-content {
2287
+ border-left: 1px var(--semi-color-border) solid;
2288
+ border-right: 0;
2289
+ }
2290
+ .semi-rtl .semi-button-group > .semi-button:last-child,
2291
+ .semi-portal-rtl .semi-button-group > .semi-button:last-child {
2292
+ border-top-right-radius: 0;
2293
+ border-bottom-right-radius: 0;
2294
+ border-top-left-radius: var(--semi-border-radius-small);
2295
+ border-bottom-left-radius: var(--semi-border-radius-small);
2296
+ }
2297
+ .semi-rtl .semi-button.semi-button-with-icon-only,
2298
+ .semi-portal-rtl .semi-button.semi-button-with-icon-only {
2299
+ padding-left: 8px;
2300
+ padding-right: 8px;
2301
+ }
2302
+ .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small,
2303
+ .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small {
2304
+ padding-left: 4px;
2305
+ padding-right: 4px;
2306
+ }
2307
+ .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large,
2308
+ .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large {
2309
+ padding-left: 12px;
2310
+ padding-right: 12px;
2311
+ }
2312
+ .semi-rtl .semi-button-content-left,
2313
+ .semi-portal-rtl .semi-button-content-left {
2314
+ margin-left: 8px;
2315
+ margin-right: 0;
2316
+ }
2317
+ .semi-rtl .semi-button-content-right,
2318
+ .semi-portal-rtl .semi-button-content-right {
2319
+ margin-right: 8px;
2320
+ margin-left: 0;
2321
+ }
2322
+
2323
+ @keyframes semi-animation-rotate {
2324
+ from {
2325
+ transform: rotate(0);
2326
+ }
2327
+ to {
2328
+ transform: rotate(360deg);
2329
+ }
2330
+ }
2331
+ .semi-button.semi-button-with-icon {
2332
+ display: inline-flex;
2333
+ align-items: center;
2334
+ }
2335
+ .semi-button.semi-button-with-icon .semi-button-content {
2336
+ display: flex;
2337
+ align-items: center;
2338
+ justify-content: center;
2339
+ }
2340
+ .semi-button.semi-button-loading {
2341
+ pointer-events: none;
2342
+ cursor: not-allowed;
2343
+ }
2344
+ .semi-button.semi-button-loading .semi-button-content > svg, .semi-button.semi-button-loading .semi-button-content-loading-icon {
2345
+ width: 16px;
2346
+ height: 16px;
2347
+ animation: 600ms linear infinite semi-animation-rotate;
2348
+ animation-fill-mode: forwards;
2349
+ }
2350
+ .semi-button.semi-button-with-icon-only {
2351
+ padding-left: 8px;
2352
+ padding-right: 8px;
2353
+ padding-top: 8px;
2354
+ padding-bottom: 8px;
2355
+ height: 32px;
2356
+ width: 32px;
2357
+ justify-content: center;
2358
+ align-items: center;
2359
+ }
2360
+ .semi-button.semi-button-with-icon-only.semi-button-size-small {
2361
+ padding-left: 4px;
2362
+ padding-right: 4px;
2363
+ padding-top: 4px;
2364
+ padding-bottom: 4px;
2365
+ height: 24px;
2366
+ width: 24px;
2367
+ }
2368
+ .semi-button.semi-button-with-icon-only.semi-button-size-large {
2369
+ padding-left: 12px;
2370
+ padding-right: 12px;
2371
+ padding-top: 12px;
2372
+ padding-bottom: 12px;
2373
+ height: 40px;
2374
+ width: 40px;
2375
+ }
2376
+ .semi-button-content-left {
2377
+ margin-right: 8px;
2378
+ display: flex;
2379
+ align-items: center;
2380
+ }
2381
+ .semi-button-content-right {
2382
+ margin-left: 8px;
2383
+ display: flex;
2384
+ align-items: center;
2385
+ }
2386
+
2387
+ .semi-rtl .semi-button,
2388
+ .semi-portal-rtl .semi-button {
2389
+ direction: rtl;
2390
+ padding-left: 12px;
2391
+ padding-right: 12px;
2392
+ }
2393
+ .semi-rtl .semi-button-size-small,
2394
+ .semi-portal-rtl .semi-button-size-small {
2395
+ padding-left: 12px;
2396
+ padding-right: 12px;
2397
+ }
2398
+ .semi-rtl .semi-button-size-large,
2399
+ .semi-portal-rtl .semi-button-size-large {
2400
+ padding-left: 16px;
2401
+ padding-right: 16px;
2402
+ }
2403
+ .semi-rtl .semi-button-group,
2404
+ .semi-portal-rtl .semi-button-group {
2405
+ direction: rtl;
2406
+ }
2407
+ .semi-rtl .semi-button-group > .semi-button,
2408
+ .semi-portal-rtl .semi-button-group > .semi-button {
2409
+ padding-left: 0;
2410
+ padding-right: 0;
2411
+ }
2412
+ .semi-rtl .semi-button-group > .semi-button .semi-button-content,
2413
+ .semi-portal-rtl .semi-button-group > .semi-button .semi-button-content {
2414
+ padding-left: 12px;
2415
+ padding-right: 12px;
2416
+ }
2417
+ .semi-rtl .semi-button-group > .semi-button-size-large .semi-button-content,
2418
+ .semi-portal-rtl .semi-button-group > .semi-button-size-large .semi-button-content {
2419
+ padding-left: 16px;
2420
+ padding-right: 16px;
2421
+ }
2422
+ .semi-rtl .semi-button-group > .semi-button-size-small .semi-button-content,
2423
+ .semi-portal-rtl .semi-button-group > .semi-button-size-small .semi-button-content {
2424
+ padding-left: 12px;
2425
+ padding-right: 12px;
2426
+ }
2427
+ .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only,
2428
+ .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only {
2429
+ padding-left: 0;
2430
+ padding-right: 0;
2431
+ }
2432
+ .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content,
2433
+ .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content {
2434
+ padding-left: 8px;
2435
+ padding-right: 8px;
2436
+ }
2437
+ .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content,
2438
+ .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
2439
+ padding-left: 4px;
2440
+ padding-right: 4px;
2441
+ }
2442
+ .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content,
2443
+ .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
2444
+ padding-left: 12px;
2445
+ padding-right: 12px;
2446
+ }
2447
+ .semi-rtl .semi-button-group > .semi-button:first-child,
2448
+ .semi-portal-rtl .semi-button-group > .semi-button:first-child {
2449
+ border-top-left-radius: 0;
2450
+ border-bottom-left-radius: 0;
2451
+ border-top-right-radius: var(--semi-border-radius-small);
2452
+ border-bottom-right-radius: var(--semi-border-radius-small);
2453
+ }
2454
+ .semi-rtl .semi-button-group > .semi-button:not(:last-child) .semi-button-content,
2455
+ .semi-portal-rtl .semi-button-group > .semi-button:not(:last-child) .semi-button-content {
2456
+ border-left: 1px var(--semi-color-border) solid;
2457
+ border-right: 0;
2458
+ }
2459
+ .semi-rtl .semi-button-group > .semi-button:last-child,
2460
+ .semi-portal-rtl .semi-button-group > .semi-button:last-child {
2461
+ border-top-right-radius: 0;
2462
+ border-bottom-right-radius: 0;
2463
+ border-top-left-radius: var(--semi-border-radius-small);
2464
+ border-bottom-left-radius: var(--semi-border-radius-small);
2465
+ }
2466
+ .semi-rtl .semi-button.semi-button-with-icon-only,
2467
+ .semi-portal-rtl .semi-button.semi-button-with-icon-only {
2468
+ padding-left: 8px;
2469
+ padding-right: 8px;
2470
+ }
2471
+ .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small,
2472
+ .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small {
2473
+ padding-left: 4px;
2474
+ padding-right: 4px;
2475
+ }
2476
+ .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large,
2477
+ .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large {
2478
+ padding-left: 12px;
2479
+ padding-right: 12px;
2480
+ }
2481
+ .semi-rtl .semi-button-content-left,
2482
+ .semi-portal-rtl .semi-button-content-left {
2483
+ margin-left: 8px;
2484
+ margin-right: 0;
2485
+ }
2486
+ .semi-rtl .semi-button-content-right,
2487
+ .semi-portal-rtl .semi-button-content-right {
2488
+ margin-right: 8px;
2489
+ margin-left: 0;
2490
+ }
2491
+
2492
+ .semi-scrolllist {
2493
+ width: 100%;
2494
+ height: 100%;
2495
+ background: var(--semi-color-bg-3);
2496
+ box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 4px 14px rgba(0, 0, 0, 0.1);
2497
+ border-radius: var(--semi-border-radius-medium);
2498
+ overflow: hidden;
2499
+ font-size: 14px;
2500
+ line-height: 20px;
2501
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2502
+ user-select: none;
2503
+ display: flex;
2504
+ flex-direction: column;
2505
+ }
2506
+ .semi-scrolllist-header {
2507
+ text-align: center;
2508
+ padding: 0 16px;
2509
+ background: transparent;
2510
+ }
2511
+ .semi-scrolllist-header-title {
2512
+ padding: 16px 0;
2513
+ font-weight: 600;
2514
+ color: var(--semi-color-text-0);
2515
+ font-size: 14px;
2516
+ line-height: 20px;
2517
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2518
+ }
2519
+ .semi-scrolllist-body {
2520
+ display: flex;
2521
+ height: 300px;
2522
+ padding: 0 16px;
2523
+ overflow: hidden;
2524
+ }
2525
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer-nocycle > ul:before,
2526
+ .semi-scrolllist-body .semi-scrolllist-item > ul:before {
2527
+ content: "";
2528
+ display: block;
2529
+ width: 100%;
2530
+ height: 132px;
2531
+ }
2532
+ .semi-scrolllist-body .semi-scrolllist-item {
2533
+ position: relative;
2534
+ flex: 1;
2535
+ overflow-x: hidden;
2536
+ overflow-y: auto;
2537
+ }
2538
+ .semi-scrolllist-body .semi-scrolllist-item:not(:last-child) {
2539
+ border-right: 1px solid var(--semi-color-border);
2540
+ }
2541
+ .semi-scrolllist-body .semi-scrolllist-item > ul,
2542
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer > ul {
2543
+ box-sizing: border-box;
2544
+ width: 100%;
2545
+ margin: 0;
2546
+ padding: 0;
2547
+ padding-bottom: 132px;
2548
+ list-style: none;
2549
+ }
2550
+ .semi-scrolllist-body .semi-scrolllist-item > ul > li,
2551
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer > ul > li {
2552
+ list-style: none;
2553
+ height: 36px;
2554
+ box-sizing: border-box;
2555
+ color: var(--semi-color-text-0);
2556
+ text-align: center;
2557
+ display: flex;
2558
+ align-items: center;
2559
+ justify-content: center;
2560
+ cursor: pointer;
2561
+ background-color: transparent;
2562
+ transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeOut) 0ms;
2563
+ }
2564
+ .semi-scrolllist-body .semi-scrolllist-item > ul > li.semi-scrolllist-item-sel,
2565
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer > ul > li.semi-scrolllist-item-sel {
2566
+ background: var(--semi-color-primary-light-default);
2567
+ color: var(--semi-color-text-0);
2568
+ }
2569
+ .semi-scrolllist-body .semi-scrolllist-item > ul > li.semi-scrolllist-item-sel > svg,
2570
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer > ul > li.semi-scrolllist-item-sel > svg {
2571
+ color: var(--semi-color-text-2);
2572
+ width: 16px;
2573
+ height: 16px;
2574
+ margin-right: 12px;
2575
+ }
2576
+ .semi-scrolllist-body .semi-scrolllist-item > ul > li:not(.disabled):not(.semi-scrolllist-item-disabled):not(.semi-scrolllist-item-sel):not(.semi-scrolllist-item-selected),
2577
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer > ul > li:not(.disabled):not(.semi-scrolllist-item-disabled):not(.semi-scrolllist-item-sel):not(.semi-scrolllist-item-selected) {
2578
+ cursor: pointer;
2579
+ }
2580
+ .semi-scrolllist-body .semi-scrolllist-item > ul > li:not(.disabled):not(.semi-scrolllist-item-disabled):not(.semi-scrolllist-item-sel):not(.semi-scrolllist-item-selected):hover,
2581
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer > ul > li:not(.disabled):not(.semi-scrolllist-item-disabled):not(.semi-scrolllist-item-sel):not(.semi-scrolllist-item-selected):hover {
2582
+ background-color: var(--semi-color-fill-1);
2583
+ }
2584
+ .semi-scrolllist-body .semi-scrolllist-item > ul > li:not(.disabled):not(.semi-scrolllist-item-disabled):not(.semi-scrolllist-item-sel):not(.semi-scrolllist-item-selected):active,
2585
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer > ul > li:not(.disabled):not(.semi-scrolllist-item-disabled):not(.semi-scrolllist-item-sel):not(.semi-scrolllist-item-selected):active {
2586
+ background-color: var(--semi-color-fill-2);
2587
+ }
2588
+ .semi-scrolllist-body .semi-scrolllist-item > ul > li.semi-scrolllist-item-disabled,
2589
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer > ul > li.semi-scrolllist-item-disabled {
2590
+ color: var(--semi-color-disabled-text);
2591
+ cursor: not-allowed;
2592
+ }
2593
+ .semi-scrolllist-body .semi-scrolllist-item-wheel {
2594
+ position: relative;
2595
+ flex: 1;
2596
+ overflow: hidden;
2597
+ }
2598
+ .semi-scrolllist-body .semi-scrolllist-item-wheel:not(:last-child) {
2599
+ border-right: 1px solid var(--semi-color-border);
2600
+ }
2601
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-item-selected {
2602
+ font-weight: 600;
2603
+ color: var(--semi-color-primary) !important;
2604
+ }
2605
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer {
2606
+ overflow-x: hidden;
2607
+ overflow-y: auto;
2608
+ height: 100%;
2609
+ width: 100%;
2610
+ padding-right: 18px;
2611
+ }
2612
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-shade {
2613
+ width: 100%;
2614
+ height: 50%;
2615
+ pointer-events: none;
2616
+ position: absolute;
2617
+ }
2618
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-shade-pre {
2619
+ top: 0;
2620
+ margin-top: -19px;
2621
+ background: var(--semi-color-bg-3);
2622
+ opacity: 0.5;
2623
+ }
2624
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-shade-post {
2625
+ top: 50%;
2626
+ margin-top: 19px;
2627
+ background: var(--semi-color-bg-3);
2628
+ opacity: 0.5;
2629
+ }
2630
+ .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-selector {
2631
+ pointer-events: none;
2632
+ position: absolute;
2633
+ top: 50%;
2634
+ border-top: 1px solid var(--semi-color-border);
2635
+ border-bottom: 1px solid var(--semi-color-border);
2636
+ height: 36px;
2637
+ width: 100%;
2638
+ transform: translateY(-50%);
2639
+ }
2640
+ .semi-scrolllist .semi-scrolllist-footer {
2641
+ border-top: 1px solid var(--semi-color-border);
2642
+ padding: 10px;
2643
+ }
2644
+ .semi-scrolllist .semi-scrolllist-line {
2645
+ background: var(--semi-color-border);
2646
+ height: 1px;
2647
+ }
2648
+
2649
+ .semi-rtl .semi-scrolllist,
2650
+ .semi-portal-rtl .semi-scrolllist {
2651
+ direction: rtl;
2652
+ }
2653
+ .semi-rtl .semi-scrolllist-body .semi-scrolllist-item:not(:last-child),
2654
+ .semi-portal-rtl .semi-scrolllist-body .semi-scrolllist-item:not(:last-child) {
2655
+ border-right: 0;
2656
+ border-left: 1px solid var(--semi-color-border);
2657
+ }
2658
+ .semi-rtl .semi-scrolllist-body .semi-scrolllist-item > ul > li.semi-scrolllist-item-sel > svg,
2659
+ .semi-rtl .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer > ul > li.semi-scrolllist-item-sel > svg,
2660
+ .semi-portal-rtl .semi-scrolllist-body .semi-scrolllist-item > ul > li.semi-scrolllist-item-sel > svg,
2661
+ .semi-portal-rtl .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer > ul > li.semi-scrolllist-item-sel > svg {
2662
+ margin-right: 0;
2663
+ margin-left: 12px;
2664
+ }
2665
+ .semi-rtl .semi-scrolllist-body .semi-scrolllist-item-wheel:not(:last-child),
2666
+ .semi-portal-rtl .semi-scrolllist-body .semi-scrolllist-item-wheel:not(:last-child) {
2667
+ border-right: 0;
2668
+ border-left: 1px solid var(--semi-color-border);
2669
+ }
2670
+ .semi-rtl .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer,
2671
+ .semi-portal-rtl .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer {
2672
+ padding-right: 0;
2673
+ padding-left: 18px;
2674
+ }
2675
+
2676
+ .semi-timepicker {
2677
+ display: inline-block;
2678
+ }
2679
+ .semi-timepicker-panel .semi-scrolllist-body {
2680
+ height: 252px;
2681
+ }
2682
+ .semi-timepicker-panel .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer-nocycle > ul:before,
2683
+ .semi-timepicker-panel .semi-scrolllist-body .semi-scrolllist-item > ul:before {
2684
+ height: 108px;
2685
+ }
2686
+ .semi-timepicker-panel .semi-scrolllist-body .semi-scrolllist-item,
2687
+ .semi-timepicker-panel .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer {
2688
+ -ms-overflow-style: none; /* Internet Explorer 10+ */
2689
+ scrollbar-width: none; /* Firefox */
2690
+ }
2691
+ .semi-timepicker-panel .semi-scrolllist-body .semi-scrolllist-item::-webkit-scrollbar,
2692
+ .semi-timepicker-panel .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer::-webkit-scrollbar {
2693
+ display: none;
2694
+ width: 0;
2695
+ height: 0;
2696
+ }
2697
+ .semi-timepicker-panel .semi-scrolllist-body .semi-scrolllist-item > ul,
2698
+ .semi-timepicker-panel .semi-scrolllist-body .semi-scrolllist-item-wheel .semi-scrolllist-list-outer > ul {
2699
+ padding-bottom: 108px;
2700
+ }
2701
+ .semi-timepicker-panel .semi-scrolllist-body .semi-scrolllist-item {
2702
+ -ms-overflow-style: none; /* Internet Explorer 10+ */
2703
+ scrollbar-width: none; /* Firefox */
2704
+ }
2705
+ .semi-timepicker-panel .semi-scrolllist-body .semi-scrolllist-item::-webkit-scrollbar {
2706
+ display: none;
2707
+ width: 0;
2708
+ height: 0;
2709
+ }
2710
+ .semi-timepicker-panel .semi-scrolllist-item,
2711
+ .semi-timepicker-panel .semi-scrolllist-item-wheel {
2712
+ flex: none;
2713
+ }
2714
+ .semi-timepicker-panel .semi-scrolllist-item-wheel,
2715
+ .semi-timepicker-panel .semi-scrolllist-item-wheel:not(:last-child) {
2716
+ border: none;
2717
+ }
2718
+ .semi-timepicker-panel-list-ampm {
2719
+ width: 72px;
2720
+ }
2721
+ .semi-timepicker-panel-list-hour {
2722
+ width: 64px;
2723
+ }
2724
+ .semi-timepicker-panel-list-minute {
2725
+ width: 64px;
2726
+ }
2727
+ .semi-timepicker-panel-list-second {
2728
+ width: 64px;
2729
+ }
2730
+ .semi-timepicker-range-panel .semi-timepicker-lists {
2731
+ display: flex;
2732
+ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1);
2733
+ border: 1px solid rgba(0, 0, 0, 0.1);
2734
+ border-radius: var(--semi-border-radius-medium);
2735
+ }
2736
+ .semi-timepicker-range-panel .semi-timepicker-lists .semi-scrolllist:first-of-type {
2737
+ border-radius: var(--semi-border-radius-medium) 0 0 var(--semi-border-radius-medium);
2738
+ }
2739
+ .semi-timepicker-range-panel .semi-timepicker-lists .semi-scrolllist:last-of-type {
2740
+ border-radius: 0 var(--semi-border-radius-medium) var(--semi-border-radius-medium) 0;
2741
+ }
2742
+ .semi-timepicker-range-panel .semi-timepicker-lists > .semi-scrolllist:not(:last-child) .semi-scrolllist-body {
2743
+ border-right: 2px solid var(--semi-color-border);
2744
+ }
2745
+ .semi-timepicker-range-panel .semi-timepicker-lists > .semi-scrolllist {
2746
+ box-shadow: none;
2747
+ }
2748
+ .semi-timepicker-range-panel .semi-timepicker-lists > .semi-scrolllist .semi-scrolllist-body, .semi-timepicker-range-panel .semi-timepicker-lists > .semi-scrolllist .semi-scrolllist-header {
2749
+ padding: 0;
2750
+ }
2751
+ .semi-timepicker .semi-timepicker-input {
2752
+ font-size: 14px;
2753
+ line-height: 20px;
2754
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2755
+ border-radius: var(--semi-border-radius-small);
2756
+ align-items: center;
2757
+ }
2758
+ .semi-timepicker .semi-input-readonly {
2759
+ cursor: pointer;
2760
+ }
2761
+
2762
+ .semi-timepicker .semi-input-borderless:not(:focus-within):not(:hover) .semi-input-suffix {
2763
+ opacity: 0;
2764
+ }
2765
+
2766
+ .semi-rtl .semi-timepicker,
2767
+ .semi-portal-rtl .semi-timepicker {
2768
+ direction: rtl;
2769
+ }
2770
+ .semi-rtl .semi-timepicker-panel,
2771
+ .semi-portal-rtl .semi-timepicker-panel {
2772
+ direction: rtl;
2773
+ }
2774
+ .semi-rtl .semi-timepicker-range,
2775
+ .semi-portal-rtl .semi-timepicker-range {
2776
+ direction: rtl;
2777
+ }
2778
+ .semi-rtl .semi-timepicker-range-panel .semi-timepicker-lists > .semi-scrolllist:not(:last-child) .semi-scrolllist-body,
2779
+ .semi-portal-rtl .semi-timepicker-range-panel .semi-timepicker-lists > .semi-scrolllist:not(:last-child) .semi-scrolllist-body {
2780
+ border-right: 0;
2781
+ border-left: 2px solid var(--semi-color-border);
2782
+ }
2783
+
2784
+ .semi-datepicker {
2785
+ box-sizing: border-box;
2786
+ display: inline-block;
2787
+ }
2788
+ .semi-datepicker-container {
2789
+ display: flex;
2790
+ }
2791
+ .semi-datepicker .semi-scrolllist-body .semi-scrolllist-item {
2792
+ -ms-overflow-style: none; /* Internet Explorer 10+ */
2793
+ scrollbar-width: none; /* Firefox */
2794
+ }
2795
+ .semi-datepicker .semi-scrolllist-body .semi-scrolllist-item::-webkit-scrollbar {
2796
+ display: none;
2797
+ width: 0;
2798
+ height: 0;
2799
+ }
2800
+ .semi-datepicker .semi-scrolllist-body .semi-scrolllist-list-outer {
2801
+ -ms-overflow-style: none; /* Internet Explorer 10+ */
2802
+ scrollbar-width: none; /* Firefox */
2803
+ }
2804
+ .semi-datepicker .semi-scrolllist-body .semi-scrolllist-list-outer::-webkit-scrollbar {
2805
+ display: none;
2806
+ width: 0;
2807
+ height: 0;
2808
+ }
2809
+ .semi-datepicker-month-grid {
2810
+ user-select: none;
2811
+ display: flex;
2812
+ }
2813
+ .semi-datepicker-month-grid-left, .semi-datepicker-month-grid-right {
2814
+ position: relative;
2815
+ padding: 0;
2816
+ display: inline-flex;
2817
+ flex-direction: column;
2818
+ justify-content: flex-start;
2819
+ }
2820
+ .semi-datepicker-month-grid[x-type=date] .semi-datepicker-yam, .semi-datepicker-month-grid[x-type=dateRange] .semi-datepicker-yam {
2821
+ height: 100%;
2822
+ }
2823
+ .semi-datepicker-month-grid[x-type=dateTime] .semi-datepicker-yam, .semi-datepicker-month-grid[x-type=dateTimeRange] .semi-datepicker-yam {
2824
+ height: calc(100% - 54px);
2825
+ }
2826
+ .semi-datepicker-month-grid .semi-datepicker-yam-showing {
2827
+ min-height: 378px;
2828
+ min-width: 284px;
2829
+ }
2830
+ .semi-datepicker-month-grid[x-type=date] .semi-datepicker-yam-showing {
2831
+ min-height: 325px;
2832
+ }
2833
+ .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-month-grid-left[x-open-type=year],
2834
+ .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-month-grid-right[x-open-type=year] {
2835
+ min-height: 317px;
2836
+ }
2837
+ .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-month-grid-left[x-open-type=time],
2838
+ .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-month-grid-right[x-open-type=time] {
2839
+ min-height: 317px;
2840
+ }
2841
+ .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-navigation {
2842
+ padding-top: 8px;
2843
+ padding-bottom: 8px;
2844
+ }
2845
+ .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-tpk {
2846
+ min-height: 100%;
2847
+ }
2848
+ .semi-datepicker-month-grid[x-insetinput=true][x-type=dateTime] .semi-datepicker-yam, .semi-datepicker-month-grid[x-insetinput=true][x-type=dateTimeRange] .semi-datepicker-yam {
2849
+ height: 100%;
2850
+ }
2851
+ .semi-datepicker-month-grid[x-preset-position=left][x-insetinput=false] .semi-datepicker-month, .semi-datepicker-month-grid[x-preset-position=right][x-insetinput=false] .semi-datepicker-month {
2852
+ height: 253px;
2853
+ }
2854
+ .semi-datepicker-month-grid .semi-datepicker-yearmonth-header {
2855
+ background: var(--semi-color-bg-3);
2856
+ padding: 12px 16px;
2857
+ border-bottom: 1px solid var(--semi-color-border);
2858
+ border-radius: var(--semi-border-radius-medium) var(--semi-border-radius-medium) 0 0;
2859
+ display: flex;
2860
+ align-items: center;
2861
+ }
2862
+ .semi-datepicker-month-grid .semi-scrolllist {
2863
+ background: var(--semi-color-bg-3);
2864
+ position: relative;
2865
+ box-shadow: none;
2866
+ height: auto;
2867
+ width: 100%;
2868
+ height: 100%;
2869
+ overflow: hidden;
2870
+ flex: 1;
2871
+ }
2872
+ .semi-datepicker-month-grid .semi-scrolllist-header, .semi-datepicker-month-grid .semi-scrolllist-body {
2873
+ box-sizing: border-box;
2874
+ width: 100%;
2875
+ }
2876
+ .semi-datepicker-month-grid .semi-scrolllist-header {
2877
+ border-bottom: 1px solid var(--semi-color-border);
2878
+ padding: 16px;
2879
+ }
2880
+ .semi-datepicker-month-grid .semi-scrolllist-body {
2881
+ height: 100%;
2882
+ overflow: hidden;
2883
+ padding: 0;
2884
+ flex: 1;
2885
+ }
2886
+ .semi-datepicker-month-grid .semi-scrolllist-line {
2887
+ display: none;
2888
+ }
2889
+ .semi-datepicker-month-grid .semi-scrolllist-header-title {
2890
+ padding: 0;
2891
+ font-size: 14px;
2892
+ line-height: 20px;
2893
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2894
+ min-height: 24px;
2895
+ line-height: 24px;
2896
+ }
2897
+ .semi-datepicker-month-grid[x-panel-yearandmonth-open-type=left] .semi-datepicker-weeks, .semi-datepicker-month-grid[x-panel-yearandmonth-open-type=right] .semi-datepicker-weeks {
2898
+ min-height: 216px;
2899
+ }
2900
+ .semi-datepicker-panel-yam {
2901
+ max-width: 484px;
2902
+ }
2903
+ .semi-datepicker-panel-yam[x-type=monthRange] {
2904
+ max-width: 584px;
2905
+ }
2906
+ .semi-datepicker-panel-yam .semi-datepicker-yearmonth-body {
2907
+ display: flex;
2908
+ }
2909
+ .semi-datepicker-panel-yam .semi-datepicker-yearmonth-body .semi-scrolllist:nth-child(2) {
2910
+ border-left: 1px solid var(--semi-color-border);
2911
+ }
2912
+ .semi-datepicker-panel-yam .semi-scrolllist {
2913
+ box-shadow: none;
2914
+ height: 266px;
2915
+ }
2916
+ .semi-datepicker-panel-yam .semi-scrolllist-list-outer > ul > li {
2917
+ min-width: 64px;
2918
+ }
2919
+ .semi-datepicker-panel-yam .semi-scrolllist-item > ul > li {
2920
+ min-width: 82px;
2921
+ }
2922
+ .semi-datepicker-panel-yam .semi-scrolllist-body {
2923
+ padding: 0;
2924
+ overflow: hidden;
2925
+ }
2926
+ .semi-datepicker-panel-yam .semi-scrolllist-body .semi-scrolllist-item-wheel:not(#neverExistElement) {
2927
+ border: none;
2928
+ }
2929
+ .semi-datepicker-footer {
2930
+ padding-top: 10px;
2931
+ padding-right: 8px;
2932
+ padding-bottom: 10px;
2933
+ text-align: right;
2934
+ background-color: var(--semi-color-fill-0);
2935
+ }
2936
+ .semi-datepicker-footer .semi-button:first-of-type {
2937
+ margin-right: 12px;
2938
+ }
2939
+ .semi-datepicker-footer .semi-button:nth-of-type(2) {
2940
+ margin-right: 8px;
2941
+ }
2942
+ .semi-datepicker-yam {
2943
+ position: absolute;
2944
+ top: 0;
2945
+ width: 100%;
2946
+ display: flex;
2947
+ flex-direction: column;
2948
+ box-sizing: border-box;
2949
+ }
2950
+ .semi-datepicker-tpk {
2951
+ position: absolute;
2952
+ top: 0;
2953
+ height: calc(100% - 54px);
2954
+ width: 100%;
2955
+ display: flex;
2956
+ flex-direction: column;
2957
+ }
2958
+ .semi-datepicker-tpk .semi-datepicker-time {
2959
+ height: 100%;
2960
+ }
2961
+ .semi-datepicker-navigation {
2962
+ display: flex;
2963
+ align-items: center;
2964
+ box-sizing: content-box;
2965
+ height: 32px;
2966
+ padding: 12px 16px;
2967
+ }
2968
+ .semi-datepicker-navigation-left, .semi-datepicker-navigation-right {
2969
+ width: 32px;
2970
+ height: 32px;
2971
+ display: flex;
2972
+ justify-content: center;
2973
+ align-items: center;
2974
+ }
2975
+ .semi-datepicker-navigation .semi-button {
2976
+ color: var(--semi-color-text-2);
2977
+ min-width: 32px;
2978
+ }
2979
+ .semi-datepicker-navigation-month {
2980
+ font-size: 16px;
2981
+ line-height: 22px;
2982
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2983
+ flex-grow: 1;
2984
+ text-align: center;
2985
+ font-weight: 600;
2986
+ color: var(--semi-color-text-0);
2987
+ }
2988
+ .semi-datepicker-navigation-month .semi-button {
2989
+ color: var(--semi-color-text-0);
2990
+ }
2991
+ .semi-datepicker-month {
2992
+ width: 252px;
2993
+ box-sizing: content-box;
2994
+ padding: 16px;
2995
+ padding-top: 0;
2996
+ }
2997
+ .semi-datepicker-weekday {
2998
+ font-size: 12px;
2999
+ line-height: 16px;
3000
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3001
+ font-weight: 600;
3002
+ color: var(--semi-color-text-2);
3003
+ border-bottom: 1px solid var(--semi-color-border);
3004
+ }
3005
+ .semi-datepicker-weekday-item {
3006
+ width: 36px;
3007
+ height: 36px;
3008
+ line-height: 36px;
3009
+ text-align: center;
3010
+ display: inline-block;
3011
+ }
3012
+ .semi-datepicker-weeks {
3013
+ color: var(--semi-color-text-0);
3014
+ }
3015
+ .semi-datepicker-week {
3016
+ display: flex;
3017
+ align-items: center;
3018
+ }
3019
+ .semi-datepicker-day {
3020
+ box-sizing: border-box;
3021
+ display: inline-block;
3022
+ width: 36px;
3023
+ height: 36px;
3024
+ display: flex;
3025
+ justify-content: center;
3026
+ align-items: center;
3027
+ cursor: pointer;
3028
+ }
3029
+ .semi-datepicker-day-main {
3030
+ display: flex;
3031
+ justify-content: center;
3032
+ align-items: center;
3033
+ width: 32px;
3034
+ height: 32px;
3035
+ margin: 0 auto;
3036
+ box-sizing: border-box;
3037
+ border-radius: var(--semi-border-radius-small);
3038
+ }
3039
+ .semi-datepicker-day-main:hover {
3040
+ background-color: var(--semi-color-fill-0);
3041
+ }
3042
+ .semi-datepicker-day-main:active {
3043
+ background-color: var(--semi-color-fill-1);
3044
+ }
3045
+ .semi-datepicker-day-today .semi-datepicker-day-main {
3046
+ color: var(--semi-color-primary);
3047
+ background-color: var(--semi-color-fill-0);
3048
+ font-weight: 600;
3049
+ }
3050
+ .semi-datepicker-day-today.semi-datepicker-day-disabled .semi-datepicker-day-main {
3051
+ color: var(--semi-color-primary-disabled);
3052
+ }
3053
+ .semi-datepicker-day-inrange .semi-datepicker-day-main, .semi-datepicker-day-inhover .semi-datepicker-day-main, .semi-datepicker-day-inoffsetrange .semi-datepicker-day-main, .semi-datepicker-day-hoverday .semi-datepicker-day-main, .semi-datepicker-day-selectedrange-hover .semi-datepicker-day-main, .semi-datepicker-day-hoverday-around-singleselected .semi-datepicker-day-main {
3054
+ border-radius: 0;
3055
+ margin-left: 0;
3056
+ margin-right: 0;
3057
+ width: 36px;
3058
+ }
3059
+ .semi-datepicker-day-selected .semi-datepicker-day-main {
3060
+ border-radius: var(--semi-border-radius-small);
3061
+ }
3062
+ .semi-datepicker-day-selected-start.semi-datepicker-day-selected-end .semi-datepicker-day-main, .semi-datepicker-day-offsetrange-start.semi-datepicker-day-offsetrange-end .semi-datepicker-day-main {
3063
+ border-radius: var(--semi-border-radius-small);
3064
+ }
3065
+ .semi-datepicker-day-offsetrange-start .semi-datepicker-day-main {
3066
+ border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
3067
+ }
3068
+ .semi-datepicker-day-offsetrange-end .semi-datepicker-day-main {
3069
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
3070
+ }
3071
+ .semi-datepicker-day-hoverday-beforerange .semi-datepicker-day-main {
3072
+ border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
3073
+ }
3074
+ .semi-datepicker-day-hoverday-afterrange .semi-datepicker-day-main {
3075
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
3076
+ }
3077
+ .semi-datepicker-day-selected-start .semi-datepicker-day-main, .semi-datepicker-day-offsetrange-start .semi-datepicker-day-main {
3078
+ width: 34px;
3079
+ margin-left: 2px;
3080
+ margin-right: 0;
3081
+ border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
3082
+ }
3083
+ .semi-datepicker-day-selected-end .semi-datepicker-day-main, .semi-datepicker-day-offsetrange-end .semi-datepicker-day-main {
3084
+ width: 34px;
3085
+ margin-right: 2px;
3086
+ margin-left: 0;
3087
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
3088
+ }
3089
+ .semi-datepicker-day-hoverday-inrange .semi-datepicker-day-main {
3090
+ border-radius: 0;
3091
+ }
3092
+ .semi-datepicker-day-inoffsetrange .semi-datepicker-day-main, .semi-datepicker-day-offsetrange-start .semi-datepicker-day-main, .semi-datepicker-day-offsetrange-end .semi-datepicker-day-main {
3093
+ background-color: var(--semi-color-fill-0);
3094
+ }
3095
+ .semi-datepicker-day-hoverday .semi-datepicker-day-main, .semi-datepicker-day-hoverday-offset .semi-datepicker-day-main {
3096
+ background-color: var(--semi-color-fill-1);
3097
+ }
3098
+ .semi-datepicker-day-inrange .semi-datepicker-day-main, .semi-datepicker-day-inhover .semi-datepicker-day-main {
3099
+ background-color: var(--semi-color-primary-light-default);
3100
+ }
3101
+ .semi-datepicker-day-hoverday-inrange .semi-datepicker-day-main, .semi-datepicker-day-hoverday-beforerange .semi-datepicker-day-main, .semi-datepicker-day-hoverday-afterrange .semi-datepicker-day-main {
3102
+ background-color: var(--semi-color-primary-light-active);
3103
+ }
3104
+ .semi-datepicker-day-hoverday-around-singleselected .semi-datepicker-day-main {
3105
+ background-color: var(--semi-color-primary-light-active);
3106
+ }
3107
+ .semi-datepicker-day-selected .semi-datepicker-day-main, .semi-datepicker-day-selected-start .semi-datepicker-day-main, .semi-datepicker-day-selected-end .semi-datepicker-day-main {
3108
+ background-color: var(--semi-color-primary);
3109
+ color: var(--semi-color-white);
3110
+ }
3111
+ .semi-datepicker-day-selected .semi-datepicker-day-main:hover, .semi-datepicker-day-selected-start .semi-datepicker-day-main:hover, .semi-datepicker-day-selected-end .semi-datepicker-day-main:hover {
3112
+ background-color: var(--semi-color-primary);
3113
+ }
3114
+ .semi-datepicker-day-selectedrange-hover .semi-datepicker-day-main {
3115
+ background-color: var(--semi-color-primary-light-hover);
3116
+ }
3117
+ .semi-datepicker-day-selected-start-afterhover .semi-datepicker-day-main, .semi-datepicker-day-selected-end-beforehover .semi-datepicker-day-main {
3118
+ border: 1px solid var(--semi-color-primary-active);
3119
+ }
3120
+ .semi-datepicker-day-disabled {
3121
+ cursor: not-allowed;
3122
+ color: var(--semi-color-disabled-text);
3123
+ }
3124
+ .semi-datepicker-day-disabled .semi-datepicker-day-main:hover {
3125
+ background-color: transparent;
3126
+ }
3127
+ .semi-datepicker-day-disabled .semi-datepicker-day-main:active {
3128
+ background-color: transparent;
3129
+ }
3130
+ .semi-datepicker-day-disabled.semi-datepicker-day-selected .semi-datepicker-day-main, .semi-datepicker-day-disabled.semi-datepicker-day-selected-start .semi-datepicker-day-main, .semi-datepicker-day-disabled.semi-datepicker-day-selected-end .semi-datepicker-day-main, .semi-datepicker-day-disabled.semi-datepicker-day-inhover .semi-datepicker-day-main, .semi-datepicker-day-disabled.semi-datepicker-day-inrange .semi-datepicker-day-main, .semi-datepicker-day-disabled.semi-datepicker-day-inoffsetrange .semi-datepicker-day-main, .semi-datepicker-day-disabled.semi-datepicker-day-hoverday .semi-datepicker-day-main, .semi-datepicker-day-disabled.semi-datepicker-day-hoverday-offset .semi-datepicker-day-main, .semi-datepicker-day-disabled.semi-datepicker-day-offsetrange-start .semi-datepicker-day-main, .semi-datepicker-day-disabled.semi-datepicker-day-offsetrange-end .semi-datepicker-day-main, .semi-datepicker-day-disabled.semi-datepicker-day-selectedrange-hover .semi-datepicker-day-main {
3131
+ background-color: var(--semi-color-disabled-fill);
3132
+ color: var(--semi-color-disabled-text);
3133
+ }
3134
+ .semi-datepicker-switch {
3135
+ text-align: center;
3136
+ display: flex;
3137
+ border-top: 1px solid var(--semi-color-border);
3138
+ margin-top: auto;
3139
+ }
3140
+ .semi-datepicker-switch-date, .semi-datepicker-switch-time {
3141
+ width: 50%;
3142
+ cursor: pointer;
3143
+ padding-top: 16px;
3144
+ padding-bottom: 16px;
3145
+ display: flex;
3146
+ justify-content: center;
3147
+ align-items: center;
3148
+ color: var(--semi-color-text-2);
3149
+ }
3150
+ .semi-datepicker-switch-date:not(.semi-datepicker-switch-time-disabled):hover, .semi-datepicker-switch-time:not(.semi-datepicker-switch-time-disabled):hover {
3151
+ background-color: var(--semi-color-fill-0);
3152
+ }
3153
+ .semi-datepicker-switch-date-active, .semi-datepicker-switch-time-active {
3154
+ color: var(--semi-color-text-0);
3155
+ font-weight: 600;
3156
+ cursor: auto;
3157
+ }
3158
+ .semi-datepicker-switch-date-active:hover, .semi-datepicker-switch-time-active:hover {
3159
+ background-color: inherit;
3160
+ }
3161
+ .semi-datepicker-switch-date-disabled, .semi-datepicker-switch-time-disabled {
3162
+ cursor: not-allowed;
3163
+ }
3164
+ .semi-datepicker-switch-text {
3165
+ padding-left: 8px;
3166
+ }
3167
+ .semi-datepicker-time .semi-jumperlist {
3168
+ box-shadow: none;
3169
+ border-radius: 0;
3170
+ }
3171
+ .semi-datepicker-quick-control {
3172
+ box-sizing: border-box;
3173
+ background-color: transparent;
3174
+ }
3175
+ .semi-datepicker-quick-control-header {
3176
+ padding: 18px 12px 0;
3177
+ font-weight: 600;
3178
+ }
3179
+ .semi-datepicker-quick-control-left {
3180
+ border-right: 1px solid var(--semi-color-border);
3181
+ }
3182
+ .semi-datepicker-quick-control-right {
3183
+ border-left: 1px solid var(--semi-color-border);
3184
+ }
3185
+ .semi-datepicker-quick-control-top {
3186
+ border-bottom: 1px solid var(--semi-color-border);
3187
+ }
3188
+ .semi-datepicker-quick-control-bottom {
3189
+ border-top: 1px solid var(--semi-color-border);
3190
+ }
3191
+ .semi-datepicker-quick-control-left-content-wrapper, .semi-datepicker-quick-control-right-content-wrapper {
3192
+ max-width: 200px;
3193
+ margin-top: 14px;
3194
+ overflow-y: auto;
3195
+ }
3196
+ .semi-datepicker-quick-control-top-content-wrapper, .semi-datepicker-quick-control-bottom-content-wrapper {
3197
+ overflow-y: auto;
3198
+ max-height: 100px;
3199
+ }
3200
+ .semi-datepicker-quick-control-left-content, .semi-datepicker-quick-control-right-content {
3201
+ box-sizing: border-box;
3202
+ display: grid;
3203
+ align-content: flex-start;
3204
+ grid-gap: 8px;
3205
+ grid-template-columns: repeat(2, minmax(76.5px, 84px));
3206
+ padding: 0 12px 12px;
3207
+ }
3208
+ .semi-datepicker-quick-control-left-content-item, .semi-datepicker-quick-control-right-content-item {
3209
+ max-width: 84px;
3210
+ }
3211
+ .semi-datepicker-quick-control-left-content-item-ellipsis, .semi-datepicker-quick-control-right-content-item-ellipsis {
3212
+ width: 68px;
3213
+ color: var(--semi-color-primary);
3214
+ }
3215
+ .semi-datepicker-quick-control-top-content, .semi-datepicker-quick-control-bottom-content {
3216
+ display: grid;
3217
+ grid-gap: 8px;
3218
+ grid-template-columns: repeat(3, minmax(70.924px, 75.924px));
3219
+ align-content: flex-start;
3220
+ padding: 8px 20px;
3221
+ }
3222
+ .semi-datepicker-quick-control-top-content-item, .semi-datepicker-quick-control-bottom-content-item {
3223
+ max-width: 75.924px;
3224
+ }
3225
+ .semi-datepicker-quick-control-top-content-item-ellipsis, .semi-datepicker-quick-control-bottom-content-item-ellipsis {
3226
+ width: 59.924px;
3227
+ color: var(--semi-color-primary);
3228
+ }
3229
+ .semi-datepicker-quick-control-top-range-content, .semi-datepicker-quick-control-bottom-range-content {
3230
+ box-sizing: border-box;
3231
+ display: grid;
3232
+ align-content: flex-start;
3233
+ grid-template-columns: repeat(5, minmax(96.2px, 99.2px));
3234
+ grid-gap: 8px;
3235
+ padding: 8px 20px;
3236
+ }
3237
+ .semi-datepicker-quick-control-top-range-content-item, .semi-datepicker-quick-control-bottom-range-content-item {
3238
+ max-width: 99.2px;
3239
+ }
3240
+ .semi-datepicker-quick-control-top-range-content-item-ellipsis, .semi-datepicker-quick-control-bottom-range-content-item-ellipsis {
3241
+ width: 83.2px;
3242
+ color: var(--semi-color-primary);
3243
+ }
3244
+ .semi-datepicker-quick-control-top-month-content, .semi-datepicker-quick-control-bottom-month-content {
3245
+ box-sizing: border-box;
3246
+ display: grid;
3247
+ grid-template-columns: repeat(2, minmax(51px, 58.5px));
3248
+ grid-gap: 8px;
3249
+ align-content: flex-start;
3250
+ padding: 8px 20px;
3251
+ }
3252
+ .semi-datepicker-quick-control-top-month-content-item, .semi-datepicker-quick-control-bottom-month-content-item {
3253
+ max-width: 58.5px;
3254
+ }
3255
+ .semi-datepicker-quick-control-top-month-content-item-ellipsis, .semi-datepicker-quick-control-bottom-month-content-item-ellipsis {
3256
+ max-width: 42.5px;
3257
+ color: var(--semi-color-primary);
3258
+ }
3259
+ .semi-datepicker-quick-control-month {
3260
+ max-width: 284px;
3261
+ }
3262
+ .semi-datepicker-quick-control-month[x-insetinput=true] .semi-datepicker-quick-control-right-content-wrapper,
3263
+ .semi-datepicker-quick-control-month[x-insetinput=true] .semi-datepicker-quick-control-left-content-wrapper {
3264
+ max-height: 258px;
3265
+ }
3266
+ .semi-datepicker-quick-control-month .semi-datepicker-quick-control-right-content-wrapper,
3267
+ .semi-datepicker-quick-control-month .semi-datepicker-quick-control-left-content-wrapper {
3268
+ max-height: 214px;
3269
+ }
3270
+ .semi-datepicker-quick-control-date {
3271
+ max-width: 284px;
3272
+ }
3273
+ .semi-datepicker-quick-control-date[x-insetinput=true] .semi-datepicker-quick-control-right-content-wrapper,
3274
+ .semi-datepicker-quick-control-date[x-insetinput=true] .semi-datepicker-quick-control-left-content-wrapper {
3275
+ max-height: 309px;
3276
+ }
3277
+ .semi-datepicker-quick-control-date .semi-datepicker-quick-control-right-content-wrapper,
3278
+ .semi-datepicker-quick-control-date .semi-datepicker-quick-control-left-content-wrapper {
3279
+ max-height: 273px;
3280
+ }
3281
+ .semi-datepicker-quick-control-dateTime {
3282
+ max-width: 284px;
3283
+ }
3284
+ .semi-datepicker-quick-control-dateTime[x-insetinput=true] .semi-datepicker-quick-control-right-content-wrapper,
3285
+ .semi-datepicker-quick-control-dateTime[x-insetinput=true] .semi-datepicker-quick-control-left-content-wrapper {
3286
+ max-height: 309px;
3287
+ }
3288
+ .semi-datepicker-quick-control-dateTime .semi-datepicker-quick-control-right-content-wrapper,
3289
+ .semi-datepicker-quick-control-dateTime .semi-datepicker-quick-control-left-content-wrapper {
3290
+ max-height: 326px;
3291
+ }
3292
+ .semi-datepicker-quick-control-dateRange {
3293
+ max-width: 568px;
3294
+ }
3295
+ .semi-datepicker-quick-control-dateRange[x-insetinput=true] .semi-datepicker-quick-control-right-content-wrapper,
3296
+ .semi-datepicker-quick-control-dateRange[x-insetinput=true] .semi-datepicker-quick-control-left-content-wrapper {
3297
+ max-height: 309px;
3298
+ }
3299
+ .semi-datepicker-quick-control-dateRange .semi-datepicker-quick-control-right-content-wrapper,
3300
+ .semi-datepicker-quick-control-dateRange .semi-datepicker-quick-control-left-content-wrapper {
3301
+ max-height: 273px;
3302
+ }
3303
+ .semi-datepicker-quick-control-dateTimeRange {
3304
+ max-width: 568px;
3305
+ }
3306
+ .semi-datepicker-quick-control-dateTimeRange[x-insetinput=true] .semi-datepicker-quick-control-right-content-wrapper,
3307
+ .semi-datepicker-quick-control-dateTimeRange[x-insetinput=true] .semi-datepicker-quick-control-left-content-wrapper {
3308
+ max-height: 309px;
3309
+ }
3310
+ .semi-datepicker-quick-control-dateTimeRange .semi-datepicker-quick-control-right-content-wrapper,
3311
+ .semi-datepicker-quick-control-dateTimeRange .semi-datepicker-quick-control-left-content-wrapper {
3312
+ max-height: 326px;
3313
+ }
3314
+ .semi-datepicker-topSlot {
3315
+ border-bottom: 1px solid var(--semi-color-border);
3316
+ }
3317
+ .semi-datepicker-leftSlot {
3318
+ border-right: 1px solid var(--semi-color-border);
3319
+ }
3320
+ .semi-datepicker-rightSlot {
3321
+ border-left: 1px solid var(--semi-color-border);
3322
+ }
3323
+ .semi-datepicker-bottomSlot {
3324
+ border-top: 1px solid var(--semi-color-border);
3325
+ }
3326
+ .semi-datepicker .semi-popover-trigger {
3327
+ width: 100%;
3328
+ }
3329
+ .semi-datepicker .semi-popover-trigger .semi-input-wrapper {
3330
+ font-size: 13px;
3331
+ }
3332
+ .semi-datepicker .semi-popover-trigger .semi-input-suffix {
3333
+ color: var(--semi-color-primary);
3334
+ }
3335
+ .semi-datepicker .semi-datepicker-input-readonly {
3336
+ cursor: pointer;
3337
+ }
3338
+ .semi-datepicker-inset-input-wrapper {
3339
+ display: flex;
3340
+ flex-wrap: nowrap;
3341
+ justify-content: space-between;
3342
+ box-sizing: border-box;
3343
+ column-gap: 8px;
3344
+ padding: 12px 16px;
3345
+ padding-bottom: 0;
3346
+ width: 284px;
3347
+ }
3348
+ .semi-datepicker-inset-input-wrapper[x-type=dateRange], .semi-datepicker-inset-input-wrapper[x-type=dateTimeRange] {
3349
+ width: 568px;
3350
+ }
3351
+ .semi-datepicker-inset-input-wrapper[x-type=month] {
3352
+ width: 165px;
3353
+ }
3354
+ .semi-datepicker-inset-input-wrapper[x-type=monthRange] {
3355
+ width: 331px;
3356
+ }
3357
+ .semi-datepicker-inset-input-wrapper .semi-input-wrapper {
3358
+ flex: 1;
3359
+ flex-shrink: 0;
3360
+ }
3361
+ .semi-datepicker-inset-input-separator {
3362
+ flex-grow: 0;
3363
+ flex-shrink: 0;
3364
+ height: 32px;
3365
+ line-height: 32px;
3366
+ padding: 0 4px;
3367
+ color: var(--semi-color-text-3);
3368
+ }
3369
+ .semi-datepicker-range-input {
3370
+ display: flex;
3371
+ align-items: center;
3372
+ box-sizing: border-box;
3373
+ border-radius: var(--semi-border-radius-small);
3374
+ height: 32px;
3375
+ color: var(--semi-color-text-2);
3376
+ background-color: var(--semi-color-fill-0);
3377
+ border: 0px solid transparent;
3378
+ }
3379
+ .semi-datepicker-range-input:hover {
3380
+ border-color: transparent;
3381
+ }
3382
+ .semi-datepicker-range-input:active {
3383
+ border-color: transparent;
3384
+ }
3385
+ .semi-datepicker-range-input:focus-within {
3386
+ border-color: transparent;
3387
+ }
3388
+ .semi-datepicker-range-input .semi-datepicker-monthRange-input {
3389
+ background-color: transparent;
3390
+ }
3391
+ .semi-datepicker-range-input-wrapper {
3392
+ box-sizing: border-box;
3393
+ background-color: transparent;
3394
+ padding: 0 8px;
3395
+ height: 100%;
3396
+ width: 100%;
3397
+ border: 1px solid transparent;
3398
+ border-radius: var(--semi-border-radius-small);
3399
+ display: flex;
3400
+ align-items: center;
3401
+ }
3402
+ .semi-datepicker-range-input-wrapper .semi-input-wrapper {
3403
+ background-color: transparent;
3404
+ height: fit-content;
3405
+ border: none;
3406
+ }
3407
+ .semi-datepicker-range-input-wrapper .semi-input-wrapper:active:not(#neverExistElement) {
3408
+ background-color: transparent;
3409
+ }
3410
+ .semi-datepicker-range-input-wrapper .semi-input-wrapper:hover:not(#neverExistElement) {
3411
+ background-color: transparent;
3412
+ }
3413
+ .semi-datepicker-range-input-wrapper-focus {
3414
+ border-color: transparent;
3415
+ background-color: var(--semi-color-fill-1);
3416
+ border-radius: var(--semi-border-radius-small);
3417
+ transition: background-color 0.16s ease-in-out;
3418
+ }
3419
+ .semi-datepicker-range-input-wrapper-focus ~ .semi-datepicker-range-input-clearbtn {
3420
+ display: flex;
3421
+ }
3422
+ .semi-datepicker-range-input-wrapper-focus ~ .semi-datepicker-range-input-clearbtn ~ .semi-datepicker-range-input-suffix {
3423
+ display: none;
3424
+ }
3425
+ .semi-datepicker-range-input-wrapper .semi-input {
3426
+ padding: 2px 4px;
3427
+ }
3428
+ .semi-datepicker-range-input-wrapper-icon {
3429
+ flex-shrink: 0;
3430
+ }
3431
+ .semi-datepicker-range-input-wrapper:hover {
3432
+ background-color: var(--semi-color-fill-1);
3433
+ }
3434
+ .semi-datepicker-range-input-wrapper-start {
3435
+ border-top-right-radius: 0;
3436
+ border-bottom-right-radius: 0;
3437
+ }
3438
+ .semi-datepicker-range-input-wrapper-start-with-prefix {
3439
+ border-radius: 0;
3440
+ }
3441
+ .semi-datepicker-range-input-wrapper-end {
3442
+ border-radius: 0;
3443
+ }
3444
+ .semi-datepicker-range-input-wrapper-active {
3445
+ border-color: var(--semi-color-focus-border);
3446
+ background-color: var(--semi-color-fill-1);
3447
+ }
3448
+ .semi-datepicker-range-input-separator {
3449
+ display: flex;
3450
+ align-items: center;
3451
+ }
3452
+ .semi-datepicker-range-input-separator-active {
3453
+ color: var(--semi-color-text-0);
3454
+ }
3455
+ .semi-datepicker-range-input-small {
3456
+ height: 24px;
3457
+ }
3458
+ .semi-datepicker-range-input-large {
3459
+ height: 40px;
3460
+ }
3461
+ .semi-datepicker-range-input-large .semi-input-default {
3462
+ font-size: 16px;
3463
+ }
3464
+ .semi-datepicker-range-input:hover .semi-datepicker-range-input-clearbtn {
3465
+ display: flex;
3466
+ cursor: pointer;
3467
+ }
3468
+ .semi-datepicker-range-input:hover .semi-datepicker-range-input-clearbtn ~ .semi-datepicker-range-input-suffix {
3469
+ display: none;
3470
+ }
3471
+ .semi-datepicker-range-input:hover .semi-datepicker-range-input-clearbtn:hover {
3472
+ color: var(--semi-color-primary-hover);
3473
+ }
3474
+ .semi-datepicker-range-input-disabled {
3475
+ cursor: not-allowed;
3476
+ color: var(--semi-color-disabled-text);
3477
+ background-color: var(--semi-color-disabled-fill);
3478
+ }
3479
+ .semi-datepicker-range-input-disabled .semi-datepicker-range-input-wrapper:hover {
3480
+ background-color: transparent;
3481
+ }
3482
+ .semi-datepicker-range-input-disabled:hover {
3483
+ background-color: var(--semi-color-disabled-fill);
3484
+ }
3485
+ .semi-datepicker-range-input-disabled .semi-datepicker-range-input-prefix,
3486
+ .semi-datepicker-range-input-disabled .semi-datepicker-range-input-suffix,
3487
+ .semi-datepicker-range-input-disabled .semi-datepicker-range-input-clearbtn {
3488
+ color: var(--semi-color-disabled-text);
3489
+ }
3490
+ .semi-datepicker-range-input-warning {
3491
+ background-color: var(--semi-color-warning-light-default);
3492
+ }
3493
+ .semi-datepicker-range-input-warning .semi-datepicker-range-input-wrapper:hover {
3494
+ background-color: var(--semi-color-warning-light-hover);
3495
+ }
3496
+ .semi-datepicker-range-input-warning .semi-datepicker-range-input-wrapper-active {
3497
+ border-color: var(--semi-color-warning);
3498
+ background-color: var(--semi-color-warning-light-hover);
3499
+ }
3500
+ .semi-datepicker-range-input-error {
3501
+ background-color: var(--semi-color-danger-light-default);
3502
+ }
3503
+ .semi-datepicker-range-input-error .semi-datepicker-range-input-wrapper:hover {
3504
+ background-color: var(--semi-color-danger-light-hover);
3505
+ }
3506
+ .semi-datepicker-range-input-error .semi-datepicker-range-input-wrapper-active {
3507
+ border-color: var(--semi-color-danger);
3508
+ background-color: var(--semi-color-danger-light-hover);
3509
+ }
3510
+ .semi-datepicker-range-input .semi-datepicker-range-input-clearbtn {
3511
+ display: none;
3512
+ }
3513
+ .semi-datepicker-range-input-prefix, .semi-datepicker-range-input-suffix, .semi-datepicker-range-input-clearbtn {
3514
+ display: flex;
3515
+ align-items: center;
3516
+ justify-content: center;
3517
+ font-weight: 600;
3518
+ font-size: 14px;
3519
+ line-height: 20px;
3520
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3521
+ white-space: nowrap;
3522
+ color: var(--semi-color-text-2);
3523
+ }
3524
+ .semi-datepicker-range-input-prefix {
3525
+ padding-left: 12px;
3526
+ padding-right: 8px;
3527
+ }
3528
+ .semi-datepicker-range-input-suffix {
3529
+ padding-left: 8px;
3530
+ padding-right: 12px;
3531
+ }
3532
+ .semi-datepicker-range-input-suffix-hidden {
3533
+ display: none;
3534
+ }
3535
+ .semi-datepicker-range-input-clearbtn {
3536
+ padding-left: 8px;
3537
+ padding-right: 12px;
3538
+ }
3539
+
3540
+ /*
3541
+ * 小尺寸 DatePicker
3542
+ */
3543
+ .semi-datepicker-compact {
3544
+ font-size: 12px;
3545
+ line-height: 16px;
3546
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3547
+ line-height: 20px;
3548
+ display: inline-block;
3549
+ max-width: calc(100vw - 32px);
3550
+ }
3551
+ .semi-datepicker-compact:not(.semi-datepicker-compact-insetInput) {
3552
+ width: max-content;
3553
+ }
3554
+ .semi-datepicker-compact .semi-datepicker-container {
3555
+ width: max-content;
3556
+ }
3557
+ .semi-datepicker-compact .semi-datepicker-month-grid {
3558
+ width: max-content;
3559
+ }
3560
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-datepicker-month-grid-left,
3561
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-datepicker-month-grid-right {
3562
+ min-width: 216px;
3563
+ max-width: calc(100vw - 32px);
3564
+ }
3565
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-datepicker-month {
3566
+ margin-left: auto;
3567
+ margin-right: auto;
3568
+ }
3569
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-type=dateTime] .semi-datepicker-yam, .semi-datepicker-compact .semi-datepicker-month-grid[x-type=dateTimeRange] .semi-datepicker-yam {
3570
+ height: calc(100% - 32px);
3571
+ }
3572
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-datepicker-yam {
3573
+ position: relative;
3574
+ width: 100%;
3575
+ max-width: 100%;
3576
+ max-height: 256px;
3577
+ overflow-x: auto;
3578
+ overflow-y: hidden;
3579
+ }
3580
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-type=dateRange] .semi-datepicker-month-grid-left, .semi-datepicker-compact .semi-datepicker-month-grid[x-type=dateTimeRange] .semi-datepicker-month-grid-left {
3581
+ border-right: 1px solid var(--semi-color-border);
3582
+ }
3583
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-datepicker-yam-showing {
3584
+ min-height: 288px;
3585
+ min-width: 216px;
3586
+ }
3587
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-type=date] .semi-datepicker-yam-showing {
3588
+ min-height: 256px;
3589
+ }
3590
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-preset-position=left][x-insetinput=false] .semi-datepicker-month, .semi-datepicker-compact .semi-datepicker-month-grid[x-preset-position=right][x-insetinput=false] .semi-datepicker-month {
3591
+ height: 220px;
3592
+ }
3593
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-datepicker-yearmonth-header {
3594
+ box-sizing: border-box;
3595
+ height: 48px;
3596
+ padding: 12px;
3597
+ width: 100%;
3598
+ max-width: 100%;
3599
+ }
3600
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-datepicker-yearmonth-header button,
3601
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-datepicker-yearmonth-header .semi-button {
3602
+ width: 100%;
3603
+ max-width: 100%;
3604
+ overflow: hidden;
3605
+ text-overflow: ellipsis;
3606
+ white-space: nowrap;
3607
+ }
3608
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-datepicker-yearmonth-body {
3609
+ display: flex;
3610
+ }
3611
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-datepicker-yearmonth-body .semi-scrolllist:nth-child(2) {
3612
+ border: 1px solid var(--semi-color-border);
3613
+ }
3614
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-scrolllist {
3615
+ font-size: 12px;
3616
+ line-height: 16px;
3617
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3618
+ line-height: 20px;
3619
+ }
3620
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-scrolllist-header {
3621
+ display: none;
3622
+ }
3623
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-scrolllist-list-outer > ul > li {
3624
+ height: 32px;
3625
+ }
3626
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-scrolllist-item-wheel {
3627
+ border-right: 0;
3628
+ }
3629
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-scrolllist-item-wheel .semi-scrolllist-selector {
3630
+ height: 32px;
3631
+ }
3632
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-scrolllist-item-wheel .semi-scrolllist-shade-pre {
3633
+ margin-top: -17px;
3634
+ }
3635
+ .semi-datepicker-compact .semi-datepicker-month-grid .semi-scrolllist-item-wheel .semi-scrolllist-shade-post {
3636
+ margin-top: 17px;
3637
+ }
3638
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-panel-yearandmonth-open-type=left] .semi-datepicker-weeks, .semi-datepicker-compact .semi-datepicker-month-grid[x-panel-yearandmonth-open-type=right] .semi-datepicker-weeks {
3639
+ min-height: 168px;
3640
+ }
3641
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-month-grid-left[x-open-type=year],
3642
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-month-grid-right[x-open-type=year] {
3643
+ min-height: 256px;
3644
+ }
3645
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-month-grid-left[x-open-type=time],
3646
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-month-grid-right[x-open-type=time] {
3647
+ min-height: 256px;
3648
+ }
3649
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-yam-showing {
3650
+ min-height: 256px;
3651
+ }
3652
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-insetinput=true] .semi-datepicker-tpk {
3653
+ min-height: 100%;
3654
+ }
3655
+ .semi-datepicker-compact .semi-datepicker-month-grid[x-insetinput=true][x-type=dateTime] .semi-datepicker-yam, .semi-datepicker-compact .semi-datepicker-month-grid[x-insetinput=true][x-type=dateTimeRange] .semi-datepicker-yam {
3656
+ height: 100%;
3657
+ }
3658
+ .semi-datepicker-compact.semi-datepicker-panel-yam .semi-scrolllist {
3659
+ font-size: 12px;
3660
+ line-height: 16px;
3661
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3662
+ line-height: 20px;
3663
+ }
3664
+ .semi-datepicker-compact .semi-datepicker-tpk {
3665
+ height: calc(100% - 32px);
3666
+ }
3667
+ .semi-datepicker-compact .semi-datepicker-navigation {
3668
+ box-sizing: border-box;
3669
+ height: 24px;
3670
+ padding: 12px;
3671
+ padding-bottom: 0;
3672
+ width: 100%;
3673
+ max-width: 100%;
3674
+ }
3675
+ .semi-datepicker-compact .semi-datepicker-navigation-left, .semi-datepicker-compact .semi-datepicker-navigation-right {
3676
+ width: 24px;
3677
+ height: 24px;
3678
+ }
3679
+ .semi-datepicker-compact .semi-datepicker-navigation .semi-button {
3680
+ min-width: 24px;
3681
+ min-height: 24px;
3682
+ }
3683
+ .semi-datepicker-compact .semi-datepicker-navigation-month {
3684
+ min-width: 0;
3685
+ overflow: hidden;
3686
+ }
3687
+ .semi-datepicker-compact .semi-datepicker-navigation-month .semi-button {
3688
+ font-size: 12px;
3689
+ line-height: 16px;
3690
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3691
+ line-height: 20px;
3692
+ max-width: 100%;
3693
+ }
3694
+ .semi-datepicker-compact .semi-datepicker-navigation-month .semi-button > span {
3695
+ display: block;
3696
+ overflow: hidden;
3697
+ text-overflow: ellipsis;
3698
+ white-space: nowrap;
3699
+ }
3700
+ .semi-datepicker-compact .semi-datepicker-month {
3701
+ width: 216px;
3702
+ padding: 0;
3703
+ }
3704
+ .semi-datepicker-compact .semi-datepicker-weeks {
3705
+ padding: 10px;
3706
+ padding-top: 6px;
3707
+ }
3708
+ .semi-datepicker-compact .semi-datepicker-weekday {
3709
+ box-sizing: border-box;
3710
+ height: 36px;
3711
+ padding-left: 10px;
3712
+ padding-right: 10px;
3713
+ padding-bottom: 8px;
3714
+ border-bottom: 1px solid var(--semi-color-border);
3715
+ }
3716
+ .semi-datepicker-compact .semi-datepicker-weekday-item {
3717
+ width: 28px;
3718
+ height: 28px;
3719
+ line-height: 28px;
3720
+ }
3721
+ .semi-datepicker-compact .semi-datepicker-day {
3722
+ width: 28px;
3723
+ height: 28px;
3724
+ }
3725
+ .semi-datepicker-compact .semi-datepicker-day-main {
3726
+ width: 24px;
3727
+ height: 24px;
3728
+ }
3729
+ .semi-datepicker-compact .semi-datepicker-day-inrange .semi-datepicker-day-main, .semi-datepicker-compact .semi-datepicker-day-inhover .semi-datepicker-day-main, .semi-datepicker-compact .semi-datepicker-day-inoffsetrange .semi-datepicker-day-main, .semi-datepicker-compact .semi-datepicker-day-hoverday .semi-datepicker-day-main, .semi-datepicker-compact .semi-datepicker-day-selectedrange-hover .semi-datepicker-day-main {
3730
+ width: 28px;
3731
+ }
3732
+ .semi-datepicker-compact .semi-datepicker-day-selected-start.semi-datepicker-day-selected-end .semi-datepicker-day-main, .semi-datepicker-compact .semi-datepicker-day-offsetrange-start.semi-datepicker-day-offsetrange-end .semi-datepicker-day-main {
3733
+ border-radius: 4px;
3734
+ }
3735
+ .semi-datepicker-compact .semi-datepicker-day-offsetrange-start .semi-datepicker-day-main {
3736
+ border-radius: 4px 0 0 4px;
3737
+ }
3738
+ .semi-datepicker-compact .semi-datepicker-day-offsetrange-end .semi-datepicker-day-main {
3739
+ border-radius: 0 4px 4px 0;
3740
+ }
3741
+ .semi-datepicker-compact .semi-datepicker-day-hoverday-beforerange .semi-datepicker-day-main {
3742
+ border-radius: 4px 0 0 4px;
3743
+ }
3744
+ .semi-datepicker-compact .semi-datepicker-day-hoverday-afterrange .semi-datepicker-day-main {
3745
+ border-radius: 0 4px 4px 0;
3746
+ }
3747
+ .semi-datepicker-compact .semi-datepicker-day-selected-start .semi-datepicker-day-main, .semi-datepicker-compact .semi-datepicker-day-offsetrange-start .semi-datepicker-day-main {
3748
+ width: 34px;
3749
+ margin-left: 2px;
3750
+ margin-right: 0;
3751
+ border-radius: 4px 0 0 4px;
3752
+ }
3753
+ .semi-datepicker-compact .semi-datepicker-day-selected-end .semi-datepicker-day-main, .semi-datepicker-compact .semi-datepicker-day-offsetrange-end .semi-datepicker-day-main {
3754
+ width: 34px;
3755
+ margin-right: 2px;
3756
+ margin-left: 0;
3757
+ border-radius: 0 4px 4px 0;
3758
+ }
3759
+ .semi-datepicker-compact .semi-datepicker-switch {
3760
+ box-sizing: border-box;
3761
+ height: 32px;
3762
+ }
3763
+ .semi-datepicker-compact .semi-datepicker-switch-date, .semi-datepicker-compact .semi-datepicker-switch-time {
3764
+ padding-top: 6px;
3765
+ padding-bottom: 6px;
3766
+ }
3767
+ .semi-datepicker-compact .semi-datepicker-switch-date {
3768
+ border-right: 1px solid var(--semi-color-border);
3769
+ }
3770
+ .semi-datepicker-compact .semi-datepicker-switch-text {
3771
+ padding-left: 0;
3772
+ }
3773
+ .semi-datepicker-compact .semi-datepicker-quick-control-header {
3774
+ padding: 16px 12px 0;
3775
+ font-weight: 600;
3776
+ }
3777
+ .semi-datepicker-compact .semi-datepicker-quick-control-left-content-wrapper, .semi-datepicker-compact .semi-datepicker-quick-control-right-content-wrapper {
3778
+ margin-top: 12px;
3779
+ }
3780
+ .semi-datepicker-compact .semi-datepicker-quick-control-left-content, .semi-datepicker-compact .semi-datepicker-quick-control-right-content {
3781
+ box-sizing: border-box;
3782
+ display: grid;
3783
+ align-content: flex-start;
3784
+ grid-gap: 8px;
3785
+ grid-template-columns: repeat(2, minmax(76.5px, 84px));
3786
+ padding: 0 12px 12px;
3787
+ }
3788
+ .semi-datepicker-compact .semi-datepicker-quick-control-left-content-item, .semi-datepicker-compact .semi-datepicker-quick-control-right-content-item {
3789
+ max-width: 84px;
3790
+ }
3791
+ .semi-datepicker-compact .semi-datepicker-quick-control-left-content-item-ellipsis, .semi-datepicker-compact .semi-datepicker-quick-control-right-content-item-ellipsis {
3792
+ width: 68px;
3793
+ font-size: 12px;
3794
+ color: var(--semi-color-primary);
3795
+ }
3796
+ .semi-datepicker-compact .semi-datepicker-quick-control-top-content, .semi-datepicker-compact .semi-datepicker-quick-control-bottom-content {
3797
+ box-sizing: border-box;
3798
+ display: grid;
3799
+ grid-gap: 8px;
3800
+ grid-template-columns: repeat(3, minmax(54.94px, 59.94px));
3801
+ align-content: flex-start;
3802
+ padding: 8px 10px;
3803
+ }
3804
+ .semi-datepicker-compact .semi-datepicker-quick-control-top-content-item, .semi-datepicker-compact .semi-datepicker-quick-control-bottom-content-item {
3805
+ max-width: 59.94px;
3806
+ }
3807
+ .semi-datepicker-compact .semi-datepicker-quick-control-top-content-item-ellipsis, .semi-datepicker-compact .semi-datepicker-quick-control-bottom-content-item-ellipsis {
3808
+ width: 43.94px;
3809
+ font-size: 12px;
3810
+ color: var(--semi-color-primary);
3811
+ }
3812
+ .semi-datepicker-compact .semi-datepicker-quick-control-top-range-content, .semi-datepicker-compact .semi-datepicker-quick-control-bottom-range-content {
3813
+ display: grid;
3814
+ grid-template-columns: repeat(5, minmax(73px, 76px));
3815
+ grid-gap: 8px;
3816
+ align-content: flex-start;
3817
+ padding: 8px 10px;
3818
+ }
3819
+ .semi-datepicker-compact .semi-datepicker-quick-control-top-range-content-item, .semi-datepicker-compact .semi-datepicker-quick-control-bottom-range-content-item {
3820
+ max-width: 76px;
3821
+ }
3822
+ .semi-datepicker-compact .semi-datepicker-quick-control-top-range-content-item-ellipsis, .semi-datepicker-compact .semi-datepicker-quick-control-bottom-range-content-item-ellipsis {
3823
+ width: 60px;
3824
+ font-size: 12px;
3825
+ color: var(--semi-color-primary);
3826
+ }
3827
+ .semi-datepicker-compact .semi-datepicker-quick-control-top-month-content, .semi-datepicker-compact .semi-datepicker-quick-control-bottom-month-content {
3828
+ display: grid;
3829
+ grid-template-columns: repeat(2, minmax(61px, 68.5px));
3830
+ grid-gap: 8px;
3831
+ align-content: flex-start;
3832
+ padding: 8px 10px;
3833
+ }
3834
+ .semi-datepicker-compact .semi-datepicker-quick-control-top-month-content-item, .semi-datepicker-compact .semi-datepicker-quick-control-bottom-month-content-item {
3835
+ max-width: 68.5px;
3836
+ }
3837
+ .semi-datepicker-compact .semi-datepicker-quick-control-top-month-content-item-ellipsis, .semi-datepicker-compact .semi-datepicker-quick-control-bottom-month-content-item-ellipsis {
3838
+ max-width: 52.5px;
3839
+ font-size: 12px;
3840
+ color: var(--semi-color-primary);
3841
+ }
3842
+ .semi-datepicker-compact .semi-datepicker-quick-control-month {
3843
+ min-width: 216px;
3844
+ width: max-content;
3845
+ max-width: calc(100vw - 32px);
3846
+ }
3847
+ .semi-datepicker-compact .semi-datepicker-quick-control-month[x-insetinput=true] .semi-datepicker-quick-control-right-content-wrapper,
3848
+ .semi-datepicker-compact .semi-datepicker-quick-control-month[x-insetinput=true] .semi-datepicker-quick-control-left-content-wrapper {
3849
+ max-height: 254px;
3850
+ }
3851
+ .semi-datepicker-compact .semi-datepicker-quick-control-month .semi-datepicker-quick-control-right-content-wrapper,
3852
+ .semi-datepicker-compact .semi-datepicker-quick-control-month .semi-datepicker-quick-control-left-content-wrapper {
3853
+ max-height: 218px;
3854
+ }
3855
+ .semi-datepicker-compact .semi-datepicker-quick-control-date {
3856
+ min-width: 216px;
3857
+ width: max-content;
3858
+ max-width: calc(100vw - 32px);
3859
+ }
3860
+ .semi-datepicker-compact .semi-datepicker-quick-control-date[x-insetinput=true] .semi-datepicker-quick-control-right-content-wrapper,
3861
+ .semi-datepicker-compact .semi-datepicker-quick-control-date[x-insetinput=true] .semi-datepicker-quick-control-left-content-wrapper {
3862
+ max-height: 248px;
3863
+ }
3864
+ .semi-datepicker-compact .semi-datepicker-quick-control-date .semi-datepicker-quick-control-right-content-wrapper,
3865
+ .semi-datepicker-compact .semi-datepicker-quick-control-date .semi-datepicker-quick-control-left-content-wrapper {
3866
+ max-height: 208px;
3867
+ }
3868
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateTime {
3869
+ min-width: 216px;
3870
+ width: max-content;
3871
+ max-width: calc(100vw - 32px);
3872
+ }
3873
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateTime[x-insetinput=true] .semi-datepicker-quick-control-right-content-wrapper,
3874
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateTime[x-insetinput=true] .semi-datepicker-quick-control-left-content-wrapper {
3875
+ max-height: 248px;
3876
+ }
3877
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateTime .semi-datepicker-quick-control-right-content-wrapper,
3878
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateTime .semi-datepicker-quick-control-left-content-wrapper {
3879
+ max-height: 240px;
3880
+ }
3881
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateRange {
3882
+ min-width: min(432px, calc(100vw - 32px));
3883
+ width: max-content;
3884
+ max-width: calc(100vw - 32px);
3885
+ }
3886
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateRange[x-insetinput=true] .semi-datepicker-quick-control-right-content-wrapper,
3887
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateRange[x-insetinput=true] .semi-datepicker-quick-control-left-content-wrapper {
3888
+ max-height: 248px;
3889
+ }
3890
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateRange .semi-datepicker-quick-control-right-content-wrapper,
3891
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateRange .semi-datepicker-quick-control-left-content-wrapper {
3892
+ max-height: 208px;
3893
+ }
3894
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateTimeRange {
3895
+ min-width: min(432px, calc(100vw - 32px));
3896
+ width: max-content;
3897
+ max-width: calc(100vw - 32px);
3898
+ }
3899
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateTimeRange[x-insetinput=true] .semi-datepicker-quick-control-right-content-wrapper,
3900
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateTimeRange[x-insetinput=true] .semi-datepicker-quick-control-left-content-wrapper {
3901
+ max-height: 248px;
3902
+ }
3903
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateTimeRange .semi-datepicker-quick-control-right-content-wrapper,
3904
+ .semi-datepicker-compact .semi-datepicker-quick-control-dateTimeRange .semi-datepicker-quick-control-left-content-wrapper {
3905
+ max-height: 240px;
3906
+ }
3907
+ .semi-datepicker-compact .semi-datepicker-footer {
3908
+ padding-top: 10px;
3909
+ padding-right: 8px;
3910
+ padding-bottom: 10px;
3911
+ }
3912
+ .semi-datepicker-compact .semi-datepicker-inset-input-wrapper {
3913
+ column-gap: 4px;
3914
+ padding: 8px 8px;
3915
+ padding-bottom: 0;
3916
+ width: 216px;
3917
+ }
3918
+ .semi-datepicker-compact .semi-datepicker-inset-input-wrapper[x-type=dateRange], .semi-datepicker-compact .semi-datepicker-inset-input-wrapper[x-type=dateTimeRange] {
3919
+ width: 432px;
3920
+ padding-top: 0;
3921
+ }
3922
+ .semi-datepicker-compact .semi-datepicker-inset-input-wrapper[x-type=dateRange] .semi-input-wrapper, .semi-datepicker-compact .semi-datepicker-inset-input-wrapper[x-type=dateTimeRange] .semi-input-wrapper {
3923
+ margin-top: 8px;
3924
+ }
3925
+ .semi-datepicker-compact .semi-datepicker-inset-input-wrapper[x-type=month] {
3926
+ width: 195px;
3927
+ }
3928
+ .semi-datepicker-compact .semi-datepicker-inset-input-wrapper .semi-input-wrapper {
3929
+ height: 28px;
3930
+ box-sizing: border-box;
3931
+ }
3932
+ .semi-datepicker-compact .semi-datepicker-inset-input-wrapper .semi-input-wrapper .semi-input {
3933
+ font-size: 12px;
3934
+ line-height: 26px;
3935
+ height: 26px;
3936
+ vertical-align: top;
3937
+ }
3938
+ .semi-datepicker-compact .semi-datepicker-inset-input-separator {
3939
+ border-left: 1px solid var(--semi-color-border);
3940
+ transform: translateX(50%);
3941
+ height: auto;
3942
+ }
3943
+
3944
+ .semi-popover-wrapper[x-placement^=top] .semi-datepicker .semi-datepicker-weeks, .semi-popover-wrapper[x-placement=leftTop] .semi-datepicker .semi-datepicker-weeks, .semi-popover-wrapper[x-placement=rightTop] .semi-datepicker .semi-datepicker-weeks, .semi-popover-wrapper[x-placement*=BottomOver] .semi-datepicker .semi-datepicker-weeks {
3945
+ min-height: 216px;
3946
+ }
3947
+ .semi-popover-wrapper[x-placement^=top] .semi-datepicker-compact .semi-datepicker-weeks, .semi-popover-wrapper[x-placement=leftTop] .semi-datepicker-compact .semi-datepicker-weeks, .semi-popover-wrapper[x-placement=rightTop] .semi-datepicker-compact .semi-datepicker-weeks, .semi-popover-wrapper[x-placement*=BottomOver] .semi-datepicker-compact .semi-datepicker-weeks {
3948
+ min-height: 168px;
3949
+ }
3950
+
3951
+ .semi-datepicker-borderless:not(:focus-within):not(:hover) {
3952
+ background-color: transparent;
3953
+ border-color: transparent;
3954
+ }
3955
+ .semi-datepicker-borderless:not(:focus-within):not(:hover) .semi-input-suffix, .semi-datepicker-borderless:not(:focus-within):not(:hover) .semi-datepicker-range-input-suffix {
3956
+ opacity: 0;
3957
+ }
3958
+ .semi-datepicker-borderless:focus-within:not(:active) {
3959
+ background-color: transparent;
3960
+ }
3961
+ .semi-datepicker-borderless.semi-datepicker-range-input-error .semi-datepicker-range-input-wrapper-active {
3962
+ border-color: transparent;
3963
+ }
3964
+ .semi-datepicker-borderless.semi-datepicker-range-input-error:hover {
3965
+ background-color: var(--semi-color-danger-light-default);
3966
+ }
3967
+ .semi-datepicker-borderless.semi-datepicker-range-input-error:focus-within {
3968
+ background-color: var(--semi-color-danger-light-default);
3969
+ }
3970
+ .semi-datepicker-borderless.semi-datepicker-range-input-error:not(:focus-within) {
3971
+ border-width: 1px;
3972
+ border-color: var(--semi-color-danger);
3973
+ }
3974
+ .semi-datepicker-borderless.semi-datepicker-range-input-error:focus-within {
3975
+ border-width: 1px;
3976
+ border-color: var(--semi-color-danger);
3977
+ }
3978
+ .semi-datepicker-borderless.semi-datepicker-range-input-warning .semi-datepicker-range-input-wrapper-active {
3979
+ border-color: transparent;
3980
+ }
3981
+ .semi-datepicker-borderless.semi-datepicker-range-input-warning:hover {
3982
+ background-color: var(--semi-color-warning-light-default);
3983
+ }
3984
+ .semi-datepicker-borderless.semi-datepicker-range-input-warning:focus-within {
3985
+ background-color: var(--semi-color-warning-light-default);
3986
+ }
3987
+ .semi-datepicker-borderless.semi-datepicker-range-input-warning:not(:focus-within) {
3988
+ border-width: 1px;
3989
+ border-color: var(--semi-color-warning);
3990
+ }
3991
+ .semi-datepicker-borderless.semi-datepicker-range-input-warning:focus-within {
3992
+ border-width: 1px;
3993
+ border-color: var(--semi-color-warning);
3994
+ }
3995
+
3996
+ .semi-rtl,
3997
+ .semi-portal-rtl {
3998
+ /*
3999
+ * 小尺寸 DatePicker
4000
+ */
4001
+ }
4002
+ .semi-rtl .semi-datepicker,
4003
+ .semi-portal-rtl .semi-datepicker {
4004
+ direction: rtl;
4005
+ }
4006
+ .semi-rtl .semi-datepicker-footer,
4007
+ .semi-portal-rtl .semi-datepicker-footer {
4008
+ padding-right: 0;
4009
+ padding-left: 8px;
4010
+ text-align: left;
4011
+ }
4012
+ .semi-rtl .semi-datepicker-footer .semi-button:first-of-type,
4013
+ .semi-portal-rtl .semi-datepicker-footer .semi-button:first-of-type {
4014
+ margin-left: 0;
4015
+ margin-right: 0;
4016
+ }
4017
+ .semi-rtl .semi-datepicker-footer .semi-button:nth-of-type(2),
4018
+ .semi-portal-rtl .semi-datepicker-footer .semi-button:nth-of-type(2) {
4019
+ margin-right: 12px;
4020
+ margin-left: 0;
4021
+ }
4022
+ .semi-rtl .semi-datepicker-day-offsetrange-start .semi-datepicker-day-main,
4023
+ .semi-portal-rtl .semi-datepicker-day-offsetrange-start .semi-datepicker-day-main {
4024
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
4025
+ }
4026
+ .semi-rtl .semi-datepicker-day-offsetrange-end .semi-datepicker-day-main,
4027
+ .semi-portal-rtl .semi-datepicker-day-offsetrange-end .semi-datepicker-day-main {
4028
+ border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
4029
+ }
4030
+ .semi-rtl .semi-datepicker-day-selected-start .semi-datepicker-day-main, .semi-rtl .semi-datepicker-day-hoverday-before-selectedrange .semi-datepicker-day-main, .semi-rtl .semi-datepicker-day-offsetrange-start .semi-datepicker-day-main,
4031
+ .semi-portal-rtl .semi-datepicker-day-selected-start .semi-datepicker-day-main,
4032
+ .semi-portal-rtl .semi-datepicker-day-hoverday-before-selectedrange .semi-datepicker-day-main,
4033
+ .semi-portal-rtl .semi-datepicker-day-offsetrange-start .semi-datepicker-day-main {
4034
+ margin-right: 2px;
4035
+ margin-left: auto;
4036
+ border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
4037
+ }
4038
+ .semi-rtl .semi-datepicker-day-selected-end .semi-datepicker-day-main, .semi-rtl .semi-datepicker-day-hoverday-after-selectedrange .semi-datepicker-day-main, .semi-rtl .semi-datepicker-day-offsetrange-end .semi-datepicker-day-main,
4039
+ .semi-portal-rtl .semi-datepicker-day-selected-end .semi-datepicker-day-main,
4040
+ .semi-portal-rtl .semi-datepicker-day-hoverday-after-selectedrange .semi-datepicker-day-main,
4041
+ .semi-portal-rtl .semi-datepicker-day-offsetrange-end .semi-datepicker-day-main {
4042
+ margin-left: 2px;
4043
+ margin-right: auto;
4044
+ border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
4045
+ }
4046
+ .semi-rtl .semi-datepicker-switch-text,
4047
+ .semi-portal-rtl .semi-datepicker-switch-text {
4048
+ padding-left: 0;
4049
+ padding-right: 8px;
4050
+ }
4051
+ .semi-rtl .semi-datepicker-navigation .semi-icon-chevron_left,
4052
+ .semi-rtl .semi-datepicker-navigation .semi-icon-chevron_right,
4053
+ .semi-rtl .semi-datepicker-navigation .semi-icon-double_chevron_left,
4054
+ .semi-rtl .semi-datepicker-navigation .semi-icon-double_chevron_right, .semi-rtl .semi-datepicker-yam .semi-icon-chevron_left,
4055
+ .semi-rtl .semi-datepicker-yam .semi-icon-chevron_right,
4056
+ .semi-rtl .semi-datepicker-yam .semi-icon-double_chevron_left,
4057
+ .semi-rtl .semi-datepicker-yam .semi-icon-double_chevron_right,
4058
+ .semi-portal-rtl .semi-datepicker-navigation .semi-icon-chevron_left,
4059
+ .semi-portal-rtl .semi-datepicker-navigation .semi-icon-chevron_right,
4060
+ .semi-portal-rtl .semi-datepicker-navigation .semi-icon-double_chevron_left,
4061
+ .semi-portal-rtl .semi-datepicker-navigation .semi-icon-double_chevron_right,
4062
+ .semi-portal-rtl .semi-datepicker-yam .semi-icon-chevron_left,
4063
+ .semi-portal-rtl .semi-datepicker-yam .semi-icon-chevron_right,
4064
+ .semi-portal-rtl .semi-datepicker-yam .semi-icon-double_chevron_left,
4065
+ .semi-portal-rtl .semi-datepicker-yam .semi-icon-double_chevron_right {
4066
+ transform: scaleX(-1);
4067
+ }
4068
+ .semi-rtl .semi-datepicker-range-input-prefix,
4069
+ .semi-portal-rtl .semi-datepicker-range-input-prefix {
4070
+ padding-left: 8px;
4071
+ padding-right: 12px;
4072
+ }
4073
+ .semi-rtl .semi-datepicker-range-input-suffix,
4074
+ .semi-portal-rtl .semi-datepicker-range-input-suffix {
4075
+ padding-left: 12px;
4076
+ padding-right: 8px;
4077
+ }
4078
+ .semi-rtl .semi-datepicker-range-input-suffix-hidden,
4079
+ .semi-portal-rtl .semi-datepicker-range-input-suffix-hidden {
4080
+ display: none;
4081
+ }
4082
+ .semi-rtl .semi-datepicker-range-input-clearbtn,
4083
+ .semi-portal-rtl .semi-datepicker-range-input-clearbtn {
4084
+ padding-left: 12px;
4085
+ padding-right: 8px;
4086
+ }
4087
+ .semi-rtl .semi-datepicker-compact .semi-datepicker-month-grid[x-type=dateRange] .semi-datepicker-month-grid-left, .semi-rtl .semi-datepicker-compact .semi-datepicker-month-grid[x-type=dateTimeRange] .semi-datepicker-month-grid-left,
4088
+ .semi-portal-rtl .semi-datepicker-compact .semi-datepicker-month-grid[x-type=dateRange] .semi-datepicker-month-grid-left,
4089
+ .semi-portal-rtl .semi-datepicker-compact .semi-datepicker-month-grid[x-type=dateTimeRange] .semi-datepicker-month-grid-left {
4090
+ border-left: 1px solid var(--semi-color-border);
4091
+ border-right: 0;
4092
+ }
4093
+ .semi-rtl .semi-datepicker-compact .semi-datepicker-month-grid .semi-scrolllist-item-wheel,
4094
+ .semi-portal-rtl .semi-datepicker-compact .semi-datepicker-month-grid .semi-scrolllist-item-wheel {
4095
+ border-left: 0;
4096
+ border-right: 0;
4097
+ }
4098
+ .semi-rtl .semi-datepicker-compact .semi-datepicker-day-offsetrange-start .semi-datepicker-day-main,
4099
+ .semi-portal-rtl .semi-datepicker-compact .semi-datepicker-day-offsetrange-start .semi-datepicker-day-main {
4100
+ border-radius: 0 4px 4px 0;
4101
+ }
4102
+ .semi-rtl .semi-datepicker-compact .semi-datepicker-day-offsetrange-end .semi-datepicker-day-main,
4103
+ .semi-portal-rtl .semi-datepicker-compact .semi-datepicker-day-offsetrange-end .semi-datepicker-day-main {
4104
+ border-radius: 4px 0 0 4px;
4105
+ }
4106
+ .semi-rtl .semi-datepicker-compact .semi-datepicker-day-selected-start .semi-datepicker-day-main,
4107
+ .semi-portal-rtl .semi-datepicker-compact .semi-datepicker-day-selected-start .semi-datepicker-day-main {
4108
+ margin-left: 0;
4109
+ margin-right: 2px;
4110
+ border-radius: 0 4px 4px 0;
4111
+ }
4112
+ .semi-rtl .semi-datepicker-compact .semi-datepicker-day-selected-end .semi-datepicker-day-main,
4113
+ .semi-portal-rtl .semi-datepicker-compact .semi-datepicker-day-selected-end .semi-datepicker-day-main {
4114
+ margin-right: 0;
4115
+ margin-left: 2px;
4116
+ border-radius: 4px 0 0 4px;
4117
+ }
4118
+ .semi-rtl .semi-datepicker-compact .semi-datepicker-switch-date,
4119
+ .semi-portal-rtl .semi-datepicker-compact .semi-datepicker-switch-date {
4120
+ border-left: 1px solid var(--semi-color-border);
4121
+ border-right: 0;
4122
+ }
4123
+ .semi-rtl .semi-datepicker-compact .semi-datepicker-switch-text,
4124
+ .semi-portal-rtl .semi-datepicker-compact .semi-datepicker-switch-text {
4125
+ padding-left: auto;
4126
+ padding-right: 0;
4127
+ }
4128
+ .semi-rtl .semi-datepicker-compact .semi-datepicker-footer,
4129
+ .semi-portal-rtl .semi-datepicker-compact .semi-datepicker-footer {
4130
+ padding-left: 8px;
4131
+ padding-right: auto;
4132
+ }
4133
+ .semi-rtl .semi-datepicker-compact .semi-datepicker-inset-input-separator,
4134
+ .semi-portal-rtl .semi-datepicker-compact .semi-datepicker-inset-input-separator {
4135
+ border-right: 1px solid var(--semi-color-border);
4136
+ border-left: 0;
4137
+ transform: translateX(-50%);
4138
+ }
4139
+
4140
+ .semi-icon {
4141
+ display: inline-block;
4142
+ font-style: normal;
4143
+ line-height: 0;
4144
+ text-align: center;
4145
+ text-transform: none;
4146
+ text-rendering: optimizeLegibility;
4147
+ fill: currentColor;
4148
+ }
4149
+
4150
+ .semi-icon-extra-small {
4151
+ font-size: 8px;
4152
+ }
4153
+
4154
+ .semi-icon-small {
4155
+ font-size: 12px;
4156
+ }
4157
+
4158
+ .semi-icon-default {
4159
+ font-size: 16px;
4160
+ }
4161
+
4162
+ .semi-icon-large {
4163
+ font-size: 20px;
4164
+ }
4165
+
4166
+ .semi-icon-extra-large {
4167
+ font-size: 24px;
4168
+ }
4169
+
4170
+ .semi-icon-spinning {
4171
+ animation: 0.6s linear infinite semi-icon-animation-rotate;
4172
+ animation-fill-mode: forwards;
4173
+ }
4174
+
4175
+ @keyframes semi-icon-animation-rotate {
4176
+ from {
4177
+ transform: rotate(0);
4178
+ }
4179
+ to {
4180
+ transform: rotate(360deg);
4181
+ }
4182
+ }
4183
+ .semi-datepicker .semi-datepicker-navigation .semi-button {
4184
+ color: var(--semi-color-text-2);
4185
+ }
4186
+
4187
+ .semi-datepicker .semi-datepicker-navigation-month .semi-button {
4188
+ color: var(--semi-color-text-0);
4189
+ }
4190
+
4191
+ .semi-datepicker .semi-datepicker-navigation .semi-button-content,
4192
+ .semi-datepicker .semi-datepicker-navigation .semi-button .semi-icon {
4193
+ color: inherit;
4194
+ }