@fctc/sme-widget-ui 3.10.6 → 3.10.8

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.
package/dist/widgets.css CHANGED
@@ -1,799 +1 @@
1
- @charset "UTF-8";
2
- @import "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";
3
-
4
- /* src/index.css */
5
- @tailwind base;
6
- @tailwind components;
7
- @tailwind utilities;
8
- * {
9
- font-family: "Inter", sans-serif;
10
- }
11
- @theme { --color-primary: var(--primary); --color-secondary: var(--secondary); }
12
- .border-primary {
13
- border: var(--color-primary);
14
- }
15
- .custom-checkbox {
16
- appearance: none;
17
- width: 20px;
18
- height: 20px;
19
- border: 2px solid #ccc;
20
- border-radius: 4px;
21
- position: relative;
22
- cursor: pointer;
23
- outline: none;
24
- transition: border-color 0.3s ease, background-color 0.3s ease;
25
- }
26
- .custom-checkbox:checked {
27
- border-color: var(--color-primary);
28
- background-color: var(--color-primary);
29
- }
30
- .custom-checkbox:checked::before {
31
- content: "\2714";
32
- color: white;
33
- font-size: 14px;
34
- position: absolute;
35
- top: 50%;
36
- left: 50%;
37
- transform: translate(-50%, -50%);
38
- }
39
- .custom-checkbox-label {
40
- cursor: pointer;
41
- margin-left: 8px;
42
- }
43
- .custom-radio {
44
- appearance: none;
45
- width: 20px;
46
- height: 20px;
47
- border: 2px solid #ccc;
48
- border-radius: 50%;
49
- position: relative;
50
- cursor: pointer;
51
- outline: none;
52
- transition: border-color 0.3s ease;
53
- }
54
- .custom-radio:checked {
55
- border-color: var(--color-primary);
56
- }
57
- .custom-radio:checked::before {
58
- content: "";
59
- width: 12px;
60
- height: 12px;
61
- background-color: var( --color-primary );
62
- border-radius: 50%;
63
- position: absolute;
64
- top: 50%;
65
- left: 50%;
66
- transform: translate(-50%, -50%);
67
- }
68
- .custom-radio-label {
69
- cursor: pointer;
70
- margin-left: 8px;
71
- }
72
- .field {
73
- border-radius: 10px !important;
74
- min-height: 44px !important;
75
- width: 100% !important;
76
- background-color: #f7f7f7 !important;
77
- padding: 12px 12px 12px 8px !important;
78
- font-weight: 400 !important;
79
- color: var(--text-color) !important;
80
- font-size: 14px !important;
81
- min-width: max-content;
82
- gap: 8px;
83
- opacity: 1;
84
- cursor: pointer !important;
85
- field-sizing: content;
86
- line-height: 1.5;
87
- scrollbar-width: none;
88
- resize: none;
89
- min-width: unset;
90
- }
91
- .field[readonly] {
92
- cursor: not-allowed !important;
93
- border: 1px solid transparent !important;
94
- color: var(--placeholder-color) !important;
95
- opacity: 1;
96
- }
97
- .react-datepicker-popper {
98
- z-index: 9999 !important;
99
- }
100
-
101
- /* node_modules/react-datepicker/dist/react-datepicker.css */
102
- .react-datepicker__navigation-icon::before,
103
- .react-datepicker__year-read-view--down-arrow,
104
- .react-datepicker__month-read-view--down-arrow,
105
- .react-datepicker__month-year-read-view--down-arrow {
106
- border-color: #ccc;
107
- border-style: solid;
108
- border-width: 3px 3px 0 0;
109
- content: "";
110
- display: block;
111
- height: 9px;
112
- position: absolute;
113
- top: 6px;
114
- width: 9px;
115
- }
116
- .react-datepicker-wrapper {
117
- display: inline-block;
118
- padding: 0;
119
- border: 0;
120
- }
121
- .react-datepicker {
122
- font-family:
123
- "Helvetica Neue",
124
- helvetica,
125
- arial,
126
- sans-serif;
127
- font-size: 0.8rem;
128
- background-color: #fff;
129
- color: #000;
130
- border: 1px solid #aeaeae;
131
- border-radius: 0.3rem;
132
- display: inline-block;
133
- position: relative;
134
- line-height: initial;
135
- }
136
- .react-datepicker--time-only .react-datepicker__time-container {
137
- border-left: 0;
138
- }
139
- .react-datepicker--time-only .react-datepicker__time,
140
- .react-datepicker--time-only .react-datepicker__time-box {
141
- border-bottom-left-radius: 0.3rem;
142
- border-bottom-right-radius: 0.3rem;
143
- }
144
- .react-datepicker-popper {
145
- z-index: 1;
146
- line-height: 0;
147
- }
148
- .react-datepicker-popper .react-datepicker__triangle {
149
- stroke: #aeaeae;
150
- }
151
- .react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {
152
- fill: #f0f0f0;
153
- color: #f0f0f0;
154
- }
155
- .react-datepicker-popper[data-placement^=top] .react-datepicker__triangle {
156
- fill: #fff;
157
- color: #fff;
158
- }
159
- .react-datepicker__header {
160
- text-align: center;
161
- background-color: #f0f0f0;
162
- border-bottom: 1px solid #aeaeae;
163
- border-top-left-radius: 0.3rem;
164
- padding: 8px 0;
165
- position: relative;
166
- }
167
- .react-datepicker__header--time {
168
- padding-bottom: 8px;
169
- padding-left: 5px;
170
- padding-right: 5px;
171
- }
172
- .react-datepicker__header--time:not(.react-datepicker__header--time--only) {
173
- border-top-left-radius: 0;
174
- }
175
- .react-datepicker__header:not(.react-datepicker__header--has-time-select) {
176
- border-top-right-radius: 0.3rem;
177
- }
178
- .react-datepicker__year-dropdown-container--select,
179
- .react-datepicker__month-dropdown-container--select,
180
- .react-datepicker__month-year-dropdown-container--select,
181
- .react-datepicker__year-dropdown-container--scroll,
182
- .react-datepicker__month-dropdown-container--scroll,
183
- .react-datepicker__month-year-dropdown-container--scroll {
184
- display: inline-block;
185
- margin: 0 15px;
186
- }
187
- .react-datepicker__current-month,
188
- .react-datepicker-time__header,
189
- .react-datepicker-year-header {
190
- margin-top: 0;
191
- color: #000;
192
- font-weight: bold;
193
- font-size: 0.944rem;
194
- }
195
- h2.react-datepicker__current-month {
196
- padding: 0;
197
- margin: 0;
198
- }
199
- .react-datepicker-time__header {
200
- text-overflow: ellipsis;
201
- white-space: nowrap;
202
- overflow: hidden;
203
- }
204
- .react-datepicker__navigation {
205
- align-items: center;
206
- background: none;
207
- display: flex;
208
- justify-content: center;
209
- text-align: center;
210
- cursor: pointer;
211
- position: absolute;
212
- top: 2px;
213
- padding: 0;
214
- border: none;
215
- z-index: 1;
216
- height: 32px;
217
- width: 32px;
218
- text-indent: -999em;
219
- overflow: hidden;
220
- }
221
- .react-datepicker__navigation--previous {
222
- left: 2px;
223
- }
224
- .react-datepicker__navigation--next {
225
- right: 2px;
226
- }
227
- .react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) {
228
- right: 85px;
229
- }
230
- .react-datepicker__navigation--years {
231
- position: relative;
232
- top: 0;
233
- display: block;
234
- margin-left: auto;
235
- margin-right: auto;
236
- }
237
- .react-datepicker__navigation--years-previous {
238
- top: 4px;
239
- }
240
- .react-datepicker__navigation--years-upcoming {
241
- top: -4px;
242
- }
243
- .react-datepicker__navigation:hover *::before {
244
- border-color: rgb(165.75, 165.75, 165.75);
245
- }
246
- .react-datepicker__navigation-icon {
247
- position: relative;
248
- top: -1px;
249
- font-size: 20px;
250
- width: 0;
251
- }
252
- .react-datepicker__navigation-icon--next {
253
- left: -2px;
254
- }
255
- .react-datepicker__navigation-icon--next::before {
256
- transform: rotate(45deg);
257
- left: -7px;
258
- }
259
- .react-datepicker__navigation-icon--previous {
260
- right: -2px;
261
- }
262
- .react-datepicker__navigation-icon--previous::before {
263
- transform: rotate(225deg);
264
- right: -7px;
265
- }
266
- .react-datepicker__month-container {
267
- float: left;
268
- }
269
- .react-datepicker__year {
270
- margin: 0.4rem;
271
- text-align: center;
272
- }
273
- .react-datepicker__year-wrapper {
274
- display: flex;
275
- flex-wrap: wrap;
276
- max-width: 180px;
277
- }
278
- .react-datepicker__year .react-datepicker__year-text {
279
- display: inline-block;
280
- width: 4rem;
281
- margin: 2px;
282
- }
283
- .react-datepicker__month {
284
- margin: 0.4rem;
285
- text-align: center;
286
- }
287
- .react-datepicker__month .react-datepicker__month-text,
288
- .react-datepicker__month .react-datepicker__quarter-text {
289
- display: inline-block;
290
- width: 4rem;
291
- margin: 2px;
292
- }
293
- .react-datepicker__input-time-container {
294
- clear: both;
295
- width: 100%;
296
- float: left;
297
- margin: 5px 0 10px 15px;
298
- text-align: left;
299
- }
300
- .react-datepicker__input-time-container .react-datepicker-time__caption {
301
- display: inline-block;
302
- }
303
- .react-datepicker__input-time-container .react-datepicker-time__input-container {
304
- display: inline-block;
305
- }
306
- .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input {
307
- display: inline-block;
308
- margin-left: 10px;
309
- }
310
- .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input {
311
- width: auto;
312
- }
313
- .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,
314
- .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button {
315
- -webkit-appearance: none;
316
- margin: 0;
317
- }
318
- .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time] {
319
- -moz-appearance: textfield;
320
- }
321
- .react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter {
322
- margin-left: 5px;
323
- display: inline-block;
324
- }
325
- .react-datepicker__time-container {
326
- float: right;
327
- border-left: 1px solid #aeaeae;
328
- width: 85px;
329
- }
330
- .react-datepicker__time-container--with-today-button {
331
- display: inline;
332
- border: 1px solid #aeaeae;
333
- border-radius: 0.3rem;
334
- position: absolute;
335
- right: -87px;
336
- top: 0;
337
- }
338
- .react-datepicker__time-container .react-datepicker__time {
339
- position: relative;
340
- background: white;
341
- border-bottom-right-radius: 0.3rem;
342
- }
343
- .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {
344
- width: 85px;
345
- overflow-x: hidden;
346
- margin: 0 auto;
347
- text-align: center;
348
- border-bottom-right-radius: 0.3rem;
349
- }
350
- .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list {
351
- list-style: none;
352
- margin: 0;
353
- height: calc(195px + 1.7rem / 2);
354
- overflow-y: scroll;
355
- padding-right: 0;
356
- padding-left: 0;
357
- width: 100%;
358
- box-sizing: content-box;
359
- }
360
- .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item {
361
- height: 30px;
362
- padding: 5px 10px;
363
- white-space: nowrap;
364
- }
365
- .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover {
366
- cursor: pointer;
367
- background-color: #f0f0f0;
368
- }
369
- .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected {
370
- background-color: #216ba5;
371
- color: white;
372
- font-weight: bold;
373
- }
374
- .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover {
375
- background-color: #216ba5;
376
- }
377
- .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled {
378
- color: #ccc;
379
- }
380
- .react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover {
381
- cursor: default;
382
- background-color: transparent;
383
- }
384
- .react-datepicker__week-number {
385
- color: #ccc;
386
- display: inline-block;
387
- width: 1.7rem;
388
- line-height: 1.7rem;
389
- text-align: center;
390
- margin: 0.166rem;
391
- }
392
- .react-datepicker__week-number.react-datepicker__week-number--clickable {
393
- cursor: pointer;
394
- }
395
- .react-datepicker__week-number.react-datepicker__week-number--clickable:not(.react-datepicker__week-number--selected):hover {
396
- border-radius: 0.3rem;
397
- background-color: #f0f0f0;
398
- }
399
- .react-datepicker__week-number--selected {
400
- border-radius: 0.3rem;
401
- background-color: #216ba5;
402
- color: #fff;
403
- }
404
- .react-datepicker__week-number--selected:hover {
405
- background-color: rgb(28.75, 93.2196969697, 143.75);
406
- }
407
- .react-datepicker__day-names {
408
- white-space: nowrap;
409
- margin-bottom: -8px;
410
- }
411
- .react-datepicker__week {
412
- white-space: nowrap;
413
- }
414
- .react-datepicker__day-name,
415
- .react-datepicker__day,
416
- .react-datepicker__time-name {
417
- color: #000;
418
- display: inline-block;
419
- width: 1.7rem;
420
- line-height: 1.7rem;
421
- text-align: center;
422
- margin: 0.166rem;
423
- }
424
- .react-datepicker__day,
425
- .react-datepicker__month-text,
426
- .react-datepicker__quarter-text,
427
- .react-datepicker__year-text {
428
- cursor: pointer;
429
- }
430
- .react-datepicker__day:not([aria-disabled=true]):hover,
431
- .react-datepicker__month-text:not([aria-disabled=true]):hover,
432
- .react-datepicker__quarter-text:not([aria-disabled=true]):hover,
433
- .react-datepicker__year-text:not([aria-disabled=true]):hover {
434
- border-radius: 0.3rem;
435
- background-color: #f0f0f0;
436
- }
437
- .react-datepicker__day--today,
438
- .react-datepicker__month-text--today,
439
- .react-datepicker__quarter-text--today,
440
- .react-datepicker__year-text--today {
441
- font-weight: bold;
442
- }
443
- .react-datepicker__day--highlighted,
444
- .react-datepicker__month-text--highlighted,
445
- .react-datepicker__quarter-text--highlighted,
446
- .react-datepicker__year-text--highlighted {
447
- border-radius: 0.3rem;
448
- background-color: #3dcc4a;
449
- color: #fff;
450
- }
451
- .react-datepicker__day--highlighted:not([aria-disabled=true]):hover,
452
- .react-datepicker__month-text--highlighted:not([aria-disabled=true]):hover,
453
- .react-datepicker__quarter-text--highlighted:not([aria-disabled=true]):hover,
454
- .react-datepicker__year-text--highlighted:not([aria-disabled=true]):hover {
455
- background-color: rgb(49.8551020408, 189.6448979592, 62.5632653061);
456
- }
457
- .react-datepicker__day--highlighted-custom-1,
458
- .react-datepicker__month-text--highlighted-custom-1,
459
- .react-datepicker__quarter-text--highlighted-custom-1,
460
- .react-datepicker__year-text--highlighted-custom-1 {
461
- color: magenta;
462
- }
463
- .react-datepicker__day--highlighted-custom-2,
464
- .react-datepicker__month-text--highlighted-custom-2,
465
- .react-datepicker__quarter-text--highlighted-custom-2,
466
- .react-datepicker__year-text--highlighted-custom-2 {
467
- color: green;
468
- }
469
- .react-datepicker__day--holidays,
470
- .react-datepicker__month-text--holidays,
471
- .react-datepicker__quarter-text--holidays,
472
- .react-datepicker__year-text--holidays {
473
- position: relative;
474
- border-radius: 0.3rem;
475
- background-color: #ff6803;
476
- color: #fff;
477
- }
478
- .react-datepicker__day--holidays .overlay,
479
- .react-datepicker__month-text--holidays .overlay,
480
- .react-datepicker__quarter-text--holidays .overlay,
481
- .react-datepicker__year-text--holidays .overlay {
482
- position: absolute;
483
- bottom: 100%;
484
- left: 50%;
485
- transform: translateX(-50%);
486
- background-color: #333;
487
- color: #fff;
488
- padding: 4px;
489
- border-radius: 4px;
490
- white-space: nowrap;
491
- visibility: hidden;
492
- opacity: 0;
493
- transition: visibility 0s, opacity 0.3s ease-in-out;
494
- }
495
- .react-datepicker__day--holidays:not([aria-disabled=true]):hover,
496
- .react-datepicker__month-text--holidays:not([aria-disabled=true]):hover,
497
- .react-datepicker__quarter-text--holidays:not([aria-disabled=true]):hover,
498
- .react-datepicker__year-text--holidays:not([aria-disabled=true]):hover {
499
- background-color: rgb(207, 82.9642857143, 0);
500
- }
501
- .react-datepicker__day--holidays:hover .overlay,
502
- .react-datepicker__month-text--holidays:hover .overlay,
503
- .react-datepicker__quarter-text--holidays:hover .overlay,
504
- .react-datepicker__year-text--holidays:hover .overlay {
505
- visibility: visible;
506
- opacity: 1;
507
- }
508
- .react-datepicker__day--selected,
509
- .react-datepicker__day--in-selecting-range,
510
- .react-datepicker__day--in-range,
511
- .react-datepicker__month-text--selected,
512
- .react-datepicker__month-text--in-selecting-range,
513
- .react-datepicker__month-text--in-range,
514
- .react-datepicker__quarter-text--selected,
515
- .react-datepicker__quarter-text--in-selecting-range,
516
- .react-datepicker__quarter-text--in-range,
517
- .react-datepicker__year-text--selected,
518
- .react-datepicker__year-text--in-selecting-range,
519
- .react-datepicker__year-text--in-range {
520
- border-radius: 0.3rem;
521
- background-color: #216ba5;
522
- color: #fff;
523
- }
524
- .react-datepicker__day--selected:not([aria-disabled=true]):hover,
525
- .react-datepicker__day--in-selecting-range:not([aria-disabled=true]):hover,
526
- .react-datepicker__day--in-range:not([aria-disabled=true]):hover,
527
- .react-datepicker__month-text--selected:not([aria-disabled=true]):hover,
528
- .react-datepicker__month-text--in-selecting-range:not([aria-disabled=true]):hover,
529
- .react-datepicker__month-text--in-range:not([aria-disabled=true]):hover,
530
- .react-datepicker__quarter-text--selected:not([aria-disabled=true]):hover,
531
- .react-datepicker__quarter-text--in-selecting-range:not([aria-disabled=true]):hover,
532
- .react-datepicker__quarter-text--in-range:not([aria-disabled=true]):hover,
533
- .react-datepicker__year-text--selected:not([aria-disabled=true]):hover,
534
- .react-datepicker__year-text--in-selecting-range:not([aria-disabled=true]):hover,
535
- .react-datepicker__year-text--in-range:not([aria-disabled=true]):hover {
536
- background-color: rgb(28.75, 93.2196969697, 143.75);
537
- }
538
- .react-datepicker__day--keyboard-selected,
539
- .react-datepicker__month-text--keyboard-selected,
540
- .react-datepicker__quarter-text--keyboard-selected,
541
- .react-datepicker__year-text--keyboard-selected {
542
- border-radius: 0.3rem;
543
- background-color: rgb(186.25, 217.0833333333, 241.25);
544
- color: rgb(0, 0, 0);
545
- }
546
- .react-datepicker__day--keyboard-selected:not([aria-disabled=true]):hover,
547
- .react-datepicker__month-text--keyboard-selected:not([aria-disabled=true]):hover,
548
- .react-datepicker__quarter-text--keyboard-selected:not([aria-disabled=true]):hover,
549
- .react-datepicker__year-text--keyboard-selected:not([aria-disabled=true]):hover {
550
- background-color: rgb(28.75, 93.2196969697, 143.75);
551
- }
552
- .react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),
553
- .react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),
554
- .react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range),
555
- .react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--in-range) {
556
- background-color: rgba(33, 107, 165, 0.5);
557
- }
558
- .react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
559
- .react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
560
- .react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
561
- .react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
562
- .react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
563
- .react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
564
- .react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range),
565
- .react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range, .react-datepicker__month-text--in-selecting-range, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__year-text--in-selecting-range) {
566
- background-color: #f0f0f0;
567
- color: #000;
568
- }
569
- .react-datepicker__day--disabled,
570
- .react-datepicker__month-text--disabled,
571
- .react-datepicker__quarter-text--disabled,
572
- .react-datepicker__year-text--disabled {
573
- cursor: default;
574
- color: #ccc;
575
- }
576
- .react-datepicker__day--disabled .overlay,
577
- .react-datepicker__month-text--disabled .overlay,
578
- .react-datepicker__quarter-text--disabled .overlay,
579
- .react-datepicker__year-text--disabled .overlay {
580
- position: absolute;
581
- bottom: 70%;
582
- left: 50%;
583
- transform: translateX(-50%);
584
- background-color: #333;
585
- color: #fff;
586
- padding: 4px;
587
- border-radius: 4px;
588
- white-space: nowrap;
589
- visibility: hidden;
590
- opacity: 0;
591
- transition: visibility 0s, opacity 0.3s ease-in-out;
592
- }
593
- .react-datepicker__input-container {
594
- position: relative;
595
- display: inline-block;
596
- width: 100%;
597
- }
598
- .react-datepicker__input-container .react-datepicker__calendar-icon {
599
- position: absolute;
600
- padding: 0.5rem;
601
- box-sizing: content-box;
602
- }
603
- .react-datepicker__view-calendar-icon input {
604
- padding: 6px 10px 5px 25px;
605
- }
606
- .react-datepicker__year-read-view,
607
- .react-datepicker__month-read-view,
608
- .react-datepicker__month-year-read-view {
609
- border: 1px solid transparent;
610
- border-radius: 0.3rem;
611
- position: relative;
612
- }
613
- .react-datepicker__year-read-view:hover,
614
- .react-datepicker__month-read-view:hover,
615
- .react-datepicker__month-year-read-view:hover {
616
- cursor: pointer;
617
- }
618
- .react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,
619
- .react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,
620
- .react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,
621
- .react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,
622
- .react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,
623
- .react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow {
624
- border-top-color: rgb(178.5, 178.5, 178.5);
625
- }
626
- .react-datepicker__year-read-view--down-arrow,
627
- .react-datepicker__month-read-view--down-arrow,
628
- .react-datepicker__month-year-read-view--down-arrow {
629
- transform: rotate(135deg);
630
- right: -16px;
631
- top: 0;
632
- }
633
- .react-datepicker__year-dropdown,
634
- .react-datepicker__month-dropdown,
635
- .react-datepicker__month-year-dropdown {
636
- background-color: #f0f0f0;
637
- position: absolute;
638
- width: 50%;
639
- left: 25%;
640
- top: 30px;
641
- z-index: 1;
642
- text-align: center;
643
- border-radius: 0.3rem;
644
- border: 1px solid #aeaeae;
645
- }
646
- .react-datepicker__year-dropdown:hover,
647
- .react-datepicker__month-dropdown:hover,
648
- .react-datepicker__month-year-dropdown:hover {
649
- cursor: pointer;
650
- }
651
- .react-datepicker__year-dropdown--scrollable,
652
- .react-datepicker__month-dropdown--scrollable,
653
- .react-datepicker__month-year-dropdown--scrollable {
654
- height: 150px;
655
- overflow-y: scroll;
656
- }
657
- .react-datepicker__year-option,
658
- .react-datepicker__month-option,
659
- .react-datepicker__month-year-option {
660
- line-height: 20px;
661
- width: 100%;
662
- display: block;
663
- margin-left: auto;
664
- margin-right: auto;
665
- }
666
- .react-datepicker__year-option:first-of-type,
667
- .react-datepicker__month-option:first-of-type,
668
- .react-datepicker__month-year-option:first-of-type {
669
- border-top-left-radius: 0.3rem;
670
- border-top-right-radius: 0.3rem;
671
- }
672
- .react-datepicker__year-option:last-of-type,
673
- .react-datepicker__month-option:last-of-type,
674
- .react-datepicker__month-year-option:last-of-type {
675
- -webkit-user-select: none;
676
- -moz-user-select: none;
677
- -ms-user-select: none;
678
- user-select: none;
679
- border-bottom-left-radius: 0.3rem;
680
- border-bottom-right-radius: 0.3rem;
681
- }
682
- .react-datepicker__year-option:hover,
683
- .react-datepicker__month-option:hover,
684
- .react-datepicker__month-year-option:hover {
685
- background-color: #ccc;
686
- }
687
- .react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,
688
- .react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,
689
- .react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming {
690
- border-bottom-color: rgb(178.5, 178.5, 178.5);
691
- }
692
- .react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,
693
- .react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,
694
- .react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous {
695
- border-top-color: rgb(178.5, 178.5, 178.5);
696
- }
697
- .react-datepicker__year-option--selected,
698
- .react-datepicker__month-option--selected,
699
- .react-datepicker__month-year-option--selected {
700
- position: absolute;
701
- left: 15px;
702
- }
703
- .react-datepicker__close-icon {
704
- cursor: pointer;
705
- background-color: transparent;
706
- border: 0;
707
- outline: 0;
708
- padding: 0 6px 0 0;
709
- position: absolute;
710
- top: 0;
711
- right: 0;
712
- height: 100%;
713
- display: table-cell;
714
- vertical-align: middle;
715
- }
716
- .react-datepicker__close-icon::after {
717
- cursor: pointer;
718
- background-color: #216ba5;
719
- color: #fff;
720
- border-radius: 50%;
721
- height: 16px;
722
- width: 16px;
723
- padding: 2px;
724
- font-size: 12px;
725
- line-height: 1;
726
- text-align: center;
727
- display: table-cell;
728
- vertical-align: middle;
729
- content: "\d7";
730
- }
731
- .react-datepicker__close-icon--disabled {
732
- cursor: default;
733
- }
734
- .react-datepicker__close-icon--disabled::after {
735
- cursor: default;
736
- background-color: #ccc;
737
- }
738
- .react-datepicker__today-button {
739
- background: #f0f0f0;
740
- border-top: 1px solid #aeaeae;
741
- cursor: pointer;
742
- text-align: center;
743
- font-weight: bold;
744
- padding: 5px 0;
745
- clear: left;
746
- }
747
- .react-datepicker__portal {
748
- position: fixed;
749
- width: 100vw;
750
- height: 100vh;
751
- background-color: rgba(0, 0, 0, 0.8);
752
- left: 0;
753
- top: 0;
754
- justify-content: center;
755
- align-items: center;
756
- display: flex;
757
- z-index: 2147483647;
758
- }
759
- .react-datepicker__portal .react-datepicker__day-name,
760
- .react-datepicker__portal .react-datepicker__day,
761
- .react-datepicker__portal .react-datepicker__time-name {
762
- width: 3rem;
763
- line-height: 3rem;
764
- }
765
- @media (max-width: 400px), (max-height: 550px) {
766
- .react-datepicker__portal .react-datepicker__day-name,
767
- .react-datepicker__portal .react-datepicker__day,
768
- .react-datepicker__portal .react-datepicker__time-name {
769
- width: 2rem;
770
- line-height: 2rem;
771
- }
772
- }
773
- .react-datepicker__portal .react-datepicker__current-month,
774
- .react-datepicker__portal .react-datepicker-time__header {
775
- font-size: 1.44rem;
776
- }
777
- .react-datepicker__children-container {
778
- width: 13.8rem;
779
- margin: 0.4rem;
780
- padding-right: 0.2rem;
781
- padding-left: 0.2rem;
782
- height: auto;
783
- }
784
- .react-datepicker__aria-live {
785
- position: absolute;
786
- clip-path: circle(0);
787
- border: 0;
788
- height: 1px;
789
- margin: -1px;
790
- overflow: hidden;
791
- padding: 0;
792
- width: 1px;
793
- white-space: nowrap;
794
- }
795
- .react-datepicker__calendar-icon {
796
- width: 1em;
797
- height: 1em;
798
- vertical-align: -0.125em;
799
- }
1
+ @import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";@tailwind base;@tailwind components;@tailwind utilities;*{font-family:Inter,sans-serif}@theme{ --color-primary: var(--primary); --color-secondary: var(--secondary); }.border-primary{border:var(--color-primary)}.custom-checkbox{appearance:none;width:20px;height:20px;border:2px solid #ccc;border-radius:4px;position:relative;cursor:pointer;outline:none;transition:border-color .3s ease,background-color .3s ease}.custom-checkbox:checked{border-color:var(--color-primary);background-color:var(--color-primary)}.custom-checkbox:checked:before{content:"\2714";color:#fff;font-size:14px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.custom-checkbox-label{cursor:pointer;margin-left:8px}.custom-radio{appearance:none;width:20px;height:20px;border:2px solid #ccc;border-radius:50%;position:relative;cursor:pointer;outline:none;transition:border-color .3s ease}.custom-radio:checked{border-color:var(--color-primary)}.custom-radio:checked:before{content:"";width:12px;height:12px;background-color:var( --color-primary );border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.custom-radio-label{cursor:pointer;margin-left:8px}.field{border-radius:10px!important;min-height:44px!important;width:100%!important;background-color:#f7f7f7!important;padding:12px 12px 12px 8px!important;font-weight:400!important;color:var(--text-color)!important;font-size:14px!important;min-width:max-content;gap:8px;opacity:1;cursor:pointer!important;field-sizing:content;line-height:1.5;scrollbar-width:none;resize:none;min-width:unset}.field[readonly]{cursor:not-allowed!important;border:1px solid transparent!important;color:var(--placeholder-color)!important;opacity:1}.react-datepicker-popper{z-index:9999!important}