@sc-360-v2/storefront-cms-library 0.5.66 → 0.5.67

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/coupon.scss CHANGED
@@ -7,33 +7,62 @@ $resizeActive: '[data-cms-element-resizer="true"]';
7
7
 
8
8
  [data-div-type="element"] {
9
9
  &[data-element-type="coupon"] {
10
- width: var(--_sf-el-wh-st-mx,
11
- calc(1% * var(--_mob-ctm-ele-nw-wh-vl,
12
- var(--_tab-ctm-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))));
10
+ width: var(
11
+ --_sf-el-wh-st-mx,
12
+ calc(
13
+ 1% *
14
+ var(
15
+ --_mob-ctm-ele-nw-wh-vl,
16
+ var(--_tab-ctm-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh)))
17
+ )
18
+ )
19
+ );
13
20
  margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
14
21
 
15
- &>div {
22
+ & > div {
16
23
  &.wrapper {
17
24
  width: 100%;
18
25
  }
19
26
  }
20
27
 
21
28
  .coupon_code {
22
- background-color: var(--_ctm-mob-dn-cn-cr-bd-cr,
23
- var(--_ctm-tab-dn-cn-cr-bd-cr, var(--_ctm-dn-cn-cr-bd-cr)));
24
- border-color: var(--_ctm-mob-dn-cn-cr-br-cr,
25
- var(--_ctm-tab-dn-cn-cr-br-cr, var(--_ctm-dn-cn-cr-br-cr)));
26
- border-style: var(--_ctm-mob-dn-cn-cr-br-se,
27
- var(--_ctm-tab-dn-cn-cr-br-se, var(--_ctm-dn-cn-cr-br-se)));
28
- border-width: var(--_ctm-mob-dn-cn-cr-br-wh,
29
- var(--_ctm-tab-dn-cn-cr-br-wh, var(--_ctm-dn-cn-cr-br-wh)));
30
- border-radius: var(--_ctm-mob-dn-cn-cr-br-rs,
31
- var(--_ctm-tab-dn-cn-cr-br-rs, var(--_ctm-dn-cn-cr-br-rs)));
32
- box-shadow: var(var(--_ctm-mob-dn-cn-cr-sw-ae,
33
- var(--_ctm-tab-dn-cn-cr-sw-ae, var(--_ctm-dn-cn-cr-sw-ae, none))) var(--_ctm-mob-dn-cn-cr-sw-br,
34
- var(--_ctm-tab-dn-cn-cr-sw-br, var(--_ctm-dn-cn-cr-sw-br, none))) var(--_ctm-mob-dn-cn-cr-sw-sd,
35
- var(--_ctm-tab-dn-cn-cr-sw-sd, var(--_ctm-dn-cn-cr-sw-sd, none))) var(--_ctm-mob-dn-cn-cr-sw-cr,
36
- var(--_ctm-tab-dn-cn-cr-sw-cr, var(--_ctm-dn-cn-cr-sw-cr, none))));
29
+ background-color: var(
30
+ --_ctm-mob-dn-cn-cr-bd-cr,
31
+ var(--_ctm-tab-dn-cn-cr-bd-cr, var(--_ctm-dn-cn-cr-bd-cr))
32
+ );
33
+ border-color: var(
34
+ --_ctm-mob-dn-cn-cr-br-cr,
35
+ var(--_ctm-tab-dn-cn-cr-br-cr, var(--_ctm-dn-cn-cr-br-cr))
36
+ );
37
+ border-style: var(
38
+ --_ctm-mob-dn-cn-cr-br-se,
39
+ var(--_ctm-tab-dn-cn-cr-br-se, var(--_ctm-dn-cn-cr-br-se))
40
+ );
41
+ border-width: var(
42
+ --_ctm-mob-dn-cn-cr-br-wh,
43
+ var(--_ctm-tab-dn-cn-cr-br-wh, var(--_ctm-dn-cn-cr-br-wh))
44
+ );
45
+ border-radius: var(
46
+ --_ctm-mob-dn-cn-cr-br-rs,
47
+ var(--_ctm-tab-dn-cn-cr-br-rs, var(--_ctm-dn-cn-cr-br-rs))
48
+ );
49
+ box-shadow: var(
50
+ --_ctm-mob-dn-cn-cr-sw-ae,
51
+ var(--_ctm-tab-dn-cn-cr-sw-ae, var(--_ctm-dn-cn-cr-sw-ae, none))
52
+ )
53
+ var(
54
+ --_ctm-mob-dn-cn-cr-sw-br,
55
+ var(--_ctm-tab-dn-cn-cr-sw-br, var(--_ctm-dn-cn-cr-sw-br, none))
56
+ )
57
+ var(
58
+ --_ctm-mob-dn-cn-cr-sw-sd,
59
+ var(--_ctm-tab-dn-cn-cr-sw-sd, var(--_ctm-dn-cn-cr-sw-sd, none))
60
+ )
61
+ var(
62
+ --_ctm-mob-dn-cn-cr-sw-cr,
63
+ var(--_ctm-tab-dn-cn-cr-sw-cr, var(--_ctm-dn-cn-cr-sw-cr, none))
64
+ );
65
+ padding: prepareMediaVariable(--_ctm-lt-pg);
37
66
  width: 100%;
38
67
  // max-width: 400px;
39
68
  overflow: hidden;
@@ -44,74 +73,125 @@ $resizeActive: '[data-cms-element-resizer="true"]';
44
73
  // margin-bottom: 24px;
45
74
  .coupon_code_header {
46
75
  // font-size: 16px;
47
- font-family: var(--_ctm-mob-dn-cn-hr-ft-fy,
48
- var(--_ctm-tab-dn-cn-hr-ft-fy, var(--_ctm-dn-cn-hr-ft-fy)));
49
- text-transform: var(--_ctm-mob-dn-cn-hr-tt-tm,
50
- var(--_ctm-tab-dn-cn-hr-tt-tm, var(--_ctm-dn-cn-hr-tt-tm)));
51
- word-wrap: var(--_ctm-mob-dn-cn-hr-wd-wp,
52
- var(--_ctm-tab-dn-cn-hr-wd-wp, var(--_ctm-dn-cn-hr-wd-wp)));
53
- word-break: var(--_ctm-mob-dn-cn-hr-wd-bk,
54
- var(--_ctm-tab-dn-cn-hr-wd-bk, var(--_ctm-dn-cn-hr-wd-bk)));
76
+ font-family: var(
77
+ --_ctm-mob-dn-cn-hr-ft-fy,
78
+ var(--_ctm-tab-dn-cn-hr-ft-fy, var(--_ctm-dn-cn-hr-ft-fy))
79
+ );
80
+ text-transform: var(
81
+ --_ctm-mob-dn-cn-hr-tt-tm,
82
+ var(--_ctm-tab-dn-cn-hr-tt-tm, var(--_ctm-dn-cn-hr-tt-tm))
83
+ );
84
+ word-wrap: var(
85
+ --_ctm-mob-dn-cn-hr-wd-wp,
86
+ var(--_ctm-tab-dn-cn-hr-wd-wp, var(--_ctm-dn-cn-hr-wd-wp))
87
+ );
88
+ word-break: var(
89
+ --_ctm-mob-dn-cn-hr-wd-bk,
90
+ var(--_ctm-tab-dn-cn-hr-wd-bk, var(--_ctm-dn-cn-hr-wd-bk))
91
+ );
55
92
  color: var(--_ctm-mob-dn-cn-hr-cr, var(--_ctm-tab-dn-cn-hr-cr, var(--_ctm-dn-cn-hr-cr)));
56
- font-weight: var(--_ctm-mob-dn-cn-hr-ft-wt,
57
- var(--_ctm-tab-dn-cn-hr-ft-wt, var(--_ctm-dn-cn-hr-ft-wt)));
58
- font-size: var(--_ctm-mob-dn-cn-hr-ft-se,
59
- var(--_ctm-tab-dn-cn-hr-ft-se, var(--_ctm-dn-cn-hr-ft-se)));
60
- text-decoration: var(--_ctm-mob-dn-cn-hr-ue,
61
- var(--_ctm-tab-dn-cn-hr-ue, var(--_ctm-dn-cn-hr-ue)));
62
- letter-spacing: var(--_ctm-mob-dn-cn-hr-lr-sg,
63
- var(--_ctm-tab-dn-cn-hr-lr-sg, var(--_ctm-dn-cn-hr-lr-sg)));
64
- line-height: var(--_ctm-mob-dn-cn-hr-le-ht,
65
- var(--_ctm-tab-dn-cn-hr-le-ht, var(--_ctm-dn-cn-hr-le-ht)));
66
- font-style: var(--_ctm-mob-dn-cn-hr-ft-se-ic,
67
- var(--_ctm-tab-dn-cn-hr-ft-se-ic, var(--_ctm-dn-cn-hr-ft-se-ic)));
68
- text-align: var(--_ctm-mob-dn-cn-hr-tt-an,
69
- var(--_ctm-tab-dn-cn-hr-tt-an, var(--_ctm-dn-cn-hr-tt-an)));
70
- background-color: var(--_ctm-mob-dn-cn-hr-bd-cr,
71
- var(--_ctm-tab-dn-cn-hr-bd-cr, var(--_ctm-dn-cn-hr-bd-cr)));
72
- border-color: var(--_ctm-mob-dn-cn-hr-br-cr,
73
- var(--_ctm-tab-dn-cn-hr-br-cr, var(--_ctm-dn-cn-hr-br-cr)));
74
- border-style: var(--_ctm-mob-dn-cn-hr-br-se,
75
- var(--_ctm-tab-dn-cn-hr-br-se, var(--_ctm-dn-cn-hr-br-se)));
76
- border-width: var(--_ctm-mob-dn-cn-hr-br-wh,
77
- var(--_ctm-tab-dn-cn-hr-br-wh, var(--_ctm-dn-cn-hr-br-wh)));
93
+ font-weight: var(
94
+ --_ctm-mob-dn-cn-hr-ft-wt,
95
+ var(--_ctm-tab-dn-cn-hr-ft-wt, var(--_ctm-dn-cn-hr-ft-wt))
96
+ );
97
+ font-size: var(
98
+ --_ctm-mob-dn-cn-hr-ft-se,
99
+ var(--_ctm-tab-dn-cn-hr-ft-se, var(--_ctm-dn-cn-hr-ft-se))
100
+ );
101
+ text-decoration: var(
102
+ --_ctm-mob-dn-cn-hr-ue,
103
+ var(--_ctm-tab-dn-cn-hr-ue, var(--_ctm-dn-cn-hr-ue))
104
+ );
105
+ letter-spacing: var(
106
+ --_ctm-mob-dn-cn-hr-lr-sg,
107
+ var(--_ctm-tab-dn-cn-hr-lr-sg, var(--_ctm-dn-cn-hr-lr-sg))
108
+ );
109
+ line-height: var(
110
+ --_ctm-mob-dn-cn-hr-le-ht,
111
+ var(--_ctm-tab-dn-cn-hr-le-ht, var(--_ctm-dn-cn-hr-le-ht))
112
+ );
113
+ font-style: var(
114
+ --_ctm-mob-dn-cn-hr-ft-se-ic,
115
+ var(--_ctm-tab-dn-cn-hr-ft-se-ic, var(--_ctm-dn-cn-hr-ft-se-ic))
116
+ );
117
+ text-align: var(
118
+ --_ctm-mob-dn-cn-hr-tt-an,
119
+ var(--_ctm-tab-dn-cn-hr-tt-an, var(--_ctm-dn-cn-hr-tt-an))
120
+ );
121
+ background-color: var(
122
+ --_ctm-mob-dn-cn-hr-bd-cr,
123
+ var(--_ctm-tab-dn-cn-hr-bd-cr, var(--_ctm-dn-cn-hr-bd-cr))
124
+ );
125
+ border-color: var(
126
+ --_ctm-mob-dn-cn-hr-br-cr,
127
+ var(--_ctm-tab-dn-cn-hr-br-cr, var(--_ctm-dn-cn-hr-br-cr))
128
+ );
129
+ border-style: var(
130
+ --_ctm-mob-dn-cn-hr-br-se,
131
+ var(--_ctm-tab-dn-cn-hr-br-se, var(--_ctm-dn-cn-hr-br-se))
132
+ );
133
+ border-width: var(
134
+ --_ctm-mob-dn-cn-hr-br-wh,
135
+ var(--_ctm-tab-dn-cn-hr-br-wh, var(--_ctm-dn-cn-hr-br-wh))
136
+ );
78
137
  padding: var(--_ctm-mob-dn-cn-hr-pg, var(--_ctm-tab-dn-cn-hr-pg, var(--_ctm-dn-cn-hr-pg)));
79
138
 
139
+ // Text Overflow is a CONTROLS property, so it cannot arrive as a variable — the
140
+ // renderer opts the node in with `.flex__overflow` and carries the line count
141
+ // inline as `--_sf-line-clamp`. The clamp sits on the `p`, not on this wrapper,
142
+ // so the box the lines are counted in is the one holding the text.
143
+ p.flex__overflow {
144
+ white-space: normal;
145
+ @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
146
+ }
147
+
80
148
  &.divider {
81
149
  border-bottom: 1px dashed var(--_gray-300);
82
150
  }
83
151
  }
84
152
 
85
153
  .coupon_code_body {
86
- padding: var(--_ctm-mob-dn-cn-wt-cr-pg,
87
- var(--_ctm-tab-dn-cn-wt-cr-pg, var(--_ctm-dn-cn-wt-cr-pg)));
154
+ padding: var(
155
+ --_ctm-mob-dn-cn-wt-cr-pg,
156
+ var(--_ctm-tab-dn-cn-wt-cr-pg, var(--_ctm-dn-cn-wt-cr-pg))
157
+ );
88
158
 
89
159
  .apply_coupon_code_body {
90
160
  // padding-top: 16px;
91
161
  display: flex;
92
162
  align-items: flex-start;
93
163
  justify-content: space-between;
94
- gap: var(--_ctm-mob-dn-cn-wt-cr-im-gp,
95
- var(--_ctm-tab-dn-cn-wt-cr-im-gp, var(--_ctm-dn-cn-wt-cr-im-gp)));
164
+ gap: var(
165
+ --_ctm-mob-dn-cn-wt-cr-im-gp,
166
+ var(--_ctm-tab-dn-cn-wt-cr-im-gp, var(--_ctm-dn-cn-wt-cr-im-gp))
167
+ );
96
168
 
97
169
  .apply_coupon_code_flex {
98
170
  display: flex;
99
- gap: var(--_ctm-mob-dn-cn-wt-cr-im-gp,
100
- var(--_ctm-tab-dn-cn-wt-cr-im-gp, var(--_ctm-dn-cn-wt-cr-im-gp)));
171
+ gap: var(
172
+ --_ctm-mob-dn-cn-wt-cr-im-gp,
173
+ var(--_ctm-tab-dn-cn-wt-cr-im-gp, var(--_ctm-dn-cn-wt-cr-im-gp))
174
+ );
101
175
 
102
176
  .cpn__sale__icon {
103
177
  margin-top: 4px;
104
178
 
105
179
  .icon {
106
180
  svg {
107
- width: var(--_ctm-mob-dn-cn-wt-in-se,
108
- var(--_ctm-tab-dn-cn-wt-in-se, var(--_ctm-dn-cn-wt-in-se)));
109
- height: var(--_ctm-mob-dn-cn-wt-in-se,
110
- var(--_ctm-tab-dn-cn-wt-in-se, var(--_ctm-dn-cn-wt-in-se)));
181
+ width: var(
182
+ --_ctm-mob-dn-cn-wt-in-se,
183
+ var(--_ctm-tab-dn-cn-wt-in-se, var(--_ctm-dn-cn-wt-in-se))
184
+ );
185
+ height: var(
186
+ --_ctm-mob-dn-cn-wt-in-se,
187
+ var(--_ctm-tab-dn-cn-wt-in-se, var(--_ctm-dn-cn-wt-in-se))
188
+ );
111
189
 
112
190
  path {
113
- stroke: var(--_ctm-mob-dn-cn-wt-in-c1,
114
- var(--_ctm-tab-dn-cn-wt-in-c1, var(--_ctm-dn-cn-wt-in-c1)));
191
+ stroke: var(
192
+ --_ctm-mob-dn-cn-wt-in-c1,
193
+ var(--_ctm-tab-dn-cn-wt-in-c1, var(--_ctm-dn-cn-wt-in-c1))
194
+ );
115
195
  // Overrides the stroke-width presentation attribute baked into the icon markup.
116
196
  stroke-width: prepareMediaVariable(--_ctm-dn-cn-wt-se-wh, 1.25);
117
197
  }
@@ -127,30 +207,54 @@ $resizeActive: '[data-cms-element-resizer="true"]';
127
207
 
128
208
  .cpn_sale_text {
129
209
  // font-size: 14px;
130
- font-family: var(--_ctm-mob-dn-cn-wt-te-ft-fy,
131
- var(--_ctm-tab-dn-cn-wt-te-ft-fy, var(--_ctm-dn-cn-wt-te-ft-fy)));
132
- text-transform: var(--_ctm-mob-dn-cn-wt-te-tt-tm,
133
- var(--_ctm-tab-dn-cn-wt-te-tt-tm, var(--_ctm-dn-cn-wt-te-tt-tm)));
134
- word-wrap: var(--_ctm-mob-dn-cn-wt-te-wd-wp,
135
- var(--_ctm-tab-dn-cn-wt-te-wd-wp, var(--_ctm-dn-cn-wt-te-wd-wp)));
136
- word-break: var(--_ctm-mob-dn-cn-wt-te-wd-bk,
137
- var(--_ctm-tab-dn-cn-wt-te-wd-bk, var(--_ctm-dn-cn-wt-te-wd-bk)));
138
- color: var(--_ctm-mob-dn-cn-wt-te-cr,
139
- var(--_ctm-tab-dn-cn-wt-te-cr, var(--_ctm-dn-cn-wt-te-cr)));
140
- font-weight: var(--_ctm-mob-dn-cn-wt-te-ft-wt,
141
- var(--_ctm-tab-dn-cn-wt-te-ft-wt, var(--_ctm-dn-cn-wt-te-ft-wt)));
142
- font-size: var(--_ctm-mob-dn-cn-wt-te-ft-se,
143
- var(--_ctm-tab-dn-cn-wt-te-ft-se, var(--_ctm-dn-cn-wt-te-ft-se)));
144
- text-decoration: var(--_ctm-mob-dn-cn-wt-te-ue,
145
- var(--_ctm-tab-dn-cn-wt-te-ue, var(--_ctm-dn-cn-wt-te-ue)));
146
- letter-spacing: var(--_ctm-mob-dn-cn-wt-te-lr-sg,
147
- var(--_ctm-tab-dn-cn-wt-te-lr-sg, var(--_ctm-dn-cn-wt-te-lr-sg)));
148
- line-height: var(--_ctm-mob-dn-cn-wt-te-le-ht,
149
- var(--_ctm-tab-dn-cn-wt-te-le-ht, var(--_ctm-dn-cn-wt-te-le-ht)));
150
- font-style: var(--_ctm-mob-dn-cn-wt-te-ft-se-ic,
151
- var(--_ctm-tab-dn-cn-wt-te-ft-se-ic, var(--_ctm-dn-cn-wt-te-ft-se-ic)));
152
- text-align: var(--_ctm-mob-dn-cn-wt-te-tt-an,
153
- var(--_ctm-tab-dn-cn-wt-te-tt-an, var(--_ctm-dn-cn-wt-te-tt-an)));
210
+ font-family: var(
211
+ --_ctm-mob-dn-cn-wt-te-ft-fy,
212
+ var(--_ctm-tab-dn-cn-wt-te-ft-fy, var(--_ctm-dn-cn-wt-te-ft-fy))
213
+ );
214
+ text-transform: var(
215
+ --_ctm-mob-dn-cn-wt-te-tt-tm,
216
+ var(--_ctm-tab-dn-cn-wt-te-tt-tm, var(--_ctm-dn-cn-wt-te-tt-tm))
217
+ );
218
+ word-wrap: var(
219
+ --_ctm-mob-dn-cn-wt-te-wd-wp,
220
+ var(--_ctm-tab-dn-cn-wt-te-wd-wp, var(--_ctm-dn-cn-wt-te-wd-wp))
221
+ );
222
+ word-break: var(
223
+ --_ctm-mob-dn-cn-wt-te-wd-bk,
224
+ var(--_ctm-tab-dn-cn-wt-te-wd-bk, var(--_ctm-dn-cn-wt-te-wd-bk))
225
+ );
226
+ color: var(
227
+ --_ctm-mob-dn-cn-wt-te-cr,
228
+ var(--_ctm-tab-dn-cn-wt-te-cr, var(--_ctm-dn-cn-wt-te-cr))
229
+ );
230
+ font-weight: var(
231
+ --_ctm-mob-dn-cn-wt-te-ft-wt,
232
+ var(--_ctm-tab-dn-cn-wt-te-ft-wt, var(--_ctm-dn-cn-wt-te-ft-wt))
233
+ );
234
+ font-size: var(
235
+ --_ctm-mob-dn-cn-wt-te-ft-se,
236
+ var(--_ctm-tab-dn-cn-wt-te-ft-se, var(--_ctm-dn-cn-wt-te-ft-se))
237
+ );
238
+ text-decoration: var(
239
+ --_ctm-mob-dn-cn-wt-te-ue,
240
+ var(--_ctm-tab-dn-cn-wt-te-ue, var(--_ctm-dn-cn-wt-te-ue))
241
+ );
242
+ letter-spacing: var(
243
+ --_ctm-mob-dn-cn-wt-te-lr-sg,
244
+ var(--_ctm-tab-dn-cn-wt-te-lr-sg, var(--_ctm-dn-cn-wt-te-lr-sg))
245
+ );
246
+ line-height: var(
247
+ --_ctm-mob-dn-cn-wt-te-le-ht,
248
+ var(--_ctm-tab-dn-cn-wt-te-le-ht, var(--_ctm-dn-cn-wt-te-le-ht))
249
+ );
250
+ font-style: var(
251
+ --_ctm-mob-dn-cn-wt-te-ft-se-ic,
252
+ var(--_ctm-tab-dn-cn-wt-te-ft-se-ic, var(--_ctm-dn-cn-wt-te-ft-se-ic))
253
+ );
254
+ text-align: var(
255
+ --_ctm-mob-dn-cn-wt-te-tt-an,
256
+ var(--_ctm-tab-dn-cn-wt-te-tt-an, var(--_ctm-dn-cn-wt-te-tt-an))
257
+ );
154
258
  // font-size: 16px;
155
259
  // font-weight: 600;
156
260
  // color: var(--_gray-900);
@@ -158,63 +262,107 @@ $resizeActive: '[data-cms-element-resizer="true"]';
158
262
  }
159
263
 
160
264
  .cpn_sale_desc {
161
- font-family: var(--_ctm-mob-dn-cn-wt-dn-ft-fy,
162
- var(--_ctm-tab-dn-cn-wt-dn-ft-fy, var(--_ctm-dn-cn-wt-dn-ft-fy)));
163
- text-transform: var(--_ctm-mob-dn-cn-wt-dn-tt-tm,
164
- var(--_ctm-tab-dn-cn-wt-dn-tt-tm, var(--_ctm-dn-cn-wt-dn-tt-tm)));
165
- word-wrap: var(--_ctm-mob-dn-cn-wt-dn-wd-wp,
166
- var(--_ctm-tab-dn-cn-wt-dn-wd-wp, var(--_ctm-dn-cn-wt-dn-wd-wp)));
167
- word-break: var(--_ctm-mob-dn-cn-wt-dn-wd-bk,
168
- var(--_ctm-tab-dn-cn-wt-dn-wd-bk, var(--_ctm-dn-cn-wt-dn-wd-bk)));
169
- color: var(--_ctm-mob-dn-cn-wt-dn-cr,
170
- var(--_ctm-tab-dn-cn-wt-dn-cr, var(--_ctm-dn-cn-wt-dn-cr)));
171
- font-weight: var(--_ctm-mob-dn-cn-wt-dn-ft-wt,
172
- var(--_ctm-tab-dn-cn-wt-dn-ft-wt, var(--_ctm-dn-cn-wt-dn-ft-wt)));
265
+ font-family: var(
266
+ --_ctm-mob-dn-cn-wt-dn-ft-fy,
267
+ var(--_ctm-tab-dn-cn-wt-dn-ft-fy, var(--_ctm-dn-cn-wt-dn-ft-fy))
268
+ );
269
+ text-transform: var(
270
+ --_ctm-mob-dn-cn-wt-dn-tt-tm,
271
+ var(--_ctm-tab-dn-cn-wt-dn-tt-tm, var(--_ctm-dn-cn-wt-dn-tt-tm))
272
+ );
273
+ word-wrap: var(
274
+ --_ctm-mob-dn-cn-wt-dn-wd-wp,
275
+ var(--_ctm-tab-dn-cn-wt-dn-wd-wp, var(--_ctm-dn-cn-wt-dn-wd-wp))
276
+ );
277
+ word-break: var(
278
+ --_ctm-mob-dn-cn-wt-dn-wd-bk,
279
+ var(--_ctm-tab-dn-cn-wt-dn-wd-bk, var(--_ctm-dn-cn-wt-dn-wd-bk))
280
+ );
281
+ color: var(
282
+ --_ctm-mob-dn-cn-wt-dn-cr,
283
+ var(--_ctm-tab-dn-cn-wt-dn-cr, var(--_ctm-dn-cn-wt-dn-cr))
284
+ );
285
+ font-weight: var(
286
+ --_ctm-mob-dn-cn-wt-dn-ft-wt,
287
+ var(--_ctm-tab-dn-cn-wt-dn-ft-wt, var(--_ctm-dn-cn-wt-dn-ft-wt))
288
+ );
173
289
  // font-size: 14px;
174
- font-size: var(--_ctm-mob-dn-cn-wt-dn-ft-se,
175
- var(--_ctm-tab-dn-cn-wt-dn-ft-se, var(--_ctm-dn-cn-wt-dn-ft-se)));
176
- text-decoration: var(--_ctm-mob-dn-cn-wt-dn-ue,
177
- var(--_ctm-tab-dn-cn-wt-dn-ue, var(--_ctm-dn-cn-wt-dn-ue)));
178
- letter-spacing: var(--_ctm-mob-dn-cn-wt-dn-lr-sg,
179
- var(--_ctm-tab-dn-cn-wt-dn-lr-sg, var(--_ctm-dn-cn-wt-dn-lr-sg)));
180
- line-height: var(--_ctm-mob-dn-cn-wt-dn-le-ht,
181
- var(--_ctm-tab-dn-cn-wt-dn-le-ht, var(--_ctm-dn-cn-wt-dn-le-ht)));
182
- font-style: var(--_ctm-mob-dn-cn-wt-dn-ft-se-ic,
183
- var(--_ctm-tab-dn-cn-wt-dn-ft-se-ic, var(--_ctm-dn-cn-wt-dn-ft-se-ic)));
184
- text-align: var(--_ctm-mob-dn-cn-wt-dn-tt-an,
185
- var(--_ctm-tab-dn-cn-wt-dn-tt-an, var(--_ctm-dn-cn-wt-dn-tt-an)));
290
+ font-size: var(
291
+ --_ctm-mob-dn-cn-wt-dn-ft-se,
292
+ var(--_ctm-tab-dn-cn-wt-dn-ft-se, var(--_ctm-dn-cn-wt-dn-ft-se))
293
+ );
294
+ text-decoration: var(
295
+ --_ctm-mob-dn-cn-wt-dn-ue,
296
+ var(--_ctm-tab-dn-cn-wt-dn-ue, var(--_ctm-dn-cn-wt-dn-ue))
297
+ );
298
+ letter-spacing: var(
299
+ --_ctm-mob-dn-cn-wt-dn-lr-sg,
300
+ var(--_ctm-tab-dn-cn-wt-dn-lr-sg, var(--_ctm-dn-cn-wt-dn-lr-sg))
301
+ );
302
+ line-height: var(
303
+ --_ctm-mob-dn-cn-wt-dn-le-ht,
304
+ var(--_ctm-tab-dn-cn-wt-dn-le-ht, var(--_ctm-dn-cn-wt-dn-le-ht))
305
+ );
306
+ font-style: var(
307
+ --_ctm-mob-dn-cn-wt-dn-ft-se-ic,
308
+ var(--_ctm-tab-dn-cn-wt-dn-ft-se-ic, var(--_ctm-dn-cn-wt-dn-ft-se-ic))
309
+ );
310
+ text-align: var(
311
+ --_ctm-mob-dn-cn-wt-dn-tt-an,
312
+ var(--_ctm-tab-dn-cn-wt-dn-tt-an, var(--_ctm-dn-cn-wt-dn-tt-an))
313
+ );
186
314
 
187
315
  // font-size: 14px;
188
316
  // font-weight: 400;
189
317
  // color: var(--_gray-500);
190
318
  // line-height: 20px;
191
319
  .login_link {
192
- font-family: var(--_ctm-mob-dn-cn-wt-ft-fy-dc,
193
- var(--_ctm-tab-dn-cn-wt-ft-fy-dc, var(--_ctm-dn-cn-wt-ft-fy-dc)));
194
- text-transform: var(--_ctm-mob-dn-cn-wt-tt-tm-dc,
195
- var(--_ctm-tab-dn-cn-wt-tt-tm-dc, var(--_ctm-dn-cn-wt-tt-tm-dc)));
196
- word-wrap: var(--_ctm-mob-dn-cn-wt-wd-wp-dc,
197
- var(--_ctm-tab-dn-cn-wt-wd-wp-dc, var(--_ctm-dn-cn-wt-wd-wp-dc)));
198
- word-break: var(--_ctm-mob-dn-cn-wt-wd-bk-dc,
199
- var(--_ctm-tab-dn-cn-wt-wd-bk-dc, var(--_ctm-dn-cn-wt-wd-bk-dc)));
320
+ font-family: var(
321
+ --_ctm-mob-dn-cn-wt-ft-fy-dc,
322
+ var(--_ctm-tab-dn-cn-wt-ft-fy-dc, var(--_ctm-dn-cn-wt-ft-fy-dc))
323
+ );
324
+ text-transform: var(
325
+ --_ctm-mob-dn-cn-wt-tt-tm-dc,
326
+ var(--_ctm-tab-dn-cn-wt-tt-tm-dc, var(--_ctm-dn-cn-wt-tt-tm-dc))
327
+ );
328
+ word-wrap: var(
329
+ --_ctm-mob-dn-cn-wt-wd-wp-dc,
330
+ var(--_ctm-tab-dn-cn-wt-wd-wp-dc, var(--_ctm-dn-cn-wt-wd-wp-dc))
331
+ );
332
+ word-break: var(
333
+ --_ctm-mob-dn-cn-wt-wd-bk-dc,
334
+ var(--_ctm-tab-dn-cn-wt-wd-bk-dc, var(--_ctm-dn-cn-wt-wd-bk-dc))
335
+ );
200
336
  color: var(--_thm-cs-tt-ls-as);
201
- font-weight: var(--_ctm-mob-dn-cn-wt-ft-wt-dc,
202
- var(--_ctm-tab-dn-cn-wt-ft-wt-dc, var(--_ctm-dn-cn-wt-ft-wt-dc)));
337
+ font-weight: var(
338
+ --_ctm-mob-dn-cn-wt-ft-wt-dc,
339
+ var(--_ctm-tab-dn-cn-wt-ft-wt-dc, var(--_ctm-dn-cn-wt-ft-wt-dc))
340
+ );
203
341
  font-size: 14px;
204
342
  // font-size: var(
205
343
  // --_ctm-mob-dn-cn-wt-ft-se-dc,
206
344
  // var(--_ctm-tab-dn-cn-wt-ft-se-dc, var(--_ctm-dn-cn-wt-ft-se-dc))
207
345
  // );
208
- text-decoration: var(--_ctm-mob-dn-cn-wt-ue-dc,
209
- var(--_ctm-tab-dn-cn-wt-ue-dc, var(--_ctm-dn-cn-wt-ue-dc)));
210
- letter-spacing: var(--_ctm-mob-dn-cn-wt-lr-sg-dc,
211
- var(--_ctm-tab-dn-cn-wt-lr-sg-dc, var(--_ctm-dn-cn-wt-lr-sg-dc)));
212
- line-height: var(--_ctm-mob-dn-cn-wt-le-ht-dc,
213
- var(--_ctm-tab-dn-cn-wt-le-ht-dc, var(--_ctm-dn-cn-wt-le-ht-dc)));
214
- font-style: var(--_ctm-mob-dn-cn-wt-ft-se-ic-dc,
215
- var(--_ctm-tab-dn-cn-wt-ft-se-ic-dc, var(--_ctm-dn-cn-wt-ft-se-ic-dc)));
216
- text-align: var(--_ctm-mob-dn-cn-wt-tt-an-dc,
217
- var(--_ctm-tab-dn-cn-wt-tt-an-dc, var(--_ctm-dn-cn-wt-tt-an-dc)));
346
+ text-decoration: var(
347
+ --_ctm-mob-dn-cn-wt-ue-dc,
348
+ var(--_ctm-tab-dn-cn-wt-ue-dc, var(--_ctm-dn-cn-wt-ue-dc))
349
+ );
350
+ letter-spacing: var(
351
+ --_ctm-mob-dn-cn-wt-lr-sg-dc,
352
+ var(--_ctm-tab-dn-cn-wt-lr-sg-dc, var(--_ctm-dn-cn-wt-lr-sg-dc))
353
+ );
354
+ line-height: var(
355
+ --_ctm-mob-dn-cn-wt-le-ht-dc,
356
+ var(--_ctm-tab-dn-cn-wt-le-ht-dc, var(--_ctm-dn-cn-wt-le-ht-dc))
357
+ );
358
+ font-style: var(
359
+ --_ctm-mob-dn-cn-wt-ft-se-ic-dc,
360
+ var(--_ctm-tab-dn-cn-wt-ft-se-ic-dc, var(--_ctm-dn-cn-wt-ft-se-ic-dc))
361
+ );
362
+ text-align: var(
363
+ --_ctm-mob-dn-cn-wt-tt-an-dc,
364
+ var(--_ctm-tab-dn-cn-wt-tt-an-dc, var(--_ctm-dn-cn-wt-tt-an-dc))
365
+ );
218
366
  // color: var(--_primary-400);
219
367
  // font-weight: 700;
220
368
  }
@@ -309,8 +457,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
309
457
  }
310
458
  }
311
459
 
312
- background-color: var(--_sf-hr-bd-cr,
313
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-bd-cr));
460
+ background-color: var(
461
+ --_sf-hr-bd-cr,
462
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-bd-cr)
463
+ );
314
464
 
315
465
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-pg));
316
466
  width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-wh));
@@ -321,23 +471,34 @@ $resizeActive: '[data-cms-element-resizer="true"]';
321
471
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-at));
322
472
  gap: var(--_sf-hr-gp, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-gp));
323
473
 
324
- border-radius: var(--_sf-hr-br-rs,
325
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-rs));
474
+ border-radius: var(
475
+ --_sf-hr-br-rs,
476
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-rs)
477
+ );
326
478
 
327
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-cr));
479
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-ae))
480
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-br))
481
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-sd))
482
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-cr));
328
483
  width: 140px;
329
484
  display: flex;
330
485
 
331
486
  &[data-show-border="true"] {
332
487
  // width: 100%;
333
- border-color: var(--_sf-hr-br-cr,
334
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-cr));
335
-
336
- border-style: var(--_sf-hr-br-se,
337
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-se));
338
-
339
- border-width: var(--_sf-hr-br-wh,
340
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-wh));
488
+ border-color: var(
489
+ --_sf-hr-br-cr,
490
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-cr)
491
+ );
492
+
493
+ border-style: var(
494
+ --_sf-hr-br-se,
495
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-se)
496
+ );
497
+
498
+ border-width: var(
499
+ --_sf-hr-br-wh,
500
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-wh)
501
+ );
341
502
  }
342
503
 
343
504
  .txt {
@@ -345,14 +506,16 @@ $resizeActive: '[data-cms-element-resizer="true"]';
345
506
 
346
507
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-cr));
347
508
 
348
- font-family: var(--_sf-hr-ft-fy,
349
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-fy));
350
- text-transform: var(--_sf-hr-tt-tm,
351
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-tt-tm));
352
- word-wrap: var(--_sf-hr-wd-wp,
353
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-wd-wp));
354
- word-break: var(--_sf-hr-wd-bk,
355
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-wd-bk));
509
+ font-family: var(
510
+ --_sf-hr-ft-fy,
511
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-fy)
512
+ );
513
+ text-transform: var(
514
+ --_sf-hr-tt-tm,
515
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-tt-tm)
516
+ );
517
+ word-wrap: var(--_sf-hr-wd-wp, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-wd-wp));
518
+ word-break: var(--_sf-hr-wd-bk, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-wd-bk));
356
519
  &.flex__overflow {
357
520
  white-space: normal;
358
521
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
@@ -360,19 +523,27 @@ $resizeActive: '[data-cms-element-resizer="true"]';
360
523
 
361
524
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-se));
362
525
 
363
- font-weight: var(--_sf-hr-ft-wt,
364
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-wt));
526
+ font-weight: var(
527
+ --_sf-hr-ft-wt,
528
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-wt)
529
+ );
365
530
 
366
- font-style: var(--_sf-hr-ft-se-ic,
367
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-se-ic));
531
+ font-style: var(
532
+ --_sf-hr-ft-se-ic,
533
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-se-ic)
534
+ );
368
535
 
369
536
  text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-tt-an));
370
537
 
371
- letter-spacing: var(--_sf-hr-lr-sg,
372
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-lr-sg));
538
+ letter-spacing: var(
539
+ --_sf-hr-lr-sg,
540
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-lr-sg)
541
+ );
373
542
 
374
- line-height: var(--_sf-hr-le-ht,
375
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-le-ht));
543
+ line-height: var(
544
+ --_sf-hr-le-ht,
545
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-le-ht)
546
+ );
376
547
 
377
548
  text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-dt-ue));
378
549
  }
@@ -437,53 +608,109 @@ $resizeActive: '[data-cms-element-resizer="true"]';
437
608
  // padding: 12px;
438
609
  // width: 100%;
439
610
  // border-radius: 4px;
440
- font-family: var(--_ctm-mob-dn-cn-wt-it-fd-ft-fy,
441
- var(--_ctm-tab-dn-cn-wt-it-fd-ft-fy, var(--_ctm-dn-cn-wt-it-fd-ft-fy)));
442
- text-transform: var(--_ctm-mob-dn-cn-wt-it-fd-tt-tm,
443
- var(--_ctm-tab-dn-cn-wt-it-fd-tt-tm, var(--_ctm-dn-cn-wt-it-fd-tt-tm)));
444
- word-wrap: var(--_ctm-mob-dn-cn-wt-it-fd-wd-wp,
445
- var(--_ctm-tab-dn-cn-wt-it-fd-wd-wp, var(--_ctm-dn-cn-wt-it-fd-wd-wp)));
446
- word-break: var(--_ctm-mob-dn-cn-wt-it-fd-wd-bk,
447
- var(--_ctm-tab-dn-cn-wt-it-fd-wd-bk, var(--_ctm-dn-cn-wt-it-fd-wd-bk)));
448
- color: var(--_ctm-mob-dn-cn-wt-it-fd-cr,
449
- var(--_ctm-tab-dn-cn-wt-it-fd-cr, var(--_ctm-dn-cn-wt-it-fd-cr)));
450
- font-weight: var(--_ctm-mob-dn-cn-wt-it-fd-ft-wt,
451
- var(--_ctm-tab-dn-cn-wt-it-fd-ft-wt, var(--_ctm-dn-cn-wt-it-fd-ft-wt)));
452
- font-size: var(--_ctm-mob-dn-cn-wt-it-fd-ft-se,
453
- var(--_ctm-tab-dn-cn-wt-it-fd-ft-se, var(--_ctm-dn-cn-wt-it-fd-ft-se)));
454
- text-decoration: var(--_ctm-mob-dn-cn-wt-it-fd-ue,
455
- var(--_ctm-tab-dn-cn-wt-it-fd-ue, var(--_ctm-dn-cn-wt-it-fd-ue)));
456
- letter-spacing: var(--_ctm-mob-dn-cn-wt-it-fd-lr-sg,
457
- var(--_ctm-tab-dn-cn-wt-it-fd-lr-sg, var(--_ctm-dn-cn-wt-it-fd-lr-sg)));
458
- line-height: var(--_ctm-mob-dn-cn-wt-it-fd-le-ht,
459
- var(--_ctm-tab-dn-cn-wt-it-fd-le-ht, var(--_ctm-dn-cn-wt-it-fd-le-ht)));
460
- font-style: var(--_ctm-mob-dn-cn-wt-it-fd-ft-se-ic,
461
- var(--_ctm-tab-dn-cn-wt-it-fd-ft-se-ic, var(--_ctm-dn-cn-wt-it-fd-ft-se-ic)));
462
- text-align: var(--_ctm-mob-dn-cn-wt-it-fd-tt-an,
463
- var(--_ctm-tab-dn-cn-wt-it-fd-tt-an, var(--_ctm-dn-cn-wt-it-fd-tt-an)));
464
- background-color: var(--_ctm-mob-dn-cn-wt-it-fd-bd-cr,
465
- var(--_ctm-tab-dn-cn-wt-it-fd-bd-cr, var(--_ctm-dn-cn-wt-it-fd-bd-cr)));
466
- padding: var(--_ctm-mob-dn-cn-wt-it-fd-pg,
467
- var(--_ctm-tab-dn-cn-wt-it-fd-pg, var(--_ctm-dn-cn-wt-it-fd-pg)));
468
- gap: var(--_ctm-mob-dn-cn-wt-it-fd-im-gp,
469
- var(--_ctm-tab-dn-cn-wt-it-fd-im-gp, var(--_ctm-dn-cn-wt-it-fd-im-gp)));
470
- border-color: var(--_ctm-mob-dn-cn-wt-it-fd-br-cr,
471
- var(--_ctm-tab-dn-cn-wt-it-fd-br-cr, var(--_ctm-dn-cn-wt-it-fd-br-cr)));
472
- border-style: var(--_ctm-mob-dn-cn-wt-it-fd-br-se,
473
- var(--_ctm-tab-dn-cn-wt-it-fd-br-se, var(--_ctm-dn-cn-wt-it-fd-br-se)));
474
- border-width: var(--_ctm-mob-dn-cn-wt-it-fd-br-wh,
475
- var(--_ctm-tab-dn-cn-wt-it-fd-br-wh, var(--_ctm-dn-cn-wt-it-fd-br-wh)));
476
- border-radius: var(--_ctm-mob-dn-cn-wt-it-fd-br-rs,
477
- var(--_ctm-tab-dn-cn-wt-it-fd-br-rs, var(--_ctm-dn-cn-wt-it-fd-br-rs)));
478
- box-shadow: var(--_ctm-mob-dn-cn-wt-it-fd-sw-ae,
479
- var(--_ctm-tab-dn-cn-wt-it-fd-sw-ae, var(--_ctm-dn-cn-wt-it-fd-sw-ae))) var(--_ctm-mob-dn-cn-wt-it-fd-sw-br,
480
- var(--_ctm-tab-dn-cn-wt-it-fd-sw-br, var(--_ctm-dn-cn-wt-it-fd-sw-br))) var(--_ctm-mob-dn-cn-wt-it-fd-sw-sd,
481
- var(--_ctm-tab-dn-cn-wt-it-fd-sw-sd, var(--_ctm-dn-cn-wt-it-fd-sw-sd))) var(--_ctm-mob-dn-cn-wt-it-fd-sw-cr,
482
- var(--_ctm-tab-dn-cn-wt-it-fd-sw-cr, var(--_ctm-dn-cn-wt-it-fd-sw-cr)));
611
+ font-family: var(
612
+ --_ctm-mob-dn-cn-wt-it-fd-ft-fy,
613
+ var(--_ctm-tab-dn-cn-wt-it-fd-ft-fy, var(--_ctm-dn-cn-wt-it-fd-ft-fy))
614
+ );
615
+ text-transform: var(
616
+ --_ctm-mob-dn-cn-wt-it-fd-tt-tm,
617
+ var(--_ctm-tab-dn-cn-wt-it-fd-tt-tm, var(--_ctm-dn-cn-wt-it-fd-tt-tm))
618
+ );
619
+ word-wrap: var(
620
+ --_ctm-mob-dn-cn-wt-it-fd-wd-wp,
621
+ var(--_ctm-tab-dn-cn-wt-it-fd-wd-wp, var(--_ctm-dn-cn-wt-it-fd-wd-wp))
622
+ );
623
+ word-break: var(
624
+ --_ctm-mob-dn-cn-wt-it-fd-wd-bk,
625
+ var(--_ctm-tab-dn-cn-wt-it-fd-wd-bk, var(--_ctm-dn-cn-wt-it-fd-wd-bk))
626
+ );
627
+ color: var(
628
+ --_ctm-mob-dn-cn-wt-it-fd-cr,
629
+ var(--_ctm-tab-dn-cn-wt-it-fd-cr, var(--_ctm-dn-cn-wt-it-fd-cr))
630
+ );
631
+ font-weight: var(
632
+ --_ctm-mob-dn-cn-wt-it-fd-ft-wt,
633
+ var(--_ctm-tab-dn-cn-wt-it-fd-ft-wt, var(--_ctm-dn-cn-wt-it-fd-ft-wt))
634
+ );
635
+ font-size: var(
636
+ --_ctm-mob-dn-cn-wt-it-fd-ft-se,
637
+ var(--_ctm-tab-dn-cn-wt-it-fd-ft-se, var(--_ctm-dn-cn-wt-it-fd-ft-se))
638
+ );
639
+ text-decoration: var(
640
+ --_ctm-mob-dn-cn-wt-it-fd-ue,
641
+ var(--_ctm-tab-dn-cn-wt-it-fd-ue, var(--_ctm-dn-cn-wt-it-fd-ue))
642
+ );
643
+ letter-spacing: var(
644
+ --_ctm-mob-dn-cn-wt-it-fd-lr-sg,
645
+ var(--_ctm-tab-dn-cn-wt-it-fd-lr-sg, var(--_ctm-dn-cn-wt-it-fd-lr-sg))
646
+ );
647
+ line-height: var(
648
+ --_ctm-mob-dn-cn-wt-it-fd-le-ht,
649
+ var(--_ctm-tab-dn-cn-wt-it-fd-le-ht, var(--_ctm-dn-cn-wt-it-fd-le-ht))
650
+ );
651
+ font-style: var(
652
+ --_ctm-mob-dn-cn-wt-it-fd-ft-se-ic,
653
+ var(--_ctm-tab-dn-cn-wt-it-fd-ft-se-ic, var(--_ctm-dn-cn-wt-it-fd-ft-se-ic))
654
+ );
655
+ text-align: var(
656
+ --_ctm-mob-dn-cn-wt-it-fd-tt-an,
657
+ var(--_ctm-tab-dn-cn-wt-it-fd-tt-an, var(--_ctm-dn-cn-wt-it-fd-tt-an))
658
+ );
659
+ background-color: var(
660
+ --_ctm-mob-dn-cn-wt-it-fd-bd-cr,
661
+ var(--_ctm-tab-dn-cn-wt-it-fd-bd-cr, var(--_ctm-dn-cn-wt-it-fd-bd-cr))
662
+ );
663
+ padding: var(
664
+ --_ctm-mob-dn-cn-wt-it-fd-pg,
665
+ var(--_ctm-tab-dn-cn-wt-it-fd-pg, var(--_ctm-dn-cn-wt-it-fd-pg))
666
+ );
667
+ gap: var(
668
+ --_ctm-mob-dn-cn-wt-it-fd-im-gp,
669
+ var(--_ctm-tab-dn-cn-wt-it-fd-im-gp, var(--_ctm-dn-cn-wt-it-fd-im-gp))
670
+ );
671
+ border-color: var(
672
+ --_ctm-mob-dn-cn-wt-it-fd-br-cr,
673
+ var(--_ctm-tab-dn-cn-wt-it-fd-br-cr, var(--_ctm-dn-cn-wt-it-fd-br-cr))
674
+ );
675
+ border-style: var(
676
+ --_ctm-mob-dn-cn-wt-it-fd-br-se,
677
+ var(--_ctm-tab-dn-cn-wt-it-fd-br-se, var(--_ctm-dn-cn-wt-it-fd-br-se))
678
+ );
679
+ border-width: var(
680
+ --_ctm-mob-dn-cn-wt-it-fd-br-wh,
681
+ var(--_ctm-tab-dn-cn-wt-it-fd-br-wh, var(--_ctm-dn-cn-wt-it-fd-br-wh))
682
+ );
683
+ border-radius: var(
684
+ --_ctm-mob-dn-cn-wt-it-fd-br-rs,
685
+ var(--_ctm-tab-dn-cn-wt-it-fd-br-rs, var(--_ctm-dn-cn-wt-it-fd-br-rs))
686
+ );
687
+ box-shadow: var(
688
+ --_ctm-mob-dn-cn-wt-it-fd-sw-ae,
689
+ var(--_ctm-tab-dn-cn-wt-it-fd-sw-ae, var(--_ctm-dn-cn-wt-it-fd-sw-ae))
690
+ )
691
+ var(
692
+ --_ctm-mob-dn-cn-wt-it-fd-sw-br,
693
+ var(--_ctm-tab-dn-cn-wt-it-fd-sw-br, var(--_ctm-dn-cn-wt-it-fd-sw-br))
694
+ )
695
+ var(
696
+ --_ctm-mob-dn-cn-wt-it-fd-sw-sd,
697
+ var(--_ctm-tab-dn-cn-wt-it-fd-sw-sd, var(--_ctm-dn-cn-wt-it-fd-sw-sd))
698
+ )
699
+ var(
700
+ --_ctm-mob-dn-cn-wt-it-fd-sw-cr,
701
+ var(--_ctm-tab-dn-cn-wt-it-fd-sw-cr, var(--_ctm-dn-cn-wt-it-fd-sw-cr))
702
+ );
483
703
  transition:
484
704
  outline 0.2s ease,
485
705
  border 0.2s ease;
486
706
 
707
+ // A single-line form control cannot be clamped to N lines, so the line
708
+ // count has no meaning here — Text Overflow degrades to an ellipsis on the
709
+ // overflowing value rather than doing nothing at all.
710
+ &.flex__overflow {
711
+ text-overflow: ellipsis;
712
+ }
713
+
487
714
  &:focus {
488
715
  outline: 0 none;
489
716
  outline-offset: 0;
@@ -556,8 +783,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
556
783
  }
557
784
  }
558
785
 
559
- background-color: var(--_sf-hr-bd-cr,
560
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-bd-cr));
786
+ background-color: var(
787
+ --_sf-hr-bd-cr,
788
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-bd-cr)
789
+ );
561
790
 
562
791
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-pg));
563
792
  // width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-wh));
@@ -568,23 +797,34 @@ $resizeActive: '[data-cms-element-resizer="true"]';
568
797
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-at));
569
798
  gap: var(--_sf-hr-gp, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-gp));
570
799
 
571
- border-radius: var(--_sf-hr-br-rs,
572
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-rs));
800
+ border-radius: var(
801
+ --_sf-hr-br-rs,
802
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-rs)
803
+ );
573
804
 
574
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-cr));
805
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-ae))
806
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-br))
807
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-sd))
808
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-sw-cr));
575
809
  width: 140px;
576
810
  display: flex;
577
811
 
578
812
  &[data-show-border="true"] {
579
813
  // width: 100%;
580
- border-color: var(--_sf-hr-br-cr,
581
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-cr));
582
-
583
- border-style: var(--_sf-hr-br-se,
584
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-se));
585
-
586
- border-width: var(--_sf-hr-br-wh,
587
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-wh));
814
+ border-color: var(
815
+ --_sf-hr-br-cr,
816
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-cr)
817
+ );
818
+
819
+ border-style: var(
820
+ --_sf-hr-br-se,
821
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-se)
822
+ );
823
+
824
+ border-width: var(
825
+ --_sf-hr-br-wh,
826
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-br-wh)
827
+ );
588
828
  }
589
829
 
590
830
  .txt {
@@ -592,36 +832,56 @@ $resizeActive: '[data-cms-element-resizer="true"]';
592
832
  white-space: nowrap;
593
833
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-cr));
594
834
 
595
- font-family: var(--_sf-hr-ft-fy,
596
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-fy));
597
- text-transform: var(--_sf-hr-tt-tm,
598
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-tt-tm));
599
- word-wrap: var(--_sf-hr-wd-wp,
600
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-wd-wp));
601
- word-break: var(--_sf-hr-wd-bk,
602
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-wd-bk));
835
+ font-family: var(
836
+ --_sf-hr-ft-fy,
837
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-fy)
838
+ );
839
+ text-transform: var(
840
+ --_sf-hr-tt-tm,
841
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-tt-tm)
842
+ );
843
+ word-wrap: var(
844
+ --_sf-hr-wd-wp,
845
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-wd-wp)
846
+ );
847
+ word-break: var(
848
+ --_sf-hr-wd-bk,
849
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-wd-bk)
850
+ );
603
851
  &.flex__overflow {
604
852
  white-space: normal;
605
853
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
606
854
  }
607
855
 
608
- font-size: var(--_sf-hr-ft-se,
609
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-se));
856
+ font-size: var(
857
+ --_sf-hr-ft-se,
858
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-se)
859
+ );
610
860
 
611
- font-weight: var(--_sf-hr-ft-wt,
612
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-wt));
861
+ font-weight: var(
862
+ --_sf-hr-ft-wt,
863
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-wt)
864
+ );
613
865
 
614
- font-style: var(--_sf-hr-ft-se-ic,
615
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-se-ic));
866
+ font-style: var(
867
+ --_sf-hr-ft-se-ic,
868
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-ft-se-ic)
869
+ );
616
870
 
617
- text-align: var(--_sf-hr-tt-an,
618
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-tt-an));
871
+ text-align: var(
872
+ --_sf-hr-tt-an,
873
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-tt-an)
874
+ );
619
875
 
620
- letter-spacing: var(--_sf-hr-lr-sg,
621
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-lr-sg));
876
+ letter-spacing: var(
877
+ --_sf-hr-lr-sg,
878
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-lr-sg)
879
+ );
622
880
 
623
- line-height: var(--_sf-hr-le-ht,
624
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-le-ht));
881
+ line-height: var(
882
+ --_sf-hr-le-ht,
883
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-le-ht)
884
+ );
625
885
 
626
886
  text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-dt-ue));
627
887
  }
@@ -634,8 +894,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
634
894
  height: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-in-se));
635
895
 
636
896
  path {
637
- stroke: var(--_sf-hr-in-c1,
638
- prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-in-c1));
897
+ stroke: var(
898
+ --_sf-hr-in-c1,
899
+ prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-in-c1)
900
+ );
639
901
  // Overrides the stroke-width presentation attribute baked into the icon markup.
640
902
  stroke-width: prepareMediaVariable(--_ctm-dn-as-ay-bn-dt-se-se-wh, 1.25);
641
903
  }
@@ -714,30 +976,59 @@ $resizeActive: '[data-cms-element-resizer="true"]';
714
976
  // font-weight: 700;
715
977
  // line-height: 24px;
716
978
  // color: #101828;
717
- font-family: var(--_ctm-mob-dn-cn-wt-cn-tt-ft-fy,
718
- var(--_ctm-tab-dn-cn-wt-cn-tt-ft-fy, var(--_ctm-dn-cn-wt-cn-tt-ft-fy)));
719
- text-transform: var(--_ctm-mob-dn-cn-wt-cn-tt-tt-tm,
720
- var(--_ctm-tab-dn-cn-wt-cn-tt-tt-tm, var(--_ctm-dn-cn-wt-cn-tt-tt-tm)));
721
- word-wrap: var(--_ctm-mob-dn-cn-wt-cn-tt-wd-wp,
722
- var(--_ctm-tab-dn-cn-wt-cn-tt-wd-wp, var(--_ctm-dn-cn-wt-cn-tt-wd-wp)));
723
- word-break: var(--_ctm-mob-dn-cn-wt-cn-tt-wd-bk,
724
- var(--_ctm-tab-dn-cn-wt-cn-tt-wd-bk, var(--_ctm-dn-cn-wt-cn-tt-wd-bk)));
725
- color: var(--_ctm-mob-dn-cn-wt-cn-tt-cr,
726
- var(--_ctm-tab-dn-cn-wt-cn-tt-cr, var(--_ctm-dn-cn-wt-cn-tt-cr)));
727
- font-weight: var(--_ctm-mob-dn-cn-wt-cn-tt-ft-wt,
728
- var(--_ctm-tab-dn-cn-wt-cn-tt-ft-wt, var(--_ctm-dn-cn-wt-cn-tt-ft-wt)));
729
- font-size: var(--_ctm-mob-dn-cn-wt-cn-tt-ft-se,
730
- var(--_ctm-tab-dn-cn-wt-cn-tt-ft-se, var(--_ctm-dn-cn-wt-cn-tt-ft-se)));
731
- text-decoration: var(--_ctm-mob-dn-cn-wt-cn-tt-ue,
732
- var(--_ctm-tab-dn-cn-wt-cn-tt-ue, var(--_ctm-dn-cn-wt-cn-tt-ue)));
733
- letter-spacing: var(--_ctm-mob-dn-cn-wt-cn-tt-lr-sg,
734
- var(--_ctm-tab-dn-cn-wt-cn-tt-lr-sg, var(--_ctm-dn-cn-wt-cn-tt-lr-sg)));
735
- line-height: var(--_ctm-mob-dn-cn-wt-cn-tt-le-ht,
736
- var(--_ctm-tab-dn-cn-wt-cn-tt-le-ht, var(--_ctm-dn-cn-wt-cn-tt-le-ht)));
737
- font-style: var(--_ctm-mob-dn-cn-wt-cn-tt-ft-se-ic,
738
- var(--_ctm-tab-dn-cn-wt-cn-tt-ft-se-ic, var(--_ctm-dn-cn-wt-cn-tt-ft-se-ic)));
739
- text-align: var(--_ctm-mob-dn-cn-wt-cn-tt-tt-an,
740
- var(--_ctm-tab-dn-cn-wt-cn-tt-tt-an, var(--_ctm-dn-cn-wt-cn-tt-tt-an)));
979
+ font-family: var(
980
+ --_ctm-mob-dn-cn-wt-cn-tt-ft-fy,
981
+ var(--_ctm-tab-dn-cn-wt-cn-tt-ft-fy, var(--_ctm-dn-cn-wt-cn-tt-ft-fy))
982
+ );
983
+ text-transform: var(
984
+ --_ctm-mob-dn-cn-wt-cn-tt-tt-tm,
985
+ var(--_ctm-tab-dn-cn-wt-cn-tt-tt-tm, var(--_ctm-dn-cn-wt-cn-tt-tt-tm))
986
+ );
987
+ word-wrap: var(
988
+ --_ctm-mob-dn-cn-wt-cn-tt-wd-wp,
989
+ var(--_ctm-tab-dn-cn-wt-cn-tt-wd-wp, var(--_ctm-dn-cn-wt-cn-tt-wd-wp))
990
+ );
991
+ word-break: var(
992
+ --_ctm-mob-dn-cn-wt-cn-tt-wd-bk,
993
+ var(--_ctm-tab-dn-cn-wt-cn-tt-wd-bk, var(--_ctm-dn-cn-wt-cn-tt-wd-bk))
994
+ );
995
+ color: var(
996
+ --_ctm-mob-dn-cn-wt-cn-tt-cr,
997
+ var(--_ctm-tab-dn-cn-wt-cn-tt-cr, var(--_ctm-dn-cn-wt-cn-tt-cr))
998
+ );
999
+ font-weight: var(
1000
+ --_ctm-mob-dn-cn-wt-cn-tt-ft-wt,
1001
+ var(--_ctm-tab-dn-cn-wt-cn-tt-ft-wt, var(--_ctm-dn-cn-wt-cn-tt-ft-wt))
1002
+ );
1003
+ font-size: var(
1004
+ --_ctm-mob-dn-cn-wt-cn-tt-ft-se,
1005
+ var(--_ctm-tab-dn-cn-wt-cn-tt-ft-se, var(--_ctm-dn-cn-wt-cn-tt-ft-se))
1006
+ );
1007
+ text-decoration: var(
1008
+ --_ctm-mob-dn-cn-wt-cn-tt-ue,
1009
+ var(--_ctm-tab-dn-cn-wt-cn-tt-ue, var(--_ctm-dn-cn-wt-cn-tt-ue))
1010
+ );
1011
+ letter-spacing: var(
1012
+ --_ctm-mob-dn-cn-wt-cn-tt-lr-sg,
1013
+ var(--_ctm-tab-dn-cn-wt-cn-tt-lr-sg, var(--_ctm-dn-cn-wt-cn-tt-lr-sg))
1014
+ );
1015
+ line-height: var(
1016
+ --_ctm-mob-dn-cn-wt-cn-tt-le-ht,
1017
+ var(--_ctm-tab-dn-cn-wt-cn-tt-le-ht, var(--_ctm-dn-cn-wt-cn-tt-le-ht))
1018
+ );
1019
+ font-style: var(
1020
+ --_ctm-mob-dn-cn-wt-cn-tt-ft-se-ic,
1021
+ var(--_ctm-tab-dn-cn-wt-cn-tt-ft-se-ic, var(--_ctm-dn-cn-wt-cn-tt-ft-se-ic))
1022
+ );
1023
+ text-align: var(
1024
+ --_ctm-mob-dn-cn-wt-cn-tt-tt-an,
1025
+ var(--_ctm-tab-dn-cn-wt-cn-tt-tt-an, var(--_ctm-dn-cn-wt-cn-tt-tt-an))
1026
+ );
1027
+
1028
+ &.flex__overflow {
1029
+ white-space: normal;
1030
+ @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
1031
+ }
741
1032
  }
742
1033
 
743
1034
  .coupon-currency {
@@ -750,30 +1041,59 @@ $resizeActive: '[data-cms-element-resizer="true"]';
750
1041
  // font-weight: 400;
751
1042
  // line-height: 20px;
752
1043
  // color: #667085;
753
- font-family: var(--_ctm-mob-dn-cn-wt-sd-te-ft-fy,
754
- var(--_ctm-tab-dn-cn-wt-sd-te-ft-fy, var(--_ctm-dn-cn-wt-sd-te-ft-fy)));
755
- text-transform: var(--_ctm-mob-dn-cn-wt-sd-te-tt-tm,
756
- var(--_ctm-tab-dn-cn-wt-sd-te-tt-tm, var(--_ctm-dn-cn-wt-sd-te-tt-tm)));
757
- word-wrap: var(--_ctm-mob-dn-cn-wt-sd-te-wd-wp,
758
- var(--_ctm-tab-dn-cn-wt-sd-te-wd-wp, var(--_ctm-dn-cn-wt-sd-te-wd-wp)));
759
- word-break: var(--_ctm-mob-dn-cn-wt-sd-te-wd-bk,
760
- var(--_ctm-tab-dn-cn-wt-sd-te-wd-bk, var(--_ctm-dn-cn-wt-sd-te-wd-bk)));
761
- color: var(--_ctm-mob-dn-cn-wt-sd-te-cr,
762
- var(--_ctm-tab-dn-cn-wt-sd-te-cr, var(--_ctm-dn-cn-wt-sd-te-cr)));
763
- font-weight: var(--_ctm-mob-dn-cn-wt-sd-te-ft-wt,
764
- var(--_ctm-tab-dn-cn-wt-sd-te-ft-wt, var(--_ctm-dn-cn-wt-sd-te-ft-wt)));
765
- font-size: var(--_ctm-mob-dn-cn-wt-sd-te-ft-se,
766
- var(--_ctm-tab-dn-cn-wt-sd-te-ft-se, var(--_ctm-dn-cn-wt-sd-te-ft-se)));
767
- text-decoration: var(--_ctm-mob-dn-cn-wt-sd-te-ue,
768
- var(--_ctm-tab-dn-cn-wt-sd-te-ue, var(--_ctm-dn-cn-wt-sd-te-ue)));
769
- letter-spacing: var(--_ctm-mob-dn-cn-wt-sd-te-lr-sg,
770
- var(--_ctm-tab-dn-cn-wt-sd-te-lr-sg, var(--_ctm-dn-cn-wt-sd-te-lr-sg)));
771
- line-height: var(--_ctm-mob-dn-cn-wt-sd-te-le-ht,
772
- var(--_ctm-tab-dn-cn-wt-sd-te-le-ht, var(--_ctm-dn-cn-wt-sd-te-le-ht)));
773
- font-style: var(--_ctm-mob-dn-cn-wt-sd-te-ft-se-ic,
774
- var(--_ctm-tab-dn-cn-wt-sd-te-ft-se-ic, var(--_ctm-dn-cn-wt-sd-te-ft-se-ic)));
775
- text-align: var(--_ctm-mob-dn-cn-wt-sd-te-tt-an,
776
- var(--_ctm-tab-dn-cn-wt-sd-te-tt-an, var(--_ctm-dn-cn-wt-sd-te-tt-an)));
1044
+ font-family: var(
1045
+ --_ctm-mob-dn-cn-wt-sd-te-ft-fy,
1046
+ var(--_ctm-tab-dn-cn-wt-sd-te-ft-fy, var(--_ctm-dn-cn-wt-sd-te-ft-fy))
1047
+ );
1048
+ text-transform: var(
1049
+ --_ctm-mob-dn-cn-wt-sd-te-tt-tm,
1050
+ var(--_ctm-tab-dn-cn-wt-sd-te-tt-tm, var(--_ctm-dn-cn-wt-sd-te-tt-tm))
1051
+ );
1052
+ word-wrap: var(
1053
+ --_ctm-mob-dn-cn-wt-sd-te-wd-wp,
1054
+ var(--_ctm-tab-dn-cn-wt-sd-te-wd-wp, var(--_ctm-dn-cn-wt-sd-te-wd-wp))
1055
+ );
1056
+ word-break: var(
1057
+ --_ctm-mob-dn-cn-wt-sd-te-wd-bk,
1058
+ var(--_ctm-tab-dn-cn-wt-sd-te-wd-bk, var(--_ctm-dn-cn-wt-sd-te-wd-bk))
1059
+ );
1060
+ color: var(
1061
+ --_ctm-mob-dn-cn-wt-sd-te-cr,
1062
+ var(--_ctm-tab-dn-cn-wt-sd-te-cr, var(--_ctm-dn-cn-wt-sd-te-cr))
1063
+ );
1064
+ font-weight: var(
1065
+ --_ctm-mob-dn-cn-wt-sd-te-ft-wt,
1066
+ var(--_ctm-tab-dn-cn-wt-sd-te-ft-wt, var(--_ctm-dn-cn-wt-sd-te-ft-wt))
1067
+ );
1068
+ font-size: var(
1069
+ --_ctm-mob-dn-cn-wt-sd-te-ft-se,
1070
+ var(--_ctm-tab-dn-cn-wt-sd-te-ft-se, var(--_ctm-dn-cn-wt-sd-te-ft-se))
1071
+ );
1072
+ text-decoration: var(
1073
+ --_ctm-mob-dn-cn-wt-sd-te-ue,
1074
+ var(--_ctm-tab-dn-cn-wt-sd-te-ue, var(--_ctm-dn-cn-wt-sd-te-ue))
1075
+ );
1076
+ letter-spacing: var(
1077
+ --_ctm-mob-dn-cn-wt-sd-te-lr-sg,
1078
+ var(--_ctm-tab-dn-cn-wt-sd-te-lr-sg, var(--_ctm-dn-cn-wt-sd-te-lr-sg))
1079
+ );
1080
+ line-height: var(
1081
+ --_ctm-mob-dn-cn-wt-sd-te-le-ht,
1082
+ var(--_ctm-tab-dn-cn-wt-sd-te-le-ht, var(--_ctm-dn-cn-wt-sd-te-le-ht))
1083
+ );
1084
+ font-style: var(
1085
+ --_ctm-mob-dn-cn-wt-sd-te-ft-se-ic,
1086
+ var(--_ctm-tab-dn-cn-wt-sd-te-ft-se-ic, var(--_ctm-dn-cn-wt-sd-te-ft-se-ic))
1087
+ );
1088
+ text-align: var(
1089
+ --_ctm-mob-dn-cn-wt-sd-te-tt-an,
1090
+ var(--_ctm-tab-dn-cn-wt-sd-te-tt-an, var(--_ctm-dn-cn-wt-sd-te-tt-an))
1091
+ );
1092
+
1093
+ &.flex__overflow {
1094
+ white-space: normal;
1095
+ @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
1096
+ }
777
1097
  }
778
1098
 
779
1099
  .currency_span {
@@ -781,30 +1101,54 @@ $resizeActive: '[data-cms-element-resizer="true"]';
781
1101
  // font-weight: 400;
782
1102
  // line-height: 20px;
783
1103
  // color: #667085;
784
- font-family: var(--_ctm-mob-dn-cn-wt-pe-ft-fy,
785
- var(--_ctm-tab-dn-cn-wt-pe-ft-fy, var(--_ctm-dn-cn-wt-pe-ft-fy)));
786
- text-transform: var(--_ctm-mob-dn-cn-wt-pe-tt-tm,
787
- var(--_ctm-tab-dn-cn-wt-pe-tt-tm, var(--_ctm-dn-cn-wt-pe-tt-tm)));
788
- word-wrap: var(--_ctm-mob-dn-cn-wt-pe-wd-wp,
789
- var(--_ctm-tab-dn-cn-wt-pe-wd-wp, var(--_ctm-dn-cn-wt-pe-wd-wp)));
790
- word-break: var(--_ctm-mob-dn-cn-wt-pe-wd-bk,
791
- var(--_ctm-tab-dn-cn-wt-pe-wd-bk, var(--_ctm-dn-cn-wt-pe-wd-bk)));
792
- color: var(--_ctm-mob-dn-cn-wt-pe-cr,
793
- var(--_ctm-tab-dn-cn-wt-pe-cr, var(--_ctm-dn-cn-wt-pe-cr)));
794
- font-weight: var(--_ctm-mob-dn-cn-wt-pe-ft-wt,
795
- var(--_ctm-tab-dn-cn-wt-pe-ft-wt, var(--_ctm-dn-cn-wt-pe-ft-wt)));
796
- font-size: var(--_ctm-mob-dn-cn-wt-pe-ft-se,
797
- var(--_ctm-tab-dn-cn-wt-pe-ft-se, var(--_ctm-dn-cn-wt-pe-ft-se)));
798
- text-decoration: var(--_ctm-mob-dn-cn-wt-pe-ue,
799
- var(--_ctm-tab-dn-cn-wt-pe-ue, var(--_ctm-dn-cn-wt-pe-ue)));
800
- letter-spacing: var(--_ctm-mob-dn-cn-wt-pe-lr-sg,
801
- var(--_ctm-tab-dn-cn-wt-pe-lr-sg, var(--_ctm-dn-cn-wt-pe-lr-sg)));
802
- line-height: var(--_ctm-mob-dn-cn-wt-pe-le-ht,
803
- var(--_ctm-tab-dn-cn-wt-pe-le-ht, var(--_ctm-dn-cn-wt-pe-le-ht)));
804
- font-style: var(--_ctm-mob-dn-cn-wt-pe-ft-se-ic,
805
- var(--_ctm-tab-dn-cn-wt-pe-ft-se-ic, var(--_ctm-dn-cn-wt-pe-ft-se-ic)));
806
- text-align: var(--_ctm-mob-dn-cn-wt-pe-tt-an,
807
- var(--_ctm-tab-dn-cn-wt-pe-tt-an, var(--_ctm-dn-cn-wt-pe-tt-an)));
1104
+ font-family: var(
1105
+ --_ctm-mob-dn-cn-wt-pe-ft-fy,
1106
+ var(--_ctm-tab-dn-cn-wt-pe-ft-fy, var(--_ctm-dn-cn-wt-pe-ft-fy))
1107
+ );
1108
+ text-transform: var(
1109
+ --_ctm-mob-dn-cn-wt-pe-tt-tm,
1110
+ var(--_ctm-tab-dn-cn-wt-pe-tt-tm, var(--_ctm-dn-cn-wt-pe-tt-tm))
1111
+ );
1112
+ word-wrap: var(
1113
+ --_ctm-mob-dn-cn-wt-pe-wd-wp,
1114
+ var(--_ctm-tab-dn-cn-wt-pe-wd-wp, var(--_ctm-dn-cn-wt-pe-wd-wp))
1115
+ );
1116
+ word-break: var(
1117
+ --_ctm-mob-dn-cn-wt-pe-wd-bk,
1118
+ var(--_ctm-tab-dn-cn-wt-pe-wd-bk, var(--_ctm-dn-cn-wt-pe-wd-bk))
1119
+ );
1120
+ color: var(
1121
+ --_ctm-mob-dn-cn-wt-pe-cr,
1122
+ var(--_ctm-tab-dn-cn-wt-pe-cr, var(--_ctm-dn-cn-wt-pe-cr))
1123
+ );
1124
+ font-weight: var(
1125
+ --_ctm-mob-dn-cn-wt-pe-ft-wt,
1126
+ var(--_ctm-tab-dn-cn-wt-pe-ft-wt, var(--_ctm-dn-cn-wt-pe-ft-wt))
1127
+ );
1128
+ font-size: var(
1129
+ --_ctm-mob-dn-cn-wt-pe-ft-se,
1130
+ var(--_ctm-tab-dn-cn-wt-pe-ft-se, var(--_ctm-dn-cn-wt-pe-ft-se))
1131
+ );
1132
+ text-decoration: var(
1133
+ --_ctm-mob-dn-cn-wt-pe-ue,
1134
+ var(--_ctm-tab-dn-cn-wt-pe-ue, var(--_ctm-dn-cn-wt-pe-ue))
1135
+ );
1136
+ letter-spacing: var(
1137
+ --_ctm-mob-dn-cn-wt-pe-lr-sg,
1138
+ var(--_ctm-tab-dn-cn-wt-pe-lr-sg, var(--_ctm-dn-cn-wt-pe-lr-sg))
1139
+ );
1140
+ line-height: var(
1141
+ --_ctm-mob-dn-cn-wt-pe-le-ht,
1142
+ var(--_ctm-tab-dn-cn-wt-pe-le-ht, var(--_ctm-dn-cn-wt-pe-le-ht))
1143
+ );
1144
+ font-style: var(
1145
+ --_ctm-mob-dn-cn-wt-pe-ft-se-ic,
1146
+ var(--_ctm-tab-dn-cn-wt-pe-ft-se-ic, var(--_ctm-dn-cn-wt-pe-ft-se-ic))
1147
+ );
1148
+ text-align: var(
1149
+ --_ctm-mob-dn-cn-wt-pe-tt-an,
1150
+ var(--_ctm-tab-dn-cn-wt-pe-tt-an, var(--_ctm-dn-cn-wt-pe-tt-an))
1151
+ );
808
1152
  }
809
1153
  }
810
1154
  }
@@ -871,8 +1215,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
871
1215
  }
872
1216
  }
873
1217
 
874
- background-color: var(--_sf-hr-bd-cr,
875
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-bd-cr));
1218
+ background-color: var(
1219
+ --_sf-hr-bd-cr,
1220
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-bd-cr)
1221
+ );
876
1222
 
877
1223
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-pg));
878
1224
  width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-wh));
@@ -880,29 +1226,44 @@ $resizeActive: '[data-cms-element-resizer="true"]';
880
1226
  flex-direction: var(--_sf-fd-bn);
881
1227
  align-items: center;
882
1228
 
883
- justify-content: var(--_sf-hr-at,
884
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-at));
1229
+ justify-content: var(
1230
+ --_sf-hr-at,
1231
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-at)
1232
+ );
885
1233
  gap: var(--_sf-hr-gp, prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-gp));
886
1234
 
887
- border-radius: var(--_sf-hr-br-rs,
888
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-br-rs));
889
-
890
- box-shadow: var(--_sf-hr-sw-ae,
891
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-sw-cr));
1235
+ border-radius: var(
1236
+ --_sf-hr-br-rs,
1237
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-br-rs)
1238
+ );
1239
+
1240
+ box-shadow: var(
1241
+ --_sf-hr-sw-ae,
1242
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-sw-ae)
1243
+ )
1244
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-sw-br))
1245
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-sw-sd))
1246
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-sw-cr));
892
1247
  width: 140px;
893
1248
  display: flex;
894
1249
  height: 48px;
895
1250
 
896
1251
  &[data-show-border="true"] {
897
1252
  // width: 100%;
898
- border-color: var(--_sf-hr-br-cr,
899
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-br-cr));
900
-
901
- border-style: var(--_sf-hr-br-se,
902
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-br-se));
903
-
904
- border-width: var(--_sf-hr-br-wh,
905
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-br-wh));
1253
+ border-color: var(
1254
+ --_sf-hr-br-cr,
1255
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-br-cr)
1256
+ );
1257
+
1258
+ border-style: var(
1259
+ --_sf-hr-br-se,
1260
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-br-se)
1261
+ );
1262
+
1263
+ border-width: var(
1264
+ --_sf-hr-br-wh,
1265
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-br-wh)
1266
+ );
906
1267
  }
907
1268
 
908
1269
  .txt {
@@ -910,36 +1271,56 @@ $resizeActive: '[data-cms-element-resizer="true"]';
910
1271
 
911
1272
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-cr));
912
1273
 
913
- font-family: var(--_sf-hr-ft-fy,
914
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-ft-fy));
915
- text-transform: var(--_sf-hr-tt-tm,
916
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-tt-tm));
917
- word-wrap: var(--_sf-hr-wd-wp,
918
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-wd-wp));
919
- word-break: var(--_sf-hr-wd-bk,
920
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-wd-bk));
1274
+ font-family: var(
1275
+ --_sf-hr-ft-fy,
1276
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-ft-fy)
1277
+ );
1278
+ text-transform: var(
1279
+ --_sf-hr-tt-tm,
1280
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-tt-tm)
1281
+ );
1282
+ word-wrap: var(
1283
+ --_sf-hr-wd-wp,
1284
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-wd-wp)
1285
+ );
1286
+ word-break: var(
1287
+ --_sf-hr-wd-bk,
1288
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-wd-bk)
1289
+ );
921
1290
  &.flex__overflow {
922
1291
  white-space: normal;
923
1292
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
924
1293
  }
925
1294
 
926
- font-size: var(--_sf-hr-ft-se,
927
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-ft-se));
1295
+ font-size: var(
1296
+ --_sf-hr-ft-se,
1297
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-ft-se)
1298
+ );
928
1299
 
929
- font-weight: var(--_sf-hr-ft-wt,
930
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-ft-wt));
1300
+ font-weight: var(
1301
+ --_sf-hr-ft-wt,
1302
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-ft-wt)
1303
+ );
931
1304
 
932
- font-style: var(--_sf-hr-ft-se-ic,
933
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-ft-se-ic));
1305
+ font-style: var(
1306
+ --_sf-hr-ft-se-ic,
1307
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-ft-se-ic)
1308
+ );
934
1309
 
935
- text-align: var(--_sf-hr-tt-an,
936
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-tt-an));
1310
+ text-align: var(
1311
+ --_sf-hr-tt-an,
1312
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-tt-an)
1313
+ );
937
1314
 
938
- letter-spacing: var(--_sf-hr-lr-sg,
939
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-lr-sg));
1315
+ letter-spacing: var(
1316
+ --_sf-hr-lr-sg,
1317
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-lr-sg)
1318
+ );
940
1319
 
941
- line-height: var(--_sf-hr-le-ht,
942
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-le-ht));
1320
+ line-height: var(
1321
+ --_sf-hr-le-ht,
1322
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-le-ht)
1323
+ );
943
1324
 
944
1325
  text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-dt-ue));
945
1326
  }
@@ -948,14 +1329,20 @@ $resizeActive: '[data-cms-element-resizer="true"]';
948
1329
  display: var(--_hover-show-icon, var(--_show-icon, flex));
949
1330
 
950
1331
  svg {
951
- width: var(--_sf-hr-in-se,
952
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-in-se));
953
- height: var(--_sf-hr-in-se,
954
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-in-se));
1332
+ width: var(
1333
+ --_sf-hr-in-se,
1334
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-in-se)
1335
+ );
1336
+ height: var(
1337
+ --_sf-hr-in-se,
1338
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-in-se)
1339
+ );
955
1340
 
956
1341
  path {
957
- stroke: var(--_sf-hr-in-c1,
958
- prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-in-c1));
1342
+ stroke: var(
1343
+ --_sf-hr-in-c1,
1344
+ prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-in-c1)
1345
+ );
959
1346
  // Overrides the stroke-width presentation attribute baked into the icon markup.
960
1347
  stroke-width: prepareMediaVariable(--_ctm-dn-as-re-bn-dt-se-se-wh, 1.25);
961
1348
  }
@@ -1129,4 +1516,4 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1129
1516
  // }
1130
1517
  // }
1131
1518
  // }
1132
- // }
1519
+ // }