@superlogic/spree-pay 0.1.5 → 0.1.7

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 (7) hide show
  1. package/README.md +1 -1
  2. package/build/index.cjs +402 -6054
  3. package/build/index.css +530 -2147
  4. package/build/index.d.cts +1 -0
  5. package/build/index.d.ts +1 -0
  6. package/build/index.js +429 -6081
  7. package/package.json +28 -9
package/build/index.css CHANGED
@@ -1,9 +1,9 @@
1
- /* src/styles/globals.css */
1
+ /* src/index.css */
2
2
  @layer properties;
3
3
  @layer theme, base, components, utilities;
4
4
  @layer theme {
5
- :root,
6
- :host {
5
+ .sl-spreepay,
6
+ .sl-spreepay :host {
7
7
  --font-sans:
8
8
  ui-sans-serif,
9
9
  system-ui,
@@ -24,32 +24,24 @@
24
24
  --color-red-500: oklch(63.7% 0.237 25.331);
25
25
  --color-gray-100: oklch(96.7% 0.003 264.542);
26
26
  --color-gray-200: oklch(92.8% 0.006 264.531);
27
- --color-gray-300: oklch(87.2% 0.01 258.338);
28
- --color-gray-900: oklch(21% 0.034 264.665);
29
27
  --color-black: #000;
30
28
  --color-white: #fff;
31
29
  --spacing: 0.25rem;
32
- --container-sm: 24rem;
33
30
  --container-lg: 32rem;
34
31
  --text-xs: 0.75rem;
35
32
  --text-xs--line-height: calc(1 / 0.75);
36
33
  --text-sm: 0.875rem;
37
34
  --text-sm--line-height: calc(1.25 / 0.875);
38
- --text-base: 1rem;
39
- --text-base--line-height: calc(1.5 / 1);
40
35
  --text-lg: 1.125rem;
41
36
  --text-lg--line-height: calc(1.75 / 1.125);
42
37
  --text-xl: 1.25rem;
43
38
  --text-xl--line-height: calc(1.75 / 1.25);
44
39
  --text-2xl: 1.5rem;
45
40
  --text-2xl--line-height: calc(2 / 1.5);
46
- --font-weight-normal: 400;
47
41
  --font-weight-medium: 500;
48
42
  --font-weight-semibold: 600;
49
- --tracking-widest: 0.1em;
50
43
  --radius-xs: 0.125rem;
51
44
  --radius-2xl: 1rem;
52
- --animate-spin: spin 1s linear infinite;
53
45
  --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
54
46
  --default-transition-duration: 150ms;
55
47
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -58,18 +50,18 @@
58
50
  }
59
51
  }
60
52
  @layer base {
61
- *,
62
- ::after,
63
- ::before,
64
- ::backdrop,
65
- ::file-selector-button {
53
+ .sl-spreepay *,
54
+ .sl-spreepay ::after,
55
+ .sl-spreepay ::before,
56
+ .sl-spreepay ::backdrop,
57
+ .sl-spreepay ::file-selector-button {
66
58
  box-sizing: border-box;
67
59
  margin: 0;
68
60
  padding: 0;
69
61
  border: 0 solid;
70
62
  }
71
- html,
72
- :host {
63
+ .sl-spreepay,
64
+ .sl-spreepay :host {
73
65
  line-height: 1.5;
74
66
  -webkit-text-size-adjust: 100%;
75
67
  tab-size: 4;
@@ -78,99 +70,99 @@
78
70
  font-variation-settings: var(--default-font-variation-settings, normal);
79
71
  -webkit-tap-highlight-color: transparent;
80
72
  }
81
- hr {
73
+ .sl-spreepay hr {
82
74
  height: 0;
83
75
  color: inherit;
84
76
  border-top-width: 1px;
85
77
  }
86
- abbr:where([title]) {
78
+ .sl-spreepay abbr:where([title]) {
87
79
  -webkit-text-decoration: underline dotted;
88
80
  text-decoration: underline dotted;
89
81
  }
90
- h1,
91
- h2,
92
- h3,
93
- h4,
94
- h5,
95
- h6 {
82
+ .sl-spreepay h1,
83
+ .sl-spreepay h2,
84
+ .sl-spreepay h3,
85
+ .sl-spreepay h4,
86
+ .sl-spreepay h5,
87
+ .sl-spreepay h6 {
96
88
  font-size: inherit;
97
89
  font-weight: inherit;
98
90
  }
99
- a {
91
+ .sl-spreepay a {
100
92
  color: inherit;
101
93
  -webkit-text-decoration: inherit;
102
94
  text-decoration: inherit;
103
95
  }
104
- b,
105
- strong {
96
+ .sl-spreepay b,
97
+ .sl-spreepay strong {
106
98
  font-weight: bolder;
107
99
  }
108
- code,
109
- kbd,
110
- samp,
111
- pre {
100
+ .sl-spreepay code,
101
+ .sl-spreepay kbd,
102
+ .sl-spreepay samp,
103
+ .sl-spreepay pre {
112
104
  font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
113
105
  font-feature-settings: var(--default-mono-font-feature-settings, normal);
114
106
  font-variation-settings: var(--default-mono-font-variation-settings, normal);
115
107
  font-size: 1em;
116
108
  }
117
- small {
109
+ .sl-spreepay small {
118
110
  font-size: 80%;
119
111
  }
120
- sub,
121
- sup {
112
+ .sl-spreepay sub,
113
+ .sl-spreepay sup {
122
114
  font-size: 75%;
123
115
  line-height: 0;
124
116
  position: relative;
125
117
  vertical-align: baseline;
126
118
  }
127
- sub {
119
+ .sl-spreepay sub {
128
120
  bottom: -0.25em;
129
121
  }
130
- sup {
122
+ .sl-spreepay sup {
131
123
  top: -0.5em;
132
124
  }
133
- table {
125
+ .sl-spreepay table {
134
126
  text-indent: 0;
135
127
  border-color: inherit;
136
128
  border-collapse: collapse;
137
129
  }
138
- :-moz-focusring {
130
+ .sl-spreepay :-moz-focusring {
139
131
  outline: auto;
140
132
  }
141
- progress {
133
+ .sl-spreepay progress {
142
134
  vertical-align: baseline;
143
135
  }
144
- summary {
136
+ .sl-spreepay summary {
145
137
  display: list-item;
146
138
  }
147
- ol,
148
- ul,
149
- menu {
139
+ .sl-spreepay ol,
140
+ .sl-spreepay ul,
141
+ .sl-spreepay menu {
150
142
  list-style: none;
151
143
  }
152
- img,
153
- svg,
154
- video,
155
- canvas,
156
- audio,
157
- iframe,
158
- embed,
159
- object {
144
+ .sl-spreepay img,
145
+ .sl-spreepay svg,
146
+ .sl-spreepay video,
147
+ .sl-spreepay canvas,
148
+ .sl-spreepay audio,
149
+ .sl-spreepay iframe,
150
+ .sl-spreepay embed,
151
+ .sl-spreepay object {
160
152
  display: block;
161
153
  vertical-align: middle;
162
154
  }
163
- img,
164
- video {
155
+ .sl-spreepay img,
156
+ .sl-spreepay video {
165
157
  max-width: 100%;
166
158
  height: auto;
167
159
  }
168
- button,
169
- input,
170
- select,
171
- optgroup,
172
- textarea,
173
- ::file-selector-button {
160
+ .sl-spreepay button,
161
+ .sl-spreepay input,
162
+ .sl-spreepay select,
163
+ .sl-spreepay optgroup,
164
+ .sl-spreepay textarea,
165
+ .sl-spreepay ::file-selector-button {
174
166
  font: inherit;
175
167
  font-feature-settings: inherit;
176
168
  font-variation-settings: inherit;
@@ -180,81 +172,74 @@
180
172
  background-color: transparent;
181
173
  opacity: 1;
182
174
  }
183
- :where(select:is([multiple], [size])) optgroup {
175
+ .sl-spreepay :where(select:is([multiple], [size])) optgroup {
184
176
  font-weight: bolder;
185
177
  }
186
- :where(select:is([multiple], [size])) optgroup option {
178
+ .sl-spreepay :where(select:is([multiple], [size])) optgroup option {
187
179
  padding-inline-start: 20px;
188
180
  }
189
- ::file-selector-button {
181
+ .sl-spreepay ::file-selector-button {
190
182
  margin-inline-end: 4px;
191
183
  }
192
- ::placeholder {
184
+ .sl-spreepay ::placeholder {
193
185
  opacity: 1;
194
186
  }
195
187
  @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
196
- ::placeholder {
188
+ .sl-spreepay ::placeholder {
197
189
  color: currentcolor;
198
190
  @supports (color: color-mix(in lab, red, red)) {
199
191
  color: color-mix(in oklab, currentcolor 50%, transparent);
200
192
  }
201
193
  }
202
194
  }
203
- textarea {
195
+ .sl-spreepay textarea {
204
196
  resize: vertical;
205
197
  }
206
- ::-webkit-search-decoration {
198
+ .sl-spreepay ::-webkit-search-decoration {
207
199
  -webkit-appearance: none;
208
200
  }
209
- ::-webkit-date-and-time-value {
201
+ .sl-spreepay ::-webkit-date-and-time-value {
210
202
  min-height: 1lh;
211
203
  text-align: inherit;
212
204
  }
213
- ::-webkit-datetime-edit {
205
+ .sl-spreepay ::-webkit-datetime-edit {
214
206
  display: inline-flex;
215
207
  }
216
- ::-webkit-datetime-edit-fields-wrapper {
208
+ .sl-spreepay ::-webkit-datetime-edit-fields-wrapper {
217
209
  padding: 0;
218
210
  }
219
- ::-webkit-datetime-edit,
220
- ::-webkit-datetime-edit-year-field,
221
- ::-webkit-datetime-edit-month-field,
222
- ::-webkit-datetime-edit-day-field,
223
- ::-webkit-datetime-edit-hour-field,
224
- ::-webkit-datetime-edit-minute-field,
225
- ::-webkit-datetime-edit-second-field,
226
- ::-webkit-datetime-edit-millisecond-field,
227
- ::-webkit-datetime-edit-meridiem-field {
211
+ .sl-spreepay ::-webkit-datetime-edit,
212
+ .sl-spreepay ::-webkit-datetime-edit-year-field,
213
+ .sl-spreepay ::-webkit-datetime-edit-month-field,
214
+ .sl-spreepay ::-webkit-datetime-edit-day-field,
215
+ .sl-spreepay ::-webkit-datetime-edit-hour-field,
216
+ .sl-spreepay ::-webkit-datetime-edit-minute-field,
217
+ .sl-spreepay ::-webkit-datetime-edit-second-field,
218
+ .sl-spreepay ::-webkit-datetime-edit-millisecond-field,
219
+ .sl-spreepay ::-webkit-datetime-edit-meridiem-field {
228
220
  padding-block: 0;
229
221
  }
230
- :-moz-ui-invalid {
222
+ .sl-spreepay :-moz-ui-invalid {
231
223
  box-shadow: none;
232
224
  }
233
- button,
234
- input:where([type=button], [type=reset], [type=submit]),
235
- ::file-selector-button {
225
+ .sl-spreepay button,
226
+ .sl-spreepay input:where([type=button], [type=reset], [type=submit]),
227
+ .sl-spreepay ::file-selector-button {
236
228
  appearance: button;
237
229
  }
238
- ::-webkit-inner-spin-button,
239
- ::-webkit-outer-spin-button {
230
+ .sl-spreepay ::-webkit-inner-spin-button,
231
+ .sl-spreepay ::-webkit-outer-spin-button {
240
232
  height: auto;
241
233
  }
242
- [hidden]:where(:not([hidden=until-found])) {
234
+ .sl-spreepay [hidden]:where(:not([hidden=until-found])) {
243
235
  display: none !important;
244
236
  }
245
237
  }
246
238
  @layer utilities {
247
- .\@container\/card-header {
248
- container-type: inline-size;
249
- container-name: card-header;
250
- }
251
- .pointer-events-none {
239
+ .sl-spreepay .pointer-events-none {
252
240
  pointer-events: none;
253
241
  }
254
- .invisible {
255
- visibility: hidden;
256
- }
257
- .sr-only {
242
+ .sl-spreepay .sr-only {
258
243
  position: absolute;
259
244
  width: 1px;
260
245
  height: 1px;
@@ -265,871 +250,521 @@
265
250
  white-space: nowrap;
266
251
  border-width: 0;
267
252
  }
268
- .absolute {
253
+ .sl-spreepay .absolute {
269
254
  position: absolute;
270
255
  }
271
- .fixed {
256
+ .sl-spreepay .fixed {
272
257
  position: fixed;
273
258
  }
274
- .relative {
275
- position: relative;
276
- }
277
- .inset-0 {
259
+ .sl-spreepay .inset-0 {
278
260
  inset: calc(var(--spacing) * 0);
279
261
  }
280
- .inset-x-0 {
281
- inset-inline: calc(var(--spacing) * 0);
282
- }
283
- .top-0 {
284
- top: calc(var(--spacing) * 0);
285
- }
286
- .top-4 {
262
+ .sl-spreepay .top-4 {
287
263
  top: calc(var(--spacing) * 4);
288
264
  }
289
- .top-\[1px\] {
290
- top: 1px;
291
- }
292
- .top-\[50\%\] {
265
+ .sl-spreepay .top-\[50\%\] {
293
266
  top: 50%;
294
267
  }
295
- .top-\[60\%\] {
296
- top: 60%;
297
- }
298
- .top-full {
299
- top: 100%;
300
- }
301
- .right-2 {
302
- right: calc(var(--spacing) * 2);
303
- }
304
- .right-4 {
268
+ .sl-spreepay .right-4 {
305
269
  right: calc(var(--spacing) * 4);
306
270
  }
307
- .left-0 {
308
- left: calc(var(--spacing) * 0);
309
- }
310
- .left-2 {
311
- left: calc(var(--spacing) * 2);
312
- }
313
- .left-\[50\%\] {
271
+ .sl-spreepay .left-\[50\%\] {
314
272
  left: 50%;
315
273
  }
316
- .isolate {
317
- isolation: isolate;
318
- }
319
- .z-50 {
274
+ .sl-spreepay .z-50 {
320
275
  z-index: 50;
321
276
  }
322
- .z-\[1\] {
323
- z-index: 1;
324
- }
325
- .col-start-2 {
326
- grid-column-start: 2;
327
- }
328
- .row-span-2 {
329
- grid-row: span 2 / span 2;
330
- }
331
- .row-start-1 {
332
- grid-row-start: 1;
333
- }
334
- .-mx-1 {
335
- margin-inline: calc(var(--spacing) * -1);
336
- }
337
- .mx-auto {
338
- margin-inline: auto;
277
+ .sl-spreepay .container {
278
+ width: 100%;
279
+ @media (width >= 40rem) {
280
+ max-width: 40rem;
281
+ }
282
+ @media (width >= 48rem) {
283
+ max-width: 48rem;
284
+ }
285
+ @media (width >= 64rem) {
286
+ max-width: 64rem;
287
+ }
288
+ @media (width >= 80rem) {
289
+ max-width: 80rem;
290
+ }
291
+ @media (width >= 96rem) {
292
+ max-width: 96rem;
293
+ }
339
294
  }
340
- .my-1 {
295
+ .sl-spreepay .my-1 {
341
296
  margin-block: calc(var(--spacing) * 1);
342
297
  }
343
- .mt-1 {
298
+ .sl-spreepay .mt-1 {
344
299
  margin-top: calc(var(--spacing) * 1);
345
300
  }
346
- .mt-1\.5 {
347
- margin-top: calc(var(--spacing) * 1.5);
348
- }
349
- .mt-2 {
350
- margin-top: calc(var(--spacing) * 2);
351
- }
352
- .mt-4 {
301
+ .sl-spreepay .mt-4 {
353
302
  margin-top: calc(var(--spacing) * 4);
354
303
  }
355
- .mt-auto {
356
- margin-top: auto;
357
- }
358
- .-mr-2 {
304
+ .sl-spreepay .-mr-2 {
359
305
  margin-right: calc(var(--spacing) * -2);
360
306
  }
361
- .mr-1 {
307
+ .sl-spreepay .mr-1 {
362
308
  margin-right: calc(var(--spacing) * 1);
363
309
  }
364
- .mb-4 {
310
+ .sl-spreepay .mb-4 {
365
311
  margin-bottom: calc(var(--spacing) * 4);
366
312
  }
367
- .-ml-2\.5 {
313
+ .sl-spreepay .-ml-2\.5 {
368
314
  margin-left: calc(var(--spacing) * -2.5);
369
315
  }
370
- .ml-1 {
371
- margin-left: calc(var(--spacing) * 1);
372
- }
373
- .ml-auto {
374
- margin-left: auto;
375
- }
376
- .block {
316
+ .sl-spreepay .block {
377
317
  display: block;
378
318
  }
379
- .flex {
319
+ .sl-spreepay .flex {
380
320
  display: flex;
381
321
  }
382
- .grid {
322
+ .sl-spreepay .grid {
383
323
  display: grid;
384
324
  }
385
- .hidden {
325
+ .sl-spreepay .hidden {
386
326
  display: none;
387
327
  }
388
- .inline-flex {
328
+ .sl-spreepay .inline-flex {
389
329
  display: inline-flex;
390
330
  }
391
- .table {
392
- display: table;
393
- }
394
- .aspect-square {
395
- aspect-ratio: 1 / 1;
396
- }
397
- .size-\(--cell-size\) {
398
- width: var(--cell-size);
399
- height: var(--cell-size);
400
- }
401
- .size-2 {
402
- width: calc(var(--spacing) * 2);
403
- height: calc(var(--spacing) * 2);
404
- }
405
- .size-3 {
406
- width: calc(var(--spacing) * 3);
407
- height: calc(var(--spacing) * 3);
408
- }
409
- .size-3\.5 {
331
+ .sl-spreepay .size-3\.5 {
410
332
  width: calc(var(--spacing) * 3.5);
411
333
  height: calc(var(--spacing) * 3.5);
412
334
  }
413
- .size-4 {
335
+ .sl-spreepay .size-4 {
414
336
  width: calc(var(--spacing) * 4);
415
337
  height: calc(var(--spacing) * 4);
416
338
  }
417
- .size-6 {
418
- width: calc(var(--spacing) * 6);
419
- height: calc(var(--spacing) * 6);
420
- }
421
- .size-8 {
422
- width: calc(var(--spacing) * 8);
423
- height: calc(var(--spacing) * 8);
424
- }
425
- .size-9 {
339
+ .sl-spreepay .size-9 {
426
340
  width: calc(var(--spacing) * 9);
427
341
  height: calc(var(--spacing) * 9);
428
342
  }
429
- .size-12 {
430
- width: calc(var(--spacing) * 12);
431
- height: calc(var(--spacing) * 12);
432
- }
433
- .size-16 {
434
- width: calc(var(--spacing) * 16);
435
- height: calc(var(--spacing) * 16);
436
- }
437
- .size-auto {
438
- width: auto;
439
- height: auto;
440
- }
441
- .h-\(--cell-size\) {
442
- height: var(--cell-size);
443
- }
444
- .h-1\.5 {
445
- height: calc(var(--spacing) * 1.5);
446
- }
447
- .h-2 {
448
- height: calc(var(--spacing) * 2);
449
- }
450
- .h-2\.5 {
343
+ .sl-spreepay .h-2\.5 {
451
344
  height: calc(var(--spacing) * 2.5);
452
345
  }
453
- .h-4 {
346
+ .sl-spreepay .h-4 {
454
347
  height: calc(var(--spacing) * 4);
455
348
  }
456
- .h-5 {
349
+ .sl-spreepay .h-5 {
457
350
  height: calc(var(--spacing) * 5);
458
351
  }
459
- .h-6 {
352
+ .sl-spreepay .h-6 {
460
353
  height: calc(var(--spacing) * 6);
461
354
  }
462
- .h-8 {
355
+ .sl-spreepay .h-8 {
463
356
  height: calc(var(--spacing) * 8);
464
357
  }
465
- .h-9 {
358
+ .sl-spreepay .h-9 {
466
359
  height: calc(var(--spacing) * 9);
467
360
  }
468
- .h-10 {
361
+ .sl-spreepay .h-10 {
469
362
  height: calc(var(--spacing) * 10);
470
363
  }
471
- .h-11 {
364
+ .sl-spreepay .h-11 {
472
365
  height: calc(var(--spacing) * 11);
473
366
  }
474
- .h-15 {
367
+ .sl-spreepay .h-15 {
475
368
  height: calc(var(--spacing) * 15);
476
369
  }
477
- .h-\[1\.15rem\] {
478
- height: 1.15rem;
479
- }
480
- .h-\[34px\] {
370
+ .sl-spreepay .h-\[34px\] {
481
371
  height: 34px;
482
372
  }
483
- .h-\[500px\] {
373
+ .sl-spreepay .h-\[500px\] {
484
374
  height: 500px;
485
375
  }
486
- .h-\[calc\(100\%-1px\)\] {
487
- height: calc(100% - 1px);
488
- }
489
- .h-\[var\(--radix-navigation-menu-viewport-height\)\] {
490
- height: var(--radix-navigation-menu-viewport-height);
491
- }
492
- .h-\[var\(--radix-select-trigger-height\)\] {
493
- height: var(--radix-select-trigger-height);
494
- }
495
- .h-auto {
496
- height: auto;
497
- }
498
- .h-full {
499
- height: 100%;
500
- }
501
- .h-px {
502
- height: 1px;
503
- }
504
- .max-h-\(--radix-dropdown-menu-content-available-height\) {
505
- max-height: var(--radix-dropdown-menu-content-available-height);
506
- }
507
- .max-h-\(--radix-select-content-available-height\) {
508
- max-height: var(--radix-select-content-available-height);
509
- }
510
- .max-h-\[600px\] {
376
+ .sl-spreepay .max-h-\[600px\] {
511
377
  max-height: 600px;
512
378
  }
513
- .w-\(--cell-size\) {
514
- width: var(--cell-size);
515
- }
516
- .w-2 {
517
- width: calc(var(--spacing) * 2);
518
- }
519
- .w-2\.5 {
379
+ .sl-spreepay .w-2\.5 {
520
380
  width: calc(var(--spacing) * 2.5);
521
381
  }
522
- .w-5 {
382
+ .sl-spreepay .w-5 {
523
383
  width: calc(var(--spacing) * 5);
524
384
  }
525
- .w-6 {
385
+ .sl-spreepay .w-6 {
526
386
  width: calc(var(--spacing) * 6);
527
387
  }
528
- .w-8 {
388
+ .sl-spreepay .w-8 {
529
389
  width: calc(var(--spacing) * 8);
530
390
  }
531
- .w-11 {
532
- width: calc(var(--spacing) * 11);
533
- }
534
- .w-72 {
535
- width: calc(var(--spacing) * 72);
391
+ .sl-spreepay .w-9 {
392
+ width: calc(var(--spacing) * 9);
536
393
  }
537
- .w-\[100px\] {
538
- width: 100px;
394
+ .sl-spreepay .w-11 {
395
+ width: calc(var(--spacing) * 11);
539
396
  }
540
- .w-\[132px\] {
397
+ .sl-spreepay .w-\[132px\] {
541
398
  width: 132px;
542
399
  }
543
- .w-fit {
544
- width: fit-content;
545
- }
546
- .w-full {
400
+ .sl-spreepay .w-full {
547
401
  width: 100%;
548
402
  }
549
- .w-max {
550
- width: max-content;
551
- }
552
- .max-w-\[680px\] {
403
+ .sl-spreepay .max-w-\[680px\] {
553
404
  max-width: 680px;
554
405
  }
555
- .max-w-\[calc\(100\%-2rem\)\] {
406
+ .sl-spreepay .max-w-\[calc\(100\%-2rem\)\] {
556
407
  max-width: calc(100% - 2rem);
557
408
  }
558
- .max-w-max {
559
- max-width: max-content;
560
- }
561
- .min-w-\(--cell-size\) {
562
- min-width: var(--cell-size);
563
- }
564
- .min-w-0 {
565
- min-width: calc(var(--spacing) * 0);
566
- }
567
- .min-w-\[8rem\] {
568
- min-width: 8rem;
569
- }
570
- .min-w-\[var\(--radix-select-trigger-width\)\] {
571
- min-width: var(--radix-select-trigger-width);
572
- }
573
- .flex-1 {
574
- flex: 1;
575
- }
576
- .flex-shrink-0 {
409
+ .sl-spreepay .flex-shrink-0 {
577
410
  flex-shrink: 0;
578
411
  }
579
- .shrink-0 {
412
+ .sl-spreepay .shrink-0 {
580
413
  flex-shrink: 0;
581
414
  }
582
- .grow {
583
- flex-grow: 1;
584
- }
585
- .border-collapse {
586
- border-collapse: collapse;
587
- }
588
- .origin-\(--radix-dropdown-menu-content-transform-origin\) {
589
- transform-origin: var(--radix-dropdown-menu-content-transform-origin);
590
- }
591
- .origin-\(--radix-popover-content-transform-origin\) {
592
- transform-origin: var(--radix-popover-content-transform-origin);
593
- }
594
- .origin-\(--radix-select-content-transform-origin\) {
595
- transform-origin: var(--radix-select-content-transform-origin);
596
- }
597
- .translate-x-\[-50\%\] {
415
+ .sl-spreepay .translate-x-\[-50\%\] {
598
416
  --tw-translate-x: -50%;
599
417
  translate: var(--tw-translate-x) var(--tw-translate-y);
600
418
  }
601
- .translate-y-0\.5 {
602
- --tw-translate-y: calc(var(--spacing) * 0.5);
603
- translate: var(--tw-translate-x) var(--tw-translate-y);
604
- }
605
- .translate-y-\[-50\%\] {
419
+ .sl-spreepay .translate-y-\[-50\%\] {
606
420
  --tw-translate-y: -50%;
607
421
  translate: var(--tw-translate-x) var(--tw-translate-y);
608
422
  }
609
- .rotate-45 {
610
- rotate: 45deg;
611
- }
612
- .animate-pulse {
423
+ .sl-spreepay .animate-pulse {
613
424
  animation: var(--animate-pulse);
614
425
  }
615
- .animate-spin {
616
- animation: var(--animate-spin);
617
- }
618
- .cursor-default {
619
- cursor: default;
620
- }
621
- .cursor-pointer {
426
+ .sl-spreepay .cursor-pointer {
622
427
  cursor: pointer;
623
428
  }
624
- .touch-none {
625
- touch-action: none;
626
- }
627
- .scroll-my-1 {
628
- scroll-margin-block: calc(var(--spacing) * 1);
629
- }
630
- .list-none {
631
- list-style-type: none;
632
- }
633
- .auto-rows-min {
634
- grid-auto-rows: min-content;
635
- }
636
- .grid-rows-\[auto_auto\] {
637
- grid-template-rows: auto auto;
638
- }
639
- .flex-col {
429
+ .sl-spreepay .flex-col {
640
430
  flex-direction: column;
641
431
  }
642
- .flex-col-reverse {
432
+ .sl-spreepay .flex-col-reverse {
643
433
  flex-direction: column-reverse;
644
434
  }
645
- .items-baseline {
435
+ .sl-spreepay .items-baseline {
646
436
  align-items: baseline;
647
437
  }
648
- .items-center {
438
+ .sl-spreepay .items-center {
649
439
  align-items: center;
650
440
  }
651
- .items-end {
652
- align-items: flex-end;
653
- }
654
- .items-start {
655
- align-items: flex-start;
656
- }
657
- .justify-between {
441
+ .sl-spreepay .justify-between {
658
442
  justify-content: space-between;
659
443
  }
660
- .justify-center {
444
+ .sl-spreepay .justify-center {
661
445
  justify-content: center;
662
446
  }
663
- .justify-end {
447
+ .sl-spreepay .justify-end {
664
448
  justify-content: flex-end;
665
449
  }
666
- .gap-0 {
450
+ .sl-spreepay .gap-0 {
667
451
  gap: calc(var(--spacing) * 0);
668
452
  }
669
- .gap-0\.5 {
670
- gap: calc(var(--spacing) * 0.5);
671
- }
672
- .gap-1 {
453
+ .sl-spreepay .gap-1 {
673
454
  gap: calc(var(--spacing) * 1);
674
455
  }
675
- .gap-1\.5 {
456
+ .sl-spreepay .gap-1\.5 {
676
457
  gap: calc(var(--spacing) * 1.5);
677
458
  }
678
- .gap-2 {
459
+ .sl-spreepay .gap-2 {
679
460
  gap: calc(var(--spacing) * 2);
680
461
  }
681
- .gap-3 {
462
+ .sl-spreepay .gap-3 {
682
463
  gap: calc(var(--spacing) * 3);
683
464
  }
684
- .gap-4 {
465
+ .sl-spreepay .gap-4 {
685
466
  gap: calc(var(--spacing) * 4);
686
467
  }
687
- .gap-6 {
468
+ .sl-spreepay .gap-6 {
688
469
  gap: calc(var(--spacing) * 6);
689
470
  }
690
- .self-start {
691
- align-self: flex-start;
692
- }
693
- .justify-self-end {
694
- justify-self: flex-end;
695
- }
696
- .overflow-hidden {
471
+ .sl-spreepay .overflow-hidden {
697
472
  overflow: hidden;
698
473
  }
699
- .overflow-x-hidden {
700
- overflow-x: hidden;
701
- }
702
- .overflow-y-auto {
703
- overflow-y: auto;
704
- }
705
- .rounded-2xl {
474
+ .sl-spreepay .rounded-2xl {
706
475
  border-radius: var(--radius-2xl);
707
476
  }
708
- .rounded-\[4px\] {
477
+ .sl-spreepay .rounded-\[4px\] {
709
478
  border-radius: 4px;
710
479
  }
711
- .rounded-\[24px\] {
480
+ .sl-spreepay .rounded-\[24px\] {
712
481
  border-radius: 24px;
713
482
  }
714
- .rounded-full {
483
+ .sl-spreepay .rounded-full {
715
484
  border-radius: calc(infinity * 1px);
716
485
  }
717
- .rounded-lg {
486
+ .sl-spreepay .rounded-lg {
718
487
  border-radius: var(--radius);
719
488
  }
720
- .rounded-md {
489
+ .sl-spreepay .rounded-md {
721
490
  border-radius: calc(var(--radius) - 2px);
722
491
  }
723
- .rounded-none {
724
- border-radius: 0;
725
- }
726
- .rounded-sm {
492
+ .sl-spreepay .rounded-sm {
727
493
  border-radius: calc(var(--radius) - 4px);
728
494
  }
729
- .rounded-xl {
495
+ .sl-spreepay .rounded-xl {
730
496
  border-radius: calc(var(--radius) + 4px);
731
497
  }
732
- .rounded-xs {
498
+ .sl-spreepay .rounded-xs {
733
499
  border-radius: var(--radius-xs);
734
500
  }
735
- .rounded-l-md {
736
- border-top-left-radius: calc(var(--radius) - 2px);
737
- border-bottom-left-radius: calc(var(--radius) - 2px);
738
- }
739
- .rounded-tl-sm {
740
- border-top-left-radius: calc(var(--radius) - 4px);
741
- }
742
- .rounded-r-md {
501
+ .sl-spreepay .rounded-r-md {
743
502
  border-top-right-radius: calc(var(--radius) - 2px);
744
503
  border-bottom-right-radius: calc(var(--radius) - 2px);
745
504
  }
746
- .border {
505
+ .sl-spreepay .border {
747
506
  border-style: var(--tw-border-style);
748
507
  border-width: 1px;
749
508
  }
750
- .border-0 {
509
+ .sl-spreepay .border-0 {
751
510
  border-style: var(--tw-border-style);
752
511
  border-width: 0px;
753
512
  }
754
- .border-1 {
513
+ .sl-spreepay .border-1 {
755
514
  border-style: var(--tw-border-style);
756
515
  border-width: 1px;
757
516
  }
758
- .border-b {
759
- border-bottom-style: var(--tw-border-style);
760
- border-bottom-width: 1px;
761
- }
762
- .border-b-1 {
517
+ .sl-spreepay .border-b-1 {
763
518
  border-bottom-style: var(--tw-border-style);
764
519
  border-bottom-width: 1px;
765
520
  }
766
- .\!border-l-0 {
521
+ .sl-spreepay .\!border-l-0 {
767
522
  border-left-style: var(--tw-border-style) !important;
768
523
  border-left-width: 0px !important;
769
524
  }
770
- .border-\[\#F5F7FA\] {
525
+ .sl-spreepay .border-\[\#F5F7FA\] {
771
526
  border-color: #F5F7FA;
772
527
  }
773
- .border-\[orange\] {
774
- border-color: orange;
775
- }
776
- .border-black {
528
+ .sl-spreepay .border-black {
777
529
  border-color: var(--color-black);
778
530
  }
779
- .border-black\/7 {
531
+ .sl-spreepay .border-black\/7 {
780
532
  border-color: color-mix(in srgb, #000 7%, transparent);
781
533
  @supports (color: color-mix(in lab, red, red)) {
782
534
  border-color: color-mix(in oklab, var(--color-black) 7%, transparent);
783
535
  }
784
536
  }
785
- .border-black\/25 {
537
+ .sl-spreepay .border-black\/25 {
786
538
  border-color: color-mix(in srgb, #000 25%, transparent);
787
539
  @supports (color: color-mix(in lab, red, red)) {
788
540
  border-color: color-mix(in oklab, var(--color-black) 25%, transparent);
789
541
  }
790
542
  }
791
- .border-destructive {
543
+ .sl-spreepay .border-destructive {
792
544
  border-color: var(--destructive);
793
545
  }
794
- .border-input {
546
+ .sl-spreepay .border-input {
795
547
  border-color: var(--input);
796
548
  }
797
- .border-primary {
549
+ .sl-spreepay .border-primary {
798
550
  border-color: var(--primary);
799
551
  }
800
- .border-ring {
552
+ .sl-spreepay .border-ring {
801
553
  border-color: var(--ring);
802
554
  }
803
- .border-transparent {
555
+ .sl-spreepay .border-transparent {
804
556
  border-color: transparent;
805
557
  }
806
- .bg-\[\#F5F7FA\] {
558
+ .sl-spreepay .bg-\[\#F5F7FA\] {
807
559
  background-color: #F5F7FA;
808
560
  }
809
- .bg-accent {
810
- background-color: var(--accent);
811
- }
812
- .bg-background {
561
+ .sl-spreepay .bg-background {
813
562
  background-color: var(--background);
814
563
  }
815
- .bg-black\/4 {
564
+ .sl-spreepay .bg-black\/4 {
816
565
  background-color: color-mix(in srgb, #000 4%, transparent);
817
566
  @supports (color: color-mix(in lab, red, red)) {
818
567
  background-color: color-mix(in oklab, var(--color-black) 4%, transparent);
819
568
  }
820
569
  }
821
- .bg-black\/10 {
570
+ .sl-spreepay .bg-black\/10 {
822
571
  background-color: color-mix(in srgb, #000 10%, transparent);
823
572
  @supports (color: color-mix(in lab, red, red)) {
824
573
  background-color: color-mix(in oklab, var(--color-black) 10%, transparent);
825
574
  }
826
575
  }
827
- .bg-black\/50 {
576
+ .sl-spreepay .bg-black\/50 {
828
577
  background-color: color-mix(in srgb, #000 50%, transparent);
829
578
  @supports (color: color-mix(in lab, red, red)) {
830
579
  background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
831
580
  }
832
581
  }
833
- .bg-border {
834
- background-color: var(--border);
835
- }
836
- .bg-card {
837
- background-color: var(--card);
838
- }
839
- .bg-destructive {
582
+ .sl-spreepay .bg-destructive {
840
583
  background-color: var(--destructive);
841
584
  }
842
- .bg-gray-100 {
585
+ .sl-spreepay .bg-gray-100 {
843
586
  background-color: var(--color-gray-100);
844
587
  }
845
- .bg-gray-200 {
588
+ .sl-spreepay .bg-gray-200 {
846
589
  background-color: var(--color-gray-200);
847
590
  }
848
- .bg-muted {
849
- background-color: var(--muted);
850
- }
851
- .bg-popover {
852
- background-color: var(--popover);
853
- }
854
- .bg-primary {
591
+ .sl-spreepay .bg-primary {
855
592
  background-color: var(--primary);
856
593
  }
857
- .bg-primary\/7 {
594
+ .sl-spreepay .bg-primary\/7 {
858
595
  background-color: var(--primary);
859
596
  @supports (color: color-mix(in lab, red, red)) {
860
597
  background-color: color-mix(in oklab, var(--primary) 7%, transparent);
861
598
  }
862
599
  }
863
- .bg-primary\/8 {
600
+ .sl-spreepay .bg-primary\/8 {
864
601
  background-color: var(--primary);
865
602
  @supports (color: color-mix(in lab, red, red)) {
866
603
  background-color: color-mix(in oklab, var(--primary) 8%, transparent);
867
604
  }
868
605
  }
869
- .bg-secondary {
606
+ .sl-spreepay .bg-secondary {
870
607
  background-color: var(--secondary);
871
608
  }
872
- .bg-transparent {
873
- background-color: transparent;
874
- }
875
- .bg-white {
609
+ .sl-spreepay .bg-white {
876
610
  background-color: var(--color-white);
877
611
  }
878
- .fill-current {
879
- fill: currentcolor;
880
- }
881
- .p-0 {
612
+ .sl-spreepay .p-0 {
882
613
  padding: calc(var(--spacing) * 0);
883
614
  }
884
- .p-1 {
885
- padding: calc(var(--spacing) * 1);
886
- }
887
- .p-2 {
888
- padding: calc(var(--spacing) * 2);
889
- }
890
- .p-3 {
891
- padding: calc(var(--spacing) * 3);
615
+ .sl-spreepay .p-0\.5 {
616
+ padding: calc(var(--spacing) * 0.5);
892
617
  }
893
- .p-4 {
894
- padding: calc(var(--spacing) * 4);
618
+ .sl-spreepay .p-1 {
619
+ padding: calc(var(--spacing) * 1);
895
620
  }
896
- .p-6 {
621
+ .sl-spreepay .p-6 {
897
622
  padding: calc(var(--spacing) * 6);
898
623
  }
899
- .p-\[3px\] {
900
- padding: 3px;
901
- }
902
- .px-\(--cell-size\) {
903
- padding-inline: var(--cell-size);
904
- }
905
- .px-1\.5 {
624
+ .sl-spreepay .px-1\.5 {
906
625
  padding-inline: calc(var(--spacing) * 1.5);
907
626
  }
908
- .px-2 {
909
- padding-inline: calc(var(--spacing) * 2);
910
- }
911
- .px-2\.5 {
627
+ .sl-spreepay .px-2\.5 {
912
628
  padding-inline: calc(var(--spacing) * 2.5);
913
629
  }
914
- .px-3 {
630
+ .sl-spreepay .px-3 {
915
631
  padding-inline: calc(var(--spacing) * 3);
916
632
  }
917
- .px-4 {
633
+ .sl-spreepay .px-4 {
918
634
  padding-inline: calc(var(--spacing) * 4);
919
635
  }
920
- .px-5 {
636
+ .sl-spreepay .px-5 {
921
637
  padding-inline: calc(var(--spacing) * 5);
922
638
  }
923
- .px-6 {
639
+ .sl-spreepay .px-6 {
924
640
  padding-inline: calc(var(--spacing) * 6);
925
641
  }
926
- .px-7 {
642
+ .sl-spreepay .px-7 {
927
643
  padding-inline: calc(var(--spacing) * 7);
928
644
  }
929
- .px-8 {
645
+ .sl-spreepay .px-8 {
930
646
  padding-inline: calc(var(--spacing) * 8);
931
647
  }
932
- .py-0\.5 {
933
- padding-block: calc(var(--spacing) * 0.5);
934
- }
935
- .py-1 {
936
- padding-block: calc(var(--spacing) * 1);
937
- }
938
- .py-1\.5 {
648
+ .sl-spreepay .py-1\.5 {
939
649
  padding-block: calc(var(--spacing) * 1.5);
940
650
  }
941
- .py-2 {
651
+ .sl-spreepay .py-2 {
942
652
  padding-block: calc(var(--spacing) * 2);
943
653
  }
944
- .py-4 {
654
+ .sl-spreepay .py-4 {
945
655
  padding-block: calc(var(--spacing) * 4);
946
656
  }
947
- .py-5 {
657
+ .sl-spreepay .py-5 {
948
658
  padding-block: calc(var(--spacing) * 5);
949
659
  }
950
- .py-6 {
660
+ .sl-spreepay .py-6 {
951
661
  padding-block: calc(var(--spacing) * 6);
952
662
  }
953
- .pt-0 {
954
- padding-top: calc(var(--spacing) * 0);
955
- }
956
- .pt-6 {
663
+ .sl-spreepay .pt-6 {
957
664
  padding-top: calc(var(--spacing) * 6);
958
665
  }
959
- .pr-1 {
960
- padding-right: calc(var(--spacing) * 1);
961
- }
962
- .pr-2 {
963
- padding-right: calc(var(--spacing) * 2);
964
- }
965
- .pr-2\.5 {
966
- padding-right: calc(var(--spacing) * 2.5);
967
- }
968
- .pr-8 {
969
- padding-right: calc(var(--spacing) * 8);
970
- }
971
- .pb-2 {
666
+ .sl-spreepay .pb-2 {
972
667
  padding-bottom: calc(var(--spacing) * 2);
973
668
  }
974
- .pb-4 {
975
- padding-bottom: calc(var(--spacing) * 4);
976
- }
977
- .pl-2 {
978
- padding-left: calc(var(--spacing) * 2);
979
- }
980
- .pl-8 {
981
- padding-left: calc(var(--spacing) * 8);
982
- }
983
- .text-center {
669
+ .sl-spreepay .text-center {
984
670
  text-align: center;
985
671
  }
986
- .text-left {
987
- text-align: left;
988
- }
989
- .text-2xl {
672
+ .sl-spreepay .text-2xl {
990
673
  font-size: var(--text-2xl);
991
674
  line-height: var(--tw-leading, var(--text-2xl--line-height));
992
675
  }
993
- .text-base {
994
- font-size: var(--text-base);
995
- line-height: var(--tw-leading, var(--text-base--line-height));
996
- }
997
- .text-lg {
676
+ .sl-spreepay .text-lg {
998
677
  font-size: var(--text-lg);
999
678
  line-height: var(--tw-leading, var(--text-lg--line-height));
1000
679
  }
1001
- .text-sm {
680
+ .sl-spreepay .text-sm {
1002
681
  font-size: var(--text-sm);
1003
682
  line-height: var(--tw-leading, var(--text-sm--line-height));
1004
683
  }
1005
- .text-xl {
684
+ .sl-spreepay .text-xl {
1006
685
  font-size: var(--text-xl);
1007
686
  line-height: var(--tw-leading, var(--text-xl--line-height));
1008
687
  }
1009
- .text-xs {
688
+ .sl-spreepay .text-xs {
1010
689
  font-size: var(--text-xs);
1011
690
  line-height: var(--tw-leading, var(--text-xs--line-height));
1012
691
  }
1013
- .text-\[0\.8rem\] {
1014
- font-size: 0.8rem;
1015
- }
1016
- .leading-\[1\.3\] {
692
+ .sl-spreepay .leading-\[1\.3\] {
1017
693
  --tw-leading: 1.3;
1018
694
  line-height: 1.3;
1019
695
  }
1020
- .leading-\[1\.7\] {
696
+ .sl-spreepay .leading-\[1\.7\] {
1021
697
  --tw-leading: 1.7;
1022
698
  line-height: 1.7;
1023
699
  }
1024
- .leading-\[34px\] {
700
+ .sl-spreepay .leading-\[34px\] {
1025
701
  --tw-leading: 34px;
1026
702
  line-height: 34px;
1027
703
  }
1028
- .leading-none {
704
+ .sl-spreepay .leading-none {
1029
705
  --tw-leading: 1;
1030
706
  line-height: 1;
1031
707
  }
1032
- .font-medium {
708
+ .sl-spreepay .font-medium {
1033
709
  --tw-font-weight: var(--font-weight-medium);
1034
710
  font-weight: var(--font-weight-medium);
1035
711
  }
1036
- .font-normal {
1037
- --tw-font-weight: var(--font-weight-normal);
1038
- font-weight: var(--font-weight-normal);
1039
- }
1040
- .font-semibold {
712
+ .sl-spreepay .font-semibold {
1041
713
  --tw-font-weight: var(--font-weight-semibold);
1042
714
  font-weight: var(--font-weight-semibold);
1043
715
  }
1044
- .tracking-widest {
1045
- --tw-tracking: var(--tracking-widest);
1046
- letter-spacing: var(--tracking-widest);
1047
- }
1048
- .whitespace-nowrap {
716
+ .sl-spreepay .whitespace-nowrap {
1049
717
  white-space: nowrap;
1050
718
  }
1051
- .text-\[\#798B95\] {
719
+ .sl-spreepay .text-\[\#798B95\] {
1052
720
  color: #798B95;
1053
721
  }
1054
- .text-\[orange\] {
1055
- color: orange;
1056
- }
1057
- .text-accent-foreground {
1058
- color: var(--accent-foreground);
1059
- }
1060
- .text-black {
722
+ .sl-spreepay .text-black {
1061
723
  color: var(--color-black);
1062
724
  }
1063
- .text-black\/50 {
725
+ .sl-spreepay .text-black\/50 {
1064
726
  color: color-mix(in srgb, #000 50%, transparent);
1065
727
  @supports (color: color-mix(in lab, red, red)) {
1066
728
  color: color-mix(in oklab, var(--color-black) 50%, transparent);
1067
729
  }
1068
730
  }
1069
- .text-card-foreground {
1070
- color: var(--card-foreground);
1071
- }
1072
- .text-current {
731
+ .sl-spreepay .text-current {
1073
732
  color: currentcolor;
1074
733
  }
1075
- .text-destructive {
734
+ .sl-spreepay .text-destructive {
1076
735
  color: var(--destructive);
1077
736
  }
1078
- .text-foreground {
1079
- color: var(--foreground);
1080
- }
1081
- .text-gray-300 {
1082
- color: var(--color-gray-300);
1083
- }
1084
- .text-gray-900 {
1085
- color: var(--color-gray-900);
1086
- }
1087
- .text-muted-foreground {
737
+ .sl-spreepay .text-muted-foreground {
1088
738
  color: var(--muted-foreground);
1089
739
  }
1090
- .text-popover-foreground {
1091
- color: var(--popover-foreground);
1092
- }
1093
- .text-primary {
740
+ .sl-spreepay .text-primary {
1094
741
  color: var(--primary);
1095
742
  }
1096
- .text-primary-foreground {
743
+ .sl-spreepay .text-primary-foreground {
1097
744
  color: var(--primary-foreground);
1098
745
  }
1099
- .text-red-500 {
746
+ .sl-spreepay .text-red-500 {
1100
747
  color: var(--color-red-500);
1101
748
  }
1102
- .text-secondary-foreground {
749
+ .sl-spreepay .text-secondary-foreground {
1103
750
  color: var(--secondary-foreground);
1104
751
  }
1105
- .text-white {
752
+ .sl-spreepay .text-white {
1106
753
  color: var(--color-white);
1107
754
  }
1108
- .underline {
755
+ .sl-spreepay .underline {
1109
756
  text-decoration-line: underline;
1110
757
  }
1111
- .underline-offset-4 {
758
+ .sl-spreepay .underline-offset-4 {
1112
759
  text-underline-offset: 4px;
1113
760
  }
1114
- .opacity-0 {
1115
- opacity: 0%;
1116
- }
1117
- .opacity-50 {
761
+ .sl-spreepay .opacity-50 {
1118
762
  opacity: 50%;
1119
763
  }
1120
- .opacity-70 {
764
+ .sl-spreepay .opacity-70 {
1121
765
  opacity: 70%;
1122
766
  }
1123
- .shadow {
1124
- --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1125
- box-shadow:
1126
- var(--tw-inset-shadow),
1127
- var(--tw-inset-ring-shadow),
1128
- var(--tw-ring-offset-shadow),
1129
- var(--tw-ring-shadow),
1130
- var(--tw-shadow);
1131
- }
1132
- .shadow-lg {
767
+ .sl-spreepay .shadow-lg {
1133
768
  --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1134
769
  box-shadow:
1135
770
  var(--tw-inset-shadow),
@@ -1138,25 +773,7 @@
1138
773
  var(--tw-ring-shadow),
1139
774
  var(--tw-shadow);
1140
775
  }
1141
- .shadow-md {
1142
- --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1143
- box-shadow:
1144
- var(--tw-inset-shadow),
1145
- var(--tw-inset-ring-shadow),
1146
- var(--tw-ring-offset-shadow),
1147
- var(--tw-ring-shadow),
1148
- var(--tw-shadow);
1149
- }
1150
- .shadow-sm {
1151
- --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
1152
- box-shadow:
1153
- var(--tw-inset-shadow),
1154
- var(--tw-inset-ring-shadow),
1155
- var(--tw-ring-offset-shadow),
1156
- var(--tw-ring-shadow),
1157
- var(--tw-shadow);
1158
- }
1159
- .shadow-xs {
776
+ .sl-spreepay .shadow-xs {
1160
777
  --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
1161
778
  box-shadow:
1162
779
  var(--tw-inset-shadow),
@@ -1165,17 +782,8 @@
1165
782
  var(--tw-ring-shadow),
1166
783
  var(--tw-shadow);
1167
784
  }
1168
- .ring-0 {
1169
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1170
- box-shadow:
1171
- var(--tw-inset-shadow),
1172
- var(--tw-inset-ring-shadow),
1173
- var(--tw-ring-offset-shadow),
1174
- var(--tw-ring-shadow),
1175
- var(--tw-shadow);
1176
- }
1177
- .ring-\[3px\] {
1178
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
785
+ .sl-spreepay .ring-2 {
786
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1179
787
  box-shadow:
1180
788
  var(--tw-inset-shadow),
1181
789
  var(--tw-inset-ring-shadow),
@@ -1183,77 +791,40 @@
1183
791
  var(--tw-ring-shadow),
1184
792
  var(--tw-shadow);
1185
793
  }
1186
- .ring-ring\/50 {
794
+ .sl-spreepay .ring-ring\/50 {
1187
795
  --tw-ring-color: var(--ring);
1188
796
  @supports (color: color-mix(in lab, red, red)) {
1189
797
  --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
1190
798
  }
1191
799
  }
1192
- .ring-offset-background {
800
+ .sl-spreepay .ring-offset-background {
1193
801
  --tw-ring-offset-color: var(--background);
1194
802
  }
1195
- .outline-hidden {
1196
- --tw-outline-style: none;
1197
- outline-style: none;
1198
- @media (forced-colors: active) {
1199
- outline: 2px solid transparent;
1200
- outline-offset: 2px;
1201
- }
1202
- }
1203
- .outline {
803
+ .sl-spreepay .outline {
1204
804
  outline-style: var(--tw-outline-style);
1205
805
  outline-width: 1px;
1206
806
  }
1207
- .transition {
1208
- transition-property:
1209
- color,
1210
- background-color,
1211
- border-color,
1212
- outline-color,
1213
- text-decoration-color,
1214
- fill,
1215
- stroke,
1216
- --tw-gradient-from,
1217
- --tw-gradient-via,
1218
- --tw-gradient-to,
1219
- opacity,
1220
- box-shadow,
1221
- transform,
1222
- translate,
1223
- scale,
1224
- rotate,
1225
- filter,
1226
- -webkit-backdrop-filter,
1227
- backdrop-filter,
1228
- display,
1229
- visibility,
1230
- content-visibility,
1231
- overlay,
1232
- pointer-events;
1233
- transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1234
- transition-duration: var(--tw-duration, var(--default-transition-duration));
1235
- }
1236
- .transition-\[color\,box-shadow\] {
1237
- transition-property: color, box-shadow;
807
+ .sl-spreepay .transition-\[background-color\,box-shadow\] {
808
+ transition-property: background-color, box-shadow;
1238
809
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1239
810
  transition-duration: var(--tw-duration, var(--default-transition-duration));
1240
811
  }
1241
- .transition-all {
812
+ .sl-spreepay .transition-all {
1242
813
  transition-property: all;
1243
814
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1244
815
  transition-duration: var(--tw-duration, var(--default-transition-duration));
1245
816
  }
1246
- .transition-opacity {
817
+ .sl-spreepay .transition-opacity {
1247
818
  transition-property: opacity;
1248
819
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1249
820
  transition-duration: var(--tw-duration, var(--default-transition-duration));
1250
821
  }
1251
- .transition-shadow {
822
+ .sl-spreepay .transition-shadow {
1252
823
  transition-property: box-shadow;
1253
824
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1254
825
  transition-duration: var(--tw-duration, var(--default-transition-duration));
1255
826
  }
1256
- .transition-transform {
827
+ .sl-spreepay .transition-transform {
1257
828
  transition-property:
1258
829
  transform,
1259
830
  translate,
@@ -1262,131 +833,128 @@
1262
833
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
1263
834
  transition-duration: var(--tw-duration, var(--default-transition-duration));
1264
835
  }
1265
- .transition-none {
836
+ .sl-spreepay .transition-none {
1266
837
  transition-property: none;
1267
838
  }
1268
- .duration-200 {
839
+ .sl-spreepay .duration-200 {
1269
840
  --tw-duration: 200ms;
1270
841
  transition-duration: 200ms;
1271
842
  }
1272
- .duration-300 {
1273
- --tw-duration: 300ms;
1274
- transition-duration: 300ms;
1275
- }
1276
- .outline-none {
843
+ .sl-spreepay .outline-none {
1277
844
  --tw-outline-style: none;
1278
845
  outline-style: none;
1279
846
  }
1280
- .select-none {
847
+ .sl-spreepay .select-none {
1281
848
  -webkit-user-select: none;
1282
849
  user-select: none;
1283
850
  }
1284
- .\[--cell-size\:--spacing\(8\)\] {
1285
- --cell-size: calc(var(--spacing) * 8);
1286
- }
1287
- .group-data-\[disabled\=true\]\:pointer-events-none {
1288
- &:is(:where(.group)[data-disabled=true] *) {
851
+ .sl-spreepay .group-data-\[disabled\=true\]\:pointer-events-none {
852
+ .sl-spreepay &:is(:where(.group)[data-disabled=true] *) {
1289
853
  pointer-events: none;
1290
854
  }
1291
855
  }
1292
- .group-data-\[disabled\=true\]\:opacity-50 {
1293
- &:is(:where(.group)[data-disabled=true] *) {
856
+ .sl-spreepay .group-data-\[disabled\=true\]\:opacity-50 {
857
+ .sl-spreepay &:is(:where(.group)[data-disabled=true] *) {
1294
858
  opacity: 50%;
1295
859
  }
1296
860
  }
1297
- .group-data-\[focused\=true\]\/day\:relative {
1298
- &:is(:where(.group\/day)[data-focused=true] *) {
1299
- position: relative;
1300
- }
1301
- }
1302
- .group-data-\[focused\=true\]\/day\:z-10 {
1303
- &:is(:where(.group\/day)[data-focused=true] *) {
1304
- z-index: 10;
861
+ .sl-spreepay .peer-disabled\:cursor-not-allowed {
862
+ .sl-spreepay &:is(:where(.peer):disabled ~ *) {
863
+ cursor: not-allowed;
1305
864
  }
1306
865
  }
1307
- .group-data-\[focused\=true\]\/day\:border-ring {
1308
- &:is(:where(.group\/day)[data-focused=true] *) {
1309
- border-color: var(--ring);
866
+ .sl-spreepay .peer-disabled\:opacity-50 {
867
+ .sl-spreepay &:is(:where(.peer):disabled ~ *) {
868
+ opacity: 50%;
1310
869
  }
1311
870
  }
1312
- .group-data-\[focused\=true\]\/day\:ring-\[3px\] {
1313
- &:is(:where(.group\/day)[data-focused=true] *) {
1314
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1315
- box-shadow:
1316
- var(--tw-inset-shadow),
1317
- var(--tw-inset-ring-shadow),
1318
- var(--tw-ring-offset-shadow),
1319
- var(--tw-ring-shadow),
1320
- var(--tw-shadow);
871
+ .sl-spreepay .placeholder\:text-muted-foreground {
872
+ .sl-spreepay &::placeholder {
873
+ color: var(--muted-foreground);
1321
874
  }
1322
875
  }
1323
- .group-data-\[focused\=true\]\/day\:ring-ring\/50 {
1324
- &:is(:where(.group\/day)[data-focused=true] *) {
1325
- --tw-ring-color: var(--ring);
1326
- @supports (color: color-mix(in lab, red, red)) {
1327
- --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
876
+ .sl-spreepay .hover\:bg-accent {
877
+ .sl-spreepay &:hover {
878
+ @media (hover: hover) {
879
+ background-color: var(--accent);
1328
880
  }
1329
881
  }
1330
882
  }
1331
- .group-data-\[state\=open\]\:rotate-180 {
1332
- &:is(:where(.group)[data-state=open] *) {
1333
- rotate: 180deg;
1334
- }
1335
- }
1336
- .group-data-\[vaul-drawer-direction\=bottom\]\/drawer-content\:block {
1337
- &:is(:where(.group\/drawer-content)[data-vaul-drawer-direction=bottom] *) {
1338
- display: block;
1339
- }
1340
- }
1341
- .group-data-\[vaul-drawer-direction\=bottom\]\/drawer-content\:text-center {
1342
- &:is(:where(.group\/drawer-content)[data-vaul-drawer-direction=bottom] *) {
1343
- text-align: center;
883
+ .sl-spreepay .hover\:bg-destructive\/90 {
884
+ .sl-spreepay &:hover {
885
+ @media (hover: hover) {
886
+ background-color: var(--destructive);
887
+ @supports (color: color-mix(in lab, red, red)) {
888
+ background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
889
+ }
890
+ }
1344
891
  }
1345
892
  }
1346
- .group-data-\[vaul-drawer-direction\=top\]\/drawer-content\:text-center {
1347
- &:is(:where(.group\/drawer-content)[data-vaul-drawer-direction=top] *) {
1348
- text-align: center;
893
+ .sl-spreepay .hover\:bg-gray-100 {
894
+ .sl-spreepay &:hover {
895
+ @media (hover: hover) {
896
+ background-color: var(--color-gray-100);
897
+ }
1349
898
  }
1350
899
  }
1351
- .group-data-\[viewport\=false\]\/navigation-menu\:top-full {
1352
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
1353
- top: 100%;
900
+ .sl-spreepay .hover\:bg-primary {
901
+ .sl-spreepay &:hover {
902
+ @media (hover: hover) {
903
+ background-color: var(--primary);
904
+ }
1354
905
  }
1355
906
  }
1356
- .group-data-\[viewport\=false\]\/navigation-menu\:mt-1\.5 {
1357
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
1358
- margin-top: calc(var(--spacing) * 1.5);
907
+ .sl-spreepay .hover\:bg-primary\/90 {
908
+ .sl-spreepay &:hover {
909
+ @media (hover: hover) {
910
+ background-color: var(--primary);
911
+ @supports (color: color-mix(in lab, red, red)) {
912
+ background-color: color-mix(in oklab, var(--primary) 90%, transparent);
913
+ }
914
+ }
1359
915
  }
1360
916
  }
1361
- .group-data-\[viewport\=false\]\/navigation-menu\:overflow-hidden {
1362
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
1363
- overflow: hidden;
917
+ .sl-spreepay .hover\:bg-secondary\/80 {
918
+ .sl-spreepay &:hover {
919
+ @media (hover: hover) {
920
+ background-color: var(--secondary);
921
+ @supports (color: color-mix(in lab, red, red)) {
922
+ background-color: color-mix(in oklab, var(--secondary) 80%, transparent);
923
+ }
924
+ }
1364
925
  }
1365
926
  }
1366
- .group-data-\[viewport\=false\]\/navigation-menu\:rounded-md {
1367
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
1368
- border-radius: calc(var(--radius) - 2px);
927
+ .sl-spreepay .hover\:text-accent-foreground {
928
+ .sl-spreepay &:hover {
929
+ @media (hover: hover) {
930
+ color: var(--accent-foreground);
931
+ }
1369
932
  }
1370
933
  }
1371
- .group-data-\[viewport\=false\]\/navigation-menu\:border {
1372
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
1373
- border-style: var(--tw-border-style);
1374
- border-width: 1px;
934
+ .sl-spreepay .hover\:text-white {
935
+ .sl-spreepay &:hover {
936
+ @media (hover: hover) {
937
+ color: var(--color-white);
938
+ }
1375
939
  }
1376
940
  }
1377
- .group-data-\[viewport\=false\]\/navigation-menu\:bg-popover {
1378
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
1379
- background-color: var(--popover);
941
+ .sl-spreepay .hover\:underline {
942
+ .sl-spreepay &:hover {
943
+ @media (hover: hover) {
944
+ text-decoration-line: underline;
945
+ }
1380
946
  }
1381
947
  }
1382
- .group-data-\[viewport\=false\]\/navigation-menu\:text-popover-foreground {
1383
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
1384
- color: var(--popover-foreground);
948
+ .sl-spreepay .hover\:opacity-100 {
949
+ .sl-spreepay &:hover {
950
+ @media (hover: hover) {
951
+ opacity: 100%;
952
+ }
1385
953
  }
1386
954
  }
1387
- .group-data-\[viewport\=false\]\/navigation-menu\:shadow {
1388
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
1389
- --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
955
+ .sl-spreepay .focus\:ring-2 {
956
+ .sl-spreepay &:focus {
957
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1390
958
  box-shadow:
1391
959
  var(--tw-inset-shadow),
1392
960
  var(--tw-inset-ring-shadow),
@@ -1395,1174 +963,268 @@
1395
963
  var(--tw-shadow);
1396
964
  }
1397
965
  }
1398
- .group-data-\[viewport\=false\]\/navigation-menu\:duration-200 {
1399
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
1400
- --tw-duration: 200ms;
1401
- transition-duration: 200ms;
966
+ .sl-spreepay .focus\:ring-ring {
967
+ .sl-spreepay &:focus {
968
+ --tw-ring-color: var(--ring);
1402
969
  }
1403
970
  }
1404
- .peer-disabled\:cursor-not-allowed {
1405
- &:is(:where(.peer):disabled ~ *) {
1406
- cursor: not-allowed;
971
+ .sl-spreepay .focus\:ring-offset-2 {
972
+ .sl-spreepay &:focus {
973
+ --tw-ring-offset-width: 2px;
974
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1407
975
  }
1408
976
  }
1409
- .peer-disabled\:opacity-50 {
1410
- &:is(:where(.peer):disabled ~ *) {
1411
- opacity: 50%;
977
+ .sl-spreepay .focus\:outline-hidden {
978
+ .sl-spreepay &:focus {
979
+ --tw-outline-style: none;
980
+ outline-style: none;
981
+ @media (forced-colors: active) {
982
+ outline: 2px solid transparent;
983
+ outline-offset: 2px;
984
+ }
1412
985
  }
1413
986
  }
1414
- .selection\:bg-primary {
1415
- & *::selection {
1416
- background-color: var(--primary);
1417
- }
1418
- &::selection {
1419
- background-color: var(--primary);
1420
- }
1421
- }
1422
- .selection\:text-primary-foreground {
1423
- & *::selection {
1424
- color: var(--primary-foreground);
1425
- }
1426
- &::selection {
1427
- color: var(--primary-foreground);
1428
- }
1429
- }
1430
- .file\:inline-flex {
1431
- &::file-selector-button {
1432
- display: inline-flex;
1433
- }
1434
- }
1435
- .file\:h-7 {
1436
- &::file-selector-button {
1437
- height: calc(var(--spacing) * 7);
1438
- }
1439
- }
1440
- .file\:border-0 {
1441
- &::file-selector-button {
1442
- border-style: var(--tw-border-style);
1443
- border-width: 0px;
1444
- }
1445
- }
1446
- .file\:bg-transparent {
1447
- &::file-selector-button {
1448
- background-color: transparent;
1449
- }
1450
- }
1451
- .file\:text-sm {
1452
- &::file-selector-button {
1453
- font-size: var(--text-sm);
1454
- line-height: var(--tw-leading, var(--text-sm--line-height));
1455
- }
1456
- }
1457
- .file\:font-medium {
1458
- &::file-selector-button {
1459
- --tw-font-weight: var(--font-weight-medium);
1460
- font-weight: var(--font-weight-medium);
1461
- }
1462
- }
1463
- .file\:text-foreground {
1464
- &::file-selector-button {
1465
- color: var(--foreground);
1466
- }
1467
- }
1468
- .placeholder\:text-muted-foreground {
1469
- &::placeholder {
1470
- color: var(--muted-foreground);
1471
- }
1472
- }
1473
- .last\:border-b-0 {
1474
- &:last-child {
1475
- border-bottom-style: var(--tw-border-style);
1476
- border-bottom-width: 0px;
1477
- }
1478
- }
1479
- .hover\:bg-accent {
1480
- &:hover {
1481
- @media (hover: hover) {
1482
- background-color: var(--accent);
1483
- }
1484
- }
1485
- }
1486
- .hover\:bg-destructive\/90 {
1487
- &:hover {
1488
- @media (hover: hover) {
1489
- background-color: var(--destructive);
1490
- @supports (color: color-mix(in lab, red, red)) {
1491
- background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
1492
- }
1493
- }
1494
- }
1495
- }
1496
- .hover\:bg-gray-100 {
1497
- &:hover {
1498
- @media (hover: hover) {
1499
- background-color: var(--color-gray-100);
1500
- }
1501
- }
1502
- }
1503
- .hover\:bg-primary {
1504
- &:hover {
1505
- @media (hover: hover) {
1506
- background-color: var(--primary);
1507
- }
1508
- }
1509
- }
1510
- .hover\:bg-primary\/90 {
1511
- &:hover {
1512
- @media (hover: hover) {
1513
- background-color: var(--primary);
1514
- @supports (color: color-mix(in lab, red, red)) {
1515
- background-color: color-mix(in oklab, var(--primary) 90%, transparent);
1516
- }
1517
- }
1518
- }
1519
- }
1520
- .hover\:bg-secondary\/80 {
1521
- &:hover {
1522
- @media (hover: hover) {
1523
- background-color: var(--secondary);
1524
- @supports (color: color-mix(in lab, red, red)) {
1525
- background-color: color-mix(in oklab, var(--secondary) 80%, transparent);
1526
- }
1527
- }
1528
- }
1529
- }
1530
- .hover\:text-accent-foreground {
1531
- &:hover {
1532
- @media (hover: hover) {
1533
- color: var(--accent-foreground);
1534
- }
1535
- }
1536
- }
1537
- .hover\:text-white {
1538
- &:hover {
1539
- @media (hover: hover) {
1540
- color: var(--color-white);
1541
- }
1542
- }
1543
- }
1544
- .hover\:underline {
1545
- &:hover {
1546
- @media (hover: hover) {
1547
- text-decoration-line: underline;
1548
- }
1549
- }
1550
- }
1551
- .hover\:opacity-100 {
1552
- &:hover {
1553
- @media (hover: hover) {
1554
- opacity: 100%;
1555
- }
1556
- }
1557
- }
1558
- .hover\:ring-4 {
1559
- &:hover {
1560
- @media (hover: hover) {
1561
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1562
- box-shadow:
1563
- var(--tw-inset-shadow),
1564
- var(--tw-inset-ring-shadow),
1565
- var(--tw-ring-offset-shadow),
1566
- var(--tw-ring-shadow),
1567
- var(--tw-shadow);
1568
- }
1569
- }
1570
- }
1571
- .focus\:bg-accent {
1572
- &:focus {
1573
- background-color: var(--accent);
1574
- }
1575
- }
1576
- .focus\:text-accent-foreground {
1577
- &:focus {
1578
- color: var(--accent-foreground);
1579
- }
1580
- }
1581
- .focus\:ring-2 {
1582
- &:focus {
1583
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1584
- box-shadow:
1585
- var(--tw-inset-shadow),
1586
- var(--tw-inset-ring-shadow),
1587
- var(--tw-ring-offset-shadow),
1588
- var(--tw-ring-shadow),
1589
- var(--tw-shadow);
1590
- }
1591
- }
1592
- .focus\:ring-ring {
1593
- &:focus {
1594
- --tw-ring-color: var(--ring);
1595
- }
1596
- }
1597
- .focus\:ring-offset-2 {
1598
- &:focus {
1599
- --tw-ring-offset-width: 2px;
1600
- --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1601
- }
1602
- }
1603
- .focus\:outline-hidden {
1604
- &:focus {
1605
- --tw-outline-style: none;
1606
- outline-style: none;
1607
- @media (forced-colors: active) {
1608
- outline: 2px solid transparent;
1609
- outline-offset: 2px;
1610
- }
1611
- }
1612
- }
1613
- .focus-visible\:border-ring {
1614
- &:focus-visible {
1615
- border-color: var(--ring);
987
+ .sl-spreepay .focus-visible\:border-ring {
988
+ .sl-spreepay &:focus-visible {
989
+ border-color: var(--ring);
1616
990
  }
1617
991
  }
1618
- .focus-visible\:ring-1 {
1619
- &:focus-visible {
992
+ .sl-spreepay .focus-visible\:ring-1 {
993
+ .sl-spreepay &:focus-visible {
1620
994
  --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1621
995
  box-shadow:
1622
996
  var(--tw-inset-shadow),
1623
997
  var(--tw-inset-ring-shadow),
1624
998
  var(--tw-ring-offset-shadow),
1625
- var(--tw-ring-shadow),
1626
- var(--tw-shadow);
1627
- }
1628
- }
1629
- .focus-visible\:ring-4 {
1630
- &:focus-visible {
1631
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1632
- box-shadow:
1633
- var(--tw-inset-shadow),
1634
- var(--tw-inset-ring-shadow),
1635
- var(--tw-ring-offset-shadow),
1636
- var(--tw-ring-shadow),
1637
- var(--tw-shadow);
1638
- }
1639
- }
1640
- .focus-visible\:ring-\[3px\] {
1641
- &:focus-visible {
1642
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1643
- box-shadow:
1644
- var(--tw-inset-shadow),
1645
- var(--tw-inset-ring-shadow),
1646
- var(--tw-ring-offset-shadow),
1647
- var(--tw-ring-shadow),
1648
- var(--tw-shadow);
1649
- }
1650
- }
1651
- .focus-visible\:ring-destructive {
1652
- &:focus-visible {
1653
- --tw-ring-color: var(--destructive);
1654
- }
1655
- }
1656
- .focus-visible\:ring-destructive\/20 {
1657
- &:focus-visible {
1658
- --tw-ring-color: var(--destructive);
1659
- @supports (color: color-mix(in lab, red, red)) {
1660
- --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
1661
- }
1662
- }
1663
- }
1664
- .focus-visible\:ring-ring {
1665
- &:focus-visible {
1666
- --tw-ring-color: var(--ring);
1667
- }
1668
- }
1669
- .focus-visible\:ring-ring\/50 {
1670
- &:focus-visible {
1671
- --tw-ring-color: var(--ring);
1672
- @supports (color: color-mix(in lab, red, red)) {
1673
- --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
1674
- }
1675
- }
1676
- }
1677
- .focus-visible\:ring-offset-1 {
1678
- &:focus-visible {
1679
- --tw-ring-offset-width: 1px;
1680
- --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1681
- }
1682
- }
1683
- .focus-visible\:outline-hidden {
1684
- &:focus-visible {
1685
- --tw-outline-style: none;
1686
- outline-style: none;
1687
- @media (forced-colors: active) {
1688
- outline: 2px solid transparent;
1689
- outline-offset: 2px;
1690
- }
1691
- }
1692
- }
1693
- .focus-visible\:outline-1 {
1694
- &:focus-visible {
1695
- outline-style: var(--tw-outline-style);
1696
- outline-width: 1px;
1697
- }
1698
- }
1699
- .focus-visible\:outline-ring {
1700
- &:focus-visible {
1701
- outline-color: var(--ring);
1702
- }
1703
- }
1704
- .focus-visible\:outline-none {
1705
- &:focus-visible {
1706
- --tw-outline-style: none;
1707
- outline-style: none;
1708
- }
1709
- }
1710
- .disabled\:pointer-events-none {
1711
- &:disabled {
1712
- pointer-events: none;
1713
- }
1714
- }
1715
- .disabled\:cursor-not-allowed {
1716
- &:disabled {
1717
- cursor: not-allowed;
1718
- }
1719
- }
1720
- .disabled\:opacity-50 {
1721
- &:disabled {
1722
- opacity: 50%;
1723
- }
1724
- }
1725
- .has-focus\:border-ring {
1726
- &:has(*:focus) {
1727
- border-color: var(--ring);
1728
- }
1729
- }
1730
- .has-focus\:ring-\[3px\] {
1731
- &:has(*:focus) {
1732
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1733
- box-shadow:
1734
- var(--tw-inset-shadow),
1735
- var(--tw-inset-ring-shadow),
1736
- var(--tw-ring-offset-shadow),
1737
- var(--tw-ring-shadow),
1738
- var(--tw-shadow);
1739
- }
1740
- }
1741
- .has-focus\:ring-ring\/50 {
1742
- &:has(*:focus) {
1743
- --tw-ring-color: var(--ring);
1744
- @supports (color: color-mix(in lab, red, red)) {
1745
- --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
1746
- }
1747
- }
1748
- }
1749
- .has-data-\[slot\=card-action\]\:grid-cols-\[1fr_auto\] {
1750
- &:has(*[data-slot=card-action]) {
1751
- grid-template-columns: 1fr auto;
1752
- }
1753
- }
1754
- .has-\[\>svg\]\:px-2\.5 {
1755
- &:has(> svg) {
1756
- padding-inline: calc(var(--spacing) * 2.5);
1757
- }
1758
- }
1759
- .has-\[\>svg\]\:px-3 {
1760
- &:has(> svg) {
1761
- padding-inline: calc(var(--spacing) * 3);
1762
- }
1763
- }
1764
- .has-\[\>svg\]\:px-4 {
1765
- &:has(> svg) {
1766
- padding-inline: calc(var(--spacing) * 4);
1767
- }
1768
- }
1769
- .has-\[\>svg\]\:px-6 {
1770
- &:has(> svg) {
1771
- padding-inline: calc(var(--spacing) * 6);
1772
- }
1773
- }
1774
- .aria-disabled\:opacity-50 {
1775
- &[aria-disabled=true] {
1776
- opacity: 50%;
1777
- }
1778
- }
1779
- .aria-invalid\:border-destructive {
1780
- &[aria-invalid=true] {
1781
- border-color: var(--destructive);
1782
- }
1783
- }
1784
- .aria-invalid\:ring-destructive\/20 {
1785
- &[aria-invalid=true] {
1786
- --tw-ring-color: var(--destructive);
1787
- @supports (color: color-mix(in lab, red, red)) {
1788
- --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
1789
- }
1790
- }
1791
- }
1792
- .aria-selected\:text-muted-foreground {
1793
- &[aria-selected=true] {
1794
- color: var(--muted-foreground);
1795
- }
1796
- }
1797
- .data-\[active\=true\]\:bg-accent\/50 {
1798
- &[data-active=true] {
1799
- background-color: var(--accent);
1800
- @supports (color: color-mix(in lab, red, red)) {
1801
- background-color: color-mix(in oklab, var(--accent) 50%, transparent);
1802
- }
1803
- }
1804
- }
1805
- .data-\[active\=true\]\:text-accent-foreground {
1806
- &[data-active=true] {
1807
- color: var(--accent-foreground);
1808
- }
1809
- }
1810
- .data-\[active\=true\]\:hover\:bg-accent {
1811
- &[data-active=true] {
1812
- &:hover {
1813
- @media (hover: hover) {
1814
- background-color: var(--accent);
1815
- }
1816
- }
1817
- }
1818
- }
1819
- .data-\[active\=true\]\:focus\:bg-accent {
1820
- &[data-active=true] {
1821
- &:focus {
1822
- background-color: var(--accent);
1823
- }
1824
- }
1825
- }
1826
- .data-\[disabled\]\:pointer-events-none {
1827
- &[data-disabled] {
1828
- pointer-events: none;
1829
- }
1830
- }
1831
- .data-\[disabled\]\:opacity-50 {
1832
- &[data-disabled] {
1833
- opacity: 50%;
1834
- }
1835
- }
1836
- .data-\[inset\]\:pl-8 {
1837
- &[data-inset] {
1838
- padding-left: calc(var(--spacing) * 8);
1839
- }
1840
- }
1841
- .data-\[motion\=from-end\]\:slide-in-from-right-52 {
1842
- &[data-motion=from-end] {
1843
- --tw-enter-translate-x: calc(52*var(--spacing));
1844
- }
1845
- }
1846
- .data-\[motion\=from-start\]\:slide-in-from-left-52 {
1847
- &[data-motion=from-start] {
1848
- --tw-enter-translate-x: calc(52*var(--spacing)*-1);
1849
- }
1850
- }
1851
- .data-\[motion\=to-end\]\:slide-out-to-right-52 {
1852
- &[data-motion=to-end] {
1853
- --tw-exit-translate-x: calc(52*var(--spacing));
1854
- }
1855
- }
1856
- .data-\[motion\=to-start\]\:slide-out-to-left-52 {
1857
- &[data-motion=to-start] {
1858
- --tw-exit-translate-x: calc(52*var(--spacing)*-1);
1859
- }
1860
- }
1861
- .data-\[motion\^\=from-\]\:animate-in {
1862
- &[data-motion^=from-] {
1863
- animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
1864
- }
1865
- }
1866
- .data-\[motion\^\=from-\]\:fade-in {
1867
- &[data-motion^=from-] {
1868
- --tw-enter-opacity: 0;
1869
- }
1870
- }
1871
- .data-\[motion\^\=to-\]\:animate-out {
1872
- &[data-motion^=to-] {
1873
- animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
1874
- }
1875
- }
1876
- .data-\[motion\^\=to-\]\:fade-out {
1877
- &[data-motion^=to-] {
1878
- --tw-exit-opacity: 0;
1879
- }
1880
- }
1881
- .data-\[orientation\=horizontal\]\:h-1\.5 {
1882
- &[data-orientation=horizontal] {
1883
- height: calc(var(--spacing) * 1.5);
1884
- }
1885
- }
1886
- .data-\[orientation\=horizontal\]\:h-full {
1887
- &[data-orientation=horizontal] {
1888
- height: 100%;
1889
- }
1890
- }
1891
- .data-\[orientation\=horizontal\]\:h-px {
1892
- &[data-orientation=horizontal] {
1893
- height: 1px;
1894
- }
1895
- }
1896
- .data-\[orientation\=horizontal\]\:w-full {
1897
- &[data-orientation=horizontal] {
1898
- width: 100%;
1899
- }
1900
- }
1901
- .data-\[orientation\=vertical\]\:h-full {
1902
- &[data-orientation=vertical] {
1903
- height: 100%;
1904
- }
1905
- }
1906
- .data-\[orientation\=vertical\]\:min-h-44 {
1907
- &[data-orientation=vertical] {
1908
- min-height: calc(var(--spacing) * 44);
1909
- }
1910
- }
1911
- .data-\[orientation\=vertical\]\:w-1\.5 {
1912
- &[data-orientation=vertical] {
1913
- width: calc(var(--spacing) * 1.5);
1914
- }
1915
- }
1916
- .data-\[orientation\=vertical\]\:w-auto {
1917
- &[data-orientation=vertical] {
1918
- width: auto;
1919
- }
1920
- }
1921
- .data-\[orientation\=vertical\]\:w-full {
1922
- &[data-orientation=vertical] {
1923
- width: 100%;
1924
- }
1925
- }
1926
- .data-\[orientation\=vertical\]\:w-px {
1927
- &[data-orientation=vertical] {
1928
- width: 1px;
1929
- }
1930
- }
1931
- .data-\[orientation\=vertical\]\:flex-col {
1932
- &[data-orientation=vertical] {
1933
- flex-direction: column;
1934
- }
1935
- }
1936
- .data-\[placeholder\]\:text-muted-foreground {
1937
- &[data-placeholder] {
1938
- color: var(--muted-foreground);
1939
- }
1940
- }
1941
- .data-\[range-end\=true\]\:rounded-md {
1942
- &[data-range-end=true] {
1943
- border-radius: calc(var(--radius) - 2px);
1944
- }
1945
- }
1946
- .data-\[range-end\=true\]\:rounded-r-md {
1947
- &[data-range-end=true] {
1948
- border-top-right-radius: calc(var(--radius) - 2px);
1949
- border-bottom-right-radius: calc(var(--radius) - 2px);
1950
- }
1951
- }
1952
- .data-\[range-end\=true\]\:bg-primary {
1953
- &[data-range-end=true] {
1954
- background-color: var(--primary);
1955
- }
1956
- }
1957
- .data-\[range-end\=true\]\:text-primary-foreground {
1958
- &[data-range-end=true] {
1959
- color: var(--primary-foreground);
1960
- }
1961
- }
1962
- .data-\[range-middle\=true\]\:rounded-none {
1963
- &[data-range-middle=true] {
1964
- border-radius: 0;
1965
- }
1966
- }
1967
- .data-\[range-middle\=true\]\:bg-accent {
1968
- &[data-range-middle=true] {
1969
- background-color: var(--accent);
1970
- }
1971
- }
1972
- .data-\[range-middle\=true\]\:text-accent-foreground {
1973
- &[data-range-middle=true] {
1974
- color: var(--accent-foreground);
1975
- }
1976
- }
1977
- .data-\[range-start\=true\]\:rounded-md {
1978
- &[data-range-start=true] {
1979
- border-radius: calc(var(--radius) - 2px);
1980
- }
1981
- }
1982
- .data-\[range-start\=true\]\:rounded-l-md {
1983
- &[data-range-start=true] {
1984
- border-top-left-radius: calc(var(--radius) - 2px);
1985
- border-bottom-left-radius: calc(var(--radius) - 2px);
1986
- }
1987
- }
1988
- .data-\[range-start\=true\]\:bg-primary {
1989
- &[data-range-start=true] {
1990
- background-color: var(--primary);
1991
- }
1992
- }
1993
- .data-\[range-start\=true\]\:text-primary-foreground {
1994
- &[data-range-start=true] {
1995
- color: var(--primary-foreground);
1996
- }
1997
- }
1998
- .data-\[selected-single\=true\]\:bg-primary {
1999
- &[data-selected-single=true] {
2000
- background-color: var(--primary);
2001
- }
2002
- }
2003
- .data-\[selected-single\=true\]\:text-primary-foreground {
2004
- &[data-selected-single=true] {
2005
- color: var(--primary-foreground);
2006
- }
2007
- }
2008
- .data-\[selected\=true\]\:rounded-none {
2009
- &[data-selected=true] {
2010
- border-radius: 0;
2011
- }
2012
- }
2013
- .data-\[side\=bottom\]\:translate-y-1 {
2014
- &[data-side=bottom] {
2015
- --tw-translate-y: calc(var(--spacing) * 1);
2016
- translate: var(--tw-translate-x) var(--tw-translate-y);
2017
- }
2018
- }
2019
- .data-\[side\=bottom\]\:slide-in-from-top-2 {
2020
- &[data-side=bottom] {
2021
- --tw-enter-translate-y: calc(2*var(--spacing)*-1);
2022
- }
2023
- }
2024
- .data-\[side\=left\]\:-translate-x-1 {
2025
- &[data-side=left] {
2026
- --tw-translate-x: calc(var(--spacing) * -1);
2027
- translate: var(--tw-translate-x) var(--tw-translate-y);
2028
- }
2029
- }
2030
- .data-\[side\=left\]\:slide-in-from-right-2 {
2031
- &[data-side=left] {
2032
- --tw-enter-translate-x: calc(2*var(--spacing));
2033
- }
2034
- }
2035
- .data-\[side\=right\]\:translate-x-1 {
2036
- &[data-side=right] {
2037
- --tw-translate-x: calc(var(--spacing) * 1);
2038
- translate: var(--tw-translate-x) var(--tw-translate-y);
2039
- }
2040
- }
2041
- .data-\[side\=right\]\:slide-in-from-left-2 {
2042
- &[data-side=right] {
2043
- --tw-enter-translate-x: calc(2*var(--spacing)*-1);
2044
- }
2045
- }
2046
- .data-\[side\=top\]\:-translate-y-1 {
2047
- &[data-side=top] {
2048
- --tw-translate-y: calc(var(--spacing) * -1);
2049
- translate: var(--tw-translate-x) var(--tw-translate-y);
2050
- }
2051
- }
2052
- .data-\[side\=top\]\:slide-in-from-bottom-2 {
2053
- &[data-side=top] {
2054
- --tw-enter-translate-y: calc(2*var(--spacing));
2055
- }
2056
- }
2057
- .data-\[size\=default\]\:h-9 {
2058
- &[data-size=default] {
2059
- height: calc(var(--spacing) * 9);
2060
- }
2061
- }
2062
- .data-\[size\=sm\]\:h-8 {
2063
- &[data-size=sm] {
2064
- height: calc(var(--spacing) * 8);
2065
- }
2066
- }
2067
- .\*\*\:data-\[slot\=navigation-menu-link\]\:focus\:ring-0 {
2068
- :is(& *) {
2069
- &[data-slot=navigation-menu-link] {
2070
- &:focus {
2071
- --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
2072
- box-shadow:
2073
- var(--tw-inset-shadow),
2074
- var(--tw-inset-ring-shadow),
2075
- var(--tw-ring-offset-shadow),
2076
- var(--tw-ring-shadow),
2077
- var(--tw-shadow);
2078
- }
2079
- }
2080
- }
2081
- }
2082
- .\*\*\:data-\[slot\=navigation-menu-link\]\:focus\:outline-none {
2083
- :is(& *) {
2084
- &[data-slot=navigation-menu-link] {
2085
- &:focus {
2086
- --tw-outline-style: none;
2087
- outline-style: none;
2088
- }
2089
- }
2090
- }
2091
- }
2092
- .\*\:data-\[slot\=select-value\]\:line-clamp-1 {
2093
- :is(& > *) {
2094
- &[data-slot=select-value] {
2095
- overflow: hidden;
2096
- display: -webkit-box;
2097
- -webkit-box-orient: vertical;
2098
- -webkit-line-clamp: 1;
2099
- }
2100
- }
2101
- }
2102
- .\*\:data-\[slot\=select-value\]\:flex {
2103
- :is(& > *) {
2104
- &[data-slot=select-value] {
2105
- display: flex;
2106
- }
2107
- }
2108
- }
2109
- .\*\:data-\[slot\=select-value\]\:items-center {
2110
- :is(& > *) {
2111
- &[data-slot=select-value] {
2112
- align-items: center;
2113
- }
2114
- }
2115
- }
2116
- .\*\:data-\[slot\=select-value\]\:gap-2 {
2117
- :is(& > *) {
2118
- &[data-slot=select-value] {
2119
- gap: calc(var(--spacing) * 2);
2120
- }
2121
- }
2122
- }
2123
- .data-\[state\=active\]\:bg-background {
2124
- &[data-state=active] {
2125
- background-color: var(--background);
2126
- }
2127
- }
2128
- .data-\[state\=active\]\:shadow-sm {
2129
- &[data-state=active] {
2130
- --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
2131
- box-shadow:
2132
- var(--tw-inset-shadow),
2133
- var(--tw-inset-ring-shadow),
2134
- var(--tw-ring-offset-shadow),
2135
- var(--tw-ring-shadow),
2136
- var(--tw-shadow);
2137
- }
2138
- }
2139
- .data-\[state\=checked\]\:translate-x-\[calc\(100\%-2px\)\] {
2140
- &[data-state=checked] {
2141
- --tw-translate-x: calc(100% - 2px);
2142
- translate: var(--tw-translate-x) var(--tw-translate-y);
2143
- }
2144
- }
2145
- .data-\[state\=checked\]\:border-primary {
2146
- &[data-state=checked] {
2147
- border-color: var(--primary);
2148
- }
2149
- }
2150
- .data-\[state\=checked\]\:bg-primary {
2151
- &[data-state=checked] {
2152
- background-color: var(--primary);
2153
- }
2154
- }
2155
- .data-\[state\=checked\]\:text-primary-foreground {
2156
- &[data-state=checked] {
2157
- color: var(--primary-foreground);
2158
- }
2159
- }
2160
- .data-\[state\=closed\]\:animate-accordion-up {
2161
- &[data-state=closed] {
2162
- animation: accordion-up var(--tw-animation-duration,var(--tw-duration,.2s))ease-out;
2163
- }
2164
- }
2165
- .data-\[state\=closed\]\:animate-collapsible-up {
2166
- &[data-state=closed] {
2167
- animation: collapsible-up var(--tw-animation-duration,var(--tw-duration,.2s))ease-out;
2168
- }
2169
- }
2170
- .data-\[state\=closed\]\:animate-out {
2171
- &[data-state=closed] {
2172
- animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
2173
- }
2174
- }
2175
- .data-\[state\=closed\]\:fade-out-0 {
2176
- &[data-state=closed] {
2177
- --tw-exit-opacity: calc(0/100);
2178
- --tw-exit-opacity: 0;
2179
- }
2180
- }
2181
- .data-\[state\=closed\]\:zoom-out-95 {
2182
- &[data-state=closed] {
2183
- --tw-exit-scale: calc(95*1%);
2184
- --tw-exit-scale: .95;
2185
- }
2186
- }
2187
- .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=closed\]\:animate-out {
2188
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
2189
- &[data-state=closed] {
2190
- animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
2191
- }
2192
- }
2193
- }
2194
- .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=closed\]\:fade-out-0 {
2195
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
2196
- &[data-state=closed] {
2197
- --tw-exit-opacity: calc(0/100);
2198
- --tw-exit-opacity: 0;
2199
- }
2200
- }
2201
- }
2202
- .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=closed\]\:zoom-out-95 {
2203
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
2204
- &[data-state=closed] {
2205
- --tw-exit-scale: calc(95*1%);
2206
- --tw-exit-scale: .95;
2207
- }
2208
- }
2209
- }
2210
- .data-\[state\=hidden\]\:animate-out {
2211
- &[data-state=hidden] {
2212
- animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
2213
- }
2214
- }
2215
- .data-\[state\=hidden\]\:fade-out {
2216
- &[data-state=hidden] {
2217
- --tw-exit-opacity: 0;
2218
- }
2219
- }
2220
- .data-\[state\=open\]\:animate-accordion-down {
2221
- &[data-state=open] {
2222
- animation: accordion-down var(--tw-animation-duration,var(--tw-duration,.2s))ease-out;
2223
- }
2224
- }
2225
- .data-\[state\=open\]\:animate-collapsible-down {
2226
- &[data-state=open] {
2227
- animation: collapsible-down var(--tw-animation-duration,var(--tw-duration,.2s))ease-out;
2228
- }
2229
- }
2230
- .data-\[state\=open\]\:animate-in {
2231
- &[data-state=open] {
2232
- animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
2233
- }
2234
- }
2235
- .data-\[state\=open\]\:bg-accent {
2236
- &[data-state=open] {
2237
- background-color: var(--accent);
2238
- }
2239
- }
2240
- .data-\[state\=open\]\:bg-accent\/50 {
2241
- &[data-state=open] {
2242
- background-color: var(--accent);
2243
- @supports (color: color-mix(in lab, red, red)) {
2244
- background-color: color-mix(in oklab, var(--accent) 50%, transparent);
2245
- }
2246
- }
2247
- }
2248
- .data-\[state\=open\]\:text-accent-foreground {
2249
- &[data-state=open] {
2250
- color: var(--accent-foreground);
2251
- }
2252
- }
2253
- .data-\[state\=open\]\:text-muted-foreground {
2254
- &[data-state=open] {
2255
- color: var(--muted-foreground);
2256
- }
2257
- }
2258
- .data-\[state\=open\]\:fade-in-0 {
2259
- &[data-state=open] {
2260
- --tw-enter-opacity: calc(0/100);
2261
- --tw-enter-opacity: 0;
2262
- }
2263
- }
2264
- .data-\[state\=open\]\:zoom-in-90 {
2265
- &[data-state=open] {
2266
- --tw-enter-scale: calc(90*1%);
2267
- --tw-enter-scale: .9;
2268
- }
2269
- }
2270
- .data-\[state\=open\]\:zoom-in-95 {
2271
- &[data-state=open] {
2272
- --tw-enter-scale: calc(95*1%);
2273
- --tw-enter-scale: .95;
999
+ var(--tw-ring-shadow),
1000
+ var(--tw-shadow);
2274
1001
  }
2275
1002
  }
2276
- .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=open\]\:animate-in {
2277
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
2278
- &[data-state=open] {
2279
- animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
2280
- }
1003
+ .sl-spreepay .focus-visible\:ring-2 {
1004
+ .sl-spreepay &:focus-visible {
1005
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1006
+ box-shadow:
1007
+ var(--tw-inset-shadow),
1008
+ var(--tw-inset-ring-shadow),
1009
+ var(--tw-ring-offset-shadow),
1010
+ var(--tw-ring-shadow),
1011
+ var(--tw-shadow);
2281
1012
  }
2282
1013
  }
2283
- .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=open\]\:fade-in-0 {
2284
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
2285
- &[data-state=open] {
2286
- --tw-enter-opacity: calc(0/100);
2287
- --tw-enter-opacity: 0;
2288
- }
1014
+ .sl-spreepay .focus-visible\:ring-destructive {
1015
+ .sl-spreepay &:focus-visible {
1016
+ --tw-ring-color: var(--destructive);
2289
1017
  }
2290
1018
  }
2291
- .group-data-\[viewport\=false\]\/navigation-menu\:data-\[state\=open\]\:zoom-in-95 {
2292
- &:is(:where(.group\/navigation-menu)[data-viewport=false] *) {
2293
- &[data-state=open] {
2294
- --tw-enter-scale: calc(95*1%);
2295
- --tw-enter-scale: .95;
1019
+ .sl-spreepay .focus-visible\:ring-destructive\/20 {
1020
+ .sl-spreepay &:focus-visible {
1021
+ --tw-ring-color: var(--destructive);
1022
+ @supports (color: color-mix(in lab, red, red)) {
1023
+ --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
2296
1024
  }
2297
1025
  }
2298
1026
  }
2299
- .data-\[state\=open\]\:hover\:bg-accent {
2300
- &[data-state=open] {
2301
- &:hover {
2302
- @media (hover: hover) {
2303
- background-color: var(--accent);
2304
- }
2305
- }
1027
+ .sl-spreepay .focus-visible\:ring-ring {
1028
+ .sl-spreepay &:focus-visible {
1029
+ --tw-ring-color: var(--ring);
2306
1030
  }
2307
1031
  }
2308
- .data-\[state\=open\]\:focus\:bg-accent {
2309
- &[data-state=open] {
2310
- &:focus {
2311
- background-color: var(--accent);
1032
+ .sl-spreepay .focus-visible\:ring-ring\/50 {
1033
+ .sl-spreepay &:focus-visible {
1034
+ --tw-ring-color: var(--ring);
1035
+ @supports (color: color-mix(in lab, red, red)) {
1036
+ --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
2312
1037
  }
2313
1038
  }
2314
1039
  }
2315
- .data-\[state\=unchecked\]\:translate-x-0 {
2316
- &[data-state=unchecked] {
2317
- --tw-translate-x: calc(var(--spacing) * 0);
2318
- translate: var(--tw-translate-x) var(--tw-translate-y);
2319
- }
2320
- }
2321
- .data-\[state\=unchecked\]\:bg-input {
2322
- &[data-state=unchecked] {
2323
- background-color: var(--input);
2324
- }
2325
- }
2326
- .data-\[state\=visible\]\:animate-in {
2327
- &[data-state=visible] {
2328
- animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
2329
- }
2330
- }
2331
- .data-\[state\=visible\]\:fade-in {
2332
- &[data-state=visible] {
2333
- --tw-enter-opacity: 0;
1040
+ .sl-spreepay .focus-visible\:ring-offset-1 {
1041
+ .sl-spreepay &:focus-visible {
1042
+ --tw-ring-offset-width: 1px;
1043
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
2334
1044
  }
2335
1045
  }
2336
- .data-\[variant\=destructive\]\:text-destructive {
2337
- &[data-variant=destructive] {
2338
- color: var(--destructive);
1046
+ .sl-spreepay .focus-visible\:outline-none {
1047
+ .sl-spreepay &:focus-visible {
1048
+ --tw-outline-style: none;
1049
+ outline-style: none;
2339
1050
  }
2340
1051
  }
2341
- .data-\[variant\=destructive\]\:focus\:bg-destructive\/10 {
2342
- &[data-variant=destructive] {
2343
- &:focus {
2344
- background-color: var(--destructive);
2345
- @supports (color: color-mix(in lab, red, red)) {
2346
- background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
2347
- }
2348
- }
1052
+ .sl-spreepay .disabled\:pointer-events-none {
1053
+ .sl-spreepay &:disabled {
1054
+ pointer-events: none;
2349
1055
  }
2350
1056
  }
2351
- .data-\[variant\=destructive\]\:focus\:text-destructive {
2352
- &[data-variant=destructive] {
2353
- &:focus {
2354
- color: var(--destructive);
2355
- }
1057
+ .sl-spreepay .disabled\:cursor-not-allowed {
1058
+ .sl-spreepay &:disabled {
1059
+ cursor: not-allowed;
2356
1060
  }
2357
1061
  }
2358
- .data-\[vaul-drawer-direction\=bottom\]\:inset-x-0 {
2359
- &[data-vaul-drawer-direction=bottom] {
2360
- inset-inline: calc(var(--spacing) * 0);
1062
+ .sl-spreepay .disabled\:opacity-50 {
1063
+ .sl-spreepay &:disabled {
1064
+ opacity: 50%;
2361
1065
  }
2362
1066
  }
2363
- .data-\[vaul-drawer-direction\=bottom\]\:bottom-0 {
2364
- &[data-vaul-drawer-direction=bottom] {
2365
- bottom: calc(var(--spacing) * 0);
1067
+ .sl-spreepay .has-\[\>svg\]\:px-2\.5 {
1068
+ .sl-spreepay &:has(> svg) {
1069
+ padding-inline: calc(var(--spacing) * 2.5);
2366
1070
  }
2367
1071
  }
2368
- .data-\[vaul-drawer-direction\=bottom\]\:mt-24 {
2369
- &[data-vaul-drawer-direction=bottom] {
2370
- margin-top: calc(var(--spacing) * 24);
1072
+ .sl-spreepay .has-\[\>svg\]\:px-3 {
1073
+ .sl-spreepay &:has(> svg) {
1074
+ padding-inline: calc(var(--spacing) * 3);
2371
1075
  }
2372
1076
  }
2373
- .data-\[vaul-drawer-direction\=bottom\]\:max-h-\[80vh\] {
2374
- &[data-vaul-drawer-direction=bottom] {
2375
- max-height: 80vh;
1077
+ .sl-spreepay .has-\[\>svg\]\:px-4 {
1078
+ .sl-spreepay &:has(> svg) {
1079
+ padding-inline: calc(var(--spacing) * 4);
2376
1080
  }
2377
1081
  }
2378
- .data-\[vaul-drawer-direction\=bottom\]\:rounded-t-lg {
2379
- &[data-vaul-drawer-direction=bottom] {
2380
- border-top-left-radius: var(--radius);
2381
- border-top-right-radius: var(--radius);
1082
+ .sl-spreepay .has-\[\>svg\]\:px-6 {
1083
+ .sl-spreepay &:has(> svg) {
1084
+ padding-inline: calc(var(--spacing) * 6);
2382
1085
  }
2383
1086
  }
2384
- .data-\[vaul-drawer-direction\=bottom\]\:border-t {
2385
- &[data-vaul-drawer-direction=bottom] {
2386
- border-top-style: var(--tw-border-style);
2387
- border-top-width: 1px;
1087
+ .sl-spreepay .aria-invalid\:border-destructive {
1088
+ .sl-spreepay &[aria-invalid=true] {
1089
+ border-color: var(--destructive);
2388
1090
  }
2389
1091
  }
2390
- .data-\[vaul-drawer-direction\=left\]\:inset-y-0 {
2391
- &[data-vaul-drawer-direction=left] {
2392
- inset-block: calc(var(--spacing) * 0);
1092
+ .sl-spreepay .aria-invalid\:ring-destructive\/20 {
1093
+ .sl-spreepay &[aria-invalid=true] {
1094
+ --tw-ring-color: var(--destructive);
1095
+ @supports (color: color-mix(in lab, red, red)) {
1096
+ --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);
1097
+ }
2393
1098
  }
2394
1099
  }
2395
- .data-\[vaul-drawer-direction\=left\]\:left-0 {
2396
- &[data-vaul-drawer-direction=left] {
2397
- left: calc(var(--spacing) * 0);
1100
+ .sl-spreepay .data-\[state\=checked\]\:translate-x-4 {
1101
+ .sl-spreepay &[data-state=checked] {
1102
+ --tw-translate-x: calc(var(--spacing) * 4);
1103
+ translate: var(--tw-translate-x) var(--tw-translate-y);
2398
1104
  }
2399
1105
  }
2400
- .data-\[vaul-drawer-direction\=left\]\:w-3\/4 {
2401
- &[data-vaul-drawer-direction=left] {
2402
- width: calc(3/4 * 100%);
1106
+ .sl-spreepay .data-\[state\=checked\]\:border-primary {
1107
+ .sl-spreepay &[data-state=checked] {
1108
+ border-color: var(--primary);
2403
1109
  }
2404
1110
  }
2405
- .data-\[vaul-drawer-direction\=left\]\:border-r {
2406
- &[data-vaul-drawer-direction=left] {
2407
- border-right-style: var(--tw-border-style);
2408
- border-right-width: 1px;
1111
+ .sl-spreepay .data-\[state\=checked\]\:bg-primary {
1112
+ .sl-spreepay &[data-state=checked] {
1113
+ background-color: var(--primary);
2409
1114
  }
2410
1115
  }
2411
- .data-\[vaul-drawer-direction\=right\]\:inset-y-0 {
2412
- &[data-vaul-drawer-direction=right] {
2413
- inset-block: calc(var(--spacing) * 0);
1116
+ .sl-spreepay .data-\[state\=checked\]\:text-primary-foreground {
1117
+ .sl-spreepay &[data-state=checked] {
1118
+ color: var(--primary-foreground);
2414
1119
  }
2415
1120
  }
2416
- .data-\[vaul-drawer-direction\=right\]\:right-0 {
2417
- &[data-vaul-drawer-direction=right] {
2418
- right: calc(var(--spacing) * 0);
1121
+ .sl-spreepay .data-\[state\=closed\]\:animate-out {
1122
+ .sl-spreepay &[data-state=closed] {
1123
+ animation: exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
2419
1124
  }
2420
1125
  }
2421
- .data-\[vaul-drawer-direction\=right\]\:w-\[90vw\] {
2422
- &[data-vaul-drawer-direction=right] {
2423
- width: 90vw;
1126
+ .sl-spreepay .data-\[state\=closed\]\:fade-out-0 {
1127
+ .sl-spreepay &[data-state=closed] {
1128
+ --tw-exit-opacity: calc(0/100);
1129
+ --tw-exit-opacity: 0;
2424
1130
  }
2425
1131
  }
2426
- .data-\[vaul-drawer-direction\=right\]\:max-w-\[350px\] {
2427
- &[data-vaul-drawer-direction=right] {
2428
- max-width: 350px;
1132
+ .sl-spreepay .data-\[state\=closed\]\:zoom-out-95 {
1133
+ .sl-spreepay &[data-state=closed] {
1134
+ --tw-exit-scale: calc(95*1%);
1135
+ --tw-exit-scale: .95;
2429
1136
  }
2430
1137
  }
2431
- .data-\[vaul-drawer-direction\=right\]\:border-l {
2432
- &[data-vaul-drawer-direction=right] {
2433
- border-left-style: var(--tw-border-style);
2434
- border-left-width: 1px;
1138
+ .sl-spreepay .data-\[state\=open\]\:animate-in {
1139
+ .sl-spreepay &[data-state=open] {
1140
+ animation: enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none);
2435
1141
  }
2436
1142
  }
2437
- .data-\[vaul-drawer-direction\=top\]\:inset-x-0 {
2438
- &[data-vaul-drawer-direction=top] {
2439
- inset-inline: calc(var(--spacing) * 0);
1143
+ .sl-spreepay .data-\[state\=open\]\:bg-accent {
1144
+ .sl-spreepay &[data-state=open] {
1145
+ background-color: var(--accent);
2440
1146
  }
2441
1147
  }
2442
- .data-\[vaul-drawer-direction\=top\]\:top-0 {
2443
- &[data-vaul-drawer-direction=top] {
2444
- top: calc(var(--spacing) * 0);
1148
+ .sl-spreepay .data-\[state\=open\]\:text-muted-foreground {
1149
+ .sl-spreepay &[data-state=open] {
1150
+ color: var(--muted-foreground);
2445
1151
  }
2446
1152
  }
2447
- .data-\[vaul-drawer-direction\=top\]\:mb-24 {
2448
- &[data-vaul-drawer-direction=top] {
2449
- margin-bottom: calc(var(--spacing) * 24);
1153
+ .sl-spreepay .data-\[state\=open\]\:fade-in-0 {
1154
+ .sl-spreepay &[data-state=open] {
1155
+ --tw-enter-opacity: calc(0/100);
1156
+ --tw-enter-opacity: 0;
2450
1157
  }
2451
1158
  }
2452
- .data-\[vaul-drawer-direction\=top\]\:max-h-\[80vh\] {
2453
- &[data-vaul-drawer-direction=top] {
2454
- max-height: 80vh;
1159
+ .sl-spreepay .data-\[state\=open\]\:zoom-in-95 {
1160
+ .sl-spreepay &[data-state=open] {
1161
+ --tw-enter-scale: calc(95*1%);
1162
+ --tw-enter-scale: .95;
2455
1163
  }
2456
1164
  }
2457
- .data-\[vaul-drawer-direction\=top\]\:rounded-b-lg {
2458
- &[data-vaul-drawer-direction=top] {
2459
- border-bottom-right-radius: var(--radius);
2460
- border-bottom-left-radius: var(--radius);
1165
+ .sl-spreepay .data-\[state\=unchecked\]\:translate-x-0 {
1166
+ .sl-spreepay &[data-state=unchecked] {
1167
+ --tw-translate-x: calc(var(--spacing) * 0);
1168
+ translate: var(--tw-translate-x) var(--tw-translate-y);
2461
1169
  }
2462
1170
  }
2463
- .data-\[vaul-drawer-direction\=top\]\:border-b {
2464
- &[data-vaul-drawer-direction=top] {
2465
- border-bottom-style: var(--tw-border-style);
2466
- border-bottom-width: 1px;
1171
+ .sl-spreepay .data-\[state\=unchecked\]\:bg-input\/50 {
1172
+ .sl-spreepay &[data-state=unchecked] {
1173
+ background-color: var(--input);
1174
+ @supports (color: color-mix(in lab, red, red)) {
1175
+ background-color: color-mix(in oklab, var(--input) 50%, transparent);
1176
+ }
2467
1177
  }
2468
1178
  }
2469
- .sm\:max-w-lg {
1179
+ .sl-spreepay .sm\:max-w-lg {
2470
1180
  @media (width >= 40rem) {
2471
1181
  max-width: var(--container-lg);
2472
1182
  }
2473
1183
  }
2474
- .sm\:flex-row {
1184
+ .sl-spreepay .sm\:flex-row {
2475
1185
  @media (width >= 40rem) {
2476
1186
  flex-direction: row;
2477
1187
  }
2478
1188
  }
2479
- .sm\:justify-end {
1189
+ .sl-spreepay .sm\:justify-end {
2480
1190
  @media (width >= 40rem) {
2481
1191
  justify-content: flex-end;
2482
1192
  }
2483
1193
  }
2484
- .sm\:text-left {
1194
+ .sl-spreepay .sm\:text-left {
2485
1195
  @media (width >= 40rem) {
2486
1196
  text-align: left;
2487
1197
  }
2488
1198
  }
2489
- .data-\[vaul-drawer-direction\=left\]\:sm\:max-w-sm {
2490
- &[data-vaul-drawer-direction=left] {
2491
- @media (width >= 40rem) {
2492
- max-width: var(--container-sm);
2493
- }
2494
- }
2495
- }
2496
- .md\:absolute {
2497
- @media (width >= 48rem) {
2498
- position: absolute;
2499
- }
2500
- }
2501
- .md\:block {
1199
+ .sl-spreepay .md\:block {
2502
1200
  @media (width >= 48rem) {
2503
1201
  display: block;
2504
1202
  }
2505
1203
  }
2506
- .md\:w-\[var\(--radix-navigation-menu-viewport-width\)\] {
2507
- @media (width >= 48rem) {
2508
- width: var(--radix-navigation-menu-viewport-width);
2509
- }
2510
- }
2511
- .md\:w-auto {
2512
- @media (width >= 48rem) {
2513
- width: auto;
2514
- }
2515
- }
2516
- .md\:flex-row {
2517
- @media (width >= 48rem) {
2518
- flex-direction: row;
2519
- }
2520
- }
2521
- .md\:gap-1\.5 {
2522
- @media (width >= 48rem) {
2523
- gap: calc(var(--spacing) * 1.5);
2524
- }
2525
- }
2526
- .md\:text-left {
2527
- @media (width >= 48rem) {
2528
- text-align: left;
2529
- }
2530
- }
2531
- .md\:text-sm {
2532
- @media (width >= 48rem) {
2533
- font-size: var(--text-sm);
2534
- line-height: var(--tw-leading, var(--text-sm--line-height));
2535
- }
2536
- }
2537
- .dark\:border-input {
2538
- &:is(.dark *) {
1204
+ .sl-spreepay .dark\:border-input {
1205
+ .sl-spreepay &:is(.dark *) {
2539
1206
  border-color: var(--input);
2540
1207
  }
2541
1208
  }
2542
- .dark\:bg-destructive\/60 {
2543
- &:is(.dark *) {
1209
+ .sl-spreepay .dark\:bg-destructive\/60 {
1210
+ .sl-spreepay &:is(.dark *) {
2544
1211
  background-color: var(--destructive);
2545
1212
  @supports (color: color-mix(in lab, red, red)) {
2546
1213
  background-color: color-mix(in oklab, var(--destructive) 60%, transparent);
2547
1214
  }
2548
1215
  }
2549
1216
  }
2550
- .dark\:bg-input\/30 {
2551
- &:is(.dark *) {
1217
+ .sl-spreepay .dark\:bg-input\/30 {
1218
+ .sl-spreepay &:is(.dark *) {
2552
1219
  background-color: var(--input);
2553
1220
  @supports (color: color-mix(in lab, red, red)) {
2554
1221
  background-color: color-mix(in oklab, var(--input) 30%, transparent);
2555
1222
  }
2556
1223
  }
2557
1224
  }
2558
- .dark\:text-muted-foreground {
2559
- &:is(.dark *) {
2560
- color: var(--muted-foreground);
2561
- }
2562
- }
2563
- .dark\:hover\:bg-accent\/50 {
2564
- &:is(.dark *) {
2565
- &:hover {
1225
+ .sl-spreepay .dark\:hover\:bg-accent\/50 {
1226
+ .sl-spreepay &:is(.dark *) {
1227
+ .sl-spreepay &:hover {
2566
1228
  @media (hover: hover) {
2567
1229
  background-color: var(--accent);
2568
1230
  @supports (color: color-mix(in lab, red, red)) {
@@ -2572,9 +1234,9 @@
2572
1234
  }
2573
1235
  }
2574
1236
  }
2575
- .dark\:hover\:bg-input\/50 {
2576
- &:is(.dark *) {
2577
- &:hover {
1237
+ .sl-spreepay .dark\:hover\:bg-input\/50 {
1238
+ .sl-spreepay &:is(.dark *) {
1239
+ .sl-spreepay &:hover {
2578
1240
  @media (hover: hover) {
2579
1241
  background-color: var(--input);
2580
1242
  @supports (color: color-mix(in lab, red, red)) {
@@ -2584,18 +1246,9 @@
2584
1246
  }
2585
1247
  }
2586
1248
  }
2587
- .dark\:hover\:text-accent-foreground {
2588
- &:is(.dark *) {
2589
- &:hover {
2590
- @media (hover: hover) {
2591
- color: var(--accent-foreground);
2592
- }
2593
- }
2594
- }
2595
- }
2596
- .dark\:focus-visible\:ring-destructive\/40 {
2597
- &:is(.dark *) {
2598
- &:focus-visible {
1249
+ .sl-spreepay .dark\:focus-visible\:ring-destructive\/40 {
1250
+ .sl-spreepay &:is(.dark *) {
1251
+ .sl-spreepay &:focus-visible {
2599
1252
  --tw-ring-color: var(--destructive);
2600
1253
  @supports (color: color-mix(in lab, red, red)) {
2601
1254
  --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
@@ -2603,9 +1256,9 @@
2603
1256
  }
2604
1257
  }
2605
1258
  }
2606
- .dark\:aria-invalid\:ring-destructive\/40 {
2607
- &:is(.dark *) {
2608
- &[aria-invalid=true] {
1259
+ .sl-spreepay .dark\:aria-invalid\:ring-destructive\/40 {
1260
+ .sl-spreepay &:is(.dark *) {
1261
+ .sl-spreepay &[aria-invalid=true] {
2609
1262
  --tw-ring-color: var(--destructive);
2610
1263
  @supports (color: color-mix(in lab, red, red)) {
2611
1264
  --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);
@@ -2613,272 +1266,39 @@
2613
1266
  }
2614
1267
  }
2615
1268
  }
2616
- .dark\:data-\[state\=active\]\:border-input {
2617
- &:is(.dark *) {
2618
- &[data-state=active] {
2619
- border-color: var(--input);
2620
- }
2621
- }
2622
- }
2623
- .dark\:data-\[state\=active\]\:bg-input\/30 {
2624
- &:is(.dark *) {
2625
- &[data-state=active] {
2626
- background-color: var(--input);
2627
- @supports (color: color-mix(in lab, red, red)) {
2628
- background-color: color-mix(in oklab, var(--input) 30%, transparent);
2629
- }
2630
- }
2631
- }
2632
- }
2633
- .dark\:data-\[state\=active\]\:text-foreground {
2634
- &:is(.dark *) {
2635
- &[data-state=active] {
2636
- color: var(--foreground);
2637
- }
2638
- }
2639
- }
2640
- .dark\:data-\[state\=checked\]\:bg-primary {
2641
- &:is(.dark *) {
2642
- &[data-state=checked] {
1269
+ .sl-spreepay .dark\:data-\[state\=checked\]\:bg-primary {
1270
+ .sl-spreepay &:is(.dark *) {
1271
+ .sl-spreepay &[data-state=checked] {
2643
1272
  background-color: var(--primary);
2644
1273
  }
2645
1274
  }
2646
1275
  }
2647
- .dark\:data-\[state\=checked\]\:bg-primary-foreground {
2648
- &:is(.dark *) {
2649
- &[data-state=checked] {
2650
- background-color: var(--primary-foreground);
2651
- }
2652
- }
2653
- }
2654
- .dark\:data-\[state\=unchecked\]\:bg-foreground {
2655
- &:is(.dark *) {
2656
- &[data-state=unchecked] {
2657
- background-color: var(--foreground);
2658
- }
2659
- }
2660
- }
2661
- .dark\:data-\[state\=unchecked\]\:bg-input\/80 {
2662
- &:is(.dark *) {
2663
- &[data-state=unchecked] {
1276
+ .sl-spreepay .dark\:data-\[state\=unchecked\]\:bg-input\/30 {
1277
+ .sl-spreepay &:is(.dark *) {
1278
+ .sl-spreepay &[data-state=unchecked] {
2664
1279
  background-color: var(--input);
2665
1280
  @supports (color: color-mix(in lab, red, red)) {
2666
- background-color: color-mix(in oklab, var(--input) 80%, transparent);
2667
- }
2668
- }
2669
- }
2670
- }
2671
- .dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20 {
2672
- &:is(.dark *) {
2673
- &[data-variant=destructive] {
2674
- &:focus {
2675
- background-color: var(--destructive);
2676
- @supports (color: color-mix(in lab, red, red)) {
2677
- background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
2678
- }
1281
+ background-color: color-mix(in oklab, var(--input) 30%, transparent);
2679
1282
  }
2680
1283
  }
2681
1284
  }
2682
1285
  }
2683
- .\[\&_svg\]\:pointer-events-none {
2684
- & svg {
1286
+ .sl-spreepay .\[\&_svg\]\:pointer-events-none {
1287
+ .sl-spreepay & svg {
2685
1288
  pointer-events: none;
2686
1289
  }
2687
1290
  }
2688
- .\[\&_svg\]\:shrink-0 {
2689
- & svg {
1291
+ .sl-spreepay .\[\&_svg\]\:shrink-0 {
1292
+ .sl-spreepay & svg {
2690
1293
  flex-shrink: 0;
2691
1294
  }
2692
1295
  }
2693
- .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 {
2694
- & svg:not([class*=size-]) {
1296
+ .sl-spreepay .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 {
1297
+ .sl-spreepay & svg:not([class*=size-]) {
2695
1298
  width: calc(var(--spacing) * 4);
2696
1299
  height: calc(var(--spacing) * 4);
2697
1300
  }
2698
1301
  }
2699
- .\[\&_svg\:not\(\[class\*\=\'text-\'\]\)\]\:text-muted-foreground {
2700
- & svg:not([class*=text-]) {
2701
- color: var(--muted-foreground);
2702
- }
2703
- }
2704
- .\[\&\:first-child\[data-selected\=true\]_button\]\:rounded-l-md {
2705
- &:first-child[data-selected=true] button {
2706
- border-top-left-radius: calc(var(--radius) - 2px);
2707
- border-bottom-left-radius: calc(var(--radius) - 2px);
2708
- }
2709
- }
2710
- .\[\.border-b\]\:pb-6 {
2711
- &:is(.border-b) {
2712
- padding-bottom: calc(var(--spacing) * 6);
2713
- }
2714
- }
2715
- .\[\.border-t\]\:pt-6 {
2716
- &:is(.border-t) {
2717
- padding-top: calc(var(--spacing) * 6);
2718
- }
2719
- }
2720
- .rtl\:\*\*\:\[\.rdp-button\\_next\>svg\]\:rotate-180 {
2721
- &:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
2722
- :is(& *) {
2723
- &:is(.rdp-button_next > svg) {
2724
- rotate: 180deg;
2725
- }
2726
- }
2727
- }
2728
- }
2729
- .rtl\:\*\*\:\[\.rdp-button\\_previous\>svg\]\:rotate-180 {
2730
- &:where(:dir(rtl), [dir=rtl], [dir=rtl] *) {
2731
- :is(& *) {
2732
- &:is(.rdp-button_previous > svg) {
2733
- rotate: 180deg;
2734
- }
2735
- }
2736
- }
2737
- }
2738
- .\*\:\[span\]\:last\:flex {
2739
- :is(& > *) {
2740
- &:is(span) {
2741
- &:last-child {
2742
- display: flex;
2743
- }
2744
- }
2745
- }
2746
- }
2747
- .\*\:\[span\]\:last\:items-center {
2748
- :is(& > *) {
2749
- &:is(span) {
2750
- &:last-child {
2751
- align-items: center;
2752
- }
2753
- }
2754
- }
2755
- }
2756
- .\*\:\[span\]\:last\:gap-2 {
2757
- :is(& > *) {
2758
- &:is(span) {
2759
- &:last-child {
2760
- gap: calc(var(--spacing) * 2);
2761
- }
2762
- }
2763
- }
2764
- }
2765
- .data-\[variant\=destructive\]\:\*\:\[svg\]\:\!text-destructive {
2766
- &[data-variant=destructive] {
2767
- :is(& > *) {
2768
- &:is(svg) {
2769
- color: var(--destructive) !important;
2770
- }
2771
- }
2772
- }
2773
- }
2774
- .\[\&\:last-child\[data-selected\=true\]_button\]\:rounded-r-md {
2775
- &:last-child[data-selected=true] button {
2776
- border-top-right-radius: calc(var(--radius) - 2px);
2777
- border-bottom-right-radius: calc(var(--radius) - 2px);
2778
- }
2779
- }
2780
- .\[\&\>span\]\:text-xs {
2781
- & > span {
2782
- font-size: var(--text-xs);
2783
- line-height: var(--tw-leading, var(--text-xs--line-height));
2784
- }
2785
- }
2786
- .\[\&\>span\]\:opacity-70 {
2787
- & > span {
2788
- opacity: 70%;
2789
- }
2790
- }
2791
- .\[\&\>svg\]\:pointer-events-none {
2792
- & > svg {
2793
- pointer-events: none;
2794
- }
2795
- }
2796
- .\[\&\>svg\]\:size-3 {
2797
- & > svg {
2798
- width: calc(var(--spacing) * 3);
2799
- height: calc(var(--spacing) * 3);
2800
- }
2801
- }
2802
- .\[\&\>svg\]\:size-3\.5 {
2803
- & > svg {
2804
- width: calc(var(--spacing) * 3.5);
2805
- height: calc(var(--spacing) * 3.5);
2806
- }
2807
- }
2808
- .\[\&\>svg\]\:text-muted-foreground {
2809
- & > svg {
2810
- color: var(--muted-foreground);
2811
- }
2812
- }
2813
- .\[\&\[data-state\=open\]\>svg\]\:rotate-180 {
2814
- &[data-state=open] > svg {
2815
- rotate: 180deg;
2816
- }
2817
- }
2818
- .\[\[data-slot\=card-content\]_\&\]\:bg-transparent {
2819
- [data-slot=card-content] & {
2820
- background-color: transparent;
2821
- }
2822
- }
2823
- .\[\[data-slot\=popover-content\]_\&\]\:bg-transparent {
2824
- [data-slot=popover-content] & {
2825
- background-color: transparent;
2826
- }
2827
- }
2828
- .\[a\&\]\:hover\:bg-accent {
2829
- a& {
2830
- &:hover {
2831
- @media (hover: hover) {
2832
- background-color: var(--accent);
2833
- }
2834
- }
2835
- }
2836
- }
2837
- .\[a\&\]\:hover\:bg-destructive\/90 {
2838
- a& {
2839
- &:hover {
2840
- @media (hover: hover) {
2841
- background-color: var(--destructive);
2842
- @supports (color: color-mix(in lab, red, red)) {
2843
- background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
2844
- }
2845
- }
2846
- }
2847
- }
2848
- }
2849
- .\[a\&\]\:hover\:bg-primary\/90 {
2850
- a& {
2851
- &:hover {
2852
- @media (hover: hover) {
2853
- background-color: var(--primary);
2854
- @supports (color: color-mix(in lab, red, red)) {
2855
- background-color: color-mix(in oklab, var(--primary) 90%, transparent);
2856
- }
2857
- }
2858
- }
2859
- }
2860
- }
2861
- .\[a\&\]\:hover\:bg-secondary\/90 {
2862
- a& {
2863
- &:hover {
2864
- @media (hover: hover) {
2865
- background-color: var(--secondary);
2866
- @supports (color: color-mix(in lab, red, red)) {
2867
- background-color: color-mix(in oklab, var(--secondary) 90%, transparent);
2868
- }
2869
- }
2870
- }
2871
- }
2872
- }
2873
- .\[a\&\]\:hover\:text-accent-foreground {
2874
- a& {
2875
- &:hover {
2876
- @media (hover: hover) {
2877
- color: var(--accent-foreground);
2878
- }
2879
- }
2880
- }
2881
- }
2882
1302
  }
2883
1303
  @property --tw-animation-delay { syntax: "*"; inherits: false; initial-value: 0s; }
2884
1304
  @property --tw-animation-direction { syntax: "*"; inherits: false; initial-value: normal; }
@@ -2895,7 +1315,7 @@
2895
1315
  @property --tw-exit-scale { syntax: "*"; inherits: false; initial-value: 1; }
2896
1316
  @property --tw-exit-translate-x { syntax: "*"; inherits: false; initial-value: 0; }
2897
1317
  @property --tw-exit-translate-y { syntax: "*"; inherits: false; initial-value: 0; }
2898
- :root {
1318
+ .sl-spreepay {
2899
1319
  --background: oklch(1 0 0);
2900
1320
  --foreground: oklch(0.145 0 0);
2901
1321
  --card: oklch(1 0 0);
@@ -2931,7 +1351,7 @@
2931
1351
  --sidebar-border: oklch(0.922 0 0);
2932
1352
  --sidebar-ring: oklch(0.708 0 0);
2933
1353
  }
2934
- .dark {
1354
+ .sl-spreepay .dark {
2935
1355
  --background: oklch(0.145 0 0);
2936
1356
  --foreground: oklch(0.985 0 0);
2937
1357
  --card: oklch(0.145 0 0);
@@ -2967,32 +1387,33 @@
2967
1387
  --sidebar-ring: oklch(0.439 0 0);
2968
1388
  }
2969
1389
  @layer base {
2970
- * {
1390
+ .sl-spreepay * {
2971
1391
  border-color: var(--border);
2972
1392
  outline-color: var(--ring);
2973
1393
  @supports (color: color-mix(in lab, red, red)) {
2974
1394
  outline-color: color-mix(in oklab, var(--ring) 50%, transparent);
2975
1395
  }
2976
1396
  }
2977
- body {
2978
- background-color: var(--background);
2979
- color: var(--foreground);
2980
- }
2981
- button:not([disabled]),
2982
- [role=button]:not([disabled]) {
1397
+ .sl-spreepay button:not([disabled]),
1398
+ .sl-spreepay [role=button]:not([disabled]) {
2983
1399
  cursor: pointer;
2984
1400
  }
2985
1401
  }
2986
1402
  .sl-spreepay {
2987
1403
  --primary: #022664;
2988
1404
  }
1405
+ .sl-spreepay * {
1406
+ all: revert-layer;
1407
+ }
1408
+ .sl-spreepay .sl-spreepay__portal {
1409
+ position: relative;
1410
+ }
2989
1411
  @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }
2990
1412
  @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }
2991
1413
  @property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; }
2992
1414
  @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; }
2993
1415
  @property --tw-leading { syntax: "*"; inherits: false; }
2994
1416
  @property --tw-font-weight { syntax: "*"; inherits: false; }
2995
- @property --tw-tracking { syntax: "*"; inherits: false; }
2996
1417
  @property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
2997
1418
  @property --tw-shadow-color { syntax: "*"; inherits: false; }
2998
1419
  @property --tw-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@@ -3009,11 +1430,6 @@
3009
1430
  @property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
3010
1431
  @property --tw-outline-style { syntax: "*"; inherits: false; initial-value: solid; }
3011
1432
  @property --tw-duration { syntax: "*"; inherits: false; }
3012
- @keyframes spin {
3013
- to {
3014
- transform: rotate(360deg);
3015
- }
3016
- }
3017
1433
  @keyframes pulse {
3018
1434
  50% {
3019
1435
  opacity: 0.5;
@@ -3031,51 +1447,18 @@
3031
1447
  transform: translate3d(var(--tw-exit-translate-x,0), var(--tw-exit-translate-y,0), 0)scale3d(var(--tw-exit-scale,1), var(--tw-exit-scale,1), var(--tw-exit-scale,1))rotate(var(--tw-exit-rotate,0));
3032
1448
  }
3033
1449
  }
3034
- @keyframes accordion-down {
3035
- from {
3036
- height: 0;
3037
- }
3038
- to {
3039
- height: var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,auto))));
3040
- }
3041
- }
3042
- @keyframes accordion-up {
3043
- from {
3044
- height: var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,auto))));
3045
- }
3046
- to {
3047
- height: 0;
3048
- }
3049
- }
3050
- @keyframes collapsible-down {
3051
- from {
3052
- height: 0;
3053
- }
3054
- to {
3055
- height: var(--radix-collapsible-content-height,var(--bits-collapsible-content-height,var(--reka-collapsible-content-height,var(--kb-collapsible-content-height,auto))));
3056
- }
3057
- }
3058
- @keyframes collapsible-up {
3059
- from {
3060
- height: var(--radix-collapsible-content-height,var(--bits-collapsible-content-height,var(--reka-collapsible-content-height,var(--kb-collapsible-content-height,auto))));
3061
- }
3062
- to {
3063
- height: 0;
3064
- }
3065
- }
3066
1450
  @layer properties {
3067
1451
  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
3068
- *,
3069
- ::before,
3070
- ::after,
3071
- ::backdrop {
1452
+ .sl-spreepay *,
1453
+ .sl-spreepay ::before,
1454
+ .sl-spreepay ::after,
1455
+ .sl-spreepay ::backdrop {
3072
1456
  --tw-translate-x: 0;
3073
1457
  --tw-translate-y: 0;
3074
1458
  --tw-translate-z: 0;
3075
1459
  --tw-border-style: solid;
3076
1460
  --tw-leading: initial;
3077
1461
  --tw-font-weight: initial;
3078
- --tw-tracking: initial;
3079
1462
  --tw-shadow: 0 0 #0000;
3080
1463
  --tw-shadow-color: initial;
3081
1464
  --tw-shadow-alpha: 100%;