@haklex/rich-ext-gallery 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,889 @@
1
+ ._10ydd1n0 {
2
+ position: relative;
3
+ width: 100%;
4
+ margin: 16px 0;
5
+ }
6
+ ._10ydd1n1 {
7
+ display: grid;
8
+ grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
9
+ gap: 12px;
10
+ }
11
+ ._10ydd1n2 {
12
+ column-count: 3;
13
+ column-gap: 12px;
14
+ }
15
+ ._10ydd1n2 figure {
16
+ break-inside: avoid;
17
+ margin-bottom: 12px;
18
+ }
19
+ ._10ydd1n3 {
20
+ position: relative;
21
+ }
22
+ ._10ydd1n4 {
23
+ width: 100%;
24
+ overflow-x: auto;
25
+ white-space: nowrap;
26
+ scroll-behavior: smooth;
27
+ scrollbar-width: none;
28
+ -ms-overflow-style: none;
29
+ }
30
+ ._10ydd1n4::-webkit-scrollbar {
31
+ display: none;
32
+ }
33
+ ._10ydd1n5 {
34
+ display: inline-block;
35
+ margin: 0;
36
+ cursor: pointer;
37
+ transition: transform 0.2s ease;
38
+ }
39
+ ._10ydd1n5:hover {
40
+ transform: scale(1.02);
41
+ }
42
+ ._10ydd1n5 img {
43
+ display: block;
44
+ border-radius: 4px;
45
+ }
46
+ ._10ydd1n6 {
47
+ position: absolute;
48
+ top: 50%;
49
+ transform: translateY(-50%);
50
+ width: 32px;
51
+ height: 32px;
52
+ border-radius: 50%;
53
+ border: 1px solid var(--rc-border);
54
+ background: var(--rc-bg-secondary);
55
+ color: var(--rc-text-secondary);
56
+ display: flex;
57
+ align-items: center;
58
+ justify-content: center;
59
+ cursor: pointer;
60
+ backdrop-filter: blur(20px) saturate(180%);
61
+ z-index: 10;
62
+ }
63
+ ._10ydd1n7 {
64
+ left: 8px;
65
+ }
66
+ ._10ydd1n8 {
67
+ right: 8px;
68
+ }
69
+ ._10ydd1n9 {
70
+ position: absolute;
71
+ bottom: 12px;
72
+ left: 50%;
73
+ transform: translateX(-50%);
74
+ display: flex;
75
+ gap: 8px;
76
+ z-index: 10;
77
+ }
78
+ ._10ydd1na {
79
+ width: 6px;
80
+ height: 6px;
81
+ border-radius: 50%;
82
+ background: var(--rc-text-secondary);
83
+ opacity: 0.5;
84
+ backdrop-filter: blur(20px) saturate(180%);
85
+ cursor: pointer;
86
+ transition: opacity 0.2s;
87
+ }
88
+ ._10ydd1na:hover {
89
+ opacity: 1;
90
+ }
91
+ ._10ydd1nb {
92
+ opacity: 1;
93
+ }
94
+ ._10ydd1nc {
95
+ position: relative;
96
+ width: 100%;
97
+ margin: 16px 0;
98
+ border-radius: 0.5rem;
99
+ overflow: hidden;
100
+ border: 1px solid var(--rc-border);
101
+ min-height: 120px;
102
+ }
103
+ ._10ydd1nd {
104
+ position: absolute;
105
+ inset: 0;
106
+ z-index: 5;
107
+ display: flex;
108
+ align-items: center;
109
+ justify-content: center;
110
+ cursor: pointer;
111
+ background: transparent;
112
+ border: none;
113
+ transition: background 0.2s;
114
+ }
115
+ ._10ydd1nd:hover {
116
+ background: color-mix(in srgb, currentColor 6%, transparent);
117
+ }
118
+ ._10ydd1ne {
119
+ display: flex;
120
+ align-items: center;
121
+ gap: 6px;
122
+ padding: 6px 14px;
123
+ border-radius: 6px;
124
+ background: var(--rc-bg);
125
+ border: 1px solid var(--rc-border);
126
+ color: var(--rc-text);
127
+ font-size: 0.8125rem;
128
+ font-weight: 500;
129
+ opacity: 0;
130
+ transition: opacity 0.2s;
131
+ }
132
+ ._10ydd1nc:hover ._10ydd1ne {
133
+ opacity: 1;
134
+ }
135
+ ._10ydd1nf {
136
+ display: flex;
137
+ flex-direction: column;
138
+ align-items: center;
139
+ justify-content: center;
140
+ padding: 2rem;
141
+ gap: 0.75rem;
142
+ color: var(--rc-text-secondary);
143
+ font-size: 0.875rem;
144
+ min-height: 120px;
145
+ }
146
+ ._10ydd1ng._10ydd1ng {
147
+ padding: 0;
148
+ gap: 0;
149
+ display: flex;
150
+ flex-direction: column;
151
+ overflow: hidden;
152
+ width: calc(100vw - 2rem);
153
+ height: min(720px, 85vh);
154
+ border-radius: 0.5rem;
155
+ }
156
+ ._10ydd1ng._10ydd1ng[data-open] {
157
+ animation: none;
158
+ }
159
+ ._10ydd1ng._10ydd1ng[data-closed] {
160
+ animation: none;
161
+ }
162
+ ._10ydd1nh {
163
+ display: flex;
164
+ align-items: center;
165
+ height: 48px;
166
+ flex-shrink: 0;
167
+ padding: 0 12px 0 16px;
168
+ border-bottom: 1px solid var(--rc-border);
169
+ gap: 10px;
170
+ }
171
+ ._10ydd1ni {
172
+ display: flex;
173
+ align-items: center;
174
+ gap: 0.5rem;
175
+ font-size: 0.875rem;
176
+ font-weight: 600;
177
+ color: var(--rc-text);
178
+ line-height: 1;
179
+ }
180
+ ._10ydd1nj {
181
+ margin-left: auto;
182
+ display: flex;
183
+ align-items: center;
184
+ gap: 2px;
185
+ }
186
+ ._10ydd1nk {
187
+ margin-left: 8px;
188
+ flex-shrink: 0;
189
+ display: flex;
190
+ align-items: center;
191
+ justify-content: center;
192
+ width: 32px;
193
+ height: 32px;
194
+ border-radius: 6px;
195
+ border: none;
196
+ background: transparent;
197
+ color: var(--rc-text-secondary);
198
+ cursor: pointer;
199
+ transition: background 0.15s, color 0.15s;
200
+ }
201
+ ._10ydd1nk:hover {
202
+ background: color-mix(in srgb, currentColor 8%, transparent);
203
+ color: var(--rc-text);
204
+ }
205
+ ._10ydd1nl {
206
+ flex: 1;
207
+ min-height: 0;
208
+ overflow-y: auto;
209
+ padding: 1rem;
210
+ }
211
+ ._10ydd1nm {
212
+ display: flex;
213
+ flex-direction: column;
214
+ gap: 0.75rem;
215
+ }
216
+ ._10ydd1nn {
217
+ display: flex;
218
+ align-items: flex-start;
219
+ gap: 0.75rem;
220
+ padding: 0.75rem;
221
+ border-radius: 0.5rem;
222
+ border: 1px solid var(--rc-border);
223
+ background: color-mix(in srgb, var(--rc-text) 2%, transparent);
224
+ }
225
+ ._10ydd1no {
226
+ display: flex;
227
+ align-items: center;
228
+ justify-content: center;
229
+ width: 24px;
230
+ height: 24px;
231
+ flex-shrink: 0;
232
+ color: var(--rc-text-secondary);
233
+ cursor: grab;
234
+ margin-top: 4px;
235
+ border-radius: 4px;
236
+ transition: background 0.15s, color 0.15s;
237
+ }
238
+ ._10ydd1no:hover {
239
+ background: color-mix(in srgb, currentColor 8%, transparent);
240
+ color: var(--rc-text);
241
+ }
242
+ ._10ydd1no:active {
243
+ cursor: grabbing;
244
+ }
245
+ ._10ydd1np {
246
+ width: 64px;
247
+ height: 64px;
248
+ border-radius: 4px;
249
+ overflow: hidden;
250
+ flex-shrink: 0;
251
+ background-color: color-mix(in srgb, var(--rc-text) 5%, transparent);
252
+ display: flex;
253
+ align-items: center;
254
+ justify-content: center;
255
+ }
256
+ ._10ydd1np img {
257
+ width: 100%;
258
+ height: 100%;
259
+ object-fit: cover;
260
+ }
261
+ ._10ydd1nq {
262
+ color: color-mix(in srgb, var(--rc-text-secondary) 40%, transparent);
263
+ }
264
+ ._10ydd1nr {
265
+ flex: 1;
266
+ display: flex;
267
+ flex-direction: column;
268
+ gap: 6px;
269
+ min-width: 0;
270
+ }
271
+ ._10ydd1ns {
272
+ width: 100%;
273
+ padding: 4px 8px;
274
+ border-radius: 4px;
275
+ border: 1px solid var(--rc-border);
276
+ background: var(--rc-bg);
277
+ color: var(--rc-text);
278
+ font-size: 0.8125rem;
279
+ outline: none;
280
+ transition: border-color 0.15s;
281
+ }
282
+ ._10ydd1ns:focus {
283
+ border-color: color-mix(in srgb, var(--rc-text) 30%, transparent);
284
+ }
285
+ ._10ydd1ns::placeholder {
286
+ color: color-mix(in srgb, var(--rc-text-secondary) 50%, transparent);
287
+ }
288
+ ._10ydd1nt {
289
+ display: flex;
290
+ flex-direction: column;
291
+ gap: 2px;
292
+ flex-shrink: 0;
293
+ }
294
+ ._10ydd1nu {
295
+ display: inline-flex;
296
+ align-items: center;
297
+ justify-content: center;
298
+ width: 28px;
299
+ height: 28px;
300
+ border-radius: 4px;
301
+ border: none;
302
+ background: transparent;
303
+ color: var(--rc-text-secondary);
304
+ cursor: pointer;
305
+ transition: background 0.15s, color 0.15s;
306
+ }
307
+ ._10ydd1nu:hover {
308
+ background: color-mix(in srgb, var(--rc-alert-caution) 10%, transparent);
309
+ color: var(--rc-alert-caution);
310
+ }
311
+ ._10ydd1nv {
312
+ display: flex;
313
+ align-items: center;
314
+ justify-content: center;
315
+ gap: 6px;
316
+ width: 100%;
317
+ padding: 0.625rem;
318
+ border-radius: 0.5rem;
319
+ border: 1px dashed var(--rc-border);
320
+ background: transparent;
321
+ color: var(--rc-text-secondary);
322
+ font-size: 0.8125rem;
323
+ cursor: pointer;
324
+ transition: border-color 0.15s, color 0.15s, background 0.15s;
325
+ }
326
+ ._10ydd1nv:hover {
327
+ border-color: color-mix(in srgb, var(--rc-text) 20%, transparent);
328
+ color: var(--rc-text);
329
+ background: color-mix(in srgb, var(--rc-text) 2%, transparent);
330
+ }
331
+ ._10ydd1nw {
332
+ display: flex;
333
+ align-items: center;
334
+ justify-content: space-between;
335
+ padding: 0 1rem;
336
+ height: 44px;
337
+ border-top: 1px solid var(--rc-border);
338
+ flex-shrink: 0;
339
+ background-color: color-mix(in srgb, var(--rc-text) 1.5%, transparent);
340
+ }
341
+ ._10ydd1nx {
342
+ font-size: 0.75rem;
343
+ color: var(--rc-text-secondary);
344
+ }
345
+ ._10ydd1ny {
346
+ display: flex;
347
+ align-items: center;
348
+ gap: 0.5rem;
349
+ }
350
+ ._10ydd1nz {
351
+ padding: 0.25rem 0.75rem;
352
+ border-radius: 0.375rem;
353
+ font-size: 0.75rem;
354
+ font-weight: 500;
355
+ cursor: pointer;
356
+ height: 28px;
357
+ transition: background-color 0.15s, border-color 0.15s;
358
+ }
359
+ ._10ydd1n10 {
360
+ background-color: transparent;
361
+ color: var(--rc-text-secondary);
362
+ border: 1px solid var(--rc-border);
363
+ }
364
+ ._10ydd1n10:hover {
365
+ background-color: color-mix(in srgb, var(--rc-text) 4%, transparent);
366
+ }
367
+ ._10ydd1n11 {
368
+ background-color: var(--rc-text);
369
+ color: var(--rc-bg);
370
+ border: 1px solid transparent;
371
+ }
372
+ ._10ydd1n11:hover {
373
+ background-color: color-mix(in srgb, var(--rc-text) 85%, transparent);
374
+ }
375
+ ._10ydd1n12 {
376
+ display: flex;
377
+ flex-direction: column;
378
+ align-items: center;
379
+ justify-content: center;
380
+ flex: 1;
381
+ gap: 1rem;
382
+ color: var(--rc-text-secondary);
383
+ font-size: 0.875rem;
384
+ padding: 2rem;
385
+ }
386
+ @media (max-width: 768px) {
387
+ ._10ydd1n2 {
388
+ column-count: 2;
389
+ }
390
+ }
391
+ @media (max-width: 480px) {
392
+ ._10ydd1n1 {
393
+ grid-template-columns: 1fr;
394
+ }
395
+ ._10ydd1n2 {
396
+ column-count: 1;
397
+ }
398
+ }
399
+ @media (min-width: 640px) {
400
+ ._10ydd1ng._10ydd1ng {
401
+ max-width: 56rem;
402
+ }
403
+ }.PhotoView-Portal{direction:ltr;height:100%;left:0;overflow:hidden;position:fixed;top:0;touch-action:none;width:100%;z-index:2000}@keyframes PhotoView__rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes PhotoView__delayIn{0%,50%{opacity:0}to{opacity:1}}.PhotoView__Spinner{animation:PhotoView__delayIn .4s linear both}.PhotoView__Spinner svg{animation:PhotoView__rotate .6s linear infinite}.PhotoView__Photo{cursor:grab;max-width:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.PhotoView__Photo:active{cursor:grabbing}.PhotoView__icon{display:inline-block;left:0;position:absolute;top:0;transform:translate(-50%,-50%)}.PhotoView__PhotoBox,.PhotoView__PhotoWrap{bottom:0;direction:ltr;left:0;position:absolute;right:0;top:0;touch-action:none;width:100%}.PhotoView__PhotoWrap{overflow:hidden;z-index:10}.PhotoView__PhotoBox{transform-origin:left top}@keyframes PhotoView__fade{0%{opacity:0}to{opacity:1}}.PhotoView-Slider__clean .PhotoView-Slider__ArrowLeft,.PhotoView-Slider__clean .PhotoView-Slider__ArrowRight,.PhotoView-Slider__clean .PhotoView-Slider__BannerWrap,.PhotoView-Slider__clean .PhotoView-Slider__Overlay,.PhotoView-Slider__willClose .PhotoView-Slider__BannerWrap:hover{opacity:0}.PhotoView-Slider__Backdrop{background:#000;height:100%;left:0;position:absolute;top:0;transition-property:background-color;width:100%;z-index:-1}.PhotoView-Slider__fadeIn{animation:PhotoView__fade linear both;opacity:0}.PhotoView-Slider__fadeOut{animation:PhotoView__fade linear reverse both;opacity:0}.PhotoView-Slider__BannerWrap{align-items:center;background-color:rgba(0,0,0,.5);color:#fff;display:flex;height:44px;justify-content:space-between;left:0;position:absolute;top:0;transition:opacity .2s ease-out;width:100%;z-index:20}.PhotoView-Slider__BannerWrap:hover{opacity:1}.PhotoView-Slider__Counter{font-size:14px;opacity:.75;padding:0 10px}.PhotoView-Slider__BannerRight{align-items:center;display:flex;height:100%}.PhotoView-Slider__toolbarIcon{fill:#fff;box-sizing:border-box;cursor:pointer;opacity:.75;padding:10px;transition:opacity .2s linear}.PhotoView-Slider__toolbarIcon:hover{opacity:1}.PhotoView-Slider__ArrowLeft,.PhotoView-Slider__ArrowRight{align-items:center;bottom:0;cursor:pointer;display:flex;height:100px;justify-content:center;margin:auto;opacity:.75;position:absolute;top:0;transition:opacity .2s linear;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:70px;z-index:20}.PhotoView-Slider__ArrowLeft:hover,.PhotoView-Slider__ArrowRight:hover{opacity:1}.PhotoView-Slider__ArrowLeft svg,.PhotoView-Slider__ArrowRight svg{fill:#fff;background:rgba(0,0,0,.3);box-sizing:content-box;height:24px;padding:10px;width:24px}.PhotoView-Slider__ArrowLeft{left:0}.PhotoView-Slider__ArrowRight{right:0}@keyframes tjii40 {
404
+ from {
405
+ opacity: 0;
406
+ transform: translateY(2px) scale(0.96);
407
+ }
408
+ to {
409
+ opacity: 1;
410
+ transform: translateY(0) scale(1);
411
+ }
412
+ }
413
+ @keyframes tjii41 {
414
+ from {
415
+ opacity: 1;
416
+ transform: translateY(0) scale(1);
417
+ }
418
+ to {
419
+ opacity: 0;
420
+ transform: translateY(2px) scale(0.96);
421
+ }
422
+ }
423
+ .tjii42 {
424
+ z-index: 50;
425
+ width: 288px;
426
+ border-radius: 0.5rem;
427
+ border: 1px solid var(--rc-border);
428
+ padding: 1rem;
429
+ background-color: var(--rc-bg);
430
+ box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
431
+ outline: none;
432
+ transition: opacity 150ms ease-out, transform 150ms ease-out;
433
+ }
434
+ .tjii42[data-open] {
435
+ animation: tjii40 150ms ease-out;
436
+ }
437
+ .tjii42[data-ending-style] {
438
+ opacity: 0;
439
+ transform: translateY(2px) scale(0.96);
440
+ }
441
+ .tjii42[data-closed] {
442
+ animation: tjii41 150ms ease-in;
443
+ }
444
+ .tjii43 {
445
+ width: 10px;
446
+ height: 10px;
447
+ transform-origin: center;
448
+ }
449
+ .tjii43 > polygon {
450
+ fill: var(--rc-bg);
451
+ }
452
+ .tjii43 > polyline {
453
+ stroke: var(--rc-border);
454
+ fill: none;
455
+ }
456
+ .tjii44 {
457
+ font-size: 0.875rem;
458
+ font-weight: 600;
459
+ line-height: 1;
460
+ color: var(--rc-text);
461
+ }
462
+ .tjii45 {
463
+ font-size: 0.875rem;
464
+ line-height: 1.25rem;
465
+ color: var(--rc-text-secondary);
466
+ margin-top: 0.25rem;
467
+ }@keyframes _7sluyk0 {
468
+ from {
469
+ opacity: 0;
470
+ transform: scale(0.95);
471
+ }
472
+ to {
473
+ opacity: 1;
474
+ transform: scale(1);
475
+ }
476
+ }
477
+ ._7sluyk1 {
478
+ display: flex;
479
+ align-items: center;
480
+ gap: 2px;
481
+ height: 32px;
482
+ padding: 0 6px;
483
+ border: none;
484
+ background: none;
485
+ border-radius: 8px;
486
+ cursor: pointer;
487
+ color: var(--rc-text-secondary);
488
+ transition: color 0.1s, background-color 0.1s;
489
+ }
490
+ ._7sluyk1:hover {
491
+ color: var(--rc-text);
492
+ background-color: color-mix(in srgb, var(--rc-text) 4%, transparent);
493
+ }
494
+ ._7sluyk2 {
495
+ display: flex;
496
+ flex-direction: column;
497
+ align-items: center;
498
+ }
499
+ ._7sluyk3 {
500
+ font-size: 12px;
501
+ font-weight: 600;
502
+ line-height: 1;
503
+ }
504
+ ._7sluyk4 {
505
+ margin-top: 2px;
506
+ height: 2px;
507
+ width: 14px;
508
+ border-radius: 1px;
509
+ }
510
+ ._7sluyk5 {
511
+ width: 12px;
512
+ height: 12px;
513
+ transition: transform 0.15s;
514
+ }
515
+ ._7sluyk6 {
516
+ padding: 8px;
517
+ width: auto;
518
+ }
519
+ ._7sluyk6[data-open] {
520
+ animation: _7sluyk0 120ms ease-out;
521
+ }
522
+ ._7sluyk7 {
523
+ display: grid;
524
+ grid-template-columns: repeat(5, 1fr);
525
+ gap: 4px;
526
+ }
527
+ ._7sluyk8 {
528
+ position: relative;
529
+ display: flex;
530
+ align-items: center;
531
+ justify-content: center;
532
+ width: 28px;
533
+ height: 28px;
534
+ border: none;
535
+ background: none;
536
+ border-radius: 8px;
537
+ cursor: pointer;
538
+ padding: 0;
539
+ transition: background-color 0.1s;
540
+ }
541
+ ._7sluyk8:hover {
542
+ background-color: color-mix(in srgb, var(--rc-text) 4%, transparent);
543
+ }
544
+ ._7sluyk9 {
545
+ width: 16px;
546
+ height: 16px;
547
+ border-radius: 50%;
548
+ border: 1px solid color-mix(in srgb, var(--rc-text) 10%, transparent);
549
+ }
550
+ ._7sluyka {
551
+ position: absolute;
552
+ width: 10px;
553
+ height: 10px;
554
+ color: var(--rc-bg);
555
+ }@keyframes _1ro2sxg0 {
556
+ from {
557
+ opacity: 0;
558
+ }
559
+ to {
560
+ opacity: 1;
561
+ }
562
+ }
563
+ @keyframes _1ro2sxg1 {
564
+ from {
565
+ opacity: 1;
566
+ }
567
+ to {
568
+ opacity: 0;
569
+ }
570
+ }
571
+ @keyframes _1ro2sxg2 {
572
+ from {
573
+ opacity: 0;
574
+ transform: translate(-50%, -48%) scale(0.95);
575
+ }
576
+ to {
577
+ opacity: 1;
578
+ transform: translate(-50%, -50%) scale(1);
579
+ }
580
+ }
581
+ @keyframes _1ro2sxg3 {
582
+ from {
583
+ opacity: 1;
584
+ transform: translate(-50%, -50%) scale(1);
585
+ }
586
+ to {
587
+ opacity: 0;
588
+ transform: translate(-50%, -48%) scale(0.95);
589
+ }
590
+ }
591
+ ._1ro2sxg4 {
592
+ position: fixed;
593
+ inset: 0;
594
+ z-index: 50;
595
+ background-color: rgba(0, 0, 0, 0.8);
596
+ }
597
+ ._1ro2sxg4[data-open] {
598
+ animation: _1ro2sxg0 150ms ease-out;
599
+ }
600
+ ._1ro2sxg4[data-closed] {
601
+ animation: _1ro2sxg1 100ms ease-in;
602
+ }
603
+ ._1ro2sxg5 {
604
+ position: fixed;
605
+ top: 50%;
606
+ left: 50%;
607
+ transform: translate(-50%, -50%);
608
+ z-index: 50;
609
+ display: grid;
610
+ width: 100%;
611
+ max-width: calc(100% - 2rem);
612
+ gap: 1rem;
613
+ border-radius: 0.75rem;
614
+ border: 1px solid var(--rc-border);
615
+ padding: 1.5rem;
616
+ font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
617
+ font-size: 0.875rem;
618
+ line-height: 1.43;
619
+ color: var(--rc-text);
620
+ background-color: var(--rc-bg);
621
+ box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
622
+ outline: none;
623
+ }
624
+ ._1ro2sxg5[data-open] {
625
+ animation: _1ro2sxg2 150ms ease-out;
626
+ }
627
+ ._1ro2sxg5[data-closed] {
628
+ animation: _1ro2sxg3 100ms ease-in;
629
+ }
630
+ ._1ro2sxg6 {
631
+ position: absolute;
632
+ top: 1rem;
633
+ right: 1rem;
634
+ display: inline-flex;
635
+ align-items: center;
636
+ justify-content: center;
637
+ width: 24px;
638
+ height: 24px;
639
+ border-radius: 0.25rem;
640
+ border: none;
641
+ background: none;
642
+ cursor: pointer;
643
+ opacity: 0.7;
644
+ color: var(--rc-text-secondary);
645
+ transition: opacity 0.2s ease, color 0.2s ease;
646
+ }
647
+ ._1ro2sxg6:hover {
648
+ opacity: 1;
649
+ color: var(--rc-text);
650
+ }
651
+ ._1ro2sxg6:focus-visible {
652
+ outline: none;
653
+ box-shadow: 0 0 0 2px var(--rc-bg), 0 0 0 4px var(--rc-text-secondary);
654
+ }
655
+ ._1ro2sxg6:disabled {
656
+ pointer-events: none;
657
+ opacity: 0.5;
658
+ }
659
+ ._1ro2sxg6 svg {
660
+ width: 16px;
661
+ height: 16px;
662
+ pointer-events: none;
663
+ flex-shrink: 0;
664
+ }
665
+ ._1ro2sxg7 {
666
+ display: flex;
667
+ flex-direction: column;
668
+ gap: 0.375rem;
669
+ text-align: center;
670
+ }
671
+ ._1ro2sxg8 {
672
+ display: flex;
673
+ flex-direction: column-reverse;
674
+ gap: 0.5rem;
675
+ padding-top: 0.25rem;
676
+ }
677
+ ._1ro2sxg9 {
678
+ font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
679
+ font-size: 1.125rem;
680
+ font-weight: 600;
681
+ line-height: 1.33;
682
+ letter-spacing: -0.015em;
683
+ color: var(--rc-text);
684
+ }
685
+ ._1ro2sxga {
686
+ font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
687
+ font-size: 0.875rem;
688
+ line-height: 1.43;
689
+ color: var(--rc-text-secondary);
690
+ }
691
+ @media (min-width: 640px) {
692
+ ._1ro2sxg5 {
693
+ max-width: 28rem;
694
+ }
695
+ ._1ro2sxg7 {
696
+ text-align: left;
697
+ }
698
+ ._1ro2sxg8 {
699
+ flex-direction: row;
700
+ justify-content: flex-end;
701
+ }
702
+ }._1zzxeo0 {
703
+ min-width: 8rem;
704
+ border-radius: 0.5rem;
705
+ padding: 0.25rem;
706
+ background-color: var(--rc-bg);
707
+ box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);
708
+ outline: none;
709
+ border: 1px solid var(--rc-border);
710
+ z-index: 50;
711
+ max-height: var(--available-height);
712
+ overflow-y: auto;
713
+ transform-origin: var(--transform-origin);
714
+ transition: opacity 100ms, transform 100ms;
715
+ }
716
+ ._1zzxeo0[data-open] {
717
+ opacity: 1;
718
+ transform: scale(1);
719
+ }
720
+ ._1zzxeo0[data-closed] {
721
+ opacity: 0;
722
+ transform: scale(0.95);
723
+ }
724
+ ._1zzxeo1 {
725
+ display: flex;
726
+ align-items: center;
727
+ gap: 0.375rem;
728
+ border-radius: 0.375rem;
729
+ padding: 0.25rem 0.375rem;
730
+ font-size: 0.875rem;
731
+ line-height: 1.25rem;
732
+ outline: none;
733
+ user-select: none;
734
+ cursor: default;
735
+ color: var(--rc-text);
736
+ }
737
+ ._1zzxeo1[data-highlighted] {
738
+ background-color: color-mix(in srgb, var(--rc-text) 4%, transparent);
739
+ }
740
+ ._1zzxeo1[data-disabled] {
741
+ opacity: 0.5;
742
+ pointer-events: none;
743
+ }
744
+ ._1zzxeo1 svg {
745
+ pointer-events: none;
746
+ flex-shrink: 0;
747
+ width: 16px;
748
+ height: 16px;
749
+ }
750
+ ._1zzxeo2 {
751
+ height: 1px;
752
+ background-color: var(--rc-border);
753
+ margin: 0.25rem -0.25rem;
754
+ }
755
+ ._1zzxeo3 {
756
+ font-size: 0.75rem;
757
+ font-weight: 500;
758
+ color: var(--rc-text-secondary);
759
+ padding: 0.25rem 0.375rem;
760
+ }
761
+ ._1zzxeo4 {
762
+ display: inline-flex;
763
+ align-items: center;
764
+ justify-content: center;
765
+ width: 16px;
766
+ height: 16px;
767
+ flex-shrink: 0;
768
+ }
769
+ ._1zzxeo5 {
770
+ display: inline-flex;
771
+ align-items: center;
772
+ justify-content: center;
773
+ width: 16px;
774
+ height: 16px;
775
+ flex-shrink: 0;
776
+ }._1ukrcxs0 {
777
+ position: relative;
778
+ display: inline-flex;
779
+ align-items: center;
780
+ border-radius: 0.5rem;
781
+ background-color: var(--rc-bg-secondary);
782
+ padding: 0.25rem;
783
+ }
784
+ ._1ukrcxs1 {
785
+ width: 100%;
786
+ }
787
+ ._1ukrcxs2 {
788
+ height: 2rem;
789
+ font-size: 0.75rem;
790
+ }
791
+ ._1ukrcxs3 {
792
+ height: 2.5rem;
793
+ font-size: 0.875rem;
794
+ }
795
+ ._1ukrcxs4 {
796
+ position: absolute;
797
+ top: 0.25rem;
798
+ bottom: 0.25rem;
799
+ border-radius: 0.375rem;
800
+ background-color: var(--rc-bg);
801
+ box-shadow: 0 1px 2px 0 rgba(0,0,0,0.05);
802
+ transition: all 300ms cubic-bezier(0.25, 1, 0.5, 1);
803
+ pointer-events: none;
804
+ }
805
+ ._1ukrcxs5 {
806
+ opacity: 0;
807
+ }
808
+ ._1ukrcxs6 {
809
+ position: relative;
810
+ z-index: 10;
811
+ display: flex;
812
+ align-items: center;
813
+ justify-content: center;
814
+ white-space: nowrap;
815
+ border-radius: 0.375rem;
816
+ font-weight: 500;
817
+ outline: none;
818
+ border: none;
819
+ background: transparent;
820
+ cursor: pointer;
821
+ transition: color 200ms;
822
+ color: var(--rc-text-secondary);
823
+ }
824
+ ._1ukrcxs6:focus-visible {
825
+ outline: 2px solid var(--rc-accent);
826
+ outline-offset: 1px;
827
+ }
828
+ ._1ukrcxs7 {
829
+ color: var(--rc-text);
830
+ }
831
+ ._1ukrcxs8 {
832
+ pointer-events: none;
833
+ opacity: 0.4;
834
+ }
835
+ ._1ukrcxs9 {
836
+ flex: 1;
837
+ }
838
+ ._1ukrcxsa {
839
+ padding: 0 0.75rem;
840
+ }
841
+ ._1ukrcxsb {
842
+ padding: 0 1rem;
843
+ }@keyframes hwdcp10 {
844
+ from {
845
+ opacity: 0;
846
+ transform: translateY(2px);
847
+ }
848
+ to {
849
+ opacity: 1;
850
+ transform: translateY(0);
851
+ }
852
+ }
853
+ @keyframes hwdcp11 {
854
+ from {
855
+ opacity: 1;
856
+ transform: translateY(0);
857
+ }
858
+ to {
859
+ opacity: 0;
860
+ transform: translateY(2px);
861
+ }
862
+ }
863
+ .hwdcp12 {
864
+ z-index: 50;
865
+ max-width: 320px;
866
+ padding: 6px 10px;
867
+ font-size: var(--rc-font-size-small);
868
+ line-height: 1.4;
869
+ color: var(--rc-text);
870
+ background-color: var(--rc-bg);
871
+ border: 1px solid var(--rc-border);
872
+ border-radius: var(--rc-radius-md);
873
+ box-shadow: 0 1px 3px rgba(0,0,0,0.06);
874
+ outline: none;
875
+ white-space: normal;
876
+ word-break: break-word;
877
+ pointer-events: none;
878
+ transition: opacity 120ms ease-out, transform 120ms ease-out;
879
+ }
880
+ .hwdcp12[data-open] {
881
+ animation: hwdcp10 120ms ease-out;
882
+ }
883
+ .hwdcp12[data-ending-style] {
884
+ opacity: 0;
885
+ transform: translateY(2px);
886
+ }
887
+ .hwdcp12[data-closed] {
888
+ animation: hwdcp11 120ms ease-in;
889
+ }