@sc-360-v2/storefront-cms-library 0.4.50 → 0.4.52

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 (39) hide show
  1. package/dist/allocationDetails.scss +2253 -2247
  2. package/dist/builder.js +1 -1
  3. package/dist/cart-details.scss +3207 -3207
  4. package/dist/cart.scss +271 -269
  5. package/dist/cartAttributes.scss +932 -935
  6. package/dist/checkout.scss +6496 -6460
  7. package/dist/dropdownTemplate.scss +4 -1
  8. package/dist/filters.scss +2450 -2418
  9. package/dist/functions.scss +91 -1
  10. package/dist/icon-list.scss +277 -268
  11. package/dist/language-selector.scss +702 -528
  12. package/dist/layouter.scss +307 -294
  13. package/dist/login.scss +1605 -1473
  14. package/dist/menu-v2.scss +752 -730
  15. package/dist/my-templates.scss +464 -463
  16. package/dist/myTemplates.scss +5 -5
  17. package/dist/order-status.scss +1877 -1856
  18. package/dist/product-image-allocation.scss +1365 -0
  19. package/dist/product-image.scss +2 -1
  20. package/dist/product-sizechart.scss +1826 -1826
  21. package/dist/profile.scss +23 -20
  22. package/dist/repeater-embla-controls.scss +6 -0
  23. package/dist/repeater.scss +920 -915
  24. package/dist/search.scss +361 -296
  25. package/dist/section.scss +210 -209
  26. package/dist/static-global.scss +5 -0
  27. package/dist/types/builder/tools/element-edit/bundle.d.ts +13 -2
  28. package/dist/types/builder/tools/element-edit/cart.d.ts +1 -0
  29. package/dist/types/builder/tools/element-edit/common.d.ts +5 -0
  30. package/dist/types/builder/tools/element-edit/icon-list.d.ts +17 -0
  31. package/dist/types/builder/tools/element-edit/language-menu.d.ts +1 -0
  32. package/dist/types/builder/tools/element-edit/login.d.ts +1 -0
  33. package/dist/types/builder/tools/element-edit/orderStatus.d.ts +39 -0
  34. package/dist/types/builder/tools/element-edit/repeater.d.ts +2 -0
  35. package/dist/types/builder/tools/element-edit/resetPassword.d.ts +2 -1
  36. package/dist/types/builder/tools/element-edit/search.d.ts +28 -0
  37. package/dist/types/builder/tools/element-edit/userElements.d.ts +48 -88
  38. package/dist/user-elements.scss +2555 -2471
  39. package/package.json +1 -1
package/dist/repeater.scss CHANGED
@@ -1,915 +1,920 @@
1
- @use "sass:map";
2
- @use "sass:list";
3
- @use "./repeater-embla-controls.scss" as *;
4
- @use "./repeater-grid-toggle.scss" as *;
5
- @use "./functions.scss" as *;
6
- $childItemSelector: '[data-element-type="repeater-item"]';
7
- $sliderControlDragging: "[flex-slider-control-moving='true']";
8
- $rai: "repeater-advertise-item";
9
- [data-div-type="element"] {
10
- &[data-element-type="repeater"] {
11
- // width: var(--_sf-con-nw-wh);
12
- // width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
13
- width: calc(
14
- 1% *
15
- var(
16
- --_ctm-mob-rep-ele-nw-wh-vl,
17
- var(--_ctm-tab-rep-ele-nw-wh-vl, var(--_ctm-rep-ele-nw-wh-vl, auto))
18
- )
19
- );
20
- // width: 100%;
21
- &:not([data-view-state="full"]) {
22
- min-height: var(
23
- --_ctm-mob-rep-lt-ht,
24
- var(--_ctm-tab-rep-lt-ht, var(--_ctm-rep-lt-ht, var(--_ctm-lt-ht, var(--_tst-lt-ht))))
25
- );
26
- }
27
- min-height: var();
28
- margin: var(
29
- --_ctm-mob-rep-lt-mn,
30
- var(--_ctm-tab-rep-lt-mn, var(--_ctm-rep-lt-mn, var(--_ctm-lt-mn, var(--_tst-lt-mn))))
31
- );
32
- background-color: var(
33
- --_ctm-mob-rep-dn-rr-wt-bd-cr,
34
- var(--_ctm-tab-rep-dn-rr-wt-bd-cr, var(--_ctm-rep-dn-rr-wt-bd-cr))
35
- );
36
- background-image: var(
37
- --_ctm-mob-rep-dn-rr-wt-bd-ie,
38
- var(--_ctm-tab-rep-dn-rr-wt-bd-ie, var(--_ctm-rep-dn-rr-wt-bd-ie))
39
- );
40
- background-attachment: var(
41
- --_ctm-mob-rep-dn-rr-wt-bd-at,
42
- var(--_ctm-tab-rep-dn-rr-wt-bd-at, var(--_ctm-rep-dn-rr-wt-bd-at))
43
- );
44
- background-position: var(
45
- --_ctm-mob-rep-dn-rr-wt-bd-pn,
46
- var(--_ctm-tab-rep-dn-rr-wt-bd-pn, var(--_ctm-rep-dn-rr-wt-bd-pn))
47
- );
48
- background-repeat: var(
49
- --_ctm-mob-rep-dn-rr-wt-bd-rt,
50
- var(--_ctm-tab-rep-dn-rr-wt-bd-rt, var(--_ctm-rep-dn-rr-wt-bd-rt))
51
- );
52
- background-size: var(
53
- --_ctm-mob-rep-dn-rr-wt-bd-se,
54
- var(--_ctm-tab-rep-dn-rr-wt-bd-se, var(--_ctm-rep-dn-rr-wt-bd-se))
55
- );
56
- border-radius: var(
57
- --_ctm-mob-rep-dn-rr-wt-br-rs,
58
- var(--_ctm-tab-rep-dn-rr-wt-br-rs, var(--_ctm-rep-dn-rr-wt-br-rs))
59
- );
60
- border-color: var(
61
- --_ctm-mob-rep-dn-rr-wt-br-cr,
62
- var(--_ctm-tab-rep-dn-rr-wt-br-cr, var(--_ctm-rep-dn-rr-wt-br-cr))
63
- );
64
- border-style: var(
65
- --_ctm-mob-rep-dn-rr-wt-br-se,
66
- var(--_ctm-tab-rep-dn-rr-wt-br-se, var(--_ctm-rep-dn-rr-wt-br-se))
67
- );
68
- border-width: var(
69
- --_ctm-mob-rep-dn-rr-wt-br-wh,
70
- var(--_ctm-tab-rep-dn-rr-wt-br-wh, var(--_ctm-rep-dn-rr-wt-br-wh))
71
- );
72
- box-shadow: var(
73
- --_hover-show-shadow,
74
- var(
75
- --_sf-hr-bx-sw,
76
- var(
77
- --_show-shadow,
78
- var(--_ctm-mob-dn-dt-se-sw-ae, var(--_ctm-tab-dn-dt-se-sw-ae, var(--_ctm-dn-dt-se-sw-ae)))
79
- var(
80
- --_ctm-mob-dn-dt-se-sw-br,
81
- var(--_ctm-tab-dn-dt-se-sw-br, var(--_ctm-dn-dt-se-sw-br))
82
- )
83
- var(
84
- --_ctm-mob-dn-dt-se-sw-sd,
85
- var(--_ctm-tab-dn-dt-se-sw-sd, var(--_ctm-dn-dt-se-sw-sd))
86
- )
87
- var(
88
- --_ctm-mob-dn-dt-se-sw-cr,
89
- var(--_ctm-tab-dn-dt-se-sw-cr, var(--_ctm-dn-dt-se-sw-cr))
90
- )
91
- )
92
- )
93
- );
94
- padding: var(--_ctm-mob-rep-lt-pg, var(--_ctm-tab-rep-lt-pg, var(--_ctm-rep-lt-pg)));
95
-
96
- &[data-grid-toggle="enable"] {
97
- position: var(--_p-relative);
98
- @include FlexRepeaterGridToggleCSS();
99
- }
100
-
101
- &.lst_vw {
102
- & > div {
103
- &.wrapper {
104
- display: var(--_d-grid);
105
- row-gap: prepareMediaVariable(--_ctm-rep-lt-im-gp-lt);
106
- grid-template-columns: 100%;
107
- // grid-template-rows: repeat(
108
- // auto-fit,
109
- // minmax(#{prepareMediaVariable(--_ctm-rep-lt-rw-mn-ht-lt)}, 1fr)
110
- // );
111
- // grid-template-rows: repeat(
112
- // 1,
113
- // minmax(#{prepareMediaVariable(--_ctm-rep-lt-rw-mn-ht-lt)}, 1fr)
114
- // );
115
- grid-auto-rows: minmax(#{prepareMediaVariable(--_ctm-rep-lt-rw-mn-ht-lt)}, auto);
116
- width: 100%;
117
-
118
- & > div {
119
- &#{$childItemSelector} {
120
- width: 100%;
121
- }
122
- }
123
- }
124
- }
125
- }
126
- &:not(.lst_vw) {
127
- &.grd {
128
- & > div {
129
- &.wrapper {
130
- width: 100%;
131
- display: grid;
132
- grid-template-columns: repeat(
133
- auto-fit,
134
- minmax(
135
- var(
136
- --_ctm-mob-rep-lt-mn-cn-wh,
137
- var(--_ctm-tab-rep-lt-mn-cn-wh, var(--_ctm-rep-lt-mn-cn-wh))
138
- ),
139
- 1fr
140
- )
141
- );
142
- grid-template-rows: repeat(
143
- auto-fit,
144
- minmax(
145
- var(
146
- --_ctm-mob-rep-lt-mn-rw-ht,
147
- var(--_ctm-tab-rep-lt-mn-rw-ht, var(--_ctm-rep-lt-mn-rw-ht))
148
- ),
149
- 1fr
150
- )
151
- );
152
-
153
- div {
154
- &#{$childItemSelector},
155
- &.#{$rai} {
156
- width: 100%;
157
- }
158
- }
159
- }
160
- }
161
- }
162
-
163
- &.crds {
164
- & > div {
165
- &.wrapper {
166
- display: flex !important;
167
- flex-wrap: wrap;
168
- width: 100%;
169
- height: auto !important;
170
- min-height: 100px !important;
171
- }
172
- }
173
- &:not(.stimsfrRws) {
174
- & > div {
175
- &.wrapper {
176
- justify-content: center;
177
- & > div {
178
- &#{$childItemSelector},
179
- &.#{$rai} {
180
- // width: var(--_ctm-rep-lt-wh);
181
- --_col-count: var(--_sf-gd-ct, 3);
182
- --_col-gap: 0px;
183
- width: 163px;
184
- height: 100px;
185
- // grid-template-rows: minmax(
186
- // max(
187
- // 0.5px,
188
- // 0.0896337 * (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))
189
- // ),
190
- // auto
191
- // );
192
- // grid-template-rows: ;
193
- }
194
- }
195
- }
196
- }
197
- }
198
-
199
- &.stimsfrRws {
200
- & > div {
201
- &.wrapper {
202
- align-self: center;
203
- & > div {
204
- &#{$childItemSelector},
205
- &.#{$rai} {
206
- // --_col-count: var(--_sf-gd-ct, 3);
207
- --_col-count: var(
208
- --_ctm-mob-rep-lt-st-is-pr-rw,
209
- var(--_ctm-tab-rep-lt-st-is-pr-rw, var(--_ctm-rep-lt-st-is-pr-rw, 3))
210
- );
211
- --_col-gap: var(
212
- --_ctm-mob-rep-lt-im-gp,
213
- var(--_ctm-tab-rep-lt-im-gp, var(--_ctm-rep-lt-im-gp, 0px))
214
- );
215
- width: calc(
216
- (100% / var(--_col-count)) -
217
- (((var(--_col-count) - 1) * var(--_col-gap)) / (var(--_col-count)))
218
- );
219
- flex: 0 0
220
- calc(
221
- (100% / var(--_col-count)) -
222
- (((var(--_col-count) - 1) * var(--_col-gap)) / (var(--_col-count)))
223
- );
224
- align-self: stretch;
225
- // height: 100px;
226
- grid-template-rows: minmax(
227
- max(
228
- 0.5px,
229
- 0.09375 * (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))
230
- ),
231
- auto
232
- );
233
- grid-template-columns: minmax(0px, 1fr);
234
- // min-height: 50px !important;
235
- grid-template-rows:
236
- minmax(
237
- max(0.5px, 0.09375 * (var(--scaling-factor) - var(--scrollbar-width))),
238
- auto
239
- )
240
- minmax(
241
- max(0.5px, 0.09375 * (var(--scaling-factor) - var(--scrollbar-width))),
242
- auto
243
- );
244
- }
245
- }
246
- }
247
- }
248
- }
249
- }
250
- &.sld {
251
- &:is(:not(#{$sliderControlDragging} *)) {
252
- overflow: clip;
253
- }
254
- height: auto;
255
- --_sf-sl-ct-ic-dt-at-cl: var(
256
- --_ctm-mob-rep-lt-cl-ae-cr,
257
- var(--_ctm-tab-rep-lt-cl-ae-cr, var(--_ctm-rep-lt-cl-ae-cr))
258
- );
259
- // &:is([data-control-type="1"]) {
260
- // @include CMSRepeaterEmblaControlStyles(1);
261
- // }
262
- @for $i from 1 through 3 {
263
- &:is([data-control-type="#{$i}"]) {
264
- @if ($i == 3) {
265
- overflow-y: visible;
266
- }
267
- @include CMSRepeaterEmblaControlStyles($i);
268
- }
269
- }
270
-
271
- & > div {
272
- &.wrapper {
273
- &.embla__container {
274
- display: flex !important;
275
- --_embla-slide-space: var(
276
- --_ctm-mob-rep-lt-im-gp,
277
- var(--_ctm-tab-rep-lt-im-gp, var(--_ctm-rep-lt-im-gp))
278
- );
279
- min-height: 100px !important;
280
- --_embla-col-count: var(
281
- --_ctm-mob-rep-lt-st-is-pr-se,
282
- var(--_ctm-tab-rep-lt-st-is-pr-se, var(--_ctm-rep-lt-st-is-pr-se, 3))
283
- );
284
- // gap: 0px !important;
285
- // margin-left: calc(var(--_embla-slide-space, 10px) * -1);
286
- width: 100%;
287
- height: 100%;
288
- & > .embla__slide {
289
- --_sf-cl-vl: calc(
290
- (100% / var(--_embla-col-count, 3)) -
291
- (
292
- ((var(--_embla-col-count, 3) - 1) * (var(--_embla-slide-space, 10px))) /
293
- (var(--_embla-col-count, 3))
294
- )
295
- );
296
- // flex: 0 0 calc(var(--_embla-slide-width, 100%) / var(--_embla-col-count, 3));
297
- // width: calc(var(--_embla-slide-width, 100%) / var(--_embla-col-count, 3));
298
- flex: 0 0 var(--_sf-cl-vl);
299
- width: var(--_sf-cl-vl);
300
- // grid-template-rows: minmax(
301
- // max(0.5px, 0.09375 * (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))),
302
- // auto
303
- // );
304
- grid-template-rows: minmax(50px, auto);
305
- grid-template-columns: minmax(0px, 1fr);
306
- // padding-left: calc(var(--_embla-slide-space, 10px) * 1);
307
- // padding-left: 0px !important;
308
-
309
- img {
310
- width: 100%;
311
- }
312
- }
313
- }
314
- }
315
- }
316
- }
317
- & > div {
318
- &.wrapper {
319
- gap: var(
320
- --_ctm-mob-rep-lt-im-gp,
321
- var(--_ctm-tab-rep-lt-im-gp, var(--_ctm-rep-lt-im-gp, 0px))
322
- );
323
- // width: 100%;
324
- // grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
325
- // grid-auto-rows: minmax(100px, 1fr);
326
- }
327
- }
328
- }
329
- .repeater-advertise-item {
330
- display: flex;
331
- justify-content: center;
332
- align-items: center;
333
- img {
334
- // width: 100%;
335
- // height: 100%;
336
- object-fit: cover;
337
- object-position: center center;
338
- max-width: 100%;
339
- max-height: 100%;
340
- }
341
- }
342
-
343
- // .action__button {
344
- // display: flex;
345
- // align-items: center;
346
- // height: 40px;
347
- // cursor: pointer;
348
- // .btn__container {
349
- // display: flex;
350
- // align-items: center;
351
- // justify-content: center;
352
- // gap: 10px;
353
- // height: 100%;
354
- // width: 100%;
355
- // padding: 16px;
356
- // .btn__with__text {
357
- // height: 2.5rem;
358
- // }
359
- // }
360
- // &.loadMore {
361
- // background-color: var(
362
- // --_sf-at-hr-bd-cr,
363
- // var(
364
- // --_ctm-mob-rep-dn-bn-se-dt-se-bd-cr,
365
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-bd-cr, var(--_ctm-rep-dn-bn-se-dt-se-bd-cr))
366
- // )
367
- // );
368
- // border-color: var(
369
- // --_sf-at-hr-br-cr,
370
- // var(
371
- // --_ctm-mob-rep-dn-bn-se-dt-se-br-cr,
372
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-br-cr, var(--_ctm-rep-dn-bn-se-dt-se-br-cr))
373
- // )
374
- // );
375
- // border-style: var(
376
- // --_sf-at-hr-br-se,
377
- // var(
378
- // --_ctm-mob-rep-dn-bn-se-dt-se-br-se,
379
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-br-se, var(--_ctm-rep-dn-bn-se-dt-se-br-se))
380
- // )
381
- // );
382
- // border-width: var(
383
- // --_sf-at-hr-br-wt,
384
- // var(
385
- // --_ctm-mob-rep-dn-bn-se-dt-se-br-wh,
386
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-br-wh, var(--_ctm-rep-dn-bn-se-dt-se-br-wh))
387
- // )
388
- // );
389
- // border-radius: var(
390
- // --_sf-at-hr-br-br,
391
- // var(
392
- // --_ctm-mob-rep-dn-bn-se-dt-se-br-rs,
393
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-br-rs, var(--_ctm-rep-dn-bn-se-dt-se-br-rs))
394
- // )
395
- // );
396
-
397
- // box-shadow: var(
398
- // --_hover-show-shadow,
399
- // var(
400
- // --_sf-at-hr-bx-sw,
401
- // var(
402
- // --_show-shadow,
403
- // var(
404
- // --_ctm-mob-rep-dn-bn-se-dt-se-sw-ae,
405
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-ae, var(--_ctm-rep-dn-bn-se-dt-se-sw-ae))
406
- // )
407
- // var(
408
- // --_ctm-mob-rep-dn-bn-se-dt-se-sw-br,
409
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-br, var(--_ctm-rep-dn-bn-se-dt-se-sw-br))
410
- // )
411
- // var(
412
- // --_ctm-mob-rep-dn-bn-se-dt-se-sw-sd,
413
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-sd, var(--_ctm-rep-dn-bn-se-dt-se-sw-sd))
414
- // )
415
- // var(
416
- // --_ctm-mob-rep-dn-bn-se-dt-se-sw-cr,
417
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-cr, var(--_ctm-rep-dn-bn-se-dt-se-sw-cr))
418
- // )
419
- // )
420
- // )
421
- // );
422
-
423
- // .btn__container {
424
- // gap: var(
425
- // --_ctm-mob-rep-dn-bn-se-dt-se-gp,
426
- // var(
427
- // --_ctm-tab-rep-dn-bn-se-dt-se-gp,
428
- // var(--_ctm-rep-dn-bn-se-dt-se-gp)
429
- // )
430
- // );
431
- // justify-content: var(
432
- // --_ctm-mob-rep-dn-bn-se-dt-se-at,
433
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-at, var(--_ctm-rep-dn-bn-se-dt-se-at))
434
- // );
435
-
436
- // &[data-actions-icon-position="left"],
437
- // &[data-actions-icon-position="center"] {
438
- // flex-direction: row;
439
- // }
440
- // &[data-actions-icon-position="right"] {
441
- // flex-direction: row-reverse;
442
- // }
443
- // span {
444
- // svg {
445
- // width: var(
446
- // --_ctm-mob-rep-dn-bn-se-dt-se-in-se,
447
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-in-se, var(--_ctm-rep-dn-bn-se-dt-se-in-se))
448
- // );
449
- // height: var(
450
- // --_ctm-mob-rep-dn-bn-se-dt-se-in-se,
451
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-in-se, var(--_ctm-rep-dn-bn-se-dt-se-in-se))
452
- // );
453
-
454
- // path {
455
- // stroke: var(
456
- // --_ctm-mob-rep-dn-bn-se-dt-se-in-c1,
457
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-in-c1, var(--_ctm-rep-dn-bn-se-dt-se-in-c1))
458
- // );
459
- // }
460
- // }
461
- // }
462
- // .btn__with__text {
463
- // border: none;
464
- // background-color: transparent;
465
- // color: var(
466
- // --_ctm-mob-rep-dn-bn-se-dt-se-cr,
467
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-cr, var(--_ctm-rep-dn-bn-se-dt-se-cr))
468
- // );
469
- // font-family: var(
470
- // --_ctm-mob-rep-dn-bn-se-dt-se-ft-fy,
471
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-fy, var(--_ctm-rep-dn-bn-se-dt-se-ft-fy))
472
- // ),
473
- // font-size: var(
474
- // --_ctm-mob-rep-dn-bn-se-dt-se-ft-se,
475
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-se, var(--_ctm-rep-dn-bn-se-dt-se-ft-se))
476
- // );
477
- // font-weight: var(
478
- // --_ctm-mob-rep-dn-bn-se-dt-se-ft-wt,
479
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-wt, var(--_ctm-rep-dn-bn-se-dt-se-ft-wt))
480
- // );
481
- // font-style: var(
482
- // --_ctm-mob-rep-dn-bn-se-dt-se-ft-se-ic,
483
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-se-ic, var(--_ctm-rep-dn-bn-se-dt-se-ft-se-ic))
484
- // );
485
- // text-align: var(
486
- // --_ctm-mob-rep-dn-bn-se-dt-se-tt-an,
487
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-tt-an, var(--_ctm-rep-dn-bn-se-dt-se-tt-an))
488
- // );
489
- // letter-spacing: var(
490
- // --_ctm-mob-rep-dn-bn-se-dt-se-lr-sg,
491
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-lr-sg, var(--_ctm-rep-dn-bn-se-dt-se-lr-sg))
492
- // );
493
- // line-height: var(
494
- // --_ctm-mob-rep-dn-bn-se-dt-se-le-ht,
495
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-le-ht, var(--_ctm-rep-dn-bn-se-dt-se-le-ht))
496
- // );
497
- // text-decoration: var(
498
- // --_ctm-mob-rep-dn-bn-se-dt-se-ue,
499
- // var(--_ctm-tab-rep-dn-bn-se-dt-se-ue, var(--_ctm-rep-dn-bn-se-dt-se-ue))
500
- // );
501
- // }
502
-
503
- // &:hover {
504
- // background-color: var(
505
- // --_sf-at-hr-bd-cr,
506
- // var(
507
- // --_ctm-mob-rep-dn-bn-se-hr-se-bd-cr,
508
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-bd-cr, var(--_ctm-rep-dn-bn-se-hr-se-bd-cr))
509
- // )
510
- // );
511
- // border-color: var(
512
- // --_sf-at-hr-br-cr,
513
- // var(
514
- // --_ctm-mob-rep-dn-bn-se-hr-se-br-cr,
515
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-br-cr, var(--_ctm-rep-dn-bn-se-hr-se-br-cr))
516
- // )
517
- // );
518
- // border-style: var(
519
- // --_sf-at-hr-br-se,
520
- // var(
521
- // --_ctm-mob-rep-dn-bn-se-hr-se-br-se,
522
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-br-se, var(--_ctm-rep-dn-bn-se-hr-se-br-se))
523
- // )
524
- // );
525
- // border-width: var(
526
- // --_sf-at-hr-br-wt,
527
- // var(
528
- // --_ctm-mob-rep-dn-bn-se-hr-se-br-wh,
529
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-br-wh, var(--_ctm-rep-dn-bn-se-hr-se-br-wh))
530
- // )
531
- // );
532
- // border-radius: var(
533
- // --_sf-at-hr-br-br,
534
- // var(
535
- // --_ctm-mob-rep-dn-bn-se-hr-se-br-rs,
536
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-br-rs, var(--_ctm-rep-dn-bn-se-hr-se-br-rs))
537
- // )
538
- // );
539
- // box-shadow: var(
540
- // --_hover-show-shadow,
541
- // var(
542
- // --_sf-at-hr-bx-sw,
543
- // var(
544
- // --_show-shadow,
545
- // var(
546
- // --_ctm-mob-rep-dn-bn-se-hr-se-sw-ae,
547
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-sw-ae, var(--_ctm-rep-dn-bn-se-hr-se-sw-ae))
548
- // )
549
- // var(
550
- // --_ctm-mob-rep-dn-bn-se-hr-se-sw-br,
551
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-sw-br, var(--_ctm-rep-dn-bn-se-hr-se-sw-br))
552
- // )
553
- // var(
554
- // --_ctm-mob-rep-dn-bn-se-hr-se-sw-sd,
555
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-sw-sd, var(--_ctm-rep-dn-bn-se-hr-se-sw-sd))
556
- // )
557
- // var(
558
- // --_ctm-mob-rep-dn-bn-se-hr-se-sw-cr,
559
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-sw-cr, var(--_ctm-rep-dn-bn-se-hr-se-sw-cr))
560
- // )
561
- // )
562
- // )
563
- // );
564
-
565
- // .btn__container {
566
- // gap: var(
567
- // --_ctm-mob-rep-dn-bn-se-hr-se-gp,
568
- // var(
569
- // --_ctm-tab-rep-dn-bn-se-hr-se-gp,
570
- // var(--_ctm-rep-dn-bn-se-hr-se-gp)
571
- // )
572
- // );
573
- // justify-content: var(
574
- // --_ctm-mob-rep-dn-bn-se-hr-se-at,
575
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-at, var(--_ctm-rep-dn-bn-se-hr-se-at))
576
- // );
577
-
578
- // &[data-actions-icon-position-hover="left"],
579
- // &[data-actions-icon-position-hover="center"] {
580
- // flex-direction: row;
581
- // }
582
- // &[data-actions-icon-position-hover="right"] {
583
- // flex-direction: row-reverse;
584
- // }
585
- // span {
586
- // svg {
587
- // width: var(
588
- // --_ctm-mob-rep-dn-bn-se-hr-se-in-se,
589
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-in-se, var(--_ctm-rep-dn-bn-se-hr-se-in-se))
590
- // );
591
- // height: var(
592
- // --_ctm-mob-rep-dn-bn-se-hr-se-in-se,
593
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-in-se, var(--_ctm-rep-dn-bn-se-hr-se-in-se))
594
- // );
595
-
596
- // path {
597
- // stroke: var(
598
- // --_ctm-mob-rep-dn-bn-se-hr-se-in-c1,
599
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-in-c1, var(--_ctm-rep-dn-bn-se-hr-se-in-c1))
600
- // );
601
- // }
602
- // }
603
- // }
604
- // .btn__with__text {
605
- // border: none;
606
- // background-color: transparent;
607
- // color: var(
608
- // --_ctm-mob-rep-dn-bn-se-hr-se-cr,
609
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-cr, var(--_ctm-rep-dn-bn-se-hr-se-cr))
610
- // );
611
- // font-family: var(
612
- // --_ctm-mob-rep-dn-bn-se-hr-se-ft-fy,
613
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-ft-fy, var(--_ctm-rep-dn-bn-se-hr-se-ft-fy))
614
- // ),
615
- // font-size: var(
616
- // --_ctm-mob-rep-dn-bn-se-hr-se-ft-se,
617
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-ft-se, var(--_ctm-rep-dn-bn-se-hr-se-ft-se))
618
- // );
619
- // font-weight: var(
620
- // --_ctm-mob-rep-dn-bn-se-hr-se-ft-wt,
621
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-ft-wt, var(--_ctm-rep-dn-bn-se-hr-se-ft-wt))
622
- // );
623
- // font-style: var(
624
- // --_ctm-mob-rep-dn-bn-se-hr-se-ft-se-ic,
625
- // var(
626
- // --_ctm-tab-rep-dn-bn-se-hr-se-ft-se-ic,
627
- // var(--_ctm-rep-dn-bn-se-hr-se-ft-se-ic)
628
- // )
629
- // );
630
- // text-align: var(
631
- // --_ctm-mob-rep-dn-bn-se-hr-se-tt-an,
632
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-tt-an, var(--_ctm-rep-dn-bn-se-hr-se-tt-an))
633
- // );
634
- // letter-spacing: var(
635
- // --_ctm-mob-rep-dn-bn-se-hr-se-lr-sg,
636
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-lr-sg, var(--_ctm-rep-dn-bn-se-hr-se-lr-sg))
637
- // );
638
- // line-height: var(
639
- // --_ctm-mob-rep-dn-bn-se-hr-se-le-ht,
640
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-le-ht, var(--_ctm-rep-dn-bn-se-hr-se-le-ht))
641
- // );
642
- // text-decoration: var(
643
- // --_ctm-mob-rep-dn-bn-se-hr-se-ue,
644
- // var(--_ctm-tab-rep-dn-bn-se-hr-se-ue, var(--_ctm-rep-dn-bn-se-hr-se-ue))
645
- // );
646
- // }
647
- // }
648
- // }
649
- // }
650
- // }
651
- // }
652
-
653
- .repeater__button__container {
654
- display: flex;
655
-
656
- &[data-button-alignment-default-state="flex-start"] {
657
- justify-content: flex-start;
658
- }
659
-
660
- &[data-button-alignment-default-state="center"] {
661
- justify-content: center;
662
- }
663
-
664
- &[data-button-alignment-default-state="flex-end"] {
665
- justify-content: flex-end;
666
- }
667
-
668
- &[data-button-alignment-hover-state="flex-start"]:hover {
669
- justify-content: flex-start;
670
- }
671
- &[data-button-alignment-hover-state="center"]:hover {
672
- justify-content: center;
673
- }
674
- &[data-button-alignment-hover-state="flex-end"]:hover {
675
- justify-content: flex-end;
676
- }
677
- }
678
-
679
- .btn__with__text[data-btn-name="loadmoreButton"] {
680
- justify-content: center;
681
- &[data-show-shadow="false"] {
682
- --_show-shadow: none;
683
- }
684
- &[data-icon-position="left"] {
685
- --_sf-fd-bn: row;
686
- }
687
- &[data-icon-position="right"] {
688
- --_sf-fd-bn: row-reverse;
689
- }
690
- &[data-icon-position="center"] {
691
- --_sf-fd-bn: row;
692
- }
693
- // &:has(p) {
694
- // width: auto;
695
- // }
696
-
697
- &:hover {
698
- --_sf-hr-bd-cr: var(
699
- --_ctm-rep-mob-dn-bn-se-hr-se-bd-cr,
700
- var(--_ctm-rep-tab-dn-bn-se-hr-se-bd-cr, var(--_ctm-rep-dn-bn-se-hr-se-bd-cr))
701
- );
702
- --_sf-hr-br-cr: var(
703
- --_ctm-rep-mob-dn-bn-se-hr-se-br-cr,
704
- var(--_ctm-rep-tab-dn-bn-se-hr-se-br-cr, var(--_ctm-rep-dn-bn-se-hr-se-br-cr))
705
- );
706
- --_sf-hr-br-se: var(
707
- --_ctm-rep-mob-dn-bn-se-hr-se-br-se,
708
- var(--_ctm-rep-tab-dn-bn-se-hr-se-br-se, var(--_ctm-rep-dn-bn-se-hr-se-br-se))
709
- );
710
- --_sf-hr-br-wh: var(
711
- --_ctm-rep-mob-dn-bn-se-hr-se-br-wh,
712
- var(--_ctm-rep-tab-dn-bn-se-hr-se-br-wh, var(--_ctm-rep-dn-bn-se-hr-se-br-wh))
713
- );
714
- --_sf-hr-br-rs: var(
715
- --_ctm-rep-mob-dn-bn-se-hr-se-br-rs,
716
- var(--_ctm-rep-tab-dn-bn-se-hr-se-br-rs, var(--_ctm-rep-dn-bn-se-hr-se-br-rs))
717
- );
718
- --_sf-hr-at: var(
719
- --_ctm-rep-mob-dn-bn-se-hr-se-at,
720
- var(--_ctm-rep-tab-dn-bn-se-hr-se-at, var(--_ctm-rep-dn-bn-se-hr-se-at))
721
- );
722
- --_sf-hr-gp: var(
723
- --_ctm-rep-mob-dn-bn-se-hr-se-gp,
724
- var(--_ctm-rep-tab-dn-bn-se-hr-se-gp, var(--_ctm-rep-dn-bn-se-hr-se-gp))
725
- );
726
-
727
- // for shadow
728
- --_sf-hr-sw-ae: var(
729
- --_ctm-rep-mob-dn-bn-se-hr-se-sw-ae,
730
- var(--_ctm-rep-tab-dn-bn-se-hr-se-sw-ae, var(--_ctm-rep-dn-bn-se-hr-se-sw-ae))
731
- );
732
- --_sf-hr-sw-br: var(
733
- --_ctm-rep-mob-dn-bn-se-hr-se-sw-br,
734
- var(--_ctm-rep-tab-dn-bn-se-hr-se-sw-br, var(--_ctm-rep-dn-bn-se-hr-se-sw-br))
735
- );
736
- --_sf-hr-sw-hr: var(
737
- --_ctm-rep-mob-dn-bn-se-hr-se-sw-hr,
738
- var(--_ctm-rep-tab-dn-bn-se-hr-se-sw-hr, var(--_ctm-rep-dn-bn-se-hr-se-sw-hr))
739
- );
740
- --_sf-hr-sw-cr: var(
741
- --_ctm-rep-mob-dn-bn-se-hr-se-sw-cr,
742
- var(--_ctm-rep-tab-dn-bn-se-hr-se-sw-cr, var(--_ctm-rep-dn-bn-se-hr-se-sw-cr))
743
- );
744
-
745
- // for font
746
-
747
- --_sf-hr-cr: var(
748
- --_ctm-rep-mob-dn-bn-se-hr-se-cr,
749
- var(--_ctm-rep-tab-dn-bn-se-hr-se-cr, var(--_ctm-rep-dn-bn-se-hr-se-cr))
750
- );
751
- --_sf-hr-ft-fy: var(
752
- --_ctm-rep-mob-dn-bn-se-hr-se-ft-fy,
753
- var(--_ctm-rep-tab-dn-bn-se-hr-se-ft-fy, var(--_ctm-rep-dn-bn-se-hr-se-ft-fy))
754
- );
755
- --_sf-hr-ft-se: var(
756
- --_ctm-rep-mob-dn-bn-se-hr-se-ft-se,
757
- var(--_ctm-rep-tab-dn-bn-se-hr-se-ft-se, var(--_ctm-rep-dn-bn-se-hr-se-ft-se))
758
- );
759
- --_sf-hr-ft-wt: var(
760
- --_ctm-rep-mob-dn-bn-se-hr-se-ft-wt,
761
- var(--_ctm-rep-tab-dn-bn-se-hr-se-ft-wt, var(--_ctm-rep-dn-bn-se-hr-se-ft-wt))
762
- );
763
- --_sf-hr-ft-se-ic: var(
764
- --_ctm-rep-mob-dn-bn-se-hr-se-ft-se-ic,
765
- var(--_ctm-rep-tab-dn-bn-se-hr-se-ft-se-ic, var(--_ctm-rep-dn-bn-se-hr-se-ft-se-ic))
766
- );
767
- --_sf-hr-tt-an: var(
768
- --_ctm-rep-mob-dn-bn-se-hr-se-tt-an,
769
- var(--_ctm-rep-tab-dn-bn-se-hr-se-tt-an, var(--_ctm-rep-dn-bn-se-hr-se-tt-an))
770
- );
771
- --_sf-hr-lr-sg: var(
772
- --_ctm-rep-mob-dn-bn-se-hr-se-lr-sg,
773
- var(--_ctm-rep-tab-dn-bn-se-hr-se-lr-sg, var(--_ctm-rep-dn-bn-se-hr-se-lr-sg))
774
- );
775
- --_sf-hr-le-ht: var(
776
- --_ctm-rep-mob-dn-bn-se-hr-se-le-ht,
777
- var(--_ctm-rep-tab-dn-bn-se-hr-se-le-ht, var(--_ctm-rep-dn-bn-se-hr-se-le-ht))
778
- );
779
-
780
- --_sf-hr-in-se: var(
781
- --_ctm-rep-mob-dn-bn-se-hr-se-in-se,
782
- var(--_ctm-rep-tab-dn-bn-se-hr-se-in-se, var(--_ctm-rep-dn-bn-se-hr-se-in-se))
783
- );
784
- --_sf-hr-in-se: var(
785
- --_ctm-rep-mob-dn-bn-se-hr-se-in-se,
786
- var(--_ctm-rep-tab-dn-bn-se-hr-se-in-se, var(--_ctm-rep-dn-bn-se-hr-se-in-se))
787
- );
788
- --_sf-hr-in-c1: var(
789
- --_ctm-rep-mob-dn-bn-se-hr-se-in-c1,
790
- var(--_ctm-rep-tab-dn-bn-se-hr-se-in-c1, var(--_ctm-rep-dn-bn-se-hr-se-in-c1))
791
- );
792
- --_sf-hr-ue: var(
793
- --_ctm-rep-mob-dn-bn-se-hr-se-ue,
794
- var(--_ctm-rep-tab-dn-bn-se-hr-se-ue, var(--_ctm-rep-dn-bn-se-hr-se-ue))
795
- );
796
-
797
- // for pading and width
798
- --_sf-hr-pg: var(
799
- --_ctm-rep-mob-dn-bn-se-hr-pg,
800
- var(--_ctm-rep-tab-dn-bn-se-hr-pg, var(--_ctm-rep-dn-bn-se-hr-pg))
801
- );
802
- --_sf-hr-wh: var(
803
- --_ctm-rep-mob-dn-bn-se-hr-wh,
804
- var(--_ctm-rep-tab-dn-bn-se-hr-wh, var(--_ctm-rep-dn-bn-se-hr-wh))
805
- );
806
-
807
- &[data-hover-show-shadow="false"] {
808
- --_hover-show-shadow: none;
809
- }
810
- &[data-hover-show-icon="false"] {
811
- --_hover-show-icon: none;
812
- }
813
- }
814
- background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-bd-cr));
815
-
816
- padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-pg));
817
- width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-wh));
818
- display: flex;
819
- flex-direction: var(--_sf-fd-bn);
820
- align-items: center;
821
-
822
- justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-at));
823
- gap: var(--_sf-hr-gp, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-gp));
824
-
825
- border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-br-rs));
826
-
827
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-sw-ae))
828
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-sw-br))
829
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-sw-sd))
830
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-sw-cr));
831
-
832
- &[data-show-border="true"] {
833
- border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-br-cr));
834
-
835
- border-style: var(--_sf-hr-br-se, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-br-se));
836
-
837
- border-width: var(--_sf-hr-br-wh, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-br-wh));
838
- }
839
-
840
- .txt {
841
- display: flex;
842
-
843
- color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-cr));
844
-
845
- font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-ft-fy));
846
-
847
- font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-ft-se));
848
-
849
- font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-ft-wt));
850
-
851
- font-style: var(
852
- --_sf-hr-ft-se-ic,
853
- prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-ft-se-ic)
854
- );
855
-
856
- text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-tt-an));
857
-
858
- letter-spacing: var(--_sf-hr-lr-sg, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-lr-sg));
859
-
860
- line-height: var(--_sf-hr-le-ht, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-le-ht));
861
-
862
- text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-rep-dn-dt-ue));
863
- }
864
-
865
- .icon {
866
- display: var(--_hover-show-icon, var(--_show-icon, flex));
867
- svg {
868
- width: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-in-se));
869
- height: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-in-se));
870
-
871
- path {
872
- stroke: var(--_sf-hr-in-c1, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-in-c1));
873
- }
874
- }
875
- }
876
- [data-element-style="Text"] {
877
- display: inline-block;
878
- width: 100%;
879
- }
880
-
881
- .icon--hover {
882
- // position: absolute;
883
- // inset: 0;
884
- // opacity: 0;
885
- display: none;
886
- transition: opacity 0.2s ease;
887
- }
888
-
889
- &:hover .icon--hover {
890
- // opacity: 1;
891
- display: flex;
892
- }
893
-
894
- &:hover .icon--default {
895
- // opacity: 0;
896
- display: none;
897
- }
898
- }
899
-
900
- // &[data-view-state="full"] {
901
- // width: auto;
902
- // margin: 0;
903
- // justify-self: stretch !important;
904
- // align-self: stretch !important;
905
- // cursor: auto;
906
-
907
- // & > div {
908
- // &[data-div-type="wrapper__layer"] {
909
- // --_sf-vt-zz: visible;
910
- // --_sf-op-zz: 1;
911
- // }
912
- // }
913
- // }
914
- }
915
- }
1
+ @use "sass:map";
2
+ @use "sass:list";
3
+ @use "./repeater-embla-controls.scss" as *;
4
+ @use "./repeater-grid-toggle.scss" as *;
5
+ @use "./functions.scss" as *;
6
+ $childItemSelector: '[data-element-type="repeater-item"]';
7
+ $sliderControlDragging: "[flex-slider-control-moving='true']";
8
+ $rai: "repeater-advertise-item";
9
+ [data-div-type="element"] {
10
+ &[data-element-type="repeater"] {
11
+ // width: var(--_sf-con-nw-wh);
12
+ // width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
13
+ width: calc(
14
+ 1% *
15
+ var(
16
+ --_ctm-mob-rep-ele-nw-wh-vl,
17
+ var(--_ctm-tab-rep-ele-nw-wh-vl, var(--_ctm-rep-ele-nw-wh-vl, auto))
18
+ )
19
+ );
20
+ // width: 100%;
21
+ &:not([data-view-state="full"]) {
22
+ min-height: var(
23
+ --_ctm-mob-rep-lt-ht,
24
+ var(--_ctm-tab-rep-lt-ht, var(--_ctm-rep-lt-ht, var(--_ctm-lt-ht, var(--_tst-lt-ht))))
25
+ );
26
+ }
27
+ min-height: var();
28
+ margin: var(
29
+ --_ctm-mob-rep-lt-mn,
30
+ var(--_ctm-tab-rep-lt-mn, var(--_ctm-rep-lt-mn, var(--_ctm-lt-mn, var(--_tst-lt-mn))))
31
+ );
32
+ background-color: var(
33
+ --_ctm-mob-rep-dn-rr-wt-bd-cr,
34
+ var(--_ctm-tab-rep-dn-rr-wt-bd-cr, var(--_ctm-rep-dn-rr-wt-bd-cr))
35
+ );
36
+ background-image: var(
37
+ --_ctm-mob-rep-dn-rr-wt-bd-ie,
38
+ var(--_ctm-tab-rep-dn-rr-wt-bd-ie, var(--_ctm-rep-dn-rr-wt-bd-ie))
39
+ );
40
+ background-attachment: var(
41
+ --_ctm-mob-rep-dn-rr-wt-bd-at,
42
+ var(--_ctm-tab-rep-dn-rr-wt-bd-at, var(--_ctm-rep-dn-rr-wt-bd-at))
43
+ );
44
+ background-position: var(
45
+ --_ctm-mob-rep-dn-rr-wt-bd-pn,
46
+ var(--_ctm-tab-rep-dn-rr-wt-bd-pn, var(--_ctm-rep-dn-rr-wt-bd-pn))
47
+ );
48
+ background-repeat: var(
49
+ --_ctm-mob-rep-dn-rr-wt-bd-rt,
50
+ var(--_ctm-tab-rep-dn-rr-wt-bd-rt, var(--_ctm-rep-dn-rr-wt-bd-rt))
51
+ );
52
+ background-size: var(
53
+ --_ctm-mob-rep-dn-rr-wt-bd-se,
54
+ var(--_ctm-tab-rep-dn-rr-wt-bd-se, var(--_ctm-rep-dn-rr-wt-bd-se))
55
+ );
56
+ border-radius: var(
57
+ --_ctm-mob-rep-dn-rr-wt-br-rs,
58
+ var(--_ctm-tab-rep-dn-rr-wt-br-rs, var(--_ctm-rep-dn-rr-wt-br-rs))
59
+ );
60
+ border-color: var(
61
+ --_ctm-mob-rep-dn-rr-wt-br-cr,
62
+ var(--_ctm-tab-rep-dn-rr-wt-br-cr, var(--_ctm-rep-dn-rr-wt-br-cr))
63
+ );
64
+ border-style: var(
65
+ --_ctm-mob-rep-dn-rr-wt-br-se,
66
+ var(--_ctm-tab-rep-dn-rr-wt-br-se, var(--_ctm-rep-dn-rr-wt-br-se))
67
+ );
68
+ border-width: var(
69
+ --_ctm-mob-rep-dn-rr-wt-br-wh,
70
+ var(--_ctm-tab-rep-dn-rr-wt-br-wh, var(--_ctm-rep-dn-rr-wt-br-wh))
71
+ );
72
+ box-shadow: var(
73
+ --_hover-show-shadow,
74
+ var(
75
+ --_sf-hr-bx-sw,
76
+ var(
77
+ --_show-shadow,
78
+ var(--_ctm-mob-dn-dt-se-sw-ae, var(--_ctm-tab-dn-dt-se-sw-ae, var(--_ctm-dn-dt-se-sw-ae)))
79
+ var(
80
+ --_ctm-mob-dn-dt-se-sw-br,
81
+ var(--_ctm-tab-dn-dt-se-sw-br, var(--_ctm-dn-dt-se-sw-br))
82
+ )
83
+ var(
84
+ --_ctm-mob-dn-dt-se-sw-sd,
85
+ var(--_ctm-tab-dn-dt-se-sw-sd, var(--_ctm-dn-dt-se-sw-sd))
86
+ )
87
+ var(
88
+ --_ctm-mob-dn-dt-se-sw-cr,
89
+ var(--_ctm-tab-dn-dt-se-sw-cr, var(--_ctm-dn-dt-se-sw-cr))
90
+ )
91
+ )
92
+ )
93
+ );
94
+ padding: var(--_ctm-mob-rep-lt-pg, var(--_ctm-tab-rep-lt-pg, var(--_ctm-rep-lt-pg)));
95
+
96
+ &[data-grid-toggle="enable"] {
97
+ position: var(--_p-relative);
98
+ @include FlexRepeaterGridToggleCSS();
99
+ }
100
+
101
+ &.lst_vw {
102
+ & > div {
103
+ &.wrapper {
104
+ display: var(--_d-grid);
105
+ row-gap: prepareMediaVariable(--_ctm-rep-lt-im-gp-lt);
106
+ grid-template-columns: 100%;
107
+ // grid-template-rows: repeat(
108
+ // auto-fit,
109
+ // minmax(#{prepareMediaVariable(--_ctm-rep-lt-rw-mn-ht-lt)}, 1fr)
110
+ // );
111
+ // grid-template-rows: repeat(
112
+ // 1,
113
+ // minmax(#{prepareMediaVariable(--_ctm-rep-lt-rw-mn-ht-lt)}, 1fr)
114
+ // );
115
+ grid-auto-rows: minmax(#{prepareMediaVariable(--_ctm-rep-lt-rw-mn-ht-lt)}, auto);
116
+ width: 100%;
117
+
118
+ & > div {
119
+ &#{$childItemSelector} {
120
+ width: 100%;
121
+ }
122
+ }
123
+ }
124
+ }
125
+ }
126
+ &:not(.lst_vw) {
127
+ &.grd {
128
+ & > div {
129
+ &.wrapper {
130
+ width: 100%;
131
+ display: grid;
132
+ grid-template-columns: repeat(
133
+ auto-fit,
134
+ minmax(
135
+ var(
136
+ --_ctm-mob-rep-lt-mn-cn-wh,
137
+ var(--_ctm-tab-rep-lt-mn-cn-wh, var(--_ctm-rep-lt-mn-cn-wh))
138
+ ),
139
+ 1fr
140
+ )
141
+ );
142
+ grid-template-rows: repeat(
143
+ auto-fit,
144
+ minmax(
145
+ var(
146
+ --_ctm-mob-rep-lt-mn-rw-ht,
147
+ var(--_ctm-tab-rep-lt-mn-rw-ht, var(--_ctm-rep-lt-mn-rw-ht))
148
+ ),
149
+ 1fr
150
+ )
151
+ );
152
+
153
+ div {
154
+ &#{$childItemSelector},
155
+ &.#{$rai} {
156
+ width: 100%;
157
+ }
158
+ }
159
+ }
160
+ }
161
+ }
162
+
163
+ &.crds {
164
+ & > div {
165
+ &.wrapper {
166
+ display: flex !important;
167
+ flex-wrap: wrap;
168
+ width: 100%;
169
+ height: auto !important;
170
+ min-height: 100px !important;
171
+ }
172
+ }
173
+ &:not(.stimsfrRws) {
174
+ // we are not using
175
+ & > div {
176
+ &.wrapper {
177
+ justify-content: center;
178
+ & > div {
179
+ &#{$childItemSelector},
180
+ &.#{$rai} {
181
+ // width: var(--_ctm-rep-lt-wh);
182
+ --_col-count: var(--_sf-gd-ct, 3);
183
+ --_col-gap: 0px;
184
+ width: 163px;
185
+ height: 100px;
186
+ // grid-template-rows: minmax(
187
+ // max(
188
+ // 0.5px,
189
+ // 0.0896337 * (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))
190
+ // ),
191
+ // auto
192
+ // );
193
+ // grid-template-rows: ;
194
+ }
195
+ }
196
+ }
197
+ }
198
+ }
199
+
200
+ &.stimsfrRws {
201
+ & > div {
202
+ &.wrapper {
203
+ align-self: center;
204
+ & > div {
205
+ &#{$childItemSelector},
206
+ &.#{$rai} {
207
+ // --_col-count: var(--_sf-gd-ct, 3);
208
+ --_col-count: var(
209
+ --_ctm-mob-rep-lt-st-is-pr-rw,
210
+ var(--_ctm-tab-rep-lt-st-is-pr-rw, var(--_ctm-rep-lt-st-is-pr-rw, 3))
211
+ );
212
+ // --_col-gap: var(
213
+ // --_ctm-mob-rep-lt-im-gp,
214
+ // var(--_ctm-tab-rep-lt-im-gp, var(--_ctm-rep-lt-im-gp, 0px))
215
+ // );
216
+ --_col-gap: #{prepareMediaVariable(--_ctm-rep-lt-cn-gp)};
217
+ width: calc(
218
+ (100% / var(--_col-count)) -
219
+ (((var(--_col-count) - 1) * var(--_col-gap)) / (var(--_col-count)))
220
+ );
221
+ flex: 0 0
222
+ calc(
223
+ (100% / var(--_col-count)) -
224
+ (((var(--_col-count) - 1) * var(--_col-gap)) / (var(--_col-count)))
225
+ );
226
+ align-self: stretch;
227
+ // height: 100px;
228
+ grid-template-rows: minmax(
229
+ max(
230
+ 0.5px,
231
+ 0.09375 * (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))
232
+ ),
233
+ auto
234
+ );
235
+ grid-template-columns: minmax(0px, 1fr);
236
+ // min-height: 50px !important;
237
+ grid-template-rows:
238
+ minmax(
239
+ max(0.5px, 0.09375 * (var(--scaling-factor) - var(--scrollbar-width))),
240
+ auto
241
+ )
242
+ minmax(
243
+ max(0.5px, 0.09375 * (var(--scaling-factor) - var(--scrollbar-width))),
244
+ auto
245
+ );
246
+ }
247
+ }
248
+ }
249
+ }
250
+ }
251
+ }
252
+ &.sld {
253
+ &:is(:not(#{$sliderControlDragging} *)) {
254
+ overflow: clip;
255
+ }
256
+ height: auto;
257
+ --_sf-sl-ct-ic-dt-at-cl: var(
258
+ --_ctm-mob-rep-lt-cl-ae-cr,
259
+ var(--_ctm-tab-rep-lt-cl-ae-cr, var(--_ctm-rep-lt-cl-ae-cr))
260
+ );
261
+ // &:is([data-control-type="1"]) {
262
+ // @include CMSRepeaterEmblaControlStyles(1);
263
+ // }
264
+ @for $i from 1 through 3 {
265
+ &:is([data-control-type="#{$i}"]) {
266
+ @if ($i == 3) {
267
+ overflow-y: visible;
268
+ }
269
+ @include CMSRepeaterEmblaControlStyles($i);
270
+ }
271
+ }
272
+
273
+ & > div {
274
+ &.wrapper {
275
+ &.embla__container {
276
+ display: flex !important;
277
+ --_embla-slide-space: var(
278
+ --_ctm-mob-rep-lt-im-gp,
279
+ var(--_ctm-tab-rep-lt-im-gp, var(--_ctm-rep-lt-im-gp))
280
+ );
281
+ min-height: 100px !important;
282
+ --_embla-col-count: var(
283
+ --_ctm-mob-rep-lt-st-is-pr-se,
284
+ var(--_ctm-tab-rep-lt-st-is-pr-se, var(--_ctm-rep-lt-st-is-pr-se, 3))
285
+ );
286
+ // gap: 0px !important;
287
+ // margin-left: calc(var(--_embla-slide-space, 10px) * -1);
288
+ width: 100%;
289
+ height: 100%;
290
+ & > .embla__slide {
291
+ --_sf-cl-vl: calc(
292
+ (100% / var(--_embla-col-count, 3)) -
293
+ (
294
+ ((var(--_embla-col-count, 3) - 1) * (var(--_embla-slide-space, 10px))) /
295
+ (var(--_embla-col-count, 3))
296
+ )
297
+ );
298
+ // flex: 0 0 calc(var(--_embla-slide-width, 100%) / var(--_embla-col-count, 3));
299
+ // width: calc(var(--_embla-slide-width, 100%) / var(--_embla-col-count, 3));
300
+ flex: 0 0 var(--_sf-cl-vl);
301
+ width: var(--_sf-cl-vl);
302
+ // grid-template-rows: minmax(
303
+ // max(0.5px, 0.09375 * (var(--_cms-scaling-factor) - var(--_cms-scrollbar-width))),
304
+ // auto
305
+ // );
306
+ grid-template-rows: minmax(50px, auto);
307
+ grid-template-columns: minmax(0px, 1fr);
308
+ // padding-left: calc(var(--_embla-slide-space, 10px) * 1);
309
+ // padding-left: 0px !important;
310
+
311
+ img {
312
+ width: 100%;
313
+ }
314
+ }
315
+ }
316
+ }
317
+ }
318
+ }
319
+ & > div {
320
+ &.wrapper {
321
+ &:is(.sld > *) {
322
+ gap: #{prepareMediaVariable(--_ctm-rep-lt-im-gp)};
323
+ }
324
+ &:is(:not(.sld > *)) {
325
+ column-gap: #{prepareMediaVariable(--_ctm-rep-lt-cn-gp)};
326
+ row-gap: #{prepareMediaVariable(--_ctm-rep-lt-rw-gp)};
327
+ }
328
+ // width: 100%;
329
+ // grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
330
+ // grid-auto-rows: minmax(100px, 1fr);
331
+ }
332
+ }
333
+ }
334
+ .repeater-advertise-item {
335
+ display: flex;
336
+ justify-content: center;
337
+ align-items: center;
338
+ img {
339
+ // width: 100%;
340
+ // height: 100%;
341
+ object-fit: cover;
342
+ object-position: center center;
343
+ max-width: 100%;
344
+ max-height: 100%;
345
+ }
346
+ }
347
+
348
+ // .action__button {
349
+ // display: flex;
350
+ // align-items: center;
351
+ // height: 40px;
352
+ // cursor: pointer;
353
+ // .btn__container {
354
+ // display: flex;
355
+ // align-items: center;
356
+ // justify-content: center;
357
+ // gap: 10px;
358
+ // height: 100%;
359
+ // width: 100%;
360
+ // padding: 16px;
361
+ // .btn__with__text {
362
+ // height: 2.5rem;
363
+ // }
364
+ // }
365
+ // &.loadMore {
366
+ // background-color: var(
367
+ // --_sf-at-hr-bd-cr,
368
+ // var(
369
+ // --_ctm-mob-rep-dn-bn-se-dt-se-bd-cr,
370
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-bd-cr, var(--_ctm-rep-dn-bn-se-dt-se-bd-cr))
371
+ // )
372
+ // );
373
+ // border-color: var(
374
+ // --_sf-at-hr-br-cr,
375
+ // var(
376
+ // --_ctm-mob-rep-dn-bn-se-dt-se-br-cr,
377
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-br-cr, var(--_ctm-rep-dn-bn-se-dt-se-br-cr))
378
+ // )
379
+ // );
380
+ // border-style: var(
381
+ // --_sf-at-hr-br-se,
382
+ // var(
383
+ // --_ctm-mob-rep-dn-bn-se-dt-se-br-se,
384
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-br-se, var(--_ctm-rep-dn-bn-se-dt-se-br-se))
385
+ // )
386
+ // );
387
+ // border-width: var(
388
+ // --_sf-at-hr-br-wt,
389
+ // var(
390
+ // --_ctm-mob-rep-dn-bn-se-dt-se-br-wh,
391
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-br-wh, var(--_ctm-rep-dn-bn-se-dt-se-br-wh))
392
+ // )
393
+ // );
394
+ // border-radius: var(
395
+ // --_sf-at-hr-br-br,
396
+ // var(
397
+ // --_ctm-mob-rep-dn-bn-se-dt-se-br-rs,
398
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-br-rs, var(--_ctm-rep-dn-bn-se-dt-se-br-rs))
399
+ // )
400
+ // );
401
+
402
+ // box-shadow: var(
403
+ // --_hover-show-shadow,
404
+ // var(
405
+ // --_sf-at-hr-bx-sw,
406
+ // var(
407
+ // --_show-shadow,
408
+ // var(
409
+ // --_ctm-mob-rep-dn-bn-se-dt-se-sw-ae,
410
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-ae, var(--_ctm-rep-dn-bn-se-dt-se-sw-ae))
411
+ // )
412
+ // var(
413
+ // --_ctm-mob-rep-dn-bn-se-dt-se-sw-br,
414
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-br, var(--_ctm-rep-dn-bn-se-dt-se-sw-br))
415
+ // )
416
+ // var(
417
+ // --_ctm-mob-rep-dn-bn-se-dt-se-sw-sd,
418
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-sd, var(--_ctm-rep-dn-bn-se-dt-se-sw-sd))
419
+ // )
420
+ // var(
421
+ // --_ctm-mob-rep-dn-bn-se-dt-se-sw-cr,
422
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-sw-cr, var(--_ctm-rep-dn-bn-se-dt-se-sw-cr))
423
+ // )
424
+ // )
425
+ // )
426
+ // );
427
+
428
+ // .btn__container {
429
+ // gap: var(
430
+ // --_ctm-mob-rep-dn-bn-se-dt-se-gp,
431
+ // var(
432
+ // --_ctm-tab-rep-dn-bn-se-dt-se-gp,
433
+ // var(--_ctm-rep-dn-bn-se-dt-se-gp)
434
+ // )
435
+ // );
436
+ // justify-content: var(
437
+ // --_ctm-mob-rep-dn-bn-se-dt-se-at,
438
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-at, var(--_ctm-rep-dn-bn-se-dt-se-at))
439
+ // );
440
+
441
+ // &[data-actions-icon-position="left"],
442
+ // &[data-actions-icon-position="center"] {
443
+ // flex-direction: row;
444
+ // }
445
+ // &[data-actions-icon-position="right"] {
446
+ // flex-direction: row-reverse;
447
+ // }
448
+ // span {
449
+ // svg {
450
+ // width: var(
451
+ // --_ctm-mob-rep-dn-bn-se-dt-se-in-se,
452
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-in-se, var(--_ctm-rep-dn-bn-se-dt-se-in-se))
453
+ // );
454
+ // height: var(
455
+ // --_ctm-mob-rep-dn-bn-se-dt-se-in-se,
456
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-in-se, var(--_ctm-rep-dn-bn-se-dt-se-in-se))
457
+ // );
458
+
459
+ // path {
460
+ // stroke: var(
461
+ // --_ctm-mob-rep-dn-bn-se-dt-se-in-c1,
462
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-in-c1, var(--_ctm-rep-dn-bn-se-dt-se-in-c1))
463
+ // );
464
+ // }
465
+ // }
466
+ // }
467
+ // .btn__with__text {
468
+ // border: none;
469
+ // background-color: transparent;
470
+ // color: var(
471
+ // --_ctm-mob-rep-dn-bn-se-dt-se-cr,
472
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-cr, var(--_ctm-rep-dn-bn-se-dt-se-cr))
473
+ // );
474
+ // font-family: var(
475
+ // --_ctm-mob-rep-dn-bn-se-dt-se-ft-fy,
476
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-fy, var(--_ctm-rep-dn-bn-se-dt-se-ft-fy))
477
+ // ),
478
+ // font-size: var(
479
+ // --_ctm-mob-rep-dn-bn-se-dt-se-ft-se,
480
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-se, var(--_ctm-rep-dn-bn-se-dt-se-ft-se))
481
+ // );
482
+ // font-weight: var(
483
+ // --_ctm-mob-rep-dn-bn-se-dt-se-ft-wt,
484
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-wt, var(--_ctm-rep-dn-bn-se-dt-se-ft-wt))
485
+ // );
486
+ // font-style: var(
487
+ // --_ctm-mob-rep-dn-bn-se-dt-se-ft-se-ic,
488
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-ft-se-ic, var(--_ctm-rep-dn-bn-se-dt-se-ft-se-ic))
489
+ // );
490
+ // text-align: var(
491
+ // --_ctm-mob-rep-dn-bn-se-dt-se-tt-an,
492
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-tt-an, var(--_ctm-rep-dn-bn-se-dt-se-tt-an))
493
+ // );
494
+ // letter-spacing: var(
495
+ // --_ctm-mob-rep-dn-bn-se-dt-se-lr-sg,
496
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-lr-sg, var(--_ctm-rep-dn-bn-se-dt-se-lr-sg))
497
+ // );
498
+ // line-height: var(
499
+ // --_ctm-mob-rep-dn-bn-se-dt-se-le-ht,
500
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-le-ht, var(--_ctm-rep-dn-bn-se-dt-se-le-ht))
501
+ // );
502
+ // text-decoration: var(
503
+ // --_ctm-mob-rep-dn-bn-se-dt-se-ue,
504
+ // var(--_ctm-tab-rep-dn-bn-se-dt-se-ue, var(--_ctm-rep-dn-bn-se-dt-se-ue))
505
+ // );
506
+ // }
507
+
508
+ // &:hover {
509
+ // background-color: var(
510
+ // --_sf-at-hr-bd-cr,
511
+ // var(
512
+ // --_ctm-mob-rep-dn-bn-se-hr-se-bd-cr,
513
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-bd-cr, var(--_ctm-rep-dn-bn-se-hr-se-bd-cr))
514
+ // )
515
+ // );
516
+ // border-color: var(
517
+ // --_sf-at-hr-br-cr,
518
+ // var(
519
+ // --_ctm-mob-rep-dn-bn-se-hr-se-br-cr,
520
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-br-cr, var(--_ctm-rep-dn-bn-se-hr-se-br-cr))
521
+ // )
522
+ // );
523
+ // border-style: var(
524
+ // --_sf-at-hr-br-se,
525
+ // var(
526
+ // --_ctm-mob-rep-dn-bn-se-hr-se-br-se,
527
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-br-se, var(--_ctm-rep-dn-bn-se-hr-se-br-se))
528
+ // )
529
+ // );
530
+ // border-width: var(
531
+ // --_sf-at-hr-br-wt,
532
+ // var(
533
+ // --_ctm-mob-rep-dn-bn-se-hr-se-br-wh,
534
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-br-wh, var(--_ctm-rep-dn-bn-se-hr-se-br-wh))
535
+ // )
536
+ // );
537
+ // border-radius: var(
538
+ // --_sf-at-hr-br-br,
539
+ // var(
540
+ // --_ctm-mob-rep-dn-bn-se-hr-se-br-rs,
541
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-br-rs, var(--_ctm-rep-dn-bn-se-hr-se-br-rs))
542
+ // )
543
+ // );
544
+ // box-shadow: var(
545
+ // --_hover-show-shadow,
546
+ // var(
547
+ // --_sf-at-hr-bx-sw,
548
+ // var(
549
+ // --_show-shadow,
550
+ // var(
551
+ // --_ctm-mob-rep-dn-bn-se-hr-se-sw-ae,
552
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-sw-ae, var(--_ctm-rep-dn-bn-se-hr-se-sw-ae))
553
+ // )
554
+ // var(
555
+ // --_ctm-mob-rep-dn-bn-se-hr-se-sw-br,
556
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-sw-br, var(--_ctm-rep-dn-bn-se-hr-se-sw-br))
557
+ // )
558
+ // var(
559
+ // --_ctm-mob-rep-dn-bn-se-hr-se-sw-sd,
560
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-sw-sd, var(--_ctm-rep-dn-bn-se-hr-se-sw-sd))
561
+ // )
562
+ // var(
563
+ // --_ctm-mob-rep-dn-bn-se-hr-se-sw-cr,
564
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-sw-cr, var(--_ctm-rep-dn-bn-se-hr-se-sw-cr))
565
+ // )
566
+ // )
567
+ // )
568
+ // );
569
+
570
+ // .btn__container {
571
+ // gap: var(
572
+ // --_ctm-mob-rep-dn-bn-se-hr-se-gp,
573
+ // var(
574
+ // --_ctm-tab-rep-dn-bn-se-hr-se-gp,
575
+ // var(--_ctm-rep-dn-bn-se-hr-se-gp)
576
+ // )
577
+ // );
578
+ // justify-content: var(
579
+ // --_ctm-mob-rep-dn-bn-se-hr-se-at,
580
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-at, var(--_ctm-rep-dn-bn-se-hr-se-at))
581
+ // );
582
+
583
+ // &[data-actions-icon-position-hover="left"],
584
+ // &[data-actions-icon-position-hover="center"] {
585
+ // flex-direction: row;
586
+ // }
587
+ // &[data-actions-icon-position-hover="right"] {
588
+ // flex-direction: row-reverse;
589
+ // }
590
+ // span {
591
+ // svg {
592
+ // width: var(
593
+ // --_ctm-mob-rep-dn-bn-se-hr-se-in-se,
594
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-in-se, var(--_ctm-rep-dn-bn-se-hr-se-in-se))
595
+ // );
596
+ // height: var(
597
+ // --_ctm-mob-rep-dn-bn-se-hr-se-in-se,
598
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-in-se, var(--_ctm-rep-dn-bn-se-hr-se-in-se))
599
+ // );
600
+
601
+ // path {
602
+ // stroke: var(
603
+ // --_ctm-mob-rep-dn-bn-se-hr-se-in-c1,
604
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-in-c1, var(--_ctm-rep-dn-bn-se-hr-se-in-c1))
605
+ // );
606
+ // }
607
+ // }
608
+ // }
609
+ // .btn__with__text {
610
+ // border: none;
611
+ // background-color: transparent;
612
+ // color: var(
613
+ // --_ctm-mob-rep-dn-bn-se-hr-se-cr,
614
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-cr, var(--_ctm-rep-dn-bn-se-hr-se-cr))
615
+ // );
616
+ // font-family: var(
617
+ // --_ctm-mob-rep-dn-bn-se-hr-se-ft-fy,
618
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-ft-fy, var(--_ctm-rep-dn-bn-se-hr-se-ft-fy))
619
+ // ),
620
+ // font-size: var(
621
+ // --_ctm-mob-rep-dn-bn-se-hr-se-ft-se,
622
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-ft-se, var(--_ctm-rep-dn-bn-se-hr-se-ft-se))
623
+ // );
624
+ // font-weight: var(
625
+ // --_ctm-mob-rep-dn-bn-se-hr-se-ft-wt,
626
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-ft-wt, var(--_ctm-rep-dn-bn-se-hr-se-ft-wt))
627
+ // );
628
+ // font-style: var(
629
+ // --_ctm-mob-rep-dn-bn-se-hr-se-ft-se-ic,
630
+ // var(
631
+ // --_ctm-tab-rep-dn-bn-se-hr-se-ft-se-ic,
632
+ // var(--_ctm-rep-dn-bn-se-hr-se-ft-se-ic)
633
+ // )
634
+ // );
635
+ // text-align: var(
636
+ // --_ctm-mob-rep-dn-bn-se-hr-se-tt-an,
637
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-tt-an, var(--_ctm-rep-dn-bn-se-hr-se-tt-an))
638
+ // );
639
+ // letter-spacing: var(
640
+ // --_ctm-mob-rep-dn-bn-se-hr-se-lr-sg,
641
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-lr-sg, var(--_ctm-rep-dn-bn-se-hr-se-lr-sg))
642
+ // );
643
+ // line-height: var(
644
+ // --_ctm-mob-rep-dn-bn-se-hr-se-le-ht,
645
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-le-ht, var(--_ctm-rep-dn-bn-se-hr-se-le-ht))
646
+ // );
647
+ // text-decoration: var(
648
+ // --_ctm-mob-rep-dn-bn-se-hr-se-ue,
649
+ // var(--_ctm-tab-rep-dn-bn-se-hr-se-ue, var(--_ctm-rep-dn-bn-se-hr-se-ue))
650
+ // );
651
+ // }
652
+ // }
653
+ // }
654
+ // }
655
+ // }
656
+ // }
657
+
658
+ .repeater__button__container {
659
+ display: flex;
660
+
661
+ &[data-button-alignment-default-state="flex-start"] {
662
+ justify-content: flex-start;
663
+ }
664
+
665
+ &[data-button-alignment-default-state="center"] {
666
+ justify-content: center;
667
+ }
668
+
669
+ &[data-button-alignment-default-state="flex-end"] {
670
+ justify-content: flex-end;
671
+ }
672
+
673
+ &[data-button-alignment-hover-state="flex-start"]:hover {
674
+ justify-content: flex-start;
675
+ }
676
+ &[data-button-alignment-hover-state="center"]:hover {
677
+ justify-content: center;
678
+ }
679
+ &[data-button-alignment-hover-state="flex-end"]:hover {
680
+ justify-content: flex-end;
681
+ }
682
+ }
683
+
684
+ .btn__with__text[data-btn-name="loadmoreButton"] {
685
+ justify-content: center;
686
+ &[data-show-shadow="false"] {
687
+ --_show-shadow: none;
688
+ }
689
+ &[data-icon-position="left"] {
690
+ --_sf-fd-bn: row;
691
+ }
692
+ &[data-icon-position="right"] {
693
+ --_sf-fd-bn: row-reverse;
694
+ }
695
+ &[data-icon-position="center"] {
696
+ --_sf-fd-bn: row;
697
+ }
698
+ // &:has(p) {
699
+ // width: auto;
700
+ // }
701
+
702
+ &:hover {
703
+ --_sf-hr-bd-cr: var(
704
+ --_ctm-rep-mob-dn-bn-se-hr-se-bd-cr,
705
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-bd-cr, var(--_ctm-rep-dn-bn-se-hr-se-bd-cr))
706
+ );
707
+ --_sf-hr-br-cr: var(
708
+ --_ctm-rep-mob-dn-bn-se-hr-se-br-cr,
709
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-br-cr, var(--_ctm-rep-dn-bn-se-hr-se-br-cr))
710
+ );
711
+ --_sf-hr-br-se: var(
712
+ --_ctm-rep-mob-dn-bn-se-hr-se-br-se,
713
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-br-se, var(--_ctm-rep-dn-bn-se-hr-se-br-se))
714
+ );
715
+ --_sf-hr-br-wh: var(
716
+ --_ctm-rep-mob-dn-bn-se-hr-se-br-wh,
717
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-br-wh, var(--_ctm-rep-dn-bn-se-hr-se-br-wh))
718
+ );
719
+ --_sf-hr-br-rs: var(
720
+ --_ctm-rep-mob-dn-bn-se-hr-se-br-rs,
721
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-br-rs, var(--_ctm-rep-dn-bn-se-hr-se-br-rs))
722
+ );
723
+ --_sf-hr-at: var(
724
+ --_ctm-rep-mob-dn-bn-se-hr-se-at,
725
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-at, var(--_ctm-rep-dn-bn-se-hr-se-at))
726
+ );
727
+ --_sf-hr-gp: var(
728
+ --_ctm-rep-mob-dn-bn-se-hr-se-gp,
729
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-gp, var(--_ctm-rep-dn-bn-se-hr-se-gp))
730
+ );
731
+
732
+ // for shadow
733
+ --_sf-hr-sw-ae: var(
734
+ --_ctm-rep-mob-dn-bn-se-hr-se-sw-ae,
735
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-sw-ae, var(--_ctm-rep-dn-bn-se-hr-se-sw-ae))
736
+ );
737
+ --_sf-hr-sw-br: var(
738
+ --_ctm-rep-mob-dn-bn-se-hr-se-sw-br,
739
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-sw-br, var(--_ctm-rep-dn-bn-se-hr-se-sw-br))
740
+ );
741
+ --_sf-hr-sw-hr: var(
742
+ --_ctm-rep-mob-dn-bn-se-hr-se-sw-hr,
743
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-sw-hr, var(--_ctm-rep-dn-bn-se-hr-se-sw-hr))
744
+ );
745
+ --_sf-hr-sw-cr: var(
746
+ --_ctm-rep-mob-dn-bn-se-hr-se-sw-cr,
747
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-sw-cr, var(--_ctm-rep-dn-bn-se-hr-se-sw-cr))
748
+ );
749
+
750
+ // for font
751
+
752
+ --_sf-hr-cr: var(
753
+ --_ctm-rep-mob-dn-bn-se-hr-se-cr,
754
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-cr, var(--_ctm-rep-dn-bn-se-hr-se-cr))
755
+ );
756
+ --_sf-hr-ft-fy: var(
757
+ --_ctm-rep-mob-dn-bn-se-hr-se-ft-fy,
758
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-ft-fy, var(--_ctm-rep-dn-bn-se-hr-se-ft-fy))
759
+ );
760
+ --_sf-hr-ft-se: var(
761
+ --_ctm-rep-mob-dn-bn-se-hr-se-ft-se,
762
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-ft-se, var(--_ctm-rep-dn-bn-se-hr-se-ft-se))
763
+ );
764
+ --_sf-hr-ft-wt: var(
765
+ --_ctm-rep-mob-dn-bn-se-hr-se-ft-wt,
766
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-ft-wt, var(--_ctm-rep-dn-bn-se-hr-se-ft-wt))
767
+ );
768
+ --_sf-hr-ft-se-ic: var(
769
+ --_ctm-rep-mob-dn-bn-se-hr-se-ft-se-ic,
770
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-ft-se-ic, var(--_ctm-rep-dn-bn-se-hr-se-ft-se-ic))
771
+ );
772
+ --_sf-hr-tt-an: var(
773
+ --_ctm-rep-mob-dn-bn-se-hr-se-tt-an,
774
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-tt-an, var(--_ctm-rep-dn-bn-se-hr-se-tt-an))
775
+ );
776
+ --_sf-hr-lr-sg: var(
777
+ --_ctm-rep-mob-dn-bn-se-hr-se-lr-sg,
778
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-lr-sg, var(--_ctm-rep-dn-bn-se-hr-se-lr-sg))
779
+ );
780
+ --_sf-hr-le-ht: var(
781
+ --_ctm-rep-mob-dn-bn-se-hr-se-le-ht,
782
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-le-ht, var(--_ctm-rep-dn-bn-se-hr-se-le-ht))
783
+ );
784
+
785
+ --_sf-hr-in-se: var(
786
+ --_ctm-rep-mob-dn-bn-se-hr-se-in-se,
787
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-in-se, var(--_ctm-rep-dn-bn-se-hr-se-in-se))
788
+ );
789
+ --_sf-hr-in-se: var(
790
+ --_ctm-rep-mob-dn-bn-se-hr-se-in-se,
791
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-in-se, var(--_ctm-rep-dn-bn-se-hr-se-in-se))
792
+ );
793
+ --_sf-hr-in-c1: var(
794
+ --_ctm-rep-mob-dn-bn-se-hr-se-in-c1,
795
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-in-c1, var(--_ctm-rep-dn-bn-se-hr-se-in-c1))
796
+ );
797
+ --_sf-hr-ue: var(
798
+ --_ctm-rep-mob-dn-bn-se-hr-se-ue,
799
+ var(--_ctm-rep-tab-dn-bn-se-hr-se-ue, var(--_ctm-rep-dn-bn-se-hr-se-ue))
800
+ );
801
+
802
+ // for pading and width
803
+ --_sf-hr-pg: var(
804
+ --_ctm-rep-mob-dn-bn-se-hr-pg,
805
+ var(--_ctm-rep-tab-dn-bn-se-hr-pg, var(--_ctm-rep-dn-bn-se-hr-pg))
806
+ );
807
+ --_sf-hr-wh: var(
808
+ --_ctm-rep-mob-dn-bn-se-hr-wh,
809
+ var(--_ctm-rep-tab-dn-bn-se-hr-wh, var(--_ctm-rep-dn-bn-se-hr-wh))
810
+ );
811
+
812
+ &[data-hover-show-shadow="false"] {
813
+ --_hover-show-shadow: none;
814
+ }
815
+ &[data-hover-show-icon="false"] {
816
+ --_hover-show-icon: none;
817
+ }
818
+ }
819
+ background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-bd-cr));
820
+
821
+ padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-pg));
822
+ width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-wh));
823
+ display: flex;
824
+ flex-direction: var(--_sf-fd-bn);
825
+ align-items: center;
826
+
827
+ justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-at));
828
+ gap: var(--_sf-hr-gp, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-gp));
829
+
830
+ border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-br-rs));
831
+
832
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-sw-ae))
833
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-sw-br))
834
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-sw-sd))
835
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-sw-cr));
836
+
837
+ &[data-show-border="true"] {
838
+ border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-br-cr));
839
+
840
+ border-style: var(--_sf-hr-br-se, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-br-se));
841
+
842
+ border-width: var(--_sf-hr-br-wh, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-br-wh));
843
+ }
844
+
845
+ .txt {
846
+ display: flex;
847
+
848
+ color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-cr));
849
+
850
+ font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-ft-fy));
851
+
852
+ font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-ft-se));
853
+
854
+ font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-ft-wt));
855
+
856
+ font-style: var(
857
+ --_sf-hr-ft-se-ic,
858
+ prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-ft-se-ic)
859
+ );
860
+
861
+ text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-tt-an));
862
+
863
+ letter-spacing: var(--_sf-hr-lr-sg, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-lr-sg));
864
+
865
+ line-height: var(--_sf-hr-le-ht, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-le-ht));
866
+
867
+ text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-rep-dn-dt-ue));
868
+ }
869
+
870
+ .icon {
871
+ display: var(--_hover-show-icon, var(--_show-icon, flex));
872
+ svg {
873
+ width: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-in-se));
874
+ height: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-in-se));
875
+
876
+ path {
877
+ stroke: var(--_sf-hr-in-c1, prepareMediaVariable(--_ctm-rep-dn-bn-se-dt-se-in-c1));
878
+ }
879
+ }
880
+ }
881
+ [data-element-style="Text"] {
882
+ display: inline-block;
883
+ width: 100%;
884
+ }
885
+
886
+ .icon--hover {
887
+ // position: absolute;
888
+ // inset: 0;
889
+ // opacity: 0;
890
+ display: none;
891
+ transition: opacity 0.2s ease;
892
+ }
893
+
894
+ &:hover .icon--hover {
895
+ // opacity: 1;
896
+ display: flex;
897
+ }
898
+
899
+ &:hover .icon--default {
900
+ // opacity: 0;
901
+ display: none;
902
+ }
903
+ }
904
+
905
+ // &[data-view-state="full"] {
906
+ // width: auto;
907
+ // margin: 0;
908
+ // justify-self: stretch !important;
909
+ // align-self: stretch !important;
910
+ // cursor: auto;
911
+
912
+ // & > div {
913
+ // &[data-div-type="wrapper__layer"] {
914
+ // --_sf-vt-zz: visible;
915
+ // --_sf-op-zz: 1;
916
+ // }
917
+ // }
918
+ // }
919
+ }
920
+ }