@sc-360-v2/storefront-cms-library 0.3.4 → 0.3.6

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 (38) hide show
  1. package/dist/builder.js +1 -1
  2. package/dist/builder.js.LICENSE.txt +1 -1
  3. package/dist/button copy.scss +2 -1
  4. package/dist/checkout.scss +141 -16
  5. package/dist/filter-results.scss +324 -0
  6. package/dist/filters.scss +1324 -31
  7. package/dist/functions.js +1 -1
  8. package/dist/icon-list.scss +11 -11
  9. package/dist/index.js +1 -1
  10. package/dist/layouter-pro-item.scss +6 -0
  11. package/dist/layouter-pro.scss +30 -2
  12. package/dist/menu-v2.scss +5 -2
  13. package/dist/past-orders.scss +770 -26
  14. package/dist/product-actions.scss +254 -393
  15. package/dist/product-basic-elements.scss +12 -12
  16. package/dist/product-options.scss +72 -46
  17. package/dist/quotes.scss +1 -0
  18. package/dist/repeater.scss +5 -2
  19. package/dist/text-temp-v2.scss +2 -2
  20. package/dist/types/builder/elements/filter-results/index.d.ts +27 -0
  21. package/dist/types/builder/elements/product-sizechart/index.d.ts +26 -0
  22. package/dist/types/builder/elements/user-elements/index.d.ts +30 -0
  23. package/dist/types/builder/enums/index.d.ts +5 -1
  24. package/dist/types/builder/index.d.ts +4 -1
  25. package/dist/types/builder/tools/element-edit/filterResults.d.ts +140 -0
  26. package/dist/types/builder/tools/element-edit/filters.d.ts +15 -8
  27. package/dist/types/builder/tools/element-edit/index.d.ts +4 -1
  28. package/dist/types/builder/tools/element-edit/layouter-pro-item.d.ts +14 -1
  29. package/dist/types/builder/tools/element-edit/layouterPro.d.ts +9 -2
  30. package/dist/types/builder/tools/element-edit/pastOrders.d.ts +61 -1
  31. package/dist/types/builder/tools/element-edit/productActions.d.ts +6 -1
  32. package/dist/types/builder/tools/element-edit/productSizeChart.d.ts +24 -0
  33. package/dist/types/builder/tools/element-edit/userElements.d.ts +555 -0
  34. package/dist/types/global/types.d.ts +2 -1
  35. package/dist/user-elements.scss +1375 -0
  36. package/dist/variant-picker.scss +127 -84
  37. package/dist/widget.scss +2 -0
  38. package/package.json +1 -1
@@ -19,11 +19,49 @@
19
19
  color: rgba(75, 69, 70, 1);
20
20
  }
21
21
  .action__buttons__wrapper {
22
+ background-color: var(
23
+ --_ctm-mob-dn-wt-se-bd-cr,
24
+ var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr))
25
+ );
26
+
27
+ border-color: var(
28
+ --_ctm-mob-dn-wt-se-br-cr,
29
+ var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr))
30
+ );
31
+
32
+ border-style: var(
33
+ --_ctm-mob-dn-wt-se-br-se,
34
+ var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se))
35
+ );
36
+
37
+ border-width: var(
38
+ --_ctm-mob-dn-wt-se-br-wh,
39
+ var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh))
40
+ );
41
+
42
+ border-radius: var(
43
+ --_ctm-mob-dn-wt-se-br-rs,
44
+ var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs))
45
+ );
46
+
47
+ box-shadow: var(
48
+ --_show-shadow,
49
+ var(--_ctm-mob-dn-wt-se-sw-ae, var(--_ctm-tab-dn-wt-se-sw-ae, var(--_ctm-dn-wt-se-sw-ae)))
50
+ var(--_ctm-mob-dn-wt-se-sw-br, var(--_ctm-tab-dn-wt-se-sw-br, var(--_ctm-dn-wt-se-sw-br)))
51
+ var(--_ctm-mob-dn-wt-se-sw-sd, var(--_ctm-tab-dn-wt-se-sw-sd, var(--_ctm-dn-wt-se-sw-sd)))
52
+ var(--_ctm-mob-dn-wt-se-sw-cr, var(--_ctm-tab-dn-wt-se-sw-cr, var(--_ctm-dn-wt-se-sw-cr)))
53
+ );
54
+
55
+ //
56
+
22
57
  padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
23
58
 
24
59
  display: flex;
25
60
  gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
26
61
  flex-direction: column;
62
+ align-items: var(--_ctm-mob-lt-is-at, var(--_ctm-tab-lt-is-at, var(--_ctm-lt-is-at)));
63
+ min-height: 30px;
64
+
27
65
  // &[data-actions-overflow-item-wrap="true"] {
28
66
  // flex-wrap: wrap;
29
67
  // }
@@ -35,9 +73,6 @@
35
73
  flex-direction: row;
36
74
  row-gap: var(--_ctm-mob-lt-im-vl-sg, var(--_ctm-tab-lt-im-vl-sg, var(--_ctm-lt-im-vl-sg)));
37
75
  flex-wrap: wrap;
38
- .btn__with__text {
39
- width: auto !important;
40
- }
41
76
  }
42
77
  .btn__with__text {
43
78
  white-space: nowrap;
@@ -63,7 +98,7 @@
63
98
 
64
99
  &:hover {
65
100
  --_sf-hr-bd-cr: var(
66
- --_ctm-mob-dn-ad-to-ct-hr-se-bd-cr,
101
+ --_ctm-mob-dn-me-hr-se-bd-cr,
67
102
  var(--_ctm-tab-dn-ad-to-ct-hr-se-bd-cr, var(--_ctm-dn-ad-to-ct-hr-se-bd-cr))
68
103
  );
69
104
  --_sf-hr-br-cr: var(
@@ -156,7 +191,20 @@
156
191
  --_ctm-mob-dn-ad-to-ct-hr-se-in-c1,
157
192
  var(--_ctm-tab-dn-ad-to-ct-hr-se-in-c1, var(--_ctm-dn-ad-to-ct-hr-se-in-c1))
158
193
  );
159
- --_sf-hr-ue: var(--_ctm-mob-dn-hr-ue, var(--_ctm-tab-dn-hr-ue, var(--_ctm-dn-hr-ue)));
194
+ --_sf-hr-ue: var(
195
+ --_ctm-mob-dn-ad-to-ct-hr-ue,
196
+ var(--_ctm-tab-dn-ad-to-ct-hr-ue, var(--_ctm-dn-ad-to-ct-hr-ue))
197
+ );
198
+
199
+ // for pading and width
200
+ --_sf-hr-pg: var(
201
+ --_ctm-mob-dn-ad-to-ct-hr-pg,
202
+ var(--_ctm-tab-dn-ad-to-ct-hr-pg, var(--_ctm-dn-ad-to-ct-hr-pg))
203
+ );
204
+ --_sf-hr-wh: var(
205
+ --_ctm-mob-dn-ad-to-ct-hr-wh,
206
+ var(--_ctm-tab-dn-ad-to-ct-hr-wh, var(--_ctm-dn-ad-to-ct-hr-wh))
207
+ );
160
208
 
161
209
  &[data-hover-show-shadow="false"] {
162
210
  --_hover-show-shadow: none;
@@ -167,7 +215,8 @@
167
215
  }
168
216
  background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-ad-to-ct-dt-se-bd-cr));
169
217
 
170
- padding: 5px 10px;
218
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-ad-to-ct-dt-se-pg));
219
+ width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-ad-to-ct-dt-se-wh));
171
220
  display: flex;
172
221
  flex-direction: var(--_sf-fd-bn);
173
222
  align-items: center;
@@ -175,9 +224,6 @@
175
224
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-ad-to-ct-dt-se-at));
176
225
  gap: var(--_sf-hr-in-ad-tt-sg, prepareMediaVariable(--_ctm-dn-ad-to-ct-dt-se-in-ad-tt-sg));
177
226
 
178
- width: 100%;
179
- height: 100%;
180
-
181
227
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-ad-to-ct-dt-se-br-rs));
182
228
 
183
229
  box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-ad-to-ct-dt-se-sw-ae))
@@ -198,8 +244,8 @@
198
244
 
199
245
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-ad-to-ct-dt-se-cr));
200
246
 
201
- font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ad-to-ct-dt-se-ft-fy)),
202
- sans-serif;
247
+ font-family:
248
+ var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ad-to-ct-dt-se-ft-fy)), sans-serif;
203
249
 
204
250
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-ad-to-ct-dt-se-ft-se));
205
251
 
@@ -346,7 +392,20 @@
346
392
  --_ctm-mob-dn-by-nw-hr-se-in-c1,
347
393
  var(--_ctm-tab-dn-by-nw-hr-se-in-c1, var(--_ctm-dn-by-nw-hr-se-in-c1))
348
394
  );
349
- --_sf-hr-ue: var(--_ctm-mob-dn-hr-ue, var(--_ctm-tab-dn-hr-ue, var(--_ctm-dn-hr-ue)));
395
+ --_sf-hr-ue: var(
396
+ --_ctm-mob-dn-by-nw-hr-ue,
397
+ var(--_ctm-tab-dn-by-nw-hr-ue, var(--_ctm-dn-by-nw-hr-ue))
398
+ );
399
+
400
+ // for pading and width
401
+ --_sf-hr-pg: var(
402
+ --_ctm-mob-dn-by-nw-hr-pg,
403
+ var(--_ctm-tab-dn-by-nw-hr-pg, var(--_ctm-dn-by-nw-hr-pg))
404
+ );
405
+ --_sf-hr-wh: var(
406
+ --_ctm-mob-dn-by-nw-hr-wh,
407
+ var(--_ctm-tab-dn-by-nw-hr-wh, var(--_ctm-dn-by-nw-hr-wh))
408
+ );
350
409
 
351
410
  &[data-hover-show-shadow="false"] {
352
411
  --_hover-show-shadow: none;
@@ -357,7 +416,6 @@
357
416
  }
358
417
  background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-by-nw-dt-se-bd-cr));
359
418
 
360
- padding: 5px 10px;
361
419
  display: flex;
362
420
  flex-direction: var(--_sf-fd-bn);
363
421
  align-items: center;
@@ -368,8 +426,8 @@
368
426
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-by-nw-dt-se-at));
369
427
  gap: var(--_sf-hr-in-ad-tt-sg, prepareMediaVariable(--_ctm-dn-by-nw-dt-se-in-ad-tt-sg));
370
428
 
371
- width: 100%;
372
- height: 100%;
429
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-by-nw-dt-se-pg));
430
+ width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-by-nw-dt-se-wh));
373
431
 
374
432
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-by-nw-dt-se-br-rs));
375
433
 
@@ -391,8 +449,8 @@
391
449
 
392
450
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-by-nw-dt-se-cr));
393
451
 
394
- font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-by-nw-dt-se-ft-fy)),
395
- sans-serif;
452
+ font-family:
453
+ var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-by-nw-dt-se-ft-fy)), sans-serif;
396
454
 
397
455
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-by-nw-dt-se-ft-se));
398
456
 
@@ -536,7 +594,20 @@
536
594
  --_ctm-mob-dn-wt-hr-se-in-c1,
537
595
  var(--_ctm-tab-dn-wt-hr-se-in-c1, var(--_ctm-dn-wt-hr-se-in-c1))
538
596
  );
539
- --_sf-hr-ue: var(--_ctm-mob-dn-hr-ue, var(--_ctm-tab-dn-hr-ue, var(--_ctm-dn-hr-ue)));
597
+ --_sf-hr-ue: var(
598
+ --_ctm-mob-dn-wt-hr-ue,
599
+ var(--_ctm-tab-dn-wt-hr-ue, var(--_ctm-dn-wt-hr-ue))
600
+ );
601
+
602
+ // for pading and width
603
+ --_sf-hr-pg: var(
604
+ --_ctm-mob-dn-wt-hr-pg,
605
+ var(--_ctm-tab-dn-wt-hr-pg, var(--_ctm-dn-wt-hr-pg))
606
+ );
607
+ --_sf-hr-wh: var(
608
+ --_ctm-mob-dn-wt-hr-wh,
609
+ var(--_ctm-tab-dn-wt-hr-wh, var(--_ctm-dn-wt-hr-wh))
610
+ );
540
611
 
541
612
  &[data-hover-show-shadow="false"] {
542
613
  --_hover-show-shadow: none;
@@ -547,7 +618,6 @@
547
618
  }
548
619
  background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-wt-dt-se-bd-cr));
549
620
 
550
- padding: 5px 10px;
551
621
  display: flex;
552
622
  flex-direction: var(--_sf-fd-bn);
553
623
  align-items: center;
@@ -555,8 +625,8 @@
555
625
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-wt-dt-se-at));
556
626
  gap: var(--_sf-hr-in-ad-tt-sg, prepareMediaVariable(--_ctm-dn-wt-dt-se-in-ad-tt-sg));
557
627
 
558
- width: 100%;
559
- height: 100%;
628
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-wt-dt-se-pg));
629
+ width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-wt-dt-se-wh));
560
630
 
561
631
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-wt-dt-se-br-rs));
562
632
 
@@ -578,8 +648,8 @@
578
648
 
579
649
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-wt-dt-se-cr));
580
650
 
581
- font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-wt-dt-se-ft-fy)),
582
- sans-serif;
651
+ font-family:
652
+ var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-wt-dt-se-ft-fy)), sans-serif;
583
653
 
584
654
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-wt-dt-se-ft-se));
585
655
 
@@ -722,7 +792,20 @@
722
792
  --_ctm-mob-dn-ce-hr-se-in-c1,
723
793
  var(--_ctm-tab-dn-ce-hr-se-in-c1, var(--_ctm-dn-ce-hr-se-in-c1))
724
794
  );
725
- --_sf-hr-ue: var(--_ctm-mob-dn-hr-ue, var(--_ctm-tab-dn-hr-ue, var(--_ctm-dn-hr-ue)));
795
+ --_sf-hr-ue: var(
796
+ --_ctm-mob-dn-ce-hr-ue,
797
+ var(--_ctm-tab-dn-ce-hr-ue, var(--_ctm-dn-ce-hr-ue))
798
+ );
799
+
800
+ // for pading and width
801
+ --_sf-hr-pg: var(
802
+ --_ctm-mob-dn-ce-hr-pg,
803
+ var(--_ctm-tab-dn-ce-hr-pg, var(--_ctm-dn-ce-hr-pg))
804
+ );
805
+ --_sf-hr-wh: var(
806
+ --_ctm-mob-dn-ce-hr-wh,
807
+ var(--_ctm-tab-dn-ce-hr-wh, var(--_ctm-dn-ce-hr-wh))
808
+ );
726
809
 
727
810
  &[data-hover-show-shadow="false"] {
728
811
  --_hover-show-shadow: none;
@@ -733,7 +816,6 @@
733
816
  }
734
817
  background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-ce-dt-se-bd-cr));
735
818
 
736
- padding: 5px 10px;
737
819
  display: flex;
738
820
  flex-direction: var(--_sf-fd-bn);
739
821
  align-items: center;
@@ -741,8 +823,8 @@
741
823
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-ce-dt-se-at));
742
824
  gap: var(--_sf-hr-in-ad-tt-sg, prepareMediaVariable(--_ctm-dn-ce-dt-se-in-ad-tt-sg));
743
825
 
744
- width: 100%;
745
- height: 100%;
826
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-ce-dt-se-pg));
827
+ width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-ce-dt-se-wh));
746
828
 
747
829
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-ce-dt-se-br-rs));
748
830
 
@@ -764,8 +846,8 @@
764
846
 
765
847
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-ce-dt-se-cr));
766
848
 
767
- font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ce-dt-se-ft-fy)),
768
- sans-serif;
849
+ font-family:
850
+ var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ce-dt-se-ft-fy)), sans-serif;
769
851
 
770
852
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-ce-dt-se-ft-se));
771
853
 
@@ -908,7 +990,20 @@
908
990
  --_ctm-mob-dn-ad-to-qe-hr-se-in-c1,
909
991
  var(--_ctm-tab-dn-ad-to-qe-hr-se-in-c1, var(--_ctm-dn-ad-to-qe-hr-se-in-c1))
910
992
  );
911
- --_sf-hr-ue: var(--_ctm-mob-dn-hr-ue, var(--_ctm-tab-dn-hr-ue, var(--_ctm-dn-hr-ue)));
993
+ --_sf-hr-ue: var(
994
+ --_ctm-mob-dn-ad-to-qe-hr-ue,
995
+ var(--_ctm-tab-dn-ad-to-qe-hr-ue, var(--_ctm-dn-ad-to-qe-hr-ue))
996
+ );
997
+
998
+ // for pading and width
999
+ --_sf-hr-pg: var(
1000
+ --_ctm-mob-dn-ad-to-qe-hr-pg,
1001
+ var(--_ctm-tab-dn-ad-to-qe-hr-pg, var(--_ctm-dn-ad-to-qe-hr-pg))
1002
+ );
1003
+ --_sf-hr-wh: var(
1004
+ --_ctm-mob-dn-ad-to-qe-hr-wh,
1005
+ var(--_ctm-tab-dn-ad-to-qe-hr-wh, var(--_ctm-dn-ad-to-qe-hr-wh))
1006
+ );
912
1007
 
913
1008
  &[data-hover-show-shadow="false"] {
914
1009
  --_hover-show-shadow: none;
@@ -919,7 +1014,6 @@
919
1014
  }
920
1015
  background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-ad-to-qe-dt-se-bd-cr));
921
1016
 
922
- padding: 5px 10px;
923
1017
  display: flex;
924
1018
  flex-direction: var(--_sf-fd-bn);
925
1019
  align-items: center;
@@ -927,8 +1021,8 @@
927
1021
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-ad-to-qe-dt-se-at));
928
1022
  gap: var(--_sf-hr-in-ad-tt-sg, prepareMediaVariable(--_ctm-dn-ad-to-qe-dt-se-in-ad-tt-sg));
929
1023
 
930
- width: 100%;
931
- height: 100%;
1024
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-ad-to-qe-dt-se-pg));
1025
+ width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-ad-to-qe-dt-se-wh));
932
1026
 
933
1027
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-ad-to-qe-dt-se-br-rs));
934
1028
 
@@ -950,8 +1044,8 @@
950
1044
 
951
1045
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-ad-to-qe-dt-se-cr));
952
1046
 
953
- font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ad-to-qe-dt-se-ft-fy)),
954
- sans-serif;
1047
+ font-family:
1048
+ var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ad-to-qe-dt-se-ft-fy)), sans-serif;
955
1049
 
956
1050
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-ad-to-qe-dt-se-ft-se));
957
1051
 
@@ -1100,8 +1194,20 @@
1100
1194
  --_ctm-mob-dn-ad-to-or-te-hr-se-in-c1,
1101
1195
  var(--_ctm-tab-dn-ad-to-or-te-hr-se-in-c1, var(--_ctm-dn-ad-to-or-te-hr-se-in-c1))
1102
1196
  );
1103
- --_sf-hr-ue: var(--_ctm-mob-dn-hr-ue, var(--_ctm-tab-dn-hr-ue, var(--_ctm-dn-hr-ue)));
1197
+ --_sf-hr-ue: var(
1198
+ --_ctm-mob-dn-ad-to-or-te-hr-ue,
1199
+ var(--_ctm-tab-dn-ad-to-or-te-hr-ue, var(--_ctm-dn-ad-to-or-te-hr-ue))
1200
+ );
1104
1201
 
1202
+ // for pading and width
1203
+ --_sf-hr-pg: var(
1204
+ --_ctm-mob-dn-ad-to-or-te-hr-pg,
1205
+ var(--_ctm-tab-dn-ad-to-or-te-hr-pg, var(--_ctm-dn-ad-to-or-te-hr-pg))
1206
+ );
1207
+ --_sf-hr-wh: var(
1208
+ --_ctm-mob-dn-ad-to-or-te-hr-wh,
1209
+ var(--_ctm-tab-dn-ad-to-or-te-hr-wh, var(--_ctm-dn-ad-to-or-te-hr-wh))
1210
+ );
1105
1211
  &[data-hover-show-shadow="false"] {
1106
1212
  --_hover-show-shadow: none;
1107
1213
  }
@@ -1125,8 +1231,8 @@
1125
1231
  prepareMediaVariable(--_ctm-dn-ad-to-or-te-dt-se-in-ad-tt-sg)
1126
1232
  );
1127
1233
 
1128
- width: 100%;
1129
- height: 100%;
1234
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-ad-to-or-te-dt-se-pg));
1235
+ width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-ad-to-or-te-dt-se-wh));
1130
1236
 
1131
1237
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-ad-to-or-te-dt-se-br-rs));
1132
1238
 
@@ -1157,8 +1263,8 @@
1157
1263
 
1158
1264
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-ad-to-or-te-dt-se-cr));
1159
1265
 
1160
- font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ad-to-or-te-dt-se-ft-fy)),
1161
- sans-serif;
1266
+ font-family:
1267
+ var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ad-to-or-te-dt-se-ft-fy)), sans-serif;
1162
1268
 
1163
1269
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-ad-to-or-te-dt-se-ft-se));
1164
1270
 
@@ -1306,7 +1412,20 @@
1306
1412
  --_ctm-mob-dn-ny-me-hr-se-in-c1,
1307
1413
  var(--_ctm-tab-dn-ny-me-hr-se-in-c1, var(--_ctm-dn-ny-me-hr-se-in-c1))
1308
1414
  );
1309
- --_sf-hr-ue: var(--_ctm-mob-dn-hr-ue, var(--_ctm-tab-dn-hr-ue, var(--_ctm-dn-hr-ue)));
1415
+ --_sf-hr-ue: var(
1416
+ --_ctm-mob-dn-ny-me-hr-ue,
1417
+ var(--_ctm-tab-dn-ny-me-hr-ue, var(--_ctm-dn-ny-me-hr-ue))
1418
+ );
1419
+
1420
+ // for pading and width
1421
+ --_sf-hr-pg: var(
1422
+ --_ctm-mob-dn-ny-me-hr-pg,
1423
+ var(--_ctm-tab-dn-ny-me-hr-pg, var(--_ctm-dn-ny-me-hr-pg))
1424
+ );
1425
+ --_sf-hr-wh: var(
1426
+ --_ctm-mob-dn-ny-me-hr-wh,
1427
+ var(--_ctm-tab-dn-ny-me-hr-wh, var(--_ctm-dn-ny-me-hr-wh))
1428
+ );
1310
1429
 
1311
1430
  &[data-hover-show-shadow="false"] {
1312
1431
  --_hover-show-shadow: none;
@@ -1317,7 +1436,6 @@
1317
1436
  }
1318
1437
  background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-ny-me-dt-se-bd-cr));
1319
1438
 
1320
- padding: 5px 10px;
1321
1439
  display: flex;
1322
1440
  flex-direction: var(--_sf-fd-bn);
1323
1441
  align-items: center;
@@ -1325,8 +1443,8 @@
1325
1443
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-ny-me-dt-se-at));
1326
1444
  gap: var(--_sf-hr-in-ad-tt-sg, prepareMediaVariable(--_ctm-dn-ny-me-dt-se-in-ad-tt-sg));
1327
1445
 
1328
- width: 100%;
1329
- height: 100%;
1446
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-ny-me-dt-se-pg));
1447
+ width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-ny-me-dt-se-wh));
1330
1448
 
1331
1449
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-ny-me-dt-se-br-rs));
1332
1450
 
@@ -1348,8 +1466,8 @@
1348
1466
 
1349
1467
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-ny-me-dt-se-cr));
1350
1468
 
1351
- font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ny-me-dt-se-ft-fy)),
1352
- sans-serif;
1469
+ font-family:
1470
+ var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-ny-me-dt-se-ft-fy)), sans-serif;
1353
1471
 
1354
1472
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-ny-me-dt-se-ft-se));
1355
1473
 
@@ -1491,7 +1609,20 @@
1491
1609
  --_ctm-mob-dn-dd-hr-se-in-c1,
1492
1610
  var(--_ctm-tab-dn-dd-hr-se-in-c1, var(--_ctm-dn-dd-hr-se-in-c1))
1493
1611
  );
1494
- --_sf-hr-ue: var(--_ctm-mob-dn-hr-ue, var(--_ctm-tab-dn-hr-ue, var(--_ctm-dn-hr-ue)));
1612
+ --_sf-hr-ue: var(
1613
+ --_ctm-mob-dn-dd-hr-ue,
1614
+ var(--_ctm-tab-dn-dd-hr-ue, var(--_ctm-dn-dd-hr-ue))
1615
+ );
1616
+
1617
+ // for pading and width
1618
+ --_sf-hr-pg: var(
1619
+ --_ctm-mob-dn-dd-hr-pg,
1620
+ var(--_ctm-tab-dn-dd-hr-pg, var(--_ctm-dn-dd-hr-pg))
1621
+ );
1622
+ --_sf-hr-wh: var(
1623
+ --_ctm-mob-dn-dd-hr-wh,
1624
+ var(--_ctm-tab-dn-dd-hr-wh, var(--_ctm-dn-dd-hr-wh))
1625
+ );
1495
1626
 
1496
1627
  &[data-hover-show-shadow="false"] {
1497
1628
  --_hover-show-shadow: none;
@@ -1502,7 +1633,6 @@
1502
1633
  }
1503
1634
  background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-dd-dt-se-bd-cr));
1504
1635
 
1505
- padding: 5px 10px;
1506
1636
  display: flex;
1507
1637
  flex-direction: var(--_sf-fd-bn);
1508
1638
  align-items: center;
@@ -1510,8 +1640,8 @@
1510
1640
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-dd-dt-se-at));
1511
1641
  gap: var(--_sf-hr-in-ad-tt-sg, prepareMediaVariable(--_ctm-dn-dd-dt-se-in-ad-tt-sg));
1512
1642
 
1513
- width: 100%;
1514
- height: 100%;
1643
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-dd-dt-se-pg));
1644
+ width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-dd-dt-se-wh));
1515
1645
 
1516
1646
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-dd-dt-se-br-rs));
1517
1647
 
@@ -1533,8 +1663,8 @@
1533
1663
 
1534
1664
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-dd-dt-se-cr));
1535
1665
 
1536
- font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-dd-dt-se-ft-fy)),
1537
- sans-serif;
1666
+ font-family:
1667
+ var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-dd-dt-se-ft-fy)), sans-serif;
1538
1668
 
1539
1669
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-dd-dt-se-ft-se));
1540
1670
 
@@ -1676,7 +1806,20 @@
1676
1806
  --_ctm-mob-dn-me-hr-se-in-c1,
1677
1807
  var(--_ctm-tab-dn-me-hr-se-in-c1, var(--_ctm-dn-me-hr-se-in-c1))
1678
1808
  );
1679
- --_sf-hr-ue: var(--_ctm-mob-dn-hr-ue, var(--_ctm-tab-dn-hr-ue, var(--_ctm-dn-hr-ue)));
1809
+ --_sf-hr-ue: var(
1810
+ --_ctm-mob-dn-me-hr-ue,
1811
+ var(--_ctm-tab-dn-me-hr-ue, var(--_ctm-dn-me-hr-ue))
1812
+ );
1813
+
1814
+ // for pading and width
1815
+ --_sf-hr-pg: var(
1816
+ --_ctm-mob-dn-me-hr-pg,
1817
+ var(--_ctm-tab-dn-me-hr-pg, var(--_ctm-dn-me-hr-pg))
1818
+ );
1819
+ --_sf-hr-wh: var(
1820
+ --_ctm-mob-dn-me-hr-wh,
1821
+ var(--_ctm-tab-dn-me-hr-wh, var(--_ctm-dn-ad-to-ct-hr-wh))
1822
+ );
1680
1823
 
1681
1824
  &[data-hover-show-shadow="false"] {
1682
1825
  --_hover-show-shadow: none;
@@ -1687,7 +1830,6 @@
1687
1830
  }
1688
1831
  background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-me-dt-se-bd-cr));
1689
1832
 
1690
- padding: 5px 10px;
1691
1833
  display: flex;
1692
1834
  flex-direction: var(--_sf-fd-bn);
1693
1835
  align-items: center;
@@ -1695,9 +1837,9 @@
1695
1837
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-me-dt-se-at));
1696
1838
  gap: var(--_sf-hr-in-ad-tt-sg, prepareMediaVariable(--_ctm-dn-me-dt-se-in-ad-tt-sg));
1697
1839
 
1698
- width: 100%;
1840
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-me-dt-se-pg));
1841
+ width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-me-dt-se-wh));
1699
1842
  height: 100%;
1700
-
1701
1843
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-me-dt-se-br-rs));
1702
1844
 
1703
1845
  box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-me-dt-se-sw-ae))
@@ -1718,8 +1860,8 @@
1718
1860
 
1719
1861
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-me-dt-se-cr));
1720
1862
 
1721
- font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-me-dt-se-ft-fy)),
1722
- sans-serif;
1863
+ font-family:
1864
+ var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-me-dt-se-ft-fy)), sans-serif;
1723
1865
 
1724
1866
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-me-dt-se-ft-se));
1725
1867
 
@@ -1756,351 +1898,70 @@
1756
1898
  .dropdown-menu {
1757
1899
  display: block;
1758
1900
  position: absolute;
1759
- top: 78%;
1760
- left: 100%;
1761
- margin-left: 8px;
1762
- background: white;
1763
- border-radius: 8px;
1901
+ top: 110%;
1902
+
1903
+ &[data-position="left"] {
1904
+ left: 0;
1905
+ }
1906
+ &[data-position="right"] {
1907
+ right: 0;
1908
+ }
1909
+ &[data-position="center"] {
1910
+ left: 50%;
1911
+ transform: translateX(-50%);
1912
+ }
1913
+ // top: 78%;
1914
+ // left: 100%;
1915
+ // margin-left: 8px;
1916
+
1764
1917
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
1765
1918
  min-width: 200px;
1766
1919
  z-index: 100;
1767
- padding: 8px 0;
1768
- }
1920
+ display: flex;
1921
+ flex-direction: column;
1922
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-dn-se-pg));
1769
1923
 
1770
- .button_options {
1771
- position: relative;
1772
- .more__button {
1773
- padding: 0.45rem;
1774
- min-width: 50px;
1775
- cursor: pointer;
1776
- display: flex;
1777
- align-items: center;
1778
- justify-content: var(
1779
- --_ctm-mob-dn-me-ad-to-ct-dt-se-at,
1780
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-at, var(--_ctm-dn-me-ad-to-ct-dt-se-at))
1781
- );
1782
- gap: var(
1783
- --_ctm-mob-dn-me-ad-to-ct-dt-se-in-ad-tt-sg,
1784
- var(
1785
- --_ctm-tab-dn-me-ad-to-ct-dt-se-in-ad-tt-sg,
1786
- var(--_ctm-dn-me-ad-to-ct-dt-se-in-ad-tt-sg)
1787
- )
1788
- );
1789
- background-color: var(
1790
- --_sf-at-hr-bd-cr,
1791
- var(
1792
- --_ctm-mob-dn-me-ad-to-ct-dt-se-bd-cr,
1793
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-bd-cr, var(--_ctm-dn-me-ad-to-ct-dt-se-bd-cr))
1794
- )
1795
- );
1796
- border-color: var(
1797
- --_sf-at-hr-br-cr,
1798
- var(
1799
- --_ctm-mob-dn-me-ad-to-ct-dt-se-br-cr,
1800
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-br-cr, var(--_ctm-dn-me-ad-to-ct-dt-se-br-cr))
1801
- )
1802
- );
1803
- border-style: var(
1804
- --_sf-at-hr-br-se,
1805
- var(
1806
- --_ctm-mob-dn-me-ad-to-ct-dt-se-br-se,
1807
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-br-se, var(--_ctm-dn-me-ad-to-ct-dt-se-br-se))
1808
- )
1809
- );
1810
- border-width: var(
1811
- --_sf-at-hr-br-wt,
1924
+ background-color: var(
1925
+ --_ctm-mob-dn-dn-se-bd-cr,
1926
+ var(--_ctm-tab-dn-dn-se-bd-cr, var(--_ctm-dn-dn-se-bd-cr))
1927
+ );
1928
+
1929
+ border-color: var(
1930
+ --_ctm-mob-dn-dn-se-br-cr,
1931
+ var(--_ctm-tab-dn-dn-se-br-cr, var(--_ctm-dn-dn-se-br-cr))
1932
+ );
1933
+
1934
+ border-style: var(
1935
+ --_ctm-mob-dn-dn-se-br-se,
1936
+ var(--_ctm-tab-dn-dn-se-br-se, var(--_ctm-dn-dn-se-br-se))
1937
+ );
1938
+
1939
+ border-width: var(
1940
+ --_ctm-mob-dn-dn-se-br-wh,
1941
+ var(--_ctm-tab-dn-dn-se-br-wh, var(--_ctm-dn-dn-se-br-wh))
1942
+ );
1943
+
1944
+ border-radius: var(
1945
+ --_ctm-mob-dn-dn-se-br-rs,
1946
+ var(--_ctm-tab-dn-dn-se-br-rs, var(--_ctm-dn-dn-se-br-rs))
1947
+ );
1948
+
1949
+ box-shadow: var(
1950
+ --_show-shadow,
1951
+ var(--_ctm-mob-dn-dn-se-sw-ae, var(--_ctm-tab-dn-dn-se-sw-ae, var(--_ctm-dn-dn-se-sw-ae)))
1812
1952
  var(
1813
- --_ctm-mob-dn-me-ad-to-ct-dt-se-br-wh,
1814
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-br-wh, var(--_ctm-dn-me-ad-to-ct-dt-se-br-wh))
1953
+ --_ctm-mob-dn-dn-se-sw-br,
1954
+ var(--_ctm-tab-dn-dn-se-sw-br, var(--_ctm-dn-dn-se-sw-br))
1815
1955
  )
1816
- );
1817
- border-radius: var(
1818
- --_sf-at-hr-br-br,
1819
1956
  var(
1820
- --_ctm-mob-dn-me-ad-to-ct-dt-se-br-rs,
1821
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-br-rs, var(--_ctm-dn-me-ad-to-ct-dt-se-br-rs))
1957
+ --_ctm-mob-dn-dn-se-sw-sd,
1958
+ var(--_ctm-tab-dn-dn-se-sw-sd, var(--_ctm-dn-dn-se-sw-sd))
1822
1959
  )
1823
- );
1824
- box-shadow: var(
1825
- --_hover-show-shadow,
1826
1960
  var(
1827
- --_sf-at-hr-bx-sw,
1828
- var(
1829
- --_show-shadow,
1830
- var(
1831
- --_ctm-mob-dn-me-ad-to-ct-dt-se-sw-ae,
1832
- var(
1833
- --_ctm-tab-dn-me-ad-to-ct-dt-se-sw-ae,
1834
- var(--_ctm-dn-me-ad-to-ct-dt-se-sw-ae)
1835
- )
1836
- )
1837
- var(
1838
- --_ctm-mob-dn-me-ad-to-ct-dt-se-sw-br,
1839
- var(
1840
- --_ctm-tab-dn-me-ad-to-ct-dt-se-sw-br,
1841
- var(--_ctm-dn-me-ad-to-ct-dt-se-sw-br)
1842
- )
1843
- )
1844
- var(
1845
- --_ctm-mob-dn-me-ad-to-ct-dt-se-sw-sd,
1846
- var(
1847
- --_ctm-tab-dn-me-ad-to-ct-dt-se-sw-sd,
1848
- var(--_ctm-dn-me-ad-to-ct-dt-se-sw-sd)
1849
- )
1850
- )
1851
- var(
1852
- --_ctm-mob-dn-me-ad-to-ct-dt-se-sw-cr,
1853
- var(
1854
- --_ctm-tab-dn-me-ad-to-ct-dt-se-sw-cr,
1855
- var(--_ctm-dn-me-ad-to-ct-dt-se-sw-cr)
1856
- )
1857
- )
1858
- )
1961
+ --_ctm-mob-dn-dn-se-sw-cr,
1962
+ var(--_ctm-tab-dn-dn-se-sw-cr, var(--_ctm-dn-dn-se-sw-cr))
1859
1963
  )
1860
- );
1861
- .btn__with__text {
1862
- border: none;
1863
- background-color: transparent;
1864
- color: var(
1865
- --_ctm-mob-dn-me-ad-to-ct-dt-se-cr,
1866
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-cr, var(--_ctm-dn-me-ad-to-ct-dt-se-cr))
1867
- );
1868
- font-family: var(
1869
- --_ctm-mob-dn-me-ad-to-ct-dt-se-ft-fy,
1870
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-ft-fy, var(--_ctm-dn-me-ad-to-ct-dt-se-ft-fy))
1871
- ),
1872
- sans-serif;
1873
- font-size: var(
1874
- --_ctm-mob-dn-me-ad-to-ct-dt-se-ft-se,
1875
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-ft-se, var(--_ctm-dn-me-ad-to-ct-dt-se-ft-se))
1876
- );
1877
- font-weight: var(
1878
- --_ctm-mob-dn-me-ad-to-ct-dt-se-ft-wt,
1879
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-ft-wt, var(--_ctm-dn-me-ad-to-ct-dt-se-ft-wt))
1880
- );
1881
- font-style: var(
1882
- --_ctm-mob-dn-me-ad-to-ct-dt-se-ft-se-ic,
1883
- var(
1884
- --_ctm-tab-dn-me-ad-to-ct-dt-se-ft-se-ic,
1885
- var(--_ctm-dn-me-ad-to-ct-dt-se-ft-se-ic)
1886
- )
1887
- );
1888
- text-align: var(
1889
- --_ctm-mob-dn-me-ad-to-ct-dt-se-tt-an,
1890
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-tt-an, var(--_ctm-dn-me-ad-to-ct-dt-se-tt-an))
1891
- );
1892
- letter-spacing: var(
1893
- --_ctm-mob-dn-me-ad-to-ct-dt-se-lr-sg,
1894
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-lr-sg, var(--_ctm-dn-me-ad-to-ct-dt-se-lr-sg))
1895
- );
1896
- line-height: var(
1897
- --_ctm-mob-dn-me-ad-to-ct-dt-se-le-ht,
1898
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-le-ht, var(--_ctm-dn-me-ad-to-ct-dt-se-le-ht))
1899
- );
1900
- text-decoration: var(
1901
- --_ctm-mob-dn-me-ad-to-ct-dt-se-ue,
1902
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-ue, var(--_ctm-dn-me-ad-to-ct-dt-se-ue))
1903
- );
1904
- }
1905
- span {
1906
- svg {
1907
- width: var(
1908
- --_ctm-mob-dn-me-ad-to-ct-dt-se-in-se,
1909
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-in-se, var(--_ctm-dn-me-ad-to-ct-dt-se-in-se))
1910
- );
1911
- height: var(
1912
- --_ctm-mob-dn-me-ad-to-ct-dt-se-in-se,
1913
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-in-se, var(--_ctm-dn-me-ad-to-ct-dt-se-in-se))
1914
- );
1915
- path {
1916
- stroke: var(
1917
- --_ctm-mob-dn-me-ad-to-ct-dt-se-in-c1,
1918
- var(--_ctm-tab-dn-me-ad-to-ct-dt-se-in-c1, var(--_ctm-dn-me-ad-to-ct-dt-se-in-c1))
1919
- );
1920
- }
1921
- }
1922
- }
1923
- &:hover {
1924
- justify-content: var(
1925
- --_ctm-mob-dn-me-ad-to-ct-hr-se-at,
1926
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-at, var(--_ctm-dn-me-ad-to-ct-hr-se-at))
1927
- );
1928
-
1929
- background-color: var(
1930
- --_sf-at-hr-bd-cr,
1931
- var(
1932
- --_ctm-mob-dn-me-ad-to-ct-hr-se-bd-cr,
1933
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-bd-cr, var(--_ctm-dn-me-ad-to-ct-hr-se-bd-cr))
1934
- )
1935
- );
1936
-
1937
- border-color: var(
1938
- --_sf-at-hr-br-cr,
1939
- var(
1940
- --_ctm-mob-dn-me-ad-to-ct-hr-se-br-cr,
1941
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-br-cr, var(--_ctm-dn-me-ad-to-ct-hr-se-br-cr))
1942
- )
1943
- );
1944
-
1945
- border-style: var(
1946
- --_sf-at-hr-br-se,
1947
- var(
1948
- --_ctm-mob-dn-me-ad-to-ct-hr-se-br-se,
1949
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-br-se, var(--_ctm-dn-me-ad-to-ct-hr-se-br-se))
1950
- )
1951
- );
1952
-
1953
- border-width: var(
1954
- --_sf-at-hr-br-wt,
1955
- var(
1956
- --_ctm-mob-dn-me-ad-to-ct-hr-se-br-wh,
1957
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-br-wh, var(--_ctm-dn-me-ad-to-ct-hr-se-br-wh))
1958
- )
1959
- );
1960
-
1961
- border-radius: var(
1962
- --_sf-at-hr-br-br,
1963
- var(
1964
- --_ctm-mob-dn-me-ad-to-ct-hr-se-br-rs,
1965
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-br-rs, var(--_ctm-dn-me-ad-to-ct-hr-se-br-rs))
1966
- )
1967
- );
1968
-
1969
- box-shadow: var(
1970
- --_hover-show-shadow,
1971
- var(
1972
- --_sf-at-hr-bx-sw,
1973
- var(
1974
- --_show-shadow,
1975
- var(
1976
- --_ctm-mob-dn-me-ad-to-ct-hr-se-sw-ae,
1977
- var(
1978
- --_ctm-tab-dn-me-ad-to-ct-hr-se-sw-ae,
1979
- var(--_ctm-dn-me-ad-to-ct-hr-se-sw-ae)
1980
- )
1981
- )
1982
- var(
1983
- --_ctm-mob-dn-me-ad-to-ct-hr-se-sw-br,
1984
- var(
1985
- --_ctm-tab-dn-me-ad-to-ct-hr-se-sw-br,
1986
- var(--_ctm-dn-me-ad-to-ct-hr-se-sw-br)
1987
- )
1988
- )
1989
- var(
1990
- --_ctm-mob-dn-me-ad-to-ct-hr-se-sw-sd,
1991
- var(
1992
- --_ctm-tab-dn-me-ad-to-ct-hr-se-sw-sd,
1993
- var(--_ctm-dn-me-ad-to-ct-hr-se-sw-sd)
1994
- )
1995
- )
1996
- var(
1997
- --_ctm-mob-dn-me-ad-to-ct-hr-se-sw-cr,
1998
- var(
1999
- --_ctm-tab-dn-me-ad-to-ct-hr-se-sw-cr,
2000
- var(--_ctm-dn-me-ad-to-ct-hr-se-sw-cr)
2001
- )
2002
- )
2003
- )
2004
- )
2005
- );
2006
-
2007
- .btn__with__text {
2008
- border: none;
2009
- background-color: transparent;
2010
- color: var(
2011
- --_ctm-mob-dn-me-ad-to-ct-hr-se-cr,
2012
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-cr, var(--_ctm-dn-me-ad-to-ct-hr-se-cr))
2013
- );
2014
- font-family: var(
2015
- --_ctm-mob-dn-me-ad-to-ct-hr-se-ft-fy,
2016
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-ft-fy, var(--_ctm-dn-me-ad-to-ct-hr-se-ft-fy))
2017
- ),
2018
- sans-serif;
2019
- font-size: var(
2020
- --_ctm-mob-dn-me-ad-to-ct-hr-se-ft-se,
2021
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-ft-se, var(--_ctm-dn-me-ad-to-ct-hr-se-ft-se))
2022
- );
2023
- font-weight: var(
2024
- --_ctm-mob-dn-me-ad-to-ct-hr-se-ft-wt,
2025
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-ft-wt, var(--_ctm-dn-me-ad-to-ct-hr-se-ft-wt))
2026
- );
2027
- font-style: var(
2028
- --_ctm-mob-dn-me-ad-to-ct-hr-se-ft-se-ic,
2029
- var(
2030
- --_ctm-tab-dn-me-ad-to-ct-hr-se-ft-se-ic,
2031
- var(--_ctm-dn-me-ad-to-ct-hr-se-ft-se-ic)
2032
- )
2033
- );
2034
- text-align: var(
2035
- --_ctm-mob-dn-me-ad-to-ct-hr-se-tt-an,
2036
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-tt-an, var(--_ctm-dn-me-ad-to-ct-hr-se-tt-an))
2037
- );
2038
- letter-spacing: var(
2039
- --_ctm-mob-dn-me-ad-to-ct-hr-se-lr-sg,
2040
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-lr-sg, var(--_ctm-dn-me-ad-to-ct-hr-se-lr-sg))
2041
- );
2042
- line-height: var(
2043
- --_ctm-mob-dn-me-ad-to-ct-hr-se-le-ht,
2044
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-le-ht, var(--_ctm-dn-me-ad-to-ct-hr-se-le-ht))
2045
- );
2046
- text-decoration: var(
2047
- --_ctm-mob-dn-me-ad-to-ct-hr-se-ue,
2048
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-ue, var(--_ctm-dn-me-ad-to-ct-hr-se-ue))
2049
- );
2050
- }
2051
-
2052
- span {
2053
- svg {
2054
- width: var(
2055
- --_ctm-mob-dn-me-ad-to-ct-hr-se-in-se,
2056
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-in-se, var(--_ctm-dn-me-ad-to-ct-hr-se-in-se))
2057
- );
2058
- height: var(
2059
- --_ctm-mob-dn-me-ad-to-ct-hr-se-in-se,
2060
- var(--_ctm-tab-dn-me-ad-to-ct-hr-se-in-se, var(--_ctm-dn-me-ad-to-ct-hr-se-in-se))
2061
- );
2062
- path {
2063
- stroke: var(
2064
- --_ctm-mob-dn-me-ad-to-ct-hr-se-in-c1,
2065
- var(
2066
- --_ctm-tab-dn-me-ad-to-ct-hr-se-in-c1,
2067
- var(--_ctm-dn-me-ad-to-ct-hr-se-in-c1)
2068
- )
2069
- );
2070
- }
2071
- }
2072
- }
2073
- }
2074
- }
2075
- .dropdown_buttons {
2076
- position: absolute;
2077
- min-width: 150px;
2078
- width: 80%;
2079
- top: 100%;
2080
- right: 0px;
2081
- border: 1px solid var(--_gray-200);
2082
- border-radius: 8px;
2083
- overflow: hidden;
2084
- margin-top: 2px;
2085
- ul {
2086
- list-style: none;
2087
- max-height: 200px;
2088
- overflow-y: auto;
2089
- li {
2090
- background-color: var(--_base-white);
2091
- padding: 5px;
2092
- color: var(--_gray-700);
2093
- font-size: 14px;
2094
- font-weight: 500;
2095
- cursor: pointer;
2096
- &:hover {
2097
- background-color: var(--_primary-25);
2098
- color: var(--_primary-400);
2099
- cursor: pointer;
2100
- }
2101
- }
2102
- }
2103
- }
1964
+ );
2104
1965
  }
2105
1966
  }
2106
1967
  }